@charset "UTF-8";
/* CSS Document */

body {
    font-family: 'Open Sans', sans-serif;
    margin: 0px;
    padding: 0px;
    background: #e9eff7;
    font-size: 13px;
    color: #565656;
}

a{
	text-decoration:none;
	color: inherit; 
}

.relative{
	position:relative;
}

.relative_photo{
	position:relative;
}


.clear{
	clear:both;
	height:1px;	
}

.clear5px{
	clear:both;
	height:5px;	
}

.clear10px{
	clear:both;
	height:10px;	
}

.clear20px{
	clear:both;
	height:20px;	
}

.clear50px{
	clear:both;
	height:50px;	
}

.clear150px{
	clear:both;
	height:150px;	
}




.header{
	width:100%;
	min-width:1200px;
	height:90px;
	background:#FFFFFF;
	-webkit-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
	-moz-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
	box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);	
}


.header .container{
	width:95%;
	max-width:1200px;
	height:90px;
	box-sizing:border-box;
	padding-top: 13px;
	margin:auto;
	color:#333;
	
}

.header .container .logo{
	width:80px;
	height:60px;
	float:left;
	    position: relative;
    margin-left: 1%;
	padding-top:5px;
	margin-right: 20px;
}

/*
.header .container .logo::after{
	width: 1px;
    height: 27px;
    background: #000000;
    content: '';
    right: 0px;
    top: 18px;
    position: absolute;
}
//*/

.header .container .logo img{
	height:55px;
	height:45px;
}

.header .container .logo_leclerc{
	width:130px;
	height:30px;
	float:left;
	    position: relative;
	padding-top:14px;
}

.header .container .logo_leclerc img{
	width:100%;
}



.header .container .box--info--deconnexion{
	float: right;
    text-align: right;
    color: #011b45;
    width: 243px;
    background: #e9eff7;
    height: 60px;
    padding: 10px;
      border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.header .container .box--info--deconnexion .societe{
	font-size:19px;
	font-weight:300;
}


.main {
    width: 100%;
    height: auto;
    position: relative;
}

.main .login--box {
    width: 90%;
    max-width: 500px;
    min-height: 300px;
    height: auto;
    position: relative;
    background: #FFF;
    margin: auto;
    margin-top: 7%;
    border-radius: 3px;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
    box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
}


.main .login--box .head{
	width:100%;
	height:	50px;
	background: #265530;
	box-sizing:border-box;
	padding:15px;
	color:#FFF;
	font-weight:300;
	border-top-left-radius:3px;
	border-top-right-radius:3px;
	font-size:18px;
}

.main .login--box .form{
	width:90%;
	height:auto;
	margin:auto;
}

.main .login--box .form .champs--container{
	width:100%;
	height:40px;
	margin-top:30px;
}

.main .login--box .form .champs--container .champs{
	width:100%;
	height:40px;
	border:1px solid #BBBBBB;
	border-radius:3px;
	padding:5px;
	box-sizing:border-box;
}

.main .login--box .form .champs--container .login--btn{
    width: 90px;
    height: 20px;
    padding: 7px;
    background: #265530;
    border: none;
    color: #FFF;
    border-radius: 3px;
    font-size: 14px;
    float: right;
    position: relative;
	cursor:pointer;
}


.login--msg{
	font-size:12px;
	padding:5px;	
}

.floatLeft {
    float: left;
}

.floatRight {
    float:right;
}

.menu {
      width: 30px;
    height: 30px;
    padding: 5px;
    font-size: 24px;

    border-bottom: none;
    position: relative;
    float: left;
    top: 6px;
    color: #333;
    cursor: pointer;
	margin-right: 5px;
}


.footer{
	width:100%;
	min-width:1200px;
	height:30px;
    background:#265530;
	-webkit-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
	-moz-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
	box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);	
}


.footer .container{
	width:95%;
	max-width:1280px;
	height:30px;
	box-sizing:border-box;
	padding:5px;
	margin:auto;
	text-align:right;
	color:#FFF;
}


.col-50-2{
	width:49.5%;
	float:left;
}

.min-height-100
{
	min-height:100px;
	height:auto;
	overflow:hidden;
}

.min-height-200
{
	min-height:200px;
	height:auto;
	overflow:hidden;
}

.min-height-300
{
	min-height:300px;
	height:auto;
	overflow:hidden;
}


.col-left{
	background:#011b45;	
}

.col-left .Nav{
 padding-top:30px;	
}

.col-left .Nav ul{
 margin:0px;
 padding:0px;
}

.col-left .Nav ul li{
	list-style:none;
	width:100%;
	height:50px;
	padding:10px;
	color:#FFF; 
	box-sizing:border-box;
}

.col-left .Nav ul li::after{
	content:'';
	display: block;
    width: 0;
    height: 2px;
    background: #FFF;
    transition: width .3s;	
	position:relative;
	top:5px
}


.col-left .Nav ul li:hover::after{
    width: 100%;
}

.col-left .Nav ul li.focus::after{
	content:'';
	display: block;
    width: 100%;
    height: 2px;
    background: #FFF;
}

.col-left .Nav ul li a{
	color:#FFF;
	font-size:15px;
}

.col-left .Nav ul li .fas{
	font-size:20px;	
}

.tips {
    border-bottom: none;
    cursor: pointer;
}

.btn--deco {
   width: 100px;
    height: 19px;
    padding: 4px;
    float: right;
    color: #333;
    border: 1px solid #333;
    border-radius: 5px;
    margin-left: 10px;
}

.col98 {
    width: 1200px;
    height: auto;
    
    margin: auto;
}

.main--content {
    width: 95%;
    min-height: 380px;
    height: auto;
    background: #FFF;
    border-radius: 8px;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
    box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
    box-sizing: border-box;
    padding: 10px;
	position:relative;
}

.main--content .title {
    font-size: 20px;
    font-weight: bold;
    color: #011B4B;
    padding: 3px;
    /* border-bottom: 1px solid #cac9bf;*/
}

.main--content .custom_contenu {
    /*font-size: 20px;*/
    padding: 3px;
}

.flexBox{
   display: flex;
  flex-wrap: nowrap;
}


.col-30-2 {
    width: 30%;
    min-height: 335px;
    height: auto;
	float:left;
}

.col-70-2 {
    width: 70%;
    min-height: 335px;
    height: auto;
	float:left;
}



.col-30 {
    width: 33%;
    min-height: 340px;
    height: auto;
    box-sizing: border-box;
    padding: 10px;
    background: #FFF;
    border-radius: 3px;
    color: rgba(123,123,123,1.00);
    font-size: 13px;
    float: left;
		margin-right:0.5%;
    -webkit-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
    box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
}


.col-30:last-child{
	float:right;
	margin-right:0%;
}

.col-30 .title {
    font-size: 18px;
    font-weight: 300;
    color: #333333;
    padding: 3px;
    border-bottom: 1px solid #cac9bf;
}


.col-30 ul, .col-30-2 ul, .col98 ul{
	margin:0px;
	padding:0px;
}

.col-30 ul li, .col-30-2 ul li, .col98 ul li{
	border-left:1px solid #FF6200;
	position:relative;
	list-style:none;
	padding:5px;
	padding-left:10px;
	text-align:left;
}

.col-30 ul li a, .col-30-2 ul li a,  .col98 ul li a{
	color:#686868;	
}

.col-30 ul li.active, .col-30-2 ul li.active, .col98 ul li.active{
	background:#FF6200;
	color:#FFF;
}

.col-30 ul li.active a, .col-30-2 ul li.active a, .col98 ul li.active a {
	color:#FFF;
}


.col-30 ul li:before, .col-30-2 ul li:before, .col98 ul li:before{
	    content: '';
    width: 7px;
    height: 7px;
    border-radius: 11px;
    background: #FF6200;
    position: absolute;
    left: -4px;
    top: 11px;
}

.col-30 ul li.active:before, .col-30-2 ul li.active:before, .col98 ul li.active:before{
	content:'';
	background:#FFF;
	left:-16px;
}

.shadow{
	 -webkit-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
    -moz-box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
    box-shadow: 0px 1px 2px 0px rgba(69,69,69,0.1);
}

.align-center
{
	display:flex;
	flex-direction:column;
	flex-flow: center;
	justify-content:center;
	align-items:center;
	align-content:center;
}

.min-height-200
{
	min-height:200px;
	height:auto;
}

.padding-5
{
	padding:5px;
}

.col100{
	width:100%;	
}

.col-40{
	width:39.5%;
	float:left;
	height:auto;
}

.col-60{
	width:59.5%;
	float:left;
}

.col-50{
	width:49.5%;
	float:left;
}


.col-50:last-child{
	width:49.5%;
	float:right;
}

.col-50-3{
	width: 50%;
    min-height: 335px;
    height: auto;
    float: left;
}

.col-50-4{
	width: 100%;
    min-height: 1px;
    height: auto;
    float: left;
}

.col-20{
	width:19.5%;
	margin-right:0.5%;
	float:left;
	min-height:180px;
	box-sizing:border-box;
	padding:5px;
}


.col-25{
	width:24.5%;
	margin-right:0.5%;
	float:left;
	min-height:120px;
	box-sizing:border-box;
	padding:5px;
}

.col-25:last-child{
	width:24.5%;
	float:right;
}

.col-25-2{
	width:24.5%;
	margin-right:0.5%;
	float:left;
	min-height:120px;
	box-sizing:border-box;
	padding:5px;
}

.col-25-3{
	width:24.5%;
	margin-right:0.5%;
	float:left;
	box-sizing:border-box;
	padding:5px;
}

.col-30-3{
	width:32.8%;
	height:200px;
	margin-right:0.5%;
	float:left;
	min-height:120px;
	box-sizing:border-box;
	padding:5px;
}

.col-30-3:last-child{
width:32.8%;
	float:right;
}


.col-30-4{
	width:31%;
	height:120px;
	margin-right:2%;
	float:left;
	box-sizing:border-box;
	padding:5px;
}

.col-30-4:last-child{
width:31%;
	float:left;
	margin-right:0px;
}



.mea-red{
	
    font-size: 42px;
    text-align: center;
    font-weight: 600;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
	color:#E90003;
}


.mea-orange{
	
    font-size: 42px;
    text-align: center;
    font-weight: 600;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
	color:rgba(227,115,0,1.00);
}

.mea-green{
	
    font-size: 42px;
    text-align: center;
    font-weight: 600;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
	color:#258a00;
}


.white--bg{
	background:#FFF;
	border-radius:5px;
	 -webkit-box-shadow: 0px 1px 12px 0px rgba(69,69,69,0.2);
    -moz-box-shadow: 0px 1px 12px 0px rgba(69,69,69,0.2);
    box-shadow: 0px 1px 12px 0px rgba(69,69,69,0.2);
	box-sizing: border-box;
}

.green--bg{
	border-left: 7px solid #20960e;	
}



.blue--bg{
	
	border-left: 7px solid #1175BD;	
}

.orange--bg{
	
	border-left: 7px solid #f9a115;	
}

.grey--bg{
	
	border-left: 7px solid #546275;	
}



.n-white--border{
	-webkit-box-shadow: inset 0px 0px 5px -1px rgba(130,130,130,1);
    -moz-box-shadow: inset 0px 0px 5px -1px rgba(130,130,130,1);
    box-shadow: inset 0px 0px 5px -1px rgba(130,130,130,1);
	border-radius:3px;
	/*border-right:1px solid #333;*/
	box-sizing: border-box;
	width:10%;
	text-align:center;
}


.n-green-box{
	background:#20960e;
	border-radius:3px;
	/*border-right:1px solid #333;*/
	box-sizing: border-box;
	width:10%;
	text-align:center;
	color:#FFFFFF;
}

.n-blue-box{
	background:#011c4b;
	border-radius:3px;
	/*border-right:1px solid #333;*/
	box-sizing: border-box;
	width:10%;
	text-align:center;
	color:#FFFFFF;
}



.n-stitle {
    font-size: 13px;
    font-weight: bold;
    padding: 3px;
	color:#f64746;
	color:#265530;

}


.n-stitle-white {
    font-size: 15px;
    font-weight: bold;
    padding: 3px;
	color:#ffffff;

}

.n-mea{
	font-size: 20px;
    font-weight: 300;
    padding: 3px;
}

.delai--restitution{
	width:150px;
	height:50px;
	float:left;
}

.action--restitution{
	color:#FF6200;
	color:#265530;
	margin-left:5px;
}

.stitle {
    font-size: 13px;
    /*font-weight: 300;*/
    color: #ff6200;
    color:#265530;
    padding: 3px;
	text-align:center;
}

.green--color{
	color:#1c860b;	
}

.blue--color{
	color:#1175bc;	
}

.orange--color{
	color:#f9a115;	
}

.grey--color{
	color:#546275;	
}


.mea{
	font-size:42px;
	text-align:center;
	font-weight:600;
	height:80px;
	display:flex;
	align-items:center;
	justify-content:center;
}

.vh_degat{
	width:280px;
	height:300px;
	float:left;	
	margin-left: 35px;
    margin-top: 55px;
}


.barchart{
	width:68%;
	min-height:230px;
	height:auto;
	margin-left:2%;
		float:right;
}


.barchart .graph{
	width:92%;
	min-height:230px;
	height:auto;
	float:left;
	margin-right:2%;
}

.barchart .filter{
	width:5%;
	float:left;
	height:100px;
}

.barchart .filter .filter_btn{
	width: 20px;
    height: 20px;
    border-radius: 4px;
    /* border: 1px solid #011b45; */
    margin-bottom: 5px;
    padding: 5px;
    cursor: pointer;
    text-align: center;
	-webkit-box-shadow: inset 0px 0px 5px -1px rgba(130,130,130,1);
-moz-box-shadow: inset 0px 0px 5px -1px rgba(130,130,130,1);
box-shadow: inset 0px 0px 5px -1px rgba(130,130,130,1);
}

.barchart .filter .filter_btn:hover{
	background:#011b45;
	color:#FFF;
}

.btn_active{
	background:#011b45;
	color:#FFF;
}


.n0{
	background:#5B5B5B;	
	color:#FFF;
}

.n2{
	background:#FBFF00;	
}


.n3{
	background:#FFA900;	
	color:#FFF;
}

.n4{
	background:#E90003;	
	color:#FFF;
}

.n5{
	background:#980002;
	color:#FFF;
}


.rond{
	width:130px;
	height:130px;
	border-radius:130px;
	float:left;
	margin-right:20px;
	text-align:center;
	box-sizing:border-box;
	display:flex;
	align-items:center;
	justify-content:center;
}


.rond2{
	width:130px;
	height:30px;
	float:left;
	padding-top:10px;
	margin-right:20px;
	text-align:center;
	box-sizing:border-box;
	font-size:15px;
}


.font20 {
    font-size: 30px;
    font-weight: bold;
}


.rond--s{
	width:15px;
	height:15px;
	border-radius:15px;
	float:left;
	margin-right:10px;
	text-align:center;
	box-sizing:border-box;
}






/* tables */
table.tablesorter {
	font-family:arial;
	/*background-color: #CDCDCD;*/
	margin:10px 0pt 15px;
	font-size: 13px;
	font-weight:normal;
	width: 100%;
	text-align: left;
}
table.tablesorter thead tr th, table.tablesorter tfoot tr th {
	background-color: #f7f7f7;
    /*border: 1px solid #FFF;
     border-bottom: 2px solid #666; */
    font-size: 13px;
    font-weight: bold;
    padding: 5px;
    text-align: center;
    color: #333333;
}

table.tablesorter thead tr .tablesorter-headerUnSorted{
	background-image: url(../img/bg.gif);
	background-repeat: no-repeat;
	background-position: center right;
	cursor: pointer;
	
}
table.tablesorter tbody td {
	color: #3D3D3D;
	padding: 4px;
	/*background-color: #FFF;*/
	border-bottom: 1px solid #EDEDED;
	min-height:35px;
	text-align:center;
}

table.tablesorter tbody tr:nth-child(even) {
  background: #f1f4f7;
}

table.tablesorter tbody tr.odd td {
	background-color:#EDEDED;
}
table.tablesorter thead tr .tablesorter-headerDesc {
	background-image: url(../img/asc.gif);
	background-repeat: no-repeat;
	background-position: center right;
}
table.tablesorter thead tr .tablesorter-headerAsc {
	background-image: url(../img/desc.gif);
	background-repeat: no-repeat;
	background-position: center right;
}
table.tablesorter thead tr .sorter-false {
	background-image: none;
	cursor: default;
	padding: 4px;
}


.link_btn{
	width: 100px;
    height: 20px;
    padding: 5px;
    background: #9f1d23;
    border: none;
    color: #FFF;
    border-radius: 3px;
    font-size: 14px;
    margin:auto;
    position: relative;
	text-align:center;
	cursor:pointer;
}

.cartouche_degat{
	width:100px;
	height:15px;
	padding:5px;
	margin:auto;
	color:#FFF;
	border-radius:15px;
	background:#ff6200;
	background:#265530;
	text-align:center;
	
	
}

.cartouche_degat2{
	width: 67px;
    height: 17px;
    padding: 2px;
    margin: auto;
    color: #FFF;
    border-radius: 15px;
    background: #ff6200;
    background:#265530;
    text-align: center;
    position: absolute;
    bottom: 10px;
    font-size: 11px;
	cursor:pointer;
}

.cartouche_degat3{
	width: 67px;
    height: 17px;
    padding: 2px;
    margin: auto;
    color: #FFF;
    border-radius: 15px;
    background: #ff6200;
    background:#265530;
    text-align: center;
    font-size: 11px;
	cursor:pointer;
	float:right;
	position:relative;
	top:6px;
}

.square_container{
	width:145px;
	margin:auto;
}

.square{
	width:30px;
	height:30px;
	float:left;
	margin-right:5px;
	display:flex;
	align-items:center;
	justify-content:center;	
}


.btn--action {
    width: 80px;
    height: 15px;
    padding: 8px;
    color: #FFF;
    background: #9f1d23;
    border: none;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    margin-bottom: 2px;
	margin:auto;

}

.btn--action2 {
    width: 80px;
    height: 15px;
    padding: 8px;
    color: #FFF;
    background: #265530;
    border: none;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    margin-bottom: 2px;
	float:left;
	margin-right:2px;
}

.btn--action3 {
    width: 160px;
    height: 31px;
    padding: 8px;
    color: #FFF;
    background: #9f1d23;
    border: none;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    margin-bottom: 2px;
	float:left;
	margin-right:2px;
}

.btn--action4 {
    width: 160px;
    height: 20px;
    padding: 8px;
    color: #FFF;
    background: #9f1d23;
    border: none;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    margin-bottom: 2px;
	float:left;
	margin-right:2px;
}

.textarea
{
	width:100%;
	height:200px;
}

.btn--action--s2 {
        width: 30px;
    height: 30px;
    float: left;
    margin-right: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color:#FFFFFF;;
    background: #9f1d23;
    border: none;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    margin-bottom: 2px;
	float:left;
	
}


.green{
	color:#019A7D;	
}

.red{
	color:#DE0003;	
}

.brown{
	color:#8E6C51;
}

.col--voiture{
	width:140px;
	height:auto;
	margin-right:15px;
	float:left;	
}

.col--voiture .cartouche {
	width:100%;
	height:auto;
	padding:1px;
	text-align:center;
	border:1px solid #ff6200;
	border-radius:15px;
	box-sizing:border-box;
	margin-top:3px;
	font-size:11px;
}

.col--voiture .img_entete {
	width:100%;
	height:auto;
	background:#DDDDDD;
	position:relative;
}

.col--voiture .img_entete img{
	width:100%;
}


.fs {
	width:100%;
	height:auto;
	background:#DDDDDD;
	position:relative;
	text-align:center;
	padding:5px;
}

.fs img{
	height:80px;
}


.col-80{
	width:80%;
	height:auto;
	margin:auto;	
}

.col-70{
	width:70%;
	height:auto;
	margin:auto;	
}

.square_degat{
	width:140px;
	height:130px;
	margin:auto;
	margin-bottom:10px;
	margin-top:10px;
   text-align:center;
   position:relative;
}

.square_degat .content{
	    width: 100%;
    height: 49px;
    position: absolute;
    bottom: 10px;
    font-size: 11px;
    text-align: center;
}

.square_degat img{
	width:50%;	
}




.square_degat2{
	width:100px;
	height:105px;
	margin:auto;
	margin-right:10px;
		margin-bottom:10px;
   text-align:center;
   position:relative;
   float:left;
}

.square_degat2 .content{
	    width: 100%;
    height: 49px;
    position: absolute;
    bottom: 10px;
    font-size: 11px;
    text-align: center;
}

.square_degat2 img{
	width:50%;	
}




.main_image{
	width:100%;
	height:auto;	
	position:relative;
}


.main_image img{
	width:100%;	
}

.main_image .big_img, .big_img2{
	width:25px;
	height:25px;
	padding:10px;
	position:absolute;
	right:0px;
	top:0px;
    background:#265530;
    color: #FFF;
	font-size:20px;
	text-align:center;
}

.main_image .big_img:hover, .big_img2:hover{
	background:#ff6200;
	color:#FFF;
}

.main_image .imat{
border:1px solid #eb5f40;
border:1px solid #265530;
	background:#eb5f40;
	background:#265530;
	color:#FFF;
	font-size:13px;
	
	min-width:105px;
	height:20px;

	font-weight:bold;
	 display: flex;
  	align-items: center;
  	justify-content: center;
	position:absolute;
	bottom:4px;right:0px;
}



.vignette{
	width:85px;
	height:auto;	
	float:left;
	margin-right:5px;
	overflow:hidden;
	cursor:pointer;
}

.vignette img{
	height:75px;
}


.champs{
	width:210px;
	height:25px;
	border:1px solid #BBBBBB;
	border-radius:3px;
	padding:5px;
	box-sizing:border-box;
}

.search-btn{
    width: 90px;
    height: 31px;
    padding: 7px;
    background: #9f1d23;
    background:#007BFE;
    border: none;
    color: #FFF;
    border-radius: 3px;
    font-size: 14px;
    position: relative;
	cursor:pointer;
	border:none;
	transition: all 500ms;
}

.search-btn:hover{
    width: 90px;
    height: 31px;
    padding: 7px;
    background: #6da4a5;
     background:#265530;
    border: none;
    color: #FFF;
    border-radius: 3px;
    font-size: 14px;
    position: relative;
	cursor:pointer;
	border:none;
}


.back-btn{
   width: 59px;
    height: 19px;
    padding: 5px;
    background: #9f1d23;
    border: none;
    color: #FFF;
    border-radius: 3px;
    font-size: 14px;
    position: relative;
	cursor:pointer;

}

a .back-btn{
	display: inline-block;
	width:59px;
}


.main--form{
	width: 90% !important;
	max-width:800px;
    height: auto;
    margin: auto;
    -webkit-box-shadow: 0px 1px 6px 0px rgba(69,69,69,0.2);
    -moz-box-shadow: 0px 1px 6px 0px rgba(69,69,69,0.2);
    box-shadow: 0px 1px 6px 0px rgba(69,69,69,0.2);
    padding: 20px;
    border-radius: 4px;
	border-top: 3px solid #a3acbe;
}

.main--form--l{
	width: 90%;
    height: auto;
    margin: auto;
    -webkit-box-shadow: 0px 1px 6px 0px rgba(69,69,69,0.2);
    -moz-box-shadow: 0px 1px 6px 0px rgba(69,69,69,0.2);
    box-shadow: 0px 1px 6px 0px rgba(69,69,69,0.2);
    padding: 20px;
    border-radius: 4px;
	border-top: 3px solid #a3acbe;
}

.main--form .champs, .main--form--l .champs{
	width:100%;
	height:32px;
	border:1px solid #BBBBBB;
	border-radius:3px;
	padding:5px;
	box-sizing:border-box;
}

.select-style {
    border: 1px solid #ccc;
    width: 100%;
    height: 30px;
    border-radius: 3px;
    overflow: hidden;
    background: #FFF url(../img/fleche.png) no-repeat 98% 50%;
}

.select-style select {
    padding: 5px 30px 5px 8px;
    width: 100%;
    height: 30px;
    border: none;
    box-shadow: none;
    background: transparent;
    background-image: none;
    -webkit-appearance: none;
}

.champs2{
	width: 100%;
    height: 31px;
	border:1px solid #BBBBBB;
	border-radius:3px;
	padding:5px;
	box-sizing:border-box;
}

.picto{
	width:50px;
	height:50px;
	border-radius:50px;
	overflow:hidden;	
	margin:auto;
}

.picto2{
	width:150px;
	height:150px;
	border-radius:150px;
	overflow:hidden;	
	margin:auto;
}


.tabs{
	float:left;
	margin-right:15px;	
	font-weight:bold;
}

.tabs:hover{
	float:left;	
	border-bottom:2px solid #265530;
}

.tabs.focus{
	border-bottom:2px solid #265530;
}

.qrCode{
	width:80px;
	height:80px;	
}

.qrCode img{
	width:100%;
}

.n_ss_deg{
background:#54b555;
	color:#FFF;
}

.plaque_immat{
	min-width:105px;
	/*padding:2px;*/
	height:20px;
	float:left;
	border-radius:3px;
	border:1px solid #333;
	color:#333;
	font-weight:bold;
	margin-right:10px;
	 display: flex;
  align-items: center;
  justify-content: center;
	margin-top:3px;
}

.plaque_immat_morph{
	border:1px solid #265530;
	background:#265530;
	color:#FFF;
}

.marque_model_vh{
	padding:3px;
	height:10px;
	float:left;
	color:#333;
}


.titreGris{
	/*border-bottom:1px solid #A8A8A8;*/
	width:100%;
	height:30px;
	box-sizing:border-box;
	padding:5px;
	color:#333;
	position:relative;
	border-bottom:1px solid #F1F1F1;
}

.titreGris .title_txt{
	width:150px;	
	height:30px;
	padding-top:5px;
	position: absolute;
	left:40px;
	box-sizing: border-box;
	top:0px;
}

.nb_degat,.nb_degat1{
	position:absolute;
	width:55px;
	height:13px;
	border-radius:15px;
	-webkit-box-shadow: 0px 7px 5px -8px rgba(36,36,36,1);
	-moz-box-shadow: 0px 7px 5px -8px rgba(36,36,36,1);
	box-shadow: 0px 7px 5px -8px rgba(36,36,36,1);	
	background:#C8C8C8;
	padding:8px;
	font-size:10px;
	color:#333;
	padding-top:5px;
	text-align:center;
	right: 0px;top:0px;

}


a.links{
	font-weight: bold;
    /*background: #69c807;*/
    background: #3f5782;
    border-radius: 5px;
    padding: 7px;
    color: #FFF;
	font-size:12px;
    /*border-bottom: 2px solid #428003;*/
    border-bottom: 2px solid #011c4b;
}

.cartouche_info{
	width: 215px;
    height: 18px;
    padding: 5px;
    /* margin: auto; */
    color: #FFF;
    border-radius: 19px;
    background: rgb(210,60,120);
    background: linear-gradient(31deg, rgba(210,60,120,1) 0%, rgba(235,95,64,1) 100%);
    text-align: center;
}

table.tablesorter tbody td.actions_col{
	/*background:#607d8b;*/
	display: flex;
	align-items: center;
	justify-content: center;	
}

/*
*
*/
.col98-tab {
    width: 1200px;
    height: auto;
    margin: auto;
}

.col-30-tab {
	width: 30%;
    float: left;
	background: linear-gradient(0deg,#0dbaff,#265530);
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
    height: 440px;
    margin-top: -10px;
    padding-right: -6px;
    position: relative;
    overflow:hidden;    
}

.color_white{
	color:#FFFFFF;
}

.tab-container {
    background: transparent;
    position: absolute;
    right: 29px;
    top: 0px;
    padding: 0px 10px 0px 0px;
}

.notif-circle{
	width:25px;
	height:25px;
	font-size: 11px;
	border-radius: 50%;
	color:#FFFFFF;
	background:red;
	display: flex;
	align-content: center;
	align-items: center;
	justify-content: center;
	flex-direction: row;
}

.head-tab {
    padding: 20px 20px 0px 20px;
    width: 100%;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    flex-direction: row;
    position: relative;
    background: transparent;
    border-top-right-radius: 8px;
}

.scanALERTE, .scanLISTE{
    background: #265530;
    color:#FFFFFF;
    width: 50%;
    box-sizing: border-box;
    padding: 10px 20px;
    float: left;
    border: 1px solid #265530;
    display:flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    cursor:default;
    font-size: 12px;
}

.scanALERTE.active, .scanLISTE.active{
	background: #ffffff;
	color:#265530;
    border: 1px solid #265530;
}

.content-tab {
    padding: 10px 20px;
    width: 100%;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: flex-start;
    flex-direction: column;
    height: 363px;
    overflow-y: auto;
    position: relative;
    background: transparent;
    border-bottom-right-radius: 8px;
}

.tab-container-content{
	width:100%;
	border-radius:8px;
}

.select-style-scan {
	border: 1px solid transparent;
    width: 165px;
    border-radius: 3px;
    overflow: hidden;
}

.select-style-scan select {
    width: 165px;
    border: none;
    box-shadow: none;
    background: transparent;
    background-image: none;
    -webkit-appearance: none;
}

/*
.select-style-scan select option{
	height:auto;
}
//*/
.contenu_scan_alerte,
.contenu_scan_liste{
	background: #FFFFFF;
	color:#000000;
	padding:10px 20px;
	min-height:50px;
	height:auto;
	display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    border-radius:8px;
	margin-bottom:10px;
	box-sizing: border-box;	
    border-left: 3px solid;
    border-color: #265530;
    position:relative;
    background: rgba(255, 255, 255, 0.10);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(8.1px);
    -webkit-backdrop-filter: blur(8.1px);	
}

.contenu_scan_alerte{
	width:92%;
	float:right;
}

.smart_alerte_arrow_down {
    border-left: 14px solid transparent;
    border-right: 11px solid transparent;
    border-top: 9px solid #265530;
    position: absolute;
    top: 0px;
    left: -14px;
    position: absolute;
    background: linear-gradient(0deg,#0dbaff,#265530);
    display:none;
}

.smart_alerte_user {
    position: absolute;
    top: 0px;
    left: -36px;
    font-size: 20px;
    color: #176b04;
    color: #FFFFFF;
    width: 30px;
}

.smart_alerte_user img{
	width:100%;
	border-radius:50%;
}

.contenu_scan_alerte.moins_une_heure,
.contenu_scan_liste.moins_une_heure{
	border-color: #265530;
}

.contenu_scan_alerte.plus_une_heure,
.contenu_scan_liste.plus_une_heure{
	border-color: #f37c20;
}

.contenu_scan_alerte.plus_trois_heures,
.contenu_scan_liste.plus_trois_heures{
	border-color: #db3d31;
}

.contenu_scan_alerte.valide,
.contenu_scan_liste.valide{
	border-color: #78b045;
}




.contenu_scan_alerte h3,
.contenu_scan_liste h3{
    display: flex;
    color: #FFFFFF;
    width: 100%;
    height: 30px;
    font-size: 14px;
    font-weight: bold;
    border-bottom: 2px solid #dddddd;
    margin:0;
}

.contenu_scan_liste h3 .time{
	color:#FFFFFF;
}

.scan_marque_modele{
	color:#FFFFFF;
	font-size:13px;
	font-weight: 600;
}

.scan_kilometrage{
	color:#FFFFFF;
	font-size:11px;
}

.scan_bilan{
	font-size: 11px;
}

.scan_degat_supp{
	display: block;
    font-size: 10px;
    box-sizing: border-box;
    padding: 5px 10px;
    background: #f4f4f4;
    color: #8e0804;
    font-weight: bold;
    border: 1px solid #f4f4f4;
    margin-right: 5px;
    margin-bottom: 5px;
    float: left;
}

.caution_bloquee {
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 5px;
}

.popup_header_details{
	width:100%;
}

.popup_header_inner_details{
	width:96%;
}

.scan_km_supp{
	display: block;
    font-size: 10px;
    box-sizing: border-box;
    padding: 5px;
    background: #f4f4f4;
    color: #d1780f;
    font-weight: bold;
    border: 1px solid #f4f4f4;
    margin-right: 5px;
    margin-bottom: 5px;
    float: left;
}

.scan_properte{
	display: block;
    font-size: 10px;
    box-sizing: border-box;
    padding: 5px;
    background: #f4f4f4;
    color: #636363;
    font-weight: bold;
    border: 1px solid #f4f4f4;
    margin-right: 5px;
    margin-bottom: 5px;
    float: left;
}

.caution_bloquee_div{
	width:100%;
}

.scan_caution_erreur{
    box-sizing: border-box;
    font-size: 10px;
    padding: 5px;
    color: #FFFFFF;
    background: #FFFFFF;
    margin-right: 2px;
    border-radius: 16px;
    cursor: pointer;
    background: #0d47a1;
    border:1px solid #0d47a1;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    width: 75px;
    transition: 500ms;
    cursor:pointer;
    display: flex;
    justify-content: center;
    flex-direction: row;
}

.scan_alerte_message{
	color:#FFFFFF;
	margin-bottom:15px;
}

.scan_caution_erreur:hover{
	background: #FFFFFF;
	color:#0d47a1;
}

.scan_alerte_vue_valide,
.scan_liste_vue_valide{
	color: #ffffff;
    position: absolute;
    right: 5px;
    bottom: 8px;
    font-size: 15px;
    z-index:1;
}

.groupe_bouton_caution_bloquee {
    width: 100%;
    display: flex;
    justify-content: flex-start;
}


.btn_scan_insight{
	box-sizing: border-box;
    font-size: 10px;
    padding: 5px;
    color: #FFFFFF;
    background: #FFFFFF;
    border-radius: 16px;
    cursor: pointer;
    background: #265530;
    border:1px solid #265530;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    width: 230px;
    display: flex;
    justify-content: center;
    flex-direction: row;
    transition: 500ms;
}

.btn_scan_insight:hover{
	background: #FFFFFF;
	color:#265530;
}

.scanalerte_notif_transparent,
.scanliste_notif_transparent{
	background:transparent !important;
	color:transparent !important;
}

.scan_alerte_tri_box,
.scan_liste_tri_box{
	cursor:pointer;
}

.scan_alerte_tri_box::before, .scan_alerte_tri_box::after, 
.scan_liste_tri_box::before, .scan_liste_tri_box::after{
    content: '';
    position: absolute;
    bottom: 0px;
    right: 0px;
    border-color: transparent;
    border-style: solid;
    border-bottom-right-radius: 8px;
}

.scan_alerte_tri_box::before,
.scan_liste_tri_box::before {
    border-width: 1.8em;
}

.scan_alerte_tri_box::after,
.scan_liste_tri_box::after {
    border-width: 1.8em;
    border-right-color: #176b04;
    border-bottom-color: #176b04;
}


.row_contenu_validate
{
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.row_space_between{
	display:flex;
	width:100%;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
}

.text_upppercase{
	text-transform:uppercase;
}

.modal {
  display: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.5);
}

.modal-content {
  margin: 10% auto;
  width: 60%;
  box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.17);
  animation-name: modalopen;
  animation-duration: var(--modal-duration);
}

.modal-header h2,
.modal-footer h3 {
  margin: 0;
}

.modal-header {
    background: #265530;
    padding: 5px 15px;
    color: #FFFFFF;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.modal-body {
  padding: 10px 20px;
  background: #fff;
}

.modal-footer {
    background: #FFFFFF;
    padding: 10px;
    color: #fff;
    text-align: center;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.modal-close {
  float: right;
  font-size: 30px;
  color: #FFFFFF;
}

.popup_message{
	font-size: 20px;
}

.popup_ok {
    box-sizing: border-box;
    font-size: 15px;
    padding: 10px;
    color: #FFFFFF;
    background: #FFFFFF;
    border-radius: 8px;
    cursor: pointer;
    background: #265530;
    border: 1px solid #265530;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    width: 230px;
    margin: auto;
    display: flex;
    justify-content: center;
    flex-direction: row;
    transition: 500ms;
}

.modal-close:hover,
.modal-close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

@keyframes modalopen {
  from {
  opacity: 0;
  }
  to {
  opacity: 1;
  }
}

.btn_valider_rapport_liberte{
	box-sizing: border-box;
    font-size: 10px;
    padding: 5px;
    color: #FFFFFF;
    background: #FFFFFF;
    color:#FFFFFF;
    border-radius: 16px;
    cursor: pointer;
    background: #265530;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    width: 150px;
    font-size:15px;
    margin-bottom:20px;
    display: flex;
    justify-content: center;
    flex-direction: row;
    transition: 500ms;
}


.valider_rapport_liberte{
	background:#28a745;
}

.refuser_rapport_liberte{
	background:#dc3545;
}


.overlay_rapport {
    width: 100%;
    height: 100vh;
    position: fixed;
    z-index: 990;
    top: 0px;
    background: rgba(62,51,74,0.80);
    overflow: auto;
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    
}

.header_overlay{
	display:flex;
	justify-content: space-between;
	flex-direction: row;
}

.titre_overlay {
    font-weight: bold;
    font-size: 18px;
    color:#265530;
}


.overlay_rapport .main--base--white {
  width:100%;
    max-width: 480px;
    margin: auto;
    position:relative;
    border-radius: 15px;
    background:#FFFFFF;
}


.content--holder--page {
    width: 100%;
    max-width: 480px;
    height: auto;
    margin: auto;
    position:relative;
    padding: 0px 20px;
    box-sizing: border-box;
}

.body-message-rapport{
    min-height: 200px;
    height: auto;
    box-sizing: border-box;
    padding: 20px 20px 0px 20px;
}

.overlay_close {
    /*position: absolute;
    top: 20px;
    right: 20px;
    color: #000000;
    font-size: 20px;
    font-weight: bold;
    cursor: pointer;*/
    z-index: 1000;
    font-size:20px;
	text-align: center;
	color:#840000;
}

.action_validation_rapport_div{
	width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: row;
}

.annuler_valider_rapport_liberte, .annuler_refuser_rapport_liberte {
    padding: 5px;
    background: #FFFFFF;
    color: #265530;
    border-radius: 16px;
    cursor: pointer;
    border: 1px solid #265530;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    width: 150px;
    font-size: 15px;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    flex-direction: row;
    transition: 500ms;
}

.confirmer_valider_rapport_liberte, .confirmer_refuser_rapport_liberte, #submit_signature, #recommencer_signature, #submit_refus{
    padding: 5px;
    color: #FFFFFF;
    border-radius: 16px;
    cursor: pointer;
    background: #265530;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    width: 150px;
    font-size: 15px;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    flex-direction: row;
    transition: 500ms;
}

#submit_signature, #recommencer_signature{
	border: 1px solid #265530;
}

#submit_signature{
	background:#28a745;
	border: 1px solid #28a745;
}

#submit_refus{
	background:#dc3545;
	border: 1px solid #dc3545;
}

.confirmer_refuser_rapport_liberte{
	background:#dc3545;
}


/*.validation_area{
	display: flex;
    justify-content: space-between;
    flex-direction: row;
    width: 100%;
}

.validation_fullscan_btn_div{
	width: 150px;
}*/

.div_confirmation_liberte{
	display:none;
    justify-content: center;
    flex-direction: row;
    width: 100%;
	column-gap: 20px;
}

.validation_fullscan_btn_div {
    display: flex;
    width: 350px;
    justify-content: space-between;
}



.overlay_popup {
    width: 100%;
    height: 100vh;
    position: fixed;
    z-index: 990;
    top: 0px;
    background: rgba(62,51,74,0.80);
    overflow: auto;
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.overlay_popup .main--base--white {
    width: 100%;
    max-width: 480px;
    margin: auto;
    position: relative;
    border-radius: 15px;
    background: #FFFFFF;
}

.overlay_popup .main--base--white .content--holder--page {
    width: 100%;
    max-width: 480px;
    height: auto;
    margin: auto;
    position: relative;
    padding: 0px 20px;
    box-sizing: border-box;
}

.body-message-popup {
    min-height: 200px;
    height: auto;
    box-sizing: border-box;
    padding: 20px 20px 0px 20px;
}

.header_overlay {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
}

.titre_overlay {
    font-weight: bold;
    font-size: 18px;
    color: #265530;
    width: calc(100% - 30px);
}

.overlay_close {
    z-index: 1000;
    font-size: 20px;
    text-align: center;
    color: #840000;
}

.action_validation_seuil_maximum_div {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: row;
}

.confirmer_validation_seuil_maximum{
    padding: 5px;
    color: #FFFFFF;
    border-radius: 16px;
    cursor: pointer;
    background: #265530;
    box-sizing: border-box;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
    width: 150px;
    font-size: 15px;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    flex-direction: row;
    transition: 500ms;
}


.btn-up {
    display: inline-block;
    font-weight: 400;
    color: #515151;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0;
    -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    -o-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

.btn-up-dark {
    color: #fff;
    background-color: #265530;
    border-color: #FFFFFF;
}

#toTop {
    position: fixed;
    bottom: 35px;
    right: 5px;
    cursor: pointer;
    display: none;
    background: #265530;
    border-color: #265530;
    height: 30px;
    width: 20px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.ajouter_reservation {
    width: 160px;
    height: 22px;
    padding: 8px;
    color: #FFF;
    background: #9f1d23;
    border: none;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    margin-bottom: 2px;
	float:left;
	margin-right:2px;
}

/*
* Custom card
*/

.custom_card {
            background: white;
            border-radius: 10px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            width:100%;
            max-width: auto;
            text-align: center;
            box-sizing: border-box;
            overflow: hidden;
        }
        .custom_card img {
            width: 100%;
            border-bottom: 1px solid #ddd;
        }
        .custom_card h2 {
            margin: 0;
            padding: 20px 0;
            background-color: #265530;
            color: white;
        }
		
		.custom_card .custom_title {
            margin: 0;
            padding: 10px 0;
            background-color: #265530;
            color: white;
            margin-bottom:10px;
        }
        .custom_card p {
            padding: 0 20px 20px;
            margin: 0;
            color: #333;
        }
        .custom_card button {
            background-color: #265530;
            border: none;
            color: white;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 20px 0;
            border-radius: 5px;
            cursor: pointer;
        }

.custom_btn_fs {
    width: 160px;
    height: 15px;
    padding: 8px;
    color: #FFF;
    background: #9f1d23;
    border: none;
    border-radius: 3px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    margin-bottom: 2px;
    float: left;
    margin-right: 2px;
}