html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
body {
	background-color: rgba(246,227,210,1.00);
	margin-bottom:100px;
	padding-bottom:100px;
	
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
h1 {
	color: #000;
	font-family: 'Yeseva One';
	font-size: 40pt;
	line-height: 40pt;
	letter-spacing: -0.02em;
}
h2 {
}

/* Mobile Layout: 568px and below. */


a:link {
	color: #000;
	text-decoration: none;
}
a:visited{
	color: #000;
	text-decoration: none;
}
a:hover{
	color: #fff;
	text-decoration: none;
}
#headcontainer {
	z-index: 10;
	background-color: rgba(246,227,210,0.8);
	position: fixed;
	top: 0;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	padding-left: 0%;
	padding-right: 0%;
}
#header {
	margin-bottom: 1%;
	margin-top: 1%;
	font-family: 'open Sans', sans-serif;
	font-size: 20px;
	color: #000;
	padding-left: 4%
}
#header img{
 width: 60%;
}
#nav1 {
	font-size: 22px;
	text-align: right;
	margin-top: 1%;
	margin-bottom: 1%;
	margin-right: 5%;
	font-family: 'open Sans', sans-serif;

}
#nav2 {
	font-size: 22px;
	text-align: right;
	margin-top: 1%;
	margin-bottom: 1%;
	margin-right: 5%;
	font-family: 'open Sans', sans-serif;
	width: 33%;

}
.dropmenu {
	font-size: 36px;
	text-align: right;
	margin-top: 1%;
	margin-bottom: 1%;
	margin-right: 5%;
	font-family: 'open Sans', sans-serif;
	background-color: rgba(246,227,210,0);
	color: #000;
    border: none;
    padding: 0px 0px;
    text-decoration: none;
}
.dropmenu:hover {
	color: #fff;
}
#menudropdown {
	overflow: hidden;
	display: none;
	z-index: 11;
	background-color: rgba(240,211,187,1.00);
	padding: 5% 10% 10% 0%;
	margin-top: 0;
	margin-right: 2%;	
}
#menudropdown a {
	color: #000;
}
#menudropdown a:hover{
	background-color: rgba(235,197,164,1.00);
	color: #000;
	font-weight:bold;
	text-decoration: underline;
}
#nav2:hover #menudropdown {
    display: block;
}
#imgmain {
	z-index: 1;
	width: 100%;
	top: 0px;
	margin-top: 10%;
    top:0;left:0;
}
#imgfeature {
	z-index: 1;
	width: 100%;
	top: 0px;
	margin-top: 40%;
    top:0;left:0;
	position:relative;
}
#featureoverlay {
	position: absolute;
	clear:both;
	z-index: 1;
	transition: .5s ease;
	color: rgba(0,0,0,0);
	text-align: left;
	background: rgba(255,255,255,0.0);
	font-family: 'open Sans', sans-serif;
	font-size: 12pt;
	padding: 2%;
	margin: 0;
	bottom: 0;
}
#imgfeature:hover #featureoverlay {
	background: rgba(255,255,255,0.5);
	color: rgba(0,0,0,1);
}
#featureoverlay a:link {
	color: rgba(0,0,0,0);
	transition: .5s ease;	
}
#featureoverlay a:visited{
	color: rgba(0,0,0,0);
}
#featureoverlay a:hover{
	color: rgba(0,0,0,0);
}
#imgfeature:hover #featureoverlay a:link{
	color: rgba(0,0,0,1);
	text-decoration: none;
	font-weight: bold;
}
#imgfeature:hover #featureoverlay a:visited{
	color: rgba(0,0,0,1);
	text-decoration: none;
	font-weight: bold;
}
#imgfeature:hover #featureoverlay a:hover{
	color: rgba(0,0,0,1);
	text-decoration: underline;
	font-weight: bold;
}
#titletop {
	z-index: 2;
	position: absolute;
	float: left;
	color: #000;
	font-family: 'Yeseva One', cursive;
	top: 0;
	display: block;
	clear: both;
	width: 25%;
	margin-top: 15%;
	margin-left: 3%;
	font-size: 60pt;
	line-height: 60pt;
	letter-spacing: -0.02em;
}
#tileimg:hover {
    opacity: 0.75;
    filter: alpha(opacity=75); /* For IE8 and earlier */
}
#midtile {
	font-family: 'open Sans', sans-serif;
	position: relative;
}
#midtileoverlay {
	position: absolute;
	transition: .5s ease;
	color: rgba(0,0,0,0);
	text-align: left;
	background: rgba(255,255,255,0.0);
	font-family: 'open Sans', sans-serif;
	bottom: 0;
	font-size: 12pt;
	padding: 5%;
	width: 90%;
}
#midtile:hover #midtileoverlay {
	background: rgba(255,255,255,0.5);
	color: rgba(0,0,0,1);
}
#midtileoverlay a:link {
	color: rgba(0,0,0,0);
	transition: .5s ease;	
}
#midtileoverlay a:visited{
	color: rgba(0,0,0,0);
	transition: .5s ease;	
}
#midtileoverlay a:hover{
	color: rgba(0,0,0,0);
	transition: .5s ease;
}
#midtile:hover #midtileoverlay a:link{
	color: rgba(0,0,0,1);
	text-decoration: none;
	font-weight: bold;
}
#midtile:hover #midtileoverlay a:visited{
	color: rgba(0,0,0,1);
	text-decoration: none;
	font-weight: bold;
}
#midtile:hover #midtileoverlay a:hover{
	color: rgba(0,0,0,1);
	text-decoration: underline;
	font-weight: bold;
}
#bigtile {
	font-family: 'open Sans', sans-serif;
	position:relative;
}
#bigtileoverlay {
	position: absolute;
	transition: .5s ease;
	color: rgba(0,0,0,0);
	text-align: left;
	background: rgba(255,255,255,0.0);
	font-family: 'open Sans', sans-serif;
	bottom: 0;
	font-size: 12pt;
	padding: 2%;
	width: 96%;
}
#bigtile:hover #bigtileoverlay {
	background: rgba(255,255,255,0.5);
	color: rgba(0,0,0,1);
}
#bigtileoverlay a:link {
	color: rgba(0,0,0,0);
	transition: .5s ease;	
}
#bigtileoverlay a:visited{
	color: rgba(0,0,0,0);
	transition: .5s ease;	
}
#bigtileoverlay a:hover{
	color: rgba(0,0,0,0);
	transition: .5s ease;
}
#bigtile:hover #bigtileoverlay a:link{
	color: rgba(0,0,0,1);
	text-decoration: none;
	font-weight: bold;
}
#bigtile:hover #bigtileoverlay a:visited{
	color: rgba(0,0,0,1);
	text-decoration: none;
	font-weight: bold;
}
#bigtile:hover #bigtileoverlay a:hover{
	color: rgba(0,0,0,1);
	text-decoration: underline;
	font-weight: bold;
}
#vidcontainer {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}
#vidcontainer1 {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

/* Then style the iframe to fit in the container div with full height and width */
.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.ie7 .title {
    padding-top: 20px;
}
#sh {
	font-weight: 700;
	margin-top: -3%;
}
#ft {
	font-size: 12px;
}
#sp {font-size:10px;
}
.clientlogos img{
	margin-right: 4%;
	margin-bottom: 10%;
}


/* Mobile Layout: (landscape). */
@media only screen 
and (orientation: landscape) {

#header img{
 width: 50%
}
#nav1 {
	font-size:20px;
	margin-top: 2%
}
#nav2 {
	font-size:20px;
	margin-top: 2%
}
#imgmain {
	top: 0px;
	margin-top: 0;
    top:0;left:0;
	width: 100%;
}
#imgfeature {
	top: 0px;
	margin-top: 20%;
    top:0;left:0;
	width: 100%;
}
#titletop {
	width: 25%;
	margin-top: 15%;
	font-size: 40pt;
	line-height: 40pt;
}

}

/* Mobile Layout: (portrait). */
@media only screen 
and (orientation: portrait) {
#imgmain {
}

}

/* large phone: (portrait). */
@media only screen 
and (orientation: portrait) and (min-width: 321px){
	
}




/* Tablet Layout: 569px to 1024px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 569px) {


nav ul li {
	display: inline;
    }

.oldie nav a {
	margin: 0 0.7%;
}
}

/* Tablet Layout: (portrait). */
@media only screen 
and (orientation: portrait) and (min-width: 569px){

#header img{
 width: 100%
}
#nav1 {
	font-size:18px;
	margin-top: 2%
}
#nav2 {
	font-size:20px;
	margin-top: 2%;
	width: 25%
}
#titletop {
	margin-top: 10%;
	margin-left: 4%;
	font-size: 50pt;
	line-height: 50pt;
}
#imgfeature {
	top: 0px;
	margin-top: 15%;
	margin-right: 5%;
    top:0;left:0;
	width: 85%;
	float: right;	
}
#midtileoverlay {
	font-size: 12pt;
	padding: 5%;
	width: 90%;
}

}

/* Tablet Layout: (landscape). */
@media only screen and (min-width: 569px) and (orientation: landscape){

#header img{
 width: 50%
}
#nav1 {
	font-size:22px;
	margin-top: 1.5%;
	margin-right: 0%;
}
#nav2 {
	font-size:22px;
	margin-top: 0
}
.dropmenu {
	font-size: 35px;
}
#imgmain {
	top: 0px;
	margin-top: 0;
	margin-right: 0;
    top:0;left:auto; right: auto;
	width: 100%;
	float: none;	
}
#imgfeature {
	top: 0px;
	margin-top: 15%;
	margin-right: 5%;
    top:0;left:0;
	width: 85%;
	float: right;	
}
#titletop {
	margin-top: 10%;
	margin-left: 4%;
	font-size: 60pt;
	line-height: 60pt;
}
#midtileoverlay {
	font-size: 12pt;
	padding: 5%;
	width: 90%;

}
	.clientlogos img{
	margin-right: 5%;
	margin-bottom: 3%
}

}

/* Retina tablet Layout: */
@media only screen and (min-width: 569px) and (-webkit-min-device-pixel-ratio: 2) {


}

/* Retina Layout: (portrait). */
@media only screen and (min-width: 569px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
	#imgmain {
}
}

/* Retina Layout: (landscape). */
@media only screen and (min-width: 569px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {

#imgmain {
}
}


/* Desktop Layout: 1025px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 1025px) {

#headcontainer {
	max-width: 1232px;
	padding-left: 0%;
	padding-right: 0%;
	margin: auto;	
	width: 95%
}

#header {
  margin-bottom: 0%;
  	
}
#header img{
 width: 30%
}
#nav1 {
	font-size:20px;
	margin-top: 1%;
	margin-right: 0%;
}
#nav2 {
	font-size:20px;
	margin-top: 0%;
	padding-right: 0%;
	width: 15%
} 
.dropmenu {
	font-size: 40px;
}
#imgmain {
	top: 0px;
	margin-top: 7%;
	margin-right: auto; margin-left: auto;
    top:0;left:auto; right: auto;
	width: 100%;
	float: none;	
}
#titletop {
	margin-top: 7%;
	margin-left: 2%;
	font-size: 70pt;
	line-height: 60pt;
}	
#imgfeature {
	top: 0px;
	margin-top: 10%;
	margin-right: 5%;
    top:0;left:0;
	width: 85%;
	float: right;	
}
#midtileoverlay {
	font-size: 12pt;
	padding: 5%;
	width: 90%;

}
#vidcontainer {
	width: 90%;
	margin: auto;
	}

h1 {
	font-size: 60pt;
	line-height: 60pt;
}
}

/* Retina Layout */
@media only screen and (min-width: 1025px) and (-webkit-min-device-pixel-ratio: 2) {


}