/*
    Document   : ossature
    Description:
        CSS de structure des pages.
*/
body { font-size: 13px; }

/********************************** Design des liens **************************************/

a { border:none; text-decoration:underline; font-size:inherit; outline: none; }


/********************************** STRUCTURE DU SITE **************************************/

#bigDiv {
	display: block;
	position: absolute;
	top: 0px; bottom: 0px; left: 0px; right: 0px;
	overflow: hidden;
}

#topPage {
	position: absolute;
	top: 0px; left: 10px; right: 10px;
	height: 90px;
	display : none;
}
	#logo {
        text-align : center;
        margin     : 15px 0;
	}
    .version {
        font-size : 1.4em;
        color     : #726a64;
    }
	#titrePage {
        position    : absolute;
        top         : 20px;
        right       : 400px;
        left        : 350px;
        padding     : 5px;
        font-size   : 1.5em;
        font-weight : bold;
	}
	#connexion {
        position  : absolute;
        top       : 20px;
        right     : 0px;
        width     : 300px;
        padding   : 5px;
        font-size : 0.9em;
	}
	#connexionRobert {
        display     : flex;
        flex-flow   : row wrap;
        align-items : baseline;
        margin      : 25px 10%;
        font-size   : 1.4em;
        text-align  : left;
	}
    .connexion-label {
        flex      : 0 0 100%;
        margin    : 10px 0;
        font-size : 0.95em;
        color     : #858585;
    }
    .connexion-input {
        flex             : 2;
        background-color : #f1ede9;
        color            : #564c43;
        border           : 1px solid #b6a291;
        border-radius    : 3px;
        padding          : 7px 10px;
        margin           : 0 5px 0 0;
        box-shadow       : inset 0 0 3px rgba(0, 0, 0, .2);
    }
    .connexion-submit {
        flex   : 1;
        margin : 0 !important;
    }

    .connexion-message {
        margin     : 30px 10%;
        padding    : 10px 15px;
        font-size  : 1.5em;
        text-align : center;
    }

    .connexion-welcome {
        margin     : 30px 10%;
        text-align : center;
    }
    .connexion-welcome a {
        text-decoration: underline !important;
    }

    @media(min-width: 1055px) {
    	#connexionRobert {
            margin: 25px 20%;
        }
        .connexion-message {
            margin: 30px 20%;
        }
        .connexion-welcome {
            margin: 50px 20%;
        }
    }

#footPage {
	position: absolute;
	bottom: 0px; left: 10px; right: 10px;
	height: 30px;
	font-size: 0.8em;
}
	#licence {
		position: absolute;
		top: 0px; left: 0px;
		width: 50%;
		padding: 5px;
	}
	#mentions {
		position: absolute;
		top: 0px; left: 50%; right: 200px;
		padding: 5px;
	}
	#siteMap {
		position: absolute;
		top: 0px; right: 0px;
		width: 200px;
		padding: 5px;
	}

#Page {
	position   : absolute;
	top        : 0;
	right      : 0;
	bottom     : 0;
	left       : 0;
	z-index    : 500;
	overflow-y : auto;
	overflow-x : hidden;
	padding    : 0px;
}

.colonne {
    top        : 0;
    bottom     : 0;
    overflow-y : auto;
    overflow-x : hidden;
}
.L {
    position   : absolute;
    left       : 0;
    right      : 90.2%;
    padding    : 8px;
}
.C {
    position   : absolute;
    left       : 10%;
    right      : 10%;
    box-shadow : 0 1px 3px #888888;
    z-index    : 500;
}
.R {
    position   : absolute;
    left       : 90.2%;
    right      : 0;
    padding    : 8px;
 }


#versionRobert {
    position   : absolute;
    bottom     : 5px;
    left       : 0px;
    right      : 0px;
    text-align : center;
}


.pageContent {
    position  : absolute;
    top       : 60px;
    bottom    : 5px;
    left      : 8px;
    right     : 8px;
    font-size : 1em;
}

#listingPage {
	position: absolute;
	top: 0px; bottom: 5px;
	left: 0px; right: 0px;
	overflow: auto;
	box-shadow: inset 0 0 6px #888888;
	overflow-y: auto;
	overflow-x: hidden;
}

#modifieurPage {
	position: absolute;
	left: 0px; right: 0px;
	height: 250px;
	bottom: 5px;
	box-shadow: 2px 2px 10px 2px #666666;
}

.ajouteurPage {
	padding: 20px 10px 40px 10px;
	text-align: center;
	font-size: 1.2em;
	box-shadow: inset 0 0 8px #888888;
}

/************************************* MENUS  ******************************************/
/* Menu principal */
.menu_icon {
    position      : relative;
    width         : 99%;
    text-align    : center;
    margin-bottom : 10px;
    box-shadow    : 1px 2px 2px #BBBBBB;
    font-size     : .85vw;
}
.menu_icon:hover {
    left       : -1px;
    top        : -1px;
    box-shadow : 3px 7px 4px #BBBBBB;
}
.menu_icon:active { box-shadow: none; }
.img_menu {
    max-width: 90%;
}

/* SousMenus des pages */
.sousMenuPage { position: relative; top:35%; width: 99%; text-align: center; font-size: 1.2em; }
.sousMenuIcon { box-shadow: 3px 3px 10px #777777; }
.sousMenuIcon:active { box-shadow: none; }

.miniSousMenu {
    padding-top: 5px;
}

.Vseparator	  { height: 40px; width: 0px; border: 3px double; margin: 0px 15px;
			    -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }

#retourAjax {
	position: fixed;
	display: none;
	top: 5px;
	right: 10.2%;
	width: 30%;
	padding: 12px 5px 0px 10px;
	z-index: 9999;
	box-shadow: 0px 3px 10px #666666;
}

/************************************ TABLEAUX ******************************************/
.tableListe { width: 100%; text-align: center; border-collapse: collapse; box-shadow: 0 5px 10px #888888; }
.tableListe td { padding: 3px; }
.tableListe td[popup] { cursor: pointer; }


/************************************* BOUTONS ******************************************/

.bouton			{ box-shadow: 1px 2px 2px #BBBBBB; }
.bouton:hover	{ left: -1px; top: -1px; box-shadow: 2px 5px 4px #BBBBBB; }
.bouton:active	{ box-shadow: none; }

.boutonMenu {
    position: relative;
    display: inline-block;
    font-weight: normal;
	cursor: pointer;
    overflow: visible;
    padding: 0;
    text-align: center;
    text-decoration: none !important;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	padding: 4px 8px;
    margin: 0px 8px;
}
.boutonMenu a { text-decoration: none !important; font-weight: normal; }

#btnClose{ float: right; cursor: pointer; margin-right: 10px; margin-top: 2px; }

select { padding: 3px; font-size: 0.9em; border: 1px solid; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }

*[popup] { cursor: pointer; }

.hide { display: none; }
.show { display: block; }


/********************************** CLASSES UTILES **************************************/

.shadowOut	{ box-shadow: 2px 2px 8px #888888; }
.shadowIn	{ box-shadow: inset 0 0 8px #888888; }

.center		{ text-align: center; }
.leftText	{ text-align: left; }
.rightText	{ text-align: right; }

.tiers		{ width: 32%; }
.deuxTiers	{ width: 65%; }
.demi		{ width: 49%; }
.quart      { width: 24%; }
.cinquieme  { width: 19%; }

.pico		{ font-size: 0.2em; }
.nano		{ font-size: 0.4em; }
.micro		{ font-size: 0.6em; }
.mini		{ font-size: 0.8em; }
.petit		{ font-size: 0.9em; }
.moyen		{ font-size: 1.1em; }
.gros		{ font-size: 1.2em; }
.big		{ font-size: 1.4em; }
.enorme		{ font-size: 1.5em; }

.pad3		{ padding: 3px;  }
.pad5		{ padding: 5px;  }
.padH5		{ padding-top: 5px; padding-bottom: 5px; }
.pad10		{ padding: 10px; }
.pad20		{ padding: 10px 20px; }
.pad30L		{ padding-left: 30px; }
.padV10		{ padding-left: 10px; padding-right: 10px; }
.padB5      { padding-bottom: 5px; }
.padB10     { padding-bottom:10px; }

.noMarge	{ margin: 0px; }
.marge30l	{ margin-left: 30px; }
.marge10l	{ margin-left: 10px; }
.marge30r	{ margin-right: 30px; }
.marge10r	{ margin-right: 10px; }
.margeTop5	{ margin-top: 5px; }
.margeTop10	{ margin-top: 10px; }
.marge15bot { margin-bottom: 15px; }
.marge5		{ margin:  5px; }
.marge10	{ margin: 10px; }

.inline		{ display: inline-block; }
.top		{ vertical-align: top; }
.mid		{ vertical-align: middle; }
.bot		{ vertical-align: bottom; }

.floatRight	{ float: right; }
.floatLeft	{ float: left; }

.miniCal	{ font-size:0.6em; display: inline-block ; }

.red		{ color:#f00; }

.doigt		{ cursor: pointer; }

.bordFin	{ border:1px solid black; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; }

.gras		{ font-weight: bold; }

/******************************* RETOUCHES JQUERY UI *************************************/


.ui-widget-header { cursor:default; }
.ui-dialog		  { box-shadow: 12px 16px 30px 10px #666666;  }


/********************************* TOOLTIPS POPUPS ***************************************/

#toolTipPopup {
	position: absolute;
	display: none;
	left: 40%;
	top: 40%;
	width: 300px;
}

.structInfos{  }
.structInterlock {}
.info{ width:250px; display:inline-block; }
.structItem { }
.interlock { display:inline-block; width:150px; heigth:150px;  }
.interlockItem {   }