﻿body {
	background: url('images/bg.jpg') center top;
	font-family:Verdana, Geneva, Tahoma, sans-serif;
	font-size:13px;
}
#container {
	max-width:1001px;
	width:100%;
	margin:auto;


}
#header {
	text-align:center;
	height:185px;
	
}
#navigation {
	background-color:#D9B38C;
	border:2px solid white;
	border-radius:5px;
}
#navigation ul {
	list-style-type:none;
    margin-left:9px;  
	margin-top:0px;
	margin-bottom:0px;
	padding:5px 0px 5px 0px;
}
#navigation li {
	display:inline;
	
}
#navigation a:link, #navigation a:visited, #navigation a:active {
	background: url(images/nav-ball.png) right center;
	background-repeat:no-repeat;
	text-decoration:none;
	font-size:18px;
	color:black;
	padding:0px 58px 0px 42px;
}
#navigation a.contact:link, #navigation a.contact:visited, #navigation a.contact:active {
	background-image:none;
	padding-right:0px;
}
#navigation a:hover {
	color:white;
	
}
/* Hide the list item that contains the link that should open and close the topnav on small screens */
#navigation ul.topnav li.icon {display: none;}

#pre-wrapper {
	
	margin-top:3px;

}
#pre-wrapper-left {
	width:578px;
	float:left;
}
#slideshow {
	border:2px solid white;
	border-radius:5px;
	overflow:hidden;
}
#pre-wrapper-right {
   
    float:left;
    margin-left:3px;
    width:420px;
    line-height:22px;
}
#wrapper {
	margin-top:3px;
}
#wrapper-text {
	padding:10px;
	padding-right:0px;
	background-color:#CCA7B6;
	border:2px solid white;
	border-radius:5px;
	margin-top:3px;
}
#wrapper-text-op {
	padding:10px;
	background-color:#CCA7B6;
	border:2px solid white;
	border-radius:5px;
	margin-top:3px;
}
#wrapper-left {
	float:left;
}
#wrapper-right {
	float:left;
	margin-left:89px;
	
}
#social-media {
	text-align:center;
	margin-top:3px;
}
#pictures {
	text-align:center;
}
#progress { 
    position: absolute; 
    bottom: 0; height: 4px; 
    width: 0px; 
    background: #CCA7B6; 
    z-index: 500;
}
#sig {
	font-size:11px;
	text-align:center;
	margin-top:5px;
	color:white;
}
#slideshow img { display: none; 
}
#slideshow img.first { display: block;
}
#video-frame {
	margin-top:3px;
}
#video-frame-header {
	background: url(images/star.png) 10px 0px;
	background-repeat:no-repeat;
	background-color:#8E5B6E;
	border:2px solid white;
	border-radius:5px;
	color:white;
	font-size:18px;
	padding:5px 0px 5px 0px;
	text-align:center;
}


/* CLASSES */

.slide {
	max-width:578px;
	width:100%
}
.header {
	background: url(images/star.png) 10px 0px;
	background-repeat:no-repeat;
	background-color:#8E5B6E;
	border:2px solid white;
	border-radius:5px;
	color:white;
	font-size:18px;
	padding:5px 0px 5px 0px;
}
.image1 {
	
}
.image2 {
	display:none;
}

.center {
	text-align:center;
}
.text {
	background-color:white;
	padding:5px;
	margin-top:3px;
	border-radius:5px;
	height:154px;
	
}
.name {
	color:#333D71;
	font-size:25px;
	font-style:italic;
	
}
.sub {
	margin-top:3px;
}
.label {
	background: url(images/star.png) 10px 0px;
	background-repeat:no-repeat;

	background-color:#8E5B6E;
	border:2px solid white;
	border-radius:5px;
	color:white;
	font-size:18px;
	padding:5px 0px 5px 0px;
	text-align:center;
}
.picture {
	vertical-align:middle;
}
.border {
	border:2px solid white;
	border-radius:5px;
}
.purple {
	background-color:#AB6E85;
}
.white {
	background-color:white;
}
.overflow-theater {
	overflow-y:auto;
	overflow-x:hidden;
	height:400px;
}
.border {
	border: 2px solid #FFFFFF;
}
.video {
	float:left;
}
.video-sub {
	margin-top:10px;
}
.video-margin {
	margin-left:30px;
}
.logo {
	width:100%;
	max-width:930px;
}
.profile {
	float:right;
	margin-left:10px;
}
.break {
	display:none;
}
.overflow {
	overflow-y:auto;
	overflow-x:hidden;
	height:154px;

}

/* MEDIA QUERIES */


/* PRE WRAPPER */

@media only screen and (max-width: 1032px) {
	#pre-wrapper-left {
	float: none;
	width:100%;
}
    #pre-wrapper-right {
	float: none;
	width:100%;
	margin-top:3px;
	margin-left:0px;
}
.image1 {
	display:none;
}
.image2 {
	display:block;
	margin: 0 auto;
	
}
#container {
	padding-top:0px;
}

/* SLIDESHOW */

.slide {
	max-width:none;
	width:100%
}

/* WRAPPER */

#wrapper-left {
	float:none;
}
#wrapper-right {
	float:none;
	margin-top:10px;
	margin-left:0px;
	text-align:center;
}
#video-frame-header {
	background: url(images/star.png) 10px 0px;
	background-repeat:no-repeat;
	background-color:#8E5B6E;
	border:2px solid white;
	border-left:0px;
	border-right:0px;
	border-radius:0px;
	color:white;
	font-size:18px;
	padding:5px 0px 5px 0px;
	text-align:center;
	margin-left:-10px;
}

}
/* NAVIGATION */ 

	@media screen and (max-width:1032px) {
 #navigation ul.topnav li:not(:first-child) {display: none;}
  #navigation ul.topnav li.icon {
    float:right;
    display: inline-block;
    margin-top:-2px;

  

    
  }
  #navigation ul.topnav.responsive {position: relative;}
 #navigation ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;

    
  }
   #navigation ul.topnav.responsive li {
    float: none;
    display: inline;
  }
 #navigation ul.topnav.responsive li a {
    display: block;
    text-align: left;
    background-image:none;
    margin-top:5px;
   
    
   
}
#navigation a:link, #navigation a:visited, #navigation a:active {
	background-image: none; 

}
#navigation ul.topnav.responsive li a.home {
margin-top:0px;



}
#navigation a:link, #navigation a:visited, #navigation a:active {
	margin-left:5px;
}
#navigation ul.topnav {
	margin-left:-28px;
}
#navigation ul.topnav.responsive a:hover {
	color:white;
	background: url(images/nav-ball.png) 28px center;
	background-repeat:no-repeat;

	
}
#navigation ul.topnav.responsive li.icon a:hover {
	background-image:none;

	
}

#navigation a.icon:link, #navigation a.icon:visited, #navigation a.icon:active {
	
	padding:0px 10px 0px 42px;


}
.profile {
	float:none;
	margin-left:0px;
}
.break {
	display:block;
	margin-top:10px;
}
.video {
	float:none;
	
}
.video-margin {
	margin-left:0px;
	margin-top:10px;
}
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

}

@media only screen and (max-width: 443px) {
.label {
	background-image:none;
}
}

