/******************************************************
	
	Glassero Par Patrick Roux : http://www.kicoe.net
	One Page Responsive HTML Template
	
	Theme : Retro
	
	Sections of stylesheet:
		$INDEX0 - COULEURS UTILISEES
		$INDEX1 - GENERAL
		$INDEX3 - MENU COMMON
		$INDEX5 - HEADER STANDARD REDUIT
		$INDEX6 - HEADER MOBILE
		$INDEX7 - MAIN CONTENT
		$INDEX8 - PORTFOLIO
		$INDEX9 - THE TEAM
		$INDEX10 - CONTACT
		$INDEX11 - MEDIA QUERIES : TABLETS
		$INDEX12 - MEDIA QUERIES : SMARTPHONES
		
******************************************************/	






/******************************************************

	$INDEX0 - COULEURS UTILISEES
	
******************************************************/	

/*

	#F6F6F6
	#E46C51
	#F0F0F0
	#rgba(30, 30, 30, 0.6)
	#222222

*/





/******************************************************

	$INDEX1 - GENERAL
	
******************************************************/	



body {			 color: 	#ffffff; }
header{			background: #777;	 }

::selection{			background: #999;	}
::-moz-selection{		background: #999;	}
::-webkit-selection{	background: #999;	}

a{			color: #F0F0F0;}
a:hover {	color: #000;}

h1{		color: #777;	border-color: #F6F6F6;}
h2, h3{	color: #555;	border-color: #F6F6F6;}

hr{		border-color: #777;
}
/******************************************************
	$INDEX3 - MENU COMMON
******************************************************/	
/* 	#b3d143;		vert			
	#f59331; 		orange
*/
nav a						{ color		: #f59331;	}
nav a.current, nav a:hover	{ background: #b3d143; 	color: #f59331;}
/******************************************************
	$INDEX5 - HEADER STANDARD REDUIT
******************************************************/	
.headerstandard.headerstandard-shrink h1 {

	background: transparent url('img/logo-horiz.png') center left no-repeat;
	text-indent: 60px;
}




/******************************************************

	$INDEX6 - HEADER MOBILE
	
******************************************************/	





header.headermobile button {
	background: transparent url('img/nav-icon.png') center center no-repeat;
}

		
		
		
	
/******************************************************

	$INDEX7 - MAIN CONTENT
	
******************************************************/	


.section1-visible{ background: #ffecc4; }	/*creme			accueil 	*/
.section2-visible{ background: #f59331; }	/*orange		quoi 		*/
.section3-visible{ background: #000000; }	/* inutilisé 			*/
.section4-visible{ background: #d7ed84; }	/*vert			qui			*/
.section5-visible{ background: #f59331; }	/*orange		coordonnées	*/	


/*#main .home h1{*/
#main .home{

padding-top:140px;
}

.quote{
	background: rgba(30, 30, 30, 0.6) url('img/quote.png') 15px 15px no-repeat;
	padding: 20px 20px 20px 80px;
}	

.scroll {
    background: url("img/scroll.png") no-repeat scroll center top transparent;
}
.scroll:hover{
	background: url("img/scroll.png") bottom center no-repeat;
}

.progress {
	background: #F0F0F0;
}

.progress .bar {
    background: #E46C51;
}

.scroll {
    background: url("img/scroll.png") no-repeat scroll center top transparent;
}

.scroll:hover{
	background: url("img/scroll.png") bottom center no-repeat;
}




/******************************************************

	$INDEX8 - PORTFOLIO
	
******************************************************/	




.grid figcaption {
	background: #E46C51;
	color: #F0F0F0;	
}

.grid figcaption a {
	background: #F0F0F0;
	color: #E46C51;
}

.grid figcaption h3 {
	color: #fff;
}



/******************************************************

	$INDEX9 - THE TEAM
	
******************************************************/	


#team li{
	background: #E46C51;
}

#team li figcaption.contactme{
	background: #222222;
}


#team li figcaption.member{
	background: #222222;
}

#team li figcaption.contactme span:hover,
#team li:hover figcaption.contactme span:hover{
	background-color: #E46C51;
}

#team li figcaption.contactme span.facebook{
	background: url('img/facebook.png') center center no-repeat;
}
#team li figcaption.contactme span.twitter{
	background: url('img/twitter.png') center center no-repeat;
}



/******************************************************

	$INDEX10 - CONTACT
	
******************************************************/	


#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form input[type="tel"],
#contact-form input[type="url"],
#contact-form textarea {
    background:#FFF;
	box-shadow:inset 0 1px 2px #F6F6F6, 0 1px 0 #FFF;
	-webkit-box-shadow:inset 0 1px 2px #F6F6F6, 0 1px 0 #FFF;
	-moz-box-shadow:inset 0 1px 2px #F6F6F6, 0 1px 0 #FFF;
}
#contact-form button[type="submit"] {
   	margin-left:50%;
    width:50%;
    background:#E46C51;
    color:#F6F6F6;
}
#contact-form button[type="submit"]:hover {
   background:#F6F6F6;
    color:#E46C51;
}





/******************************************************

	$INDEX11 - MEDIA QUERIES : TABLETS
	
******************************************************/	




/* TABLETS 
@media screen and (max-width: 1020px ) {
     
  
		
	#main .home h1{
		background: transparent url('img/logo-medium.png') center center no-repeat;
	}
	

}
*/




/******************************************************

	$INDEX12 - MEDIA QUERIES : SMARTPHONES
	
******************************************************/	


/* SMARTPHONES 
@media screen and (max-width: 767px ) {*/
@media screen and (max-width: 1020px ) {
   
	/*	
	#main .home h1{
		background: transparent url('img/logo-small.png') center center no-repeat;
	}
	*/
	#main .scroll {
		background-image: url('img/scroll-small.png');
	} 
	.scroll:hover {
		background-image: url('img/scroll-small.png');
	}


}

