@charset "UTF-8";
/*fonts in order are serif upperandlower case, serif uppercase, and sans-serif upperandlower case*/
@import url(https://fonts.googleapis.com/css?family=Scheherazade);
@import url(https://fonts.googleapis.com/css?family=Cormorant+SC);
@import url(https://fonts.googleapis.com/css?family=Assistant);
@import url(https://fonts.googleapis.com/css?family=Tangerine);
@import url(https://fonts.googleapis.com/css?family=Alegreya);
@import url(https://fonts.googleapis.com/css?family=Big+Shoulders+Display);
@import url(https://fonts.googleapis.com/css?family=Oswald);
@import url(https://fonts.googleapis.com/css?family=Poiret+One);
@import url(https://fonts.googleapis.com/css?family=Sansita+Swashed);

/*browswer reset--maybe outdated?*/
* {
margin: 0;
padding: 0;
}


body {
	font: 13px/19px;
	color: #111;
	background-color: #F1F0EC;
	background-repeat: no-repeat;
	background:url(../images/background_trees_02.jpg) no-repeat center center fixed;
	  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

body,td,th {
	font-family: 'Assistant', sans-serif;
}

/* Style the header with a grey background and some padding */
.header {
	/*overflow: hidden;*/
	background-color: #290000;
	min-height: 20px;
	padding-top: 40px;
	padding-right: 20px;
	padding-bottom: 50px;
	padding-left: 20px;
}

/* Style the header links */
.header a {
	float: none;
	color: #ECF1E2;
	text-align: center;
	padding: 8px;
	text-decoration: none;
	font-size: 14px;
	line-height: 15px;
	border-radius: 25px;
	z-index: 888;
}

/* Style the logo link (notice that we set the same value of line-height and font-size to prevent the header to increase when the font gets bigger */
.logo {
  display:inline;
  max-height:136px;
  width:30%;
  max-width:300px;
  min-width:250px;
  position:absolute;
  top:0px;
  margin:20px;
}

a.logo {
	padding-top: 10px;
}

.logo img {
max-width: 100%;
height: auto !important;
position:relative;
z-index:200;
}

/* Change the background color on mouse-over */
.header a:hover {
	/*background-color: #E6E5E1;*/
	color: #CC123F;
	z-index: 100000;
}

/* Style the active/current link*/
.header a.active {
	background-color: #860419;
	color: white;
}

/* Float the link section to the right */
.header-right {
  float: right;
}

h1 {
	text-align: center;
	font-family: 'Big Shoulders Display', cursive;
	font-size: 3.2em;
	font-weight: 500;
	font-style: normal;
	width: 80%; /* 1000px / 1250px */
	max-width: 92.3em;
	text-shadow: 1px 1px #CCCCCC;
	color: #FFF;
	line-height: 1.2;
	margin-top: 0em;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 0em;
	padding-right: 0px;
	padding-bottom: 0.2em;
	padding-left: 0px;
	text-shadow:1px 1px 3px #000000;
}

h2 {
	font-family: 'Big Shoulders Display', cursive;
	font-size: 2.0em;
	font-weight: 400;
	font-style: normal;
	max-width: 92.3em;
	color: #FFF;
	line-height: 1.2;
	text-shadow:1px 1px 3px #000000;
}



.backgroundtrees {
  width: 100%;
  height: auto;
  display:inline-block;
}

#header_floater {
	position: absolute;
	bottom: 0px;
	padding-left:60px;
	margin: 20px;
	height: auto;
	color: #FFF;
	font-style: italic;
	font-size: small;
}

#intro_statement {
	text-align: center;
	font-family: 'Big Shoulders Display', cursive;
	font-size: 4.8em;
	font-weight: 600;
	font-style: normal;
	max-width: 92.3em;
	text-shadow: 1px 1px #CCCCCC;
	color: #FFF;
	line-height: 1.2;
	margin-top: 1.2em;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 0.2em;
	padding-right: 0px;
	padding-bottom: 0.2em;
	padding-left: 0px;
}
#intro_statement2 {
	font-family: 'IBM Plex Sans Condensed', sans-serif;
	font-weight: 300;
	font-style: italic;
	font-size: 1.8em;
	text-align: center;
	width: 90%; /* 1000px / 1250px */
	max-width: 92.3em;
	color: #FFF;
	padding: 0px;
	line-height: 1.1;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 1em;
	margin-left: auto;
}

.spacerblock{
	  dislpay:block;
	  background-color:#290001;
	  width:100%;
}

.spacerblockclear{
	  dislpay:block;
	  width:100%;
	  height:20px;
}

/* Add media queries for responsiveness - when the screen is 655px wide or less, stack the links on top of each other */ 
@media screen and (max-width: 655px) {
.backgroundtrees img {
  width: 100%;
  height: auto;
  display:inline-block;
}
  .header-right {
    float:none;
	position:static;
	padding-top:100px;
	margin: 0 auto;
	display:inline-block;
	z-index:9999;

  }
  .header {
	  margin:0 auto;
	  z-index:999;
	  text-align:center;
	  display:block;
	  margin-top:-120px;
  }

    .logo {
	  margin: 0 auto;
	  position:static;
	  display:block;
	  z-index:100;
  }
  .catalog_container {
	clear: both;
	width: 90%; /* 1000px / 1250px */
	font-size: 1em; /* 13 / 16 */
	max-width: 92.3em; /* 1200px / 13 */
	margin: 0 auto;
	padding: 1em 0px;
	color: #333;
	line-height: 1.5em;
	position: relative;
}
.contactcard {
	width: 90%;
}
}

/* Add media queries for responsiveness - when the screen is 600px wide or less, stack the links on top of each other */ 
@media screen and (max-width: 480px) {
  .header a {
    float: none;
    display: block;
    text-align: center;
  }
  .header-right {
    float: none;
	width:90%;
  }
  .logo img {
	  margin: 0 auto;
	  position:relative;
	  display:block;
	  z-index:105;
  }
  .logo {
	  margin: 0 auto;
	  position:relative;
	  display:block;
  }
  
.backgroundtrees {
	position:absolute;
	display:none;
	height:0px;
	top:-1000px;
	margin-bottom:-1000px;
	z-index:0;
}
#exit_statement {
	width:70%;
}
.contactcard {
	width: 90%;
}
}


/*end of header, logo, and background trees image styling including responsiveness*/

/*Below is for setting up responsive grid, from responsivegrid system dot com, mostly taken out now*/

.button {
	font-size: 17px;
	background: rgba(255,255,255,0.4);
	border: 2px solid #FFF;
	color: white;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	border-radius: 26px;
	transition-duration: 0.4s;
	margin-top: 4em;
	margin-right: 10px;
	margin-bottom: 4em;
	margin-left: 10px;
	padding-top: 15px;
	padding-right: 32px;
	padding-bottom: 15px;
	padding-left: 32px;
	}
	
.button:hover {
	background-color: #FFFFFF; /* Green */
	color: #666;
}

.centering {
	margin: auto;
	text-align: center;
}

#maincontent{
	clear: both;
	font-size: 1em; /* 13 / 16 */
	max-width: 92.3em; /* 1200px / 13 */
	margin: 0 auto;
	padding: 1em 0px;
	color: #333;
	line-height: 1.5em;
	position: relative;
}
		
.maincontent{
	clear: both;
	width: 80%; /* 1000px / 1250px */
	font-size: 1em; /* 13 / 16 */
	max-width: 92.3em; /* 1200px / 13 */
	margin: 0 auto;
	padding: 1em 0px;
	color: #333;
	line-height: 1.5em;
	position: relative;
}

.maincontentcontainer{
	clear:both;
	position:relative;
}

.catalog_container {
	clear: both;
	width: 60%; /* 1000px / 1250px */
	font-size: 1em; /* 13 / 16 */
	max-width: 92.3em; /* 1200px / 13 */
	margin: 0 auto;
	padding: 1em 0px;
	color: #333;
	line-height: 1.5em;
	position: relative;
}

/*Dropdown menu and links script*/
.dropbtn {
  /*color: white;*/
  /*font-size: 14px;*/
  font-family: 'Assistant', sans-serif;
  border: none;
  cursor: pointer;
  background-color:transparent;
 
}
.dropbtnactive {
  /*color: white;*/
  /*padding: 16px;*/
  /*font-size: 14px;*/
  font-family: 'Assistant', sans-serif;
  border: none;
  cursor: pointer;
  background-color: #860419;
  color: white;
	padding-top:4px;
	padding-bottom:4px;
	text-decoration: none;
	border-radius: 25px;
	size:inherit;
}

.dropdown {
  position: relative;
  display: inline-block;
  font-family: 'Assistant', sans-serif;
}

.dropdown-content {
	display: none;
	position: absolute;
	background-color: #2A0001;
	min-width: 100% /*160px*/;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.7);
	-moz-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.7);
	z-index: 350;
	font-family: 'Assistant', sans-serif;
	padding-top: 20px;
}

.dropdown-content a {
	color: #FFF;
	font-family: 'Assistant', sans-serif;
	font-size:13px;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
	/*border-bottom:1px white;*/
}

.dropdown-content a:hover {
	z-index:1000;
}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  /*background-color: #3e8e41;*/
  font-family: 'Assistant', sans-serif;
}
/*end of dropdown menu styling*/

/*horizontal rule line after mission statement*/
hr {
  border: none; 
  margin:0 auto;
  height: 1px;
  width: 65%; 
  background-image: -webkit-linear-gradient(left, #2c73c1, #ffffff, #2c73c1);
  background-image: -moz-linear-gradient(left, #2c73c1, #ffffff, #2c73c1);
  background-image: -ms-linear-gradient(left, #2c73c1, #ffffff, #2c73c1);
  background-image: -o-linear-gradient(left, #2c73c1, #ffffff, #2c73c1); 
}

/*last statement before footer*/
#exit_statement {
	text-align: center;
	font-family: 'Sansita Swashed', cursive;
	font-size: 2.5em;
	font-weight: 300;
	line-height: 1.2;
	margin: 0 auto;
	padding: 0em 0px;
	color: #CCCC66;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	width:90%;
}

/*new responsive footer styles*/
footer{
	bottom: 0;
	position:absolute;
	font-family: 'Assistant', sans-serif;
}

@media (max-height:2000px){
	footer { position: static; }
	header { padding-top:20px; }
}

.footer-distributed{
	background-color: #290001;
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
	box-sizing: border-box;
	width: 100%;
	text-align: left;
	margin-top: 40px;
	padding-top: 40px;
	padding-right: 50px;
	padding-bottom: 20px;
	padding-left: 50px;
}

.footer-distributed .footer-left,
.footer-distributed .footer-center,
.footer-distributed .footer-right{
	display: inline-block;
	vertical-align: top;
}

/* Footer left */

.footer-distributed .footer-left{
	width: 33%;
	margin:auto;
}

/* The company logo */

.footer-distributed h3{
	color:  #ffffff;
	margin: 0;
}

.footer-distributed h3 span{
	color:  #5383d3;
}

/* Footer links */

.footer-distributed .footer-links{
	color:  #ffffff;
	margin: 20px 0 10px;
	padding: 0;
}

.footer-distributed .footer-links a{
	display:inline-block;
	line-height: 1.8;
	text-decoration: none;
	color:  inherit;
}

.footer-distributed .footer-company-name{
	color: #999999;
	font-size: 14px;
	font-weight: normal;
	margin: 0;
}

/* Footer Center */

.footer-distributed .footer-center{
	width: 33%;
}

.footer-distributed .footer-center i{
	background-color:  #33383b;
	color: #ffffff;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	text-align: center;
	line-height: 42px;
	margin: 10px 15px;
	vertical-align: middle;
}

.footer-distributed .footer-center i.fa-envelope{
	font-size: 17px;
	line-height: 38px;
}

.footer-distributed .footer-center p{
	display: inline-block;
	color: #CCCCCC;
	vertical-align: middle;
	margin: 0;
	width: auto;
}

.footer-distributed .footer-center p span{
	display:block;
	font-weight: normal;
	font-size:14px;
	line-height:2;
}

.footer-distributed .footer-center p a{
	color: #CCCCCC;
	text-decoration: none;
	;
}


/* Footer Right */

.footer-distributed .footer-right{
	width: 33%;
}

.footer-distributed .footer-company-about{
	line-height: 20px;
	color:  #92999f;
	font-size: 13px;
	font-weight: normal;
	margin: 0;
	text-align:right;
}

.footer-distributed .footer-company-about span{
	display: block;
	color: #ffffff;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 10px;
	padding-right: 15px;
}

.footer-distributed .footer-icons{
	margin-top: 25px;
}

.footer-distributed .footer-icons a{
	display: inline-block;
	width: 35px;
	height: 35px;
	cursor: pointer;
	background-color:  #33383b;
	border-radius: 2px;
	color: #ffffff;
	text-align: center;
	line-height: 35px;
	margin-right: 3px;
	margin-bottom: 5px;
}

.footer-right{
	padding-top:15px;
}

/* If you don't want the footer to be responsive, remove these media queries */

@media (max-width: 880px) {
	.maincontent {
	width: 90%; /* 900px / 1250px */
	}

	.footer-distributed{
		/*font: bold 14px sans-serif;*/
	}

	.footer-distributed .footer-left,
	.footer-distributed .footer-center,
	.footer-distributed .footer-right{
		
		width: 100%;
		margin-bottom: 10px;
		text-align: center;
	}
	
	.footer-distributed .footer-company-about span{
		padding-right: 0px;
	}
	
 .footer-company-about{
	 margin: 0 0 0 0;
	 text-align:center;
 }
	
	.footer-distributed .footer-company-about {
		text-align:center;
		margin:auto;
	}

		.footer-icon img{
			display:none;
			clear:both;
			width:0px;
		}
	
	iframe {
	text-align:center;
	display:block;
	margin:auto;
	width:104px;
	}
	.catalog_container {
	clear: both;
	width: 80%; /* 1000px / 1250px */
	font-size: 1em; /* 13 / 16 */
	max-width: 92.3em; /* 1200px / 13 */
	margin: 0 auto;
	padding: 1em 0px;
	color: #333;
	line-height: 1.5em;
	position: relative;
}
.contactcard {
	width: 90%;
}
}

.footer-icon {
	width:30px;
	height:30px;
	float:left;
	padding-top:10px;
	padding-right:10px;
	clear:both;
	display:none;
	}
	
.footer-center p{
	padding-top:15px;
}

/*slide show styling*/
* {
  box-sizing: border-box;
}

img {
  vertical-align: middle;
}

/* Position the image container (needed to position the left and right arrows) */
.container {
  position: relative;
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Add a pointer when hovering over the thumbnail images */
.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(255, 255, 255, 0.5);
}

/* text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: relative;
  top: 0;
  line-height:1em;
}

/* Container for image text */
.caption-container {
	text-align: center;
	font-family: 'Assistant', sans-serif;
	font-size:1.5em;
	background-color: rgba(255, 255, 255, 0.4);
	padding: 6px 16px;
	color: #FFF;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Six columns side by side */
.column {
  float: left;
  width: 16.66%;
  background-color:#FFF;
}

/* Add a transparency effect for thumnbail images */
.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}

/*end of slider styles*/

.descriptive_text {
	font-family: 'IBM Plex Sans Condensed', sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1.3em;
	width:80%;
	margin:auto;
	color: #FFF;
	text-shadow:1px 1px 2px black;
}
.descriptive_text a {
	float: none;
	color: #ECF1E2;
	font-style: normal;	
	text-decoration: none;
}

.descriptive_text_block {
	font-family: 'IBM Plex Sans Condensed', sans-serif;
	font-weight: 300;
	margin:auto;
	width:70%;
	font-style: normal;
	font-size: 1.3em;
	color: #FFF;
	text-shadow:1px 1px 2px black;
}

/*contact form styling*/
/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
  width: 100%; /* Full width */
  padding: 12px; /* Some padding */  
  border: 1px solid #ccc; /* Gray border */
  border-radius: 4px; /* Rounded borders */
  box-sizing: border-box; /* Make sure that padding and width stays in place */
  margin-top: 6px; /* Add a top margin */
  margin-bottom: 16px; /* Bottom margin */
  resize: vertical; /* Allow the user to vertically resize the textarea (not horizontally) */
  font-size: 1.2em;
}

/* Style the submit button with a specific background color etc */
input[type=submit] {
  background-color: #290001;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

/* When moving the mouse over the submit button, add a darker green color */
input[type=submit]:hover {
	background-color: #8C0606;
}

/* Add a background color and some padding around the form */
.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}

.contactcard {
	width: 50%;
	font-family: 'IBM Plex Sans Condensed', sans-serif;
	font-weight: 300;
	padding: 12px; /* Some padding */
	border: 1px solid #ccc; /* Gray border */
	border-radius: 4px; /* Rounded borders */
	box-sizing: border-box; /* Make sure that padding and width stays in place */
	margin-top: 6px; /* Add a top margin */
	margin-bottom: 16px; /* Bottom margin */
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	resize: vertical; /* Allow the user to vertically resize the textarea (not horizontally) */
	font-size: 1.2em;
	background-color: #F5F5F5;
}

.buttonStyle2 {
  background-color: #290001;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size:1.6em;
	
}