/* Theme Name: Maropeng Description: Version: 1.0 Author: Richard Frank (www.flowsa.com) Date: June 2008 */ /* RESET AND CLEARFIX ----------------------------*/ :link,:visited { text-decoration:none } ul,ol { list-style:none } h1,h2,h3,h4,h5,h6,pre,code {font-size:1em;} ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input { margin:0px; padding:0px } a img,:link img,:visited img { border:none } address {font-style:normal} .clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden;} .clearfix {display:inline-block;} .clearfix {display:block;} /* BASE TYPOGRAPHY -----------------------------------*/ body {font: 62.5%/1.4em "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; color:#111; } p, ul, ol {font-size:1.3em; line-height:1.4em; margin-bottom: 1.2em;} p {margin-bottom:1em;} a:link {outline:none; text-decoration:underline; color:#f15800; outline:none;} a:visited {text-decoration:underline; color:#f15800; outline:none;} a:hover {} h1, h2, h3, h4, h5, h6 {font:"Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:normal; margin-bottom:0.4em; line-height:1.3em;} h1 {font-size:2.0em; font-weight: bold;} h2 {font-size:1.7em; font-weight: bold;} h3 {font-size:1.5em; font-weight: bold;} h4 {font-size:1.4em;} blockquote {} /* BASE TEMPLATE ---------------------------------*/ body {background:black url(http://www.maropeng.co.za/maropengtheme/images/bg_new3.jpg) top center no-repeat; height:100%; margin:0px;} #container {background:url(http://www.maropeng.co.za/maropengtheme/images/container-trans-darker.png); width:960px; margin:0px auto;} /* padding allows footer to be fixed to bottom of screen*/ #wrap {padding:0px} /* LAYOUT STRUCTURE -------------------------------- */ #content {float:left; width: 920px; padding-left:26px; padding-right:14px; margin-top:5px; margin-bottom:10px;} /* To accompany for the extra 6 pixel margin added by drop shadow */ #main {float:left; width:663px; background: #FFF4CA url(http://www.maropeng.co.za/maropengtheme/images/text_bg.jpg) no-repeat top right; padding: 10px; border: 1px solid #4c4b39; } #sidebar {background-color:#FFF4CA; width:213px; float:left; border: 1px solid #4c4b39;} /*HEADER --------------------------------*/ #header {height:65px; padding: 10px;} #header h1 span {margin-left:-9999px;} /*FOOTER --------------------------------*/ #footer { height:37px; background: #4c4b39 url(http://www.maropeng.co.za/maropengtheme/images/footer_bg.jpg) repeat-x; padding: 0px 10px 0px 10px; border: 1px solid #4c4b39; display: block; width:938px; z-index: 999; float:left; margin:0 !important; } #footer p { text-align:center; margin:0px; color:#FFFFFF; line-height: 37px; } #footer a { color:#FFFFFF; font-weight: bold; text-decoration: underline; } #footernav { float:right; margin: 0px; padding-top: 0px 10px; } #footernav li { float:left; line-height: 37px; color: #FFFFFF; margin-left: 10px; } /* UTILITY NAV AND SEARCH ----------------------------*/ #header-bar {float:right; width:30em;} #utilitynav {float:right; background-color:#f78f1e; padding:2px 3px; font-weight:bold; border:1px solid #6F6F6F;} #utilitynav ul {} #utilitynav ul li {float:left; margin-right:5px; color:white;} #utilitynav ul li a {color:white;} #utilitynav ul li.current a {} #utilitynav ul li a:hover {} #nav-searchbox {float:right; margin-top:5px;} #nav-searchbox input {padding:3px; border: 1px solid #666666;} /* NAVIGATION - PRIMARY ------------------------------*/ #nav {height:37px;} #nav ul {float:left; margin-bottom:0;} #nav ul li {float:left;} #nav ul li a {display:block; height:37px; background: url(http://www.maropeng.co.za/maropengtheme/images/nav.gif) no-repeat;} #nav li#nav-home a {width:73px; background-position:0px 0px} #nav li#nav-home a:hover {background-position:0 -37px} #nav li#nav-home a.current {background-position:0 -37px} #nav li#nav-maropeng a {width:207px; background-position:-73px 0px} #nav li#nav-maropeng a:hover {background-position:-73px -37px} #nav li#nav-maropeng a.current {background-position:-73px -37px} #nav li#nav-sterk a {width:158px; background-position:-280px 0px} #nav li#nav-sterk a:hover {background-position:-280px -37px} #nav li#nav-sterk a.current {background-position:-280px -37px} #nav li#nav-hotel a {width:162px; background-position:-438px 0px} #nav li#nav-hotel a:hover {background-position:-438px -37px} #nav li#nav-hotel a.current {background-position:-438px -37px} #nav li#nav-conferencing a {width:123px; background-position:-600px 0px} #nav li#nav-conferencing a:hover {background-position:-600px -37px} #nav li#nav-conferencing a.current {background-position:-600px -37px} #nav li#nav-education a {width:98px; background-position:-723px 0px} #nav li#nav-education a:hover {background-position:-723px -37px} #nav li#nav-education a.current {background-position:-723px -37px} #nav li#nav-news a {width:69px; background-position:-821px 0px} #nav li#nav-news a:hover {background-position:-821px -37px} #nav li#nav-news a.current {background-position:-821px -37px} #nav li#nav-faq a {width:70px; background-position:-890px 0px} #nav li#nav-faq a:hover {background-position:-890px -37px} #nav li#nav-faq a.current {background-position:-890px -37px} #nav span {margin-left:-2000px;} /*NAVIGATION SECONDARY -----------------------------*/ #secondarynav {background: url(http://www.maropeng.co.za/maropengtheme/images/orange-strap.jpg) no-repeat; color:#EFEFEF; padding:5px; font-size:0.95em; margin-bottom:0} #secondarynav li {float:left; padding:0; margin: 0 10px 0 0;} #secondarynav a {color:white;} /*--------------------------------------------------------------- -------------------UTILITIES ---------------------------------- ---------------------------------------------------------------*/ .first {margin-left:0 !important; padding-left:0 !import:0 !important;} .full {width:685px; margin-bottom:10px;} .half {width:342px; margin-bottom:10px;} .photo p {font-weight:bold;} .floatright {float:right; margin-left:10px;} .floatleft {float:left; margin-right:10px;} .seemore {font-size:1.1em;} #pagination {float:right;} #pagination p {text-align:right; margin-bottom:0;} #pagination a {background:none !important; display:inline; border:none;} #nextprev {margin:0 auto; width:22em;} #main #pagination a {} /*--------------------------------------------------------------- -------------------INNER GENERAL ---------------------------------- -------------------------------------------------------------------*/ /* MAIN CONTENT LISTS -------------------------*/ #main ul {list-style-type:disc; margin-left:1.6em;} #main ol {list-style-type:decimal; margin-left:1.6em;} #main li {margin-bottom:0.7em;} #main li li {font-size:90.9%;} #main li li li {font-size:82.6%;} /* SIDEBARS --------------------------------*/ #sidebar h2 {background-color:#F25800; font-size:1.6em; padding:5px; color:white;} #sidebar h2 a {text-decoration:none;} #sidebar ul {margin-left:20px;} #sidebar li {list-style:disc; margin-bottom:0.5em;} .sidebar-inner {padding:10px;} #sidebar iframe {margin-bottom:10px;} /* FP DROP SHADOWS -------------------------*/ .drop_shadow_4col_span { float:left; background: url(http://www.maropeng.co.za/maropengtheme/images/shadowAlpha.png) no-repeat bottom right !important; background: url(http://www.maropeng.co.za/maropengtheme/images/shadow.gif) no-repeat bottom right; width: 920px; padding: 0px; margin-top: 10px; margin-right: 0; margin-bottom: 10px; margin-left: 20px; } .drop_shadow_3col_span { float:left; background: url(http://www.maropeng.co.za/maropengtheme/images/shadowAlpha.png) no-repeat bottom right !important; background: url(http://www.maropeng.co.za/maropengtheme/images/shadow.gif) no-repeat bottom right; width: 685px; padding: 0px; margin-top: 10px; margin-right: 0; margin-bottom: 10px; margin-left: 20px; } .drop_shadow_2col_span { float:left; background: url(http://www.maropeng.co.za/maropengtheme/images/shadowAlpha.png) no-repeat bottom right !important; background: url(http://www.maropeng.co.za/maropengtheme/images/shadow.gif) no-repeat bottom right; width: 450px; padding: 0px; margin-top: 10px; margin-right: 0; margin-bottom: 10px; margin-left: 20px; } .drop_shadow_1col_span { float:left; background: url(http://www.maropeng.co.za/maropengtheme/images/shadowAlpha.png) no-repeat bottom right !important; background: url(http://www.maropeng.co.za/maropengtheme/images/shadow.gif) no-repeat bottom right; width: 215px; padding: 0px; margin-top: 10px; margin-right: 0; margin-bottom: 10px; margin-left:20px; } .innerbox { position:relative; bottom:6px; right:10px; margin-right: 0; margin-bottom: 10px; margin-left:20px; } .innerbox { position:relative; bottom:6px; right: 6px; margin: 0px; } .innerbox { /* IE5 hack */ \margin: 0px 0px -3px 0px; ma\rgin: 0px 0px 0px 0px; } /*--------------------------------------------------------------- -------------------NEWS ----------------------------------------- ---------------------------------------------------------------*/ /*NEWS ARCHIVE PAGE ---------------------*/ #news-archive h2 a {text-decoration:underline; color:#403e2f;} /* NEWSFEED -----------------------------*/ #newsfeed {clear:both; margin-bottom:10px;} .newsfeed-item {margin-bottom:10px;} #newsfeed .news-meta {clear:both; padding:1px; margin-bottom:10px; color:#8a8686;} #newsfeed .news-meta a {} #newsfeed .news-meta ul {list-style:none; margin-left:0; font-size:1.1em;} #newsfeed .news-meta ul li {float:left; padding-right:10px; margin:2px;} /*NEWS TOGGLE -----------------*/ #content ul#mostpopnews-toggle {margin-left:0; margin-bottom:0;} ul#mostpopnews-toggle li {list-style:none; float:left; margin-left:0; margin-bottom:0; color:white;} ul#mostpopnews-toggle li a {display:block; padding:5px 5px; background-color:#403E2F; color:white;} ul#mostpopnews-toggle li.lastmonth a {padding-left:2px; text-decoration:none; color:#D8D2A2; } ul#mostpopnews-toggle li.alltime a {background-color:#D8D2A2; text-decoration:none; color:#403E2F; } #one {background-color:#403E2F; padding:5px;} #one li {color:#D8D2A2;} #one li a {color:#D8D2A2;} #two {background-color:#D8D2A2; padding:5px;} #two li {color:#403E2F;} #two li a {color:#403E2F;} /* TAGLIST -----------------*/ #taglist {margin-bottom:10px;} /* MULTIMEDIA SIDEBAR ----------------------------*/ #multisidebar {width:344px; float:right; padding:2px; margin-left:10px; background-color:#000000;} #multisidebar {color:white;} /*----------------------------------------------------------------- -------------------GALLERY ----------------------------------------- -------------------------------------------------------------------*/ #gallery-albumview {} #gallery-albumview ul {list-style:none; margin-left:0;} #gallery-albumview li {float:left; list-style:none;} #gallery-albumview li a {display:block; margin:10px; padding:3px; border:2px solid #D8D2A2; background-color:white; } #gallery-albumview li a:hover {border:2px solid #F25800;} #gallery-catdescription {} #gallery-catdescription p {text-align:center; font-style:oblique;} #caption {width:600px; margin: 0 auto;} /* NAV ----------------*/ .firstlevel {margin-left:0px; margin-bottom:5px; font-weight:bold;} .secondlevel {margin-left:15px; margin-bottom:5px;} /* EVENT CALENDAR ------------------*/ .calendarBG {width:100%; border:1px solid #333;} .calendarBlank {background-color: #EFE5A4;} .calendarBG td {font-size:1.2em; border:1px solid #333; padding:2px; margin:0;} .calendarHeader {font-size:1.6em; font-weight: bold; color: #fff; text-align: center; background-color: #f15800;} .calendarHeader a {color:white !important;} .calendarHeader a:visited {color:white !important;} .calendarDayHeading {font-weight: bold; font-size: 11px; color: #fff; background-color: #787A79; text-align: center; vertical-align: middle;} .calendarToday {font-weight: bold; text-decoration: none; text-align: center; vertical-align: top; color: white; background-color: #f15800; font-size:1.2em;} .calendarToday a {color:white;} .calendarCell {text-align: center; vertical-align: top; background-color: #D8D2A2; font-size:1.2em; width:14.28%;} .calendarentry {margin-bottom:10px;} body#calendar-home #main {width:900px;} #sidebar-events dl dt {float:left; font-size:1.3em; text-transform:uppercase; text-align:center;} #sidebar-events dl dt span {font-size:1.1em;} #sidebar-events dd {margin-left:55px;} #sidebar-events dd a {font-weight:bold; font-size:1.4em; } /* FAQs (entryid=19) -----------------------*/ #static-19 #main h2 {background-color:#F25800; padding:2px; color:white;} #static-19 #main h2 a {color:white;} /* RESOURCES (entryid=60) -----------------------*/ #static-60 #main h2 {background-color:#F25800; padding:2px; color:white;} #static-60 #main h2 a {color:white;} /* STATIC INNER GALLERY --------------------*/ #sidebar-gallery {} #sidebar-gallery ul {margin:0; margin-left:-5px;} #sidebar-gallery ul li {float:left; list-style:none; margin-left:5px; margin-bottom:5px;} #sidebar-gallery img {border:1px solid #4c4b39; background-color: #FFFFFF; padding: 3px;} #sidebar h2 a {color:white;} /*SLIDESHOW*/ #myGallery { width: 342px; height: 257px; } .jdGallery .slideInfoZone p {font-size: 120% !important;} .jdGallery a {text-decoration:none !important;} /* GENERAL TABLE CODE -----------------------------*/ table {width:100%; border-collapse:collapse;} /* PETITION FORM ----------------------*/ #roadsign-petition label {display:block; font-size:1.2em; font-weight:bold; margin-bottom:5px; } #roadsign-petition input {margin-bottom:10px;} #roadsign-petition textarea {margin-bottom:10px; width:300px; height:100px;} /* PETITION TABLE -----------------------------*/ #roadsign-petition-table th {text-align:left; font-size:1.2em; border:1px solid black; padding:2px; background-color:#F15500; color:white;} #roadsign-petition-table td {font-size:1.2em; border:1px solid black; padding:2px; margin:0;} #roadsign-petition-table th#count {width:50px;} #roadsign-petition-table th#date {width:100px;} /* PETITION ADVERT ------------------------------*/ #petition-advert {background:#F15500 url(http://www.maropeng.co.za/maropengtheme/images/star.png) no-repeat 2px 2px; color:white; padding:2px; padding-left:20px;} #petition-advert p {margin-bottom:0;} #petition-advert a {color:white;} .newscol {width:205px; margin-right:5px; float:left;} .strong {font-weight:bold;} #news-headlines {min-height:264px;position: relative;} #promocolumns {position:absolute;bottom: 5px;}