/* mySea of Dreams website CSS by Stephanie Kang */

/* clears browser default settings */

* { margin: 0; padding: 0; }

/* universal settings */

body  {
	background: #444;
   	font-family: Verdana, Arial, Helvetica,  sans-serif;
   	font-size: 100%;
   	line-height: 1.5em;
   	text-align: left;
   	color: #444;
    margin: 0;
    padding: 0;
}

p, h1, li { margin: 0 0 1.5ex 0; }

h2, h3, h4, h5, h6 { margin: 2.4ex 0 1ex 0; }

h1, h2, h3 { 
	font-family: "Frutiger Condensed", Arial, Verdana, Helvetica, sans-serif;
	font-weight: bold; 
	color: #be26b7; 
}

h1 { font-size: 170%; }

h2 { font-size: 130%; }

h3 { font-size: 110%; color: #444;}


p a:link, p a:visited  {
	font-weight: bold;
	text-decoration: none;
    color: #222;
    border-bottom: 2px dotted;
 }

p a:hover {
	font-weight: bold;
	color: #be26b7;
  	border-bottom: none;
}

p a:active {
  position: relative;
  top: 1px;
}

span {
	font-weight: bold;
}

img.photo_lt {
	float: left;
	margin: 0 10px 10px 0; 
}

img.photo_rt {
	float: right;
	margin: 0 0 10px 10px; 
}

/* outer div that wraps content */

div#container{
	position: relative;
    width: 900px;
    margin: 0 auto;
    padding: 0;
    border-top: none;
    border-right: solid 2px #a00691;
    border-bottom: solid 2px #a00691;
    border-left: solid 2px #a00691;
    background-color: #fff
}


/* header */

div#header {
	margin: 0;
	position: relative;
	height: 155px;  
	background: url(../images/header.png) no-repeat;
}


#header #logo.home {
    position: absolute;
    left: 294px;
    top: 0px;
	height: 155px;
    width: 210px;
	text-indent: -1000em;
	background: url(../images/header_logo.png) no-repeat;
}


/* home button link*/

#header #logo.homeButton {
    position: absolute;
    left: 294px;
    top: 0px;
}

#logo.homeButton a:link, #logo.homeButton a:visited{
    height: 155px;
    width: 210px;
    display: block;
    text-indent: -1000em;
    background: url(../images/header_logo.png) no-repeat;
    border: none;
}

#logo .homeButton a:hover, #logo .homeButton a:active{
    border: none;
}


/* mainNav link */

#header #mainNav {
    position: absolute;
    left: 623px;
    top: -5px;
}

#mainNav ul {               /* turn off all the normal list behavior */
    list-style: none;
    margin: 0;
    padding: 0;
}

#mainNav li {               /* turn off the normal list item behavior */
    float: left;
    margin: 0;
    padding:0;
}

#mainNav li a.about:link, #mainNav li a.about:visited {
	height: 32px;
    width: 81px;
    display: block;
    text-indent: -1000em;
    background: url(../images/nav_about.gif) no-repeat;
    border: none;
}

#mainNav li a.about:hover, #mainNav li a.about:active {
    background: url(../images/nav_about_h.gif) no-repeat;
    border: none;
}

#mainNav li a.about_c {  /* about "current" link */
	height: 32px;
	width: 81px;
	display: block;
	text-indent: -1000em;
	background: url(../images/nav_about_c.gif) no-repeat;
	 border: none;
}

#mainNav li a.about_c:hover {
	cursor: default;
	border: none;
}

#mainNav li a.portfolio:link, #mainNav li a.portfolio:visited {
	height: 32px;
    width: 81px;
    display: block;
    text-indent: -1000em;
    background: url(../images/nav_port.gif) no-repeat;
    border: none;
}

#mainNav li a.portfolio:hover, #mainNav li a.portfolio:active {
    background: url(../images/nav_port_h.gif) no-repeat;
    border: none;
}

#mainNav li a.portfolio_c {  /* portfolio "current" link */
	height: 32px;
	width: 81px;
	display: block;
	text-indent: -1000em;
	background: url(../images/nav_port_c.gif) no-repeat;
	 border: none;
}

#mainNav li a.portfolio_c:hover {
	cursor: default;
	border: none;
}

#mainNav li a.contact:link, #mainNav li a.contact:visited {
	height: 32px;
    width: 81px;
    display: block;
    text-indent: -1000em;
    background: url(../images/nav_contact.gif) no-repeat;
    border: none;
}

#mainNav li a.contact:hover, #mainNav li a.contact:active {
    background: url(../images/nav_contact_h.gif) no-repeat;
    border: none;
}

#mainNav li a.contact_c {  /* contact "current" link */
	height: 32px;
	width: 81px;
	display: block;
	text-indent: -1000em;
	background: url(../images/nav_contact_c.gif) no-repeat;
	border: none;
}

#mainNav li a.contact_c:hover {
	cursor: default;
	border: none;
}

/* main content */

#mainBanner  {
	width: 799px;
	height: 318px;
	text-align: center;
	position: relative;
}

 #container #content.noborder{
	height: 400px;
    margin: 0 0px 25px 60px;
    padding: 0 60px 0 0;
    border-right: none;
 }

#container #content.rtborder {
    float: left;
    width: 450px;
    margin: 0 0 0 60px;
    padding: 0 25px 0 0;
    border-right: dotted 1px #a00691;
 }
 
 #container #content.ltbar {
    float: left;
    width: 500px;
    margin: 0 0 0 60px;
    padding: 0 25px 0 0;
    border-right: dotted 1px #a00691;
 }
 
 #sidebar {
 	float: left;
 	width: 235px;
	margin: 0;
 	padding: 0 25px 0 25px;
 }
 
 #container #content.shbg{
 	width: 900px;
	height: 400px;
    margin: 0;
    padding: 0;
    border-right: none;
    background: url(../images/contact_bg.gif) no-repeat bottom right;
  }   
 
#container div#ezine {
 	float: left;
 	width: 300px;
	margin: 0;
 	padding: 0 25px 0 30px;
 }
  
#ezineTable {
	background: #fcecfc;
	margin: 0;
    padding: 10px;
    border: 1px solid #a00691;
    font-size: 90%;
}

div#testimonials {
 	clear: both;
 	margin: 0 60px;
 	padding: 15px 0;
 }
 
div#icons {
 	margin: 0 60px;
 	padding: 15px 0;
 }
 
div#bottom {
	clear: both;
	height: 95px;  
	margin:0;
	padding: 0;
	background: url(../images/footer_bg.gif) no-repeat;
}

/*vanity photo gallery*/

#photoShow {
	width: 799px;
	height: 318px;
}

#photoShow div{
	position: absolute;
	left: 50px;
	z-index: 0;
}

#photoShow div.previous{
	z-index: 1;
}

#photoShow div.current{
	z-index: 2;
}

/* testimonial table */

#testTable {
	width:100%;
	border-collapse:collapse;
}

#testTable td {
font-size:1em;
border:1px dotted #a00691; 
padding:5px 10px 5px 10px;
}

#testTable tr.alt td  {
color:#333;
background-color: #edebe9;
}

/* icons */
#icons ul {               /* turn off all the normal list behavior */
    list-style: none;
    margin: 0;
    padding: 0;
}

#icons li {               /* turn off the normal list item behavior */
    float: left;
    margin: 0;
    padding:0px 3px 0 3px;
}

#icons li a.youtube:link, #icons li a.youtube:visited {
	height: 22px;
    width: 23px;
    display: block;
    text-indent: -1000em;
    background: url(../images/ico_youtube.gif) no-repeat;
    border: none;
}

#icons li a.youtube:hover, #icons li a.youtube:active {
    background: url(../images/ico_youtube.gif) no-repeat;
    border: none;
}

#icons li a.facebook:link, #icons li a.facebook:visited {
	height: 22px;
    width: 22px;
    display: block;
    text-indent: -1000em;
    background: url(../images/ico_fb.gif) no-repeat;
    border: none;
}

#icons li a.facebook:hover, #icons li a.facebook:active {
    background: url(../images/ico_fb.gif) no-repeat;
    border: none;
}

#icons li a.twitter:link, #icons li a.twitter:visited {
	height: 22px;
    width: 22px;
    display: block;
    text-indent: -1000em;
    background: url(../images/ico_twitter.gif) no-repeat;
    border: none;
}

#icons li a.twitter:hover, #icons li a.twitter:active {
    background: url(../images/ico_twitter.gif) no-repeat;
    border: none;
}


/*subpage elements*/
    
 #container #content.shbg div{
    margin: 0;
    padding: 0 80px;
    border-right: none;
 }

 
/*about*/

h1#about {
	height: 23px;
	text-indent: -1000em;
    background: url(../images/about_hd.gif) no-repeat;
}

#sidebar {
	height: 755px;
	text-indent: -1000em;
    background: url(../images/about_side.jpg) no-repeat;
}

/*portfolio*/

div#reel {
	margin: 0;
	position: relative;
	width: 780px;
	height: 240px; 

}

div#sample {
	margin: 0;
	position: relative;
	width: 780px;
	height: 240px; 

}

h1#portfolio {
	height: 23px;
	text-indent: -1000em;
    background: url(../images/portfolio_hd.gif) no-repeat;
}

#sample ul {               /* turn off all the normal list behavior */
    list-style: none;
    margin: 0;
    padding: 0;
}

#sample li {               /* turn off the normal list item behavior */
    float: left;
    margin: 0;
    padding:0;
}

#sample li a.web {
	margin-right: 15px;
	height: 131px;
    width: 151px;
    display: block;
    text-indent: -1000em;
    background: url(../images/port_web.jpg) no-repeat;
    border: none;
}

#sample li a.dvd {
	margin-right: 15px;
	height: 131px;
    width: 151px;
    display: block;
    text-indent: -1000em;
    background: url(../images/port_dvd.jpg) no-repeat;
    border: none;
}

#sample li a.itv {
	margin-right: 15px;
	height: 131px;
    width: 151px;
    display: block;
    text-indent: -1000em;
    background: url(../images/port_itv.jpg) no-repeat;
    border: none;
}

#sample li a.print {
	margin-right: 15px;
	height: 131px;
    width: 151px;
    display: block;
    text-indent: -1000em;
    background: url(../images/port_print.jpg) no-repeat;
    border: none;
}

/*contact*/

h1#contact {
	height: 23px;
	text-indent: -1000em;
    background: url(../images/contact_hd.gif) no-repeat;
}


/*confirmation page elements*/

a.backBtn:link, a.backBtn:visited {
    height: 36px;
    width: 55px;
    display: block;
    text-indent: -1000em;
    background: url(../images/back.gif) no-repeat;
    border: none;
}

a.backBtn:hover, a.backBtn:active{ 
	border: none;
}

/* footer */
div#footer {
	width: 900px;
	background: transparent;
	margin: 0 auto;
	padding: 5px;
}

#footer p {
	text-align: center;
	font-size: 0.85em;
	color: #666;
	margin: 0;
    padding: 0;
}

.form {
	margin: 5px;
	padding: 3px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	color: #444;
	text-decoration: none;
	background-color: #fff;
	border: 1px solid #999;
}

.roundify{
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}

.required {
	color: #be26b7;
}

.pink {
	font-weight: bold;
	color: #be26b7;
}

.name {
	font-weight: bold;
	color: #555;
}

/* clears floating */
.clear { clear: both }

