/*
	99Lime.com HTML KickStart by Joshua Gatcke
	style.css
	
*/

/*---------------------------------
	IMPORTS
-----------------------------------*/
/*@import url(http://fonts.googleapis.com/css?family=Arimo:400,700);
	@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,700);*/
/*---------------------------------
	OVERRIDES
-----------------------------------*/
#content *  { -webkit-animation: fadein 2s; -moz-animation: fadein 2s; -ms-animation: fadein 2s; -o-animation: fadein 2s; animation: fadein 2s; }
 @keyframes fadein { from {
opacity: .0;
}
to { opacity: 1; }
}
@-moz-keyframes fadein { from {
opacity: 0;
}
to { opacity: 1; }
}
@-webkit-keyframes fadein { from {
opacity: .0;
}
to { opacity: 1; }
}
@-ms-keyframes fadein { from {
opacity: 0;
}
to { opacity: 1; }
}
@-o-keyframes fadein { from {
opacity: 0;
}
to { opacity: 1; }
}
/*---------------------------------
	LAYOUT
-----------------------------------*/
html, body { width: 100%; height: 100%; background: #f6f9fd; position: relative; display: table; }
body { margin: 0; padding: 0 0 0 0; color: #333; font: normal 20px/150% 'Myriad Pro', arial, verdana, sans-serif; text-shadow: 0px 0px 1px transparent; /* google font pixelation fix */ }

header {border-top: 4px solid orange;}
footer{border-bottom: 4px solid orange;}

header { background: #333; color:#fff;  }
.head_nav { background: #578c9e;    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.31);
    z-index: 99999;
    position: relative; }
footer { position: absolute; width: 100%; left: 0; bottom: 0; min-height: 4em; padding: 1em; background: #2c3e50; }
footer * { color: #fff; text-decoration: none; }
a#logo { display: inline-block; margin: .45em 0 .65em; color: #33B2DE; text-decoration:none; font-size: 3em; font-family: "Oswald", arial, verdana, sans-serif; }
#tag { display: inline-block; margin: .15em 0 .65em 1em; color: #fff; text-decoration:none; font-size: 1.4em; font-family: "Oswald", arial, verdana, sans-serif; }
#tag span  { font-size: 70%;}
#middle {margin-bottom: 4em;  }
small {font-size: 12px; line-height: 100%; }
#mainContent { display: table; width:100%; background: #333;box-shadow: 0 0 18px #999;}
#mainContent.grid { padding: 0; }
#content { background: #fff;   padding: 0 2em 2em;min-height: 32em; position: relative;  }


#leftcolumn[class*="col_"], #content[class*="col_"] {margin: 0;  }
#content[class*="col_10"] { width:85%;   }
#content[class*="col_12"] { width:100%;   }

#sideNav { position: relative; margin-top: 6em;}
#sideNav ul {list-style:none; margin:0; padding:0; text-align: center; }
#sideNav ul li a { display: block;  padding: .5em .5em; background: #578c9e; margin: 0 0 2px .5em; width: 100%; color: #fff; text-decoration: none; }
#sideNav ul li a.current { background: orange;}

/*---------------------------------
	HEADINGS
-----------------------------------*/
h1, h2, h3, h4, h5, h6 { font-family: "Oswald", arial, verdana, sans-serif; font-weight: normal; line-height: 140%; color:#000}
h1 { font-size: 2.25em; margin: 10px 0 20px 0; }
h2 { font-size: 2.0em; margin: 10px 0 10px 0; }
h3 { font-size: 1.75em; margin: 10px 0 10px 0; line-height: 130%; }
h4 { font-size: 1.55em; margin: 10px 0 10px 0; border-bottom: 1px dashed #999; }
h5 { font-size: 1.25em; margin: 10px 0 10px 0; }
h6 { font-size: 1.1em; margin: 10px 0 5px 0; }
p {color: #555}
/* NAV BAR*/
.navbar { position: fixed; top: 0; left: 0; width: 100%; background: #000; color: #fff; z-index: 1000; }
.navbar #logo { position: absolute; top: 0; right: 0; padding: 0.5em 1em; font-size: 1.7em; color: #efefef; text-decoration: none; }
.navbar span { color: #86dc00; }
.navbar ul { display: inline-block; margin: 0; padding: 0; }
.navbar li { margin: 0; padding: 0; list-style-type: 0; display: inline-block; }
.navbar li a { display: inline-block; color: #efefef; padding: 1em 1.3em; text-decoration: none; text-transform: uppercase; line-height: 100%; font-size: 1.2em; }
.callout { background: #578c9e;/*#86dc00;*/ padding: 1em 0; margin: 1em; color: #fff; box-shadow: inset 0px 0px 10px rgba(0,0,0,0.2); text-align: center; display: block; }
.callout + div.grid { margin-top: 50px; }
a.callout { cursor: pointer; text-decoration:none; font-size: 2em }
.callout i.icon-4x { font-size: 6em; }
.callout h4 { margin-bottom: 30px; }
.callout-top { margin: 50px 0 0 0; }
.callout p { margin-bottom: 0; }
.callout .button { margin-top: 10px; }
.callout.green { background: #19ad0b;/*#86dc00;*/ }
.callout:hover {box-shadow: 0 0 22px #aaa; Xborder-radius: 12px; }

/* MISC OBJ */
.box { padding: 16px; border-radius: 12px; border: 4px solid #999; box-shadow: 0 0 8px #999; }
.halo { box-shadow: 0 0 8px rgba(0,0,0,.9) }
.scrollTo { cursor: pointer; opacity: .5; }
.scrollTo:hover { opacity: 1; }
.clickme { position: fixed; z-index: 20; bottom: 260px; right: 10px; display: none; opacity: .5; }
.clickme:hover { opacity: 1 }
#arrowup { width: 32px; }
/* transition  */
.scrollTo, .clickme { transition: all 0.5s ease; }
.whiteText {color: white!important}

/* other  */

a.button.black, input[type=submit].black { color: #fff; text-decoration: none; margin-right: 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 1px 0px rgba(255,255,255,0.1) inset, 0 0px 1px rgba(0,0,0,0.7); -moz-box-shadow: 0 1px 0px rgba(255,255,255,0.1) inset, 0 0px 1px rgba(0,0,0,0.7); box-shadow: 0 1px 0px rgba(255,255,255,0.1) inset, 0 0px 1px rgba(0,0,0,0.7); background: rgba(0,0,0,1); /* #191919 */ border: 1px solid #141414; padding: 10px 25px; }
a.button.black:active, a.button.black:focus { box-shadow: 0 0 0 transparent inset; }

div.multiColumn { padding: 1em 0 0 0; -moz-column-count: 2; -moz-column-gap: 20px; -webkit-column-count: 2; -webkit-column-gap: 20px; column-count: 2; column-gap: 20px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; }
div.multiColumn4 { padding: 1em 0 0 0; -moz-column-count: 4; -moz-column-gap: 20px; -webkit-column-count: 4; -webkit-column-gap: 20px; column-count: 4; column-gap: 20px; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; text-align: center; }
.multiColumn li,.multiColumn4 li { -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; }
.multiColumn4 ul { list-style:none;}
.multiColumn4 a { text-decoration: none; color: #036; font-size: 1.2em; }
.transition, .callout:hover, #sideNav {
  transition: all 1.5s ease;
}
 @media all and (min-width: 1024px) and (max-width: 1280px) {

.menu li a { padding: 15px 20px;  }
}
 @media all and (min-width: 768px) and (max-width: 1023px) {


.menu li a { padding: 15px 20px; font-size: 1.3em; }

	}
 @media all and (min-width: 480px) and (max-width: 768px) {
			#sideNav {margin-top: 0}
}
 @media all and (max-width: 480px) {
		header, footer {text-align:center}
	#sideNav {margin-top: 0}
	footer { min-height: 3em; }
	 .bx-wrapper { position: relative; margin: 0 0 -20px; padding: 0;  
min-height: 60vh; }
	.slideshow li {   padding: 2.5em 0 0 0;  font-size: 1.5em;  max-width: 50%;  }
	#slideshow-background { min-height: 50vh; text-align: right; width: 105%; z-index:0; }
#slideshow-background img { max-height: 50vh; width: auto;}
.slideshow {   width: 60%; height: auto;  min-height: 60vh;}
#tag { display: inline-block; margin: .15em auto .65em auto; }
#content {padding: 0 .65em 2em;  min-height:300px;}
.callout {
    background: #578c9e;
    padding: 1em 0;
     margin: 00; }
#middle {margin-bottom: 6em;  }
	 
}


@media (-webkit-min-device-pixel-ratio: 1.3),
       (min--moz-device-pixel-ratio: 1.3),   
       (-o-min-device-pixel-ratio: 13/10),   
       (min-device-pixel-ratio: 1.3),    
       (min-resolution: 2dppx),         
       (min-resolution: 120dpi)         
       {

/*body { font-size: large; }
h1 {font-size: 2.5em;}
.grid {max-width: 100%; width: 100%}*/
}