/*
-----------------------------------------------
pure-communication.be
Author:   Jim Faes
Version:  29/04/2008
----------------------------------------------- */


/*
------------------------------------------------

    CSS MENU :
    ----------
	GENERIC
	FLASH ANIM
	CONTENT LEFT
	CONTENT RIGHT

	
/* = GENERIC
------------------------------------------------ */

.front-thumb-container{
	width:157px;
	height:137px;
	position:relative;
	overflow:hidden;
}

.front-thumb{
	z-index:0;
	position:absolute;
	top:0px;
	left:0px;
}
.front-thumb-border{
	z-index:1;
	position:absolute;
	top:0px;
	left:0px;
}

.teaser-txt{
	height:81px;
	width:157px;
	overflow:hidden;
	line-height:13px;
}

.teaser-txt h2{
	margin-top:5px;
	margin-bottom:5px;
}

.teaser-txt .date{
	margin-bottom:5px;
}

a.meer{
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	color:#000000;
	text-decoration:none;
	font-size:12px;
}

a.meer:hover{
	text-decoration:underline;
}

/* = FLASH ANIM 
------------------------------------------------ */

div#anim-banner{
	width:667px;
	height:210px;
	margin:6px 0px 0px 23px;
	overflow:hidden;
	clear:both;
}

div#kader{
	width:690px;
	height:13px;
	background:url(../images/bg-kader.jpg) no-repeat top right;
}

div#content-container{
	background:url(../images/bg-content-container.gif) no-repeat bottom left;
	
}


/* = CONTENT LEFT
------------------------------------------------ */
div#content-left{
	float:left;
	width:425px;
	margin:8px 0px 0px 15px;
	display:inline;
}

/* ----- teaser news ----- */
div#teaser-news{
	float:left;
	width:204px;
	height:300px;
	background:url(../images/bg-teaser-news.png) no-repeat top left;
}

div#teaser-news .front-thumb-container{
	margin-left:20px;
	margin-top:40px;
}

div#teaser-news div.teaser-txt{
	margin-left:20px;
}

div#teaser-news a.meer{
	float:right;
	margin-right:27px;
}



/* ----- teaser fotos ----- */
div#teaser-fotos{
	float:right;
	width:202px;
	height:300px;
	background:url(../images/bg-teaser-fotos.png) no-repeat top left;
}

div#teaser-fotos .front-thumb-container{
	margin-left:20px;
	margin-top:40px;
}

div#teaser-fotos div.teaser-txt{
	margin-left:20px;
}

div#teaser-fotos a.meer{
	float:right;
	margin-right:27px;
	
}



/* ----- teaser shop ----- */
div#teaser-shop{
	float:left;
	clear:both;
	width:642px;
	height:137px;
	background:url(../images/bg-teaser-shop-large.gif) no-repeat top left;
	margin-top:10px;
	position:relative;	
}

.body-ingelogd div#teaser-shop {
	width:421px;
	background:url(../images/bg-teaser-shop.gif) no-repeat top left;
}





/* = CONTENT RIGHT
------------------------------------------------ */

div#content-right{
	float:right;
	width:222px;
	margin:8px 0px 0px 0px;
	padding-right:25px;
}

/* ----- teaser agenda ----- */
div#teaser-agenda{
	width:205px;
	height:300px;
	background:url(../images/bg-teaser-news.png) no-repeat top left;
	float:right;
	position:relative;
	/*behavior: url(iepngfix.htc);*/
}

.body-ingelogd div#teaser-agenda{
	width:205px;
	height:300px;
	background:url(../images/bg-teaser-news.png) no-repeat top left;
	float:right;
	position:relative;
	/*behavior: url(iepngfix.htc);*/
}

div#teaser-agenda ul#agenda-list{
	margin:55px 0px 0px 15px;
	padding:0px;
	list-style:none;
}

.body-ingelogd div#teaser-agenda ul#agenda-list{
	margin:47px 0px 0px 15px;
	
}

div#teaser-agenda ul#agenda-list li {
	clear:both;
	
}

div#teaser-agenda ul#agenda-list li div{
	display:inline;
	float:left;
}

div#teaser-agenda ul#agenda-list li .locatie{
	margin-left:10px;
	width:100px;	
	margin-bottom:4px;
	
}

div#teaser-agenda ul#agenda-list li .locatie a{
	color:#B14638;
	font-weight:bold;
	font-size:11px;
	text-decoration:none;
	display:block;
	line-height:12px;
	margin-top:-1px;
}

div#teaser-agenda ul#agenda-list li .locatie a:hover{
	text-decoration:underline;
}

div#teaser-agenda ul#agenda-list li .date{

	font-size:10px;
}

div#teaser-agenda a.meer{
	float:right;
	/*margin-right:20px;*/
	position:absolute;
	bottom:30px; 
	right:20px;
	
}

/* ----- teaser ringtones ----- */

div#teaser-ringtones{
	width:205px;
	height:210px;
	background:url(../images/bg-teaser-ringtones.png) no-repeat top left;
	margin-top:20px;
	float:right;
	display:inline;
	/*behavior: url(iepngfix.htc);*/
}

.body-ingelogd div#teaser-ringtones{
	width:205px;
	height:149px;
	background:url(../images/bg-teaser-ringtones-small.png) no-repeat top left;
	margin-top:9px;
	float:right;
	display:inline;
	/*behavior: url(iepngfix.htc);*/
	position:relative;
}

span#ringtone-prijzen{
	color:#982923;
	font-weight:bold;
	font-size:10px;
	display:block;
	margin:48px 0px 0px 67px;
}

div#teaser-ringtones ul#ringtones-list{
	margin:5px 0px 0px 20px;
	padding:0px;
	list-style:none;
}

div#teaser-ringtones ul#ringtones-list li{
	height:17px;
	width:161px;
	color:#000;
	font-weight:bold;
	
	behavior: url(iepngfix.htc);
	padding:5px 5px 0px 5px;
}

.body-ingelogd div#teaser-ringtones ul#ringtones-list li{
	margin-top:0px;
	margin-bottom:0px;
	padding-top:3px;
	padding-bottom:2px;
	height:13px;
}

div#teaser-ringtones ul#ringtones-list li.odd{
	background:no-repeat top left url(../images/bg-ringtonelist-odd.png);
}

div#teaser-ringtones ul#ringtones-list li.even{
	background:no-repeat top left url(../images/bg-ringtonelist-even.png);
}

div#teaser-ringtones ul#ringtones-list li span{
	float:left;
}

div#teaser-ringtones ul#ringtones-list li a{
	float:right;
	width:13px;
	height:13px;
	overflow:hidden;
	display:block;
	background-position:0px 0px;
	background-repeat:no-repeat;
	text-indent:-3000px;
}

div#teaser-ringtones ul#ringtones-list li a.ringtone-listen{
	background-image:url(../images/btn-ringtone-listen.gif);
	margin-left:5px;
}

div#teaser-ringtones ul#ringtones-list li a.ringtone-download{
	background-image:url(../images/btn-ringtone-download.gif);
	
}

div#teaser-ringtones a.meer{
	float:right;
	margin:3px 16px 0px 0px;
	
}

.body-ingelogd div#teaser-ringtones a.meer{	
	position:absolute;
	bottom:7px; 
	right:5px;	
}


/* ----- teaser fan ----- */

.body-ingelogd div#teaser-fan{
	width:205px;
	height:138px;
	background:url(../images/bg-teaser-fan.png) no-repeat top left;
	margin-top:9px;
	float:right;
	display:inline;
	/*behavior: url(iepngfix.htc);*/
	position:relative;
}

.fan-name{
	width:205px;
	position:absolute;
	text-align:center;
	left:0px;
	bottom:25px;	
}

.fan-name a{
	color:#FFFFFF;
	font-weight:bold;
}

.fan-name a:hover{
	color:#B14638;
}


.fan-image{
	position:absolute;	
	text-align:center;
	right:24px;
	top:17px;	
}


/* = SHOP */
.button-shop{
	display:block;
	width:52px;
	height:36px;	
	overflow:hidden;
	text-indent:-3000px;
	background:no-repeat top left url(../images/button-shop.gif);
	
	border:0px solid white;
	
	position:absolute;
	top:50px;
	left:20px;
}
.button-shop:hover{
	background-position:0px -36px;
}

.product-items-front{
	margin-top:20px;
	margin-left:110px;
}

.body-ingelogd .product-items-front {	
	margin-left:100px;
}



.product-item-front {
	float:left;
	margin-right:25px;
	position:relative;	
}

.body-ingelogd .product-item-front {	
	margin-right:15px;
}

.product-item-title-front{
	color:#B14638;
	font-weight:bold;
	margin-bottom:2px;
}

.product-item-image-front{
	width:80px;
	height:80px;
	overflow:hidden;
}

.product-item-price-front{
	width:41px;
	height:39px;
	color:#FFF;	
	font-size:10px;
	background:no-repeat top left url(../images/bg-prijs-front.gif);
	text-align:center;
	position:absolute;
	top:60px;
	left:45px;	
}