body{overflow-x:hidden; width:100%;}
body,html,ul{padding:0; margin:0;}
p,h1,h2,h3,h4,li,span,a,b,label,input{font-family:"macha"; padding:0; margin:0;}
b{padding:0 !important;}
p{line-height:25px;}
button{cursor:pointer; text-align:center;}
a{text-decoration:none; text-align:center; color:#0676b3;}
ul{list-style:none;}
div.content-960{width:960px; height:100%; margin:auto; overflow-y:visible;}
.clear-btn{color:#0676b3; background:transparent; border:2px solid #0676b3;border-radius:3px;}
.clear-btn:hover{background:#0676b3; color:#fff !important;}
.outline-btn{color:#525252; border:2px solid #252525;border-radius:3px;}
/*.green-btn:hover{background:#fff; color:#34458b;}*/
.adelle{font-family:"adelle"; font-weight:700; letter-spacing:1px;}
/*----- header -----*/
div.header{position:fixed; z-index:999; top:0; left:0; width:100%; background:#fff; box-shadow:0 1px 1px rgba(0, 0, 0, 0.1);-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.1);}
div.header div.content-960{height:100px; width:1100px;}
div.header a{float:right; line-height:50px; margin:25px 0 0 12px; padding:0 10px; text-align:center; cursor:pointer; height:50px; font-size:18px;}
div.header ul{height:100%; float:right; margin:0 10px 0 0;}
div.header ul li{float:left; height:100%; padding:0 10px 0 0; display:block; line-height:100px; color:#000; font-size:26px;}
div.header ul li a{display:block; line-height:55px; color:#000; font-size:26px;}
div.header ul li a:hover{text-decoration:underline;}
div.header a.header-logo{display:block; height:90px; width:181px; float:left; margin:10px 0 0 0;}
div.header a.header-logo-mobile{display:none;}
/*----- above fold -----*/
div.above-fold{width:100%; min-height:715px; background:url('img/home-masthead-dark.jpg') center -450px no-repeat; background-size:100%;}
div.above-fold h1{padding:300px 0 15px 0; color:#fff; font-size:76px; font-weight:500; text-shadow:2px 2px 4px #000; width:600px; line-height:80px;}
div.above-fold h2{color:#fff; font-size:28px; width:475px; font-style:italic; margin:0 0 15px 0; font-weight:300; text-shadow:3px 3px 3px #000;}
div.above-fold form.cta{width:340px !important; padding:10px 20px; position:absolute; background:#fff; height:300px;border-radius:2px; margin:-60px 0 0 610px; box-shadow:0 2px 6px rgba(0, 0, 0, 0.2); -moz-box-shadow:0 2px 6px rgba(0, 0, 0, 0.2); -webkit-box-shadow:0 2px 6px rgba(0, 0, 0, 0.2);}
div.above-fold form.cta div.mktoOffset{display:none;}
div.above-fold form.cta h2{color:#525252; text-align:center; width:350px; margin:10px 0; text-shadow:none; font-size:23px;}
div.above-fold form.cta p{font-size:16px; width:290px; margin:0 auto 20px; text-align:center; line-height:18px;}
div.above-fold form.cta span.mktoButtonWrap{margin-left:120px !important;}
div.above-fold form.cta button[type="submit"]{float: right; margin: 0 0 0 12px; cursor: pointer; width:auto; height:auto; padding:10px 15px !important; background:#0676b3 !important; border:none !important; border-radius:3px; font-family:"adelle"; font-size:16px !important;}
form span.terms-link{position:absolute; margin:289px 0 0;}
/*----- content areas -----*/
div.content-area{clear:both; padding-bottom:60px;}
div.content-area-1, div.content-area-3{background:#fffff9;}
div.content-area-2{background:#0676b3;}
div.content-area h2{padding:75px 0 16px 0; display:block; font-size:50px; margin:0 0 45px 0; font-weight:100; line-height:38px; border-bottom:2px solid #525252 !important;}
div.content-area p{margin-bottom:30px; font-weight:500; font-size:24px; line-height:32px;}
div.content-area a.read-more{display:block; margin:70px auto 0; width:225px; height:50px; line-height:50px; font-size:24px;}
div.content-area-1 h2, div.content-area-3 h2{color:#525252;}
div.content-area-1 a.read-more:hover, div.content-area-3 a.read-more:hover{color:#e5e5e5;}
div.content-area-2 h2{color:#fff; border-bottom:2px solid #fff !important;}
div.content-area-2 p{color:#fff;}
div.content-area-2 a.read-more{color:#fff; border:1px solid #fff;}
div.content-area-2 a.read-more:hover{color:#34458b; background:#fff;}
div.content-area-2 form{float:left; margin:100px 40px 100px 0; width:340px;}
div.content-area-2 h2{margin:0 0 45px 380px;}
div.content-area-2 form h2{border-bottom:1px solid #fff !important; text-align:center; font-size:22px; margin:0 0 20px; padding:0 0 0;}
div.content-area-2 form p{text-align:center; line-height:18px; padding-left:20px; font-size:16px;font-weight:700;}
div.content-area-2 form input{padding:5px 2px;}
div.content-area-2 form button[type="submit"]{float: right; margin: 20px 0 0 12px; cursor: pointer; width:auto; height:auto; background:#ffffff!important; border:none !important; color:#0676b3 !important;border-radius:3px;font-family:"adelle";font-size:16px !important;padding:10px 15px !important;}
div.content-area-2 form span.mktoButtonWrap{margin-left:120px !important;}
/*----- full width imgs -----*/
div.full-width-img{width:100%; height:430px; background-attachment:fixed !important; background-size:cover !important;}
div.full-width-1{background:url('img/full-width-1.jpg') center 50px;}
div.full-width-2{background:url('img/full-width-2.jpg') center center;}
/*----- center cta -----*/
img.center-cta-img{margin:75px 0 50px -25px;}
div.center-cta{width:100%; height:130px; border-top:1px solid #0676b3; border-bottom:1px solid #0676b3; padding:25px 0; margin:0 0 100px 0;}
div.center-cta h3{text-align:center; color:#0676b3; padding:0 0 26px 0; font-size:36px; line-height:28px;}
div.center-cta p{display:block; width:750px; text-align:center; margin:auto; font-weight:700;}
div.center-cta span{margin:30px auto 0; display:block; border:28px solid #fff; border-top:none; width:160px; height:60px;}
div.center-cta a{display:block; color:#fff; background:#34458b; font-size:28px; line-height:60px; border:1px solid #0676b3;}
div.center-cta h2{font-size:36px; text-align:center; font-weight:bold; color:#0676b3;}
div.center-cta form{width:475px !important; margin:auto; overflow:hidden; margin-bottom:-10px;}
div.center-cta form div.mktoFormRow{width:100%; float:left; clear:none;}
div.center-cta form input{padding:5px 10px !important; width:100% !important; font-size:24px !important;}
div.center-cta form div.mktoButtonRow{width:100%; clear:none; padding:0;}
div.center-cta form span.mktoButtonWrap{margin:20px auto !important; background:#fff; width:112px;}
div.center-cta form button[type="submit"]{float: right; line-height: 40px; margin: 0 0 0 20px; padding: 0 20px !important; text-align: center; cursor: pointer; height: 40px; font-size: 20px !important; font-family:"adelle"; background-color: #0676b3 !important; color: #fff; background-image:none !important; border:2px solid #0676b3 !important;border-radius:3px;}
div.center-cta form button[type="submit"]:hover{color:#0676b3 !important; background:#fff !important;}
div.center-cta form div.mktoOffset, div.content-area-4 form div.mktoGutter{display:none;}
div.center-cta .mktoForm .mktoFieldWrap, div.center-cta .mktoForm .mktoFormCol{float:none !important;}
div.content-area-2 form span.terms-link{position:absolute; margin:265px 0 0 15px; color:#fff; z-index:10;}
div.content-area-2 form span.terms-link a{color:#fff; text-decoration:underline;}
/*----- footer -----*/
div.footer div.subscribe{width:50%; float:right;}
div.footer div.subscribe h2{text-align:right; font-size:18px;}
div.footer div.subscribe form{float:right;}
div.footer div.subscribe form div.mktoFormRow{float:left; clear:none; width:260px;}
div.footer div.subscribe form div.mktoButtonRow{clear:none; width:100px;}
div.footer div.subscribe form div.mktoButtonRow span{margin:0 !important; float:right;}
div.footer div.subscribe form div.mktoButtonRow span button{float: right; line-height: 36px; margin: 18px 0 0 12px; padding: 0 10px !important; text-align: center; cursor: pointer; height: 36px; font-size: 18px !important; font-family: "adelle"; background-image: none !important; background-color: transparent !important; border: 1px solid #fff !important; color: #fff;}
div.footer div.subscribe form input{width:100% !important; padding:10px;}
div.footer div.subscribe form .mktoFieldWrap, div.footer div.subscribe form .mktoFormCol{float:none !important;}
div.footer{height:100px; width:100%; background:#b3b3b3; padding:25px 0 0 0;}
div.footer ul{margin:0 auto 15px; width:50%; float:left; overflow:hidden;}
div.footer ul li{float:left; margin:0 12px 0 0; color:#fff; font-size:26px;}
div.footer ul li a{color:#fff; font-size:26px;}
div.footer ul li a:hover{text-decoration:underline;}
div.footer p{text-align:left; font-weight:700;}
div.footer div.mktoAsterix{display:none !important;}
/*----- cta-modal -----*/
div.cta-modal-container{width:100%; left:0; top:30%; position:fixed; display:none;}
div.cta-modal{width:450px; height:300px; margin:0 auto; background:#fff; position:relative; z-index:3; border-radius:10px;}
div.cta-modal h2{font-size:20px; text-align:center; line-height:35px;
border-bottom:1px solid #34458b; color:#34458b; margin-bottom:40px;}
div.cta-modal input{display:block; margin:20px auto 0; padding:6px 10px; width:280px;}
div.cta-modal-overlay{width:100%; height:100%; left:0; top:0; position:fixed; z-index:2; background:url('img/cta-modal-overlay.png'); cursor:pointer;}
button.cta-modal-submit{display:block; margin:20px auto; padding:10px 60px;}
/*----- SUBPAGES -----*/
/*----- free consultation page -----*/
body.free-consultation div.above-fold{background:url('img/free-consultation-bkg.jpg') no-repeat top center; overflow:hidden; background-size:auto 100%;}
body.free-consultation div.above-fold h1{padding:140px 0 0 0; width:auto; text-align:center; font-size:30px; color:#fff; text-shadow:none; font-weight:bold; text-shadow:2px 2px 0px #333;}
body.free-consultation div.above-fold h1 span{color:#ff5e00;}
body.free-consultation div.above-fold h2{padding:0 0 40px 0; width:auto; text-align:center; font-size:24px; color:#ff5e00; text-shadow:1px 1px 0px #222; font-style:normal; font-weight:bold;}
body.free-consultation div.above-fold div.form-container{width:400px; float:right;}
body.free-consultation div.above-fold div.form-container p{margin:0 0 20px 0; color:#343434; text-shadow: 1px 1px 14px #fff;}
body.free-consultation div.above-fold div.form-container p span{font-weight:bold;}
body.free-consultation div.above-fold div.form-container form{background:#fff; margin:auto; width:320px !important; padding:40px;}
body.free-consultation div.above-fold div.form-container form h3{text-align:left; font-weight:normal; font-size:18px; color:#3782d0;}
body.free-consultation div.above-fold div.form-container form p{position:absolute; color:#000; margin:381px 0 0 0; width:320px; text-align:center; font-size:16px; text-shadow:none;}
body.free-consultation div.above-fold div.form-container form input{width:320px !important; padding:12px 20px;}
body.free-consultation div.above-fold div.form-container form button[type="submit"]{background:#0676b3 !important; border: none !important; outline:none; width: 168px; height: 40px; font-family:"adelle"; font-size:16px;border-radius:3px;}
body.free-consultation div.above-fold div.form-container form button[type="submit"]:hover{border:none; outline:none;}
body.free-consultation div.above-fold div.form-container form div.mktoButtonRow{margin:20px 0 0 !important;}
body.free-consultation div.above-fold div.form-container form span.mktoButtonWrap{margin:0 0 0 80px !important;}
body.free-consultation div.above-fold div.form-container form div.mktoAsterix, body.free-consultation div.above-fold div.form-container form div.mktoOffset{display:none;}
/*----- about page -----*/
body.about div.above-fold{background:url('http://knowyourretirement.com/img/about-bkg.jpg') top center; overflow:hidden; background-size:auto 100%;}
body.about div.above-fold h2{color:#0676b3; font-size:30px; text-shadow:none; font-weight:bold; margin:160px 0 40px;}
body.about div.above-fold p{width:500px; margin:0 0 20px;}
/*----- terms page -----*/
body.terms h1{margin:150px 0 20px; text-align:center;}
body.terms p{margin:0 0 20px;}
body.terms div.content-960{padding: 0 0 100px !important;}
body.terms div.footer div.content-960, body.terms div.header div.content-960{padding:0 !important;}
/*----- MEDIA QUERIES -----*/
@media (max-width: 1800px) {
div.above-fold{background-position:center -250px;}
}
@media (max-width: 1600px) {
button.top-login{right:318px; position:absolute;}
}
@media (max-width: 1500px) {
div.above-fold{background-position:center -100px;}
}
@media (max-width: 1300px) {
div.above-fold{background-position:center 0;}
}
@media (max-width: 1150px) {
div.header div.content-960{width:100%; width:calc(100% - 40px); height:auto; padding:0 20px; overflow:hidden;}
div.header ul{margin:0;}
div.above-fold{background-position:center 0; background-size:130%;}
div.header{width:100%;}
}
@media (max-width: 1000px){
img.center-cta-img{content:url('img/center-cta-img-mobile-2.png'); width:280px; height:121px; margin:40px auto; display:block;}
div.content-960{width:100%; width:calc(100% - 40px); padding:0 20px;}
.mktoForm .mktoFieldWrap, .mktoForm .mktoFormCol{float:none !important;}
div.above-fold form.cta{position:relative; margin:auto;}
div.above-fold{background-size:155%;}
}
@media (max-width: 860px) {
div.header a.header-logo-mobile{display:block; width:200px; height:81px; margin:10px auto 15px; float:none;}
div.header a.header-logo-mobile img{width:100%;}
div.header a.header-logo{display:none;}
div.header-btn-container button.outline-btn, div.header-btn-container a.outline-btn{margin:0 0 25px; float:right;}
div.header ul{float:left;}
div.above-fold{background-size:203%;}
div.header ul li{float:none !important; padding:0 !important;}
div.header ul li a{margin:5px auto 20px; display:block; float:none;}
body.free-consultation div.above-fold h1{padding:200px 0 0;}
body.about div.above-fold h1{padding:183px 0 0;}
body.terms h1{margin:200px 0 20px;}
}
@media (max-width: 750px) {
div.header-btn-container{width:240px; margin:auto; overflow:hidden;}
div.header-btn-container button.outline-btn, div.header-btn-container a.outline-btn{margin:25px 0 0; float:left;padding:0 15px;font-size:16px;}
div.header ul{float:none; margin:auto; width:390px;}
div.header ul li{height:65px; line-height:65px;}
div.header ul li a{line-height:63px;}
div.header ul li img{margin-top:-19px;}
div.above-fold button.top-login{display:none;}
div.above-fold div.content-960{padding-top:20px;}
div.above-fold a.top-logo{margin:auto; float:none; width:280px; background:url('img/top-logo-mobile.png') no-repeat;}
div.above-fold h1{padding:50px 0 15px 0; width:100%; font-size:54px; line-height:56px;}
div.above-fold h2{width:100%;}
div.header button{margin:10px 0 0 0 !important;}
div.above-fold{margin-top:225px;}
div.center-cta p{width:100%;}
div.footer ul li a{font-size:16px;}
div.footer ul{width:100%;}
div.center-cta{height:auto;}
div.center-cta span{border-bottom:none;}
div.header ul{width:190px;}
div.header ul li.last{padding:0;}
div.above-fold form.cta{position:relative;}
body.free-consultation div.above-fold h1{padding:20px 0 0;}
body.free-consultation div.above-fold div.form-container{width:100%; float:none;}
body.free-consultation div.above-fold div.form-container form{width:325px !important;}
body.about div.above-fold h1{padding:28px 0 0;}
body.terms h1{margin:300px 0 20px;}
}
@media (max-width: 650px) {
div.above-fold{background-size:367%;}
div.above-fold h1{font-size:32px;}
body.home div.above-fold h2{font-size:32px; font-size: 22px;padding-right: 20px; display: block; width: calc(100% - 40px);}
div.content-area h2{font-size:24px; padding:40px 0 0;}
body.about div.above-fold h1{line-height:75px; height:75px; font-size:26px;}
body.about div.above-fold h2{max-width:100%;}
body.about div.above-fold p{max-width:100%;}
#mktoForm_1148 { height:auto !important; }
div.above-fold form.cta button[type="submit"] { margin:0 0 35px 0; }
form span.terms-link { margin:320px 0 0 0; }
}
@media (max-width:500px) {
form span.terms-link { margin:370px 0 0 0; }
}
@media (max-width:480px) {
body.free-consultation div.above-fold div.form-container form { width:100% !important; padding:30px 40px 70px !important; }
body.free-consultation div.above-fold div.form-container form p { margin:315px 0 0 0 !important; }
body.free-consultation div.above-fold div.form-container form input { width:100% !important; }
}
@media (max-width: 400px) {
div.header ul{width:185px;}
div.header ul li a{font-size:24px;}
div.header ul li.last{padding:0;}
body div.full-width-img{background-attachment:initial !important; min-height:430px; background-position:center 0 !important;}
body div.above-fold{background-attachment:initial !important; min-height:430px; background-position:center 0 !important;}
div.footer ul li{margin:0 8px 0 0;}
div.footer ul li img{display:none;}
div.footer ul li.last{margin:0;}
body.home div.above-fold{background-size:auto 100%;}
body.free-consultation div.above-fold div.form-container form{padding:20px 10px;}
body.free-consultation div.above-fold div.form-container form input{ margin:auto; display:block; float:none;}
body.free-consultation div.above-fold div.form-container form div.mktoButtonRow{width:245px !important;}
body.free-consultation div.above-fold div.form-container form button[type="submit"]{width:100%;}
body.free-consultation div.above-fold h1{font-size:20px; line-height:24px;}
body.free-consultation div.above-fold h2{font-size: 16px;margin: 20px 0; padding: 0;}
body.free-consultation div.above-fold div.form-container form div.mktoButtonRow{margin:auto !important; display:block;}
body.free-consultation div.above-fold div.form-container form h3{font-size:14px; text-align:center;}
body.about div.above-fold h1{font-size:18px;}
body.about div.above-fold h2{margin:20px 0 0;}
body.about div.above-fold{height:auto !important;}
.mktoButtonRow{display:block !important;}
#mktoForm_1148 span.mktoButtonWrap{margin:auto; display:block; width:100%; margin-left:auto !important;text-align:center;}
div.above-fold form.cta{height:auto !important;}
body.free-consultation div.above-fold div.form-container form p { margin:285px 0 0 0 !important; width:70% !important; text-align:left !important; }
body.free-consultation div.above-fold div.form-container form span.mktoButtonWrap { margin:0 0 0 0 !important; }
body.free-consultation div.above-fold div.form-container form div.mktoButtonRow { width:100% !important; }
}
/*--BODY FADE IN CSS---*/
body { -webkit-animation-name: fade-in; -webkit-animation-duration: 1s; -moz-animation-name: fade-in; -moz-animation-duration: 1s; }
@-webkit-keyframes fade-in { 0% { opacity: 0; } 50% { opacity: 0; } 100% { opacity: 1; } }
@-moz-keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }