/* interface generale */
body {
 background-color:#666666; /*5471bf;*/
 font-size: 13px;
 margin: 0px;
 padding: 0px;
 border: 0;
 color:#000000;
 
 background-image: url(../../../pic/interface/bg_admin.jpg);
 background-position: center center;
 background-repeat: no-repeat; 
 background-attachment: fixed; 
 background-size: cover; 
 -moz-background-size: 100% 100%; /* Gecko 1.9.2 (Firefox 3.6) */
 -o-background-size: 100% 100%; /* Opera 9.5 */
 -webkit-background-size: 100% 100%; /* Safari 3.0 */
 background-size: 100% 100%;
}

a{
 text-decoration: none;
}


a:focus { 
 outline:0; 
}

body * {
 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
 font-weight: normal;
 font-size: 13px;
 color:#000000; 
}

img {
 padding:0px;
 margin:0px; 
 border:none; 
}
input:focus{
 outline: none; 
}

.input_login {
 font-family: Arial;
 font-size: 14px; 
 color:#DEDEDE;
 border: none;
 height: 30px;
 background-color: #47474b;
 margin-left: 10px;

}

.hidden { display: none; }
.bold { font-weight:bold; }
.line { 
 height:5px;
 margin: 10px 0;
 background-image: -webkit-linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1));
 background-image: -moz-linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1));
 background-image: -ms-linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1));
 background-image: -o-linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1));
 background-image: linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1)); 
}
.line_filled {
 padding: 2px 20px;
 margin: 10px 0;
 background-image: -webkit-linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1));
 background-image: -moz-linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1));
 background-image: -ms-linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1));
 background-image: -o-linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1));
 background-image: linear-gradient(left, rgba(178, 34, 34, 1) 10%, rgba(0, 0, 0, 1));
 color:white; 
}

/*****************************************************
**** Gestion des cadres fields
*****************************************************/
.gray_frame{
 margin:auto;
 margin:10px;
 margin-top: 15px;
 margin-bottom: 40px;
 background-color: #3b3d42;
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 20px;
}

.ui-widget-content{
 background:rgba(249,249,249,0.2);
}
.inner-widget-content{
 margin-top: 0px;
 padding-top: 10px;
 font-size:1.25em;
 line-height: 180%;
}
.inner-widget-content strong, .inner-widget-content a{
 font-size:1em;
 color:firebrick;
}
.inner-widget-content ul, .inner-widget-content ol, .inner-widget-content li{
 font-size:1em;
}
 
.inner_main_div{
 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(10%, rgba(249, 249, 249, 1)), color-stop(100%, rgba(249, 249, 249, 0.1)) );
 background-image: -webkit-linear-gradient(top, rgba(249, 249, 249, 1) 10%, rgba(249, 249, 249, 0.1));
 background-image: -moz-linear-gradient(top, rgba(249, 249, 249, 1) 10%, rgba(249, 249, 249, 0.1));
 background-image: -ms-linear-gradient(top, rgba(249, 249, 249, 1) 10%, rgba(249, 249, 249, 0.1));
 background-image: -o-linear-gradient(top, rgba(249, 249, 249, 1) 10%, rgba(249, 249, 249, 0.1));
 background-image: linear-gradient(top, rgba(249, 249, 249, 1) 10%, rgba(249, 249, 249, 0.1)); 
 padding: 10px;
 margin-left: -21px;
 margin-right: -21px;
 margin-bottom: 40px;
 /*min-height: 500px;*/
 box-shadow: 0px 0px 10px #444444;
}

.footer_main_div{
 margin-top: 50px;
 text-align:center;
}

.inner_main_div_image{
 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(238, 238, 238, 0.4)), color-stop(100%, rgba(177, 177, 177, 0.4)) );
 background-image: -webkit-linear-gradient(top, rgba(238, 238, 238, 0.4), rgba(177, 177, 177, 0.4));
 background-image: -moz-linear-gradient(top, rgba(238, 238, 238, 0.4), rgba(177, 177, 177, 0.4));
 background-image: -ms-linear-gradient(top, rgba(238, 238, 238, 0.4), rgba(177, 177, 177, 0.4));
 background-image: -o-linear-gradient(top, rgba(238, 238, 238, 0.4), rgba(177, 177, 177, 0.4));
 background-image: linear-gradient(top, rgba(238, 238, 238, 0.4), rgba(177, 177, 177, 0.4)); 
 padding: 10px;
 margin-left: -21px;
 margin-right: -21px;
 margin-bottom: 40px;
 min-height: 500px;
 box-shadow: 0px 0px 10px #444444;
}

.manage_link{
 margin-top: 10px;
 width: 100px;
 float:left;
 height: 35px; 
}

.main_div_image_manager{
 position: absolute;
 width: 900px;
 right:30px;
 top: 10px;
 height: 35px;
 background-color: rgba(59, 61, 66, 1);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 20px;
}

.actu_content{
 background-color:#999;
 padding:5px;
 border-radius:5px;
 margin-top:1px;
 background-image: -webkit-linear-gradient(top, green 20%, cyan 100%);
 background-image: -ms-linear-gradient(top, green 20%, cyan 100%);
 background-image: -moz-linear-gradient(top, green 20%, cyan 100%);
 background-image: -o-linear-gradient(top, green 20%, cyan 100%);
 background-image: linear-gradient(top, green 20%, cyan 100%);
}

.menu_link{
 cursor: pointer;
 position: relative;
 line-height: 1.3;
 font-size: 100%;
 margin: 0;
 margin-top: 2px;
 padding: .5em .5em .5em .7em;
 min-height: 0;
 border-bottom-right-radius: 4px;
 border-bottom-left-radius: 4px;
 border-top-right-radius: 4px;
 border-top-left-radius: 4px;
 padding-left: 2.2em;
 
 border: 1px solid #777; 
 background: #111 url(../../../css/images/ui-bg_glass_40_111111_1x400.png) 50% 50% repeat-x; 
 font-weight: normal; 
 color: #e3e3e3;
}
.menu_link:hover{
 border: 1px solid #000; 
 background: #1c1c1c url(../../../css/images/ui-bg_glass_55_1c1c1c_1x400.png) 50% 50% repeat-x;
 font-weight: normal; 
 color: #fff;
}
.menu_link_active{
 border: 1px solid #000; 
 background: #fff;
 font-weight: normal; 
 color: #000;
}
.popup {
 position: fixed;
 font-family: Arial, Helvetica, sans-serif;
 top: -100px;
 right: 0;
 bottom: 0;
 left: 0;
 background: rgba(0,0,0,0.8);
 z-index: -1;
 opacity:0;
 -webkit-transition: opacity 400ms ease-in;
 -moz-transition: opacity 400ms ease-in;
 transition: opacity 400ms ease-in;
 pointer-events: none;
}
.popup:target {
 z-index:9999;
 opacity:1;
 pointer-events: auto;
}

.popup > div {
 width: 60%;
 position: relative;
 margin: 10% auto;
 padding: 5px 20px 13px 20px;
 border-radius: 10px;
 background: #fff;
 background: -moz-linear-gradient(#fff, #999);
 background: -webkit-linear-gradient(#fff, #999);
 background: -o-linear-gradient(#fff, #999);
}

.popup h2{ font-weight: bold; font-size:1.5em; }
.popup .popup-inner-reduced { width:60%; margin:auto;}
.close {
 background: #606061;
 color: #FFFFFF;
 line-height: 25px;
 position: absolute;
 right: -12px;
 text-align: center;
 top: -10px;
 width: 24px;
 text-decoration: none;
 font-weight: bold;
 -webkit-border-radius: 12px;
 -moz-border-radius: 12px;
 border-radius: 12px;
 -moz-box-shadow: 1px 1px 3px #000;
 -webkit-box-shadow: 1px 1px 3px #000;
 box-shadow: 1px 1px 3px #000;
}
.close:hover { background: #00d9ff; }

@media only screen and (min-width: 1290px){
 .main_div{
 position: absolute;
 width: 900px;
 left:350px;
 top: 10px;
 height: 35px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 15px 20px 20px 20px;
 }
 
 .menu{
 position: absolute;
 top: 160px;
 left: 10px;
 width: 240px;
 min-height: 250px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 20px;
 }
 
 .info_login{
 position: absolute;
 top: 10px;
 left: 10px;
 width: 240px;
 min-height: 90px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 15px 20px 5px 20px;
 } 
}

@media only screen and (max-width: 1289px){
 .main_div{
 position: absolute;
 width: 67%;
 height: 35px;
 left:350px;
 top: 10px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 15px 1.55% 20px 1.55%;
 margin-left: -3%;
 }
 .menu{
 position: absolute;
 top: 160px;
 left: 10px;
 width: 240px;
 min-height: 250px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 20px;
 }
 
 .info_login{
 position: absolute;
 top: 10px;
 left: 10px;
 width: 240px;
 min-height: 90px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 15px 20px 5px 20px;
 } 
}

@media only screen and (max-width: 1080px){
 body{ overflow: scroll; }
 .main_div{
 position: absolute;
 width: 725px;
 height: 35px;
 left:350px;
 top: 10px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 15px 16px 20px 16px;
 }
 .menu{
 position: absolute;
 top: 160px;
 left: 10px;
 width: 240px;
 min-height: 250px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 20px;
 }
 
 .info_login{
 position: absolute;
 top: 10px;
 left: 10px;
 width: 240px;
 min-height: 90px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 15px 20px 5px 20px;
 } 
}


/*@media only screen and (min-width: 1541px){
 .main_div{
 position: absolute;
 width: 900px;
 height: 35px;
 left:50%;
 margin-left: -470px;
 top: 10px;
 background-color: rgba(0, 0, 0, 0.4);
 background-color: rgba(0, 0, 0, 1);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 20px;
 }
 .menu{
 position: fixed;
 top: 10px;
 left: 10px;
 width: 240px;
 min-height: 250px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 20px;
 }
 
 .info_login{
 position: fixed;
 top: 10px;
 right: 10px;
 width: 240px;
 height: 165px;
 min-height: 100px;
 background-color: rgba(0, 0, 0, 0.4);
 box-shadow: 0px 0px 10px #333333;
 border: 1px solid #36383d;
 padding: 20px;
 } 
}*/



.lien_menu:hover{
 color: #999999; 
}

#background_drag{
 text-align: center;
 padding: 1em 0;
 margin: 1em 0;
 color: #555;
 border: 1px dashed #555;
 border-radius: 7px;
 cursor: default;
 background-color: #dedede; 
 width: 92%;
}
#background_drag.hover
{
 color: #f00;
 border-color: #f00;
 border-style: solid;
 box-shadow: inset 0 3px 4px #888;
}
.handle{
 position: absolute;
 float: right;
 top: 0px;
 right: 0px;
 width: 16px;
 height: 16px;
 background-image: url(images/move.png); 
 cursor: move;
 opacity:0.2; 
}

.handle:hover{
 opacity:0.5;
}

.title_gray_frame b{
 color: #FFF;
 height: 35px;
 font-size:22px;
 line-height: 35px;
 padding:0px; 
 white-space: nowrap;
 font-weight: bold; 
 text-align: left;
}
.title_gray_frame{ margin-bottom:10px; }
.title_gray_frame a{
 color: yellow;
 height: 35px;
 font-size:3em; /*50px*/
 line-height: 35px;
 padding:0px;
 padding-bottom: 20px; 
 white-space: nowrap;
 text-align: left;
 /*font-family: "Freestyle Script", "Californian FB", Comic Sans MS;*/
 /*font-family: "Henny Penny", cursive;*/
 /*font-family: 'Devonshire', cursive;*/
 /*font-family: 'Parisienne', cursive;*/
 font-family: "Freestyle Script", "Zeyada", cursive;
}
.title_gray_frame span{
 margin-top:-20px;
 padding:0;
 float:right;
 color:yellow;
 font-family:Freestyle Script, Zeyada, cursive;
 font-size:1.4em;
}
.ui-state-default h2{
 margin:0;
 color: #E3E3E3;
}
.ui-state-active h2{
 margin:0;
 color: #222;
}

.sep_titre{
 border: none;
 height:2px;
 border-top: 1px solid #35353a;
 border-bottom: 1px solid #434549;
 width: 100%;
 margin:auto;
 margin-bottom: 20px; 
 margin-top: 10px;
}


/*************************************************************/
/********** Style pour réalisation / Image / Apercu ********/
/*************************************************************/
.apercu_realisation{
 float: left; 
 margin-left: 45px;
 margin-right: 50px;
 margin-top: 10px;
 margin-bottom: 20px;
 width: 192px;
 height: 60px; 
 box-shadow: 0px 0px 10px #333333;
}

.apercu_realisation img{
 z-index: 10;
 position: relative;
}

.supp_image_realisation{
 z-index: 20;
 position: relative;
 float: right;
 top: -57px;
 right: 3px;
 background-image: url(images/icone_suppr.png);
 width: 16px;
 height: 16px; 
 display: none;
 cursor: pointer;
}
/*************************************************************/
/********** Style pour les message d'erreur *************/
/*************************************************************/
.erreur_message {
 position: absolute;
 z-index:1000;
 width:350px;
 height:60px; 
 top:69px;
 left: 50%;
 margin-left: -175px;
 background-color:#ff4343;
 border: 1px solid #ef3535;
 box-shadow: 0px 0px 10px #ff4343;
}

.valid_message {
 position:absolute;
 z-index:1000;
 width:350px;
 height:60px; 
 top:69px;
 left: 50%;
 margin-left: -175px;
 background-color:#4EFB3E;
 border:1px solid #0D9600; 
 box-shadow: 0px 0px 10px #0D9600; 
}

/*************************************************************/
/* Formulaire */
/*************************************************************/
.input_formulaire{
 width: 100%; 
 border: none;
 background-color: #ECECEC;
 border-bottom: 1px dashed #CCC;
 border-right: 1px solid #FFF;
}

.input_horaire{
 width: 15px; 
 border: none;
 background-color: #ECECEC;
 border-bottom: 1px dashed #CCC;
 border-right: 1px solid #FFF;
}

.input_textarea{
 width: 100%;
 border: none;
 background-color: #ECECEC;
 border-bottom: 1px dashed #CCC;
 border-right: 1px solid #FFF;
}

.input_cp{
 width: 50px; 
 border: none;
 background-color: #ECECEC;
 border-bottom: 1px dashed #CCC;
 border-right: 1px solid #FFF; 
}

.input_ville{
 width: 200px; 
 border: none;
 background-color: #ECECEC;
 border-bottom: 1px dashed #CCC;
 border-right: 1px solid #FFF; 
}

.input_help{
 color: green;
 font-size: 10px;
 font-style: italic;
}

.form_label{
 text-align: center;
 color: #505050 !important;
 white-space: nowrap;
 font-size: 12px;
 height: 30px;
 background-color: #1f1f1f;
 padding-left: 10px;
 padding-right: 10px;
 width: 40px;
}

.form_field{
 height: 30px;
 background-color: #47474b;
 background-image: url(images/sep_vertical_form.png);
 background-repeat: no-repeat;
 background-position: left center;
 border-top: 1px solid #333336;
 border-right: 1px solid #333336;
}

.form_field_empty{
 height: 0;
 text-align: right;
}

.verif{
 background-color: #FFF2D9;
 border-bottom: 1px dashed #FFD37B; 
}

.hilight nobr{
 color: #FFB400; 
}

.apercu_image{
 width: 135px;
 height: 130px;
 float: left;
 margin-bottom: 20px;
 margin-right: 15px;
}

.apercu_image table img{
 box-shadow: 0px 0px 10px #333333;
}

/***********************************************************************/
/****** Gestion des Cadres / Titres */
/***********************************************************************/
.gray_frame_master{
 border: 1px solid #cccccc;
 -webkit-border-radius: 3px;
 -moz-border-radius: 3px;
 border-radius: 3px;
 padding: 3px;
 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f9f9f9) );
 background-image: -webkit-linear-gradient(top, #ffffff, #f9f9f9);
 background-image: -moz-linear-gradient(top, #ffffff, #f9f9f9);
 background-image: -ms-linear-gradient(top, #ffffff, #f9f9f9);
 background-image: -o-linear-gradient(top, #ffffff, #f9f9f9);
 background-image: linear-gradient(top, #ffffff, #f9f9f9);
 padding-bottom: 20px;
 margin-bottom: 10px;
}

.titre_gray_frame_master{
 height: 35px;
 border: 1px solid #a3a3a3;
 -webkit-border-radius: 3px;
 -moz-border-radius: 3px;
 border-radius: 3px;
 background-image: url(images/bg_titre_gray_frame.png);
 background-repeat: repeat-x;
 font-size: 17px;
 line-height: 35px;
 margin-bottom: 10px;
 padding-left: 10px;
 color: #FFFFFF;
}