/* CSS Document www.country-style.nl CSS: Paul van Gestel E-mail: paul@digital-minds.nl Url: www.digital-minds.nl */ @charset "utf-8"; /* CSS Document */ /* RESET---------------------------------------------------------------------------------------------------------------------------------------------------------------*/ * {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline;background: transparent;} ol, ul {list-style: none; padding:0;} blockquote, q {quotes: none;} blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;} /* remember to define focus styles! */ :focus {outline: 0;} /* remember to highlight inserts somehow! */ ins {text-decoration: none;} del {text-decoration: line-through;} /* tables still need 'cellspacing="0"' in the markup */ table {border-collapse: collapse;border-spacing: 0;} img {behavior: url(css/iepngfix.htc);} /*--------------------------------------------------------------------------------------------------------------------------------------------------*/ html { overflow-x:hidden; overflow-y:scroll;} html,body {height: 100%; } body {background-image:url(../images/background.jpg); background-position:center top; margin:0; padding:0; font-family:Trebuchet MS; color: #000; font-size: 13px; font-weight:normal; line-height:19px; } a {color:#000; text-decoration:underline;} a:hover {text-decoration: none; } .nofloat {clear: both;} /* FRAMEWORK------------------------------------------------------------------------------------------------------------------------------------------------------------*/ html, body, #wrap {height: 100%; } body > #wrap { height: auto; min-height: 100%;} #wrap { width:977px; background-image:url(../images/background2.jpg); background-position: center top; margin:0 auto 0;} #main { padding-bottom: 138px; background-image:url(../images/bg_images.jpg); background-position:0px 0px; background-repeat:no-repeat;} /* must be same height as the footer */ .clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} .clearfix {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix { height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ /* header---------------------------------------------------------------------*/ #header { position:relative } #header #nav {width: 580px; float: left; overflow: hidden; } #header #nav ul {width: 580px; height:28px; display: inline; float:left; margin-top: 10px; margin-left:39px; } #header #nav ul li {float:left;} #header #nav ul li.devider {width:26px; background:url(../images/btn/nav.jpg) -67px 84px; height:28px;} #header #nav ul li a {text-indent:-9999px; display:block; height:28px;} #header #nav ul li.home a{ width:67px; background:url(../images/btn/nav.jpg);} #header #nav ul li.home a:hover{ background:url(../images/btn/nav.jpg) 0px 56px;} #header #nav ul li.home a.active{ background:url(../images/btn/nav.jpg) 0px 28px;} #header #nav ul li.uitzending a{ width:119px; background:url(../images/btn/nav.jpg) -95px 0px;} #header #nav ul li.uitzending a:hover{ background:url(../images/btn/nav.jpg) -95px 56px;} #header #nav ul li.uitzending a.active{ background:url(../images/btn/nav.jpg) -95px 28px;} #header #nav ul li.links a{ width:74px; background:url(../images/btn/nav.jpg) -239px 0px;} #header #nav ul li.links a:hover{ background:url(../images/btn/nav.jpg) -239px 56px;} #header #nav ul li.links a.active{ background:url(../images/btn/nav.jpg) -239px 28px;} #header #nav ul li.contact a{ width:96px; background:url(../images/btn/nav.jpg) -346px 0px;} #header #nav ul li.contact a:hover{ background:url(../images/btn/nav.jpg) -346px 56px;} #header #nav ul li.contact a.active{ background:url(../images/btn/nav.jpg) -346px 28px;} #header #nav ul li.nl a{ width:48px; background:url(../images/btn/nav.jpg) -465px 0px;} #header #nav ul li.nl a:hover{ background:url(../images/btn/nav.jpg) -465px 56px;} #header #nav ul li.nl a.active{ background:url(../images/btn/nav.jpg) -465px 28px;} #header #nav ul li.en a{ width:35px; background:url(../images/btn/nav.jpg) -515px 0px;} #header #nav ul li.en a:hover{ background:url(../images/btn/nav.jpg) -515px 56px;} #header #nav ul li.en a.active{ background:url(../images/btn/nav.jpg) -515px 28px;} #comingsoon {background: url(../images/comingsoon.png); behavior:url(css/iepngfix.htc); width: 43px; height: 46px; visibility: hidden; position:absolute; top:45px; left: 557px; _left:-27px; } #header #photos {width: 355px; height: 255px; cursor: pointer; margin-left: 604px; overflow:hidden; } #header #photos #photo {width: 355px; height: 255px; background:url(../images/photos.png); behavior:url(css/iepngfix.htc); } #meerfotos {background: url(../images/meerfotos.png); behavior:url(css/iepngfix.htc); position:absolute; visibility: hidden; top:160px; left: 504px; width: 95px; height: 79px; _left:-72px;} /* content---------------------------------------------------------------------*/ #content #wrapper {width: 847px; margin-left: 66px; } #content #intro {width:485px; clear:both; font-size:16px; font-style:italic; padding-top: 38px; float:left; line-height:18px; margin-bottom: 35px; } #content #right {float:right; width:280px; background:none; padding:0; } #content #right span, #radiostations span {clear:both; width: 277px; height:60px; background:url(../images/devider.png) 0px 2px no-repeat; behavior:url(css/iepngfix.htc); padding: 0 0 0 0; display:block; } #content #right h2 {font-size:16px; color: #782e20; text-transform:uppercase; font-weight:normal; padding-bottom: 18px; margin:0;} #content #right #previousepisode {width: 277px; height: 166px; float:right; overflow:hidden; } #content #right #previousepisode #radio {float:left; background:url(../images/btn/radio.png) left top no-repeat; width:126px; height: 101px; behavior:url(css/iepngfix.htc); cursor: pointer;} #content #right #previousepisode p {float:right; display:block; width: 125px; font-size:15px; font-style:italic; line-height:18px; text-align: right; padding: 37px 21px 0 0; margin: 0; } #content #right #previousepisode p a {font-size: 13px; display:block; padding-top: 9px; font-weight:bold; color:#831700; text-decoration:none;} #content #right #previousepisode p a:hover {text-decoration: underline;} #content #right #oftheweek{width: 277px; height: 177px; float:right; overflow:hidden; } #content #right #oftheweek img {float:left; margin-right: 15px; border: 1px solid #eedabd;} #content #right #oftheweek p {float: left; width: 151px; height: 72px; margin:0px; overflow:hidden;} #content #right #oftheweek p.lineheight {line-height:10x;} #content #right #oftheweek a {height: 20px; font-size: 13px; display:block; font-style: italic; float: right; margin-top: 5px; margin-right:21px; font-weight:bold; color:#831700; text-decoration:none;} #content #right #oftheweek a:hover {text-decoration: underline;} #content #right #reactions h2 {float: left; } #content #right #reactions a {height: 20px; font-size: 13px; display:block; font-style: italic; float: right; margin-top: 0px; margin-right:21px; _margin-right:10px; font-weight:bold; color:#831700; text-decoration:none;} #content #right #reactions a:hover {text-decoration: underline;} #content #right #reactions .reaction {} #content #right #reactions .reaction span {background:url(../images/mic.png) no-repeat; width:20px; height:28px; float:left; } #content #right #reactions .reaction h4 {float:left; color:#700000; padding: 3px 0 0 8px; margin:0px; } #content #right #reactions .reaction h5 {clear: both; font-size: 11px; font-weight: normal; color:#700000; } #content #right #reactions p {font-style: italic; font-size:13px; line-height: 18px; margin-top: 13px; margin-bottom: 18px; } #content #right #reactions p.devider {background:url(../images/deviderreaction.gif) 0 0 no-repeat; height:13px; margin:0px;} #right #reactions .capt {height:60px; width: 250px; margin-left:3px;} #right #reactions input {background: url(../images/reactionfield1.png) -10px 0px; behavior: url(css/iepngfix.htc); border: none; height: 20px; width: 262px; padding: 8px 10px 0 10px; _padding-left: 20px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:12px; line-height: 14px; color:#3d3222; cursor:text;} #right .textarea {background: url(../images/reactionarea.png) -10px 0px; behavior: url(css/iepngfix.htc); width: 262px; height:66px; overflow: auto; padding-top: 4px; padding-right: 0px; overflow:hidden; } #right textarea {background: none; border: none; width:242px; height: 48px; padding: 4px 2px 0px 10px; cursor:text; _padding-left: 20px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:12px; line-height: 14px; color:#3d3222; } textarea {filter:chroma(color=#FFFFFF); scrollbar-face-color:#FFFFFF; scrollbar-shadow-color:#FFFFFF; scrollbar-highlight-color:#FFFFFF; scrollbar-3dlight-color:#FFFFFF;scrollbar-darkshadow-color:#FFFFFF; scrollbar-track-color:#FFFFFF; scrollbar-arrow-color:#3d3222; } #right #reactions input.code {margin-bottom: 10px;} #right #content #messages{width: 280px; float:right; overflow:hidden;} #right #messages p {float: left; padding: 11px 0 16px 9px; line-height:16px; margin:0;} #right #content #messages span { background:url(../images/devider.png) 0px 0px no-repeat; height: 37px; } #right #messages ul {margin:0; padding:0;} #right #messages li {line-height: 23px;} #right #messages li a { text-decoration:none; font-weight: bold; color:#780700; font-style:italic;} #right #messages li a:hover {text-decoration:underline;} #right #messages li a.active {background-color:#831300; color:#d9bd8d; padding-left: 2px; padding-right: 2px; text-decoration:none;} #right p.error {background:#831300; color:#d9bd8d; width: 245px; display: block; padding: 3px 3px 3px 3px;} #content #messages ul#pageid {height:20px; margin: 10px 0 10px 0; text-align:center; } #content #messages ul#pageid li { text-align:center; display:inline;} #content #messages ul#pageid li a { text-decoration: none; padding: 0 5px 0 5px; background: url(../images/pageid.gif) no-repeat; color:#d5af81; font-size:10px; font-weight:bold; font-style:normal; } #content #messages ul#pageid li.active { background: none; color:#8c281e; padding: 0 5px 0 5px; font-size:11px; font-weight:bold; } #content #radiostations{width: 280px; height:269px; float:right; overflow:hidden;} #radiostations p {float: left; padding: 11px 0 16px 9px; line-height:16px; margin:0;} #content #radiostations span { background:url(../images/devider.png) 0px -8px no-repeat; } #radiostations a {text-indent:-9999px; display:block; height:87px; float:left;} #radiostations a.stadsradio {width:67px; background:url(../images/btn/stadsradio.png); behavior:url(css/iepngfix.htc); cursor: pointer;} #radiostations a.stadsradio:hover{width:67px; background:url(../images/btn/stadsradio_hover.png); behavior:url(css/iepngfix.htc); cursor: pointer;} #radiostations a.centraal {width:67px; background:url(../images/btn/centraalfm.png) no-repeat; behavior:url(css/iepngfix.htc); cursor: pointer;} #radiostations a.centraal:hover{width:67px; background:url(../images/btn/centraalfm_hover.png); behavior:url(css/iepngfix.htc); cursor: pointer;} #content #contactinfo{width: 280px; height:269px; float:right; overflow:hidden;} #contactinfo p {float: left; padding: -1px 0 16px 0; line-height:16px; margin:0;} #contactinfo a {color:#780700; font-style:italic;} #contactinfo a:hover {underline:none;} #content #main2 {float:left; width:495px; background:none; padding:0; } #content #main2 select {width: 166px; height: 24px; background-color:#FFF; border: 1px solid #abadb3; float: right; } #content #main2 #oftheweek {clear:both; width: 494px; } #content #main2 #oftheweek img {float:left; margin-right: 15px; border: 1px solid #eedabd;} #content #main2 #oftheweek p { margin:0px; line-height:17px; float:left; width: 480px;} #content #main2 #oftheweek p a {width: 68px; height: 21px; display: block; background:url(../images/btn/amazon.png); behavior: url(css/iepngfix.htc); text-indent: -9999px; margin-top: 20px; overflow:hidden; } #content #main2 span { background:url(../images/newsdevider.png) 0 28px no-repeat; display:block; height: 48px; _height: 0; clear:both; padding-top: 3px; _margin-top: 29px; behavior:url(css/iepngfix.htc);} #content #main2 #playlist {clear: both; font-size: 15px; line-height:18px;} #content #main2 #playlist p{ float:left; margin:0; padding:0; font-size: 16px;} #content #main2 #playlist p.album{color:#700000; padding:0; float: none; _padding-left: 34px;} #content #main2 #playlist span {width: 34px; background:none; float: left; margin:0; padding:0;} h1 {font-size: 22px; color:#831700; padding-bottom:20px; font-weight: normal; margin:0; float:left; } #content #main2 h2 {font-size: 17px; color:#831700; font-weight:bold; margin:0;} #content #main2 h3 {font-size: 12px; color:#831700; font-weight:normal; margin:0; margin-bottom: 10px; padding:0; } #content #main2 h4 {font-size: 16px; color:#831700; padding-bottom:20px; font-weight: normal; margin:0; text-transform: uppercase; } #content #main2 #news {clear: both;} #content #main2 #news .article { margin-top: 15px; } #content #main2 #news .article .img {background: url(../images/newsimg.png) no-repeat; behavior:url(css/iepngfix.htc); width:110px; height: 88px; margin: 0 14px 5px 0; float: left; } #content #main2 #news .article .img img {width:96px; height:75px; padding: 6px 0 0 7px; } #content #main2 #news .article a.lees {font-size: 13px; display:block; padding-top: 0px; margin-top:14px; font-weight:bold; color:#831700; float:right; text-decoration:none; font-style:italic; } #content #main2 #news .article a.lees:hover {text-decoration: underline; } #content #main2 #news .article span { background:url(../images/newsdevider.png) 0 3px no-repeat; display:block; height: 20px; clear:both; padding-top: 3px; behavior:url(css/iepngfix.htc);} #content #main2 #news a.meer {float:right; color:#780700; font-style:italic; text-decoration:none; padding: 2px 2px 2px 2px; font-size:14px} #content #main2 #news a.meer:hover {float:right; background:#831700; color:#D9BD8D; padding: 2px 2px 2px 2px; } #content #main2 #news ul#pageid {height:20px; width:483px; margin-top: 20px; text-align:center; } #content #main2 #news ul#pageid li { text-align:center; display:inline;} #content #main2 #news ul#pageid li a { text-decoration: none; padding: 0 5px 0 5px; background: url(../images/pageid.gif) no-repeat; color:#d5af81; font-size:14px; font-weight:bold; font-style:normal; } #content #main2 #news ul#pageid li.active { background: none; color:#8c281e; padding: 0 5px 0 5px; font-size:15px; font-weight:bold; } #content #main2 #links{clear: both;} #content #main2 #links ul li a {font-size: 17px; color:#780700; font-style:italic; text-decoration:none; line-height: 24px;} #content #main2 #links ul li a:hover {color:#000; } #contact {width:514px; float: left; } #content label {width: 93px; _width:80px; display:block; float:left; font-size:14px; font-weight:bold; font-style:italic; color: #780400; } #content input {width: 400px; height:25px; background:url(../images/input.png) 0px -8px no-repeat; behavior:url(css/iepngfix.htc); border: none; font-size:13px; padding: 5px 0 0 20px; color:#363636; cursor:text; } #content .required {float:left; margin:3px 0px 0 109px; width:300px; display:inline; font-size:10px; color: #000; } #content #contact a {font-size: 13px; display:block; padding-top: 0px; margin-top:14px; font-weight:bold; color:#831700; float:right; text-decoration:none; font-style:italic; padding-right: 20px; } #content #contact a:hover {text-decoration: underline; } div#content #contact .textarea {width: 404px; height: 102px; float:left; *float:none; background:url(../images/area.png) -10px -6px no-repeat; no-repeat; behavior:url(css/iepngfix.htc); } #content #contact textarea {width: 375px; height: 81px; border:0px; padding: 6px 0 0 20px; background:none; font-size: 13px; color:#363636; font-family:Trebuchet MS; margin-top:10px; cursor:text;} #content #sub ul li.contactformulier a{ background:url(../images/btn/sub_contact.gif) top right no-repeat;} #content #sub ul li.contactformulier a:hover{ background:url(../images/btn/sub_contact.gif) -5px -88px no-repeat;} /* footer---------------------------------------------------------------------*/ #footer {position: relative; height: 138px; clear:both; width:977px; margin:-138px auto 0; /* 1e negative value of footer height */} #footer #content {height:87px; margin-left: 60px; position:absolute; bottom: 13px;} #footer #content ul {height: 87px; display: inline; float:left;} #footer #content ul li {float:left;} #footer #content ul li a {text-indent:-9999px; display:block; height:87px;} #footer #content ul li.stadsradio a{width:67px; background:url(../images/btn/stadsradio.png); behavior:url(css/iepngfix.htc); cursor: pointer;} #footer #content ul li.stadsradio a:hover{width:67px; background:url(../images/btn/stadsradio_hover.png); behavior:url(css/iepngfix.htc); cursor: pointer;} #footer #content ul li.centraal a{width:67px; background:url(../images/btn/centraalfm.png); behavior:url(css/iepngfix.htc); cursor: pointer;} #footer #content ul li.centraal a:hover{width:67px; background:url(../images/btn/centraalfm_hover.png); behavior:url(css/iepngfix.htc); cursor: pointer;} #footer #content ul li.dm a{width:192px; background:url(../images/btn/dm.png) 0px 0 no-repeat; behavior:url(css/iepngfix.htc); cursor: pointer;} #footer #content ul li.dm a:hover{ background:url(../images/btn/dm_hover.png) 0px 0 no-repeat; behavior:url(css/iepngfix.htc); cursor: pointer;} #footer #content ul li.text {width: 437px; height:44px; font-size: 11px; color: #80261d; line-height: 17px; margin-top: 17px; } #footer #content ul li.dm2 a{width:96px; background:url(../images/btn/dm2.png) 0px 0px no-repeat; behavior:url(css/iepngfix.htc); cursor: pointer;} #footer #content ul li.dm2 a:hover{ background:url(../images/btn/dm2_hover.png) 0px 0px no-repeat; behavior:url(css/iepngfix.htc); cursor: pointer;}