@font-face {
    font-family: 'socicon';
    src: url('../font-socicon/socicon.eot');
    src: url('../font-socicon/socicon.eot?#iefix') format('embedded-opentype'),
         url('../font-socicon/socicon.woff') format('woff'),
         url('../font-socicon/socicon.ttf') format('truetype'),
         url('../font-socicon/socicon.svg#sociconregular') format('svg');
    font-weight: normal;
    font-style: normal;
    text-transform: initial;
}

/* #Basic Styles
================================================== */

html, body {
    height: 100%;
}

body {
    font: 18px/18px 'Lato', sans-serif;
    color: #909090;
    background: #f2f2f2;
    font-weight: 300;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    -webkit-tab-highlight-color: green;
    overflow: auto;
    
}

/* ***** 5th COLUNN ***** */

.smallbox {
    width: 50%;
    height: 195px;
}   
.bigbox {
    width: 100%;
    height: 390px;
}

@media (min-width: 758px) {
    .smallbox {
        width: 182px;
        height: 195px;
    }   
    .bigbox {
        width: 364px;
        height: 390px;
    }
    .top-one { margin-top: 195px; }
}

@media (min-width: 840px) {
    .container {
        width: 780px;
    }
    .smallbox {
        width: 195px;
        height: 195px;
    }   
    .bigbox {
        width: 390px;
        height: 390px;
    }
    .top-one { margin-top: 195px; }
}

@media (min-width: 1005px) {
    .container {
        width: 975px;
    }
     .smallbox {
        width: 195px;
        height: 195px;
    }   
    .bigbox {
        width: 390px;
        height: 390px;
    }
    .top-one { margin-top: 195px; }
}

@media (min-width: 1200px) {
    .container {
        width: 1170px;
    }
    .smallbox {
        width: 195px;
        height: 195px;
    }   
    .bigbox {
        width: 390px;
        height: 390px;
    }
    .top-one { margin-top: 195px; }
}

/* #Typography
================================================== */

h1, h2, h3, h4, h5, h6 {
    color: #444;
    font-weight: 300;
    -webkit-font-smoothing: antialiased;
    margin-bottom: 10px;
    letter-spacing: 1.1px;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
h1 { font-size: 38px; line-height: 1.2; }
h2 { font-size: 34px; line-height: 1.2; }
h3 { font-size: 28px; line-height: 1.2; }
h4 { font-size: 18px; line-height: 1.3; }
h5 { font-size: 17px; line-height: 1.4; }
h6 { font-size: 14px; line-height: 1.5; text-transform: uppercase;}

h1, h2, h3 {
    margin-bottom: 5%;
}

.subheader {
    color: #aaa;
}

p {
    margin: 0 0 20px;
}

p img {
    margin: 0;
}

p.lead {
    font-size: 21px;
    line-height: 27px;
    color: #aaa;
}

em {
    font-style: italic;
}

strong {
    font-weight: 400;
}

small { 
    font-size: 80%;
}

button {
    border: 0;
}

a, a:hover {
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition:.5s;

    /* Remove gray flash on mobile */
    /*-webkit-tab-highlight-color: rgb(255,0,0,0.5);*/
    -webkit-tab-highlight-color: blue;

    text-decoration: none;
}

.logo {
    display: inline-block;
    color: #fff;
    float: left;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
    width: 16.66%;
    height: 25%;
}

.logo img {
    display: inline-block;
    position: absolute;
    top: 20px;
    left: 20px;
}

.nopadding {
    padding: 0;
}

/* #Styles
================================================== */

.container-fluid {
    padding: 0px;
}

@media (max-width: 790px) {
    body { 
        padding-left: 0px;
        padding-right: 0px;
    }
}

.carousel-fade .carousel-inner .item {
    opacity: 0;
    transition-property: opacity;
    transition-duration: 1s;
    transition-timing-function: ease-out;
}

.carousel-fade .carousel-inner .active {
    opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    left: 0;
    opacity: 0;
    z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
}

.carousel-fade .carousel-control {
    z-index: 2;
}

@media all and (transform-3d),
(-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}


/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */
.navbar {
    position: absolute;
    background: transparent;
    z-index: 9999999;
    top: 0px;
    width: 100%;
    border: 0;
}

.navbar-inverse .navbar-toggle {
  border: 0;
}

.navbar {
  padding-right: 0px;
  padding-left: 0px;
}
.navbar .container {
  padding: 0px;
}
.nav > li >a  {
  border-bottom: 2px solid transparent;
  color: #fff;
  display: block;
  text-transform: uppercase;
  font-weight: 700;
  padding: 10px 0px 10px 0px;
  margin-left: 40px;
  text-align: right;
}
.navbar-inverse .navbar-nav > li > a {
  color: #fff;
  margin-right: 20px;
}
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
  background-color: transparent;
}
.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
  background-color: transparent;
  border-bottom: 2px solid #fff;
}

.nav {
    display: inline-block;
    font-size: 15px;
    line-height: 100%;
    margin-top: 0;
}

.navbar-collapse {
  padding-right: 15px;
  padding-left: 15px;
  overflow-x: visible;
  -webkit-overflow-scrolling: touch;
  border-top: 1px solid transparent;
  -webkit-box-shadow: inset 0 0px 0 rgba(255, 255, 255, .1);
          box-shadow: inset 0 0px 0 rgba(255, 255, 255, .1);
}

.container>.navbar-header, .container>.navbar-collapse {
    margin-left: 0px;
    margin-right: 0px;
}

.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
  border: 0;
}

.navbar-toggle .icon-bar {
  display: block;
  width: 32px;
  height: 5px;
  border-radius: 1px;
}

/*.main_menu li {
    cursor: pointer;
    display: block;
    position: relative;
}

.main_menu a {
    display: block;
    position: relative;
}

.main_menu>li {
    display :inline-block;
    font-size: 14px;
    line-height: 14px;
    padding: 20px 0px 20px 40px;
}

.main_menu li:first-child:after {
    content: '';
}

.main_menu>li>.touch,
.no-touch .main_menu>li:hover>a,
.main_menu>li>.current {
    border-bottom: 2px solid #fff;
}*/


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.maincarousel {
  height: 780px;
}
.minicarousel {
  height: 195px;
}
.carousel-inner {
    background-color: #000;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.maincarousel .item {
  height: 780px;
  background-color: #000;
}
.minicarousel .item {
  height: 195px;
  background-color: #000;
}


/* MAIN CSS
-------------------------------------------------- */

.main-content-wrapper {
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      z-index: 9;
}

.overc {
      position: absolute;
      top: 0;
      width: 100%;
      z-index: 9;
}


/* ===================================================== */
/* SODIGITAL                                             */
/* ===================================================== */

.bigbox {
    padding: 17px 20px;
    text-align: left;
}

.smallbox {
    padding: 17px 20px;
    text-align: left;
}

.smallbox p {
    font-size: 14px;
    color: #333333;
    line-height: 150%;
    font-weight: 400;
}

.bigbox.blue {
    background-color: #42a3b6;
}

    .bigbox.blue08 {
        background-color: rgba(66, 163, 182, 0.8);
    }

.smallbox.dblue02 {
    background-color: rgba(59, 145, 162, 0.2);
}

.smallbox.blue {
    background-color: #42a3b6;
}

    .smallbox.blue02 {
        background-color: rgba(66, 163, 182, 0.2);
    }

    .smallbox.blue04 {
        background-color: rgba(66, 163, 182, 0.4);
    }

    .smallbox.blue06 {
        background-color: rgba(66, 163, 182, 0.6);
    }

    .smallbox.blue08 {
        background-color: rgba(66, 163, 182, 0.8);
    }

.smallbox.lblue {
    background-color: #46bbcf;
}

    .smallbox.lblue08 {
        background-color: rgba(70, 187, 207, 0.8);
    }

    .smallbox.lblue06 {
        background-color: rgba(70, 187, 207, 0.6);
    }

.smallbox.pink06 {
    background-color: rgba(136, 128, 177, 0.6);
}

.smallbox.dpink {
    background-color: #4c3f87;
}

    .smallbox.dpink08 {
        background-color: rgba(76, 63, 135, 0.8);
    }

    .smallbox.dpink06 {
        background-color: rgba(76, 63, 135, 0.6);
    }

    .smallbox.dpink04 {
        background-color: rgba(76, 63, 135, 0.4);
    }

    .smallbox.dpink02 {
        background-color: rgba(76, 63, 135, 0.2);
    }

.smallbox.mpink04 {
    background-color: rgba(92, 75, 146, 0.4);
}

.bigbox.dpink08 {
    background-color: rgba(76, 63, 135, 0.8);
}

.bigbox.white {
    background-color: #ffffff;
}

    .bigbox.white h1 {
        color: #333333;
    }

    .bigbox.white h2 {
        color: #333333;
    }

.bigbox.gradbrown {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0e0202+0,442510+100 */
    background: #0e0202; /* Old browsers */
    background: -moz-linear-gradient(top,  #0e0202 0%, #442510 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #0e0202 0%,#442510 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #0e0202 0%,#442510 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e0202', endColorstr='#442510',GradientType=0 ); /* IE6-9 */
}

.bigbox.black {
    background-color: #161428;
}

.smallbox.brown06 {
    background-color: rgba(14, 2, 2, 0.6);
}

.smallbox.lbrown06 {
    background-color: rgba(160, 87, 38, 0.6);
}

.smallbox.black {
    background-color: #161428;
}

.smallbox.white {
    background-color: #ffffff;
}

.bigbox p {
    font-size: 18px;
    color: #333333;
    line-height: 150%;
    font-weight: 400;
}

.bigbox.blue p {
    color: #fff;
}

.bigbox h1 {
    font-size: 80px;
    line-height: 87%;
    font-weight: 900;
    text-transform: uppercase;
    color: white;
    margin-top: 0px;
}

.bigbox h2 {
    font-size: 18px;
    line-height: 120%;
    font-weight: 900;
    text-transform: uppercase;
    color: white;
}

.smallbox h1,
a.smallbox.gradlink p {
    font-size: 18px;
    line-height: 120%;
    font-weight: 900;
    text-transform: uppercase;
    color: white;
    margin-top: 0px;
}

.smallbox .socicon {

    font-family: 'socicon' !important;
    font-size: 32px;
    line-height: 100%;
    color: white;

}

.smallbox .bottom {
    position: absolute;
    bottom: 20px;
    left: 20px;
}

.smallbox .bottom h1 {
    margin-bottom: 0;
}

.bigbox .bottom {
    position: absolute;
    bottom: 20px;
    left: 20px;
}

.bigbox .bottom h1 {
    margin-bottom: 0;
}

.dpink08 a, .dpink06 a {
    color: #fff;
}

.socicon-twitter:before { content: "a"; }
.socicon-facebook:before { content: "b"; }
.socicon-linkedin:before { content: "j"; }

.smallbox.gradlink {

    cursor:pointer;
    
    box-shadow: none;
    
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    
    background-size:1px 400px;

}

.smallbox.gradlink:Hover {
 
    background-size:1px 200px;
    transform: scale(1.1);
    
    z-index: 9999;
    
    box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.5);
}

.smallbox.gradlink.blue,
.smallbox.gradlink.blue08,
.smallbox.gradlink.blue06,
.smallbox.gradlink.blue04,
.smallbox.gradlink.blue02 {
    
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3b91a2+0,46bace+100 */
    background: #3b91a2; /* Old browsers */
    background: -moz-linear-gradient(45deg,  #3b91a2 0%, #46bace 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#3b91a2), color-stop(100%,#46bace)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(45deg,  #3b91a2 0%,#46bace 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(45deg,  #3b91a2 0%,#46bace 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(45deg,  #3b91a2 0%,#46bace 100%); /* IE10+ */
    background: linear-gradient(45deg,  #3b91a2 0%,#46bace 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b91a2', endColorstr='#46bace',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

    
}

.smallbox.gradlink.dpink,
.smallbox.gradlink.dpink08,
.smallbox.gradlink.dpink06,
.smallbox.gradlink.dpink04,
.smallbox.gradlink.dpink02 {
    
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3e2e85+0,877fb1+100 */
    background: #3e2e85; /* Old browsers */
    background: -moz-linear-gradient(45deg, #3e2e85 0%, #877fb1 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#3e2e85), color-stop(100%,#877fb1)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(45deg, #3e2e85 0%,#877fb1 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(45deg, #3e2e85 0%,#877fb1 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(45deg, #3e2e85 0%,#877fb1 100%); /* IE10+ */
    background: linear-gradient(45deg, #3e2e85 0%,#877fb1 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3e2e85', endColorstr='#877fb1',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    
}

.videoContainer
{
    position: absolute;
    height: 780px;
    width: 100%;
    overflow: hidden;

}

.videoContainer video
{
    -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%);
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
}

/* ===================================================== */
/* Footer                                                */
/* ===================================================== */

.footer {
    background: #010002;
    text-align: center;
    padding: 11px 0 14px;
    position: relative;
    font-size: 14px;
    line-height: 120%;
    font-weight: 900;
    text-transform: uppercase;
    color: white;
}

.footer-logo {
    float: right;
}

.footer .copy {
    margin-top: 15px;
    float: left;
}

.footer a {
    color: #ccc;
}


/* ===================================================== */
/* Contact                                               */
/* ===================================================== */

/* styling */

.contact-form {
    margin: auto;
    width: 100%;
}

.contact-form textarea,
.contact-form textarea:focus,
.contact-form input,
.contact-form input:focus {
    width: 100%;
    border: 0;
    border-bottom: 2px solid #000000;
    margin-bottom: 10%;

    font-size: 18px;
    line-height: 120%;
    font-weight: 900;
    text-transform: uppercase;
    color: #000000;
    padding: 0 0 11px;
}

.contact-form textarea {
    height: 142px;
    margin-bottom: 40px;
}

.contact-form .contact-button {
    position: absolute;
    bottom: 20px;
    left: 20px;

    font-size: 18px;
    line-height: 120%;
    font-weight: 900;
    text-transform: uppercase;
    color: #000000;
    padding: 0;
    background: none;
}

/* Form errors */
form .error  {
    border-bottom: 2px solid red !important;
    color: red !important;
}

form .error,
form .error:focus {
    color: #555
}

.required {
    color: red;
}

.inline-error {
    color: red;
    display: block;
    margin-bottom: 10px;
}
