/* Commun */
.float-left{
    float:left;
}
img{
    border:0;
}
.pad-10{
    padding:10px;
}
.pad-10-top{
    padding-top:10px;
}
.clear-both{
    clear:both;
}
p{
    color:#ffffff;
}
/* Fin commun */

.content{
    /*width:320px;*/
    margin-left:auto;
    margin-right:auto;
}
.content-land{
    float:left;
    width:320px;
}

/* Formulaire connexion */
.zone_connexion{
    padding:5px;
}
.identifiant{
    width:150px;
    font-size:16px;
    padding:2px
}
.password{
    width:150px;
    font-size:16px;
    padding:2px;
}
.valide-con{
    font-size:14px;
}
.msg-error{
    font-size:12px;
    color:#990000;
}


/* Header */
.header-big{
    height:63px;
    /*width:300px;*/
    background:repeat-x url(/images/fd-big-header.png);
    padding:15px 0 0 20px;
}
.header-big .titre{
    font-size:32px;
    font-weight:bold;
    letter-spacing:-2px;
    color:#ffffff;
}
.ext{
    position:relative;
    font-weight:bold;
}
.header-big .slogan{
    color:#CA9000;
    font-size:12px;
    position:relative;
    top:-3px;
}
.header-small{
    margin-right:auto;
    margin-left:auto;
    height:24px;
    /*width:300px;*/
    background:repeat-x url(/images/fd-small-header.gif);
    padding:3px 0 0 20px;
}
.header-small .titre-small{
    font-size:18px;
    font-weight:bold;
    letter-spacing:-2px;
}
.ext-small{
    position:relative;
    font-size:12px;
    font-weight:bold;
}

.header-big .btn-decon{
    position:relative;
    left:0px;
    top:-100px;
    line-height:12px;
    float:right;
}
.header-small .btn-decon{
    position:relative;
    left:0px;
    top:-25px;
    line-height:12px;
    float:right;
}
.btn-logout{
    background:no-repeat url(/images/logout.png);
    width:25px;
    height:22px;
    border:0;
}

/* Fin Header*/

.bas_header{
    margin-left:auto;
    margin-right:auto;
    width:902px;
}

.container{
    margin-left:auto;
    margin-right:auto;
    width:902px;
}

/* Footer */
.footer{
    /*width:320px;*/
    height:17px;
    text-align:center;
    font-size:12px;
    line-height:17px;
    color:#999999;
    clear:both;
    border-top:1px solid #464646;
}
/**/

/* Zone connexion */
.z-connexion{
    width:295px;
    padding:20px 0 10px 15px;
    margin-right:auto;
    margin-left:auto;
}
.z-connexion .label{
    float:left;
    line-height:30px;
    position:relative;
    width:130px;
    font-weight:bold;
    font-size:12px;
}
.z-connexion .identifiant{
    width:149px;
    line-height:25px;
    margin-bottom:10px;
    font-size:14px;
}
.z-connexion .password{
    width:149px;
    line-height:25px;
    margin-bottom:10px;
    font-size:14px;
}
.z-connexion .valide-con{
    height:45px;
    width:100px;
    background:no-repeat url(/images/btn-connexion.jpg);
    float:right;
    border:0;
}
/* Fin zone connexion */


/* Liste caméra */
.liste-camera{

}
.liste-camera ul{
    list-style:none;
}
.liste-camera ul li{
    height:78px;
    /*width:320px;*/
    background:repeat-x url(/images/fd-liste-cam.png);
    cursor:pointer;
}
.liste-camera .lst-cam-img{
    width:85px;
    height:68px;
    float:left;
    padding:10px 0 0 15px;
}
.liste-camera .lst-desc-cam{
    width:150px;
    height:63px;
    padding:15px 0 0 0;
    float:left;
    font-size:12px;
}
.liste-camera .lst-nom-cam{
    color:#CA9000;
    font-size:18px;
    line-height:22px;
}
.liste-camera .btn-fleche{
    float:right;
    padding:20px 20px 0 0;
}



.liste-camera ul li form{
    float:left;
    line-height:35px;
}
.liste-camera .btn-edit-cam{
    line-height:35px;
    position:relative;
    top:-12px;
    margin-left:5px;
}
.lst-mode-cam{
    width:160px;
    float:left;
    cursor:pointer;
}
.lst-mode-cam-titre{
    text-align:center;
    height:23px;
    background:repeat-x url(/images/fd-liste-cam.gif);
}

.lst-mode-lst{
	opacity:0.70;
	background-color:black;
	position:absolute;
	height:73px;
	width:892px;
	padding-left:10px;
	padding-top:5px;
}

.lst-mode-quadri{
	opacity:0.70;
	background-color:black;
	position:absolute;
	height:235px;
	width:310px;
	padding-left:10px;
	padding-top:5px;
}

/* Fin liste caméra */

/* Gestion button */
.button
{
   /* Set a button to be a block so its height and width can be adjusted */
	display: block;	

	font-size: 14px;
	font-weight: bold;
	font-family: Helvetica, sans-serif;
	color: #fff;

	text-decoration: none;
	text-align: center;
}
/*  Creates a button using a 18x30 image */
.black
{
    cursor:pointer;
    line-height: 49px;
    height:49px;
    width: 125px;

	margin:0 5px 0 5px;
	color: #fff;

}
/* Fin gestion button */
.black-small
{
    cursor:pointer;
    font-weight:normal;
    font-size:12px;
    line-height: 14px;
    height:49px;
    width: 45px;

	/*margin:0 5px 0 5px;*/
	color: #fff;
    margin-right:5px;
    margin-top:5px;

}
.black-small-icon{
    font-weight:normal;
    font-size:12px;
    line-height: 14px;
    height:49px;
    width: 45px;

	/*margin:0 5px 0 5px;*/
	color: #fff;
    margin-right:5px;
    margin-top:5px;
}
.black-small-icon img{
    margin-top:5px;
}

/**/
.commande{
    width:320px;
    padding:5px 0 5px 0;
    /*
    margin-right:auto;
    margin-left:auto;
    */
}
.commande .left{
    float:left;
    width:150px;
    padding:5px;
}
.commande .right{
    padding:5px;
    float:right;
    width:150px;
}
.commande p{
    /*padding:5px 0 0 0;*/
}
.commande .label{
    float:left;
    line-height:30px;
    position:relative;
    width:65px;
    font-size:14px;
}
.commande img{
    /*margin-left:50px;*/
}

/**/
.commande-land{
    float:right;
    width:160px;
}
.commande-land .left{
    width:150px;
    padding:5px;
    clear:both;
}
.commande-land .right{
    width:150px;
    padding:5px;
    clear:both;
}
.commande-land p{
}
.commande-land .label{
    float:left;
    line-height:30px;
    position:relative;
    width:65px;
    font-size:14px;
}


/* Commande caméra */
/*
.commande .right{
    float:right;
    width:150px;
}
*/
.commande .right .zoom{
    width:25px;
    height:100px;
    float:left;
}
.commande-land .right .zoom{
    width:25px;
    height:45px;
}
.right .direction{
    float:right;
    width:95px;
    padding:5px 0 0 0;
}
.right .direction .btn-up{
    position:relative;
    left:30px;
}
.right .direction .btn-down{
    position:relative;
    left:30px;
}
.right .direction .btn-right{
    position:relative;
    left:20px;
}
.right .direction .btn-left{
    position:relative;
}
/* Fin commande caméra */


/* Edit cam */
.titre{
    /*padding:5px;*/
    margin-top:10px;
    font-size:14px;
    color:#CA9000;
    /*color:#999999;*/
}
.btn-edit-cam{
    padding-left:10px;
}
.form-edit-cam{
    padding:5px;
    font-size:14px;
}
.form-edit-cam .label{
    float:left;
    line-height:30px;
    position:relative;
    width:85px;
    line-height:20px;
}
.form-edit-cam input{
    line-height:20px;
    padding:2px;
    font-size:16px;
    width:215px;
}
.form-edit-cam textarea{
    padding:2px;
    font-size:16px;
    width:215px;
    height:60px;
}
/*Fin edit cam*/

.info-utilisateur{
    padding-top:3px;
    font-size:12px;
    color:#666666;
    text-align:right;
}

/* Canves modal*/
#canvasBackground
{
    padding-top:100px;
    text-align:center;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;

	/* Makes this div transparent */
	opacity: 0.80;
	position: absolute;
	background-color: white;

    /* This places this div's content on top of the images */
	z-index: 2;
}

.btn-fonction{
	padding-top:3px;
	float:left;
	font-size:11px;
	text-align:center;
	display:block;
	height:51px;
	width:69px;
	background:no-repeat url(/images/btn-fonction.png);
	color:#ffffff;
	text-decoration:none;
	cursor:pointer;
}