﻿
    /*GENERICS*/
    
    h1, h2 {
        margin: 40px 0 0;
        font-size: 22px;
        text-transform: uppercase;
        text-align: center;
        font-style: normal;
        font-weight: 700;
    }
    
    p.eye {
        margin: 6px 0 0;
        font-size: 18px;
        text-align: center;
        font-weight: 200;
    }


    /*FEATURE*/

    #feature {
        position:relative;
        height:100%;
    }

    #feature.gestao-assinaturas {
        background:#22a6e7 url(../imagens/gestao-assinaturas-destaque2_img.png) no-repeat;
        background-position:center center;
    }

    #feature.digital-sales {
        background:#f46044 url(../imagens/digital-sales-destaque2_img.png) no-repeat;
        background-position:center center;
    }

    #feature.ecommerce {
        background:#3a495d url(../imagens/ecommerce-destaque2_img.png) no-repeat;
        background-position:center center;
    }

   #feature.cInsurance {
        background:#95a3a4 url(../imagens/seguro-massificado-destaque2_img.png) no-repeat;
        background-position:center center;
    }

    #feature .cloud {
        position:absolute;
        bottom:0;
        left:0;
        display: block;
        width:100%;
        height: 530px;
        background:url(../imagens/shadow_bg.png) repeat-x;
        opacity:0;
    }


    /*TIME LINE*/

    #services.line {
        background:url(../imagens/line_bg.gif) top center repeat-y;
    }

    #services h1, #services h4, #services p.eye {
        background:#FFF;
    }

    #services h4 {
        margin: 40px 0 0;
        padding:10px 0;
        font-size: 22px;
        text-transform: uppercase;
        text-align: center;
        font-style: normal;
        font-weight: 700;
    }

    #services h1 {
        margin-top:0;
        font-weight:300;
        text-transform:none;
        font-size:18px;
    }

    #services p.eye {
        margin:26px 0 0;
        font-weight:500;
    }

    .time-line {
        margin-top:33px;
    }

    .col h2 {
        height: 36px;
        padding-top:11px;
    }

    .col h2, .col h3 {
        font-size:14px;
        position:relative;
        text-transform:none;
    }

    .col h2 span { 
        background-image:url(../imagens/circle_bg.png);
        background-repeat:no-repeat;
        background-position:center center;
    }

    .col .wrp-col { 
        padding-bottom:50px;
    }
    
    h2 .item-circle {
        position:absolute;
        top:0px;
        display:block;
        width:35px;
        height:35px;
        -webkit-border-radius: 40px;
        -moz-border-radius: 40px;
        border-radius: 40px;
    }

    h3 .item-circle {
        position:absolute;
        top:2px;
        display:block;
        width:20px;
        height:20px;
        border:3px solid #FFF;
        -webkit-border-radius: 40px;
        -moz-border-radius: 40px;
        border-radius: 40px;
    }

    .col-left {
        margin-left:50%;
    }

    .col-left .wrp-col {
        margin-left:-2px;
        border-left:4px solid;
    }

    .col-left h2 {
        text-align:left;
        margin-top:0;
        margin-bottom:40px;
        padding-left:35px;
    }

    .col-left h2 .item-circle {
        left:-19px;
    }

    .col-left h3 {
        padding-left:35px;
    }

    .col-left h3 .item-circle {
        left:-12px;
    }

    .col-right {
        margin-right:50%;
    }

    .col-right .wrp-col {
        margin-right:-2px;
        border-right:4px solid #7f37ad;
    }

    .col-right h2 {
        text-align:right;
        margin-top:0;
        padding-right:35px;
    }

    .col-right h2 .item-circle {
        right:-19px;
    }

    .col-right h3 {
        padding-right:35px;
    }

    .col-right h3 .item-circle {
        right:-12px;
    }

    .col-right h3 {
        text-align:right;
    }

    
    .purple .wrp-col { border-color:#7F37AD;}
    .purple .item-circle { background-color:#7F37AD;}

    .gray .wrp-col { border-color:#cfcfcf;}
    .gray .item-circle { background-color:#cfcfcf;}
    
    .green .wrp-col { border-color:#5dc0aa;}
    .green .item-circle { background-color:#5dc0aa;}    

    .orange .wrp-col { border-color:#e97520;}
    .orange .item-circle { background-color:#e97520;}

    .pink .wrp-col { border-color:#ad1941;}
    .pink .item-circle { background-color:#ad1941;}
    
    .blue .wrp-col { border-color:#20b7e9;}
    .blue .item-circle { background-color:#20b7e9;}

    .blue2 .wrp-col { border-color:#5d85c0;}
    .blue2 .item-circle { background-color:#5d85c0;}

    .yellow .wrp-col { border-color:#ffea00;}
    .yellow .item-circle { background-color:#ffea00;}
    
    .yellow2 .wrp-col { border-color:#e9b720;}
    .yellow2 .item-circle { background-color:#e9b720;}

    


/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {

   /*FEATURE*/

    #feature.gestao-assinaturas {
        background-color:#22a6e7 ;
        background-image:url(../imagens/gestao-assinaturas-destaque_img.png);
        background-position:center center;
        background-attachment: fixed;
    }

    #feature.digital-sales {
        background-color:#f46044 ;
        background-image:url(../imagens/digital-sales-destaque_img.png);
        background-position:center center;
        background-attachment: fixed;
    }

    #feature.ecommerce {
        background-color:#3a495d ;
        background-image:url(../imagens/ecommerce-destaque_img.png);
        background-position:center center;
        background-attachment: fixed;
    }
       #feature.cInsurance {
        background-color:#95a3a4 ;
        background-image:url(../imagens/seguro-massificado-destaque_img.png);
        background-position:center center;
        background-attachment: fixed;
    }
    
    #feature {
        position:relative;
        height:100%;
        
        background-repeat:no-repeat, no-repeat;
        background-attachment: fixed, fixed;
    }

    /*GENERICS*/

    h1, h2, #services h1 {
        margin:75px 0 0;
        font-size:36px;
        text-transform:uppercase;
        font-style: normal;
        font-weight: 500;
    }

    h3 {
        font-size:24px;
        font-weight:500;
    }
    
    p.eye {
        margin:11px 0 0;
        font-size:22px;
        text-align:center;
        font-weight:300;
    }

    .col h3 {
        font-size: 20px;
        font-weight:300;
    }

    .col h2 {
        height:auto;
        padding-top:0;
        font-size:36px;
        font-weight:500;
    }
    
    /*TIME LINE*/

    #services.line {
        background:none;
    }

    #services h1, #services h2, #services h4 {
        background:none;
    }

    #services p.eye {
        margin-top:10px 0 0;
        font-weight:300;
    }

    .time-line {
        margin-top:73px;
    }

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

   /*FEATURE*/

    #feature.gestao-assinaturas {
        background-color:#22a6e7 ;
        background-image:url(../imagens/gestao-assinaturas-destaque_img.png), url(../imagens/mouse_icon_img.png);
        background-position:center center, bottom center;
        background-attachment: fixed, fixed;
    }

    #feature.digital-sales {
        background-color:#f46044 ;
        background-image:url(../imagens/digital-sales-destaque_img.png), url(../imagens/mouse_icon_img.png);
        background-position:center center, bottom center;
        background-attachment: fixed, fixed;
    }

    #feature.ecommerce {
        background-color:#3a495d ;
        background-image:url(../imagens/ecommerce-destaque_img.png), url(../imagens/mouse_icon_img.png);
        background-position:center center, bottom center;
        background-attachment: fixed, fixed;
    }
       #feature.cInsurance {
        background-color:#95a3a4 ;
        background-image:url(../imagens/seguro-massificado-destaque_img.png), url(../imagens/mouse_icon_img.png);
        background-position:center center, bottom center;
        background-attachment: fixed, fixed;
    }
    

}
