* {position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; margin: 0px; padding: 0px; font-family: inherit;font-size: inherit;}

html {margin:0;  padding:0;}
body {font-family: 'Raleway', sans-serif; color: #000; background-color: #fff; font-size: 10px;
	background: url(../upload/new_enseirb.jpg) no-repeat center fixed;  
	-webkit-background-size: cover; /* pour Chrome et Safari */
  	-moz-background-size: cover; /* pour Firefox */
	-o-background-size: cover; /* pour Opera */
	background-size: cover; /* version standardisée */}

/* harmonisation */
button, img {border: 0}
button {cursor: pointer;}
ul, li {list-style: none;}
ul.ui-tabs-nav li {list-style: none !important; margin: 0 !important;}
.ui-widget {font-family: 'Raleway', sans-serif; font-size: 1em;}
a {text-decoration: none; color: inherit;}
.nofloat {clear: both}
.left {float: left; margin-right: 10px;}
.right {float: right; margin-right: 10px;}
.noleft {clear: left}
.droite {float: right;}
.center {text-align: center;}
.barre {background: url(../images/warning.jpg) no-repeat left center; padding-left: 35px!important; background-size: 20px; background-position-x: 5px;}
.bold {font-weight: bold;}

input, select, textarea {font-family: 'Raleway', sans-serif !important; }

#okMsg {background-color: #D9E6A7; border: 2px solid #97AF3C; color: #97AF3C; padding: 15px; font-size: 1.3em; margin-bottom: 15px;}
#errMsg {background-color: #E2B6A0; border: 2px solid #AF623C; color: #AF623C; padding: 15px; font-size: 1.3em; margin-bottom: 15px;}


.bloc {background: #fff; margin: 10px;}
#logo {position: relative; float: left; width: 25%; max-width: 350px; height: 100px; background: #fff; margin: 10px;}
#logo img {width: 100%; max-width: 200px;}
#logo div {font-size: 1.3em; margin: 0 0 0 10px; font-weight: bold;}

/* MENU */
#menu {position: relative; float: left; width: 43%; max-width: 340px; height: 100px; font-size: 1.3em; font-weight: 800; padding: 10px; }
.connected {max-width: 530px !important; }
#menu .item {float: left; width: 50%; padding: 5px 0; text-transform: uppercase;}
.connected .item {width: 33% !important; }
#menu .item:hover {background: #E20881; color: #fff;}
#menu .item:hover span.puce {color: #000;}
span.puce  {color: #E20881;}
#menu .ssmenu {display: none; z-index: 10; padding: 10px; position: absolute; background-color: #E20881; color: #fff; top: -10px; left: 100%; width: 200px; min-height: 100px; }
#menu .item:hover .ssmenu {display: block}
#menu .ssmenu .ssitem {padding: 2px 0;}
#menu .ssmenu .ssitem:hover {color: #000;}

#espace {float: left; height: 100px; width: 13%; max-width: 190px;}
	
#identite {position: relative; float: left; width: 25%; max-width: 250px; height: 100px;  font-size: 1.3em; font-weight: 800; padding: 10px; }
#identite .item {width: 100%; margin: 5px 0;}
#identite .item a.lnk {font-size: 0.9em; font-weight: normal;} 
#identite label {float: left; width: 50%; font-weight: normal;}
#identite .input {float: left; width: 50%; margin: 2px 0; height: 1.4em}
#identite .mini {font-weight: normal; font-size: 0.7em;}
#identite  a.mini:hover {color: #E20881 !important}
#gauche {float: left; width: 25%; max-width: 350px; margin: 10px;}
#gauche a:hover {color: #E20881}
.bloc {padding: 8px 5px; margin: 0 0 20px 0;}
.bloc .titre {border-top: 1px solid #000; border-bottom: 3px solid #000; text-transform: uppercase; font-size: 1.3em; font-weight: bold; margin: 0 0 10px 0; padding: 2px;}
.bloc .content {font-size: 1.3em;}

#top {float: left; width: 70%; max-width: 800px; padding: 10px; font-size: 1em;}
#top .titre {border-top: 1px solid #000; border-bottom: 3px solid #000; text-transform: uppercase; font-size: 1.3em; font-weight: bold; margin: 0 0 10px 0; padding: 2px;}
#top .content {font-size: 1.3em;}
#top .item {float: left; width: 25%; margin: 7px 0; text-transform: uppercase;}

#main {float: left; width: 70%; max-width: 800px; min-height: 500px; padding: 20px; font-size: 1.2em;}
#main ul li {list-style: disc; margin: 0 0 0 20px;}
#main ol li {list-style-type: decimal; margin: 0 0 0 20px;}
#main label {float: left; width: 40%; max-width: 200px;}
#main .formInput {float: left; width: 50%; max-width: 300px; min-height: 25px;}
#main .field .nofloat {height: 5px;}
.submit {border: none; cursor: pointer; background: linear-gradient(to bottom, #0088CC, #0044CC);  background: -webkit-linear-gradient(top right, #0088CC, #0044CC);  background: -moz-linear-gradient(to bottom, #0088CC, #0044CC);  background: -ms-linear-gradient(to bottom, #0088CC, #0044CC); color: #fff!important ; padding: 3px 7px;}
.submit:hover {color: #000; }

#main h2 { border-bottom: 1px solid #000; text-transform: uppercase; font-size: 1.1em; font-weight: bold; margin: 0 0 10px 0; padding: 2px;}

#actus h1, #main h1 { border-bottom: 3px solid #000; text-transform: uppercase; font-weight: bold; margin: 0 0 10px 0; padding: 2px;}
#actus h1 {font-size: 1.3em;}
#main h1 {font-size: 1.3em;}
#main #edit h1 {font-size: 1em;}
#actus h1 span, #main h1 span {border-top: 1px solid #000; padding: 2px; color: #E20881;}
#actus .item .titre {border-bottom: 1px solid #000; text-transform: uppercase; font-size: 1.3em; font-weight: bold; margin: 0 0 10px 0; padding: 2px;}
#actus .item .titre.une {border-bottom: 1px solid #44A9DE; color: #44A9DE; font-size: 1.7em;}
#actus .item .titre a:hover, #actus .item .soustitre a:hover {color: #E20881 !important}
#actus .item .illus {float: right; margin: 10px 0 10px 30px; width: 45%;}
#actus .item .illuslarge {width: 100%;}
#actus .item .content {font-size: 1.3em; margin: 0 0 15px 0;width: 45%; padding: 15px 0 0 0; text-align: justify;}
#actus .item .contentLarge {width: 100%;}
#actus .item .content .more {color: #E20881 !important; font-size: 0.9em; margin: 5px 0}
#actus .item .content .more:hover {color: #AAA !important;}

#actu h1, #main h1 { border-bottom: 3px solid #000; text-transform: uppercase; font-weight: bold; margin: 0 0 10px 0; padding: 2px;}
#actu h1 {font-size: 1.3em;}
#actu h1 span {border-top: 1px solid #000; padding: 2px; color: #E20881;}
#actu .item .titre {border-bottom: 1px solid #000; text-transform: uppercase; font-size: 1.3em; font-weight: bold; margin: 0 0 10px 0; padding: 2px;}
#actu .item .titre a:hover, #actu .item .soustitre a:hover {color: #E20881 !important}
#actu .item .illus {float: right ; margin: 0 0 30px 30px; width: 45%;}
#actu .item .illuslarge {width: 100%;}
#actu .item .content {font-size: 1.3em; margin: 0 0 15px 0; padding: 15px 0 0 0; text-align: justify;}
#actu .item .content p { margin-bottom: 10px;}
#actu .item .content .more {color: #E20881 !important; font-size: 0.9em; margin: 5px 0}
#actu .item .content .more:hover {color: #AAA !important;}
#actu .item .content a {color: #E20881;}
#actu .item .content a:hover {text-decoration: underline;}

/* Mon Compte */
#compl {width: 70%; background: #DFAABC; height: 15px; float: left; margin-right: 15px;}
#compl div {background: #D90775; height: inherit;}
#complVal {color: #D90775; font-size: 1.2em}
#gauche .content .item {margin: 7px 0;}
#gauche .content .item button {background: red; color: #fff; padding: 3px;}


/* Edit */
#edit {font-size: 1.3em;}
#edit .tblEntete { border-bottom: 3px solid #000; text-transform: uppercase; font-size: 1em; font-weight: bold; margin: 0 0 10px 0; padding: 2px;}
#edit .tblEntete span {border-top: 1px solid #000; padding: 2px; color: #E20881;}

.content .tblEntete {color: #fff; background: linear-gradient(to bottom, #0088CC, #0044CC);  background: -webkit-linear-gradient(top right, #0088CC, #0044CC);  background: -moz-linear-gradient(to bottom, #0088CC, #0044CC);  background: -ms-linear-gradient(to bottom, #0088CC, #0044CC); padding: 5px;}
.tblEntete a {color: #efefef;}
.tblEntete a:hover {color: #58BCD5;}
.tblEntete .onglet {border: 1px solid orange; background-color: orange; cursor: pointer; font-size: 0.9em;padding: 2px; color: #585D62; background: -webkit-linear-gradient(top right, #fff 0%, orange 95%); background: -moz-linear-gradient( #fff 0%, #1E1817 95%); background: -ms-linear-gradient( #fff 0%, orange 95%); background: -o-linear-gradient( #fff 0%, orange 95%); background: linear-gradient( #fff 0%, orange 95%);} 
.listeElt { overflow: auto; padding: 5px 0px; font-size: 1em; height: 600px;}
.tblOff, .tblOn {min-height: 25px; border-bottom: 1px solid #ccc; padding: 3px;}
.tblOn, .tblOff:hover {background-color: #AEBAC5;}
.statut0 {border-left: 5px solid red;}
.statut1 {border-left: 5px solid green;}
.statut2 {border-left: 5px solid orange;}
.statut3 {border-left: 5px solid violet;}
.btnDel {cursor: pointer; background-color: #CF4D47; border: none; padding: 3px; -webkit-appearance: none; color: #fff!important;}
.btnDel:hover {background-color: #CF261E; color: #fff!important;}
.btnSave {cursor: pointer; background-color: #A7CF47; color: #fff; border: none; padding: 3px; -webkit-appearance: none;}
.btnSave:hover {background-color: #ADF00D; color: #fff!important;}
.btnSave2 {cursor: pointer; background-color: orange; color: #fff; border: none; padding: 3px; -webkit-appearance: none;}
.btnSave2:hover {background-color: #ADF00D; color: #fff!important;}
.btnAction {margin: 10px 0;}
.sites {margin: 10px 20px;}
#formElt .titre {font-size: 1.2em; font-weight: bold; margin: 30px 0 10px 0;}
#formElt .sstitre {font-weight: bold; font-style: italic; margin: 0 0 10px 70px; float: left; width: 18%; padding-left: 10px;}
#formElt .infoblc {float: left; width: 64%; margin: 0 0 10px 0; }
#formElt label {float: left; width: 40%; max-width: 200px;}
#formElt label input {margin: 0 10px 0 0;}
#formElt .formInput {float: left; width: 50%; max-width: 350px; min-height: 25px; padding: 3px 5px;}
#formElt .formInput[type=checkbox] {width: 15px;}
#formElt.largeForm label {float: left; width: auto; margin-right: 10px; max-width: none;}
#formElt.largeForm .formInput {float: left; width: 40%; max-width: none;}
#formElt .nofloat {height: 5px;}
.formDisable {float: left; width: 40%; min-height: 25px; border: none; background-color: inherit; font-weight: bold;}
#formElt .formDisable {width: 70%}
#formElt #tabs .formDisable {width: 40%}
#formElt #tabs .formDisable a {color: #E20881;}
#formElt #tabs .formDisable a:hover {text-decoration: underline;}
.formDisableLarge {float: left; width: 80%; min-height: 25px; border: none; background-color: inherit; font-weight: bold;}
#edit .desc {margin: 0 0 15px 0; font-size: 0.8em; color: gray; font-style: italic}
.recopie {margin: 3px 0; cursor: pointer;}
.recopie:hover {background-color: #eee;}
#edit a:hover {color: #E20881 !important}
.tohidePoste {display: none;}
.poste {cursor: pointer;}
.poste:hover {color: #E20881;}
	
/* Annuaire */
#searchForm {font-size: 1.1em}
#searchForm label {float: left; width: 30%; margin: 5px 0 0 0; }
#searchForm .puce {color: #E20881;}
#searchForm .inputBox {float: left; width: 15%; margin: 5px 10px 0 0; height: 17px;}
#searchForm .submitBox {color: #E20881; font-weight: 800; margin: 5px 0 0 0; border: none; background-color: transparent; cursor: pointer;}
#liste h1 span {color: #E20881;}
#liste .head {color: #E20881;}
#liste table {width: 100%; margin: 20px 0; font-size: 1.2em;}
#liste td {border-left: 1px solid #000 !important; margin: 0; padding: 5px 0 5px 10px; width: 20%;}
#liste table.societes td {width: auto!important; min-width: 50px;}
.ui-tabs-panel #liste td {width: auto!important;}
#liste tr.detail td { border-left: none !important; margin: 0; padding: 5px 0 5px 10px; width: 20%; background: #fbfbfb;}
#liste td.sans {border: none !important; width: 50px!important;}
#liste tr:hover {background-color: #F7F6F7; cursor: pointer;}

/* attestation */
.attest td {width: auto!important; padding: 5px!important;}

/* Evenement */
#evt .illus, #evt .info {float: left; margin: 10px 20px 10px 0; width: 40%; max-width: 310px; font-size: 1.2em;}
#evt .desc {margin: 20px 0; font-size: 1.2em;}
#evt .desc  p{margin-bottom: 10px;}
#evt .info span span {font-weight: bold;} 
#evt a:hover {color: #E20881}

.tools {margin-right: 10px; float: right;}


/* Sondage */
tr.sel:hover {background: lightgrey}
.res {float: left; width: 45%; background: #DFAABC; height: 15px; float: left; margin-right: 15px;}
.res div {float: left; background: #D90775; height: inherit;}
.res .val {color: #D90775; font-size: 1em; margin-left: 10px; position: absolute;}
.resVote {color: #D90775; font-size: 1.3em; float: left; margin-left: 10px;}
#mySond label.error {float: none; margin: 0 0 0 -90px;}

input.error, select.error, textarea.error {border: 1px solid #FF3300;color : #FF3300;}
label.error {margin-left: 20px; font-weight: normal; color: red; width: 10px !important; background:url("../images/error.png") no-repeat 0px 0px;  padding-left: 16px; float: right;}
input.valid, select.valid, textarea.valid {border: 1px solid green;}
label.success {margin-left: 20px; background:url("../images/ok.png") no-repeat 0px 0px; padding-left: 16px; width: 20px; height: 15px;}

.ui-autocomplete {z-index:1000}
.ui-dialog .ui-dialog-content {font-size: 1.3em;}	

.smart {display: none;}
.nosmart {display: block;}
#slickmenu,.slicknav_menu {display: none;}

/***** 1024px *****/
@media  screen and (max-width: 1024px) {
	#espace {width: 0px !important;}
	#logo div, #menu {font-size: 1.1em} 
	#top .item { width: 30%}
}

@media  screen and (max-width: 640px) {
    body {font-size: 10px;}
    .smart, .slicknav_menu {display: block;}
    .slicknav_menu {background: #fff; margin-bottom: 10px;}
    .slicknav_brand {float: left;color: #fff;height: 44px;}
    .slicknav_nav {background: #fff;}
    .slicknav_nav .item {border-bottom: 1px solid #4A4040}
    .slicknav_nav a {color: #4A4040;}
    .nosmart {display: none;}
    #main {float: none; width: 100%;margin: 0 0 100px 0;}
    #actus .item {margin-top: 20px;}
    #actus .item .soustitre {margin-bottom: 5px;}
    #actus .item .illus, #actu .item .illus {width: 100%; margin: 10px 0;}
    #actus .item .content, #actu .item .content {width: 100%; font-size: 1.5em; line-height: 1.6em;}
    #actu h1 {font-size: 1.4em;}
    #actu h1 span {border-top: none!important;}
    
    .slicknav_menu span.puce {display: none; }
    .decaltop {top: 0px;}
    
    #top {float: none; width: 100%; font-size: 7px; margin: 10px 0;}
    
    #searchForm label {width: 45%;}
    #searchForm .inputBox {width: 50%;}
    #formElt label {width: 100%;}
    #formElt .formInput {width: 100%;}
    
    #evt .illus, #evt .info {width: 100%;}
    .ui-tabs .ui-tabs-nav li {width: 100%!important;}
    #searchForm .submitBox {display: block; margin-left: 0!important;}
    
    .listeElt {height: 85px; min-height: 0; overflow: auto;}
}