/* ----------------------------- */
/* ==viewport fixing for RWD     */
/* ----------------------------- */
@-webkit-viewport {
    width: device-width;
    zoom: 1.0;
}
@-moz-viewport {
    width: device-width;
    zoom: 1.0;
}
@-ms-viewport {
    width: device-width;
    zoom: 1.0;
}
@-o-viewport {
    width: device-width;
    zoom: 1.0;
}
@viewport {
    width: device-width;
    zoom: 1.0;
}

/* ----------------------------- */
/* ==desktop and retina medias   */
/* ----------------------------- */

@media (min-width: 641px) {
    /* here go rules for big resources and big screens like: background-images, font-faces, etc. */
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
    /* Style adjustments for retina devices */
}

/* ---------------------------------- */
/* ==Responsive large / small / tiny  */
/* ---------------------------------- */

@media (min-width: 1280px) {

    /* layouts for large (l) screens */
    .large-hidden { display: none !important; }
    .large-visible { display: block !important; }
    .large-no-float {float: none; }
    .large-inbl {
        display: inline-block;
        float: none;
        vertical-align: top;
    }
    .large-row {
        display: table;
        table-layout: fixed;
        width: 100% !important;
    }
    .large-col {
        display: table-cell;
        vertical-align: top;
    }

    /* widths for large (l) screens */
    .large-w25 { width: 25% !important; }
    .large-w33 { width: 33.3333% !important; }
    .large-w50 { width: 50% !important; }
    .large-w66 { width: 66.6666% !important; }
    .large-w75 { width: 75% !important; }
    .large-w100 {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0;		
    }

    /* margins for large (l) screens */
    .large-ma0 { margin: 0 !important; }
}
@media (max-width: 1280px) {
    .large-hidden { display: none !important; }
    .large-inbl {
        display: inline-block;
        float: none;
        vertical-align: top;
    }
}
@media (max-width: 1024px) {
    
    .w1200p { 
        width: auto;
        float: none;
    } 
    
    .small-inbl {

        display: inline-block !important;
        float: none;
        vertical-align: top;
     
    }
    .folio {width: 33.33333333333333333%;}
    .bigpicto {width: 33.33333333333333333%;border-bottom:1px solid white;padding-top: 35px;}
    
    
    #header {background-size: cover;}
}

@media (max-width: 960px) {

    .w960p { 
        width: auto;
        float: none;
    } 
    .small-inbl {

        display: inline-block !important;
        float: none;
        vertical-align: top;
    }
    .folio {width: 33.33333333333333333%;}
    
}
@media (max-width: 800px) {
    .padmob{padding-left: 15px;padding-right: 15px;}
}


@media (max-width: 768px) {

    /* quick tablet reset */
    .w600p,
    .w700p,
    .w800p,
    .w960p,
    .mw960p,
    .small-wauto { 
        width: auto;
        float: none;
    } 

    /* you shall not pass */
    div, textarea, table, td, th, code, pre, samp {
        word-wrap: break-word;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        -o-hyphens: auto;
        hyphens: auto;
    }

    /* layouts for small (s) screens */
    .small-hidden,
    .tablet-hidden { display: none !important; }
    .small-visible { display: block !important; }
    .small-no-float {float: none; }
    .small-inbl {
        display: inline-block !important;
        float: none;
        vertical-align: top;
    }
    .small-row {
        display: table !important;
        table-layout: fixed !important;
        width: 100% !important;
    }
    .small-col {
        display: table-cell !important;
        vertical-align: top !important;
    }

    /* widths for small (s) screens */
    .small-w25 { width: 25% !important; }
    .small-w33 { width: 33.3333% !important; }
    .small-w50 { width: 50% !important; }
    .small-w66 { width: 66.6666% !important; }
    .small-w75 { width: 75% !important; }
    .small-w100 {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0;		
    }
    /* margins for small (s) screens */
    .small-ma0 { margin: 0 !important; }
    
    

    .folio {width: 50%;}
    .bigpicto {width: 50%;}
    footer .col {width: 50%;}

    #jingle {font-size:0.9em}
    #header {height: 210px;}
    
    
    h2 {
        font-size: 2.4em;
        font-weight: normal;
        line-height: 1.0em;
    }

    h3 {
        font-size: 1.0em;
        line-height: 1.2em;
    }
    
    
    #jingle h2 {
        color: #FFFFFF;
        font-size: 1.3em;
        letter-spacing: 1px;
        padding-top: 12px;
    }
    
    input[type=text], textarea { width: 100%; }
    input.subject[type="text"] { width: 100%;}
    
     #nav ul li a { font-size: 1.0em;}
    
}

@media (max-width: 600px) {

    /* quick smartphone reset */
    .mod,
    .col,
    fieldset {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0;
    }
    .w300p,
    .w400p,
    .w500p {
        width: auto;
        float: none;
    }
    .row { 
        display: block !important;
        width: 100% !important;
    }

    /* layouts for tiny (t) screens */
    .tiny-hidden,
    .phone-hidden { display: none !important; }
    .tiny-visible { display: block !important; }
    .tiny-no-float {float: none;}
    .tiny-inbl {
        display: inline-block;
        float: none;
        vertical-align: top;
    }
    .tiny-row {
        display: table !important;
        table-layout: fixed !important;
        width: 100% !important;
    }
    .tiny-col {
        display: table-cell !important;
        vertical-align: top !important;
    }
    th,
    td {
        display: block !important;
        width: auto !important;
        text-align: left !important;
    }
    thead { display: none; }

    /* widths for tiny (t) screens */
    .tiny-w25 { width: 25% !important; }
    .tiny-w33 { width: 33.3333% !important; }
    .tiny-w50 { width: 50% !important; }
    .tiny-w66 { width: 66.6666% !important; }
    .tiny-w75 { width: 75% !important; }
    .tiny-w100 { 
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0;
    }
    /* margins for tiny (t) screens */
    .tiny-ma0 { margin: 0 !important; }
    
    #header { height: 115px;background: #466a84 url('../images/header/header_neutre.jpg');background-size: cover}
    #subheader {height:25px}
    .content { padding-top: 0}
    .small-center {text-align: center}
    .bigpicto {width: 50%;border-bottom:1px solid white;}
    .detailcnt {padding-left: 15px;padding-right: 15px;}
    #solutions {padding-top: 20px;}
    
    .soldetail h2 {
        font-size: 2.2em;
        line-height: 1.0em;
    }
    .tinypb15 { padding-bottom: 15px}
    .folio { width: 90%}

}

@media (max-width: 320px) {
    
    
    h2 {
        font-size: 1.8em;
        font-weight: normal;
        line-height: 1.0em;
    }

    h3 {
        font-size: 0.9em;
        line-height: 1.2em;
    }
    .bigpicto {border-bottom:1px solid white;}
    .soldetail h2 { font-size: 1.6em}
    
    
    
}