/*
-----------------------------------------------
12frenz Site
Author	 					: http://www.12frenz.com
Design & Development		: www.mobafone.co.id (tc)
Date	 						: Feb 2008
Version						: v.3
Name							: photo.css
----------------------------------------------- 
*/

.component-photo-info, .component-video-info{margin-top:0px;margin-bottom:5px;margin-left:5px!important;margin-left:11px;}
.component-photo, .component-video{float:none;clear:both;margin-bottom:5px;margin-top:5px;padding:0px;background-color:#FFFFFF;border:none;}
.photobox{width:153px!important;width:150px;height:auto;margin-right:5px;margin-left:5px;margin-bottom:10px;padding:0px;float:left;}
.photobox h1{margin:0px;padding:0px;font-size:11px;font-weight:bold;text-align:left;}
.photobox div{text-align:left;margin-bottom:5px;padding:0px;}
div.photobox-img{width:153px!important;width:150px;height:100px;margin:0px;padding:4px 0px 4px 0px;border:solid 1px #DDDDDD;text-align:center;background-color:#f4f3f1;}
.photobox img{border:none;}

.component-photo-gallery{width:734px;height:auto;padding: 0px 0px 10px 0px;text-align:center;float:left;}
.component-photo-gallery p {margin-left: 5px;margin-top:5px;font-size: 18px;padding:0px;}
.component-video-gallery{border-top: solid 1px #dbd7d2; margin:5px 0 0 0; padding: 10px 0 0 0; text-align:left;}

.gallery-next{border:dashed 1px #FFFFFF;width:48px;height:451px;float:left;cursor:pointer;background-image:url("../../images/general/slideshow-arrow-left.jpg");background-repeat:no-repeat;background-position:center;padding:0px;margin:0px;margin-right:5px;}
.gallery-prev{border:dashed 1px #FFFFFF;width:53px;height:451px;float:left;cursor:pointer;background-image:url("../../images/general/slideshow-arrow-right.jpg");background-repeat:no-repeat;background-position:center;padding:0px;;margin:0px;}
/**.slideshow{width:604px;height:453px;float:left;margin-right:10px;margin-left:10px;}/**Yang di photo_gallery.html namanya .slideshow*/

div.slideshow { 
     
    /* required settings */ 
    position:relative; 
    overflow:hidden;          
    width: 604px;     
    height:453px;    
	 float:left;
	 margin-right:10px;
	 margin-left:10px;
} 

div.slideshow div.slidethumbs {     
    /* this cannot be too large */
    position:absolute;
	 text-align:left; 
	 width:auto;
	 height:auto;
	 margin:0px;
	 padding:0px;
	 top:0px;
	 left:0px;
} 

div.slidethumbs div.preview{float:left;width: 604px;height:453px;text-align:center;display:block;margin:0px;padding:0px;}
div.slidethumbs div.preview img {display:block;border: solid 0px #FFF;}

#gallery-scroll-thumbs{width: 238px; height: auto;float:left;margin:0px;padding: 5px;text-align:left;background-color:#f4f3f1;}
#gallery-scroll-thumbs img{border:none;}
#gallery-scroll-thumbs div.scrollable {     
    /* required settings */ 
    position:relative; 
    overflow:hidden;     
 
    /* vertical scrollers have typically larger height than width */     
    height: 202px;      
    width: 100%;     
}

#gallery-scroll-thumbs div.prev, #gallery-scroll-thumbs div.next{
	width: 98px;
	height:12px;
	background-color: #FFFFFF;
	border: solid 1px #dbd7d2;
	margin:0px;
	padding:0px;
}

#gallery-scroll-thumbs div.prev{margin-bottom: 2px;background-image: url("../../images/general/arrows-up.jpg");background-repeat: no-repeat;background-position:center;cursor:pointer;}
#gallery-scroll-thumbs div.next{margin-top: 2px;background-image: url("../../images/general/arrows-down.jpg");background-repeat: no-repeat;background-position:center;cursor:pointer;}

/* root element for scrollable items at photo_gallery.html*/ 
#gallery-scroll-thumbs div.scrollable div.items {     
    position:absolute;     
    /* this time we have very large space for height */     
    height:20000em;
}

/* root element for scrollable items at photo_gallery.html*/ 
#gallery-scroll-thumbs div.myphotothumbsbox {     
    margin-bottom: 1px;
	 margin-left: 0px;
}

#gallery-scroll-thumbs .photo-stats {width: 166px!important; width: 160px;font-size: 16px; margin-top:25%;font-weight:bold;color:#666666;text-align: center;float:right;border:none;}

#gallery-scroll-thumbs .photo-stats p{margin-bottom: 4px;}

#photo-album-list{width: 248px; height: auto;float:left;margin:0px; margin-top: 5px;padding: 0px;text-align:left;}
#photo-album-list div.what{width: 244px;}
#photo-album-list div.what h1{width:236px;}
#photo-album-list div.what ul{ list-style-type:none; margin:0px; padding:5px; }

.component-photo-info p{margin-top:5px;}
p.description{margin-top:15px;margin-bottom:15px;}
.component-photo-comment {width:625px;height:auto;margin:5px 5px 5px 0px;padding:0px;text-align:left;float:left;}
.component-photo-comment form, .commentbox {margin-bottom: 2px;background-color:#f4f3f1; padding: 5px;}
.component-photo-comment textarea {margin-bottom: 5px;}

.commentbox{height:35px;/*height:50px;*/padding:5px;}
.commentbox img{/*width:50px;height:50px;*/float:left;border:none;}
div.comment{float:left;margin-left:5px;margin-right:5px;width:555px;/*width:540px;*/}
.closebox{float:left;width:12px;height:16px;text-align:right;background-image:url("../../images/general/close.jpg");cursor:pointer;background-repeat:no-repeat;background-position:top;}
.closeboxover{float:left;width:12px;height:16px;text-align:right;background-image:url("../../images/general/closeover.jpg");cursor:pointer;background-repeat:no-repeat;background-position:top;}

.videoshow{width:644px;height:385px;float:left;margin-right:5px;padding:0px;text-align:left;background-color:#f4f3f1;}/**Yang di video_gallery.html namanya .videoshow*/
.myvideolist{width:333px;height:auto;margin:0px;padding:0px;float:left;background-color:#FFFFFF;}
.myvideolist h1{width:328px;height:21px;margin:0px;padding:4px 0px 0px 5px;background-color:#e9e6e1;font-size:11px;font-weight:bold;}
.myvideobox{width:323px;height:auto;margin-top:1px;margin-bottom:1px;padding:5px;background-color:#f4f3f1;clear:both;cursor:pointer;}
/* root element for scrollable */ 
div.scrollable {   
     
    /* required settings */ 
    position:relative; 
    overflow:hidden;     
 
    /* vertical scrollers have typically larger height than width */     
    height: 338px;      
    width: 100%;     
} 

/* root element for scrollable items */ 
div.scrollable div.items {     
    position:absolute; 
     
    /* this time we have very large space for height */     
    height:20000em;
}
/**.myvideoboxscroller{width:100%;height:338px;overflow:hidden;margin:0px;padding:0px;}*/
.myvideoboxtitle{font-weight:bold;margin-bottom:2px;}
.myvideoboxthumb{float:left;width:54px;height:42px;margin-right:3px;padding:2px;background-color:#FFFFFF;border:solid 1px #DDDDDD;}
.myvideoboxthumb img{border:none;width:54px;height:42px;}
.myvideoboxdesc{float:left;width:242px;height:auto;margin-right:3px;}
.myvideoboxnavigation {width:324px;height:auto;background-color:#f4f3f1;border:solid 1px #DDDDDD;margin:0px;padding:2px;}
.myvideoboxnavigation span{margin:0px 2px 0px 2px;}

.component-photo-advertisement{width:352px;height:auto;margin-top:5px;padding:0px;float:left;text-align:center;}

/* New Video List */
.vid_list_nav{margin:10px 0 0 0; padding:1px 0 0;}
.vid_list_nav .nav{border-top:1px solid #dbd7d2; background:#f4f3f1; margin:0 0 5px 0; padding:5px; text-align:left;}
.vid_list_nav .nav h1{margin:0; padding:0 0 2px; font-size:12px; font-weight:bold; color:#222221;}

.vid_list_nav .box{float:left; width:153px; margin:0 5px 10px; padding:0;}
.vid_list_nav .box .vid_box{float:left; width:153px; border:1px solid #dbd7d2; background:#F4F3F1; margin:0; padding:5px 0; text-align:center;}
.vid_list_nav h1{font-size:11px; font-weight:bold; margin:0; padding:0; text-align:left;}
.vid_list_nav span{font-size:10px; color:#95918c; font:10px/1.1em "Tahoma", Verdana, Arial, Helvetica, sans-serif;}

.vid_list_nav .list{margin:0 0 5px 8px; padding:0;}
.vid_list_nav .list .box{float:left; width:155px; margin:0 7px 0 0; padding:0;}
.vid_list_nav .list .box .vid_box{float:left; width:153px; border:1px solid #dbd7d2; background:#F4F3F1; margin:0; padding:5px 0; text-align:center;}
.vid_list_nav .list h1{font-size:11px; font-weight:bold; margin:0; padding:0; text-align:left;}
.vid_list_nav .list span{font-size:10px; color:#95918c; font:10px/1.1em "Tahoma", Verdana, Arial, Helvetica, sans-serif;}