/* CSS created by oddthomas */
/* copyright mediakamp.com */

body { background: #fff url(../images/bg.jpg) repeat; width: 1050px; height: 750px; font-family:Arial, Helvetica, sans-serif; }
a {  color: #B18A00; text-decoration:none; }
a:hover { color: #B18A00; text-decoration: underline; }
h1, h2 { font-weight: normal; font-size:15px; }
h3 { font-size:17px; color:#b09107; margin-bottom:0px; }
p { font-size:11px; color:#999; text-align:left; }
ul { list-style-position: inside; }
/* wrapper for the whole page */
#pagewrapper { background:url(../images/bg.jpg) repeat; width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; }
/* main navigation */
#navigation { background:transparent; position:static; top:0px; left:0px; padding-left:50px; width: 917px; height:80px; }
#navigation ul { list-style:none; width: 440px; }
#navigation li { color:#d3a809; list-style: none; height: 25px; float: left; display: block; }
#navigation li:before {
}
#navigation li.last { color:#d3a809; list-style: none; height: 25px; float: left; display: block; }
#navigation a { color:#fff; font-size: 14px; font-weight: bold; text-transform: uppercase; text-align: center; text-decoration: none; height: 23px; display: block; float: left; line-height: 33px; margin-right:10px; padding-bottom:3px; }
#navigation a:hover { margin-right:10px; color:#fff; border-bottom:9px solid #fff; }
/* MAIN   NAVIGATION */

/* wrapper for scrolling divs */ 
#scrollwrapper { background:url(../images/bg.jpg) repeat; overflow: hidden; height: 100%; width: 100%; position: relative; z-index: 1; margin-bottom:100px; }
#scrollinnerwrapper { width: 100%; height: 100%; position: relative; z-index: 1 }
/* CLASS TO ADD if div scrollable */
.scrolling-content {
	width: 0px;
	height: 0px;
	position: absolute;
	left: 3644px;
	top: -1220px;
}
/* MAIN DIV's */
/* DIV TOP LEFT */
#newswrapper { left: 0px; top: 0px; width: 1050px; height: 750px; background:url(../images/mediakamp_news.jpg) no-repeat top center; }
#news { width: 1050px; height: 750px; }
.bloglink1 { position:absolute; top:56px; left:859px; width:93px; height:98px; }
.newsfeedholder { position:absolute; top:205px; left:45px; width:370px; height:180px; }
.news_hr { position:absolute; top:435px; left:72px; height:2px; width:831px; background-color:#B18A00; float: left; margin-left:10px; margin-right:20px; }
.feedburnerFeedBlock { width:370px; font-family:Arial, Helvetica, sans-serif; color:#666; font-size:11px; text-align:justify; }
.feedburnerFeedBlock li { list-style:none; padding-right:15px; margin-bottom:10px; }
.feedburnerFeedBlock div { padding-top:4px; }
.headline { font-family:Arial, Helvetica, sans-serif; font-size:15px; color:#999; margin-bottom:5px; font-style: italic; }
.headline a { color:#af8b07; text-decoration:none; }
.headline a:hover { color: #666; text-decoration:none; }
#creditfooter { display: none; }
.showreel { position:absolute; top:250px; left:495px; width:508px; height:193px; border:1px solid #999; }
.portpreview { position:absolute; top:390px; left:83px; width:873px; height:277px; }
.portpreview_header { font-size: 26px; width:900px; height:30px; color: #8FB0C3; text-transform: uppercase; }
.portpreview_title { color: #666; margin-top:10px; width:900px; float:left; text-transform: uppercase; }
.portpreview_box { float:left; margin-right:5px; margin-top:10px; width:205px; height:175px; color: #96B7C9; }
.postpreview_box_image { width:200px; height:120px; background-color:#999; margin-bottom:5px; float:left; }
.postpreview_box_discription {
	float:right;
	color: #91AEBE;
	font-size: 12px;
	margin-right:5px;
}
.postpreview_box_title { float:left; color: #B28D0F; width:120px; 	font-size: 12px;
 }
/* DIV TOP RIGHT */
#aboutwrapper { background:url(../images/mediakamp_about.jpg) no-repeat top center; left: 1840px; top: 0px; width: 1050px; height: 750px;  /* change to right */ }
#about { width: 1050px; height: 750px; }
.about_text { position:absolute; width:747px; height:35px; top:76px; left:213px; color:#B18A00; font-size:10px; text-transform:uppercase; text-align: justify; line-height:10px; }
.about_content { position:absolute; top:126px; left:71px; width:920px; height: 560px; }
.about_col { width:210px; height:500px; float:left; padding-left:15px; }
.about_col_hr { height:200px; width:1px; background-color:#B18A00; float: left; }
.about_pic { background:#999; width:200px; height:250px; margin-bottom:10px; float:left; }
.about_name { font-size:16px; width:200px; text-transform:uppercase; color:#8FB0C3; margin-bottom:0px; float:left; font-style: italic; font-weight: bold; }
.about_role { font-size:8pt; width:200px; color:#B18A00; margin-bottom:5px; float: left; }
.about_discription {
	font-size:11px;
	width:200px;
	color:#999;
	margin-bottom:5px;
	float: left;
	text-align:justify;
	height: 100px;
}
.about_hr { width:185px; height:1px; background-color:#B18A00; margin:5px; text-align:center; float:left; }
.about_other_header { font-size:8pt; width:200px; color:#B18A00; margin-bottom:2px; float: left; text-transform: uppercase; font-style: italic; font-weight: bold; }
.about_other_discription { font-size:12px; width:200px; color:#999; margin-bottom:5px; float: left; }
/* DIV MIDDLE LEFT */
#ideaswrapper { background:url(../images/mediakamp_ideas.jpg) no-repeat top center; left: 0px; top: 1325px; width: 1050px; height: 600px; }
#ideas { width: 1050px; height: 600px; }
.ideas_content { position:absolute; top:124px; left:84px; width:925px; height:688px; }
.ideas_col { float:left; width:270px; height:500px; margin-right:10px; }
.ideas_img {
	float:left;
	width:270px;
	margin-bottom:10px;
	height: 322px;
}
.ideas_description {
	font-size:11px;
	float:left;
	width:270px;
	margin-bottom:10px;
	padding-left:5px;
	padding-right:5px;
	text-align:justify;
	color:#666;
	height: 83px;
}
.ideas_title { zoom: 1; font-size:20px; padding-left:5px; text-align:center; color:#B18A00; }
.ideas_col_hr {
	height:450px;
	width:1px;
	background-color:#B18A00;
	float: left;
	margin-left:10px;
	margin-right:10px;
}
/* DIV MIDDLE RIGHT */
#portfoliowrapper { background:url(../images/mediakamp_port.jpg) no-repeat top center; left: 1850px; top: 0px; width: 1092px; height: 806px; /* change to right */ }
#portfolio { width: 1092px; height: 600px; }
.showcase_holder { position:absolute; top:115px; left:106px; }
.portfolio_image { float:left; margin:5px; }
.port_hr { width:205px; height:1px; background-color:#8eaec0; margin-top:20px; text-align:center; float:left; }
r { float:left; font-size:11px; color:#999; text-align:left; width:400px; padding-top:5px; padding-bottom:15px; }
/* DIV BOTTOM LEFT */ 
#clientswrapper { background:url(../images/mediakamp_clients.jpg) no-repeat top center; left: 0px; top: 2550px; width: 1050px; height: 980px; }
#clients { width: 1050px; height: 980px; }
.client_content { position:absolute; top:125px; left:88px; width:848px; height:551px; margin-left: 0px; }
.client_col { float:left; width:150px; height:500px; margin-right:10px; }
.client_header { float:left; width:150px; font-size:18px; margin-bottom:3px; font-weight:bold; text-transform:uppercase; text-align:left; color:#B18A00; }
.client_spacer { float: left; width: 150px; height: 27px; }
.client_artist { float:left; width:150px; font-size:9pt; padding-bottom:0px; text-align:left; color:#91AEBE; text-transform:uppercase; font-style:italic; font-weight:bold; }
.client_job { float:left; width:150px; font-size:7pt; padding-bottom:0px; text-align:left; color:#B18A00; }
.client_indst { float:left; width:150px; font-size:7pt; padding-bottom:0px; margin-bottom:2px; text-align:left; color:#B18A00; }
.client_col_hr { height:450px; width:1px; background-color:#B18A00; float: left; margin-left:10px; margin-right:10px; }
/* DIV BOTTOM RIGHT */
#contactwrapper { background: url(../images/mediakamp_contact.jpg) no-repeat top center; left: 1850px; top: 2550px; width: 1050px; height: 980px; }
#contact { width: 1850px; height: 980px; }
.contact_box { position:absolute; top:233px; left:86px; width:300px; height:381px; }
.contact_box2 { position:absolute; top:231px; left:533px; width:300px; height:227px; }
.phone {
	position:absolute;
	top:79px;
	left:207px;
	width:755px;
	height:34px;
	font-size:22px;
	letter-spacing:1px;
	color:#8FB0C3;
	text-transform:uppercase;
	font-weight:bold;
	text-align: justify;
}
.emaillink1 { position:absolute; top:7px; left:207px; width:755px; height:54px; }
.emaillink2 { position:absolute; top:304px; left:263px; width:237px; height:26px; }
.bloglink2 { position:absolute; top:462px; left:859px; width:110px; height:108px; }
.myspace { position:absolute; top:526px; left:716px; width:136px; height:49px; }
.twitter { position:absolute; top:522px; left:471px; width:75px; height:66px; }
.flickr { position:absolute; top:529px; left:558px; width:131px; height:44px; }
#secretwrapper { left: 1850px; top: 4550px; width: 1050px; height: 980px; }
#secret { width: 1850px; height: 980px; }
#secretonewrapper { left: 1850px; top: 2550px; width:1050px; height: 980px; }
#secretone { width: 1850px; height: 980px; }
.stumble { position:absolute; top:116px; left:790px; width:69px; height:38px; }
/* INSIDE ELEMENTS BOTTOM LEFT */
/* slideoutbox */
#slideoutbox { width: 250px; position: absolute; margin-top: 252px; margin-left: 0; }
#siteWrap { background:url(../images/nav/mediakamp-navagation_08.jpg) repeat-x bottom; margin: 10px 0 2px 2px; padding-left:50px; width: 100%; height: 65px; position: relative; }
#pageWrap { position: absolute; z-index: 5; top: 1px; left: 107px; }
#psdPage { float: left; cursor: pointer; }
#netPage { float: left; cursor: pointer; }
#audioPage { float: left; cursor: pointer; }
#bubbleWrap { margin-top:10px; margin-left:10px; height:5px; zoom: 1; }
.bubble {
	position: absolute;
	left: 536px;
	top: 8px;
	height: 87px;
}
.clear { clear: both; }
/* Portfolio*/
#box8 { position:absolute; width:880px; left: 1px; top: 1px; }
#box8 div { width:880px; float:left; }
#box8 .buttons { text-align:left; padding-bottom:5px; }
#box8 .next {
 width:50px; height:302px; padding-left:10px; }
#box8 .prev { float:left; width:50px; height:302px; padding-right:10px; }
.sample8 .buttons { color:#8eaec0; cursor:pointer; text-align:left; clear:both; }
.sample8 .mask1 { border-top:1px solid #ccc; border-bottom:1px solid #ccc; }
.thumbs { width:54px; }
.thumbs div { display:block; width:54px; height:41px; margin:3px 0; cursor:pointer; }
.thumbs div img { display:block; width:100%; height:100%; border:none }
.info { width:240px; height:50px; background:#000; position:absolute; }
.info p, .info h4 { color:#fff; padding:3px 8px; font-family:Arial; }
.info h4 { font-size:14px; }
.info h4 a { float:right; background:#fff; color:#000; font-size:10px; padding:0 3px; text-decoration:none }
.mask1 { position:relative; width:880px; height:382px; overflow:hidden; }
.mask2 { position:relative; width:880px; height:382px; overflow:hidden; }
.mask3 { position:relative; width:880px; height:382px; overflow:hidden; }
.mask4 { position:relative; width:880px; height:382px; overflow:hidden; }
span img { display:block; border:none; }
#nav { margin:1em; list-style:none; }
#nav a { font-size:24px; font-weight:bold; color:#f60; text-decoration:none; }
#nav a span.hover { color:#06f; position:absolute; cursor:pointer; }
#navigator { padding-left:20px; background:url(../images/nav/mediakamp-navagation_08.jpg) repeat-x; }
#navigator ul { list-style:none; }
#navigator li { display:inline; }
#navigator a { font-size:24px; font-weight:bold; color:#f60; text-decoration:none; }
#navigator a span.hover { color:#06f; position:absolute; cursor:pointer; }
.blue {
	color: #8AABBE;
}
.blueport { color: #8AABBE; padding-top:5px; padding-right:5px; font-size:12px; }
.yellowport { color:#b09107; padding-top:5px; font-size:12px; }
label { float:left; font-family:Arial, Helvetica, sans-serif; float: left; width: 60px; font-weight: bold; color:#B18A00; text-transform:uppercase; font-size:12px; }
input, textarea { float:left; font-size:12px; font-family:Arial, Helvetica, sans-serif; width: 410px; margin-bottom: 5px; padding:5px; background-color:#8FB0C3; color:#fff; border:none; }
textarea { font-family:Arial, Helvetica, sans-serif; font-size:12px; width: 410px; height: 80px; background-color:#8FB0C3; color:#fff; }
.boxes { width: 1.5em; }
#submitbutton { float:left; font-family:Arial, Helvetica, sans-serif; margin-top: 2px; width: 420px; height:25px; background-color:#B18A00; cursor:pointer; color:#fff; text-transform:uppercase; font-weight:bold }
#submitbutton:hover { float:left; font-family:Arial, Helvetica, sans-serif; margin-top: 2px; width: 420px; height:25px; background-color:#8FB0C3; cursor:pointer; color:#fff; text-transform:uppercase; font-weight:bold }
form { width:310px; }
br { clear: left; }
#qTip { position: absolute; font-family: Helvetica, Arial; display: none; padding: 65px 1px 15px 1px; width: 200px; height:150px; text-align: center; vertical-align: middle; font-size: 12px; line-height: 17px; color: #fff; z-index: 1000; background: url(../images/tooltip.png) no-repeat; }
.mooSlide { background-color: #000000; padding: 10px; font-family: Arial, Helvetica, sans-serif; line-height: 16px; color: #FFFFFF; font-size: 11px; }
.portthumb { float:left; margin-right:5px; margin-top:10px; width:200px; height:120px; display:inline; }
.bloglink2 { background:url(../images/contactblogicon.jpg); position:absolute; top:462px; left:859px; width:110px; height:108px; }
.bloglink2:hover { background:url(../images/contactblogiconrollover.jpg); position:absolute; top:462px; left:859px; width:110px; height:108px; }
.bloglink1 { background:url(../images/blogicon_on.jpg); position:absolute; top:60px; left:865px; width:93px; height:97px; }
.bloglink1:hover { background:url(../images/blogicon_off.jpg); position:absolute; top:60px; left:865px; width:93px; height:91px; }
p1 { color: #b09107; }

#thomaswrapper { left: 5056px; top: -556px; width: 1050px; height: 980px; }
#thomas { width: 1050px; height: 680px; }

#joshwrapper { left: 5058px; top: 698px; width: 1050px; height: 980px; }
#josh { width: 1050px; height: 680px; }

#stephenwrapper { left: 4934px; top: 3554px; width: 1050px; height: 980px; }
#stephen { width: 1050px; height: 680px; }

#ethanwrapper {
	left: 5046px;
	top: 1914px;
	width: 1050px;
	height: 980px;
}
#ethan { width: 1050px; height: 680px; }