/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Navigation*/ 

/* #Site Styles
================================================== */
#header {text-align:center; height:200px;}
#banner { background-color:#996699; height:auto; margin-bottom:20px;}
#banner h2 {color:#FFF; font-style:italic; text-align:center; padding-top:50px;}
#banner img {float:left;}
#footer {border-top:#996699 1px solid; padding:10px 0;}

/* #Page Styles
================================================== */

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		
		h1 {font-size:60px; line-height:60px; padding-top:20px;}
}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		#banner img {width:50%;}
		}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		h1 {font-size:40px; line-height:40px; }
}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}


/*Navigation*/



#navbar {width:940px; height:40px; background-color:#663366; margin-left:10px; }

.fixed {
  position: fixed;
  width: 100%;
  top: 0px;
  left: 0;
}

.nav-collapse,
.nav-collapse * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.nav-collapse,
.nav-collapse ul {
  list-style: none;
  width:100%;
  float: left;
  font-family: 'Amaranth', sans-serif;
  font-weight:normal;
}

.nav-collapse li {
  display: inline;
  margin: 0;
}


.nav-collapse li a {
float: left;
display:block;
text-decoration: none;
margin: 0;
line-height:40px;
padding: 0 25px; /*padding inside each tab*/
text-align:center;
color: #fff;
background-color:#663366;
}

.nav-collapse li a:hover, .nav-collapse li.selected a {color:#fff; background-color:#996699;}

/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		#navbar {width:748px; height:40px; background-color:#663366;}
		.nav-collapse,
		.nav-collapse ul { margin-left:0;}
		.nav-collapse li a {
		float: left;
		display:block;
		text-decoration: none;
		margin: 0;
		padding:0 20px; /*padding inside each tab*/
		color: #fff;
		font-size:1em;
}		
	}

@media screen and (max-width: 768px) {
	#navbar {margin:0;}
	.nav-collapse,
	.nav-collapse ul {
  list-style: none;
  width: 100%;
  float: left;
}
.nav-collapse li a { background-color:#663366; color:#FFF;}	
  .nav-collapse a {
    margin: 0;
	width: 100%;
    float: left;
    text-align:left;
	border-bottom: 0;
	border-bottom:#fff 1px solid;
  }
}

.nav-collapse ul ul a {
  background: #996699;
  padding-left: 2em;
}

@media screen and (min-width: 40em) {
	.nav-collapse ul ul a {
    display: none;
  }
}
@media screen and (max-width: 479px) {
	#navbar { width: 300px; }
	.nav-collapse,
	.nav-collapse ul {
  list-style: none;
  width: 100%;
  float: left;
}
}


@media only screen and (min-width: 480px) and (max-width: 767px) {

#navbar { width: 420px; }
}

/* ------------------------------------------
  NAV TOGGLE STYLES
--------------------------------------------- */

@font-face {
  font-family: "responsivenav";
  src:url("../icons/responsivenav.eot");
  src:url("../icons/responsivenav.eot?#iefix") format("embedded-opentype"),
    url("../icons/responsivenav.ttf") format("truetype"),
    url("../icons/responsivenav.woff") format("woff"),
    url("../icons/responsivenav.svg#responsivenav") format("svg");
  font-weight: normal;
  font-style: normal;
}

.nav-toggle {
  position: fixed;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-decoration: none;
  text-indent: -999px;
  position: relative;
  overflow: hidden;
  width: 70px;
  height: 55px;
  float: right;
}

.nav-toggle:before {
  color: #fff; /* Edit this to change the icon color */
  font-family: "responsivenav", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  font-size: 28px;
  text-transform: none;
  position: absolute;
  content: "=";
  text-indent: 0;
  text-align: center;
  line-height: 55px;
  speak: none;
  width: 100%;
  top: 0;
  left: 0;
}

.nav-toggle.active::before {
  font-size: 24px;
  color:#000;
  content:"x";
}