/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 11 oct. 2016, 15:51:48
    Author     : roubatyl
*/
#containerPrincipal{
    font-family: 'Open Sans', sans-serif;
    color: white;

}
body, html{
    background-image: url("../images/background_Intro.JPG");
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    text-align: center;
}
section{
    background: transparent;
}
.register{
    margin-top: 10px;
}
.wrapper{
    margin-left: 10px;
    margin-right: 10px;
}
.form-horizontal .control-label{
    text-align: left;
}
.thin-font-weight{
    font-size: 13vw;
    font-size: 13vh;
    font-weight: 100;
}
.big-font-weight{
    font-size: 13vw;
    font-size: 13vh;
    font-weight: 900;
}
.color-font-title{
    color: #dbab83;
}
.textePageEntree1{
    text-align: left;
}
.textePageEntree{
    text-align: right;
}
.divTitre{
    text-align: center;
}
#labelImgSuperAdmin{
    color: white;
    font-size: 4vw;
    text-align: center;
    width: 100%;
    height: 100%;
    line-height: 7em;
}
#labelImgSuperAdmin:hover{
    color: brown;
}
#firstTd{
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    filter:alpha(opacity=55); 
    -moz-opacity:0.55; 
    opacity: 0.55; 
}
#secondTd{
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    filter:alpha(opacity=55); 
    -moz-opacity:0.55; 
    opacity: 0.55; 
}
#thirdTd{
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    filter:alpha(opacity=55); 
    -moz-opacity:0.55; 
    opacity: 0.55; 
}
#firstTd:hover{
    filter:alpha(opacity=1); 
    -moz-opacity:1; 
    opacity: 1; 
}
#secondTd:hover{
    filter:alpha(opacity=1); 
    -moz-opacity:1; 
    opacity: 1; 
}
#thirdTd:hover{
    filter:alpha(opacity=1); 
    -moz-opacity:1; 
    opacity: 1; 
}
#divModification{
    padding-top: 1vh;
}

#divAffectation{
    padding-top: 1vh;
}
.glyphicon-arrow-right{
    font-size: 2em;
}

#login-wrap
{
    position:absolute;
    top:50%;
    left:50%;
    margin:-138px 0 0 -250px;
    width:400px;
    padding:50px;
    border:1px solid #ccc;
    box-shadow:0 8px 6px -6px #333;
}

#login-wrap input
{
    display:block;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width:100%;
    margin:1em 0;
    padding:.5em;
    border:1px solid #ccc;
    border-radius:2px;
    position:relative;
}

#login-wrap input.invalid
{
    animation:invalid .5s;
    -webkit-animation:invalid .5s;
    box-shadow:0 0 5px 1px #f43841;
}

@keyframes invalid
{
    0%   {left:8px;}
    10%  {left:-8px;}
    30%  {left:8px;}
    60%  {left:-8px;}
    100% {left:0px;}
}

@-webkit-keyframes invalid /* Safari and Chrome */
{
    0%   {left:8px;}
    10%  {left:-8px;}
    30%  {left:8px;}
    60%  {left:-8px;}
    100% {left:0px;}
}

#login-button
{
    float:right;
    margin:1em 0;
    padding:.5em 1em;
    border:0;
    border-radius:2px;
    background:#565656;
    color:#fff;
}
#login-button:hover {background:#333;}
#login-button:active {position:relative; top:2px;}

.bx-viewport, bx-wrapper, bx-pager, bx-default-pager{
    height:100px !important;
}
div.pubBottom{
    position: absolute;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    bottom: 0;
    margin-bottom: 110px;
}
li.liWidth{
    width: 180px;
}
img.center{
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (max-height: 514px) {
    #publicite {
        display: none;
    }
}

@media screen and (max-width: 649px) {
    #publicite {
        display: none;
    }
}

#menu-tab {
    /*background: white;*/
    display:inline-block;
    font-family: 'trebuchet ms', geneva; 
    font-size: 100%;
    color:black;
    margin-right:500px;
    margin-top:200px;
}

#menu-tab a {
    color: grey;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    font-variant: normal;
}
#menu-tab a:hover{
    color: green;

}

/*--------------Dimensions tableau--------------*/

#page-wrap {
 position: relative;
 transform: translate(-50%, -50%);
}

/*--------------Onglets--------------*/

.tabs {
    min-height: 480px; 
    clear: both;
    margin: 25px 0;
}
.tab {
   float: left;
}
.tab label {
    background: rgba(170, 185, 185, 0.97);
    padding: 10px; 
    border: 1px solid #ccc; 
    margin-left: -1px; 
    position: relative;
    left: 1px; 
    border-radius: 10px 10px 0px 0px;
    box-shadow: 3px -3px 6px rgba(0, 0, 0, 0.71);
}
.tab [type=radio] {
    display: none;   
}

/*--------------Contenu article onglet--------------*/
.content {
    position: absolute;
    top: 28px;
    left: 0;
    background: white;
    right: 0px;
    bottom: 0;
    padding: 20px;
    border: 1px solid #ccc; 
    border-radius: 0px 10px 10px 10px;
    box-shadow:6px 6px 10px rgba(0, 0, 0, 0.41);
    overflow: hidden;
    overflow-y: auto;
    margin-bottom: -20px;
    width: 1000px;
}
.content > * {
    opacity: 0;

    -webkit-transform: translate3d(0, 0, 0);

    -webkit-transform: translateX(-100%);
    -moz-transform:    translateX(-100%);
    -ms-transform:     translateX(-100%);
    -o-transform:      translateX(-100%);

    -webkit-transition: all 0.6s ease;
    -moz-transition:    all 0.6s ease;
    -ms-transition:     all 0.6s ease;
    -o-transition:      all 0.6s ease;
}

/*-------------Onglets actifs--------------*/

[type=radio]:checked ~ label {
    background: white;
    border-bottom: 1px solid white;
    z-index: 2;
}
[type=radio]:checked ~ label ~ .content {
    z-index: 1;
}
[type=radio]:checked ~ label ~ .content > * {
    opacity: 1;

    -webkit-transform: translateX(0);
    -moz-transform:    translateX(0);
    -ms-transform:     translateX(0);
    -o-transform:      translateX(0);
    
 
    
}