/*
Theme Name: Florence Hardwoods 
Author: Gene Ross
Author URI: http://generossdesign.com
*/

body { padding:0px; margin:0px; background:#241b0f; font-family:'Proxima Nova', sans-serif; font-size:18px; line-height:26px; }

.container { margin:auto; width:1100px; position:relative; }

img { max-width:100%; }

#viewport { overflow:hidden; width:100%; }

#loading { display:none; position:fixed; left:0px; top:0px; z-index:300; background:#ac4014; width:100%; height:100%; }

#loading-icon { position:fixed; left:0px; top:0px; z-index:300; background:url(../img/bg-loading.gif) center no-repeat; width:100%; height:100%; }



/* 

-------------------------------------------------------------

HEADER

*/

header { height:900px; background:url(../img/bg-header.jpg) top center no-repeat; position:relative; color:#ffffff; text-align:center; line-height:32px; }

#header-line { width:50px; height:2px; background:#ffffff; margin:30px auto; }

#header-text { width:680px; margin:auto; padding-top:150px; }

#header-down { position:absolute; width:100%; left:0px; bottom:150px; height:50px; }

#logo { width:280px; margin:auto; }


/* 

-------------------------------------------------------------

NAVIGATION

*/

#navigation { height:80px; position:relative; }

#navigation nav { height:45px; padding:20px 0px; border-bottom:1px solid #c0bfaf; background:#d9d6ce; position:absolute; width:100%; top:0px; left:0px; text-align:right; color:#b2b1aa; box-shadow:0px 0px 2px rgba(0,0,0,0.2); -webkit-box-shadow:0px 0px 2px rgba(0,0,0,0.2); -moz-box-shadow:0px 0px 2px rgba(0,0,0,0.2); }

#navigation nav.fixednav { position:fixed; z-index:100; }

#navigation nav a { color:#84837c; text-decoration:none; line-height:45px; }

#navigation nav a:hover { color:#4c4b45; }

#navigation nav a#contactbtn { background:#ac4014; display:inline-block; padding:0px 20px; color:#ffffff; margin-left:40px; }

#navigation nav a#contactbtn:hover { background:#bb4616; color:#ffffff; }

#navigation nav span { margin:0px 20px; }

/* logo mark */

#logo-mark { width:65px; height:65px; position:absolute; left:0px; top:-10px; }

#logo-mark svg { width:100%; height:65px; }

#logo-mark svg:hover path { fill:#ac4014; -webkit-transition: all 0.1s ease-out; transition: all 0.1s ease-out; }



/* 

-------------------------------------------------------------

INTRO

*/

#intro { background:#e2e0da; border-bottom:1px solid #c2c0ba; padding:85px 0px; color:#6a6863; padding-bottom:110px; }

#intro-line { width:50px; height:2px; background:#b5b3ae; margin:30px auto; }

#intro-text { width:790px; margin:auto; text-align:center; }

#intro-text h1 { color:#55544c; line-height:40px; font-size:25px; letter-spacing:2px; }

#intro-text .more-btn { margin-top:50px; }



/* 

-------------------------------------------------------------

ABOUT

*/

#about { background:#e2e0da; padding:100px 0px; padding-bottom:50px; border-bottom:1px solid #c2c0ba; color:#64635b; line-height:30px; overflow:hidden; }

#about-grapple { width:1313px; position:absolute; left:-300px; top:-100px; z-index:5; }

#about h2 { color:#55544c; letter-spacing:3px; font-size:35px; line-height:35px; }

#about h2 span { display:block; color:#94938c; font-family:'Proxima Nova', sans-serif; text-transform:none; font-size:20px; letter-spacing:0px; }

.about-left { width:510px; float:left; padding-bottom:80px; position:relative; z-index:10; }

.about-right { width:510px; float:right; padding-bottom:80px; position:relative; z-index:10; }

#about .more-btn { margin-top:20px; color:#716e64; }

#about a { color:#ac4014; }

#about a:hover { color:#de541c; }

/* gallery cta */

#gallery-cta:hover { box-shadow:0px 1px 2px rgba(0,0,0,0.3); -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.3); -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.3); }

#gallery-cta img { margin-bottom:-5px; }

/* gallery slider */

#gallery-hold { position:fixed; width:100%; left:0px; top:15%; }

#gallery {  }

#gallery h1 { color:#ffffff; letter-spacing:3px; margin-bottom:30px; text-align:center; }

#gallery-slider { width:100%; height:390px; position:relative; }

#gallery-slider .slide { position:absolute; left:0px; top:0px; width:100%; }

#gallery-slider-nav { text-align:center; padding-top:20px; position:absolute; width:100%; height:100px; bottom:-115px; left:0px; }

#gallery-slider-nav a { display:inline-block; width:10px; height:10px; background:#ffffff; border-radius:100px; margin:0px 5px; opacity:0.3; }

#gallery-slider-nav a:hover, #gallery-slider-nav a.active { opacity:1; }




/* 

-------------------------------------------------------------

CERTIFICATIONS

*/

#certifications { background:url(../img/bg-certification.jpg) top center no-repeat; padding:150px 0px; }

#certifications a { color:#ac4014; text-decoration:none; }

#certifications a:hover { color:#de541c;  }

#certifications h2 { color:#ffffff; letter-spacing:3px; font-size:40px; line-height:45px; }

#certifications-text { width:750px; margin:auto; color:#c4b8a8; text-align:center; }



/* 

-------------------------------------------------------------

CERTIFICATIONS

*/

#zerowaste { padding-top:70px; padding-bottom:150px; color:#998e7f; }

#zerowaste-text h2 { color:#ffffff; letter-spacing:3px; font-size:40px; line-height:45px; }

#zerowaste-text { width:800px; margin:auto; margin-bottom:20px; text-align:center; font-size:20px; padding:120px 0px; background:url(../img/bg-zerowaste.png) center no-repeat; }

#zerowaste .zerowaste-4col { width:235px; float:left; margin-right:50px; font-size:16px; line-height:25px; }

#zerowaste .nomarg { margin:0px; }

#zerowaste .title-line { margin-top:0px; background:#50493f; }

#zerowaste img { width:20px; }

#zerowaste h3 { color:#ffffff; letter-spacing:3px; font-size:20px; margin-bottom:10px; }

#zerowaste h3 img { vertical-align:middle; margin-right:3px; }


/* 

-------------------------------------------------------------

SUPPLIERS

*/

#suppliers { background:#ac4115; padding:100px 0px; color:#e2d7d2; text-align:center; }

#suppliers h2 { color:#ffffff; letter-spacing:3px; font-size:40px; line-height:45px; }

#suppliers i { color:#531f09; }


/* 

-------------------------------------------------------------

SUPPLIER SPECS

*/

#supplier-specs { background:#e2e0da; position:relative; }

#supplier-specs-tab { height:63px; width:100%; position:absolute; top:-40px; left:0px; background:url(../img/specs-tab.png) top center no-repeat; }

#supplier-specs .spec-row { border-bottom:1px solid #c0bfba; }

#supplier-specs .spec-block { width:33.3333%; background:url(../img/bg-specblock.jpg) top right repeat-y; height:450px; float:left; }

#supplier-specs .spec-block-text { text-align:center; width:50%; margin:auto; font-size:16px; color:#64635b; padding-top:70px; }

#supplier-specs h3 { color:#55544c; font-size:20px; letter-spacing:3px; margin:10px 0px; }



/* 

-------------------------------------------------------------

SUPPLIER SPECS

*/

#contact-hold { position:fixed; width:100%; left:0px; top:15%; text-align:center; color:#998e7f; }

#contact h1 { color:#ffffff; letter-spacing:3px; margin-bottom:30px; text-align:center; }

#contact .title-line { margin:auto; }

#contact a { color:#ac4014; text-decoration:none; }

#contact a:hover { color:#de541c; }




/* 

-------------------------------------------------------------

FOOTER

*/

footer { padding-top:60px; padding-bottom:110px; text-align:center; color:#998e7f; font-size:20px; line-height:30px; }

footer i { font-size:14px; }

footer a { color:#ac4014; text-decoration:none; }

#footer-logo { width:200px; margin:auto; }


/* 

-------------------------------------------------------------

POP UP

*/

.modal { position:fixed; top:0px; left:0px; z-index:450; width:100%; height:100%; background:url(../img/bg-trans.png) repeat; display:none; }

.modal-main { position:relative; width:600px; margin:auto; }

.modal-content { padding:40px; }

.modal-close { width:40px; height:40px; position:fixed; right:35px; top:35px; transition:opacity 0.1s linear; -webkit-transition:opacity 0.1s linear; -moz-transition:opacity 0.1s linear; opacity:0.5; }

.modal-close:hover { opacity:1; }



/* 

-------------------------------------------------------------

GENERAL

*/

a img { border:none; }

.clear { clear:both; }

h1, h2, h3 { font-family:'Fjalla One', sans-serif; margin:0px; padding:0px; text-transform:uppercase; font-weight:normal; }

.title-line {  width:50px; height:2px; background:#b5b3ae; margin:30px 0px; }

.more-btn { color:#716e64; display:inline-block; font-size:18px; line-height:50px; border:1px solid #b5b3ae; padding:0px 35px; text-decoration:none; box-shadow:0px 1px 2px rgba(0,0,0,0.1); -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.1); -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.1); }

.more-btn:hover { border:1px solid #9e9c97; color:#ac4014; }

.rounded-3px { border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; }

/* animate all class */

.trans-all { -webkit-transition: all 0.1s ease-out; transition: all 0.1s ease-out; }

.trans-navigation { -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; }

.trans-tileslide { -webkit-transition: all 0.1s ease-out; transition: all 0.1s ease-out; }

.trans-opacity { -webkit-transition: opacity 0.1s ease-out; transition: opacity 0.1s ease-out; }


/* 

-------------------------------------------------------------

GENERAL RESPONSIVE VIEWS

*/

/* large desktop */

@media (min-width: 1800px) {
	
	header, #certifications { background-size:2200px; }

}

/* tablet landscape view */

@media (max-width: 1150px) {

	.container { width:900px; }


	/* header */

	header { height:768px; }

	#header-text { padding-top:70px; }

	#header-down { bottom:70px; }


	/* about */

	.about-left { width:430px; }

	.about-right { width:430px; }

	#about { font-size:16px; line-height:28px; }

	#about-grapple { width:1150px; }


	/* zero waste */

	#zerowaste .zerowaste-4col { width:185px; }


	/* suppliers */

	#supplier-specs .spec-block { height:400px; }

	#supplier-specs .spec-block-text { width:70%; line-height:20px; font-size:14px; }


}

/* tablet portrait view */

@media (max-width: 960px) {

	.container { width:700px; }


	/* navigation */

	#navigation nav a { font-size:16px; }

	#navigation nav span { margin:0px 10px; }

	#navigation nav a#contactbtn { margin-left:20px; }


	/* intro */

	#intro-text { width:590px; margin:auto; text-align:center; }


	/* about */

	.about-left { width:330px; }

	.about-right { width:330px; }

	#about { font-size:15px; line-height:26px; padding:50px 0px; padding-bottom:0px; }

	#about-grapple { width:1050px; }


	/* certifications */

	#certifications-text { width:100%; }



	/* zero waste */

	#zerowaste { padding:50px 0px; }

	#zerowaste-text { width:600px; font-size:18px; padding:120px 0px; }

	#zerowaste .zerowaste-4col { width:320px; margin-bottom:50px; }

	#zerowaste .portrait-nomarg { margin-right:0px; }

	#zerowaste .portrait-clear { clear:both; }


	/* suppliers */

	#supplier-specs .spec-block-text { font-size:13px; }



}

/* phone view */

@media (max-width: 767px) {

	.container { width:90%; }

}

/* smaller phone view */

@media (max-width: 479px) {
}


/* vertical responsiveness */

/* large desktop */

@media (max-height: 700px) {
}