/* -------------------------------- 

Primary style

-------------------------------- */
*, *:after, *:before {  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  box-sizing: border-box;}

body {  font-size: 100%;  font-family: "Source Sans Pro", sans-serif;  color: rgba(2, 23, 37, 0.7);  background-color: white;}
a {  color: white;  text-decoration: none;}

/* -------------------------------- 
   Modules - reusable parts of our design
-------------------------------- */
.cd-container {  /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */  width: 90%;  max-width: 768px;  margin: 0 auto;}
.cd-container:after {  content: "";  display: table; clear: both;}

/* -------------------------------- 
   Main components 
-------------------------------- */
.cd-header {  position: absolute;  top: 30px; left:0;  /*right: 20px;    height: 50px;*/width: 100%;  z-index: 3;  text-align:left;  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;}
@media only screen and (min-width: 1170px) {
  .cd-header {
    -webkit-transition: background-color 0.3s;
    -moz-transition: background-color 0.3s;
    transition: background-color 0.3s;
    /* Force Hardware Acceleration in WebKit */
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  .cd-header.is-fixed {
    /* when the user scrolls down, we hide the header right above the viewport */
    position: fixed;
    top: -80px;
    background-color: rgba(2, 23, 37, 0.96);
    -webkit-transition: -webkit-transform 0.3s;
    -moz-transition: -moz-transform 0.3s;
    transition: transform 0.3s;
  }
  .cd-header.is-visible {
    /* if the user changes the scrolling direction, we show the header */
    -webkit-transform: translate3d(0, 100%, 0);
    -moz-transform: translate3d(0, 100%, 0);
    -ms-transform: translate3d(0, 100%, 0);
    -o-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  .cd-header.menu-is-open {
    /* add a background color to the header when the navigation is open */
    background-color: rgba(2, 23, 37, 0.96);
  }
}

.cd-logo {
  display: block;
  position: absolute;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  left: .875em;
}
.cd-logo img {
  display: block;
}
@media only screen and (min-width: 768px) {
  .cd-logo {
    left: 2.6em;
  }
}

.cd-secondary-nav {
  position: absolute;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 10em;
  /* hidden on small devices */
  display: none;
}
.cd-secondary-nav li {
  display: inline-block;
  margin-left: 2.2em;
}
.cd-secondary-nav a {
  display: inline-block;
  color: white;
  text-transform: uppercase;
  font-weight: 700;
}
@media only screen and (min-width: 768px) {
  .cd-secondary-nav {
    display: block;
  }
}

.cd-primary-nav-trigger {
  position: absolute;
  right: 20px;
  top: 10px;
  height: 30px;
  width: 30px;
 /* background-color: #03263d;*/
}
.cd-primary-nav-trigger .cd-menu-text {
  color: white;
  text-transform: uppercase;
  font-weight: 700;
  /* hide the text on small devices */
  display: none;
}
.cd-primary-nav-trigger .cd-menu-icon {
  /* this span is the central line of the menu icon */
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 33px;
  height: 2px;
  background-color: white;
  -webkit-transition: background-color 0.3s;
  -moz-transition: background-color 0.3s;
  transition: background-color 0.3s;
  /* these are the upper and lower lines in the menu icon */
}
.cd-primary-nav-trigger .cd-menu-icon::before, .cd-primary-nav-trigger .cd-menu-icon:after {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: white;
  right: 0;
  -webkit-transition: -webkit-transform .3s, top .3s, background-color 0s;
  -moz-transition: -moz-transform .3s, top .3s, background-color 0s;
  transition: transform .3s, top .3s, background-color 0s;
}
.cd-primary-nav-trigger .cd-menu-icon::before {
  top: -10px;
}
.cd-primary-nav-trigger .cd-menu-icon::after {
  top: 10px;
}
.cd-primary-nav-trigger .cd-menu-icon.is-clicked {
  background-color: rgba(255, 255, 255, 0);
}
.cd-primary-nav-trigger .cd-menu-icon.is-clicked::before, .cd-primary-nav-trigger .cd-menu-icon.is-clicked::after {
  background-color: white;
}
.cd-primary-nav-trigger .cd-menu-icon.is-clicked::before {
  top: 0;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}
.cd-primary-nav-trigger .cd-menu-icon.is-clicked::after {
  top: 0;
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  transform: rotate(225deg);
}
.arrow{width:0; height:0; border-right: 20px solid transparent; border-top: 30px solid rgba(240, 120, 30, 0.90); position: absolute; bottom:-30px; left:0; right:0; content: ''; }
.mobileLogo{ position:relative; top:-14px; left:0px;}
.cd-primary-nav {
  /* by default it's hidden - on top of the viewport */
  position: fixed;
  left: 0;
  top: 0;
  height: 90%;
  width: 100%;
  background: rgba(240, 120, 30, 0.90);
  z-index: 2;
  text-align: center;
 padding:15px 0 30px 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
 /* overflow: auto;*/
  /* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */
  -webkit-overflow-scrolling: touch;
  -webkit-transform: translateY(-250%);
  -moz-transform: translateY(-250%);
  -ms-transform: translateY(-250%);
  -o-transform: translateY(-250%);
  transform: translateY(-250%);
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  transition-duration: 0.4s;

}
.cd-primary-nav ul{  overflow:hidden;  overflow-y:scroll; height: 100%;/*   width: 100%*/}
.cd-primary-nav ul.mobile_nav li ul.twolavel.dropdown-menu{height:auto; /*min-width:100%;*/ width:250px; border:0; border-radius:0px; position:relative; top:0; left:0; right:0;padding:5px 10px; margin:0 auto; float:none;} 
.cd-primary-nav ul.mobile_nav li .twolavel.dropdown-menu li{ margin:0; text-align:center; }
.cd-primary-nav ul.mobile_nav li.dropdown .twolavel.dropdown-menu > li > a{ padding:5px 10px; color:#dc701e; border-bottom:#f0781e solid 2px; white-space:pre-line; text-transform:uppercase; font-size:13px;}
.cd-primary-nav ul.mobile_nav li.dropdown .twolavel.dropdown-menu > li:last-child > a{ border:none;}
.cd-primary-nav ul.mobile_nav li.dropdown .twolavel.dropdown-menu > li > a:hover,
.cd-primary-nav ul.mobile_nav li.dropdown .twolavel.dropdown-menu > li > a:focus{ background:#f0781e; color:#fff;}

.cd-primary-nav li {font-size: 1.375rem; font-weight: 400; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; margin:45px 0; text-transform: capitalize;}

/*.text-left.logo .navbar-brand{border-bottom:transparent solid 1px;}
.text-left.logo .navbar-brand:hover{ border:none;}*/
.cd-primary-nav li a{padding: 0.3em 0.7em; font-size: 24px; color:#FFFFFF; border-bottom:transparent solid 1px; -webkit-transition: background 0.2s; -moz-transition: background 0.2s; transition: background 0.2s; border-bottom:transparent solid 1px;}
.cd-primary-nav li a:hover{ border-bottom:#feb177 solid 1px;}

.no-touch .cd-primary-nav a:hover {  background-color: #e36767;}
.cd-primary-nav .cd-label{color: #06446e;  text-transform: uppercase;  font-weight: 700;  font-size: 14px;  font-size: 0.875rem;  margin: 2.4em 0 .8em;}
.cd-primary-nav .cd-social{display: inline-block;  margin: 0 .4em;}
.cd-primary-nav .cd-social a{width:44px; height:44px; padding: 0;  background-image: url("../img/cd-socials.svg");  background-repeat: no-repeat;  /* image replacement */
  overflow: hidden;  text-indent:100%;  white-space: nowrap;}
.cd-primary-nav .cd-facebook a { background-position: 0 0;}
.cd-primary-nav .cd-instagram a { background-position: -44px 0;}
.cd-primary-nav .cd-dribbble a {  background-position: -88px 0;}
.cd-primary-nav .cd-twitter a {  background-position: -132px 0;}
.cd-primary-nav.is-visible {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}

@media only screen and (min-width: 1170px) {
.cd-primary-nav li {    font-size: 30px;    font-size: 1.875rem;  }
.cd-primary-nav .cd-label {    font-size: 16px;    font-size: 1rem;  }
}

.cd-intro { position: relative; height: 100%; background: url("../img/cd-background-img.jpg") no-repeat center center; background-size: cover;  z-index: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}

.cd-intro h1{ position: absolute; width: 90%; max-width: 1170px; left: 50%; top: 50%; bottom: auto; right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  color: white; font-size: 20px; font-size: 1.25rem; font-weight: 300; text-align: center;}
  
@media only screen and (min-width: 768px) {
.cd-intro h1 {    font-size: 30px;    font-size: 1.875rem; }
}
@media only screen and (min-width: 1170px) {
.cd-intro {    height: 700px; }
}
.cd-main-content {  position: relative;  z-index: 1;}
.cd-main-content p {  line-height: 1.6; margin: 2em 0;}

@media only screen and (min-width: 1170px) {
.cd-main-content p {    font-size: 20px;    font-size: 1.25rem; }
}