:root {
	--cp--rouge: #DA3234;   
	--cp--bleu: #142593; 
    --cp--bg-nav: #fff;
    --cp--bg-footer: #142593;
    --bleu: #1B2A92;
    --cp--bg-fond-blanc: #FFFFFF;
    --cp--bg-fond-gris: #ECECEC;
    --cp--border_input: #a1a1a1;
    --cp--bg_input: #F5F5F5;
    --cp--text-color: #000000;
    accent-color: #D70000;
}

body {
	font: 0.9rem PoppinsLight, Verdana, "DejaVu Sans", "Bitstream Vera Sans", Geneva, sans-serif; 
	color: var(--cp--text-color);
	padding: 0;
	margin: 0;
	background-color: #fff;
	line-height: 1.6em;
}

h2{font-weight:normal;}

*{-moz-box-sizing: border-box; box-sizing: border-box;}

@font-face {
    font-family: 'Poppinsbold';
    src: url('/scripts/css/fonts/Poppins-Bold.woff2') format('woff2'),
        url('Poppins-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PoppinsExtralight';
    src: url('/scripts/css/fonts/Poppins-ExtraLight.woff2') format('woff2'),
        url('Poppins-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PoppinsLight';
    src: url('/scripts/css/fonts/Poppins-Light.woff2') format('woff2'),
        url('Poppins-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppinsregular';
    src: url('/scripts/css/fonts/Poppins-Regular.woff2') format('woff2'),
        url('Poppins-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.enteteTab{background-color:black;color:white;}

div#div_glob{width:100%;height:100%;}

.center{text-align:center;}

.divclair{background-color:var(cp--bg-fond-blanc);}
.sectionmaingris{background-color:var(--cp--bg-fond-gris);}
.sectionmainrouge{background-color:var(--cp--rouge); color:white;}
.sectionmainbleu{background-color:var(--cp--bleu); color:white;}

.divclair h2{color:var(--cp--bleu);}

a:link, a:visited, a:active{
	color: var(--cp--rouge);
	text-decoration: none;
}

a:hover{text-decoration: underline;}

a.abtn:link, a.abtn:visited, a.abtn:active{
	display:inline-block;
	background-color:var(--cp--rouge);
	color:white;
}
a.abtn:hover{background-color:var(--cp--bleu);text-decoration:none;}

.divclair a.abtn:link,.divclair a.abtn:visited,.divclair a.abtn:active{background-color:var(--cp--rouge);}
.sectionmainbleu a.abtn:link,.sectionmainbleu a.abtn:visited,.sectionmainbleu a.abtn:active{background-color:white;color:var(--cp--bleu);}
.sectionmainbleu ul li{list-style-image: url("/images/choche-blanche.png");}
.divclair ul li{list-style-image: url("/images/coche-rouge.png");}

img{max-width:100%;max-height:100%;}

div#divillusht{background-repeat:no-repat;background-size:cover;background-position: center center;}

.bgrouge{color:white;background-color:var(--cp--rouge);font-weight:bold;padding:1rem;text-align:center;}
.bgvert{color:white;background-color:green;font-weight:bold;padding:1rem;text-align:center;}

form p{text-align:center;margin:0;padding:0;}
form label{
	display:inline-block;
	width:200px;
	text-align:right;
	margin-right:10px;
}

.form p{text-align:center;margin:0;padding:0;}
form label{
	display:inline-block;
	width:200px;
	text-align:right;
	margin-right:10px;
}
 p:focus-within label{color:var(--cp--text-color);}

.spanform{
	display:inline-block;
	text-align:left;
	width:100%;
	background-color:#f3f3f3;
	margin-bottom: 10px;
}

form input[type="text"],form input[type="email"],form input[type="number"],form input[type=password], form input[type="date"],form select{
	height:40px;
	font: 0.8rem Verdana, "DejaVu Sans", "Bitstream Vera Sans", Geneva, sans-serif; 
	padding-left: 5px;
	margin-top:5px;
	margin-bottom:5px;
	font-size:1rem;
}

form textarea{
	background-color:white;
	font: 0.8rem Verdana, "DejaVu Sans", "Bitstream Vera Sans", Geneva, sans-serif; 
	color: var(--cp--text-color);	
	border: 1px solid #313131;
	padding-left: 5px;
	margin-top:5px;
	margin-bottom:5px;
	font-size:1rem;
	background-color:#E9E9E9;
	padding: 1rem;
}

input[type="submit"]:hover,input[type="button"]:hover{
	box-shadow: 1px 4px 3px #0f0f0f;
}

form input[type="text"]:focus, form textarea:focus, form select:focus, form input[type="email"]:focus{outline: none;}

/************* File d'ariane **************/
/* Style the list */
ul.breadcrumb {
	padding: 0;
	list-style: none;
	text-align:center;
}

/* Display list items side by side */
ul.breadcrumb li {
	display: inline;
	font-size: 0.85rem;
}

/* Element séparateur */
ul.breadcrumb li+li:before {
	padding: 5px;
	font-size:0.6rem;
	color: #767676;
	content: ">>";
}

/* Add a color to all links inside the list */
ul.breadcrumb li a {
	color: #767676;
	text-decoration: none;
}

/* Add a color on mouse-over */
ul.breadcrumb li a:hover {
	color: black;
	text-decoration: none;
}

div.sectionmainrouge ul.breadcrumb li+li:before{color:white;}

/************* File d'ariane **************/


/***************** Carrousel *****************/
.list_carousel{
	margin: 0 0 30px 60px;
	width: 360px;
	overflow:hidden;
}
.list_carousel ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
}
.list_carousel li {
	color: #999;
	text-align: center;
	width: 50px;
	height: auto;
	padding: 0;
	margin: 6px;
	display: block;
	float: left;
	overflow: hidden;
}

.list_carousel li img{filter: grayscale(1);transition: transform .5s;} 

.list_carousel li:hover img{
	filter: grayscale(0);
	transform: scale(1.3)
} 

.list_carousel.responsive {
	width: auto;
	margin-left: 0;
}
.clearfix {
	float: none;
	clear: both;
}
/***************** Carrousel *****************/



	/********** ADOPTEZ LE LIBRE *************/
	#div_illus_adoptez_le_libre{background-image: url(/images/fond-adoptez-le-libre.png);background-repeat:no-repeat;background-size:auto;background-position: center center;position:relative;}
	#ll_gimp{position:absolute;z-index:1; animation: gauchedroite 4s ease-in-out infinite;}
	#ll_libreoffice{position:absolute;z-index:2; animation: diving 6s ease-in-out infinite, diving-rotate 6s ease-in-out infinite;}
	#ll_nextclound{position:absolute;z-index:3; animation: diving-rotate 8s ease-in-out infinite;}
	#ll_thunderbird{position:absolute;z-index:4; animation: diving-rotate 10s ease-in-out infinite;;}
	#ll_firefox{position:absolute;z-index:5;animation: gauchedroite 6s ease-in-out infinite;}
	#ll_davinci{position:absolute;z-index:6; animation: hautbas 7s ease-in-out infinite;}

	@keyframes leds-off { 
		100% { 
			opacity:0.3;
		} 
	}

	@keyframes helix-movement {
		100% {
			background: linear-gradient(
			  to bottom,
			  lighten($color2, 15%) 50%,
			  lighten($color2, 15%),
			  $color2,
			  $color2 50%
			);
			background-size: 100% 20px;
		}
	}

	@keyframes gauchedroite {
		0% {
			 margin-left:5px;
		}
		50% {
			 margin-left:15px;
		}
		
		100% {
			 margin-left:5px;
		}
	}
	
	@keyframes diagonal {
		0% {
			 margin-left:5px;
			 margin-top:5px;
		}
		50% {
			 margin-left:15px;
			 margin-top:15px;
		}
		
		100% {
			 margin-left:5px;
			 margin-top:5px;
		}
	}
	
	@keyframes hautbas {
		0% {
			 margin-top:5px;
		}
		50% {
			 margin-top:15px;
		}
		
		100% {
			 margin-top:5px;
		}
	}
	

	@keyframes diving {
		0% {
			 margin-top:5px;
		}
		50% {
			 margin-top:15px;
		}
		
		100% {
			 margin-top:5px;
		}
	}

	@keyframes diving-rotate {
		0% {
			 transform:rotate(0deg); 
		}
		50% {
			 transform:rotate(3deg); 
		}
		75% {
			transform:rotate(-2deg); 
		}
		100% {
			transform:rotate(0deg); 
		}
	}

    @keyframes light-movement {
	  0% { 
          transform: rotate(-40deg);
      }
      50% {
          transform: rotate(-70deg);
      }
	  100% { 
          transform: rotate(-40deg);
      }
	}
	/********** ADOPTEZ LE LIBRE *************/

div.90pourcent{width:90%;margin-left:auto;margin-right:auto;} 

/*****************	LES NEWS	*******************/
#cap_sticky_devis a{color:white;}

div#divnewsglob{padding-top:1rem;padding-bottom:2rem;}
div#divnewsglob a{color:var(--cp--text-color);}
#h2expertiseshome{padding-top:2rem;padding-bottom:0;margin-bottom:0;}
div.divnewsitem img{transition: all 500ms;}
div.divnewsitem:hover img{
	transform:scale(1.1);
	transition-property: all;
	transition-duration: 500ms;
	transition-timing-function: ease;
	transition-delay: 0s;
}
/*****************	LES NEWS	*******************/

span[itemprop="headline"],span[itemprop="author"],span[itemprop="name"],span[itemprop="url"],span[itemprop="image"],span[itemprop="logo"],span[itemprop="description"],span[itemprop="offers"],span[itemprop="priceCurrency"],span[itemprop="lowPrice"],span[itemprop="offerCount"]{display:none;}
a span[itemprop="name"]{display:inline !important;}

/***************** Partie footer *****************/
footer{
	width: 100%;
	height: auto;
	background-color: var(--cp--bg-footer);
	padding-top:20px;
}

div#divlogobasb{background-image: url(/images/logo-agence-web-cappuccino-n.png);background-repeat:no-repeat;width:240px;height:48px;margin-bottom:1rem;}

footer aside{color:white;}

a.abas:link, a.abas:visited, a.abas:active{
	width: 98%;
	font-size:0.9rem;
    line-height: 0.8rem;
    display: block;
    color: white;
    text-decoration: none;
    letter-spacing: 1px;
    padding-left: 5px;
    padding-right: 5px;
    margin-bottom: 0.8rem;
}

a.abas:hover{text-decoration:underline;}

/***************** Partie footer *****************/
