@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,200italic,300,300italic,400,400italic,600,600italic,700,700italic,900,900italic);


/* ## RESETS ## */
.block, .container, .row, .row.block { margin: 0; padding: 0; }

a[href^="tel"]{ color:inherit; text-decoration:none; }


/* ## GENERAL ## */
body { color: #FFF; font-family: 'Source Sans Pro', sans-serif; font-weight: 400; }
body.noScroll { overflow: hidden !important; }

h1.h1 { margin: 0;padding: 0;font-weight: 200;line-height: 36px;font-size: 28px;}
h1.h1 b {display: block;margin: 15px 0 0 0; font-weight: 700;font-size: 36px;}
h1.h1:after{background: #FFF;display: block;content:'';height: 1px;margin: 30px 0 50px 0;position:relative;width: 30px;}

p { margin: 0 0 50px 0;font-size: 16px;line-height: 31px;}

.btn-primary {background: transparent;border: 2px solid #FFF;border-radius: 5px; color: #FFF; display:inline-block !important; font-size: 14px;font-weight: 700;letter-spacing: 2px;line-height: 14px;padding: 20px 40px;text-transform: uppercase;transition: .25s;}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus { background: #FFF; border: 2px solid #FFF; color: #545f67; outline: none; }

a:link, a:visited, a:hover, a:active { color: #FFF; font-weight: 800; }

@media only screen and (max-width:1366px) {
	p { font-size: 15px; line-height: 29px; }
}

@media only screen and (max-width:1200px) {
	p { font-size: 14px; line-height: 27px; }
}

@media only screen and (max-width:991px) {
    .fp-section, .fp-slides { height: inherit !important; }
    .fp-slidesContainer, .fp-slide, .fp-section.fp-table, .fp-slide.fp-table { display: block !important; float: none !important; margin: 0 !important; width: 100% !important; }
    .fp-tableCell { display: block !important; height: inherit !important; width: 100% !important; }  

    h1.h1:after{margin: 30px 0; }
    p {font-size: 16px;line-height: 31px; margin: 0 0 30px 0; } 
    .btn-primary {display: block !important;width: 100%;}
}


/* ## HEADER ## */
#header {position: fixed;width: 100%;z-index: 999;padding: 60px;}

#header .midnightInner {padding: 60px; }

#header .midnightInner .logo {display: table;height: 58px;text-align: left;}
#header .midnightInner .logo div { display: table-cell; vertical-align: middle;}
#header .midnightInner .logo div a { background: url(https://blueprint.cdn.cloud.searchoptics.net/adce40d19da737e438539b66c93ba4be/logo_sprite.png) no-repeat; display: block; height: 29px; width: 200px; }

#header .midnightHeader.gray .logo div a,
#header .midnightHeader.orange .logo div a { background-position: 0 0; }
#header .midnightHeader.light .logo div a { background-position: 0 -50px; }

#header .signUp, #header .midnightInner .signUp { text-align: right; }

#header .midnightHeader.gray .signUp .btn-primary.btn-primary,
#header .midnightHeader.orange .signUp .btn-primary.btn-primary { border: 2px solid #FFF; color: #FFF; }
#header .midnightHeader.gray .signUp .btn-primary:hover { background: #FFF; color: #545f67; }
#header .midnightHeader.orange .signUp .btn-primary:hover { background: #FFF; color: #f47937; }
#header .midnightHeader.light .signUp .btn-primary { border: 2px solid #f47937; color: #f47937; }
#header .midnightHeader.light .signUp .btn-primary:hover { background: #f47937;color: #FFF; }

@media only screen and (max-width: 1024px) {
    #header {padding: 60px;position: absolute !important;}
    #header .midnightInner {padding: 60px; }
    #header .midnightInner .logo { height: 29px; }
    #header .logo div a { background: url(https://blueprint.cdn.cloud.searchoptics.net/adce40d19da737e438539b66c93ba4be/logo_sprite.png) no-repeat; display: block; height: 29px; width: 200px; }
    #header .signUp {display: none !important; }
}

@media only screen and (max-width: 767px) {
    #header, #header .midnightInner {padding: 40px;}
}

@media only screen and (max-width: 359px) {
    #header, #header .midnightInner {padding: 20px;}
}


/* ## MENU ## */
#mainMenubutton {display: none;height: 60px !important;top: 45px !important;right: 55px !important;z-index: 99999;transition: .25s;width: 60px;left: inherit !important;}
#mainMenubutton .midnightInner button.navToggle {padding: 0;background: transparent !important;border: none !important;outline: none;position: fixed;right: 5px;top: 15px;}
#mainMenubutton .midnightInner button.navToggle .bars {display: inline-block;width: 40px;height: 31px;transition: .25s;}
#mainMenubutton .midnightInner button.navToggle .bars .iconBar {background: #FFF;display: block;width: 40px;height: 7px;margin: 0;padding: 0;transition: .25s;}
#mainMenubutton .midnightInner button.navToggle .bars .iconBar+.iconBar {margin-top: 4px;}

#mainMenubutton .gray .midnightInner button.navToggle .bars .iconBar,
#mainMenubutton .orange .midnightInner button.navToggle .bars .iconBar { background: #FFF; }
#mainMenubutton .light .midnightInner button.navToggle .bars .iconBar { background: #000; }

/* Hamburger animation */
#mainMenubutton .midnightInner button.navToggle span.iconBar { height: 5px; margin: 0 0 2px 0; position: relative; transition: transform .25s ease-in-out; -moz-transition: transform .25s ease-in-out; -webkit-transition: transform .25s ease-in-out; }
#mainMenubutton .midnightInner button.navToggle.activate span.iconBar { background: #FFF !important; transform: scale(0); -moz-transform: scale(0); -webkit-transform: scale(0); top: 5px; }
#mainMenubutton .midnightInner button.navToggle.activate span.iconBar:first-child { transform: translateY(.4em) rotate(135deg); -moz-transform: translateY(.4em) rotate(135deg); -webkit-transform: translateY(.4em) rotate(135deg); }
#mainMenubutton .midnightInner button.navToggle.activate span.iconBar:last-child {transform: translateY(-.4em) rotate(-135deg);-moz-transform: translateY(-.4em) rotate(-135deg);-webkit-transform: translateY(-.4em) rotate(-135deg);}
#mainMenubutton .midnightInner button.navToggle.activate .bars .iconBar+.iconBar { margin-top: -1px; }

/* Overlay */
#mainMenu {background:#f47937;;height: 100%;height: 100vh;left: 0;position: fixed;top: 0;width: 100%;z-index: 999;}
#mainMenu nav { text-align: center; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); }
#mainMenu ul {list-style: none;padding: 0;margin: 0 auto;display: inline-block;height: 100%;position: relative;}
#mainMenu ul li { display: block;padding: 0;}
#mainMenu ul li a {color:#000;color: #FFF;display: block;font-size: 24px; font-weight: 700; text-decoration: none;}
#mainMenu ul li a span { font-weight: 300; }
#mainMenu ul li a:after{background: #FFF;display: block;content:'';height: 1px;margin: 10% auto;position:relative;width: 30px;}
#mainMenu ul li:last-child a:after { display: none; }
#mainMenu { opacity: 0; visibility: hidden; transition: 0.5s; }
#mainMenu.open { opacity: 1; visibility: visible; transition: 0.5s; }
#mainMenu nav ul { opacity: 0; transition: 1s; }
#mainMenu.open nav ul { opacity: 1; }

@media only screen and (max-width:1024px) {
    #mainMenubutton { display: block; }
}

@media only screen and (max-width:767px) {
    #mainMenubutton { top: 25px !important;right: 35px !important;}
    #mainMenu ul li a:after{margin: 5% auto;}
}

@media only screen and (max-width:359px) {
    #mainMenubutton { top: 5px !important;right: 15px !important;}    
}

@media only screen and (max-height:413px) { 
    #mainMenu ul li a:after{margin: 2.5% auto;}
}


/* ## SIDE NAV ## */
#fp-nav {margin: 0 !important;right: 60px !important;top: 50% !important;transform: translateY(-50%) !important;-webkit-transform: translateY(-50%) !important;}
#fp-nav:before {background: rgba(0,0,0,0.33);content:"";height: 80%;left: 1px;margin: 0 auto;position: absolute;right: 0;top: 42px;width: 1px;} 
#fp-nav ul li { margin: 30px 0 !important; }
#fp-nav ul li a span, #fp-nav ul li a.active span, #fp-nav ul li a span:hover, #fp-nav ul li a.active span:hover, #fp-nav ul li:hover a span {background: #000 !important;height: 11px !important;margin: -5px 0 0 -5px !important;width: 11px !important;}
#fp-nav ul li a span:after {background: none;border: 1px solid #000;height: 19px;width: 19px;border-radius: 50%;margin: -4px 0 0 -4px;content:"";position:absolute;opacity:0;transition:.25s;}
#fp-nav ul li:hover a span:after, #fp-nav ul li a.active span:after {opacity:1;}
#fp-nav ul li .fp-tooltip {color: #000 !important;font-size: 14px !important;right: 25px !important;top: -5px !important;font-weight: 600 !important;font-family: 'Source Sans Pro', sans-serif !important;}


/* ## HERO ## */
.slide#slide0 { background-image: url(https://blueprint.cdn.cloud.searchoptics.net/8f3c7e0ee00ca23b858bf9450fff0e16/background_hero.jpg); background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; background-attachment: fixed; }
.slide#slide0 #hero {padding: 0 240px;text-align: center;padding: 0 15%;position: absolute;bottom: 5%;}
.slide#slide0 #hero h1.h1 sup { display: block; font-weight: 200; line-height: 36px; font-size: 28px; }
.slide#slide0 #hero h1.h1 { font-size: 3vw;line-height: 3.75vw;}
.slide#slide0 #hero h1.h1 b {display: inline;font-size: 3vw;}
.slide#slide0 #hero h1.h1:after{background: #FFF;display: block;content:'';height: 1px;left:calc(50% - 20px);margin: 3% 0 4% 0;position:relative;width: 30px;}
/*.slide#slide0 #hero .phone {font-weight: 700;margin: 0 0 10% 0;line-height: 42px;font-size: 3.75vw;}*/
.slide#slide0 #hero .button { margin: 0 0 10% 0; }
.slide#slide0 #hero .button .btn-primary { }
.slide#slide0 #hero hr {transform:rotate(90deg);-webkit-transform:rotate(90deg);width: 10%;}
.slide#slide0 #hero img {margin: 7.5% auto 2%;}
.slide#slide0 #hero p {font-weight: 600;letter-spacing: 2px;text-transform: uppercase;margin: 0;}
.slide#slide0 #hero .desktop { display: block; }
.slide#slide0 #hero .mobile { display: none; }

@media only screen and (max-width: 1440px) {
    .slide#slide0 #hero h1.h1, .slide#slide0 #hero h1.h1 b { font-size: 3.5vw; line-height: 4.25vw; }
    .slide#slide0 #hero h1.h1:after{ margin: 20px 0 25px 0; }
    .slide#slide0 #hero .phone { font-size: 4.25vw; }
}

@media only screen and (max-width: 1199px) {    
    .slide#slide0 #hero h1.h1, .slide#slide0 #hero h1.h1 b { font-size: 4vw; line-height: 4.75vw; }    
    .slide#slide0 #hero .phone { font-size: 4.75vw; }
}

@media only screen and (max-width: 1024px) {
    .slide#slide0 { background-attachment: scroll; }
    .slide#slide0 #hero {padding: 60px 180px;/* bottom: 0; */}
    .slide#slide0 #hero h1.h1, .slide#slide0 #hero h1.h1 b { font-size: 4.5vw; line-height: 5.25vw; }    
    .slide#slide0 #hero .phone { font-size: 36px; }
    .slide#slide0 #hero hr {display:none;}
    .slide#slide0 #hero .desktop { display: none; }
    .slide#slide0 #hero .mobile { display: block; }
}

@media only screen and (max-width: 991px) {
    .slide#slide0 #hero {padding: 180px 60px 50px 60px; position: relative; }
    .slide#slide0 #hero .phone { font-size: 36px; }
    .slide#slide0 #hero .button .btn-primary { width: 50%; margin: 0 auto; padding: 20px 0; }
    .slide#slide0 #hero hr {display:none;}
}

@media only screen and (max-width: 767px) {
    .slide#slide0 #hero {padding: 100px 40px 30px 40px;}    
    .slide#slide0 #hero h1.h1, .slide#slide0 #hero h1.h1 b { font-size: 36px; line-height: 48px; }
    .slide#slide0 #hero .button .btn-primary {width: 100%;}
}

@media only screen and (max-width: 359px) {
    .slide#slide0 #hero {padding: 80px 20px 30px 20px;}
}


/* ## SECTIONS ## */
.section .slide {background-attachment: fixed;background-position: 50% 50%;background-repeat: no-repeat;background-size: 70%;transition: .5s;transition-timing-function: ease-out;}

.section .slide .fp-tableCell > div { height: 100%; }

.section .slide .slideContent > div {top: 50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);}
.section .slide .slideContent > div > div { left: -100px; opacity: 0; position: relative; transition: 1s; }
.section .slide .slideContent > div > div.slideIn { left: 0 !important; opacity: 1 !important; } 

.section .slide .slideContent {background: rgba(255,255,255,.9);color: #000;float: right;height: 100%;min-height: 100%;padding: 0 15% 0 100px;position: relative;width: 50%;padding-left: 5%;}

.section .slide .slideContent.left { float: left;padding: 0 100px 0 15%; padding-right: 5%;}
.section .slide .slideContent.light { background: rgba(240,240,240,.9); } 
.section .slide .slideContent.gray {background: rgba(79,89,98,.9);color: #FFF;} 
.section .slide .slideContent.orange {background: rgba(228,113,51,.9);color: #FFF;} 

.section .slide .slideContent.light h1.h1:after { background: #000; }

.section .slide .slideContent.light a.btn-primary { border: 2px solid #f47937; color: #f47937; }
.section .slide .slideContent.light a.btn-primary:hover { background: #f47937; color: #FFF; }
.section .slide .slideContent.gray a.btn-primary, .section .slide .slideContent.orange a.btn-primary { border: 2px solid #FFF; color: #FFF; }
.section .slide .slideContent.gray a.btn-primary:hover { background: #FFF; color: #545f67; }
.section .slide .slideContent.orange a.btn-primary:hover { background: #FFF; color: #f47937; }

.slide#slide1 { background-image: url(https://blueprint.cdn.cloud.searchoptics.net/adce40d19da737e438539b66c93ba4be/macbook02.png); }
.slide#slide2 { background-image: url(https://blueprint.cdn.cloud.searchoptics.net/adce40d19da737e438539b66c93ba4be/macbook03.png); }
.slide#slide3 { background-image: url(https://blueprint.cdn.cloud.searchoptics.net/adce40d19da737e438539b66c93ba4be/macbook04.png); }
.slide#slide4 { background-image: url(https://blueprint.cdn.cloud.searchoptics.net/adce40d19da737e438539b66c93ba4be/macbook06.png); }
.slide#slide5 { background-image: url(https://blueprint.cdn.cloud.searchoptics.net/adce40d19da737e438539b66c93ba4be/macbook07.png); }
.slide#slide6 { /*background-image: url(https://blueprint.cdn.cloud.searchoptics.net/adce40d19da737e438539b66c93ba4be/background_form.jpg); background-size: cover;*/ }

.slide#slide1.slideOut, .slide#slide3.slideOut, .slide#slide5.slideOut { background-position: -65% 50%; transition: .5s;transition-timing-function: ease-out;}
.slide#slide2.slideOut, .slide#slide4.slideOut, .slide#slide6.slideOut { background-position: 165% 50%; transition: .5s;transition-timing-function: ease-out;}

@media only screen and (max-width: 1024px) {
    .section .slide { background-attachment: scroll; background-size: 88%; }
	.section .slide .slideContent > div {top: 25%;transform:translateY(-25%);-webkit-transform:translateY(-25%);}
    .section .slide .slideContent > div > div { left: 0; opacity: 1; }
    .section .slide .slideContent, .section .slide .slideContent.left { padding: 60px; }
}

@media only screen and (max-width: 991px) {  
    .section .slide .slideContent > div {top: 0%; transform:translateY(0%);-webkit-transform:translateY(0%);}    
    .section .slide .slideContent {background: none;float: none;padding: 0;width: 100%;}
    .section .slide .slideContent, .section .slide .slideContent.left {padding: 60px !important;}    
    .section .slide .slideContent.light, .section .slide .slideContent.gray, .section .slide .slideContent.orange {background: none;}     
    .section .slide .slideContent img {margin: 0 0 30px 0;border: 2px solid rgba(0,0,0,0.1);}
    .section .slide, .slide#slide1, .slide#slide2, .slide#slide3, .slide#slide4, .slide#slide5 { background: none; }
}

@media only screen and (max-width: 767px) {  
     .section .slide .slideContent, .section .slide .slideContent.left {padding: 40px !important;}
}

@media only screen and (max-width: 359px) {  
     .section .slide .slideContent, .section .slide .slideContent.left {padding: 40px 20px !important;}
}


/* ## PRICING GRID ## */
.section .slide #pricingGrid.slideContent { background: none; float: none; margin: 0 auto; padding: 0 15%; text-align: center; width: 100%; }
.section .slide #pricingGrid.slideContent h1.h1:after {background: #000;margin: 25px auto 60px;}
.section .slide #pricingGrid.slideContent p { font-size: 28px; font-weight: 300; margin: 0 0 60px 0; }

.section .slide #pricingGrid.slideContent .pricingGrid { margin: 0 0 60px 0; }
.section .slide #pricingGrid.slideContent .pricingGrid > div {border: 1px solid #000;margin: 0 0 0 -1px !important;width: calc(25% + 1px);}
.section .slide #pricingGrid.slideContent .pricingGrid > div:last-child { background: #f47937; }
.section .slide #pricingGrid.slideContent .pricingGrid > div > div { border-bottom: 1px solid #cdcdcd; font-size: 18px; padding: 20px 0; text-align: center; }
.section .slide #pricingGrid.slideContent .pricingGrid > div:last-child > div { color: #FFF; }
.section .slide #pricingGrid.slideContent .pricingGrid > div > div:last-child { border: none; }
.section .slide #pricingGrid.slideContent .pricingGrid > div > div b { font-size: 24px; }
.section .slide #pricingGrid.slideContent .pricingGrid > div > div .btn-primary { display: inline-block !important; width: inherit; }
.section .slide #pricingGrid.slideContent .pricingGrid > div:last-child > div .btn-primary { border: 2px solid #FFF; color: #FFF; }
.section .slide #pricingGrid.slideContent .pricingGrid > div:last-child > div .btn-primary:hover { background: #FFF; color: #f47937; }

@media only screen and (max-width:1366px) {
    .section .slide #pricingGrid.slideContent .pricingGrid > div > div .btn-primary { padding: 20px 30px; }
}

@media only screen and (max-width:1199px) {
    .section .slide #pricingGrid.slideContent .pricingGrid > div > div .btn-primary { padding: 20px; }
}

@media only screen and (max-width:1024px) {
    .section .slide #pricingGrid.slideContent { padding: 60px; }
    .section .slide #pricingGrid.slideContent .pricingGrid { margin: 0 0 40px 0; }
}

@media only screen and (max-width:991px) {
    .section .slide #pricingGrid.slideContent { text-align: left; }
    .section .slide #pricingGrid.slideContent h1.h1:after { margin: 25px 0 40px 0; }
    .section .slide #pricingGrid.slideContent p { margin: 0 0 40px 0; }
    .section .slide #pricingGrid.slideContent .pricingGrid { margin: 0; }
    .section .slide #pricingGrid.slideContent .pricingGrid > div { margin: 0 0 40px 0 !important; width: 100%; }
    .section .slide #pricingGrid.slideContent .pricingGrid > div > div .btn-primary { padding: 20px 40px; }
}

@media only screen and (max-width:767px) {
    .section .slide #pricingGrid.slideContent .pricingGrid > div { margin: 0 0 20px 0 !important; }
}

@media only screen and (max-height:899px) {
    .section .slide #pricingGrid.slideContent .pricingGrid > div > div { padding: 15px 0; }
}


/* ## FORM ## */
.section .slide #form.slideContent { background: none; color: #FFF; float: none; margin: 0 auto; padding: 0 15%; text-align: center; width: 100%; }
.section .slide #form.slideContent h1.h1:after {background: #FFF;margin: 25px auto 60px;}
.section .slide #form.slideContent .form-group label {font-weight: 300;margin: 30px 0 10px 0;line-height: 12px;}
.section .slide #form.slideContent .form-group label input { margin: 0 10px 0 0; padding: 0; height: 13px; width: 13px; float: left; }
.section .slide #form.slideContent .form-group[data-type="submit"] { margin: 0; }
.section .slide #form.slideContent .form-control { border: none; border-radius: 0; font-size: 16px; height: 50px; line-height: 50px; padding: 0 20px; }
.section .slide #form.slideContent .btn-primary {border: 2px solid #FFF;color: #FFF;margin: 0 0 20px 0;}
.section .slide #form.slideContent .btn-primary:hover, .section .slide #form.slideContent .btn-primary:active, .section .slide #form.slideContent .btn-primary:focus { background: #FFF; border: 2px solid #FFF; color: #f47937; outline: none; }
.section .slide #form.slideContent input.error { outline: 2px solid #545f67; }
.section .slide #form.slideContent label.error { display: block; margin:0 !important; padding: 10px; }

@media only screen and (max-width:1024px) {
    .section .slide #form.slideContent { padding: 60px; }
}

@media only screen and (max-width:991px) {
    .section .slide #form.slideContent { text-align: left; }
    .section .slide #form.slideContent h1.h1:after { margin: 25px 0 40px 0; }
    .section .slide #form.slideContent .form-group label { font-weight: 400; margin: 10px 0; }
}


/* ## FOOTER ## */
#footer { color: #000; text-align: center; padding: 60px; }
#footer p { font-size: 14px; font-weight: 600; margin: 0; }

@media only screen and (max-width:767px) {
    #footer { padding: 40px; }
}

@media only screen and (max-width:359px) {
    #footer { padding: 20px; }
}