@charset "utf-8";
/* Frontpage and other similar pages -  CSS Document */

/* ........ start frontpage specific css ............*/
/*Girl on right of frontpage */
.frontpagegirl{
	margin:-18px 0 0 5px;
	float:left;
	display:inline;
	width:255px;
}
.fpagemid{
	width:420px;
	float:left;
	background:url(/grafik/side9/hydrogen/images/frontpage_txt_bg.png) no-repeat 0 0;
	min-height:190px;
	margin:15px 0 0;
	position:relative;
}
* html .fpagemid{height:190px}
.klik,.klik a{
	position:absolute;
	left:292px;
	top:93px;
	width:115px;
	height:66px;
	text-indent:-999em;
	z-index:3;
}
.klik a{left:0;top:0;}
/* keep text away fom klik her graphic*/
.klikside{
	width:260px;
	font-size:17px;
	color:#000;
	padding:71px 0 0;
}
.klikside p{margin:0 0 4px;line-height:1.15}
.klikside strong{
	font-weight:bold;
	color:#900;
}
.fpagemid ul{
	width:420px;
	margin:11px 0 10px;
}
.fpagemid li{
	padding:0 0 0 20px;
	background:url(/grafik/side9/hydrogen/images/arrow1.png) no-repeat 0 3px;
	font-size:17px;
	color:#320033;
	margin:0 0 4px;
	font-weight:bold;
	line-height:1.2;
	white-space:nowrap;
}
.fpagemid li a{color:#320033}
.find-piger{
	width:403px;
	height:175px;
	margin:12px 0 1px -5px;
	position:relative;
}
.gratis{
	float:right;
	width:261px;
	height:459px;
	z-index:99;
	position:relative;
	margin:4px 0 0;
}
/* slideshow box on frontpage */
.s9slide {
	clear:both;
	width:940px;
	float:left;
	height:270px;
	background:url(/grafik/side9/hydrogen/images/frontpage_bluebox_bg.png);
	margin:-25px 0 0 8px;
	position:relative;
	z-index:2;
}
.s9slide-inner {
	width:901px;
	padding:32px 15px 0 24px;
	position:relative;
	overflow:hidden;
	height:224px;
}
* html .s9slide-inner {
	width:940px;
	w\idth:901px;
} 
.s9slide li {
	float:left;
	width:142px;
	height:224px;
	margin:0 8px 0 0;
	display:inline;
	background:#fff url(/grafik/side9/hydrogen/images/slshowbg.gif) repeat-x 0 0;
}
.s9slide a {
	display:block;
	width:133px;
	height:200px;
	text-decoration:none;
}
.s9slide img {
	margin:4px 0 0 4px;
}
.s9slide a span {
	display:block;
	color:#000;
	font-size:11px;
	padding:3px 0 0 7px;
	font-weight:bold;
}

/* free gallery page */
/* sub header row including rating stars */

.s9subhead{
	width:911px;
	background:url(/grafik/side9/hydrogen/images/dotted-line.gif) no-repeat 50% 100%;
	margin:0 0 13px 13px;
	overflow:hidden;
}
.s9subhead h2{
	float:left;
	width:600px;
	margin:0;
	line-height:1.1;
	padding:0 0 3px;
	font-size:29px;
	color:#900;
}
.s9subhead h2 span{
	color:#999;
	font-size:15px;
	position:relative;
	top:-1px;
}
.s9subhead h2 b{
	color:#666;	
	font-size:15px;
	position:relative;
	top:-1px;
}
.s9subhead ul.rating{
	float:left;
	margin:11px 0 0 3px;
}
.s9subhead h2 span.rating2{
	margin:11px 0 0 10px;
}
p.s9sshow{
	float:left;
	margin:12px 5px 0 25px;
}
p.s9sshow a{
	float:left;
	background:url(/grafik/side9/hydrogen/images/play-button_hover.gif) no-repeat 0 0;
	color:#690;
	font-size:15px;
}
p.s9sshow a:hover{color:#000;text-decoration:none;}
p.s9sshow a img{float:left;margin:0 3px 0 0}
p.s9sshow a:hover img{visibility:hidden;float:left}
p.s9sshow a span{	color:#690;cursor:pointer;position:relative;top:-3px;}
p.s9sshow a:hover span{color:#000}
/* favourite button */
p.s9fav{
	float:left;
	margin:13px 0 0 20px;
	background:url(/grafik/side9/hydrogen/images/addtofavourites_hover.gif) no-repeat 0 0;
	color:#999;
	font-size:15px;
}
p.s9fav img{float:left;margin:0 3px 0 0}
p.s9fav:hover img{visibility:hidden;}
p.s9fav:hover{color:#000}
p.s9fav span{cursor:pointer;position:relative;top:-4px;}
/* Favourite button on state */
p.favon{background:none;}
p.favon span {color:#b65ae3}
p.favon img{visibility:visible;position:relative;top:-2px;}
p.favon:hover img{visibility:visible;}
p.favon a,p.favon a:visited{color:#999}
p.favon a:hover{color:#000;text-decoration:underline}





p.bedom{
	float:left;
	margin:9px 0 0 17px;
	color:#999;
	font-size:15px;
}

/* right section on gallery page */
.fgright{
	width:427px;
	float:right;
	margin:0 18px 0 0;
	display:inline;
}
.fgright .fpagemid{
	float:none;
	background-position:-8px 0;
}
.fgright .klikside{padding:63px 0 0}
.fgright.klikside p{margin:0 0 4px;line-height:1.1}
.fgright .fpagemid ul{margin:10px 0 17px;}
.fgright .fpagemid li{margin:0 0 3px;}
ul.large-buttons{
	width:427px;
	clear:both;
	margin:30px 0 10px;
	overflow:hidden
}
ul.large-buttons li,
ul.large-buttons li a,
ul.large-buttons li em{
	width:427px;
	height:79px;
	overflow:hidden;
	cursor:pointer;
	position:relative;
}
ul.large-buttons li{margin:5px 0 0}

ul.large-buttons li a,
ul.large-buttons li em{
	position:absolute;
	left:0;
	top:0;
}
ul.large-buttons li.lb1 em{
	background:url(/grafik/side9/hydrogen/images/button427x158-1.jpg) no-repeat 0 0;
}
ul.large-buttons li.lb2 em{
	background:url(/grafik/side9/hydrogen/images/button427x158-2.jpg) no-repeat 0 0;
}
ul.large-buttons li.lb3 em{
	background:url(/grafik/side9/hydrogen/images/button427x158-3.jpg) no-repeat 0 0;
}
ul.large-buttons li a:hover{visibility:visible}
ul.large-buttons li a:hover em{background-position:0 -79px!important;}

/* left section on free gallery page */
.fgleft {
	width:452px;
	float:left;
	margin:0 0 0 10px;
	display:inline;
}
.fgleft a,.fgleft span {
	border:1px solid #ccc;
	width:83px;
	overflow:hidden;
	float:left;
}
.fgleft a img{margin:0 0 -2px -1px}
.fgleft a:hover {border:1px solid #000;}
p.mainleftpic {
	width:357px;
	float:left;
	margin:0;
	padding:0 0 7px;
	position:relative;
}
p.mainleftpic a,p.mainleftpic span {
	float:left;
	width:355px;
}
p.mainleftpic b.rating2,p.mainleftpic b.rating2 a{
	position:absolute;
	left:8px;
	top:8px;
	clear:both;
}
p.mainleftpic b.rating2 a{left:0;top:0}
p.mainleftpic b.hot,p.mainleftpic b.hot a{
	position:absolute;
	right:8px;
	top:8px;
	clear:both;
	background:url(/grafik/side9/hydrogen/images/hot-badge.png) no-repeat  0 0;
	width:48px;
	height:48px;
}
p.mainleftpic b.hot a{right:0;top:0;}

ul.smallpics {
	float:right;
	width:85px;
	margin:-8px 0 0;
}
ul.smallpics li {
	margin:8px 0 0;
	width:85px;
	float:right;
}

/* 10 horizontal pictures in a round blue box */
.tenpics{
	width:932px;
	height:163px;
	margin:11px 0 10px 11px;
	clear:both;
	background:url(/grafik/side9/hydrogen/images/bluebox932x163.png) no-repeat 0 0;
}
.single-gallery .tenpics{	
	background:url(/grafik/side9/hydrogen/images/boxbg_gray_widebox.png) no-repeat 0 0;
}
.tenpics ul{
	width:923px;
	margin:0 0 0 9px;
	float:left;
	display:inline;
}
.tenpics ul li{
	width:85px;
	height:128px;
	float:left;
	margin:0 7px 0 0;
	display:inline;
}
.tenpics ul li a,
.tenpics ul li a span{
	display:block;
	overflow:hidden;
	border:1px solid #ccc;
	width:83px;
}
.tenpics ul li img{margin:0 0 -2px -1px}
.tenpics ul li a:hover{border:1px solid #000;}
.tenpics h3{
	color:#fff;
	font-size:15px;
	margin:0 0 3px;
	padding:4px 0 0 15px;
	position:relative;
}
.tenpics h3 a{
	position:absolute;
	right:16px;
	top:5px;
}
.tenpics h3 a,.tenpics h3 a:visited{
	color:#900;
}
.tenpics h3 a:hover{
	color:#000;
	text-decoration:underline;
}

/* ......... CSS for single gallery page ...........*/

.single-gallery .fgleft {
	width:918px;
	float:none;
	display:block;
	overflow:hidden;
	clear:both;
	position:relative;
}
.single-g{
	float:left;
	width:552px;
	margin:-8px 0 0;
	/*position:relative;*/
}
.single-g ul.smallpics{
	float:left;
	width:552px;
	clear:both;
	margin:8px 0 0;
}
.single-g ul.smallpics li{
	margin:0 0 0 7px;
	width:85px;
	float:left;
	display:inline;
}
.single-gallery p.mainleftpic{
	margin:0 2px 0 0;
	padding:0 0 7px;
	display:inline;
}

/* add absolute overlay to make free gallary page*/
.free-overlay{
	position:absolute;
	bottom:5px;
	right:7px;
	width:545px;
	height:402px;
	clear:both;
}
.free-overlay div{
	width:545px;
	height:402px;
	background:url(/grafik/side9/hydrogen/images/free_overlay.png) no-repeat 0 0;
}
.free-overlay a{
	text-decoration:none;
	border:none;
	width:545px;
	height:402px;
	display:block;
}

/* .........gallery overview page css........ */
#s9overview{
	width:629px;
	float:left;
	margin:0 0 0 8px;
	display:inline;
}
#s9sidebar{
	float:right;
	width:298px;
	margin:0 12px 0 0;
	display:inline;
}
h2.overviewhead{
	font-size:11px;
	color:#666;
	font-weight:normal;
	text-align:right;
	padding:10px 7px 0 0;
	margin:0;
}
h2.overviewhead span{
	color:#900;
	font-size:24px;
	float:left;
	font-weight:bold;
	margin:-10px 0 0;
}
/* rows of 4 pictures all the way down the page */
ul.s9gallery{
	clear:both;
	width:600px;
	margin:13px 0 0;
	overflow:hidden;
}
ul.s9gallery li{
	width:143px;
	height:244px;
	overflow:hidden;
	background:#edece8;
	margin:0 7px 9px 0;
	display:inline;
	float:left;
	color:#000;
	position:relative;
}
ul.s9gallery li a,
ul.s9gallery li span{
	display:block;
	color:#000;
	white-space:nowrap;
	font-size:11px;
}
ul.s9gallery li a:visited{color:#000}
ul.s9gallery li a:hover{color:#900;text-decoration:none;}
ul.s9gallery li a:hover span{color:#900;}
ul.s9gallery li span,
ul.s9gallery li span a{
	line-height:20px;
	height:20px;
	padding:0 2px 0 7px;
	overflow:hidden;
	border-bottom:1px solid #fff;	
	font-weight:bold;
}
ul.s9gallery li img{
	margin:4px 0 0 5px;
}
ul.s9gallery li a.s9make-favorit,
ul.s9gallery li a.s9favorit,
a.s9make-favorit em,
a.s9favorit em{
	width:143px;
	height:19px;
	overflow:hidden;
	display:block;
	cursor:pointer;
	position:relative;
}
a.s9make-favorit em,
a.s9favorit em{
	position:absolute;
	left:0;
	top:0;
}
a.s9make-favorit em{background:url(/grafik/side9/hydrogen/images/btn_favourite_make.gif) no-repeat 0 0;}
a.s9favorit em{background:url(/grafik/side9/hydrogen/images/btn_favourite.gif) no-repeat 0 0;}
a.s9make-favorit:hover em,
a.s9favorit:hover em{background-position:0 -29px!important}
/* place rating star on top of image */
ul.s9gallery li b{
	position:absolute;
	z-index:99;
	left:6px;
	top:6px;
}



/* place video image on top of image*/
ul.s9gallery li img.s9video{
	position:absolute;
	z-index:99;
	left:4px;
	bottom:41px;
}

.fgleft img.s9video2{
	position:absolute;
	z-index:99;
	left:4px;
	bottom:15px;
}
ul.smallpics li img.s9videoplay{
	position:absolute;
	z-index:99;
	top: 40px;
}



/* place hot image on top of image*/
ul.s9gallery li img.s9hot{
	position:absolute;
	z-index:99;
	right:6px;
	bottom:41px;
}

/* pagination under gallery */
ul.pagination{
	width:420px;
	margin:10px auto 1px;
	position:relative;
	text-align:center;
	font-size:23px;
	color:#000;
	font-weight:bold;
	padding:0 0 6px;
}
.s9base{margin-top:-1px;}
ul.pagination li{display:inline;margin:0 6px 0 5px}
ul.pagination a,
ul.pagination a:visited{
	color:#900;	
	text-decoration:underline;
}
ul.pagination a:hover{
	text-decoration:underline;
	color:#000;
}
ul.pagination li.s9prev,
ul.pagination li.s9next {
	font-weight:normal;
	position:absolute;
	top:0;
}
ul.pagination li.s9prev{
	left:-107px;
	text-align:left;
	padding:0;
}
ul.pagination li.s9next{
	right:-111px;
	text-align:right;
	padding:0;
}
ul.pagination li.s9prev a,
ul.pagination li.s9next a{text-decoration:none;}
ul.pagination li.s9prev a:hover,
ul.pagination li.s9next a:hover {text-decoration:none;}
ul.pagination li.s9prev a span,
ul.pagination li.s9next a span {text-decoration:underline;}
ul.pagination li.s9prev a:hover span ,
ul.pagination li.s9next a:hover span{text-decoration:underline;}