/* 
Title:	Master styles for screen media
Author:	George Smerin
*/

/* CSS Reset */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0;padding: 0;font-size: 100%; vertical-align: baseline;border: 0;outline: 0;background: transparent;}
ol, ul {list-style-type: none;}
blockquote, q {quotes: none;}
:focus {outline: 0;}
table {border-collapse: collapse;border-spacing: 0;}
		

/* 
Title:	Master styles for screen media
Author:	George Smerin
*/


body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #FFF;
	font-size: 62.5%;
	background:#000;
}

/* page structure
----------------------------------------- */

#wrap {
	width:950px;
	margin:0 auto;
	background:url(images/background-repeat.png) repeat-y top left;
}
#wrap-inner {
	width:950px;
	background:url(images/background-top.png) no-repeat top left;
}

#nav {
	float:left;
	width:225px;
	position:relative;
	top:78px;
	border-top:2px solid white;
}

#main-wrap {
	float:left;
	width:725px;
	min-height:400px;
}

#main {
	float:left;
	width:500px;
}
#main-padding {
	padding:0 25px;
}

#sidebar {
	width:225px;
	padding-top:20px;
	float:right;
}

#footer {
	width:100%;
	margin:0 auto;
	background:url(images/footer.png);
	width:950px;
	height:80px;
	padding-top:15px;
}


/* main styles
----------------------------------------- */


#body-band h2 {background:url(images/page-headers.gif) 0 -20px; }
#body-discoservices h2 {background:url(images/page-headers.gif) 0 -40px; }
#body-discolive h2 {background:url(images/page-headers.gif) 0 -60px; }
#body-dancers h2 {background:url(images/page-headers.gif) 0 -80px; }
#body-production h2 {background:url(images/page-headers.gif) 0 -100px; }
#body-contact h2 {background:url(images/page-headers.gif) 0 -120px; }
#body-default h2 {background:url(images/page-headers.gif) 0 0; }

h2 span {display:none;}

h2 {
	display:block;
	font-size:1.8em;
	color:#fb8c00;
	width:450px;
	height:20px;
	border-bottom: 2px solid #fb8c00;
	margin-top:10px 0 6;
}
h3 {font-size:2em; padding:10px 0 5px;}
h4 {font-size:2em; padding:10px 0 5px;}
h5 {font-size:2em; padding:10px 0 5px;}
h6 {font-size:2em; padding:10px 0 5px;}

p {
	font-size:1.3em;
	line-height:20px;
	padding:6px 15px 6px 12px;
	text-align:justify;
}

a:link, a:visited {
	color:#fb8c00;
	outline: none;
	text-decoration:none;

}

a:hover {
	color:#FFF;
	text-decoration:underline;
}

/* header
----------------------------------------- */

#header {
	width:450px;
	margin-bottom:6px;
}
#collage {
	background-image:url(images/creation-collage.jpg);
	width:450px;
	height:125px;
}

#collage h1 {
	display:none;
}

#creationlogo {
	display:block;
	width:450px;
	height:42px;
	padding: 0;
}

#logo {
	padding-bottom:8px;
}

#header div.hr {
  	width:450px;
	height: 12px;
	background:url(images/header-squares.gif) no-repeat;
}
#header div.hr hr {
  display: none;
}


/* sidebar styles
----------------------------------------- */

#contact-info {
	margin:15px 0 0 25px;
}
#contact-info p {
	padding: 8px 0 4px;
}

#sidebar h3 {
	border-bottom:2px solid #FFF;
}

#photos {
	width:200px;
	height:200px;
	background:#FFF;
	padding:2px;
	margin:10px 0 10px 21px;
}


#photo-slideshow {
	display:block;
	margin-left:21px;
	border:2px solid white;
}


#references, #contact, #email, p.phone {
	display:block;
	width:200px;
	height:20px;
	padding:0;
	margin:0;
}

p.email-address {
	display:block;
	width:200px;
	height:15px;
	padding:0;
	margin:0;
	position:relative;
	top: -8px;
}

#contact:hover, #email:hover {
	background-position: 0 -20px;
}

#references span, #contact span, #email span, p.phone span, p.email-address span {
	display:none;
}

#references {background:url(images/references.png) no-repeat 0 0;}
#contact {background:url(images/contact-rollover.png) no-repeat 0 0;}
#email {background:url(images/email-rollover.png) no-repeat 0 0;}

p.phone {
	background:url(images/phone.png) no-repeat 0 0;
}
p.email-address {
	background:url(images/email-address.png) no-repeat 0 0;

}


#references-scroll {
	margin:10px 0 0 25px;
}

/* media player styles
----------------------------------------- */

#mediaplayer {
	width:200px;
	height:384px;
	margin-left:25px;
	background:url(images/iphone-200.png) no-repeat top left;
}

#media {
	position:relative;
	top:35px;
	left:12px;
}

#enlarge {
	display:block;
	height:15px;
	width:170px;
	background:url(images/enlarge-rollover.png) no-repeat top left;
	position:relative;
	top:18px;
	left:15px;
}
#enlarge:hover {
	background-position:0 -15px;
}
#enlarge span {
	display:none;
}

/* image scroller
----------------------------------------- */

/* js-disabled class - set image sizes so they all fit in the viewer */
.js-disabled img { width:135px; height:90px; display:block; float:left;}

#outerContainer { width:450px; height:90px; margin:auto; position:relative; }
#imageScroller { width:450px; height:90px; position:relative; background:#000000 url(images/imageScrollerBG.png) no-repeat; }
#viewer { width:0; height:90px; overflow: hidden; margin:auto; }
#imageScroller a:active, #imageScroller a:visited { color:#000000; }
#imageScroller a img { border:0; }

.image-scroller {
	width:440px;
	margin-bottom:10px;
	height:92px;
	border-top: 2px solid white;
	border-bottom: 2px solid white;
	padding: 2px 0 4px 7px;
	overflow:hidden;
}
.image-scroller img {
	padding:2px;
}

#ie-photos {
	width:440px;
	margin:10px 0 12px 7px;
	height:92px;
}
#ie-photos img {
	padding:2px 4px;
}
			


/* nav styles
----------------------------------------- */

#band, #disco-s, #disco-l, #dancers, #production {
	display:block;
	width:225px;
	height:80px;
}
#band:hover, #disco-s:hover, #disco-l:hover, #dancers:hover, #production:hover,#body-band #band, #body-discoservices #disco-s, #body-discolive #disco-l, #body-dancers #dancers, #body-production #production {
	background-position:0 -80px;
}
#band span, #disco-s span, #disco-l span, #dancers span, #production span {
	display:none;
}

#band {background: url(images/nav/creation-band.jpg) no-repeat 0 0;}
#disco-s {background: url(images/nav/disco-services.jpg) no-repeat 0 0;}
#disco-l {background: url(images/nav/disco-live.jpg) no-repeat 0 0;}
#dancers {background: url(images/nav/dancers.jpg) no-repeat 0 0;}
#production {background: url(images/nav/production.jpg) no-repeat 0 0;}


/* footer
----------------------------------------- */

#footer {
	width:450px;
	padding:0 250px;
}

#footer p, #private-footer p {
	padding: 8px 0 0 0;
	color:#fb8c00;
	font-size:1.2em;
	color:#999;
}
#footer p.company-reg {
	padding-top:0px;
	padding-bottom:10px;
	margin-top:0;
	line-height:10px;
	font-size:0.85em;
	color:#999;
}

ul.footer-nav {
	width:150px;
	color:#fb8c00;
	float:right;
}
ul.footer-nav li{
	padding: 20px 0;
	display:inline;
	float:right;
	font-size:1.3em;
}
ul.footer-nav a {
	padding:0 10px;
}
	

/* private page styles
----------------------------------------- */

#private-wrap {
	width:1024px;
	margin:0 auto;
}

#private-wrap #media {
	top:0;
	padding-bottom:10px;
	left:0;
}

#private-header {
	border-bottom:2px solid white;
	margin-bottom:5px;
}

#private-wrap .link {
	float:right;
	padding-top:24px;
}

#private-wrap .link a {
	color:#CCC;
}
#private-footer {
	border-top: 2px solid white;
	margin:5px 0 20px;
}

/* contact page
----------------------------------------- */

#body-contact #main p {
	padding:20px 0 0;
}

label {
	display:block;
	float:left;
	width:150px;
	text-align:right;
	margin:0;
	padding:0;
}

.txt, textarea {
	margin-left:18px;
	width:240px;
	background:#CCC;
	border:none;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius:3px;
	padding:3px;
}
p.submit {
	margin-left:170px;
}


/* misc.
----------------------------------------- */


hr, .hide {
	display: none;
}

a img {
	border: none;
}

/* self clear floats */

.group:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.group { display: inline-block; }
/* start commented backslash hack \*/
* html .group { height: 1%; }
.group { display: block; }
/* close commented backslash hack */