@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,700;1,400;1,700&family=Oswald:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Sarina&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bevan&display=swap');

*{padding:0; margin:0; box-sizing: border-box;}

body {font-family: 'Lora', serif; font-weight:400; font-size: 18px; color:#111; line-height:normal; 
background:#fff url(images/top-bg.png) left top repeat-x; overflow-x: hidden;}
    
a{color:#166d04; text-decoration:underline}
a:hover{color:#135e04; text-decoration: none; }
a:focus{outline:none}
img{max-width:100%}

.main-wrapper{padding-bottom: 120px; border-bottom: #333 2px dashed; margin-bottom: 5px;}
.container{max-width: 760px; padding:0 40px; margin: 0 auto; padding-top: 10px;  }


header{max-width: 750px; padding:0; margin: 0 auto; padding:40px 40px 0; text-align: center; }
header .logo img{width: 335px; max-width: 80%;}
header::after{border-bottom: #333 2px dashed; content: ""; width: 100%; height: 2px; display: block; margin-top: 30px;}

.content h1{font-size:30px; font-weight:700; margin-top: 30px; margin-bottom: 20px;}
.content h2{font-size:30px; font-weight:700; margin-top:40px; margin-bottom: 20px;}
.content h4{font-size:22px; font-weight:700; font-style: italic; margin-bottom: 20px; }
.content h6{font-size:20px; font-weight:700; margin-top:20px; margin-bottom: 20px;}
.content p{line-height: 28px; margin-bottom: 25px;}
.content p span{font-weight: 700; font-style: italic;}
.content p.intro::first-letter{font-size: 60px; font-weight: 700; float: left; margin-top: 7px; margin-right: 4px;}
.content ul {margin-left: 45px;}
.content ul li{padding-left: 5px; margin-bottom: 15px; line-height: 28px;}
.content ul li:last-child{margin-bottom: 0;}
mark{background: url(images/bg-maker-yellow.png) left top no-repeat; background-size: 100% 100%; padding: 3px 10px; }

.quote{padding-left: 95px; position: relative;}
.quote p:first-child:before{position: absolute; top:75px; left: -14px; font-size: 200px;  font-weight:700; font-style: italic; color: #e9e9e9;  content: open-quote;}

.content blockquote{border-left: #ffc446 6px solid; padding: 15px 25px 1px; font-size: 20px; font-weight: 700; font-style: italic; line-height: 30px;}
blockquote + p{padding-top: 25px;}
p + .btn{margin-top: 70px;}

.author-block{display:block; padding-top: 20px; padding-bottom: 70px;}
.author-block .author-img{width: 130px; height: 105px; margin-left: 65px; position: relative;}
.author-block .author-img:after{width: 130px; height: 125px; position: absolute; right: 20px; top:-12px; z-index: 1; background: url(images/img-bg.png) right top no-repeat; background-size: 100%;  content: "";}
.author-block .author-img img{width: 95px; height: 95px; border-radius: 100%; position: relative; z-index: 3;}
.author-block .author-name{font-family: 'Sarina', cursive; font-size: 28px; text-align: left; margin-top: 8px;}

.btn{display:inline-block; position: relative; font-family: 'Oswald', sans-serif; color: #fff; 
    background-color: #166d04; font-size: 16px; font-weight: 700; text-transform: uppercase; text-decoration: none; 
    padding: 12px 60px 12px 30px; letter-spacing: 2px; box-shadow: rgba(0,0,0,.3) 1px 1px 7px}
.btn:hover{background: #135e04; color: #fff;}
.btn:after{content:''; border-style: solid; border-width: 5px 0 5px 5px; border-color: transparent transparent transparent #fff; 
width: 0; height: 0; position: absolute; top: 50%; margin-top: -5px; right: 25px}
.btn:before {content: ""; width: 20px; height: 1px; background: #fff; position: absolute; top: 50%; margin-top: -1px;
right: 30px; transition: all 0.3s ease;}
.btn-block{display: block; text-align: center; font-size: 24px; padding-right: 30px;}
.btn-block:before, a.btn-block:after{display: none;}


.guide-list-holder .list{display: block; margin-bottom: 20px;}
.guide-list-holder .list .icon{width:55px; float: left; margin-right: 15px;}
.guide-list-holder .list .icon img{width: 100%}
.guide-list-holder .list .info{overflow: hidden;}
.guide-list-holder .list h3{font-size:24px; font-weight:700; color: #166d04; margin-top: 8px; margin-bottom:8px; overflow: hidden;}
.guide-list-holder .list p{margin-bottom: 0;}
.guide-list-holder .list:last-child{margin-bottom: 80px;}

.testimonial-holder{display: block; margin-top: 80px; margin-bottom: 80px; position: relative;}
.testimonial-holder .testimonials{background: #f4f4f4 url(images/testimonial-bg.png) left top repeat-y; padding: 50px 80px; margin-bottom: 40px; position: relative; quotes: '\201c' '\201d'; }
.testimonial-holder .testimonials p{font-style: italic; font-weight: 400; line-height: 40px; background: url(images/testimony-txt-bg.png) left -4px repeat; padding-left: 14px; padding-right: 14px;}
.testimonial-holder .testimonials:after{position: absolute; bottom:-80px; right: 25px; font-size: 145px;  font-weight:700; font-style: italic; color: #e9e9e9; content: '\201D'}
.testimonial-holder .testimonials .author .pic{width: 60px; height: 60px; float: left; margin-right: 10px; border-radius: 100%; border: #d4d4d4 4px solid;}
.testimonial-holder .testimonials .author .pic img{width: 100%; height: 100%; border-radius: 100%;}
.testimonial-holder .testimonials .author .info{margin-top: 7px; display: inline-block;}
.testimonial-holder .testimonials .author .name{font-size: 15px; font-weight: 700; margin-bottom: 5px;}
.testimonial-holder .testimonials .author .location{font-size: 13px}

.offerBox{display: block; margin-top: 40px; margin-left: -10px;}
.offerBox:before{width:100%; height: 50px; display: block;  background: url(images/offerBox-topbg.png) left top no-repeat; background-size: 100% 100%; content: "";}
.offerBox .bottom{width:100%; height: 150px; background: url(images/offerBox-bottombg.png) left top no-repeat; background-size: 100%;}
.offerBox .wrapper{width:100%; display: flex; position: relative;  background: url(images/offerBox-bg.png) left top repeat-y; background-size: 100%; }
.offerBox .pic{width:200px; margin-top: 25px; position: absolute; right: 65px; z-index: 1;}
.offerBox .content{padding-left: 60px;}
.offerBox h2{width:100%; font-family: 'Bevan', cursive; font-size: 38px; text-transform: uppercase; margin: 0 0 10px; position: relative;}
.offerBox h2:after{background: url(images/curve-arrow.png) no-repeat; background-size:100%; position: absolute; top: 25px; right: -55px; z-index: 2; width: 46px; height: 30px; content: ""; }
.offerBox ul{margin-left: 0;}
.offerBox ul li{font-size: 24px; font-weight: 700; list-style-type: none; margin-bottom: 9px; position: relative;}
.offerBox ul li mark{margin-left: -10px;}
span.bonus{position: absolute; right: -20px; top:-35px; z-index: 2;}
span.bonus img{width: 65px;}

footer{background: #333 url(images/footer-logo.png) center bottom no-repeat; background-size: 260px auto; position: relative; text-align: center; font-size: 14px; color: #b0b0b0; padding-top: 40px; padding-bottom: 130px; }
footer ul.link{padding-bottom: 10px;}
footer ul.link li{display: inline-block; padding-left: 16px; padding-right: 16px;}
footer ul.link li a{color: #fff; text-decoration: none;} 
footer ul.link li a:hover{color: #b0b0b0;}
footer p a{ color: #b0b0b0}

.modal{position: fixed;  z-index: 5; padding-top: 80px; left: 0; top: 0; width: 100%; height: 100%; 
overflow: auto; background-color: rgba(0,0,0,0.7); display: none; }

.popupBox{width: 630px; max-width: 85%; margin: auto; position:relative}
.popupcontent{width: 100%; float: left; padding: 30px; background-color: #fff; border: 10px solid #ffcc33; }
.popupBox .title{font-family: 'Bevan', cursive; font-size: 24px; text-transform: uppercase; border-bottom: #333 2px dashed; margin-bottom: 25px;}
.popupBox .formHolder{width:100%; float: left;  border-bottom: #333 2px dashed; padding-bottom: 25px; margin-bottom: 25px;}
.popupBox .txtbox{width: 100%; height: 35px; font-family: 'Lora', serif; font-size: 14px; background: #f6f6f6; border: #b4b4b4 1px solid; margin-bottom: 10px; padding-left: 8px;}
.popupBox .txtbox:last-child{}
.popupBox .txtbox:focus{ outline:none; border: #111 1px solid;}
.popupBox select.txtbox {outline: 0;  color: #737373; cursor: pointer; position: relative; margin-right: 0;} 
.popupBox select.txtbox  option{margin-top: 30px; color: #737373; }
.popupBox .checkboxHolder{width: 100%; float: left; padding-left: 20px; margin-top: 10px; margin-bottom: 20px; font-size: 14px; line-height: 22px; position: relative;}
.popupBox .checkboxHolder a{color: #111;}
.popupBox .checkboxHolder input[type='checkbox']{position: absolute; left: 0; top:5px; cursor: pointer;} 
.popupBox .btn-block{font-size: 15px; width: 100%; padding-top: 8px; padding-bottom: 8px; cursor: pointer; border: 0;}
.popupBox .testimonial-holder{float: left; margin: 0;}
.popupBox .testimonial-holder .testimonials{margin-bottom: 10px; padding: 25px 25px 40px 60px;}
.popupBox .testimonial-holder .testimonials p{font-size: 16px; margin-bottom: 20px;}
.close {color: #333; font-size: 20px; line-height: 17px; padding-left: 4px; font-weight: bold; position: absolute; top:20px; right: 20px; width: 20px; height: 20px; background: #ddd; border: #d9d9d9 1px solid; border-radius: 100%; text-decoration: none;}
.close:hover, .close:focus {color: #000; text-decoration: none; cursor: pointer;}
a.close-modal{display: none;}



@media only screen and (max-width: 767px) {
.offerBox h2{font-size: 30px;}
.offerBox h2:after{right: -40px;}
.offerBox .content{padding-left: 40px;}
.offerBox ul li{font-size: 22px;}
span.bonus{right: -50px;}
}

@media only screen and (max-width: 725px) {
.offerBox .pic {right: 40px; width: 30%;}  
}

@media only screen and (max-width: 600px) {
.offerBox .pic {right: 40px; width: 22%;}  
.popupBox .title{padding-right: 40px;}
 }


@media only screen and (max-width: 576px) {
.main-wrapper{padding-bottom: 60px;}
.author-block{padding-bottom: 30px;}
.container, header{padding-left: 20px; padding-right: 20px;}
.container{padding-top: 0;}
.quote p:first-child:before{top:45px; font-size: 140px;}
.quote{padding-left: 55px;}
footer ul.link li{padding-left: 8px; padding-right: 8px;}
.content p.intro::first-letter{margin-top: 13px}
.testimonial-holder .testimonials{padding: 30px 40px 60px 60px;}
span.bonus{right: -40px;}
.offerBox .bottom{height: 120px;}
.testimonial-holder .testimonials .author .info{display: inline;}
.testimonial-holder .testimonials:after{font-size: 120px; bottom: -65px;}
.offerBox h2{font-size: 26px;}
.offerBox ul li{font-size: 22px;}
.offerBox h2:after{right: 5px; top: 19px}
.offerBox{margin-left: 0;}
.offerBox::before{height: 30px;}
.offerBox .pic {width: 25%; top: 20px; right: 50px;}
.offerBox .content {padding-top:15px; padding-left: 40px;} 
a.btn-block{font-size: 20px;} 
.popupBox .title{line-height: 34px;}
.popupBox .testimonial-holder .testimonials{padding-bottom: 80px;}
}

@media only screen and (max-width:460px) {
.offerBox h2::after{right: -6px;}
.offerBox ul li{font-size: 16px;} 
.offerBox h2:after{right: -55px; top:14px}
.content h6{font-size: 18px;}
span.bonus{right: -18px; top: -32px;}
span.bonus img{width: 45px;}
.offerBox .bottom{height: 90px;}
.guide-list-holder .list .icon{margin-top: 10px; margin-right: 10px;}
.popupBox{max-width: 90%}
.popupcontent{padding: 15px;}
.offerBox ul li{margin-bottom: 0;}
.offerBox .pic {right: 45px; top:35px}

}

@media only screen and (max-width:420px) {
.testimonial-holder .testimonials .author .pic{margin-bottom: 40px;}
.offerBox .pic {width: 26%; right: 20px;}
.offerBox .content {padding-top:5px;}
.offerBox h2{font-size: 22px;}
.offerBox h2:after{right: -30px;}
}

@media only screen and (max-width:360px) { 
.offerBox h2{font-size: 18px; margin-bottom: 5px;} 
.offerBox ul li{font-size: 14px;}
.offerBox:before{height: 22px;}
.offerBox .pic {width: 22%} 
.testimonial-holder .testimonials, .popupBox .testimonial-holder .testimonials{padding-left: 45px; }
.offerBox .content{padding-left: 30px;}

}

.about {
    color: #ffffff;
    margin-top: 40px;
    margin-bottom: 80px;

}
.about-header {
    font-family: 'Oswald', sans-serif;
}


.spinner {
    font-size: 16px;
    margin: 100px auto;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: relative;
    text-indent: -9999em;
    -webkit-animation: load4 1.3s infinite linear;
    animation: load4 1.3s infinite linear;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  
  @-webkit-keyframes load4 {
    0%,
    100% {
      -webkit-box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
              box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }
    12.5% {
      -webkit-box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }
    25% {
      -webkit-box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }
    37.5% {
      -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    50% {
      -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    62.5% {
      -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }
    75% {
      -webkit-box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
              box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }
    87.5% {
      -webkit-box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
              box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
  }
  
  @keyframes load4 {
    0%,
    100% {
      -webkit-box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
              box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
    }
    12.5% {
      -webkit-box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }
    25% {
      -webkit-box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
    }
    37.5% {
      -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    50% {
      -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    62.5% {
      -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
              box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }
    75% {
      -webkit-box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
              box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }
    87.5% {
      -webkit-box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
              box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
  }