/*  
Theme Name: Hypebeast Clone
Description: A Customized Theme
Author: Mellianae Merkusi
*/

body{
margin:0;
padding:0;
background-color: #EAEAEA;
font-family:"Helvetica Neue",Helvetica, Arial,sans-serif;height:100%;font-size:62.5%;
}

#maincontainer{
width: 950px; 
margin: 0 auto;
background-color: #FFFFFF;
padding: 0 15px;
}

#topsection{
height: 85px;
overflow: hidden; 
}

#topsection h1{
padding: 0;
margin: 0;
float: left;
}

#topsection form{
padding: 0;
margin: 15px 0 0 0;
float: right;
height: 25px;
background-color:#CCCCCC;
overflow: hidden;
}

#topsection .searchinput{
background-color: #BBBBBB;
border: none;
color: #FFFFFF;
font-size: 12px;
font-weight: bold;
padding: 4px 10px 3px 10px;
height: 17px; 
margin: 0px;
overflow: hidden;
vertical-align: top; 
}

#topsection .searchgo{
overflow: hidden;
background: url(images/go.jpg);
width: 30px;
height: 24px;
border: none;
margin: 0 0 0 -4px;
}

#menutop{
height: 28px;
margin-bottom: 15px;
border-bottom: 1px solid #EAEAEA;
}

#navbar {
	margin: 0;
	padding: 0;
	height: 1em; }
#navbar li {
	list-style: none;
	float: left; }
#navbar li a {
	display: block;
	}
#navbar li ul {
	display: none; 
	}
#navbar li:hover ul, #navbar li.hover ul {
	display: block;
	position: absolute;
	margin: 0;
	padding: 0; 
        z-index: 1002;
}
#navbar li:hover li, #navbar li.hover li {
	float: none; }
#navbar li:hover li a, #navbar li.hover li a {
	background-color: #ffffff;
	border-bottom: 1px solid #BABABA;
	color: #BABABA;
        padding: 3px;
        font-size: 14px;
        }
#navbar li li a:hover {
	background-color: #eeeeee; 
        color: #000;}

#menutop ul{
padding: 0;
margin: 0;
float: left;
}

#menubt{
position: absolute;
width: 2000px;
height: 3000px;
background-color: #fff;
z-index: 9999;
}

ul#othermenu{
padding: 0;
margin: 0;
float: right;
}

#menutop li{
list-style: none;
float: left;
margin-right: 10px;
font-size: 18px;
font-weight: bold;
}

#menutop li.facebook, #menutop li.rss, #menutop li.twitter, #menutop li.instagram{
float: left;
text-indent: -5000px;
}

#menutop li.rss a{
background-image:url("../../uploads/2013/05/rss2.jpg");
background-repeat:no-repeat!important;
background-position:top;
height: 30px;
width: 25px;
}

#menutop li.twitter a{
background-image:url("../../uploads/2013/05/twitter.jpg");
background-repeat:no-repeat!important;
background-position:top;
height: 30px;
width: 25px;
}

#menutop li.instagram a{
background-image:url("../../uploads/2013/05/instagram.jpg");
background-repeat:no-repeat!important;
background-position:top;
height: 30px;
width: 25px;
}

#menutop li.donate a{
color: red;
}

#menutop li.shop a{
color: #33ccff;
}

#menutop li.facebook a{
background-image:url("../../uploads/2013/05/facebook.jpg");
background-repeat:no-repeat!important;
background-position:top;
height: 30px;
width: 25px;
}

#menutop li a{
text-decoration: none;
color: #BABABA;
display: block;
}

#menutop li a:hover{
color: #000000;
}

#mainimg{
padding-bottom: 15px;
border-bottom: 1px solid #EAEAEA;
display:block;
position: relative;
height: 350px;
}


#content{
background-image: url(images/bg-content.jpg);
background-repeat: repeat-y;
padding: 15px 0;
font-size: 12px;
border-bottom: 1px solid #EAEAEA;
}

#content2{
padding: 0px 0 20px 0;
font-size: 11px;
border-bottom: 1px solid #EAEAEA;
overflow: hidden;
}

#leftcolumn{
float: left;
width: 620px;
padding-right: 15px;
}

#leftcolumn .text{
line-height: 1.5em;
font-size: 11px;
color: #595959;
}


#leftcolumn .textpostsingle, #content2 .text{
line-height: 1.5em;
font-size: 12px;
color: #595959;
}


#leftcolumn .text img,
#leftcolumn .textpostsingle img {
max-width: 100%;
height: auto;
}

#leftcolumn h2{
padding: 0 0 10px 0;
margin: 0;
float: left;
font-size: 24px;
line-height: normal;
}

#content2 h2{
padding: 0;
margin: 0;
font-size: 22px;
float: left;
line-height: normal;
}

#content h2 a{
text-decoration: none;
color: #595959;
}

#leftcolumn .text h2, #leftcolumn .textpostsingle h2{
padding: 0 0 0px 0;
margin: 0;
font-size: 22px;
float: none;
}

#content .timemain{
float: right;
color: #C0C0C0;
font-size: 16px;
font-weight: bold;
padding-top: 5px;
}

.postbreak{
overflow: hidden;
height: 15px;
border-bottom: 1px solid #EAEAEA;
clear: both;
}

.post{
height: 200px;
border-bottom: 1px solid #EAEAEA;
line-height: 1.5em;
font-size: 11px;
color: #595959;
padding: 15px 15px 15px 0;
overflow: hidden;
position: relative;
}



a.box-link {display:block;width:100%;height:100%;position:absolute;top:0;left:0;z-index:1001;_display:none;}
a.box-link:hover {background:#eaeaea;opacity:0.4;filter: alpha(opacity=40); /* internet explorer */
	-khtml-opacity: 0.4;      /* khtml, old safari */
	-moz-opacity: 0.4;       /* mozilla, netscape */}

.post img{
border: none;
}

.imgpostwrap{
width: 300px;
height: 200px;
overflow: hidden;
float: left;
position: relative;
margin-right: 10px;

}


.post .text{
height: 180px;
}

.post .comment{
height: 20px;
text-align: right;
font-weight: bold;
}

.post .comment a{
color: #C0C0C0;
}


.post h3{
margin: 0;
padding: 5px 0;
color: #000000;
font-size: 18px;
}

.post h3 a {
color: #000000;
}

.post h3 a:hover, .post .comment a:hover {
color: #0298FF;
}

a{
color: #0298FF;
text-decoration: none;
}

#navigation{
padding-top: 15px;
}

#rightcolumn{
float: right;
width: 300px;
position: relative;
}

#rightcolumn h2{
font-size: 14px;
padding: 0 0 10px 0;
margin: 0;
}

#rightcolumn h2.twitterleft{
float: left;
}

#rightcolumn h2.twitterright{
float: right;
}

#rightcolumn h2.twitterright a{
color: #888;
}


.wrapperwidget {
margin-bottom: 20px;
display: block;
}

#mycustomscroll {
margin-bottom: 20px;
display: block;
height: 350px;
overflow: auto;
padding-right: 5px;
position: relative;
}


.wrapperwidget ul{
padding: 0;
margin: 0;
}

.wrapperwidget li{
list-style: none;
background-color: #EAEAEA;
margin-bottom: 1px;
font-weight: bold;
color: #333333;
padding: 8px 10px;
display: block;
}


#mycustomscroll li.blogwrapclass {
font-size: 11px;
}


#mycustomscroll li.blogwrapclass a {
color: #777;
}



.wrapperwidget li img{
border: none;
margin-left: -15px;
}

.blogpicwrap{
float: left;
margin: 0 5px 0 0;
height: 50px;
width: 50px;
overflow: hidden;
}


.wrapperwidget li h3{
margin: 0;
padding: 0;
font-size: 16px;
color: #333;
}


.wrapperwidget li a{
text-decoration: none;
color: #333333;
}

.wrapperwidget li.twitterli a{
text-decoration: none;
color: #0298FF;
}

.wrapperwidget li.twitterli a:hover{
text-decoration: underline;
}

.wrapperwidget li.twitterli:hover{
background-color: #EAEAEA;
}



.wrapperwidget li  a:hover{
color: #0298FF;
}

.wrapperwidget li:hover{
background-color: #BBBBBB;
}


#footer{
width: 100%;
color: #000000;
text-align: center;
padding: 10px 0;
font-size: 11px;
background-color: #FFFFFF;
}

#footer .left{
float: left;
}

#footer ul{
padding: 0;
margin: 0;
float: right;
}

#footer li{
list-style: none;
display: inline;
margin-right: 10px;
font-weight: bold;
}

#footer li a{
text-decoration: none;
color: #000000;
}

.clear {
clear: both;
}


a span.coba{display:none;}
a:hover span.coba {background:#000000;opacity:0.7;filter: alpha(opacity=70); display:block;
width:96%;
position:absolute;
bottom:3px;
font-weight: bold;
color: #FFFFFF;
text-align: left;
font-size: 24px;
padding: 10px 2%;
left:0;z-index:1001;  /* internet explorer */
	-khtml-opacity: 0.7;      /* khtml, old safari */
	-moz-opacity: 0.7;       /* mozilla, netscape */
}


#content_category{
padding: 0px 0 15px 0;
font-size: 11px;
border-bottom: 1px solid #EAEAEA;
padding-bottom: 15px;
}

#content_category .postbox{
width: 300px;
height: 330px;
overflow: hidden;
float: left;
display: block;
position: relative;
background-color: #000000;
color: #FFFFFF;
margin: 0 15px 15px 0;
line-height: 1.3em;
}

#content_category .postbox h2{
padding: 0 0 5px 0;
margin: 0;
font-size: 20px;
}

#content_category .text{
padding: 0;
padding: 10px;
position: relative;
height: 200px;
}

.time_category{
padding: 5px 0;
background-color: #898989;
text-align: center;
width: 100px;
position: relative;
margin: -10px 0 0 10px;
font-weight: bold;
}

.pagingleft{
float: left;
font-size: 14px;
}

.pagingleft a{
font-weight: bold;
color: #000000;
text-decoration: none;
}

.pagingright{
font-size: 14px;
padding: 5px 10px;
background-color: #CCCCCC;
color: #FFFFFF;
margin-right: 10px;
float: left;
cursor: pointer;
}

.pagingright a{
color: #FFFFFF;
text-decoration: none;
}

.right{
float: right;
height: 30px;
}

ul#authorlist img{
width: 150px;
height: 117px;
border: none;
margin: 0 0 0 -10px;
overflow: hidden;
}

ul#authorlist .imgwrap{
width: 128px;
height: 117px;
overflow: hidden;
position: relative;
}


a.photouser{
display:block;width:100%;height:100%;position:absolute;left:0;top:0;z-index:1001;
}

a.photouser:hover{
background:#eaeaea;opacity:0.4;filter: alpha(opacity=40); 
	-khtml-opacity: 0.4;      
	-moz-opacity: 0.4;      
}


ul#authorlist{
padding: 0;



margin: 0;
}

ul#authorlist li{
width: 128px;
height: 145px;

overflow: hidden;
margin-right: 7px;

list-style: none;

font-weight: bold;
float: left;
}


ul#authorlist li a{
color: #000000;
}

ul#authorlist li a:hover{
color: #0298ff;   
}


.text hr{
height: 1px;
overflow: hidden;
background-color: #E8E8E8;
border: none;
}

.dateleft{
float:left;
margin-bottom: 20px;
}

.commentright{
float:right;}

#authorprofile img{
float: right;
margin-left: 5px;
}

#authorprofile {
display: block;
padding: 10px;
background-color: #CCCCCC;
font-size: 11px;

}

.right{
float: right;
height: 30px;
clear: both;
}

.rowright{
float: right;
width: 465px;
}

.rowleft{
float: left;
width: 465px;
}

#authorstyle .rowright{
float: none;
width: 100%;
}

#authorstyle .rowleft{
float: none;
width: 100%;
}


/* sidebar staff */
	        
                #staff {margin-bottom:20px; font-size:11px;}
	        #staff ul{margin-top:5px;clear:both;}

		#staff li {list-style-type:none;margin-bottom:1px;background-color:#eaeaea;}
		#staff li span {float:right;}
		#staff li a {color:#777;text-decoration:none;font-size:10px;}
		#staff li a:hover {color:#0298ff;}
		#staff li {color:#333;text-decoration:none;display:block;padding:7px 8px;}
		#staff li strong {}

/* Scroll Bar Master Styling Starts Here */
/* All comments can be freely removed from the css */

.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;
}

.vscrollerbase {
width: 10px;
background-color: #EAEAEA;
}
.vscrollerbar {
width: 10px;
background-color: #BBBBBB;
}
.hscrollerbase {
height: 10px;
background-color: #EAEAEA;
}
.hscrollerbar {
height: 10px;
background-color: #BBBBBB;
}

.scrollerjogbox {
width: 10px;
height: 10px;
top: auto; left: auto;
bottom: 0px; right: 0px;
background-color: gray;
}

.sociable {
float: left;
margin-left: 20px;
}

#zrx_captcha small{
font-size: 12px;
}

#tweetbacks{
display: none;	
}

#toppage{
position: absolute;
bottom: 0;
right: 0;
font-weight: bold;
margin-bottom: -10px;
}

#toppage a{
color: #BABABA}

#authorstyle .text
{font-size: 12px}







/*Featured Post Slide Show*/

#mainimg ul{
padding: 0;
margin: 0;
}

#mainimg ul li{
float:left;
list-style: none;
}

.slide_cont{
height: 350px;
}


.prev{
width:15px;
height:28px;
background: url('../../../../images/arrowlight_left.png') no-repeat center;
cursor:pointer;
position: absolute;
bottom: 160px;
left: 5px;
z-index: 2000;
}

a:hover.prev{
background: url('../../../../images/arrowdark_left.png') no-repeat center;
}

a:hover.next{
background: url('../../../../images/arrowdark_right.png') no-repeat center;
}


.next{
width:15px;
height:28px;
background: url('../../../../images/arrowlight_right.png') no-repeat center;
cursor:pointer;
position: absolute;
bottom: 160px;
right: 5px;
z-index: 2000;
}

#mainimg img{
border: none;
}

.more_vid a{
font-size: 14px;
font-weight: bold;
}

.more_vid a:hover
{color: #000;}



#leftcolumn .textpostsingle .videobox{
width: 300px;
height: 250px;
margin: 0 0 20px 10px;
float: left;
overflow: hidden;
}

#videopicwrap{
display: block;
margin: 20px 0;
}

#videopicwrap img{
float: left;
margin-right: 20px;
}

#commentwrapper{
display: block;
margin: 20px 0;
padding: 10px 0;
border-top: 1px solid #EAEAEA;
border-bottom: 1px solid #EAEAEA;
}

#commentwrapper .leftform{
float: left;
}

#commentwrapper .rightform{
float: left;
}

/* Scrolling Header Style */

#opacitybar     {
        /*border-bottom:1px solid #ECF1EF;*/
        background:#ffffff;
        font-color:#ffffff;
        padding:10px 20px;
        position:fixed;
        top:0;
        left:0;
        z-index:2000;
        width:100%;
}
]]></b:skin>