/* CSS Document --------------------------------------------------------------------*/ html, body { font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-size: 13px; color: #464646; text-align: left; background-color: #FFF; line-height: 145%; font-weight: 400; } body { background: #FFF url(/media/img/bg_body.png) repeat-x 0 0; } html { background-color: #dc931a; } .btn-1 .round { display: none; } .hidden { display: none; } body:not(.design2) .hidenew { display: none !important; } .fld label span, .fld label span.normal { color: inherit !important; } .fld .radiocheckmark input[type=radio]:first-child, .radiocheckmark input{ margin: 5px; } /* Typografie stijlen voor de hele site --------------------------------------------------------------------*/ h1, h2, h3, span.h1 { line-height: 110%; font-weight: 400; font-family: 'Open Sans', Arial, Helvetica, sans-serif; } p, address { line-height: 145%; font-weight: 400; } address { font-style: normal; } a { margin: 0; padding: 0; vertical-align: baseline; background: transparent; } a:hover, a:active { outline: none; } ul, ol, li { margin: 0; padding: 0; line-height: 130%; } table { border-collapse: collapse; border-spacing: 0; margin-bottom: 14px; line-height: 150%; } th { font-weight: bold; vertical-align: bottom; text-align: left; } td { font-weight: normal; vertical-align: top; } h1 { font-size: 1.45em; color: #333; margin: 0 0 14px 0; padding: 0; } h1.first { margin: 0 -14px 14px -14px; padding: 10px 14px 14px 14px; background-color: #FFF; } h2 { font-size: 1.3em; color: #333; margin: 0 0 10px 0; padding: 10px 0 0 0; } h3 { font-size: 1.2em; color: #333; margin: 0 0 10px 0; padding: 10px 0 0 0; } span.h1 { font-size: 1.45em; color: #333; margin: 0 0 14px 0; padding: 0; display: block; } p { margin: 0 0 18px 0; } a { color: #870056; text-decoration: underline; } a:hover { color: #870056; text-decoration: underline; } a.more { color: #870056; padding-right: 10px; text-decoration: none; background: url(/media/img/bullet_a_more.png) no-repeat right 50%; } a.more:hover { color: #870056; text-decoration: underline; } a.back { color: #870056; padding-left: 10px; text-decoration: none; background: url(/media/img/bullet_a_back.png) no-repeat left 50%; } a.back:hover { color: #870056; text-decoration: underline; } strong { font-weight: 700; } ul { margin: 10px 0px 12px 14px; } ul ul { margin: 4px 0px 4px 14px; } ul li { list-style: none; padding-left: 12px; background: url(/media/img/bullet_li.png) no-repeat 0 6px; } ul li li { list-style: none; padding-left: 12px; background: url(/media/img/bullet_li.png) no-repeat 0 6px; } ol { margin: 0px 0px 12px 25px; } ol ol { margin: 0px 0px 0px 25px; } hr { margin: 20px 0; border: 0px none; border-top: 1px solid #CCC; border-bottom: 1px solid #FFF; } /* Responsive afbeeldingen in de content --------------------------------------------------------------------*/ img.responsive { max-width: 100%; height: auto; } img.responsive-left-20 { float: left; margin: 4px 20px 20px 0px; max-width: 20%; height: auto; } img.responsive-left-30 { float: left; margin: 4px 20px 20px 0px; max-width: 30%; height: auto; } img.responsive-left-40 { float: left; margin: 4px 20px 20px 0px; max-width: 40%; height: auto; } img.responsive-left-50 { float: left; margin: 4px 20px 20px 0px; max-width: 50%; height: auto; } img.responsive-right-20 { float: right; margin: 4px 0px 20px 20px; max-width: 20%; height: auto; } img.responsive-right-30 { float: right; margin: 4px 0px 20px 20px; max-width: 30%; height: auto; } img.responsive-right-40 { float: right; margin: 4px 0px 20px 20px; max-width: 40%; height: auto; } img.responsive-right-50 { float: right; margin: 4px 0px 20px 20px; max-width: 50%; height: auto; } /* Basis vlakverdeling --------------------------------------------------------------------*/ #container { width: 980px; margin: 0px auto; } #top { padding-top: 4px; position: relative; } #left { width: 78.6%; float:left; margin-bottom: 14px; } #right { width: 20%; float: right; margin-bottom: 14px; } #content { min-height: 716px; padding: 0 14px 14px 14px; background-color: #eff7fc; overflow: auto; } #adsensecontent { display: none; } #footer { padding: 4px 0; background-color: #f7e5c7; } #footerLeft { float: left; } #footerRight { float: right; } #tags { margin-bottom: 10px; padding: 8px 0; background-color: #dc931a; } .clear { clear: both; width: 100%; height: 1px; line-height: 1px; font-size: 1px; } .border { padding: 14px; border: 1px solid #d6d8da; border-radius: 3px; overflow: auto; background-color: #FFF; } #left .border { padding: 8px 14px; } #right .border { margin-bottom: 14px; } .adsense { text-align: center; padding: 14px 0; border: 1px solid #d6d8da; border-radius: 3px; background-color: #FFF; } /* Home --------------------------------------------------------------------*/ #home #content p { font-size: 1.17em; } #home #content h1 { color: #870056; margin-bottom: 4px; } #home #content span.h1 { color: #870056; margin-bottom: 4px; } #home #content h2 { color: #870056; font-size: 1.45em; } #home #content h3 { color: #870056; } #homeIntro { padding: 16px 15px; position: relative; overflow: hidden; } #homeIntro { background-clip: border-box; background-origin: padding-box; background-position: center center; background-repeat: no-repeat; background-size: cover; } #mobileHeader { display: none; background-clip: border-box; background-origin: padding-box; background-position: center center; background-repeat: no-repeat; background-size: cover; min-height: 30vh;} /*#home .slide1 { background-image: url(/media/img/bg_home_1.jpg); } #home .slide2 { background-image: url(/media/img/bg_home_2.jpg); } #home .slide3 { background-image: url(/media/img/bg_home_3.jpg); } #home .slide4 { background-image: url(/media/img/bg_home_4.jpg); } #home .slide5 { background-image: url(/media/img/bg_home_5.jpg); }*/ #homeIntro #findyourdate { width: 25%!important; float: left!important; position: relative; z-index: 9999; } #homeIntro #content { width: 45%!important; float: right!important; position: relative; z-index: 9999; padding: 14px; background: url(/media/img/bg_white_transparent.png) repeat 0 0!important; border-radius: 3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} #homeIntro #content { min-height: 0!important; } #homeIntro #content h1.first { margin: 0 0 14px 0; padding: 0; background: none; } #homeNewmembers { clear: both; position: relative; z-index: 9999; background-color: #953369; border-radius: 0 0 3px 3px; } #homeNewmembers h2 { margin: 0; padding: 12px 14px; background-color: #870056; color: #FFF; } #newmembers { padding: 14px 14px 0 14px; overflow: auto; } #newmembers a { float: left; display: block; width: 19.4%; margin: 0 0 14px 2%; padding: 2%; background-color: #FFF; color: #464646; text-decoration: none; border-radius: 3px; } #newmembers a:nth-child(4n+1) { clear: both; margin: 0 0 14px 0; } #newmembers a img { width: 100%; height: auto; } #newmembers a p { margin: 10px 0 5px 0; padding: 0; line-height: 120%; min-height: 95px; } #newmembers .more { padding-right: 10px; text-decoration: none; background: url(/media/img/bullet_a_more.png) no-repeat right 55%; color: #870056; font-size: 0.9em; } /* Niewe leden op landingpages */ #content #homeNewmembers { border-radius: 3px; overflow: hidden; } #content #newmembers a { width: 28%; margin: 0 0 14px 2%; } #content #newmembers a:nth-child(4n+1) { clear: both; margin: 0 0 14px 2%; } #content #newmembers a:nth-child(3n+1) { clear: both; margin: 0 0 14px 0; } /* Top --------------------------------------------------------------------*/ #top .span_9_of_12 { width: 77.54%; float: left; } #top .span_3_of_12 { width: 20%; float: right; } #topLogo { float: left; margin-right: 20px; } #topSlogan { float: left; } #topLogin { padding: 12px; background-color: #dc931a; border-radius: 3px; overflow: auto; } #topLogin { color: #FFF; font-size: 1.4em; } #topLogin a.btn_more { margin-top: 14px; } /* Content --------------------------------------------------------------------*/ .subcontent { padding-top: 20px; } /* Vind je date --------------------------------------------------------------------*/ #findyourdate { margin-bottom: 14px; background-color: #870056; border-radius: 3px; overflow: hidden; } #findyourdate span.h1 { margin: 0; padding: 10px 14px 14px 14px; color: #FFF; } #findyourdate form { padding: 8px 14px 14px 14px; color: #FFF; overflow: auto; background-color: #953369; font-size: 1.3em; } #findyourdate form .fld_12 { padding-right: 0; } #findyourdate form .fld { margin: 0 0 4px 0; } #findyourdate form .fld .text { height: 24px; padding: 2px 3px; border: 0px none; border-radius: 3px; line-height: 20px; } #findyourdate form .fld .select { line-height: 24px; height: 24px; padding: 2px 3px; border: 0px none; border-radius: 3px; } #findyourdate form .fld .checkbox { margin: 8px 8px 0 0; } #findyourdate form .picture { font-size: 0.9em; } #findyourdate form .center { line-height: 24px; text-align: center; } #findyourdate input.btn_submit { width: 60%; border: 1px solid #FFF; } #findyourdate input.btn_submit:active { border: 1px solid #FFF; padding: 6px 10px 6px 10px; } #findyourdate #searchAdvanced { padding: 14px; overflow: auto; } #findyourdate .fld .text, #findyourdate .fld .textarea, #findyourdate .fld textarea { box-shadow: inset 1px -1px 3px rgba(0, 0, 0, 0.3); } #findyourdate .fld .select { box-shadow: inset 1px -1px 3px rgba(0, 0, 0, 0.3); } /* Banner linkerkolom */ div.leftbanner { margin-bottom: 10px;} div.leftbanner img { border-radius: 3px;} /* Members Overzicht --------------------------------------------------------------------*/ #membersOverview { margin: -14px -14px 0 -14px; } #membersOverview .item { padding: 14px 14px 0 14px; border-bottom: 14px solid #FFF; } #membersOverview .itemLeft { float: left; width: 29%; } #membersOverview .itemLeft img { width: 100%; height: auto; margin: 0 0 14px 0; } #membersOverview .itemRight { float: right; width: 67%; font-size: 1em; } #membersOverview .itemRight p { margin-bottom: 9px; overflow: hidden; } #membersOverview .itemRight p.intro { font-size: 1.15em; line-height: 125%; margin-bottom: 14px; } #membersOverview .itemRight a { color: #870056; font-size: 0.95em; } #membersOverview .itemRight .intro strong img { vertical-align: middle; margin: 5px 8px 0 0; float: left; } #membersOverview .male { background-color: #eff7fc; } #membersOverview .female { background-color: #f7e5c7; } /* Members Detail --------------------------------------------------------------------*/ #membersDetail { overflow: hidden; } h1 img.userFlag { vertical-align: middle; margin: 8px 10px 0 0; float: left; } #detailLeft { float: left; width: 26%; margin: 0 4% 6px 0; } #detailLeft { line-height: 140%; font-size: 0.9em; } #detailLeft img { width: 100%; height: auto; margin-bottom: 10px; background: rgba(255, 255, 255, 0.01); -webkit-backface-visibility: hidden; } #detailLeft .membership { display: block; margin-top: 10px; } #detailRight { float: left; width: 70%; } #detailMembership { clear: both; margin: 0 0 18px 0; font-size: 1em; } #kop1uit #detailMembership { font-weight: bold; } #detailMembership > div { padding-left: 28px; height: 20px; line-height: 20px; } #detailMembership .full { background: url(/media/img/icon_full_membership_detail.png) no-repeat left 50%; } #detailMembership .limited { background: url(/media/img/icon_limited_membership_detail.png) no-repeat left 50%; } #detailOptions { clear: both; padding: 8px 0 2px 0; border-top: 1px solid #b2daf0; border-bottom: 1px solid #b2daf0; overflow: auto; } #detailOptions a, #detailOptions span { float: left; display: inline-block; margin-bottom: 6px; text-decoration: none; } #detailOptions a:hover { text-decoration: underline; } #detailOptions .chat { padding: 0 10px 0 22px; margin-right: 12px; background: url(/media/img/buttons/user_comment.gif) no-repeat 0 0; border-right: 1px solid #b2daf0; } #detailOptions .msg1 { padding: 0 10px 0 24px; margin-right: 12px; background: url(/media/img/buttons/email_edit.gif) no-repeat 0 0; border-right: 1px solid #b2daf0; } #detailOptions .msg2 { padding-left: 28px; background: url(/media/img/buttons/email.gif) no-repeat 2px 2px; } #membersDetail a.abuse { float: right; clear: both; display: inline-block; margin: 10px 0; padding-left: 24px; background: url(/media/img/buttons/btn_nietok.gif) no-repeat 0 0; } #membersDetail a.abuse { color: #FF0000; font-size: 0.8em; } #detailExtra { clear: both; padding: 10px 0; } #detailExtra table th { font-weight: 400; } #album { float: left; display: inline; width: 100%; overflow: hidden; margin: 0; padding: 0;} #album-thumbs { width: 100%; overflow: hidden; padding-top: 4px;} #album-thumbs a.thumb { float: left; display: inline; width: 24%; margin: 0 1% 0 0; } #album-thumbs a.thumb:last-child { margin: 0; } /* Pager Styles --------------------------------------------------------------------*/ .WsPager { padding: 4px 0 14px 0; text-align: center; overflow: auto; font-size: 1.1em; } .WsPager .WsPagerRpp { float: left; width: 215px; text-align: left; line-height: 28px; } .WsPager .WsPagerPaging { line-height: 28px; } .WsPager .WsPagerLeft { float: left; width: 60px; text-align: left; } .WsPager .WsPagerRight { float: right; width: 60px; text-align: right; } .WsPager .WsPagerLeft a, .WsPager .WsPagerRight a { display: inline-block; width: 18px; height: 18px; margin-top: 3px; text-indent: 9999px; overflow: hidden; } .WsPager .WsPagerLeft a.WsPagerPrev { background: url(/media/img/btn_pager_prev.png) no-repeat 50% 50%; } .WsPager .WsPagerLeft a.WsPagerFirst { background: url(/media/img/btn_pager_first.png) no-repeat 50% 50%; } .WsPager .WsPagerRight a.WsPagerNext { background: url(/media/img/btn_pager_next.png) no-repeat 50% 50%; } .WsPager .WsPagerRight a.WsPagerLast { background: url(/media/img/btn_pager_last.png) no-repeat 50% 50%; } .WsPager a { color: #333; text-decoration: none; margin: 0 2px; } .WsPager a:hover, .WsPager span { color: #870056; text-decoration: none; margin: 0 2px; } .WsPager select { padding: 2px 3px; border: 1px solid #c8c8c8; visibility: visible; box-shadow: inset 1px -1px 3px rgba(0, 0, 0, 0.15); } #membersOverview .WsPager { padding: 4px 14px 14px 14px; background-color: #FFF; } /* Gebruikers Opties Styles --------------------------------------------------------------------*/ #userOptions { background-color: #FFF; } #userOptions span.h1 { font-size: 1.3em; } #userOptions span.h1 span { font-size: 0.8em; display: block; font-weight: 700; } #userOptions a { margin-bottom: 10px; } #userOptions a:last-child { margin-bottom: 0; } /* Vacature tabel --------------------------------------------------------------------*/ .vacatureOverzicht { width: 100%; } .vacatureOverzicht td { padding: 6px 6px; border-bottom: 1px solid #FFF; } .vacatureOverzicht th { padding: 6px 6px; color: #FFF; background-color: #dc931a; } /* Info tabel --------------------------------------------------------------------*/ .tableinfo { width: 100%; margin-bottom: 30px; } .tableinfo td { padding: 6px 6px; border-bottom: 1px solid #FFF; } .tableinfo th { padding: 6px 6px; color: #FFF; background-color: #dc931a; } /* Faq --------------------------------------------------------------------*/ ul#categories { margin-left: 0; } ul#categories li { margin-bottom: 2px; } ul#categories li a { color: #333; text-decoration: none; } ul#categories li a:hover { color: #333; text-decoration: underline; } ul#questions { margin-left: 0; } ul#questions li { margin-bottom: 2px; } ul#questions li a { color: #333; text-decoration: none; } ul#questions li a:hover { color: #333; text-decoration: underline; } /* Account --------------------------------------------------------------------*/ #kop1uit h1.first { padding-top: 10px; background: none; } /* Account Meldingen */ #content p.melding { color: #333; margin: 5px 0 10px 0; padding: 8px 10px; border: 1px solid #999; background-color: #FFFFCC; } #content p.fout { color: #633; margin: 5px 0 10px 0; padding: 8px 10px; border: 1px solid #999; background-color: #FFCCCC; } /* Mijn profiel navigatie */ #myprofile { margin-bottom: 14px; background-color: #dc931a; border-radius: 3px; } #myprofile span.h1 { margin: 0; padding: 10px 14px 14px 14px; color: #FFF; } #myprofile span.h1 a { color: #FFF; text-decoration: none; } #myprofile span.h1 a:hover { color: #FFF; text-decoration: none; } #myprofile ul, #myprofile ul li { margin: 0; padding: 0; list-style: none; background: none; } #myprofile ul { padding: 14px 14px 8px 14px; background-color: #f7e5c7; overflow: auto; } #myprofile ul li { margin-bottom: 10px; } #myprofile ul li a { display: block; padding-left: 12px; background: url(/media/img/bullet_myprofile_a.png) no-repeat left 5px; } #myprofile ul li a { color: #333; text-decoration: none; font-size: 1.1em; } #myprofile ul li a:hover { color: #333; text-decoration: underline; } #myprofile #full-membership { display: block; padding: 12px 0 12px 56px; background: url(/media/img/icon_btn_fullmembership.png) no-repeat 12px 50%; border-radius: 3px; } #myprofile #full-membership { color: #FFF; text-decoration: none; font-size: 1.2em; } #myprofile #limited-membership { display: block; padding: 12px 0 12px 56px; background: url(/media/img/icon_btn_limitedmembership.png) no-repeat 12px 50%; border-radius: 3px; } #myprofile #limited-membership { color: #FFF; text-decoration: none; font-size: 1.2em; } #myprofile #myprofileImg { padding: 14px 14px 0 14px; text-align: center; background-color: #ebf6fc; } /* Inbox */ #ganaarbox { margin-bottom: 14px; } .mailbox { width: 100%; margin-bottom: 14px; } .mailbox th, .mailbox td { padding: 6px 1%; } .mailbox .check { width: 5%; } .mailbox .status { width: 5%; } .mailbox .from { width: 26%; } .mailbox .subject { width: 36%; } .mailbox .date { width: 22%; } .mailbox .unread td { font-weight: 700; } .mailbox td { border-bottom: 1px solid #FFF; } .mailbox th { color: #FFF; background-color: #dc931a; } .mailbox input[type='checkbox'] { float: left; margin: 4px 0 0 0; } .mailbox a { color: #333; text-decoration: none; } .mailbox a:hover { color: #333; text-decoration: underline; } input.inboxDelete { float: left; border: 0px none; padding: 6px 7px 5px 7px; line-height: 20px; text-align: left; border-radius: 3px; background: url(/media/img/buttons/btn_inbox-delete.png) no-repeat 7px top; } input.inboxDelete { color: #dc931a; text-decoration: none; font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-weight: 400; font-size: 16px; } input.inboxDelete:hover { text-decoration: underline; } /* Bekeken */ table.data th { border-bottom: 1px solid #aaaaaa; padding: 6px; } table.data th img { float: left; margin: 2px 6px 0 0; } table.data td { padding: 6px; } table.data tr:nth-child(2n) td { background-color: #FFF; } table.data tr td a { color: #870056; text-decoration: none; } table.data tr td a:hover { color: #870056; text-decoration: underline; } /* Bericht */ .messageinfo { width: 100%; } .messageinfo td { padding: 0 2%; } .messageinfo td.left { width: 20%; } .messageinfo td.right { width: 76%; } #message { margin: 16px 0; padding: 20px 0; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; } #messageOptions { clear: both; margin-bottom: 26px; overflow: auto; } #messageOptions a { float: left; display: inline-block; margin-bottom: 6px; text-decoration: none; } #messageOptions a:hover { text-decoration: underline; } #messageOptions a.nointerest { padding: 0 10px 0 22px; margin-right: 12px; background: url(/media/img/buttons/email_delete.gif) no-repeat 0 0; border-right: 1px solid #b2daf0; } #messageOptions a.delete { padding: 0 10px 0 22px; margin-right: 12px; background: url(/media/img/buttons/email_delete.gif) no-repeat 0 0; border-right: 1px solid #b2daf0; } #messageOptions a.reply { padding: 0 10px 0 24px; margin-right: 12px; background: url(/media/img/buttons/email_edit.gif) no-repeat 0 0; border-right: 1px solid #b2daf0; } #messageOptions a.block { padding-left: 24px; background: url(/media/img/buttons/user_block.gif) no-repeat 0 0; } /* Album */ #formAlbumEdit table th, #formAlbumEdit table td { padding: 2px 10px; vertical-align: middle; } #formAlbumEdit table td .fld { margin: 0; } #formAlbumEdit .up, #formAlbumEdit .down, #formAlbumEdit .delete, #formAlbumEdit .disabled, #formAlbumEdit .rotate-clockwise, #formAlbumEdit .rotate-counterclockwise { display: inline-block; text-indent: -9999px; padding: 0 0 0 16px; margin: 0 5px; *display: block; *zoom: 1; *float: left; } #formAlbumEdit .up { background: url(/media/img/buttons/arrow_up.png) no-repeat 0 0; } #formAlbumEdit .down { background: url(/media/img/buttons/arrow_down.png) no-repeat 0 0; } #formAlbumEdit .delete { background: url(/media/img/buttons/picture_delete.png) no-repeat 0 0; } #formAlbumEdit .rotate-clockwise { background: url(/media/img/buttons/rotate_clockwise.png) no-repeat 0 0; } #formAlbumEdit .rotate-counterclockwise { background: url(/media/img/buttons/rotate_counterclockwise.png) no-repeat 0 0; } #formAlbumEdit .disabled { opacity: 0.5; } #formAlbumEdit a:focus { outline: none;} /* Geblokkeerd */ .blocked { width: 100%; margin-bottom: 14px; } .blocked th, .blocked td { padding: 6px 2%; } .blocked td { border-bottom: 1px solid #FFF; } .blocked th { color: #FFF; background-color: #dc931a; } .blocked td.left { width: 40%; } .blocked td.right { width: 56%; } /* Footer Styles --------------------------------------------------------------------*/ #footer .section { width: 960px; margin: 0px auto; background-color: #f7e5c7; } #footer { color: #333; line-height: 20px; font-size: 1.1em; } #footer a { color: #333; text-decoration: none; } #footer a:hover { color: #333; text-decoration: underline; } #footerLeft { text-align: left; line-height: 24px; } #footerLeft a { } #footerLeft span { margin: 0 4px; } #footerLeft img { margin-right: -20px; } .playicon { margin-left: 25px; display: inline-block;} .playicon img { width: 100px; } #mobilenav .playicon { margin:0; display: inline; } #mobilenav .playicon img { height: 45px; width: auto; } #footerRight { text-align: right; font-size: 0.95em; line-height: 24px; } #footerRight a.footerFR { display: inline-block; margin-right: 3px; vertical-align: middle; } #footerRight a.footerFR img { display: inline-block; border: 1px solid #FFF; box-shadow: 0 0 3px rgba(0, 0, 0, 0.5); font-size: 0; line-height: 0px; margin: -3px 8px 0 0; } #tags .section { width: 960px; margin: 0px auto; text-align: center; height: 100px; overflow: hidden; } #tags .section { color: #845810; } #tags .section a { color: #845810; text-decoration: none; padding: 3px; margin: 4px; display: inline-block;} #tags .section a:hover { color: #845810; text-decoration: underline; } /* Hoofdnavigatie Styles --------------------------------------------------------------------*/ ul#nav, ul#nav li { margin: 0; padding: 0; list-style: none; background: none; } ul#nav li a { margin: 0; padding: 0; text-decoration: none; } ul#nav { width: 100%; margin: 4px 0 14px 0; overflow: hidden; background-color: #FFF; border-radius: 3px; } ul#nav li { float: left; display: block; height: 33px; line-height: 33px; padding: 0 14px 0 0; background-color: #f2f8fd; } ul#nav li a { float: left; display: block; height: 33px; line-height: 33px; padding: 0 10px; background-color: #FFF; border-radius: 3px; } ul#nav li a { color: #333; text-decoration: none; font-size: 1.3em; } ul#nav li a:hover, ul#nav li a.active { color: #FFF; text-decoration: none; background-color: #870056; } /* Mobile menu --------------------------------------------------------------------*/ #mobilenav { position: relative; } .mobile-menu ul { margin: 0; padding: 0; list-style: none; background: none!important; } .mobile-menu li { margin: 0; padding: 0; list-style: none; background: none!important; } .mobile-menu li a { margin: 0; padding: 0; text-decoration: none; } .mobile-menu { width: 100%; margin-bottom: 14px; background: #FFF none; border-radius: 3px; overflow: hidden; } .mobile-menu span { display: block; padding-left: 50px; } .mobile-menu span { line-height: 50px; color: #FFF; text-decoration: none; font-family: 'Istok Web', Arial, Helvetica, sans-serif; font-size: 1.45em; } .mobile-menu > ul > li:last-child { border-bottom: 0px none; } .mobile-menu > ul > li:first-child { border-top: 0px none; } .mobile-menu ul li { border-bottom: 1px solid #320020; border-top: 1px solid #911664; } .mobile-menu ul li a { display: block; height: 46px; line-height: 46px; padding: 0 50px 0 10px; background-color: #5b003a; } .mobile-menu ul li a { color: #FFF; text-decoration: none; font-family: 'Istok Web', Arial, Helvetica, sans-serif; font-weight: 400; font-size: 1em; } .mobile-menu ul li a:hover { color: #FFF; background-color: #76094f; } .mobile-menu ul li a.active { color: #e2bad4; } .mobile-menu ul li a.active:hover { color: #e2bad4; } .mobile-menu a.accordeon_icon { padding: 0; } .mobile-menu ul ul { border-bottom: 0px none; } .mobile-menu ul li ul a { font-size: 0.9em; } .mobile-menu span.accordeon_subnav { cursor: pointer; background: url(/media/img/bg_accordeon_menu.png) no-repeat 0 50%; } .mobile-menu span.accordeon_open { background-image: url(/media/img/bg_accordeon_menu.png); } .mobile-menu .accordeon_subnav { position: relative; } .mobile-menu .accordeon_subnav .accordeon_icon { display: block; cursor: pointer; width: 40px; height: 46px; position: absolute; top: 0; right: 0; background: url(/media/img/bg_accordeon_more.png) no-repeat 50% 50%; } .mobile-menu .accordeon_open > .accordeon_icon { background-image: url(/media/img/bg_accordeon_less.png); } .mobile-menu ul ul { border-top: 1px solid #323232; } .mobile-menu ul ul > li:last-child { border-bottom: 0px none; } .mobile-menu ul ul li a { background-color: #6b0546; } /* Cookie consent --------------------------------------------------------------------*/ .cc-window { z-index: 10000 !important; } /*Hans*/ body.MessagesController #content { background: transparent; } .userstate { display: inline-block; width: 10px; height: 10px; border-radius: 50%; } .userstate.useronline { background: green; } .userstate.useroffline { background: red; } #messageBox.chatBox .message { position: relative; margin-bottom: 30px; } #messageBox.messages .message { margin-bottom: 20px; } .inboxDelete { display: block; clear: both; } #messageBox.chatBox .message.otheruser { clear: both; float: left; } #messageBox.chatBox .message.currentuser { clear: both; float: right; } #messageBox.chatBox .message .username{ font-weight: bold; font-size: 16px; margin-right: 5px; } #messageBox.chatBox a { text-decoration: none; color: inherit; } #messageBox.chatBox .date { color: #444; float: right; margin-right: 10px; font-size: 14px; } #messageBox.chatBox .messagetop { background: #f7e5c7; height: 40px; line-height: 40px; color: #dc931a; padding-left: 10px; } #messageBox.chatBox .messagebottom { display: block; background: #fef0e7; padding: 10px; color: black; font-size: 16px; line-height: 20px; } .topbuttons { text-align: center; } #messageBox.chatBox .currentuser .messagetop { background: #cf7dad; color: #870056; } #messageBox.chatBox .currentuser .messagebottom { background: #f8ecf3; padding-left: 10px; } #messageBox.messages .message { width: 100%; } #messageBox.messages .messagebottom:after { content: ''; float:right; display: block; margin-top: 5px; margin-right: 0px; border-color: transparent; border-width: 6px 9px; border-style: solid; border-left-color: #dc931a; } #messageBox.messages .currentuser .messagebottom:after { border-left-color: #870056; } #messageBox.messages .userimage, #messageBox.messages .messagetop, #messageBox.messages .messagebottom { } #messageBox.messages .unread .text { font-weight: bold; } .messagescontainer .unread .date{ font-weight: bold; } #messageBox.messages .userimage { float: left; } #messageBox.messages .userimage img { width: 80px; height: auto; display: block; } #messageBox.messages .username, #messageBox.messages .text { margin-left: 10px; } #messageBox.thread .message { width: 80%; } #messageBox.thread .messagetop { padding-left: 50px; } .smalluserimage { width: 30px; height: auto; border-radius: 50%; } #messageBox.thread .userimage img{ width: 30px; height: auto; position: absolute; border-radius: 50%; top: 5px; left: 5px; } #messageBox a.newmessages { margin: 0 auto; display: inline-block; height: 33px; line-height: 33px; padding: 0 10px; background-color: #FFF; border-radius: 3px; color: #FFF; text-decoration: none; background-color: #870056; margin-bottom: 20px; } #messageBox .messagescontainer { } .newmessageloader { clear: both; } .newmessageloader:after { content: ''; display:block; clear: both; } #messageBox.thread .buttons { border-top: 1px solid #ccc; color: #000; padding: 10px 10px; margin-top: 10px; text-align: center; clear: both; } #messageBox.thread .buttons a{ display: inline-block; margin: 2px 10px ; } #messageBox.thread .buttons a span{ line-height: 16px; vertical-align: top; margin-left: 10px; } #messageBox.thread .buttons a:before { /*background: no-repeat url('/media/img/buttons/email_delete.png');*/ background-size: 16px 16px; width: 16px; height: 16px; display: inline-block; content: ''; } #messageBox.thread .buttons a.block:before { /* background: no-repeat url('/media/img/buttons/user_block.gif');*/ } .loader { border: 16px solid #f3f3f3; /* Light grey */ border-top: 16px solid #870056; /* Blue */ border-radius: 50%; width: 20px; height: 20px; animation: spin 2s linear infinite; display: block; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .swipehand { display: none; } #detailOptions .fa{ font-size: 30px; } #detailOptions a { margin-right: 5px; } #swipebox-bottom-bar { padding-bottom: 20px; } .playicon { margin-left: 25px; display: inline-block;} ul#nav li .playicon a { margin-top: -6px; background: transparent; padding: 0; } ul#nav li .playicon img { height: 46px; } ul#nav li .itunesicon a { background: transparent; padding: 0; margin-top: -1px; } ul#nav li .itunesicon img { height: 33px; } @media only screen and (max-width: 1024px) { .mobileonly { display: block !important; visibility: visible !important; } .backbutton { max-width: 200px; } .playicon, .itunesicon { margin-left: 1px; } ul#nav li .playicon img, ul#nav li .itunesicon img { margin-left: -6px; margin-right: -0px; } } @media only screen and (max-width: 900px) { #topSlogan { width: 290px; } ul#nav li { padding-right: 5px; } ul#nav li .playicon img, ul#nav li .itunesicon img { margin-left: -10px; } ul#nav li .itunesicon img { height: 28px; margin-top:-6px} ul#nav li .playicon img { height: 40px; } } #mobilenav .playicon { margin:0; display: inline; } #mobilenav .playicon img { margin-left: -6px; height: 45px; width: auto; } #mobilenav li .itunesicon img { height: 33px; }