.borderBox { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ }

/* ========================================================================== Helper classes ========================================================================== */
.ir { background-color: transparent; border: 0; overflow: hidden; *text-indent: -9999px; }

.ir:before { content: ""; display: block; width: 0; height: 150%; }

.hidden { display: none !important; visibility: hidden; }

.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

.invisible { visibility: hidden; }

.clearfix:before, .clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }

.clearfix { *zoom: 1; }

/* ADDS A BROWSER PREFIX TO THE PROPERTY */
/* BACKGROUND GRADIENT */
/* BACKGROUND RADIAL */
/* BACKGROUND SIZE */
/* BACKGROUND COLOR OPACITY */
/* BORDER RADIUS */
/* TEXT SHADOW */
/* KEYFRAMES */
/* ANIMATION */
.header .feature { position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

html, body { font-family: "Lato", Arial, sans-serif; background: #FFF; }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: "Lato", Arial, sans-serif; font-weight: 300; color: #464f52; }

ul { list-style: none; margin: 0; padding: 0; }

.container { width: 1000px; margin: 0 auto; position: relative; overflow: auto; }
@media only screen and (max-width: 1000px) { .container { width: 900px; } }
@media only screen and (max-width: 900px) { .container { width: 800px; } }
@media only screen and (max-width: 800px) { .container { width: 700px; } }
@media only screen and (max-width: 700px) { .container { width: 600px; } }
@media only screen and (max-width: 600px) { .container { width: 500px; } }
@media only screen and (max-width: 500px) { .container { width: 400px; } }
@media only screen and (max-width: 400px) { .container { width: 100%; } }

.full { width: 100%; }

.pin-b { position: absolute; bottom: 0; overflow: inherit; }
@media only screen and (max-width: 800px) { .pin-b { position: relative; } }

.pin-t { position: absolute; top: 0; overflow: inherit; }
@media only screen and (max-width: 800px) { .pin-t { position: relative; } }

.header { background: url(../images/ptrx-header.jpg) 50% 0 no-repeat; background-size: 100%; height: 595px; position: relative; border-top: 5px solid #e4c954; }
@media only screen and (min-width: 1200px) { .header { background-position: 50% 80%; } }
@media only screen and (max-width: 800px) { .header { height: auto; } }
@media only screen and (max-width: 700px) { .header { background-size: 150%; background-position: 50% -30%; } }
@media only screen and (max-width: 600px) { .header { background-position: 50% -10%; } }
@media only screen and (max-width: 500px) { .header { background-position: 50% 0%; } }
@media only screen and (max-width: 430px) { .header { background-size: 180%; } }
.header form { position: absolute; right: 0; top: 21px; }
@media only screen and (max-width: 430px) { .header form { right: 5%; } }
.header form input { -webkit-border-radius: 3px; -khtml-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
.header form input[type='text'] { font-size: 12px; padding: 8px 12px; border: 0; }
.header form input[type='submit'] { text-transform: uppercase; font-size: 10px; padding: 9px 10px; border: 0; background: #7ac1bf; color: white; margin-left: 3px; }
.header .bg-img { height: 595px; }
@media only screen and (max-width: 800px) { .header .bg-img { height: 400px; } }
.header a.logo { width: 70px; height: 70px; position: absolute; top: 20px; left: 20px; z-index: 1; }
@media only screen and (max-width: 430px) { .header a.logo { width: 50px; height: 50px; } }
.header a.logo img { width: 100%; }
.header h1, .header h2, .header h3 { padding: 0; margin: 0; }
.header .feature { z-index: 2; overflow: auto; top: 42%; }
@media only screen and (max-width: 800px) { .header .feature { top: 55%; } }
@media only screen and (max-width: 430px) { .header .feature { top: 45%; width: 96%; } }
.header .feature h1 { color: white; margin: 0 auto; width: 75%; text-align: center; font-size: 38px; text-shadow: 0 0 5px rgba(0, 0, 0, 0.4); }
@media only screen and (max-width: 600px) { .header .feature h1 { font-size: 30px; } }
@media only screen and (max-width: 500px) { .header .feature h1 { font-size: 25px; width: 90%; } }
.header .feature h2 { color: white; font-size: 11px; margin: 0 auto; padding-top: 27px; text-align: center; font-size: 18px; width: 40%; text-shadow: 0 0 5px rgba(0, 0, 0, 0.4); }
@media only screen and (max-width: 600px) { .header .feature h2 { width: 100%; } }
.header .feature a.cta { background: #8cb253; color: white; text-decoration: none; padding: 15px 22px; margin: 30px auto 0; width: 265px; display: block; text-align: center; -webkit-border-radius: 3px; -khtml-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; z-index: 1; }
.header ul { margin: 0; padding: 0; overflow: auto; position: absolute; bottom: 0; background: white; filter: alpha(opactiy=90); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; -moz-opacity: 0.9; -khtml-opacity: 0.9; opacity: 0.9; zoom: 1; }
@media only screen and (max-width: 1060px) { .header ul { filter: alpha(opactiy=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; zoom: 1; } }
@media only screen and (max-width: 800px) { .header ul { position: relative; } }
.header ul li { width: 27%; float: left; overflow: auto; background: white; padding: 30px; }
@media only screen and (max-width: 950px) { .header ul li { padding: 30px 25px; } }
@media only screen and (max-width: 800px) { .header ul li { width: 92%; padding: 20px 25px 0px; } }
@media only screen and (max-width: 600px) { .header ul li { width: 85%; } }
.header ul li a { display: block; overflow: auto; }
.header ul li a img { float: left; width: 18%; height: 18%; }
.header ul li a h3 { float: left; width: 72%; padding-left: 23px; font-size: 14px; }
@media only screen and (max-width: 1000px) { .header ul li a h3 { padding-left: 15px; } }
.header ul li a h3 strong { text-transform: uppercase; font-weight: 700; display: block; font-size: 12px; padding-bottom: 5px; }
@media only screen and (max-width: 800px) { .header ul li:last-child { padding-bottom: 20px; } }

@media only screen and (max-width: 430px) { .content { width: 90%; padding: 0 5%; } }
.content .feature-callout { width: 65%; float: left; }
.content .feature-callout img { width: 100%; }
@media only screen and (max-width: 600px) { .content .feature-callout { width: 100%; float: none; } }
.content .provider-login { width: 27%; float: left; margin-left: 40px; }
@media only screen and (max-width: 900px) { .content .provider-login { width: 25%; } }
@media only screen and (max-width: 800px) { .content .provider-login { width: 20%; } }
@media only screen and (max-width: 600px) { .content .provider-login { width: 90%; float: none; margin-left: 0; } }
.content .provider-login form .remember { margin-bottom: 0px; }
.content .provider-login form .remember label { font-size: 12px; color: #b6b4a5; }
.content .provider-login form input[type='text'], .content .provider-login form input[type='password'] { padding: 9px 15px; margin-bottom: 7px; font-size: 13px; width: 100%; -webkit-border-radius: 2px; -khtml-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; border: solid 1px #d0d0d0; }
@media only screen and (max-width: 400px) { .content .provider-login form input[type='text'], .content .provider-login form input[type='password'] { width: 97%; } }
.content .provider-login form input[type='submit'] { text-transform: uppercase; background: #ef8369; border: 0; padding: 7px 16px; font-size: 12px; color: white; -webkit-border-radius: 2px; -khtml-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; }
@media only screen and (max-width: 800px) { .content .provider-login form input[type='submit'] { margin-left: 0; } }
.content .provider-login form a { font-size: 11px; color: #7ac1bf; }

.footer { color: #383732; background: #b6b4a5; font-size: 11px; padding: 20px 0px; margin: 20px 0 0; }
@media only screen and (max-width: 400px) { .footer { padding: 0 2% 3%; } }
.footer a { color: #383732; text-decoration: none; }
.footer a:hover { text-decoration: underline; }
.footer ul { float: left; }
@media only screen and (max-width: 400px) { .footer ul { margin-top: 10px; margin-bottom: 10px; } }
.footer ul li { display: inline; padding-right: 15px; padding-left: 15px; border-left: 1px solid #383732; }
@media only screen and (max-width: 800px) { .footer ul li { display: list-item; border: none; padding: 0; } }
.footer ul li:first-child { padding-left: 0; border-left: none; }
.footer span { float: right; display: inline-block; }
@media only screen and (max-width: 400px) { .footer span { float: left; padding: 5px 0; } }
.footer h5 { font-size: 11px; display: inline-block; margin: 0; margin-left: 40px; font-weight: 400; }
@media only screen and (max-width: 960px) { .footer h5 { width: 220px; } }
@media only screen and (max-width: 400px) { .footer h5 { margin-left: 0; width: 100%; } }
.footer h5 span { text-indent: -100000px; background: url(../images/powered.png) 0 0 no-repeat; width: 222px; background-size: 100%; margin-left: 7px; margin-top: 0px; }
@media only screen and (max-width: 400px) { .footer h5 span { margin-left: 0; float: none; display: block; } }
.footer h5 span a { text-decoration: none; display: block; overflow: auto; }

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { .footer li { display: list-item; border: none; padding-left: 0; line-height: 22px; font-size: 14px; }
  .footer span { width: 15%; } }
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (max-width: 400px) { .footer span { width: 100%; } }

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { .iam-logo { width: 40%; margin-left: 10px; } }
/* Desktops and laptops ----------- */
@media only screen and (min-width: 1124px) { .iam-logo { width: 17%; } }
/* iPads (portrait) ----------- */
/* iPads (landscape) ----------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) { .iam-logo { width: 21%; } }
