/*		Radio Portal CSS Document
		Copyright TROS 2008
		Base by: Martijn Hoenderop 		*/


/* Body: background */
html, body {
	height:100%;
	margin: 0;
	padding: 0;
	background: url(/img/bodyBackground.gif) top center repeat-y #f3f3f3;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

form {
	padding: 0px;
	margin: 0px;
}

#topmenu {
	background-color: #deecf8;
	width			: 100%;
	text-align		: center;
}
#topmenu #trosbar {
	margin	: 0px auto;
}

/* TROS */
/* Wrapper: determining width & background */
#wrapper {
	position: absolute;
	margin: 0 0 0 -485px;
	left: 50%;
	width: 972px;
	background: #ababab;
	height: auto;
}

/* Top: metaMenu, header, mainMenu */
#pageTop {
	position: relative;
}
#metaMenu {
	width: 100%;
	height: 50px;
	background: url(/img/metaMenuBackground.png) top left repeat-x #d5d5d5;
	-background: url(/img/metaMenuBackground.png) top left repeat-x;
}
#metaMenu a, .universalLink  {
	color:	 #1167B4;
}
.msg {
    float               : right;
    background-color    : #FFF;
    margin-top          : 50px;
    margin-right        : 100px;
    padding-left        : 8px;
    padding-right       : 8px;
    line-height         : 50px;
    font-family         : Verdana, Arial, Helvetica, sans-serif;
    font-size           : 10px;
}
#breadCrumbs {
	float: left;
	margin: 0 0 0 10px;
	width: 450px;
}
#breadCrumbs p {
	line-height: 50px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000;
	margin: 0;
	padding: 0;
}
#breadCrumbs p span {
	color: #9c9c9c;
}
#breadCrumbs p a {
	color: #1167b4;
	text-decoration: none;
}
#breadCrumbs p a:hover {
	color: #1176d0;
	text-decoration: underline;
}
#formErrors {
	line-height: 20px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color    : #000;
	margin   : 0;
	margin-top: 15px;
	padding  : 0;
	float    : right;
    overflow :hidden;
	width    : 230px;
	height   : 150px;
	background-color: #fafafa;
	border       : 1px solid #e4e4e4;
	margin-top   : 25px;

	padding-left : 8px;

}
#login {
	line-height: 20px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000;
	margin: 0;
	margin-top: 15px;
	padding: 0;
	float : right; 
    /*overflow : hidden;*/
 	width: 280px;
	height: 34px;
	background: url(/img/loginBackground.png) no-repeat;
	-background: url(/img/loginBackground.gif) no-repeat;
}
* html #login {
	line-height: 10px;
	height: 20px;
	border:1px solid red;
}
#logoutBlock {
	line-height: 20px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000;
	margin: 0;
	margin-top: 15px;
	padding: 0;
	float : right;
}

#loginForm {
    display: none;
}

#registerForm, #forgetForm{
    display   : none;
}

#loginform, #registerform {
	padding: 0px;
	margin: 0px;
}

#loginForm #loginFormLabel, #registerForm #loginFormLabel, #forgetForm #loginFormLabel {
   font-size  : 150%;
   line-height: 20px;
   margin-top : 0px;
   margin-left: 5px;
   display    : inline;
   width      : 100px;
}

#loginForm #loginFormFields, #registerForm #loginFormFields, #forgetForm #loginFormFields {
   margin-left : 15px;
   margin-top  : 10px;
   font-size   : 120%;
   line-height: 20px;
}

#loginForm #loginFormFields h3, #registerForm #loginFormFields h3,, #forgetForm #loginFormFields h3 {
   font-size   : 120%;
   margin	   : 0px;
   margin-bottom: 15px;
   padding	   : 0px;
}

#loginForm .registerButton, #registerForm .loginButton, #forgetForm .loginButton, #forgetForm .registerButton {
   font-size   : 140%;
   line-height: 20px;
   display     : inline;
   width       : 250px;
}
#login #loginLabel{
	font-style  : italic;
	font-size   : 95%;
	line-height: 20px;
	margin-left : 100px;
	padding-left: 12px;
	margin-top  : 5px;
	width       : 103px;
	height      : 34px;
	cursor      : pointer;
}
.formSubmit {
	padding-left      : 5px;
	padding-right     : 5px;
	padding-top       : 2px;
	padding-bottom    : 2px;
	background-color  : #e4e4e4;
	border            : 1px solid #a4a4a4;
	cursor            : pointer;
	width             : auto;
	text-align        : center;
	width             : 120px;
	font-size         : 120%;
	line-height		  : 20px;
	float             : right;
	margin-top        : 28px;
	margin-right      : 25px;
}

#loginForm .formSubmit {
	margin-top        : 14px;
}

.error {
	color   : #ff0000;
}
form#login input#name {
	float: left;
	width: 50px;
	border: none;
	outline: none;
	margin: 0 5px 0 0;
}
form#login input#name {
	float: left;
	width: 50px;
	border: none;
	outline: none;
	margin: 0 5px 0 0;
}
#header {
	width : 100%;
	height : 250px;
	background : url(/img/headerImage_home.jpg) no-repeat;
	background-position : bottom;
	-background-postion : 0px 34px;
	-background-attachment : fixed;
	-position : relative;
}
#searchbox {
   position: relative;
   left    : 10px;
   top     : 6px;
   width   : 220px;
   float   : left;
   width	: 312px;
}
#searchbox #sfield {
   border:	#bbbbbb 1px solid;
   padding: 1px 2px;
   width: 243px;
}
#searchbox #sbutton {
	margin:1px 0 0 3px;
}
#mainMenu {
	margin: 0;
	padding: 0 0px;
	height: 35px;
	background: url(/img/mainMenuBackground.png);
}

#menuLinks ul {
	line-height: 35px;
	list-style: none;
	margin: 0;
	padding: 0;
}
#menuLinks ul li {
	display: inline;
	background: url(/img/MainMenuLine.jpg) no-repeat;
	background-position: right;
	margin-left: 10px;
	padding: 0;
	height: 35px;
}
#menuLinks ul li.last {
	background-image: none;
}

#menuLinks ul li a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #4e4e4e;
	text-decoration: none;
	margin: 0;
	padding: 20px 10px 10px 2px;
}
#menuLinks ul li a:hover {
	color: #000;
}
#pageEdit {
	width: 100%;	
	background: url(/img/editPageBottom.gif) bottom left repeat-x #434343;
	padding: 0px;
	margin: 0px;
}

.pageEditContent {
	padding: 5px 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: white;

}

.pageEditSources {
	margin-top: 10px;
	clear    :both;
	padding-bottom: 20px;
	border-bottom: 1px solid #ccc;
}

.pageEditContent label{
	padding: 5px 0px 10pt 36px;
}

.pageEditBronnen {
	background-repeat	: repeat-x;
	padding-top			: 15px;
	margin-bottom		: 0px;
	clear    			: both;
	height				: 85px;
}

.pageEditBronnen a{
	margin-left: 25px;
	float: left;
}

.pageEditBronnen .first{
	margin-left: 0px;
}

.pageEditBronnen .audio {
	background: url(/img/icons/audio_normal.gif) no-repeat;
	height: 70px;
	width: 70px;
}

.pageEditBronnen .audio:hover {
	background: url(/img/icons/audio_hover.gif) no-repeat;
}

.pageEditBronnen .book {
	background: url(/img/icons/book_normal.gif) no-repeat;
	height: 70px;
	width: 70px;
}

.pageEditBronnen .book:hover {
	background: url(/img/icons/book_hover.gif) no-repeat;
}

.pageEditBronnen .photos {
	background: url(/img/icons/photos_normal.gif) no-repeat;
	height: 70px;
	width: 70px;
}

.pageEditBronnen .photos:hover {
	background: url(/img/icons/photos_hover.gif) no-repeat;
}

.pageEditBronnen .items {
	background: url(/img/icons/items_normal.gif) no-repeat;
	height: 70px;
	width: 70px;
}

.pageEditBronnen .items:hover {
	background: url(/img/icons/items_hover.gif) no-repeat;
}

.pageEditBronnen .broadcast {
	background: url(/img/icons/broadcast_normal.gif) no-repeat;
	height: 70px;
	width: 70px;
}

.pageEditBronnen .broadcast:hover {
	background: url(/img/icons/broadcast_hover.gif) no-repeat;
}

.pageEditBronnen .video {
	background: url(/img/icons/video_normal.gif) no-repeat;
	height: 70px;
	width: 70px;
}

.pageEditBronnen .video:hover {
	background: url(/img/icons/video_hover.gif) no-repeat;
}
/* Content: left, center & right column */
#container {
	padding: 5px 0px 0px;
	/*background: url(../img/tros_ster.gif) bottom right no-repeat #afafaf;*/
	background: url(/img/containerBackground.png) bottom right no-repeat #afafaf;
	clear: both;
	zoom : 1;
}
.column {
	width: 310px;
	margin: 10px 0 0 0;
}
#left {
	float: left;
}
#middle {
	float: left;
	margin-left: 10px;
}
#right {
	float: right;
}
.clear {
	clear: both;
}
/* Footer: siteMap & credits */
#footer {
/*	height: 182px; */
	zoom: 1;
	background: url(/img/footerBackground.png) no-repeat #4d4d4d;
}
#siteMap {
	float: left;
	padding: 20px 0px;
}
#siteMap .mapBlock {
	float: left;
	height: auto;
	width: 150px;
	margin: 0 0 0 10px;
}
#siteMap .mapBlock h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #fff;
	margin: 0;
	padding: 0;
}
#siteMap .mapBlock ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#siteMap .mapBlock ul li {
	margin: 0;
	padding: 0;
}
#siteMap .mapBlock ul li a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #fff;
	text-decoration: none;
	margin: 0;
	padding: 0;
}
#siteMap .mapBlock ul li a:hover {
	text-decoration: underline;
	margin: 0;
	padding: 0;
}
#credits {
	height: 38px;
	width: auto;
	clear: both;
	float: left;
	margin: 10px 0 0 10px;
}
#credits p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #fff;
	line-height: 38px;
	margin: 0 0 0 45px;
	padding: 0;
	width: 500px;
}
#credits p a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #fff;
	text-decoration: none;
	margin: 0;
	padding: 0;
}
#credits p a:hover {
	text-decoration: underline;
	margin: 0;
	padding: 0;
}
#content {
	float: left;
	width: 635px;
	border: #cfcfcf 1px solid;
	border-width: 0px 1px 0px 0px;
	padding: 10px;
	background-color: #ffffff;
	font-family: verdana;
	font-size: 12px;
}
#detailBorder {
    float : left;
    margin-left:2px;
}
#detailBorder .detailHeader h2 {
	margin-bottom: 3px;
	margin-top: 3px;
}
#detailBorder .detailHeader {
	background-color: #CFCFCF;
	padding-bottom: 4px;
	padding-left: 4px;
	border-top: 1px solid #9F9F9F;
}

#content .reaction {
	background: #f6f6f6;
	border: #d1d1d1 1px solid;
	padding: 10px;
	margin: 0px 10px 10px 0px;
}

#content .reactblock {
	width:	400px;
}

#content .inputfield {
	width:	200px;
	height:	25px;
	border: #d1d1d1 1px solid;
}

#content .reactblock .inputfield {
	width:	170px;
	height:	20px;
	border: #d1d1d1 1px solid;
	margin-bottom: 5px;
}

#content .inputfield {
	width:	200px;
	height:	25px;
	border: #d1d1d1 1px solid;
}

#content .textarea {
	width:	400px;
	height:	140px;
	border: #d1d1d1 1px solid;
}

#content h1 {
	font-size: 24px;
	font-family: verdana;
	font-weight: normal;
	margin-bottom: 0px;
}

#content h2 {
	font-size: 18px;
	font-family: verdana;
	font-weight: normal;
}

#content hr {
	margin: 0px 10px 0px 0px;
	height: 2px;
}

#content .Smalltext {
	font-family: verdana;
	font-size: 10px;
}

#content a  {
	text-decoration: none;
	color: #1167b4;
}

#content #relatedBlock {
	padding-bottom: 20px;
}

#content .relatedPost {
	background-image: url("/GFX/dot.gif");
	background-repeat: no-repeat;
	background-position: center left;
	padding-left: 8px;
	line-height: 25px;
}

.dragSrc .gallery {
    background-color: #434343;
}
.ajaxLoader{
	margin-left:50px;
	background-image: url(/GFX/ajax-loader.gif);
	background-repeat: no-repeat;
	height:19px;
}

.searchresult {
	padding: 0px 10px 10px 10px;
	border: #eeeeee 1px solid;
	border-width: 0px 1px 1px 1px;
}

.alignleft {
	margin-right: 5px;
	margin-bottom: 5px;
}
.alignright {
	margin-left: 5px;
	margin-bottom: 5px;
}

.playerwrap {
	margin-top:10px;
	width: 100%;
	background-color: #e1e1e1;
	border: 1px solid #CCCCCC;
	text-align	: center;
	padding-top: 8px;
	padding-bottom: 8px;
}

#toggleUitleg {
	margin-right: 5px;
}

#content .detailTitle {
    margin-top  : 0px;
    color       : #444;
}
#content .detailTitle h2 {
    font-size   : 200%;
    margin-top  : 0px;
}

.singleImage {
	margin: 0px 10px 0px 0px;
	float: left;
}

.singleContainer {
	margin: 0px;
	zoom: 1;
}

.singleContent p {
	margin: 0px 0px 10px 0px;
	padding: 0px;
}

.navigation {
	margin: 0px;
	padding: 5px;
	height: 18px;
	background: #f8f8f8;
	border: #f0f0f0 1px solid;
}

.navigation .alignleft {
	float: left;
}

.navigation .alignright {
	float: right;
}

.archive_post {
	clear: left;
	margin: 0px 0px 10px 0px;
}

.archive_post h2 {
	margin-top: 0px;
	padding-top: 0px;
}

.archive_post .thumbnail {
	float: left;
	margin: 0px 10px 10px 0px;
}

#content .archive_post hr.ruler {
	height: 1px;
	color: #eeeeee;
	background: #eeeeee;
	border: #000000 0px solid;
	margin: 0px 0px 10px 0px;
}