/******************************************************
	
	inspiré de Glassero Par Patrick Roux
	
	Theme : Asy
	
	Sections of stylesheet:
		$INDEX1 - GENERAL
		$INDEX2 - HEADER COMMON
		$INDEX3 - MENU COMMON
		$INDEX4 - HEADER STANDARD
		$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
		
******************************************************/	

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

body {
    color: #F5D699;
    overflow-y: scroll;
}

header{
	background: #62759F;
}


a{
	color: #F5E8C8;
}

a:hover {
	color: #000;
}

.thumbZoom > img{
        width: 238px!important;
        margin-top:-3px%;
        margin-left:-3px%;
}

h1{
	color: #dddd00; /*#F5D699;*/
	border-color: #F5D699;
}
h2{
	color: #999900!important; /*#F5D699;*/
    font-size: 5em;
	border-color: #F5D699;
}

h3{
	color: #dddd00!important; /*#F5D699;*/
	font-family: 'Carter One', Calibri, Arial, sans-serif;
	border-color: #F5D699;
}

h4{
	color: #ffffff!important; /*#F5D699;*/
    font-size: 1.5em;
	text-align: center;
	border-color: #F5D699;
}

#main .home h1, h2, h3{
	text-align: center;
}

#main .home h2{
	padding-top: 50px!important;
    color: #9DC8F3!important;
}
#main .home h2::before{
    content:url('images/asylogo.png');
    display: block;
}


#main .home h3{
    font-family: 'Carter One', Calibri, Arial, sans-serif;
	font-size: 3em;
}

.whtrans{
    padding:10px;
    background-color: #62759F;
    opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
    text-align:center;
}


hr{
	border-color: #F5D699;
}

a.centrage {
	font-size: 1.2em;
	font-weight: 300;
	text-align: center;
}

/******************************************************
	$INDEX3 - MENU COMMON
******************************************************/	

nav a{
	color: #F5E8C8;
}

nav a.current, nav a:hover{
	background: #F5E8C8;
	color: #62759F;
}

/******************************************************
	$INDEX5 - HEADER STANDARD REDUIT
******************************************************/	
 
.headerstandard.headerstandard-shrink h1 {
	background: transparent url('images/icone.png') center left no-repeat;
	text-indent: 60px;
}

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

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

		header.headermobile h1 {
            color:white;
		}

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

 
/* .section1-visible{ background: white url('images/pattern.png') repeat fixed; }
.section2-visible{ background: white url('images/pattern.png') repeat fixed; }
.section3-visible{ background: white url('images/pattern.png') repeat fixed; }
.section4-visible{ background: white url('images/pattern.png') repeat fixed; }
.section5-visible{ background: white url('images/pattern.png') repeat fixed; }
 *//* .section5-visible h1{ color: red!important; } */
body { background: white url('images/pattern.png') repeat fixed; 
       background-position: center 50px;
}
 
#main section{
    margin-top:150px!important;
    padding: 70px 4% 0px 4%!important;
}
#main section:first-child{
	margin-top: 0px!important;
    padding: 180px 0px 0px 0px!important;
    text-align:center;
}
div#bg{
    position:fixed!important;
    width:100%!important;
    height:100%!important;
    background-image: url('images/asybg.jpg')!important;
    -moz-background-size: cover!important;
    -webkit-background-size: cover!important;
    -o-background-size: cover!important;
    background-size: cover!important;
    z-index:-1;
}

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

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

.progress {
	background: #F5E8C8;
}

.progress .bar {
    background: #62759F;
}

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

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

a.url { font: 1em Monaco, "Andale Mono","Courier New", Courier, mono;
        font-weight: 700;}
a.url:hover { color:yellow; }

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

.grid figcaption {
	background: #62759F;
	color: #F5E8C8;	
}

.grid figcaption a {
	background: #F5E8C8;
	color: #62759F;
}

.grid figcaption h3 {
	color: #fff;
}

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


#team li{
	background: #62759F;
    margin:100px;
}

#team li figcaption.contactme{
	background: #62759F;
}

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

#team li figcaption.member{
	background: #62759F;
}

#team li figcaption.contactme span.facebook{
	background: url('images/facebook.png') center center no-repeat;
}
#team li figcaption.contactme span.twitter{
	background: url('images/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 #F5D699, 0 1px 0 #FFF;
	-webkit-box-shadow:inset 0 1px 2px #F5D699, 0 1px 0 #FFF;
	-moz-box-shadow:inset 0 1px 2px #F5D699, 0 1px 0 #FFF;
}
#contact-form button[type="submit"] {
    background:#62759F;
    color:#F5D699;
}
#contact-form button[type="submit"]:hover {
    background:#F5D699;
    color:#62759F;
}

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

/* TABLETS */
@media screen and (max-width: 1020px ) {

    div.headerstandard-inner h1 {
        overflow:visible;
    }

    #main section{
        padding: 115px 4% 0px 4%!important;
    }
    
    #main .home h2::before{
        content:url('images/asylogo-medium.png')!important;
    }

    #main section:first-child{
        padding: 200px 0px 0px 0px!important;
    }
	#main h2{
		font-size: 4em;
		padding-top: 0px;
		margin-top: 0px;
	}
	#main h3{
		font-size: 1.4em;
	}
	#main .home h2{
		font-size: 2.2em;
		padding-top: 50px!important;
		line-height: 0.8em;
		height: 350px;
		margin: 20px auto;
		/* background: transparent url('../images/asylogo-medium.png') center center no-repeat; */
	}
	
	#main .home h3{
		margin-top: -70px;
		font-family: 'Carter One', Calibri, Arial, sans-serif;
		font-size: 2.5em;
	}

    
}

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

/* SMARTPHONES */
@media screen and (max-width: 767px ) {
		
    header.headermobile h1 {
        background-color: transparent;
    }
	#releaseMenu {
        background-color: transparent;
    }

    nav a { background-color: #555588; }

    #main section.home {
        padding: 70px 0px 0px 0px!important;
    }
    #main h1, #main h2 {
        font-size: 2.5em;
    }
    #main .home h2{
        padding-top: 0px!important;
        font-size: 1.5em;
    }
    #main .home h2::before{
        content:url('images/asylogo-small.png')!important;
    }

    #main section:not(.home) h2 { background: white url('images/pattern.png') repeat; }
	
	.scroll {
		background-image: url('images/scroll-small.png');
	} 
	.scroll:hover {
		background-image: url('images/scroll-small.png');
	}
    
}