/* Style sheet for SimRick Channel pages */






/* CSS Body */
body{
	background-image: url("assets/zonebg.jpg");
	background-color: #29005e;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat, repeat;
	background-attachment: fixed;	
	margin:0;
}



/* GLOBAL NAVIGATION BAR */
.globaltitlebar{
	padding: 0px 0; 
	display:block; 
	background-color:#000000; 
	height: 50px; 
	width:100%;
}		
.globalnav{
	margin:auto; 
	font-family: roboto italic; 
	width:950px; 
	font-size:20px; 
	list-style-type:none; 
	overflow:hidden; 
	color:white; 
	list-style-type:none; 
	overflow:hidden;
	padding-top: 2px;
}
.irclogo {
	float: left;
	margin: auto;
	color: white;
	padding-top: 7px;
	padding-bottom: 10px;
	padding-left: 5px;
	padding-right: 9px;	
}
.globalmenuitem {
	float: left;
	font-family: roboto italic; 
}
.globalmenuitem a {
	font-family: roboto italic; 
	font-size: 22px; 
	display: block;
	color: white;
	text-align: center;
	text-decoration: none;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 11px;
	padding-right: 11px;
}
.globalmenuitem a:hover:not(.active) {
	background-color: #840000;
}




/* Page Content Body */
.contentbody{
	font-family: roboto;
	margin: auto;
	height: auto;
	width: 950px;
}

.titlenamespace{
	font-family: roboto;
	margin: auto;
	height: 130px;
	width: 100%;
}
.titlenamegraphic{
	padding-top: 25px;
	padding-left: 2px;
}




.herocontainer{
	display: flex;
	gap: 2px;
	overflow: hidden;
	flex-wrap: wrap;
}
.herovideopreviewspace{
	background-color: black;
	height: 300px;
	width: 472px;
	margin-top: 2px;
	margin-left: 0px;
	margin-right: 2px;
	margin-bottom: 6px;
	
}
.herotextspace{
	background-color: #2e0187;
	height: 300px;
	width: 472px;
	margin-top: 2px;
	margin-left: 2px;
	margin-right: 0px;
	margin-bottom: 6px;	
}
.herotextspacetitle{
	font-family: roboto bold italic;
	font-size: 35px;
	line-height: 23px;
	float: left;
	font-weight: normal;
	color: white;
	margin-top: 25px;
	margin-left: 9px;
	margin-right: 5px;
	margin-bottom: 0px;	
}
.herotextspaceparagraph{
	font-family: roboto;
	font-size:17px;
	line-height: 20px;
	float: left;
	color: white;
	margin-top: 0px;
	margin-left: 11px;
	margin-right: 8px;
	margin-bottom: 0px;	
}


.herolinkButton a {
	font-family: Roboto Medium;
	text-align: center;
	color: white;
	background-color: #7d00b3;	
	width: auto;
	height: auto;
	float: left;
	margin-top: 0px;
	margin-left: 2px;
	margin-right: 3px;
	margin-bottom: 2px;
	padding-top: 6px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 6px;
	text-decoration: none;
}
.herolinkButton a:hover {
	transition-duration: 0.3s;	
	background-color: white;	
	color: #7d00b3;
	text-decoration: none;
}














.whitepage{
	display: block;
	background-color: #fff;
	margin-top: 6px;
	width: 100%; 
	height: 100%;	
	flex-direction: column;
}

.pagetitle1{
	font-family: Roboto BK Italic;
	font-size: 44px;
	color: #2e0187; 
	text-align: center;
	margin-top: 12px; 
	margin-left: px; 
	margin-bottom: 9px;	
}



/* playlist thing */
.playlists{
	display: flex;
	gap: 4px;
	overflow: hidden;
	margin-top: 6px;
	margin-bottom: 0px;
	margin-left: 15px;
	margin-right: 1px;
	height: auto;
	width: 100%;
	justify-content: left;
}
.playitem{
	float: left;
	height: 250px;
	width: 225px;
	background-color: #15014C;
	background-size: cover;
	margin-top: 2px;
	margin-bottom: 2px;
	margin-left: 1px;
	margin-right: 1px;	
	text-decoration: none;
}
.playitem:hover{
	color: white;
	text-decoration: underline;
}
.playthumb{
	height: 144px;
	width: 216px;
	background-image: url("images/simrickbanner.jpg"); 
	background-size: 100%;
	background-position: cover;
	background-repeat: no-repeat;
	background-color: black;
	margin-top: 4px;
	margin-left: 4px;
	margin-right: 4px;	
	margin-bottom: 4px;
}
.playtitle{
	font-family: Roboto Medium Italic;
	/* text-shadow: 2px 0px 6px #000673; */
	color: white;
	line-height: 23px;
	font-size: 22px;
	text-align: left;
	margin-top: 6px;
	margin-left: 5px;
	margin-right: 5px;	
	margin-bottom: 2px;
}
.playsubtitle{
	font-family: Roboto Italic;
	/* text-shadow: 2px 0px 6px #000673; */
	color: white;
	font-size: 14px;
	text-align: left;
	margin-top: 0px;
	margin-left: 5px;
	margin-right: 5px;	
	margin-bottom: 0px;
}




/* Related Channels */
.relatedbox{
	height: 50px;
	width: 950px;
	background-color:#000000; 
	margin-top: 7px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 7px;
	padding-top: 12px;
	padding-bottom: 12px;
	font-weight: normal;
}
.relatedtitle{
	float: left;
	font-family: roboto;
	font-size: 17px;
	color: white;
	padding-top: 14px;
	padding-left: 6px;
	margin: 1px;
}
.channelbuttonbox{
	float: left;
	font-family: roboto medium;
	font-weight: normal;
	font-size: 15px;
	color: white;
	margin-top: 3px;
	margin-left: 7px;
	background-color: #454545;
	padding-top: 12px;
	padding-bottom: 12px;	
}
.channelbuttonbox a{
	color: white;
	text-decoration: none;
	padding-left: 8px;
	padding-right: 8px;	
}

.channelbuttonbox:hover {
    background-color: transparent; 
    color: #454545; 
}
.channel-main:hover {
    background-color: #AB0000; /* Example: OrangeRed */
}
.channel-two:hover {
    background-color: #C91414; /* Example: Firebrick */
}
.channel-extra:hover {
    background-color: #780000; /* Example: Salmon */
}
.channel-simrick:hover {
    background-color: #006600; /* Example: Blue Violet */
	padding-top: 12px;
	padding-bottom: 12px;		
}
.channelbuttonbox:hover a { 
    color: white;
    text-decoration: underline;
}











.dividingline{
	padding-bottom: 1px; 
	background-color: #bababa; 
	margin-left: 9px;
	margin-right: 9px;
}





/* FOOTER DESIGN */
.footer {
	height: 100px;
	width: 100%;
	padding: 0px 0; 
	background-color: #840000;
	background-image: url("../assets/footerbg.jpg");
	color: white;
	text-align: center;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	padding: 14px 0;
}
.footertext{
	margin-top: 17px;
	margin-bottom: 2px;
	font-family: roboto italic;	
}