/*  Page CSS :
________________________________
nom : all.css
auteur : Arthur LEPAGNOL
fonction : Mise en forme des pages web et structure du site pour tout type de média.
adresse du site :  www.agbat-maconnerie.fr
________________________________
*/


/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------Styles par défault--------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, hr,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
{
	margin: 0px;
	padding: 0px;
	border: 0px rgb(255,255,255);
	outline: 0;
	font-weight: normal;
	vertical-align: baseline;
	background: transparent;
}

body
{
	background-color:rgb(255,255,255);
	width:100%;
	padding-top:0px;
	margin:auto;
		background-color: #f5f5f5;
		font-family: 'Open Sans', arial, sans-serif;
}

#page{
	margin: auto;
	text-align: left;
	width: 100%;
	background:transparent;
	margin-bottom:0;
		background-color: #f5f5f5;
}

#corps
{
	width:100%;
	max-width:1000px;
	margin:0px auto;
		background-color: #f5f5f5;
}



/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------Style des liens de la Page------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------------------------------- */

a img { border:none; }

a, a:visited, a:active, a:link
{
	text-decoration:none;
	color:#4285F4;
	font-weight:normal;
	font-family:"Arial","Comic Sans MS",Georgia,serif;
	margin:0px;
	padding:0px;
}

a:hover 
{
	color:orange;
}

.bouton_image		{ background-color:#fff; padding:4px; cursor:pointer; vertical-align:middle; border: 1px solid rgb(125,126,127);border-bottom: 4px solid rgb(125,126,127); margin:4; }
.bouton_image img {margin:0;padding:0;}
.bouton_image:hover	{ border-color:rgb(255,204,0); }




/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------Style général de la Page-----------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------------------------------- */


p 				{ color:rgb(73,73,73); text-align:left; font-family:"Arial", serif; font-size:16px; margin:5px;}
p.erreur		{ color:red; text-align:center; font-family:"Arial", serif; font-size:16px; }
p.legend		{ color:rgb(150,150,150); text-align:center; font-size:16px; font-style:none; margin:8px 0px 0px 0px;}
		.petit 		{ color:rgb(100,100,100); text-align:center; font-size:14px; font-family:serif; }
h1 		{ color:rgb(73,73,73); font-family: "Arial", serif; text-align:center; text-decoration:none; margin-bottom:62px; margin-top:5px;}

h2, a h2 {
color:rgb(73,73,73); text-decoration:none; font-family: "Arial", serif; font-weight:normal; font-size:20px; width:100%; border:0px; text-align:center; margin:20px 5px;}

h3 		{ color: rgb(73,73,73); text-decoration:none; font-family: "Arial", serif; font-weight:normal; font-size:18px; }

img.vitrine		{ width:350px; height: auto; }

img.cadre_photo
{
	padding:4px;
	border:1px solid rgb(100,150,170);
	background-color:white;
	text-align:center;
	margin: 0 auto;
}

.center		{ text-align:center; }
.left		{ text-align: left ; }
.middle		{ vertical-align:middle;	}
.italique	{ font-style:italic;	}


#corps ul	{ color: black; font-size:17px; font-family: "Arial", serif; }
#corps li	{ margin: 25px; padding-left:10px; }

label {
	display: inline-block;
	max-width: 100%;
}
input,select {
	padding : 6px;
}
.cent {
	width:100%;
	max-width:100%;
}
.clear {
    clear: both;
}
.col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9 {
    float: left;
}
.btn, a.btn {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    font-weight: 600;
    font-size: 16px;
    line-height: 16px;
	padding:12px 14px;
	color:#fff;
	border-radius: 10px;
}


.btn_bleu{
    background: #4285F4;
	color:#fff;
}
.btn_bleu:hover{
    background: #6FA3F6;
}


.btn_rouge{
    background: #EA4334;
#4285F4
}
.btn_rouge:hover{
    background: #EE6D61;
}


.btn_jaune{
    background: #FBBC05;
}
.btn_jaune:hover{
    background: #FBCA36;
}


.btn_vert{
    background: #33A853;
}
.btn_vert:hover{
    background: #47C669;
}

.form_recherche {
	width:240px;
    background: #FBBC05;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    font-weight: 600;
    font-size: 16px;
    line-height: 16px;
	padding:12px 14px;
	color:#fff;
	border-radius: 10px;
}
.btn_recherche {
width:30px;
height:30px;
position:absolute;
background:transparent;
color:#FBBC05;
top:14px;
margin-left:183px;
display:block;
border:0;
cursor: pointer;
}
.btn_recherche i {
	color: #4285F4;
}

.produit_deroulant {
 width:50%;
 margin:0 auto;
}
.box
{
	width:100%;
	margin-right:auto;
	margin-left:auto;
	-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
	margin-bottom:20px;
	padding :10px;
	/*webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;*/
	box-shadow: 0px 3px 9px rgba(0,0,0,0.05);
}

.white {
 background: #fff;
}
.grey {
 background: #fafafa
}
.box_contenu
{
	padding:10px;
	margin-bottom:20px;
	text-align:center;
	border:1px solid rgb(100,150,170);
	display:block;
	background-color:rgb(228,238,248);
}

.box_titre
{
	padding:2px;
	padding-left:10px;
	text-align: left;
	text-decoration: none;
	font-family: "Arial", serif;
	color: rgb(0,0,128);
	font-weight: normal;
	border:solid 1px rgb(100,150,170);
	border-bottom:0px;
	background:url("/assets/images/css/news-millieu.png") top left;
	background-repeat:repeat-x;
}

.box hr,
.mini_box hr,
.box_contenu hr	{ background-color:rgb(100,150,170); height:1px; border:0px; width:100%; }



.real_box {
	text-align:center;
	float:left;
	width:255px;
	margin:7px;
	height:270px;
	border: 1px solid rgb(227,227,227);
	border-bottom:2px solid rgb(227,227,227);
	background-color:rgb(240,240,240);
}

 .real_box p {
	color:rgb(173,173,173);
	font-size:13px;
	text-align:left;
	margin:0;
	padding:0;
	margin-left:10px;
	text-align:center;
}

.real_box h3, .real_box h3 a{
	display:block;
	margin:5px;
	color: rgb(56,56,56);
	text-decoration:none;
	border:0;
	text-align:center;
}
.real_box a:hover {
	text-decoration:underline;
}



.actu {
	display:block;
	width:400px;
	height:100px;
	border: 1px solid rgb(227,227,227);
	border-bottom:2px solid rgb(227,227,227);
	float:left;
	background-color:rgb(240,240,240);
	margin:5px;

}
.actu_img {
    height: 100px;
	line-height:100px;
    width: 100px;
    overflow: hidden;
	text-align:center;
	vertical-align:middle;
	float:left;
} 
.actu_contenu {
	width:270px;
	margin-left:110px;
	bottom:0px;
	text-align:left;
}
.actu_contenu p {
	color:rgb(173,173,173);
	font-size:13px;
	text-align:left;
	margin-left:10px;
}
.actu_contenu h3, .actu_contenu a h3 {
	display:block;
	width:auto;
	margin:10px 0px 5px 10px;
	color: rgb(56,56,56);
	text-decoration:none;
	border:0;
	/*border-bottom:2px solid rgb(240,240,240);*/
}
.actu_contenu a:hover  h3{
	text-decoration:underline;
}




#accueil_realisation_container {
	width:325px; margin-left:505px; text-align:center;
}

#accueil_realisation {
    position:absolute;
	height: 250px;
    width: 250px;
    overflow: hidden;
	margin:0px auto 0px auto;
	text-align:center;
}

#accueil-description {
	width:500px; float:left;
}

.legende_img_int {
    position:absolute;
    left: 0px;
	right:0px;
    top: 0px;
    font-size: 16px;
	text-align:center;
	color: #ddd;
	background: #000;
	background: rgba(0,0,0, 0.2);
}
/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------Style des tableaux de la Page------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------------------------------- */

table
{
	border-collapse:collapse;
}



table,tr,td,th
{
	color:black;
	font-family:"Arial", serif;
	font-size:16px;
	font-weight: normal;
	padding:10px;
	margin:auto;
	border:1px solid rgb(200,200,200);
	vertical-align:middle;
}

.cel_middle		{ vertical-align:middle; }

table.border_none,
table.border_none tr,
table.border_none td,
table.border_none th
{
	border : none;
}


















/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------Style Head + Menu-------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------------------------------- */
#logo		{width:100%; max-width:200px;}

#slogan		{ text-align:center; border:none; padding:0px; margin:0px auto 0px auto; }

#top	{ width: 100%; max-width:1200px; text-align: center; padding-top: 10px; margin:auto;}



/* ------------------------------------------------------------------------------------
Tha Drop-down Menu
------------------------------------------------------------------------------------ */
/*Strip the ul of padding and list styling*/
nav{text-align:center;display:inline-block;}
nav ul {
    list-style-type:none;
    margin:0;
    padding:0;
        position: static;

		margin:auto;
}
/*Create a horizontal list with spacing*/
nav li {
    display:inline-block;
    float: left;
	margin:0px 10px;
}
/*Style for menu links*/
nav li a {
    display:block;
    min-width:140px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #fff !important;
    background: #2f3036;
    text-decoration: none;
}
/*Hover state for top level links*/
nav li:hover a {
    background: #19c589;
}
/*Style for dropdown links*/
nav li:hover ul a {
    background: #aaa;
    color: #2f3036;
    height: 40px;
    line-height: 40px;
}
/*Hover state for dropdown links*/
nav li:hover ul a:hover {
    background: #999;
    color: #fff;
}
/*Hide dropdown links until they are needed*/
nav li ul {
    display: none;
	position:absolute;
	min-width:140px;
}
/*Make dropdown links vertical*/
nav li ul li {
    display: block;
    float: none;
}
/*Prevent text wrapping*/
nav li ul li a {
    width: auto;
    min-width: 100px;
    padding: 0 20px;
}
/*Display the dropdown on hover*/
nav ul li a:hover + .hidden,nav  .hidden:hover {
    display: block;
}
/*Style 'show menu' label button and hide it by default*/
nav .show-menu {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-decoration: none;
    color: #fff;
    background: #FBBC05;
    text-align: center;
    padding: 10px 0;
    display: none;
}
/*Hide checkbox*/
nav input[type=checkbox]{
    display: none;
}
/*Show menu when invisible checkbox is checked*/
nav input[type=checkbox]:checked ~ #menu{
    display: block;
}
/*Responsive Styles*/
@media screen and (max-width : 760px){
    /*Make dropdown links appear inline*/
    nav ul {
        position: static;
        display: none;
    }
    /*Create vertical spacing*/
    nav li {
        margin-bottom: 1px;
    }
    /*Make all menu links full width*/
    nav ul li, nav li a , nav li ul li a {
        width: 100%;
    }
    /*Display 'show menu' link*/
    nav .show-menu {
        display:block;
    }
}







nav li a.m_bleu{
    background: #4285F4;
}
nav li:hover a.m_bleu{
    background: #6FA3F6;
}


nav li a.m_rouge{
    background: #EA4334;
}
nav li:hover a.m_rouge{
    background: #EE6D61;
}


nav li a.m_jaune{
    background: #FBBC05;
}
nav li:hover a.m_jaune{
    background: #FBCA36;
}


nav li a.m_vert{
    background: #33A853;
}
nav li:hover a.m_vert{
    background: #47C669;
}
/* Elements de premier niveau
--------------------------------------*/
/*#menuDeroulant
{
	background: #fff;
	width: 750px;
	height: 21px;
	list-style-type: none;
	margin: auto;
	padding: 0;
	border: 0;


font-family: "poppins", calibri, serif;
}
#menuDeroulant li
{
	float: left;
	width: 150px;
	margin: 0;
	padding: 0;
	border: 0;
	text-decoration: none;
}
#menuDeroulant li a:link, #menuDeroulant li a:visited
{
	display: block;
	height: 1%;
	color: #696969;
	background: #FFF;
	margin: 0;
	padding: 4px 8px;
	border-right: 1px solid #fff;
	text-decoration: none;
}
#menuDeroulant li a:hover { background-color: #80bb26;color:#fff; }
#menuDeroulant li a:active { background-color: #80bb26; }

#menuDeroulant .sousMenu
{
	display: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	border: 0;
	position:absolute;
}
#menuDeroulant .sousMenu li
{
	float: none;
	margin: 0;
	padding: 0;
	border: 0;
	width: 149px;
}
#menuDeroulant .sousMenu li a:link, #menuDeroulant .sousMenu li a:visited
{
	display: block;
	color: #FFF;
	margin: 0;
	border: 0;
	text-decoration: none;
	background: transparent url("/assets/css/fond-gris-transp.png") repeat;
}
#menuDeroulant .sousMenu li a:hover
{
	background-image: none;
	background-color: #80bb26;
}

#menuDeroulant li:hover > .sousMenu { display: block; }
*/

/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------Style Footer---------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------------------------------------------------------- */

#foot
{
margin-top:150px;
	 padding-top:20px;

	width:100%;
	clear:both;
	text-align:center;
	font-family:"Arial", serif;
	font-size:16px;
	color:rgb(127,127,127);
	background-color:#9bd4c4;
	border-top: 10px solid #2d3e50;
}



footer {
	/*width: 986px;*/
	margin: 0 auto;
}

.reseaux_sociaux {
	width : 50px;
}