@font-face{ font-family: "geo_sans_light"; src: url('http://velec.ch/static/font/geosanslight.eot'); src: url('http://velec.ch/static/font/geosanslight.eot?#iefix') format('embedded-opentype'), url('http://velec.ch/static/font/geosanslight.woff') format('woff'), url('http://velec.ch/static/font/geosanslight.ttf') format('truetype'); }

*{
    padding:0;
    margin:0;
}


body {
    overflow:hidden;        /* needed to eliminate scrollbars caused by the background image */
    padding:0;margin:0;     /* necesarry for the raster to fill the screen */
    height:100%;width:100%;
    font-family: "geo_sans_light";
    font-size:100%;
    color: #cbbda2;
    line-height:18px;
}

.kw{color:#2D2B2C; display: none;}

img a{
    border: 0;
}

h3{font-size:1.6em; font-weight: bold;}
h3, x:-moz-any-link, x:default{font-size:1.3em; font-weight: bold;}

#bgimg {
    position:absolute;
    z-index: -1;
}

#realBody{
    position:absolute;
    z-index: 5;             /* Place the new body above the background image */
    overflow:auto;          /* restore scrollbars for the content */
    height:100%;width:100%; /* Make the new body fill the screen */
}
.bg_grey{background-color: #222121;}

#main{
    /*width: 80%;
    height: 100%;*/
    float: left;
    position: relative;
    overflow: auto;
}

#content{
    /*
    height:60%;
    width:56%;
    left:23%;
    top:20%;

    */

    padding: 10px;
    box-shadow: 0 0 8px #000;
    width: 940px;
    height: 530px;
    margin: 0 auto;
    position:relative;
    overflow: none;
    background-color: #444340;
    z-index: 6;
    font-size:15px;

    /*
    float:left;
    display: none;
    */
}
#content, x:-moz-any-link, x:default{font-size:0.94em;}
#content a{
    color: #cbbda2;
}

#content_admin{
    width: 900px;
    margin:0 auto;
    background-color: white;
    border: 1px solid black;
    margin-top: 150px;
    padding: 10px;
}

.clear{
    clear: both;
}

.transparancy{
    opacity:0.6;
    filter:alpha(opacity=60);
    width:100%;
    height:100%;
    background-color:grey;
    position:absolute;
    -moz-box-shadow: 0 0 5px #000;
    -webkit-box-shadow: 0 0 5px #000;
    box-shadow: 0 0 5px #000;
    z-index: 6;

}


.menu{line-height: 14px; font-size: 16px; width:100%; height:180px; overflow: none;}
.menu a{
    font-family: bankgothic;
    text-decoration: none;
    color: #444340;
    font-size: 14px;
    text-align: right;
}
.menu, x:-moz-any-link, x:default{font-size:0.92em;}

.menu a:hover{
    font-family: bankgothic;
    text-decoration: none;
    color: white;
    text-align: right;
}
.menu_selected{color:white !important;}

@font-face {
    font-family: 'bankgothic'; src: local('?'), url('../bnkgothm.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

.hidden{
    display: none;
}

.thumb_attaques{
    float: left;
    width: 150px;
    height: 150px;
    border:1px solid silver;
    overflow: hidden;
    margin: 9px;
}
.thumb_img:hover{opacity: 30;}

.thumb_attaques_left{padding-left: 10px;}

.tooltip.widthfix { width: 80px; background-color: #444340;}


/*VELEC*/

.one {
    height: 360px;
    width:30%;
    float: left;
}

.two {
    width: 70%;
    float: left;
}

.principalecollective {
    width:100%;
    float:left
}

.picture-velec {
    float:left;
    padding-right:10px;
    padding-bottom:1px;
    width:260px;
    overflow:hidden;
    height:250px;
}

.picture-velec2 {
    float:left;
    padding-right:10px;
    padding-bottom:1px;
    width:260px;
    overflow:hidden;
    height:250px;
}

.picture-velec2 {
    display: none;
}


/*LIENS*/

.one-lien {
    width:50%;
    padding-right:10px;
    float: left;
}

.navbar-default {
    display: none;
}


.gallerie-minimize {
    display: none;
}

.foot-link-2 {
    display: none;
}


.off {
    display: none;
}


/*RESPONSIVE*/


@media only screen and (max-width:960px) {
    #content {
        width: 97%;
        padding: 8;
        height: 550px;
    }

    .one {
    width:30%;
    margin-left:5px;

    }

    .two {
    width: 69%;
    }

    .principalecollective {
        margin-left: 5px;
    }

    #timeline {
        width:100% !important;
    }

}



@media only screen and (max-width:900px) {

    #bgimg {

      height: 100% !important;
      width: 100% !important;
      /* left: -816px; */
      top: 0px !important;
    }

    .one-lien {
        width: 100%;
    }



}


@media only screen and (max-width:870px) {
    .one {
    width:36%;
    }

    .two {
    width: 62%;
    }

    #content {
        height: auto !important;
        float: left;

    }

}


@media only screen and (max-width:800px) {
    .arrow0, .arrow1, .arrow2, .arrow3, .arrow4, .arrow5, .arrow6, .arrow7, .arrow_projets, .arrow_installations, .arrow_oeuvres_eau, .arrow_claustras, .arrow_scenographie, .arrow_commandes, .arrow_multiples, .arrow_pratiques_satellites, .arrow_radiateurs {
        display: none;
    }

    .titre0, .titre1, .titre2, .titre3, .titre4, .titre5, .titre6, .titre7, .titre_projets, .titre_installations, .titre_oeuvres_eau, .titre_claustras, .titre_scenographie, .titre_commandes, .titre_multiples, .titre_pratiques_satellites, .titre_radiateurs {
        left: 15% !important;
    }

    .titre0 {
        top:20% !important;
    }

    .titre1, .titre_projets {
        top:25% !important;
    }

    .titre2, .titre_oeuvres_eau {
        top:30% !important;
    }

    .titre3, .titre_claustras {
        top:35% !important;
    }

    .titre4, .titre_scenographie {
        top:40% !important;
    }

    .titre5, .titre_commandes {
        top:45% !important;
    }

    .titre6, .titre_multiples {
        top:50% !important;
    }

    .titre7, .titre_pratiques_satellites {
        top:55% !important;
    }

    .titre_radiateurs {
        top:60% !important;
    }

       .fancyframe {
        display: none;
    }

    .gallerie-minimize {
        display: block;
    }

    .gallerie-normal {
        display: none;
    }

    .picture-velec2 {
        display: block;
    }

    .picture-velec {
        display: none;
    }
    .map0, .map1, .map2, .map3, .map4, .map5, .map6, .map7 {
        display: none;
    }
}


@media only screen and (max-width:750px) {
    .one {
    width:100%;
    height: 190px;

    }

    .two {
    width: 100%;

    }

    #issues li p {
        width: 78%;
        text-align: center;
    }
}


@media only screen and (max-width:690px) {
    .principalecollective {
        display: none;
    }



    #timeline {
        display: none;
    }

    #content {
        min-height: 530px;
          clear: both;
          float: left;
    }

    .foot-link-2 {
        display: block;
    }

    .foot-link {
        display: none;
    }

    .on {
        display: none;
    }

    .off {
        display: block;
    }

    .two .fancyframe {
        display: block;
        margin-top:10px;
    }

}

@media only screen and (max-width:635px) {
    #issues li p {
        width: 67%;
        text-align: center;
    }

    .menu {
        display:none;
    }

    .navbar-default {
        display: block;
    }

}

@media only screen and (max-width:480px) {
    .one {
        height: auto;
        margin: 0;
        margin-bottom: 20px;
    }

    .picture-velec2 {
        padding:0;
        width: 100%;
        height: auto;
    }

    #content {
        width: auto;
    }

}

@media only screen and (max-width:462px) {
        .titre_oeuvres_eau {
            margin-top: 20px;
            top:35%;
    }

       .titre_claustras {
            margin-top: 20px;
             top:40%;
    }

       .titre_scenographie {
            margin-top: 20px;
             top:45%;
    }

       .titre_commandes {
            margin-top: 20px;
             top:50%;
    }

       .titre_multiples {
            margin-top: 20px;
             top:55%;
    }

       .titre_pratiques_satellites {
            margin-top: 20px;
             top:60%;
    }

       .titre_radiateurs {
            margin-top: 20px;
             top:65%;
    }


}




@media only screen and (max-width:414px) {

    .contact-link {
        margin-bottom: 20px;
    }

    .title-link {
        margin-top:20px;
       /* float: left;*/
        width: 100%;
    }

    .foot-link {

        margin: 5px;

    }

    .one-lien {
        margin:5px;
        width:auto !important;
    }



}



