/*
Theme Name: Canival
Description: Carnival Site Design
Version 1.0
Author: Loren Judah / Bent Image Lab
*/

/***
	`INDEX`

		{ Containers
		{ Padding
		{ Header
		{ Triangles
		{ Banner Links
		{ Triangle Links
		{ Body
		{ Home
		{ About
		{ Movies
		{ Gallery
		{ Boards
		{ Footer
		{ Text Styles
			{  Links
			{  Headers




	`NOTES`

		{ Adding "float:" proporties will take that layer out of line with non-
		  float layers.

		{ "margin:" is spacing between layers
		{ "Padding:" is spacing from content within a layer to that layers boarder.
		  PAdding will extend a layers height and width so you must compensate padding
		  by removing equal lengths from that layers height and width.

		{ Hover image links are single images with twice the height. When a mouse passes
		  over the layer, the image shifts position vertically to reveal a different image.

		{ padding layers are used to add vertical space in between layers.

***/

/*****************************
 +Containers
******************************/
body{
	margin:0;
	padding:0;
	text-align:center;
	background: #dedede;
}
#wrap{
	margin:0 auto;
	width:800px;

}

/*****************************
 +Padding
******************************/
#pada{
	height: 10px;
	float: left;
	width: 800px;
}
#padb{
	height: 20px;
	float: left;
	width: 800px;
}
#padc{
	height: 50px;
	float: left;
	width: 800px;
}
#padd{
	height: 100px;
	float: left;
	width: 800px;
}
#pade{
	height: 200px;
	float: left;
	width: 800px;
}
#padf{
	height: 50px;
	float: left;
	width: 800px;
}
#idpad{
	height: 55px;
}
#boxpad{
	width: 70px;
	height: 127px;
	float: left;
}
/****************************
 +Header
*****************************/
#header{
	margin-top: 100px;
	width: 1000px;
	height: 330px;
	background-image: url(../global/banner.jpg);
}
#home-banner{
	width: 470px;
	height: 141px;
	background-image: url(../home/home-banner.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 40px;
}
#home-banner a{
	width: 470px;
	height: 141px;
	float: left;
}
#menu-triangle{
	width: 183px;
	height: 183px;
	background-image: url(../global/menu-t.jpg);
	float: left;
	padding-top: 50px;
	padding-left: 20px;
	margin-left: 54px;
}

/****************************
 +Triangles
*****************************/
#hushlove-t{
	width:203px;
	height: 233px;
	background-image: url(../global/hushlove-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 50px;
}
#hushlove-t a{
	width:203px;
	height: 233px;
	background-image: url(../global/hushlove-t.jpg);
	background-position: 0 0;
	float: left;
}
#hushlove-t a:hover{
	width:203px;
	height: 233px;
	background-image: url(../global/hushlove-t.jpg);
	background-position: 0 234px;
	float: left;
}
#thing-t{
	width:203px;
	height: 233px;
	background-image: url(../global/thing-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 50px;
}
#thing-t a{
	width:203px;
	height: 233px;
	background-image: url(../global/thing-t.jpg);
	background-position: 0 0;
	float: left;
}
#thing-t a:hover{
	width:203px;
	height: 233px;
	background-image: url(../global/thing-t.jpg);
	background-position: 0 234px;
	float: left;
}
#footprint-t{
	width:203px;
	height: 233px;
	background-image: url(../global/footprint-t.jpg);
	background-position: 0 0;
	float: left;
}
#footprint-t a{
	width:203px;
	height: 233px;
	background-image: url(../global/footprint-t.jpg);
	background-position: 0 0;
	float: left;
}
#footprint-t a:hover{
	width:203px;
	height: 233px;
	background-image: url(../global/footprint-t.jpg);
	background-position: 0 234px;
	float: left;
}
#updown-t{
	width:203px;
	height: 233px;
	background-image: url(../global/up&down-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 50px;
}
#updown-t a{
	width:203px;
	height: 233px;
	background-image: url(../global/up&down-t.jpg);
	background-position: 0 0;
	float: left;
}
#updown-t a:hover{
	width:203px;
	height: 233px;
	background-image: url(../global/up&down-t.jpg);
	background-position: 0 234px;
	float: left;
}
#updown2-t{
	width:203px;
	height: 233px;
	background-image: url(../global/up&down2-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 50px;
}
#updown2-t a{
	width:203px;
	height: 233px;
	background-image: url(../global/up&down2-t.jpg);
	background-position: 0 0;
	float: left;
}
#updown2-t a:hover{
	width:203px;
	height: 233px;
	background-image: url(../global/up&down2-t.jpg);
	background-position: 0 234px;
	float: left;
}
#gulp-t{
	width:203px;
	height: 233px;
	background-image: url(../global/gulp-t.jpg);
	background-position: 0 0px;
	float: left;
}
#gulp-t a{
	width:203px;
	height: 233px;
	background-image: url(../global/gulp-t.jpg);
	background-position: 0 0px;
	float: left;
}
#gulp-t a:hover{
	width:203px;
	height: 233px;
	background-image: url(../global/gulp-t.jpg);
	background-position: 0 234px;
	float: left;
}
#blank-t{
	width:203px;
	height: 233px;
	background-image: url(../global/blank-t.jpg);
	background-position: 0 0;
	float: left;
}
/***************************
 +Triangle Links
****************************/
#movies-link{
	width:180px;
	height: 30px;
	background-image: url(../global/movies-link-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#movies-link a{
	width:180px;
	height: 30px;
	background-image: url(../global/movies-link-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#movies-link a:hover{
	width:180px;
	height: 30px;
	background-image: url(../global/movies-link-t.jpg);
	background-position: 0 30px;
	background-repeat: repeat-y;
	float: left;
}
#images-link{
	width:180px;
	height: 33px;
	background-image: url(../global/images-link-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#images-link a{
	width:180px;
	height: 33px;
	background-image: url(../global/images-link-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#images-link a:hover{
	width:180px;
	height: 33px;
	background-image: url(../global/images-link-t.jpg);
	background-position: 0 34px;
	background-repeat: repeat-y;
	float: left;
}
#info-link{
	width:180px;
	height: 30px;
	background-image: url(../global/infonews-link-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#info-link a{
	width:180px;
	height: 30px;
	background-image: url(../global/infonews-link-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#info-link a:hover{
	width:180px;
	height: 30px;
	background-image: url(../global/infonews-link-t.jpg);
	background-position: 0 30px;
	background-repeat: repeat-y;
	float: left;
}
#links-link{
	width:180px;
	height: 30px;
	background-image: url(../global/links-link-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#links-link a{
	width:180px;
	height: 30px;
	background-image: url(../global/links-link-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#links-link a:hover{
	width:180px;
	height: 30px;
	background-image: url(../global/links-link-t.jpg);
	background-position: 0 30px;
	background-repeat: repeat-y;
	float: left;
}

/***************************
 +Body
****************************/
#content{
	width: 800px;
	margin: 0 auto;
}
#menu{
	width: 114px;
	float: left;
}
#subcontent{
	width: 620px;
	float: right;
	margin: 0 auto;
}
/***************************
 +Home
****************************/

/***************************
 +Info News
****************************/
#news {
	width: 382px;
	height: 509px;
	background-image: url(../infonews/news.jpg);
	float: left;
}
#info {
	width: 382px;
	height: 509px;
	background-image: url(../infonews/info.jpg);
	float: left;
	background-repeat: no-repeat;
}
#newslist {
	width: 250px;
	height: 350px;
	font-family: Tahoma;
	font-size: .8em;
	color: #222222;
	margin-left: 70px;
	margin-top: 100px;
	overflow:auto;
	padding: 10px;
}
#infotext {
	width: 280px;
	height: 450px;
	font-family: Tahoma;
	font-size: .8em;
	color: #222222;
	margin-left: 70px;
	margin-top: 100px;
}
#infotext p {
	line-height: 100%;
	color: #FFFFFF;
}
#newslist p {
	line-height: 100%;
	color: #FFFFFF;
	text-align: left;
}
/***************************
 +Movies
****************************/


#movielink{
	width: 150px;
	text-align: left;
}
#movieplayer{
	width: 533px;
	height: 313px;
	margin-bottom: 40px;
	background: #188198;
	padding: 5px;
}
#imageswrap{
	width: 533px;
	height: 127px;
	margin-left: 5px;
}
#hushloveid{
	width: 114px;
	height: 130px;
	background-image: url(../movies/hushlove-id.jpg);
	margin-bottom: 13px;
}
#thethingid{
	width: 114px;
	height: 130px;
	background-image: url(../movies/thething-id.jpg);
	margin-bottom: 13px;
}
#footprintid{
	width: 114px;
	height: 130px;
	background-image: url(../movies/footprint-id.jpg);
	margin-bottom: 13px;
}
#upanddownid{
	width: 114px;
	height: 130px;
	background-image: url(../movies/upanddown-id.jpg);
	margin-bottom: 13px;
}
#upanddown2id{
	width: 114px;
	height: 130px;
	background-image: url(../movies/upanddown2-id.jpg);
	margin-bottom: 13px;
}
#gulpid{
	width: 114px;
	height: 130px;
	background-image: url(../movies/gulp-id.jpg);
	margin-bottom: 13px;
}
#moviedownloadb{
	width:114px;
	height: 126px;
	background-image: url(../movies/download-t.jpg);
	background-position: 0 0;
	float: left;
	margin-bottom: 90px;
}
#moviedownloadb a{
	width:114px;
	height: 126px;
	background-image: url(../movies/download-t.jpg);
	background-position: 0 0;
	float: left;
}
#moviedownloadb a:hover{
	width:114px;
	height: 126px;
	background-image: url(../movies/download-t.jpg);
	background-position: 0 126px;
	float: left;
}
#movieimages{
	width: 114px;
	height: 126px;
	background-image: url(../movies/movie-images.jpg);
	float: left;
}

#imageboxes{
	width: 127px;
	height: 127px;
	background-image: url(../movies/image-boxes.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	cursor: pointer;
}
#imageboxes-end{
	width: 127px;
	height: 127px;
	background-image: url(../movies/image-boxes.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	cursor: pointer;
}
.hoverbox{
	position: relative;
	top: 0px;
	text-align: center;
	width: 127px;
	height: 67px;
	padding-top: 30px; 



}
.hoverbox p{
	text-align: center;
	margin: 4px;
	background: #555555;
	opacity: .5;
	filter: alpha(opacity=50);

}
.hoverbox a{
	color:#FFFFFF;
}
.hoverbox a:hover{
	color:#ffc47c;
}

/***************************
 +Gallery
****************************/
#box1 {
	width: 127px;
	height: 127px;
	background-image: url(../gallery/hushlove-01-01.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-right: 65px;
	margin-bottom: 65px;
	cursor: pointer;
	z-index: 1;
}
#box2 {
	width: 127px;
	height: 127px;
	background-image: url(../gallery/hushlove-01-02.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-right: 65px;
	margin-bottom: 65px;
	cursor: pointer;
}
#box3 {
	width: 127px;
	height: 127px;
	background-image: url(../gallery/hushlove-01-03.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-bottom: 65px;
	cursor: pointer;
}
#box4 {
	width: 127px;
	height: 127px;
	background-image: url(../gallery/thething-02-01.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-right: 65px;
	margin-bottom: 65px;
	cursor: pointer;
	z-index: 1 ;
}
#box5 {
	width: 127px;
	height: 127px;
	background-image: url(../gallery/thething-02-02.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-right: 65px;
	margin-bottom: 65px;
	cursor: pointer;
}
#box6 {
	width: 127px;
	height: 127px;
	background-image: url(../gallery/thething-02-03.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-bottom: 65px;
	cursor: pointer;
}
#box7 {
	width: 127px;
	height: 127px;
	background-image: url(../gallery/footprint-03-01.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-right: 65px;
	margin-bottom: 65px;
	cursor: pointer;
}
#box8 {
	width: 127px;
	height: 127px;
	background-image: url(../gallery/footprint-03-02.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-right: 65px;
	margin-bottom: 65px;
	cursor: pointer;
}
#box9 {
	width: 127px;
	height: 127px;
	background-image: url(../gallery/footprint-03-03.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-bottom: 65px;
	cursor: pointer;
}
#box10 {
	width: 127px;
	height: 127px;
	background-image: url(../movies/image-boxes.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-right: 65px;
	margin-bottom: 65px;
	cursor: pointer;
	z-index: 1;
}
#box11 {
	width: 127px;
	height: 127px;
	background-image: url(../movies/image-boxes.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-right: 65px;
	margin-bottom: 65px;
	cursor: pointer;
}
#box12 {
	width: 127px;
	height: 127px;
	background-image: url(../movies/image-boxes.jpg);
	background-repeat: no-repeat;
	float: left;
	margin-top: 5px;
	margin-bottom: 65px;
	cursor: pointer;
}
#hushlove-image{
	width: 183px;
	height: 83px;
	background-image: url(../gallery/hushlove-image.jpg);
	float: left;
	margin-right: 50px;
	padding-top: 150px;
	padding-left: 20px;
}
#large{
	width:92px;
	height: 8px;
	background-image: url(../gallery/1280x1024-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
	margin-bottom: 5px;
}
#large a{
	width:92px;
	height: 8px;
	background-image: url(../gallery/1280x1024-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#large a:hover{
	width:92px;
	height: 8px;
	background-image: url(../gallery/1280x1024-t.jpg);
	background-position: 0 8px;
	background-repeat: repeat-y;
	float: left;
}
#medium{
	width:92px;
	height: 8px;
	background-image: url(../gallery/1024x768-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
	margin-bottom: 5px;
}
#medium a{
	width:92px;
	height: 8px;
	background-image: url(../gallery/1024x768-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#medium a:hover{
	width:92px;
	height: 8px;
	background-image: url(../gallery/1024x768-t.jpg);
	background-position: 0 8px;
	background-repeat: repeat-y;
	float: left;
}
#small{
	width:92px;
	height: 8px;
	background-image: url(../gallery/800x600-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
	margin-bottom: 5px;
}
#small a{
	width:92px;
	height: 8px;
	background-image: url(../gallery/800x600-t.jpg);
	background-position: 0 0;
	background-repeat: repeat-y;
	float: left;
}
#small a:hover{
	width:92px;
	height: 8px;
	background-image: url(../gallery/800x600-t.jpg);
	background-position: 0 8px;
	background-repeat: repeat-y;
	float: left;
}
/***************************
 +Boards
****************************/

/***************************
 +Footer
****************************/
#footer{
	width: 800px;
	height: 30px;
	background-image: url(../global/bent-logo.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	margin:0 auto;
	float: left;

}

/****************************
 +Links
*****************************/
#l-players{
	width: 160px;
	height: 184px;
	background-image: url(../links/players.jpg);
	margin-top: 10px;
}
#l-creators{
	width: 160px;
	height: 184px;
	background-image: url(../links/creators.jpg);
	margin-top: 15px;
}
#l-others{
	width: 160px;
	height: 184px;
	background-image: url(../links/others.jpg);
	margin-top: 20px;
}
#link-blank{
	width:175px;
	height: 200px;
	background-image: url(../links/link-blank.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 20px;
}
#bent-t{
	width:175px;
	height: 200px;
	background-image: url(../links/bent-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 20px;
}
#bent-t a{
	width:175px;
	height: 200px;
	background-image: url(../links/bent-t.jpg);
	background-position: 0 0;
	float: left;
}
#bent-t a:hover{
	width:175px;
	height: 200px;
	background-image: url(../links/bent-t.jpg);
	background-position: 0 202px;
	float: left;
}
#youtube-t{
	width:175px;
	height: 200px;
	background-image: url(../links/youtube-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 20px;
}
#youtube-t a{
	width:175px;
	height: 200px;
	background-image: url(../links/youtube-t.jpg);
	background-position: 0 0;
	float: left;
}
#youtube-t a:hover{
	width:175px;
	height: 200px;
	background-image: url(../links/youtube-t.jpg);
	background-position: 0 202px;
	float: left;
}
#myspace-t{
	width:175px;
	height: 200px;
	background-image: url(../links/myspace-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 20px;
}
#myspace-t a{
	width:175px;
	height: 200px;
	background-image: url(../links/myspace-t.jpg);
	background-position: 0 0;
	float: left;
}
#myspace-t a:hover{
	width:175px;
	height: 200px;
	background-image: url(../links/myspace-t.jpg);
	background-position: 0 202px;
	float: left;
}
#qbodp-t{
	width:175px;
	height: 200px;
	background-image: url(../links/qbodp-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 20px;
}
#qbodp-t a{
	width:175px;
	height: 200px;
	background-image: url(../links/qbodp-t.jpg);
	background-position: 0 0;
	float: left;
}
#qbodp-t a:hover{
	width:175px;
	height: 200px;
	background-image: url(../links/qbodp-t.jpg);
	background-position: 0 202px;
	float: left;
}
#sotis-t{
	width:175px;
	height: 200px;
	background-image: url(../links/sotis-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 20px;
}
#sotis-t a{
	width:175px;
	height: 200px;
	background-image: url(../links/sotis-t.jpg);
	background-position: 0 0;
	float: left;
}
#sotis-t a:hover{
	width:175px;
	height: 200px;
	background-image: url(../links/sotis-t.jpg);
	background-position: 0 202px;
	float: left;
}
#dailymotion-t{
	width:175px;
	height: 200px;
	background-image: url(../links/dailymotion-t.jpg);
	background-position: 0 0;
	float: left;
	margin-right: 20px;
}
#dailymotion-t a{
	width:175px;
	height: 200px;
	background-image: url(../links/dailymotion-t.jpg);
	background-position: 0 0;
	float: left;
}
#dailymotion-t a:hover{
	width:175px;
	height: 200px;
	background-image: url(../links/dailymotion-t.jpg);
	background-position: 0 202px;
	float: left;
}
#xplsv-t{
	width:175px;
	height: 200px;
	background-image: url(../links/xplsv-t.jpg);
	background-position: 0 0;
	background-repeat: no-repeat;
	float: left;
	margin-right: 20px;
}
#xplsv-t a{
	width:175px;
	height: 200px;
	background-image: url(../links/xplsv-t.jpg);
	background-position: 0 0;
	background-repeat: no-repeat;
	float: left;
}
#xplsv-t a:hover{
	width:175px;
	height: 200px;
	background-image: url(../links/xplsv-t.jpg);
	background-position: 0 202px;
	background-repeat: no-repeat;
	float: left;
}

a{
	text-decoration:none;
	border:0px;
	color: #ffc47c;
}
a:hover{
	color:#FFFFFF;
}
	



/*************************
 +Headers
*************************/
h1{
	font-family: Tahoma;
	font-size:	.8em;
	text-transform: uppercase;
	color: #ffc47c;
	letter-spacing: 2px;
	word-spacing: 2px;
	font-weight: bold;
	}
h2{
	font-family: "Century Gothic", Tahoma, Arial;
	font-size:	11px;
	color: #FFFFFF;
	letter-spacing: 1px;
	word-spacing: 2px;
	font-style: normal;
	text-align: left;
	}
h3{
	font-family: "Century Gothic", Tahoma, Arial;
	font-size:	12px;
	text-transform: uppercase;
	color: #ffc47c;
	letter-spacing: 1px;
	word-spacing: 2px;
	font-style: normal;
	line-height: 100%;
	text-align: left;
	text-indent: 3ex;
	}

p{
	font-family: "Century Gothic", Tahoma, Arial;
	font-size: 1em;
	color:#888888;
	word-spacing: 0px;
	letter-spacing: 0pt;
        line-height: 13px;
	line-height: 1em;
	text-align: justify;
}
p.news{
        font-family: "Century Gothic", Arial, Tahoma;
	margin: 0;
	padding: 0;
        word-spacing: 0px;
        letter-spacing: 0px;
	text-align: left;
	font-size: .8em;
	font-weight: lighter;
	line-height: 1.2em;
}
p.h3{
	font-family: "Century Gothic", Tahoma, Arial;
	font-size:	18px;
	text-transform: uppercase;
	color: #FFFFFF;
	letter-spacing: 1px;
	word-spacing: 2px;
	font-style: normal;
	font-weight: normal;
	margin:0;
	padding:0;
	text-align: left;
}