/* 

	www.tumbletube.com CSS

	Author: Jess Eddy

	CSS: 	All

	Last Modified: 02/2008

 


*/




/* ------------------------------------------------------------

	COMMON
	
------------------------------------------------------------ */


	/*html, body{
 		margin:0; 
 		padding: 0;
 		text-align: left;
	 	font: 12px/18px Arial, Geneva, Verdana, "Lucida Grande",  sans-serif; color:#333;
		height: 100%;
		background: #fff;
		line-height: 20px;

	}*/
/*

	#ColorStrip{
		width: 100%;
		height: 10px;
		background: #3399fe;
		border-bottom: 1px solid #fff;

	}

	#HeaderBackground{
		background: #fff url("/images/template1.03/Header_Background.jpg") repeat-x;
		width: 100%;
		height: 60px;
		border-bottom: 3px solid #bbbdbf;

	}

	#HeaderWrapper{
		width: 980px;
		height: 55px;
		margin: 0 auto 0 auto;
		float: none;

	}

	#Logo{
		width: 216px;
		height: 32px;
		float: left;
		margin: 20px 0 0 0;

	}

	#HeaderRightDiv{
		float: right;
		margin: 10px 0 0 0;	
		width: 400px;
		font-size: 11px;
		
	}

	.TopNav{
		width: 225px;
		float: left;
		color: #666;
		text-align: right;

	}


	.TopNav a:link, .TopNav a:active, .TopNav a:visited {
		color: #666;
		text-decoration: none;

	}

	.TopNav a:hover {
		text-decoration: none;
		color: #333;
			
	}


	.Search{
		width: auto;
		float: right;

	}


	#Container{
		width: 980px;
		min-height: 500px;
		margin: 0 auto 0 auto;
		float: none;

	}

	#Navigation{
		float: right;
		width: 300px;
		color: #fff;

	}
*/

	
	a:link, a:active, a:visited {
		color:#1177db; /* #3399fe;*/
		text-decoration: none;

	}

	a:hover {
		text-decoration: none;
		color: #999;
			
	}
/*
	h1{
		font-size: 18px;
		color: #ff9933;
		font-weight: bold;

	}

	h2{
		font-size: 12px;
		color: #3399ff;
		font-weight: bold;
		margin: 0;
	}

	h3{
		font-size: 11px;
		font-weight: bold;
		color: #3f9ffe;
		margin: 0;

	}
	
	
	h4{
		font-size: 11px;
		font-weight: bold;
		color: #999;
		margin: 0;

	}
		
	#Search_Form {
    position: absolute;
    right: 10px;
    top: 10px;
    
  }
            
	#Search_Form{
    border: 0px solid #fff;
    background-image: url("/images/template1.03/Search_Box.gif");
    width: 156px;
    height: 18px;
    color: #ccc;
    
  }*/

        
/* ------------------------------------------------------------

	GLOBAL CONTAINERS AND CORNERS
	
------------------------------------------------------------ */
/*
	.OuterContainer{
		background: #ebf2f2;
		width:978px;
		height: auto;
		border-left: 1px solid #dedede;
		border-right: 1px solid #dedede;
		min-height: 500px;		

	}

	.TopCornersOuter {
		width:980px; 
		height:15px; 
		background: url("/images/template1.03/Top_Cap_Outer.gif") no-repeat;
		margin: 0 0 0 0;
		padding: 0;

	}
	
	.BottomCornersOuter {
		width:980px; 
		height:15px; 
		background:url("/images/template1.03/Bottom_Cap_Outer.gif") no-repeat;
		margin: 0;
		padding: 0 0 25px 0;

	}
	

	.InnerContainer{
		background:url("/images/template1.03/Inner_Background.gif");
		background-repeat: repeat-y;
		width:940px;
		margin: 0 auto 0 auto;	
		padding: 0px;		
		float: none;
		overflow: auto;

	}


	.TopCornersInner {
		width:940px; 
		height:15px; 
		background:transparent url("/images/template1.03/Top_Cap_Inner.gif") no-repeat bottom left;
		margin: 0 auto 0 auto;
		padding: 0;

	}
	
	.BottomCornersInner {
		width:940px; 
		height:15px; 
		background:transparent url("/images/template1.03/Bottom_Cap_Inner.gif") no-repeat bottom left;
		margin: 0 auto 0 auto;

	}
*/


/* ------------------------------------------------------------

	DASHBOARD
	
------------------------------------------------------------ */
/*
#DashboardLinks{width:385px;margin: 80px auto 0 auto;}
.DashboardLink{margin:0 16px 0 0;width:80px;float:left;display:inline;text-align:center;}
.DashboardLinkLast{margin:0 0 0 0;width:80px;float:left;display:inline;text-align:center;}

*/

/* ------------------------------------------------------------

	ICON TIME LINE
	
------------------------------------------------------------ */

	#IconContainer{
		width: 100%;
		float: none;
		height: 26px


	}

	.Time{
		width: auto;
		float: right;
		font-size: 16px;
		color: #3399ff;
		margin: 0 15px 0 0;

	}

	.Icons{
		float: right;
		width: auto;
		margin: 0 15px 0 0;
	}

	.Controls{
		width: auto;
		float: right;
		margin: 2px 0 0 0;

	}

	.Icon{
		float: right;
		width: 18px;
		height: 18px;
		margin: 0 0 0 10px;

	}

	.WidgetOn{
		border: 1px solid #3399ff;
		display: inline;

	}




/* ------------------------------------------------------------

	FOOTER
	
------------------------------------------------------------ */

	.FooterTopCornersOuter {
		width:980px; 
		height:15px; 
		background:url("/images/template1.03/Footer_Top_Corners.gif") no-repeat bottom left;
		margin: 0 auto 0 auto;

	}
	
	.FooterBottomCornersOuter {
		width:980px; 
		height:15px; 
		background:url("/images/template1.03/Footer_Bottom_Corners.gif") no-repeat bottom left;
		margin: 0 auto 0 auto;
	}

	.FooterContainer{
		width:978px;
		height: auto;
		border-left: 1px solid #dedede;
		border-right: 1px solid #dedede;
		min-height: 40px;	
		text-align: center;	
		color: #999;

	}

	.FooterContainer a:link, .FooterContainer a:active, .FooterContainer a:visited {
		color: #999;
		text-decoration: none;

	}

	.FooterContainer a:hover {
		text-decoration: none;
		color: #3399fe;
			
	}
	
/* ------------------------------------------------------------

	VIDEO CONTENT
	
------------------------------------------------------------ */


	.VideoHeader{
		width: 900px;
		max-height: 50px;
		margin: 0 auto 0 auto;
		float: none;
		overflow: hidden;

	}

	.VideoTitle{
		font-size: 20px;
		color: #3399ff;
		width: 450px;
		height: 48px;
		line-height: 22px;
		float: left;
		margin: 0 0 0 3px;
	}
	
	*html .VideoTitle {
		overflow:hidden;
	}

	#VideoInfoWrapper{
		float: right;
		height: 22px;
		width: auto;

	}

	#VideoInfo{
		width: 300px;
		height: 20px;
		text-align: right;
		font-size: 11px;
		float: left;
		display: inline;
		clear: left;
		

	}
	

	.VideoInfo a:link, .VideoInfo a:active, .VideoInfo a:visited {
		color: #ff9933;
		text-decoration: none;
		font-weight: bold;

	}

	.VideoInfo a:hover {
		text-decoration: none;
		color: #3399ff;
			
	}


	img.AvatarMicro{
		height: 22px;
		width: 22px;
		margin: 0 0 0 5px;
		display: inline;
		

	}

	img.MoreDetails{
		height: 5px;
		width: 70px;
		
	}
	
	#VideoContentWrapper{
		width: 900px;
		height: auto;
		float: none;
		margin: 0 auto 0 auto;

	}

	#VideoPlayer{
		float: left;
		width: 450px;
		height: 370px;
		margin: 0;
		padding: 0;

	}

	

	#flashcontent{
		height: 100%;
		width: 100%;
}

	a img { border: 0; }		/* Removes all borders from hyperlinked images */

	
/* ------------------------------------------------------------

	WIDGET LAYOUT
	
------------------------------------------------------------ */

#VideoInformationBar{
	width: auto;
	height: 20px;
	background: #ebf2f2;
	padding: 3px 0 2px 0;
	}

#VideoWidgetContent{
		width: 430px;
		height: 368px;
		float: right;
		margin: 0 auto 0 auto;
		/*display: block;*/
		border: 1px solid #ccc;


		
	}
	
	.VideoWidgetTopCorners{
		width:440px; 
		height:15px; 
		background:transparent url("/images/template1.03/Video_Widget_Top_Corners_.gif") no-repeat;
		margin: 0;
		padding: 0;


	}
	
	.VideoWidgetBottomCorners{
		width:440px; 
		height:15px; 
		background:transparent url("/images/template1.03/Video_Widget_Bottom_Corners_.gif") no-repeat;


	}

	.VideoWidgetBackground{
		background:url("/images/template1.03/Video_Widget_Background.gif") no-repeat;
		height: 340px;			
		padding: 0 20px 0 20px;
		text-align: center;
		font-size: 16px;

	}

	#VerticalAlignContainer{
		display: table-cell;
    	vertical-align: middle;
    	height: 310px;						/* Do not increase height - it will cut off widget controls */

	}

	#WidgetContent{
    text-align: center;
    font-size: 15px;
    overflow: auto;
    
	}

	#WidgetDetailsContainer{
		width: 400px;							/* Width cannot increase here */
		margin: 0 auto 0 auto;
		height: 22px;
		float: none;
		font-size: 11px;

	}


	#WidgetUser{
		font-weight: bold;
		font-size: 11px;
		text-align: left;	
		width: auto;
		float: left;
		
    
  }


	img.WidgetAvatar{
		float: left;
		width: 22px;
		height: 22px;
		margin: 0 5px 0 0;

	}

	#WidgetControls{
		width: 80px;
		float: none;
		height: 6px;
		padding: 0 0 0 0;
		margin: 0 0 0 0;			/* Do not apply a top margin - it will break the widget box */

	}

	#WidgetTime{
		float: right;
		width: auto;
		margin: 0 0 0 0;

	}


/* ------------------------------------------------------------

	VIDEO OPTIONS
	
------------------------------------------------------------ */

	#VideoSecondRow{
		width: 900px;
		height: auto;
		float: none;
		margin: 10px auto 0 auto;

	}

	#VideoOptionsDescriptionWrapper{
		width: 450px;
		height: auto;
		margin: 0;
		float: left;		

	}

	#VideoOptionsContainer{
		width: 450px;
		height: 20px;
		margin: 0 0 0 0;
		float: left;
		padding:0;
	}


	#PastContentWrapper{
		width: 440px;
		height: auto;
		float: right;
		
	}


	#PastContentContainer{
		width: 438px;
		height: auto;
		margin: -20px auto 0 auto;
		border-right: 1px solid #ccc;
		border-left: 1px solid #ccc;
		float: right;
		
	}

	.PastContentInner{
		width: 415px;
		margin: 10px auto 0 auto;
		padding: 10px 0 10px 0;

	}

	.PastContentBottomCorners{
		width:439px; 
		height:6px; 
		background:url("/images/template1.03/Past_Content_Bottom_Corners.gif") no-repeat;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		float: right;

	}
	
	#Options{
		float: left;

	}

	#Bookmarks{
		float: right;

	}



/* ------------------------------------------------------------

	RELATED TUMBLES
	
------------------------------------------------------------ */

	#VideoRelatedContentWrapper{
		width: 900px;
		margin: 0 auto 0 auto;

	}

	
	.RelatedTumblesContainer{
		width: 625px;
		height: auto;
		float: left;

	}

	.RelatedVideoRow{
		width: 625px;
		float: none;
		margin: 0 0 0 0;
		height: auto;
		padding: 0 0 10px 0;
		clear: both;

	}
	
	.VideoItem{
		width: 120px;
		height: 130px;
		float: left;
		text-align: center;
		font-size: 11px;
		line-height: 12px;
		margin: 0 30px 0 0;

	}	

	.VideoThumbTitle{
		color: #3399ff;
		font-size: 10px;
		margin: 0 0 3px 0;

	}

	.VideoThumb{
		width: 120px;
		height: 85px;
		float: none;

	}

	.VideoThumbTime{
		color: #666;
		margin: 3px 0 0 0;

	}


	#VideoDescription{
		width: 450px;
		height: auto;
		margin: 20px 0 0 0;
		float: left;
		font-size: 11px;
		line-height: 14px;

	}

	.VideoDescriptionTitle{
		color: #3399ff;

	}


/* ------------------------------------------------------------

	VIDEO WIDGET ICONS, ETC.
	
------------------------------------------------------------ */


	.VideoComment{
		background:url("/images/template1.03/Icon_Comment.gif");
		background-repeat: no-repeat;
		padding: 0 0 0 20px;
		font-size: 11px;
		
	}

	
	.VideoImage{
		background:url("/images/template1.03/Icon_Image.gif");
		background-repeat: no-repeat;
		padding: 0 0 0 20px;
		font-size: 11px;
		
	}

	.VideoLink{
		background:url("/images/template1.03/Icon_Link.gif");
		background-repeat: no-repeat;
		padding: 0 0 0 20px;
		font-size: 11px;
		
	}

	.VideoText{
		background:url("/images/template1.03/Icon_Text.gif");
		background-repeat: no-repeat;
		padding: 0 0 0 20px;
		font-size: 11px;
		
	}
	
	.VideoQuote{
		background:url("/images/template1.03/Icon_Quote.gif");
		background-repeat: no-repeat;
		padding: 0 0 0 20px;
		font-size: 11px;
		
	}



	.TimeMarker{
		color: #999;

	}

	.SmallText{
		font-size: 10px;
		line-height: 13px;
		font-weight: bold;
		margin: 5px 0 0 0;
		padding: 0;

	}


		


/* ------------------------------------------------------------

	TAGS
	
------------------------------------------------------------ */


	.TagsContainer{
		width: 235px;
		height: auto;
		float: right;

	}

	.TagsContainer ul{
		list-style: none;
		margin-left: 0px;
		padding-left: 0;
		font-size: 12px;
		color: #3399ff;
	
	}

	.TagsContainer li{
		list-style-type: disc;
		margin-left: 0px;
		padding-left: 0;
	
	}

	.TagsContainer li a{ 
		color: #3399ff;
	
	}

	.TagsContainer li a:hover{ 
		color: #666;
	
	}




/* ------------------------------------------------------------

	DASHBOARD
	
------------------------------------------------------------ */

	#DashboardContainer{
		width: 420px;
		height: 320px;
		margin: 0 auto 0 auto;
		float: none;
		font-size: 11px;
	}

	.DashboardLeft{
		width: 275px;
		height: auto;
		float: left;
		text-align: left;

	}

	.DashboardRight{
		width: 135px;
		height: auto;
		float: right;
		text-align: left;
		line-height: 13px;

	}

	.AuthorWidgetTitle{
		font-weight: bold;
		font-size: 13px;
		color: #3399ff;
		float: left;
		margin: 0 0 0 0;

	}

	WidgetImage{
		float: left;
		height: 20px;

	}

	.Row{
		height: auto;
		margin: 0 0 10px 0;

	}

	.FormField{
		color: #3399ff;
	}

	.SmallButtonBox{
		font-size: 11px;
		text-transform: capitalize;
		border: 1px solid #3399ff;
		color: #fff;
		padding: 3px;

	}
		
	.Replay a:link, .Replay a:active, .Replay a:visited {
		color: #fff;
		text-decoration: none;
		font-weight: normal;

	}

	.Replay a:hover {
		text-decoration: none;
		color: #000;

	}		



/* ------------------------------------------------------------

	TINYMCE & WIDGET CREATE AREA
	
------------------------------------------------------------ */


/* ------------------------------------------------------------

	WIDGETS COMMON
	
------------------------------------------------------------ */

.WidgetIcon{
	margin-top: 1px; float: left;
}

.WidgetTime{
	float: left;
	font-size: 13px;
	color: #3399ff;
}

.WidgetContainer{
	text-align: left;
	line-height: 13px;
	padding: 10px;
	width:380px;
	height: 325px;




}

.WidgetTitle{
	font-size: 19px;
	line-height: 16px;
	color: #ff9933;
}

.WidgetDescription{	font-size: 12px;
	margin: 0 0 20px 0;
	line-height: 16px;
}

.WidgetDescriptionCenter{
	font-size: 12px;
	margin: 0 0 20px 0;
	line-height: 16px;
	text-align: center;
}

/* ------------------------------------------------------------

	LINKS WIDGET
	
------------------------------------------------------------ */

.WidgetLink{
	margin: 0;
	padding: 0;
}

.WidgetLink a:link, .WidgetLink a:active, .WidgetLink a:visited {
	color: #333399;
	text-decoration: none;
	font-weight: normal;
}

.WidgetLink a:hover {
	text-decoration: none;
	color: #000;
}	
	
/* ------------------------------------------------------------

	QUOTE WIDGET
	
------------------------------------------------------------ */

.Quote{
	min-height:28px;
	background:#ffffff url("/images/template1.03/Opening_Quote.gif") no-repeat 0 0 !important;
	padding-left: 50px;
	font-size: 16px;
	line-height: 22px;
}

*html .Quote {
	height:28px;
}


/* ------------------------------------------------------------

	IMAGE WIDGET
	
------------------------------------------------------------ */

.WidgetImage{
	text-align: center;
}
/* ------------------------------------------------------------

	CSS TABS
	
------------------------------------------------------------ */

ul#tabnav { /* general settings */
text-align: center;
margin: 0 0 0 0;
font-size: 14px;
list-style-type: none;
padding: 2px 0 2px 10px; /* THIRD number must change with respect to padding-top (X) below */
float: right;
}

ul#tabnav li { /* do not change */
display: inline;
margin: 0px;

}

#tab1 li.tab1, #tab2 li.tab2, #tab3 li.tab3, #tab4 li.tab4 { /* settings for selected tab */
background-color: #45a2ff;
}

#tab1 li.tab1 a, #tab2 li.tab2 a, #tab3 li.tab3 a, #tab4 li.tab4 a { /* settings for selected tab link */
background-color: #45a2ff;
color: #000; /* set selected tab link color as desired */
position: relative;
padding-top: 2px; /* must change with respect to padding (X) above and below */
}

ul#tabnav li a { /* settings for all tab links */
padding: 2px 8px; /* set padding (tab size) as desired; FIRST number must change with respect to padding-top (X) above */
background-color: #45a2ff;
color: #fff; /* set unselected tab link color as desired */
margin-right: 0px; /* set additional spacing between tabs as desired */
text-decoration: none;
border-bottom: none;
}

ul#tabnav a:hover { /* settings for hover effect */
color: #000; /* set desired hover color */
background-color: #0066cc;

}

/* ------------------------------------------------------------- */



		
/* ----- ACCORDIONS ----- */
ul.accordion, ul.accordion a.header, ul.accordion div.content {border: 1px solid #ccc;font-weight: bold;background: #f6f6f6;}
ul.accordion {border-width: 1px 1px 0 1px;}
ul.accordion a.header, ul.accordion div.content {border-width: 0 0 1px 0;}
ul.accordion a.header {background-color: #efefef; color: #333;}


/* ----- ACCORDIONS ----- */
ul.accordion, ul.accordion li {display: block; line-height: normal; list-style: none; margin: 0; padding: 0;}
ul.accordion {margin: 0; position: relative; width: 100%;}
ul.accordion a.header {display: block; padding: 3px 5px; font-size: 14px;position: relative; text-decoration: none;}
ul.accordion a.header span.action {position: absolute; right: 5px;}
ul.accordion div.content {line-height: 1.5em; padding: 0 10px;font-weight: normal;font-size:12px;}

#accordion1, #accordion2, #accordion3{
	padding: 10px 10px 10px 10px;
}

.toggle-accordion1, .toggle-accordion2, .toggle-accordion3{
	background: #3f9ffe;
	color: #fff;
	border: 0px;
}
		
