@font-face {
    font-family: Helvetica;
    src: url( ../fonts/Helvetica.ttf);
}
@font-face {
    font-family: HelveticaNeueLight;
    src: url( ../fonts/HelveticaNeue-Light.ttf);
}
@font-face {
    font-family: HelveticaNeueMedium;
    src: url( ../fonts/HelveticaNeue-Medium.ttf);
}
@font-face {
    font-family: HelveticaNeueBold;
    src: url( ../fonts/HelveticaNeue-Bold.ttf);
}
@font-face {
    font-family: HelveticaNeueMediumItalic;
    src: url( ../fonts/HelveticaNeue-MediumItalic.ttf);
}
@font-face {
    font-family: HelveticaNeueUltraLight;
    src: url( ../fonts/HelveticaNeue-UltraLight.ttf);
}
@font-face {
    font-family: HelveticaNeueThin;
    src: url( ../fonts/HelveticaNeue-Thin.ttf);
}
@font-face {
    font-family: HelveticaLight;
    src: url( ../fonts/Helvetica-Light.ttf);
    font-weight: bold;
}

body
    {
        background: #fff;
        font-family: 'Helvetica', sans-serif;
        font-weight: 300;
        position: relative;
        width: 100%;
        height: 100%;
        overflow-x: hidden;
    }

/* start h1 group */
h2,
h4
    {
        font-weight: bold;
    }
/* end h1 group */
p { line-height: 1.6em; }
/* img */
img
    {
        max-width: 100%;
        height: auto;
    }
/* img */

/* overlay */  
/* over lay */

/* start page container */
@media (min-width: 768px) {
  .container {
    width: 700px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 900px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1000px;
  }
}
/* end page container */

/* start preloader */
.preloader
    {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 99999;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-flow: row nowrap;
            -ms-flex-flow: row nowrap;
                flex-flow: row nowrap;
        /*justify-content: center;*/
        -webkit-align-items: center;
            -ms-flex-align: center;
                align-items: center;
        background: none repeat scroll 0 0 #fff;
    }
.sk-spinner-rotating-plane.sk-spinner 
    {
         width: 30px;
        height: 30px;
        background-color: #000;
         margin: 0 auto;
        -webkit-animation: sk-rotatePlane 1.2s infinite ease-in-out;
                animation: sk-rotatePlane 1.2s infinite ease-in-out;
     }

@-webkit-keyframes sk-rotatePlane {
  0% {
         -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
                 transform: perspective(120px) rotateX(0deg) rotateY(0deg); }

  50% {
        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
                transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); }

  100% {
            -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
                    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } }

@keyframes sk-rotatePlane {
  0% {
         -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
                 transform: perspective(120px) rotateX(0deg) rotateY(0deg); }

  50% {
        -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
                transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); }

  100% {
            -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
                    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } }
/* end preloader */

/* start navigation */
.navbar-default
    {
        background-color: #000;
        border: none;
        margin: 0!important;
        min-height: 162px;
        padding-top: 37px;
    }
/* end navigation */

/* start home */       
#home
    {
    background-color: #1a1a1a;
    background-size: cover;
    color: #fff;
    padding-top: 53px !important;
    padding-bottom: 53px !important;
    text-align: center;
    width: 100%;
    }
/* end home */

/* start divider */
/* end divider */

/* start feature */
#feature
    {
        background: #fff;
        padding-top: 50px;
        padding-bottom: 50px;
    }
#feature p
    {
        padding-top: 10px;
    }
/* end feature */

/* start feature1 */
/* end feature1 */

/* start somos */
#somos
    {
        background: #000;
        text-align: left;
        padding-top: 50px;
        padding-bottom: 52px;
    }
/* end pricing */




#servicos
    {
        background-image: url('../images/bg.gif');
        text-align: left;
        padding-top: 0px;
        padding-bottom: 40px;
    }


#diretor
    {
        background: #fff;
        text-align: left;
        padding-top: 50px;
        padding-bottom: 50px;
    }





/* start download */
/* end download */

/* start contact */
#contact
    {
        background-color: #000;
        background-size: cover;
        color: #fff;
        padding-top: 40px;
    }
#contact h2
    {
        padding-bottom: 10px;
    }
#contact address
    {
        padding-top: 20px;
    }
#contact .contact-form
    {
        padding-top: 40px;
    }
#contact .form-control
    {
        border: none;
        border-radius: 0px;
        box-shadow: none;
        margin-bottom: 20px;
    }
#contact input
    {
        height: 50px;
    }
#contact input[type="submit"]
    {
        background: #fff;
        color: #000;
        font-weight: bold;
        transition: all 0.3s ease;
    }
#contact input[type="submit"]:hover {
    background: #cecece;
}
/* end contact */

/* start footer */
/* end footer */
@media screen and ( max-width: 767px ) {
    #feature {
        padding-top: 20px;
        padding-bottom: 40px;
    }
}
/* start media 360 */
/* end media 360 */

.triplo_element{
    background-color: #000;
    border-bottom: 2px #fff solid !important;
    font-family: HelveticaNeueMedium !important;
    color: #fff;
    font-size: 13px;
    height: 35px !important;
}

.triplo_somos1{
    font-size: 61px; color: #ffffff; line-height: 38px;    
}

.triplo_somos2{
    font-size: 61px; color: #616161; line-height: 38px;    
}

.triplo_somos3{
    font-size: 61px; color: #232323; line-height: 38px;
}

@media only screen and (max-width: 768px) {
    .triplo_quadro{
        text-align: center !important;
    }
    .triplo_somos1{
        font-size: 36px;
        line-height: 23px
    }
    .triplo_somos2{
        font-size: 36px;
        line-height: 23px
    }
    .triplo_somos3{
        font-size: 36px;
        line-height: 23px
    }      
}

@media only screen and (min-width: 769px) {
    img{
        /* filter: url(filters.svg#grayscale); Firefox 3.5+ */
        filter: gray; /* IE5+ */
        -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */
        -webkit-transition: all .8s ease-in-out;  
    }

    .quadro1_desktop{
        padding-left: 5px;
    }
    .quadro2_desktop{
        padding-right: 10px;
    }      
    .quadro3_desktop{
        padding-right: 5px;
    }    

    img:hover {
        filter: none;
        -webkit-filter: grayscale(0);
        -webkit-transform: scale(1.00);
    }

    #bicicleta{
        background-image: url(../images/BICICLETA_pb_00000.png);
        background-size: 170px;
        background-repeat: no-repeat;
        background-position:  left bottom;
        width: 200px;
        height: 236px;
        filter: gray; /* IE5+ */
        -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */
        -webkit-transition: all .8s ease-in-out;      
    }
    #bicicleta:hover{
        background-image: url(../images/BICICLETA_colorida_bg.gif);
        background-size: 170px;
        background-repeat: no-repeat;
        background-position:  left bottom;
        width: 200px;
        height: 236px;
        
        filter: none;
        -webkit-filter: grayscale(0);
        -webkit-transform: scale(1.00);     
    }
    
    #motoqueiro{
        background-image: url(../images/MOTOQUEIRO_colorido_bg_estatico.gif);
        background-size: 225px;
        background-repeat: no-repeat;
        background-position:  center bottom;
        width: 200px;
        height: 230px;
        margin: 0 auto;
        filter: gray; /* IE5+ */
        -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */
        -webkit-transition: all .8s ease-in-out;      
    }
    #motoqueiro:hover{
        background-image: url(../images/MOTOQUEIRO_colorido_bg.gif);
        background-size: 225px;
        background-repeat: no-repeat;
        background-position:  center bottom;
        width: 200px;
        height: 230px;
        filter: none;
        -webkit-filter: grayscale(0);
        -webkit-transform: scale(1.00);    
    }
    
    

    
    
    #ivete{
        background-image: url(../images/IVETE_colorida_bg_estatica.gif);
        background-size: 190px;
        background-repeat: no-repeat;
        background-position:  right bottom;
        float: right;
        width: 200px;
        height: 230px;
        margin: 0 auto;
        filter: gray; /* IE5+ */
        -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */
        -webkit-transition: all .8s ease-in-out;      
    }
    #ivete:hover{
        background-image: url(../images/IVETE_colorida_bg.gif);
        background-size: 190px;
        background-repeat: no-repeat;
        background-position:  right bottom;
        width: 200px;
        height: 230px;
        filter: none;
        -webkit-filter: grayscale(0);
        -webkit-transform: scale(1.00);    
    }
    
    img_grandes{
        display: hidden;
    }

}

.item_servico{
    padding-top: 5px; color: #393939; font-family: HelveticaNeueLight; font-size: 16px; letter-spacing: 10px; font-weight: bold; line-height: 70%;
}

.tit_motion_design{
    padding-top: 5px; color: #fff; font-family: HelveticaNeueLight; font-size: 16px; letter-spacing: 3px; font-weight: bold;
}

.tit_efeitos_visuais{
    padding-top: 12px; color: #fff; font-family: HelveticaNeueLight; font-size: 16px; letter-spacing: 3px; font-weight: bold;
}
.tit_conteudo{
    padding-top: 12px; color: #fff; font-family: HelveticaNeueLight; font-size: 16px; letter-spacing: 2px; font-weight: bold; clear: both;
}
.tit_somos{
    font-family: HelveticaNeueThin;
}
.tit_acao{
    font-family: HelveticaNeueLight;
}
.tit_criacao{
    font-family: HelveticaNeueMediumItalic; color: #fff;
}
.tit_tecnologia{
    color: #fff;
}
.tit_endereco{
    font-family: Helvetica; font-size: 12px; letter-spacing: 2px; color: #fff; padding-bottom: 20px;
}

.foto_diretor{
    padding-top: 9px;
    text-align: center;
}
.texto_diretor{
    letter-spacing: 1px; line-height: 136.5%; font-family: HelveticaNeueLight; ;
}

.img_bicicleta{
    padding-top: 30px;
}
.img_motoqueiro{
    padding-top: 23px;
    margin-left: 60px; width: 200px
}
.img_ivete{
    padding-top: 23px
}

.tit_sucesso{
    font-family: Helvetica; font-size: 14px; letter-spacing: 2px; color: #fff; padding-bottom: 20px; text-align: center;
}


/* start footer */
footer
    {
        background: #1e1e1e;
        color: #fff;
        font-weight: 400;
        text-align: center;
        padding-top: 10px;
    }
/* end footer */