@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,700');
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
 html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
     margin: 0;
     padding: 0;
     outline: none;
}
/* HTML5 display-role reset for older browsers */
 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
     display: block;
}
 body {
     line-height: 1;
}
 ol, ul {
     list-style: none;
}
 blockquote, q {
     quotes: none;
}
 blockquote:before, blockquote:after, q:before, q:after {
     content: '';
     content: none;
}
 table {
     border-collapse: collapse;
     border-spacing: 0;
}
 a {
     text-decoration: none;
}
/* https://fonts.google.com/specimen/Roboto?selection.family=Roboto:400,700 */
 html, body {
     height: 100% 
}
 * {
     box-sizing: border-box;
}
 body {
     font-family: 'PT Sans', sans-serif;
     font-size: 0.875em;
     height: 100%;
}
 header {
     border-right: 1px solid #000;
     display: table;
     left: 20px;
     min-height: 90%;
     position: fixed;
     top: 5%;
     width: 7%;
     z-index: 1;
}
 header nav {
     display: table-row;
}
 header nav ul {
     display: table-cell;
     min-height: 100%;
     vertical-align: middle;
     text-align: center;
     width: 100%;
}
 header nav ul li {
     display: inline-block;
     margin: 0 0 40%;
     width: 100%;
}
 header nav ul li a {
    /*background: url(../images/sprite-nav.png) no-repeat 0 0;
    */
     float: left;
     height: 53px;
     margin: 0 calc((100% - 54px)/2);
    /*overflow: hidden;
    */
     position: relative;
     text-indent: -999px;
     width: 54px;
}
/*header nav ul li a:after {
     bottom: 0;
     color: #fff;
     content: attr(data-text);
     display: none;
     font-size: 1.1em;
     left: 50%;
     position: absolute;
     transform: translate(-50%, 130%);
     text-decoration: none;
     text-indent: 0;
}
 header nav ul li:hover a:after {
     display: block;
}
*/
 header nav ul li:nth-child(1) a {
     background: url(../images/house_black.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:hover:nth-child(1) a, header nav ul li.active:nth-child(1) a {
     background: url(../images/house_white.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:nth-child(2) a {
     background: url(../images/whoami_black.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:hover:nth-child(2) a, header nav ul li.active:nth-child(2) a {
     background: url(../images/whoami_white.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:nth-child(3) a {
     background: url(../images/services_black.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:hover:nth-child(3) a, header nav ul li.active:nth-child(3) a {
     background: url(../images/services_white.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:nth-child(4) a {
     background: url(../images/testimonials_black.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:hover:nth-child(4) a, header nav ul li.active:nth-child(4) a {
     background: url(../images/testimonials_white.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:nth-child(5) a {
     background: url(../images/contact_black.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:hover:nth-child(5) a, header nav ul li.active:nth-child(5) a {
     background: url(../images/contact_white.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 53px;
}
 header nav ul li:nth-child(6) a {
     background: url(../images/terms_black.svg);
     background-size: 130% 130%;
     background-position: center;
     height: 53px;
}
 header nav ul li:hover:nth-child(6) a, header nav ul li.active:nth-child(6) a {
     background: url(../images/terms_white.svg);
     background-size: 130% 130%;
     background-position: center;
     height: 53px;
}
 section {
     float: left;
     min-height: calc(100% - 40px + 1px);
     margin: 20px 20px 0;
     width: calc(100% - 40px);
}
 section .content {
     float: right;
     width: 93%;
}
 .home {
     background: #26a0c4;
     position: relative;
     text-align: center;
}
 .home h1 {
     color: #fff;
     float: right;
     font-size: 3em;
     width: 100%;
}
 .home h1 span {
     font-size: 0.7em;
}
 .home h2 {
     border: 1px solid #000;
     border-width: 1px 0;
     font-size: 2.0em;
     float: right;
     line-height: 1.8;
     letter-spacing: 5px;
     margin: 25px 0 0 0;
     width: 100% 
}
 section.home .content {
     position: relative;
}
 section.home .content .scrollDown {
     background: url(../images/main_arrow_down.svg);
     background-size: 250% 250%;
     background-position: center;
     bottom: -150px;
     cursor: pointer;
     float: left;
     height: 10vw;
     max-width: 52px;
     max-height: 52px;
     margin: 0;
     position: absolute;
     right: 50%;
     transform: translateX(50%);
     width: 10vw;
}
 .lftSec {
     float: right;
     width: 50%;
}
 .rgtSec {
     float: right;
}
 h3 {
     font-size: 3em;
     line-height: 0.8;
     margin: 0 0 30px;
}
 section.about {
     background: #c8cbcd;
}
 section.about .lftSec {
     margin: 0 20px 0 0;
     text-align: right;
}
 section.about .rgtSec {
     width: calc(100% - 50% - 100px);
}
 .about .rgtSec h3 {
     opacity: 0;
}
 .about .content {
     padding: 100px 0;
}
 .about img {
     width: 100%;
}
 p {
     font-size: 1.2em;
     line-height: 1.5;
     margin: 0 0 20px;
     text-align: justify;
}
 section.about .lftSec h3 {
     color: #fff;
}
 section.services {
     background: #818182;
     color: #fff;
     min-height: auto;
}
 div.services {
     border: 1px solid #000;
     border-width: 1px 1px 0 0;
     float: left;
     position: relative;
     padding: 0 0 120px;
     text-align: right;
     width: calc(100% - 40px);
}
 section.services .businessServices {
     border: 1px solid #000;
     border-width: 1px 0px 0 1px;
     float: right;
     margin: 0 40px 0 0;
     position: relative;
     padding: 0 0 120px;
     text-align: left;
     width: calc(100% - 200px);
}
 section.services h3 {
     position: absolute;
     width: 100%;
     top: 0;
     left: 0;
     transform: translateY(-170%);
}
 section.services .content {
     padding: 100px 0 0;
}
 section.services div.content>div>div {
     display: none;
     float: right;
     margin: 0 80px;
     width: 80%;
}
 section.services div.content>div.businessServices>div {
     float: left;
}
 h4 {
     cursor: pointer;
     font-size: 1.9em;
     float: right;
     margin: 14px 80px;
     position: relative;
     width: 80%;
}
 h4:nth-child(2) {
     margin: 50px 80px 14px 80px;
}
 div.businessServices h4 {
     float: left;
}
 div.businessServices h4:before, div.services h4:after {
     background: url(../images/plus.svg);
     background-size: 500% 500%;
     background-position: center;
     content: '';
     display: inline-block;
     font-size: 2.5em;
     max-height: 24px;
     height: 5vw;
     line-height: 0.5;
     position: absolute;
     top: 0;
     max-width: 24px;
     width: 5vw;
}
 div.businessServices h4.active:before, div.services h4.active:after {
     background: url(../images/minus.svg);
     background-size: 500% 500%;
     background-position: center;
}
 div.businessServices h4:before {
     left: -55px;
}
 div.services h4:after {
     right: -55px;
}
 .services ul li {
     font-size: 1.2em;
     line-height: 1.2;
     padding: 15px 0;
}
 .services ul li:first-child {
     padding: 0 0 15px;
}
 .services ul li:last-child {
     padding: 15px 0 60px;
}
 section.testimonials {
     background: #a7ddea;
     min-height: auto;
}
 .testimonials h3 {
     border-bottom: 2px solid #000;
     margin: 60px 0 0;
     padding: 0 200px 10px 0;
     text-align: right;
}
 .testimonials p.logo {
     text-align: center;
}
 .testimonials p.name {
     font-weight: 700;
     text-align: center;
}
 section.contact {
     background: #26a0c4;
     float: left;
     min-height: auto;
     height: auto;
}
 .contact .rgtSec {
     color: #fff;
     word-break: break-word;
     width: 37%;
}
 .contact .rgtSec h3 {
     border-bottom: 2px solid #fff;
     display: block;
     margin: 0 0 0 20%;
     padding: 0 0 10px;
     width: 80%;
}
 section.contact .content {
     padding: 80px 0;
}
 .contact .rgtSec li {
     font-size: 1.6em;
     font-weight: 700;
     margin: 88px 0;
     padding: 0 130px 0 0;
     position: relative;
     text-align: right;
}
 .contact .rgtSec li a {
     color: #fff;
}
 .contact .rgtSec li:after {
     background: url(../images/location.svg);
     background-size: 250% 250%;
     background-position: center;
     content: '';
     display: inline-block;
     height: 75px;
     position: absolute;
     right: 35px;
     top: 0;
     transform: translateY(-30%);
     width: 50px;
}
 .contact .rgtSec li:nth-child(2):after {
     background: url(../images/phone.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 89px;
}
 .contact .rgtSec li:nth-child(3):after {
     background: url(../images/mail.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 52px;
     right: 26px;
     width: 68px;
}
 .contact .lftSec {
     width: 60%;
}
 .contact .lftSec input[type=text], .contact .lftSec textarea {
     border: 1px solid transparent;
     font-family: 'PT Sans', sans-serif;
     font-weight: 700;
     font-style: italic;
     font-size: 1.2em;
     float: left;
     margin: 0 0 30px 0;
     padding: 15px 15px;
     width: 88%;
}
 .contact .lftSec .err {
     border: 1px solid #f00;
     box-shadow: 0px 0px 10px 0px rgba(255, 0, 0, 1);
}
 .contact .lftSec label.err {
     border: none;
     box-shadow: none;
     color: #ca0000;
}
 .contact .lftSec input[type="submit"] {
     background: #000;
     border: none;
     cursor: pointer;
     color: #fff;
     float: right;
     font-weight: 700;
     font-size: 1.3em;
     margin: 0 12% 0 0;
     padding: 10px 44px;
}
 .contact .lftSec input[type="submit"].send {
     background: #606060;
}
 .contact .lftSec .status {
     display: none;
     float: left;
     font-size: 1.2em;
     font-weight: 700;
     margin: 12px 0;
     width: 60%;
}
 section.terms {
     background: #c8cbcd;
     margin: 20px;
     position: relative;
}
 section.terms .content {
     margin: 0 18% 0 0;
     padding: 150px 0;
     width: 70%;
}
 section.terms .content a {
     color: #000;
     font-weight: bold;
}
 section.terms ul.social {
     bottom: 0;
     position: absolute;
     right: 0;
}
 section.terms ul.social li {
     float: left;
     margin: 0 24px 24px 0;
}
 section.terms ul.social li a {
     background: #000;
     float: left;
     padding: 10px;
}
 section.engageTerms {
     background: #c8cbcd;
     float: left;
     /*margin: 24px;*/
     min-height: auto;
     padding: 0 0 81px;
     position: relative;
}
 section.engageTerms .content {
     float: left;
     margin: 5%;
     padding: 0;
     width: 90%;
}
 section.engageTerms .content p {
     margin: 0 15px 0 0;
}
 section.engageTerms ul.social {
     bottom: 20px;
     position: absolute;
     right: 20px;
}
 ul.social li img.home {
     background: url(../images/home_termspage.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 70px;
     width: 70px;
}
 ul.social li img.twitter {
     background: url(../images/twitter.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 50px;
     width: 50px;
}
 ul.social li img.linkedin {
     background: url(../images/linkedin.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 50px;
     width: 50px;
}
 ul.social li img.instagram {
     background: url(../images/instagram.svg);
     background-size: 250% 250%;
     background-position: center;
     height: 50px;
     width: 50px;
}
/*@media only screen and (min-width: 768px) and (max-width: 1200px)*/
 @media only screen and (min-width: 768px) and (max-width: 1404px) {
     .contact .rgtSec li:after {
         top: 10px;
    }
     .contact .rgtSec li:nth-child(2):after {
         top: -4px;
    }
     .contact .rgtSec li:nth-child(3):after {
         top: 12px;
    }
}
 @media only screen and (max-width: 768px) {
     body {
         padding: 0;
    }
     section {
         margin: 5% 5% 0;
         width: 90%;
    }
     header {
         display: none;
    }
     .home h1 span {
         display: block;
         margin: 10px 0 0;
    }
     .home h2 {
         letter-spacing: 1px;
         line-height: 1.5;
         font-size: 5.6vw;
    }
     .home h1 {
         font-size: 10vw;
    }
     section.home .content {
         position: static;
    }
     section .content {
         width: 100%;
    }
     section.home .content .scrollDown {
         bottom: 25px;
    }
     section.about .rgtSec {
         float: left;
         width: 100%;
    }
     .about .rgtSec h3 {
         display: none;
    }
     .about .content {
         padding: 5%;
    }
     section.about .lftSec {
         margin: 0;
         text-align: center;
         width: 100%;
    }
     section.about .lftSec h3 {
         margin: 15px 0 5px;
    }
     h3 {
         font-size: 6vw;
         line-height: 1.2;
         margin: 0 0 15px;
    }
     p {
         font-size: 1.1em;
         text-align: justify;
    }
     section.services .content {
         padding: 40px 0 0;
    }
     div.services, section.services .businessServices {
         margin: 5% 5% 0 5%;
         padding: 0 0 60px;
         width: 90%;
    }
     section.services .businessServices {
         margin: 0% 5%;
    }
     section.services h3 {
         transform: translateY(-130%);
    }
     h4 {
         font-size: 1.1em;
         margin: 10px 40px 10px 00px;
    }
     h4:nth-child(2) {
         margin: 30px 40px 10px 00px;
    }
     div.services h4:after {
         right: -29px;
         top: 0;
    }
     .businessServices h4 {
         font-size: 1.1em;
         margin: 10px 0 10px 40px;
    }
     .businessServices h4:nth-child(2) {
         margin: 30px 00px 10px 40px;
    }
     div.businessServices h4:before {
         left: -29px;
         top: 0;
    }
     .services ul li {
         font-size: 1.0em;
         padding: 0 0 10px;
    }
     .services ul li:last-child {
         padding: 15px 0 30px;
    }
     section.services div.content>div.businessServices>div {
         margin: 0 0 0 40px;
         width: auto;
    }
     section.services div.content>div>div {
         margin: 0 40px 0 0;
         width: auto;
    }
     .testimonials h3 {
         margin: 30px 0 0;
         padding: 0 10% 0 0;
         width: 100%;
    }
     section.terms .content {
         margin: 5%;
         padding: 0;
         width: 90%;
    }
     section.terms ul.social {
         float: right;
         position: relative;
    }
     section.terms ul.social li {
         height: 15vw;
         width: 15vw;
         margin: 0 0 0 10px;
    }
     section.terms ul.social li a {
         width: 100%;
    }
     section.terms ul.social li a img {
         width: 100%;
    }
     .contact .rgtSec {
         width: 90%;
    }
     section.contact .content {
         padding: 10% 0;
    }
     .contact .rgtSec li {
         font-size: 1.2em;
         font-weight: 400;
         margin: 50px 0;
         padding: 0 80px 0 0;
         word-break: break-word;
         max-width: 300px;
    }
     .contact .rgtSec li:after {
         transform: scale(0.6) translateY(-40%);
         right: 15px;
         top: 0;
    }
     .contact .rgtSec li:nth-child(2):after {
         transform: scale(0.6) translateY(-70%);
    }
     .contact .rgtSec li:nth-child(3):after {
         transform: scale(0.6) translateY(-27%);
         right: 6.5px;
    }
     .contact .rgtSec li:nth-child(2):after {
         transform: scale(0.6) translateY(-70%);
    }
     .contact .rgtSec li:nth-child(3):after {
         transform: scale(0.6) translateY(-27%);
         right: 6.5px;
    }
     .contact .lftSec {
         margin: 5%;
         width: 90%;
    }
     .contact .lftSec input[type=text], .contact .lftSec textarea {
         width: 100%;
    }
     .contact .lftSec input[type="submit"] {
         font-size: 1.2em;
         margin: 0;
         padding: 6px 30px;
    }
     .contact .lftSec .status {
         width: 100%;
    }
}
 .carousel-contain {
     float: left;
     margin: 10% 5%;
     overflow: hidden;
     position: relative;
     width: 90%;
}
 .controls {
     display: block;
     left: 0;
     position: absolute;
     top: 23%;
     transform: translateY(-50%);
     width: 100%;
     z-index: 1;
}
 .controls p {
     cursor: pointer;
     float: left;
     margin: 0;
}
 .controls p.next {
     float: right;
}
 .controls p.prev img {
     background: url(../images/arrow_left.svg);
     background-size: 200% 200%;
     background-position: center;
     height: 50px;
     width: 50px;
}
 .controls p.next img {
     background: url(../images/arrow_right.svg);
     background-size: 200% 200%;
     background-position: center;
     height: 50px;
     width: 50px;
}
 .carousel-slide {
     float: left;
     position: relative;
     width: 6000%;
}
 .item {
     float: left;
     padding: 0 100px;
}
 @media only screen and (max-width: 768px) {
     .carousel-slide {
         width: 100%;
    }
     .item {
         border-bottom: 1px solid #fff;
         padding: 5% 0;
         text-align: center;
         width: 100%;
    }
     .controls {
         display: none;
    }
}
