/*
Theme Name: optl
Theme URI: http://www.ankweb.com/
Description: The theme created by Franck Vallet.
Version: 1
Author: Franck Vallet

Creation Theme by Franck Vallet || http://www.ankweb.com
*/

/*/////////////////////////////////////////////
/////////////////////BODY/////////////////////
///////////////////////////////////////////*/
html, body {height:100%; margin:0; padding:0;}
html {font-size:100%;}
body {color:#333333; font-family:verdana, tahoma, arial, sans-sherif; font-size:11px; background:#ffffff;}
html>body div#conteneur {height:auto; min-height:100%;}

div#sous_footer {position:relative; bottom:0; left:0; width:100%; height:40px; margin:0 0 -40px 0; padding:0; background:url(http://www.optl.fr/images/background_footer3.png) 0 0 repeat-x; z-index:1;}

div#conteneur {position:relative; top:0; left:0; width:980px; height:100%; min-height:100%; margin:0 auto; background:#ffffff url(http://www.optl.fr/images/background_conteneur.png) bottom right no-repeat; z-index:2;}

img, div, h1, h2, h3, p, ul, li, a {border:0; margin:0; padding:0;}

h1, h3 {color:#927C57;}

h2 {color:#f7951f;}

div.clear {width:100%; clear:both; height:1px; font-size:1px; line-height:1px; background:none;}



div#header_gch {position:absolute; top:0; left:0; width:50%; height:215px; margin:0; padding:0; z-index:1; background:url(http://www.optl.fr/images/background_header_gch2.png) top right no-repeat;}
div#header_drt {position:absolute; top:0; right:0; width:50%; height:215px; margin:0; padding:0; z-index:1; background:url(http://www.optl.fr/images/background_header_drt2.png) top right repeat-x;}


/*///////////////////////////////////////////////
/////////////////////HEADER/////////////////////
/////////////////////////////////////////////*/
div#header {position:relative; top:0; left:0; width:980px; height:215px; margin:0; background:url(http://www.optl.fr/images/background_header.png) 0 0 no-repeat;}
div#logo {position:absolute; top:14px; left:0; width:255px; height:102px;}
div#observatoire {position:absolute; top:27px; right:0; width:336px; height:76px;}
div#photo_header {position:absolute; top:0; left:279px; width:282px; height:215px;}




/*/////////////////////////////////////////////////////
/////////////////////CONTENU HOME/////////////////////
///////////////////////////////////////////////////*/
div#sur_le_site {position:relative; top:0; right:0; width:725px; z-index:2;}
div#photo_accueil {position:absolute; top:85px; right:0; width:398px; height:280px; z-index:1;}
div#chiffres {position:relative; top:0; left:0; width:725px; z-index:2;}


ul.accueil {text-align:center; font-size:18px; color:#927C57; font-weight:bold; line-height:20px; margin:0 0 10px 0;}
ul.accueil li {text-align:left; font-size:14px; margin:12px 30px 6px 40px; list-style-type:none; line-height:20px; vertical-align:top;}
ul.accueil li img {margin:0 7px 0 0; vertical-align:top;}

ul.accueil2 {text-align:left; font-size:18px; line-height:24px; color:#927C57; font-weight:bold; margin:70px 0 10px 0;}
ul.accueil2 li {text-align:left; font-size:14px; margin:12px 30px 6px 40px; list-style-type:none; line-height:20px; vertical-align:top;}
ul.accueil2 li img {margin:0 7px 0 0; vertical-align:top;}

ul.accueil3 {text-align:left; font-size:18px; line-height:30px; color:#927C57; font-weight:bold; margin:0 0 10px 0;}
ul.accueil3 li {text-align:left; font-size:14px; margin:12px 30px 6px 40px; list-style-type:none; line-height:20px; vertical-align:top;}
ul.accueil3 li img {margin:0 7px 0 0; vertical-align:top;}

span.bleu {color:#EAA428; font-size:120%;}

.images{
		position: absolute;
		}

.accueilphoto{
		position: absolute;
		}


/* MISE EN FORME DU TEXTE "CHAMPS DE LA CONVENTION COLLECTIVE..."
------------------------------------------------------------*/
div.texte-convention {position:absolute; top;0; left:0; width:530px; height:346px; padding:20px 0 0 35px; line-height:1.4; color:#333333; font-size:17px; font-weight:bold; z-index:10;}
span.convention {font-variant:small-caps; font-size:22px; padding:0 0 0 50px;}
span.transport {font-variant:small-caps; font-size:22px; padding:0 0 0 100px;}
span.activites {font-variant:small-caps; font-size:22px; padding:0 0 0 150px;}
span.italic {font-style:italic; font-size:15px; font-weight:normal;}
span.chiffre {font-family:Times, verdana, tahoma; font-size:22px; color:#2781e6;}
span.etablissement {padding:0 0 0 20px;}
span.salarie {padding:0 0 0 50px;}
span.marchandise {padding:0 0 0 75px;}
span.voyageur {padding:0 0 0 100px;}
span.sanitaire {padding:0 0 0 125px;}
span.conducteur {padding:0 0 0 150px;}

div.texte {position:absolute; top;0; left:0; width:260px; height:92px; padding:10px 5px 0 10px; line-height:1.4; color:#ffffff; font-size:17px; font-weight:bold; z-index:10;}


/*////////////////////////////////////////////////
/////////////////////CONTENU/////////////////////
//////////////////////////////////////////////*/

/* LEFT
------------------------------------------------------------*/
div#left {position:relative; top:0; left:0; width:225px; margin:40px 0 0 0; padding:0; font-size:98%; float:left; z-index:50;}

/*----- ACCES PRIVEE -----*/
div#identification {position:relative; top:0; left:0; width:221px; height:146px; border:1px solid #927C57; margin:45px 0 0 1px;}
div.titre {position:relative; top:0; left:0; width:213px; height:28px; margin:0; padding:0 0 0 8px; line-height:28px; color:#ffffff; background:url(http://www.optl.fr/images/background_menu5.png) 0 0 repeat-x; font-weight:bold;}
div.intitule {position:relative; top:0; left:0; width:213px; line-height:18px; margin:0 0 0 8px;}
input.identification {position:relative; width:130px; height:15px; font-size:11px; line-height:13px; margin:0 0 6px 8px; padding:2px; background:#ffffff; border:1px solid #5f5f5f; vertical-align:top;}
/*----- Bouton Entrez -----*/
input.entrer,
input.entrer:link,
input.entrer:visited,
input.entrer:active,
input.entrer:focus {position:absolute; bottom:0; right:0; width:79px; height:21px; margin:0 5px 0 0; padding:0; border:none; background:url(../../../images/btn_validez.png) 0 0 no-repeat; cursor:pointer;}
input.entrer:hover {position:absolute; bottom:0; right:0; width:79px; height:21px; margin:0 5px 0 0; padding:0; border:none; background:url(../../../images/btn_validez.png) 0 0 no-repeat; cursor:pointer;}

div#traitement_ident {position:relative; top:0; left:0; width:223px; height:31px; margin:10px 0 0 1px; text-align:center; z-index:500;}

div.traitement {position:relative; top:0; left:0; width:223px; height:31px; margin:10px 0 0 1px; text-align:center; z-index:500; visibility:hidden;}

div#bon {position:relative; top:0; left:0; width:223px; height:31px; margin:10px 0 0 1px; text-align:center; font-weight:bold;}

div#erreur {position:relative; top:0; left:0; width:223px; height:31px; margin:10px 0 0 1px; text-align:center; font-weight:bold;}

div.mess_erreur {position:relative; width:223px; height:31px; margin:10px 0 0 1px; font-weight:bold; color:#ff0000; text-align:center;}

/* PAGE
------------------------------------------------------------*/
div.ariane {position:relative; top:0; left:0; width:725px; height:25px; padding:15px 0 0 0; margin:0 0 20px 0; line-height:15px; font-size:90%; color:#999999; background:url(http://www.optl.fr/images/background_titre_h1.png) bottom left repeat-x;}

div#contenu {position:relative; top:0; left:0; width:725px; margin:0 0 0 30px; padding:0; float:left;}



div.rapport {position:absolute; top:0; right:0; width:176px; height:48px; line-height:22px; padding:0 0 0 70px; margin:75px 0 25px 0; font-size:11px; font-weight:bold;}

div.adresse {position:relative; top:0; left:0; width:246px; line-height:22px; padding:0; margin:25px 0 25px 0; font-size:11px; font-weight:bold;}




/*///////////////////////////////////////////////
/////////////////////FOOTER/////////////////////
/////////////////////////////////////////////*/
div#clearFooter {position:relative; top:0; left:0; width:980px; height:40px; margin:0 0 0 4px; clear:both;}
div#footer {position:absolute; bottom:0; left:0; width:980px; height:40px; margin:0;}




/*/////////////////////////////////////////////////////////
/////////////////////COMPOSITION OPTL/////////////////////
///////////////////////////////////////////////////////*/
div.organisme {position:relative; top:0; left:0; width:100%; margin:0 0 50px 0; text-align:left;}
div.logo {position:relative; top:0; left:0; margin:0 50px 0 0; background:url(http://www.optl.fr/image/logo_composition_background.png) bottom left no-repeat; float:left;}
div.logo img {margin:0 0 5px 7px; padding:0;}




/*//////////////////////////////////////////////
/////////////////////CARTE/////////////////////
////////////////////////////////////////////*/
div.carte {position:relative; top:0; left:0; width:565px; height:558px; margin:0; background:url(http://www.optl.fr/image/fond_carte.jpg) 0 0 no-repeat;}

div.btn {position:absolute; top:0; left:0; width:20px; height:20px;}

a.fiche, a.fiche:link, a.fiche:visited, a.fiche:active, a.fiche:focus {display:block; top:0; left:0; width:20px; height:20px; background:url(http://www.optl.fr/image/btn_carte.png) 0 0 no-repeat;}
a.fiche:hover {display:block; top:0; left:0; width:20px; height:20px; background:url(http://www.optl.fr/image/btn_carte.png) 0 -100px no-repeat;}




/*//////////////////////////////////////////////////////
/////////////////////FICHE CONTACT/////////////////////
////////////////////////////////////////////////////*/
div.fiche_contact {padding:5px; background:url(http://www.optl.fr/image/logo_optl_fiche.png) 0 0 no-repeat;}
div.region {position:relative; top:0; left:0; margin:0 0 0 80px; width:300px; line-height:33px; color:#6f001a; font-weight:bold; font-size:16px; text-align:center;}
div.nom {position:relative; top:0; left:0; margin:8px 4px; padding:0 0 0 20px; line-height:16px; text-align:center; font-weight:bold; font-size:13px;}
div.tel {position:relative; top:0; left:0; width:190px; margin:8px 0; height:16px; line-height:16px; text-align:center; font-weight:bold; float:left;}
div.tel img {margin:0 8px 0 0; vertical-align:top;}
div.minicarte:hover {
	transform: scale(1.05,1.07); /* Change these numbers to suit your needs */
	-webkit-transform: scale(1.05,1.07);
	-moz-transform: scale(1.05,1.07);
	-ms-transform: scale(1.05,1.07);
	-o-transform: scale(1.05,1.07);

	position: relative;
	z-index: 99;
}




/*///////////////////////////////////////////////////////////
/////////////////////FICHE SYNTHES, TBR/////////////////////
/////////////////////////////////////////////////////////*/
div.fiche_doc {height: 400px; padding:5px; background:url(http://www.optl.fr/image/logo_optl_fiche.png) 0 0 no-repeat;}
div.region {position:relative; top:0; left:0; margin:0 0 0 80px; width:300px; line-height:33px; color:#6f001a; font-weight:bold; font-size:16px; text-align:center;}
div.doc {position:relative; top:0; left:0; width:300px; margin:8px 0 8px 80px; height:16px; line-height:16px; text-align:left; font-weight:bold;}
div.doc img {margin:0 8px 0 0; vertical-align:top;}
img.flip:hover {
	transform: scale(1.05,1.07); /* Change these numbers to suit your needs */
	-webkit-transform: scale(1.05,1.07);
	-moz-transform: scale(1.05,1.07);
	-ms-transform: scale(1.05,1.07);
	-o-transform: scale(1.05,1.07);

	position: relative;
	z-index: 99;
}






/* OMBRE MENU
box-shadow: 0px 3px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.4); ;-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.4); filter:progid:DXImageTransform.Microsoft.Shadow(color='#000000', Direction=135, Strength=3); ;zoom:1;*/