My main body background image isn't working correctly..need some CSS help

Posted on 2010-04-03
Medium Priority
Last Modified: 2012-05-09
Hi There,
I have tried to add a background image to the main content of my site here:


and the homepage here:


Problem is its not really working...the curves are wrong and doesn't shape up correctly and not only that but it runs out on the longer pages as shown in the links above

This is the thread that began the process....Can someone please help me to get it right?
Question by:Amanda Watson
  • 8
  • 5

Expert Comment

ID: 29646978
How about just adding the attribute 'style="background-image:jpg.jpg"' in the places you want. For example: <div style="background-image:jpg.jpg"> and then just position it how you need?

Expert Comment

by:Greg Gamble
ID: 29674529
Are you trying to add the shadow effect and rounded corners?
LVL 11

Author Comment

by:Amanda Watson
ID: 29708853
I really just want to add the rounded corners that is all.  I don't really want the shadow at all, but I am trying to find an IE compliant way of adding the white rounded corner affect to the maincontent...thats all
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

LVL 11

Author Comment

by:Amanda Watson
ID: 29709705
Right so I tried this here
#maincontent-block {padding: 15px 20px; background:transparent url(../images/dialog-white.png) no-repeat top right;}

and the image isn't what I want to use at all so somehow need to get the rounded corners at the top and bottom and it will work...so I probably need to add some divs to the to and bottom?

can anyone help?
LVL 11

Author Comment

by:Amanda Watson
ID: 29710230
I really would like to simply copy the rounded modules style with a white background...I just can't seem to see where to do this?

Expert Comment

by:Greg Gamble
ID: 29715682
What you need to use is the JQuery "Corners" plug-in.

LVL 11

Author Comment

by:Amanda Watson
ID: 29723204
Can you please be more specific maybe with some steps that I need to do.

What do I need to add to my template (index.php)
What do I need to add to the css.

Here is the index.php and the template_css.css
/* This is the Main template logo, Edit this to match the width and height of your new logo image */
#logo {width: 225px;height: 74px;}

/* Template custom fonts */
@font-face {font-family: "Moxy Header";src: url(../fonts/Titillium-Regular.eot);}
@font-face {font-family: "Moxy Header";src: url(../fonts/Titillium-Bold.eot);font-weight: bold;}
@font-face {font-family: Moxy;src: url(../fonts/Aller-Regular.eot);}
@font-face {font-family: Moxy;src: url(../fonts/Aller-Italic.eot);font-style:italic;}
@font-face {font-family: Moxy;src: url(../fonts/Aller-Bold.eot);font-weight:bold;}
@font-face {font-family: Moxy;src: url(../fonts/Aller-BoldItalic.eot);font-weight:bold;font-style:italic;}
@font-face {font-family: Bebas;src: url(../fonts/Bebas.eot);}
@font-face {font-family: Continuum;src: url(../fonts/Continuum-Regular.eot);}
@font-face {font-family: Continuum;src: url(../fonts/Continuum-Bold.eot);font-weight:bold;}
@font-face {font-family: lizzielongstocking;src: url(../fonts/lizzielongstocking.eot);}
@font-face {font-family: handsean;src: url(../fonts/handsean.eot);}
@font-face {font-family: "Moxy Header";src:local("Titillium Regular"), url(../fonts/Titillium-Regular.otf) format("opentype");}
@font-face {font-family: "Moxy Header";src:local("Titillium Bold"), url(../fonts/Titillium-Bold.otf) format("opentype");font-weight: bold;}
@font-face {font-family: Moxy;src:local("Aller Regular"), url(../fonts/Aller-Regular.ttf) format("truetype");}
@font-face {font-family: Moxy;src:local("Aller Italic"), url(../fonts/Aller-Italic.ttf) format("truetype");font-style:italic;}
@font-face {font-family: Moxy;src:local("Aller Bold"), url(../fonts/Aller-Bold.ttf) format("truetype");font-weight:bold;}
@font-face {font-family: Moxy;src:local("Aller Bold Italic"), url(../fonts/Aller-BoldItalic.ttf) format("truetype");font-weight:bold;font-style:italic;}
@font-face {font-family: "Bebas";src:local("Bebas"), url(../fonts/Bebas.ttf) format("truetype");}
@font-face {font-family: "Continuum";src:local("Continuum"), url(../fonts/Continuum-Regular.ttf) format("truetype");}
@font-face {font-family: "Continuum";src:local("Continuum"), url(../fonts/Continuum-Bold.ttf) format("truetype");font-weight:bold;}
@font-face {font-family: "Lizzie";src:local("Lizzy"), url(../fonts/lizzielongstocking.ttf) format("truetype");}
@font-face {font-family: "handsean";src:local("Jennifer"), url(../fonts/handsean.ttf) format("truetype")}

/* Font Family Settings */
#ff-moxy, a.moxy, #ff-moxy #horiz-menu li li span {font-family: Helvetica,Arial,sans-serif;}
#ff-moxy #horiz-menu li span, #ff-moxy .date-block, #ff-moxy h1, #ff-moxy h2, #ff-moxy h3, #ff-moxy h4, #ff-moxy h5, #ff-moxy .roktabs-links {font-family: Moxy,Helvetica,Arial,sans-serif;}
#ff-bebas, a.bebas, #ff-bebas #horiz-menu li li span, #ff-bebas h3.showtext {font-family: Helvetica,Arial,sans-serif;}
#ff-bebas .date-block, #ff-bebas h1, #ff-bebas h2, #ff-bebas h3, #ff-bebas h4, #ff-bebas h5 {font-family: Bebas,Helvetica,Arial,sans-serif;}
#ff-continuum, a.continuum, #ff-continuum #horiz-menu li li span, #ff-continuum h3.showtext {font-family: Helvetica,Arial,sans-serif;}
#ff-continuum .date-block, #ff-continuum h1, #ff-continuum h2, #ff-continuum h3, #ff-continuum h4, #ff-continuum h5 {font-family: Continuum,Helvetica,Arial,sans-serif;}
#ff-optima, a.optima {font-family: Optima, Lucida, 'MgOpen Cosmetica', 'Lucida Sans Unicode', sans-serif;}
#ff-geneva, a.geneva {font-family: Geneva, Tahoma, "Nimbus Sans L", sans-serif;}
#ff-helvetica, a.helvetica {font-family: Helvetica, Arial, FreeSans, sans-serif;}
#ff-lucida, a.lucida {font-family: "Lucida Grande",Helvetica,Verdana,sans-serif;}
#ff-georgia, a.georgia {font-family: Georgia, sans-serif;}
#ff-trebuchet, a.trebuchet {font-family: "Trebuchet MS", sans-serif;}
#ff-palatino, a.palatino {font-family: "Palatino Linotype", "Book Antiqua", Palatino, "Times New Roman", Times, serif;}
input {font-family: Helvetica,Arial,sans-serif;}
#ff-georgia #horiz-menu .menutop li li .item, #ff-optima #horiz-menu .menutop li li .item {font-size: 12px;}

/* Core Formatting */
html {height: 100%;margin-bottom: 1px;}
body {margin: 0;line-height: 135%;}
form {margin: 0;padding: 0;}
body.f-small, body#ff-optima.f-small, body#ff-georgia.f-small {font-size: 11px;}
body, body.f-default {font-size: 12px;}
body#ff-optima, body#ff-optima.f-default {font-size: 13px; background:transparent url(../images/header/style1/bg.jpg) left top repeat-x;
body#ff-georgia, body#ff-georgia.f-default {font-size: 13px;}
body.f-large, body#ff-optima.f-large, body#ff-georgia.f-large {font-size: 14px;}
p {margin-top: 10px;margin-bottom: 15px;}
h1, h2, h3, h4, h5 {padding-bottom: 5px;margin: 25px 0 10px 0;font-weight: normal;line-height: 135%;}
h1 {font-size: 270%;line-height: 100%;}
h2 {font-size: 120%;line-height: 100%;}
h3 {font-size: 195%;}
h4 {font-size: 120%;line-height: 130%;}
h5 {font-size: 120%;text-transform: uppercase;}
a {text-decoration: none;}
a:hover {text-decoration: underline;}
.clr, .clear {clear: both;font-size: 10;}
.rokradios, .rokchecks {padding: 1px 5px 5px 22px;line-height: 120%;}

/* Header */
.banner-module .moduletable {margin: 0;padding: 0 20px;float: right;}
#logo {float: left;margin: 0 25px 0 20px;}
.logo-module {width: 275px;float: left;overflow: hidden;}
.logo-module .moduletable {clear: both;}
.banner-module, .feature-module {overflow: hidden;}

/* Horizontal Menu */
#horiz-menu {display: block;}
#horiz-menu .padding {padding: 0 20px;}
#horiz-menu ul.level1 {float: right;}
#horiz-menu ul {float: left;}
#horizmenu-surround {position: relative;float:right;}

/* Showcase */
#showcase-section {position: relative;overflow: hidden; padding-top:40px;}
#showmodules {margin-top: 25px;}
#showmodules a {font-weight: bold;}
#showmodules .feature-desc {font-size: 17px;line-height: 135%;}
#showmodules .module-inner, .feature-module .module-inner {padding: 6px 20px;}
#showcase-section .rokstories-layout3 .feature-block .desc-container {width:97%;left:10px;bottom: 10px;font-size: 140%;background-color:transparent;}
#showcase-section .rokstories-layout3 .feature-block .desc-container .description {left:15px;}
#showcase-section .rokstories-layout3 .feature-circles {margin: 12px 0 0 0;}
#showcase-section .feature-circles-sub span {display: none;}
#showcase-section .feature-circles-sub {width:10px;height:10px;margin: 0 5px;cursor:pointer;display:inline-block;}
.module-top, .module-bottom, .feature-block-top, .feature-block-bottom {margin: 0 9px;position: relative;height: 9px;}
.module-top2, .module-top3, .module-bottom2, .module-bottom3, .feature-block-top2, .feature-block-top3, .feature-block-bottom2, .feature-block-bottom3 {position: absolute;width: 9px;height: 9px;}
.module-top2, .feature-block-top2 {top: 0;left: -9px;}
.module-top3, .feature-block-top3 {top: 0;right: -9px;}
.module-bottom2, .feature-block-bottom2 {bottom: 0;left: -9px;}
.module-bottom3, .feature-block-bottom3 {bottom: 0;right: -9px;}

/* Top Bar */
#top-bar .moduletable {margin: 0;}
#top-bar .padding {padding: 10px 20px;}
#topleft-mod {width: 45%;float: left;line-height: 180%;}
#topright-mod {width: 45%;float: right;line-height: 180%;}
#accessibility {height: 16px;float: right;margin-left: 10px;}
.textsizer-desc {display: block;float: left;text-align: left;margin-right: 12px;font-size: 12px;font-weight: bold;line-height: 26px;}
#accessibility a {text-decoration: none; cursor: pointer;}
#accessibility #buttons {float: left;height:12px;overflow:hidden;margin-top: 5px;}
#accessibility .button {display: block;float: right;width: 11px;height: 12px;}
#accessibility a.small .button {margin-right: 8px;}

/* Main Layout */
#main-body {padding-top: 0px}
.colmask {clear:both;overflow:hidden;position:relative;width:100%;}
.col1wrap {padding-bottom:2em;}
#maincol {position: relative;}
.wrapper {position:relative;}
#main-content a, #main-content .separator, #main-content .item {font-weight: normal;}

/* s-c-s (Sidebar-Content-Sidebar) */
.s-c-s .colmid {float:left;position:relative;width:200%;}
.s-c-s .colright {float:left;left:50%;position:relative;width:100%;}
.s-c-s .col1wrap {float:right;position:relative;right:100%;width:50%;padding-bottom:1em;}
.s-c-s .col1pad {overflow:hidden;}
.s-c-s .col1 {overflow:hidden;width:100%;}
.s-c-s .col2 {float:left;position:relative;overflow:hidden;margin-left:-50%;}
.s-c-s .col3 {float:left;position:relative;overflow:hidden;left:0;}

/* s-c-x (Sidebar-Content) */
.s-c-x .colright {float:left;position:relative;width:200%;}
.s-c-x .col1wrap {float:right;padding-bottom:1em;position:relative;width:50%;}
.s-c-x .col1 {overflow:hidden;position:relative;right:100%;}
.s-c-x .col2 {float:left;position:relative;}

/* x-c-s (Content-Sidebar) */
.x-c-s .colright {float:left;position:relative;right:100%;width:200%;}
.x-c-s .col1wrap {float:left;left:50%;padding-bottom:1em;position:relative;width:50%;}
.x-c-s .col1 {overflow:hidden;}
.x-c-s .col3 {float:right;position:relative;}

/* RokAjaxSearch */
#searchmod {width: 270px;float: right;margin-right: 15px;}
#searchmod .moduletable {padding: 0;}
#searchmod h3 {font-size: 14px;margin: 0 0 10px 5px;padding: 0;}
#searchmod-surround {height: 26px;}
#searchmod-surround .inputbox {background: none;border: 0;padding: 6px 0 5px 6px;font-size: 14px;height:16px;width: 98%;outline: none;}
#searchmod-surround .search_options {display: block;margin-top: 8px;}
#roksearch_search_str {width: 150px;}
#roksearch_search_str.loading {background: transparent url(../images/spinner.gif) no-repeat scroll 97% 50% !important}
#roksearch_results {z-index: 10000;position: absolute;width: 400px;float: right;margin-top: -1px;text-align: left;visibility: hidden;}
#roksearch_results a#roksearch_link {float: right;padding-right: 5px;margin-top: 3px;display: block;height: 18px;width: 18px;}
#roksearch_results h3 {margin-top: 0;margin-bottom: 0;line-height: 110%;font-size: 120%;padding-bottom: 0;}
#roksearch_results span {display: block;line-height: 130%;font-size: 90%;}
#roksearch_results .container-wrapper {overflow: hidden;}
#roksearch_results .page {float: left;}
#roksearch_results .roksearch_header, #roksearch_results .roksearch_row_btm {padding: 10px;line-height: 100%;text-transform: uppercase;font-weight: normal;font-size: 100%;}
#roksearch_results .roksearch_row_btm {overflow: hidden;border-bottom: 0;}
#roksearch_results .roksearch_row_btm span {line-height: 140%;}
#roksearch_results span.small {display: inline-block;margin-top: 2px;margin-bottom: 7px;font-size: 10px;}
#roksearch_results span.highlight {display: inline;}
#roksearch_results a.clr {font-size: 100%;}
#roksearch_results a:hover {text-decoration: none;}
#roksearch_results .roksearch_odd {padding: 15px;position: relative;}
#roksearch_results .roksearch_even {padding: 15px;position: relative;}
#roksearch_results .roksearch_odd-hover h3, #roksearch_results .roksearch_even-hover h3 {padding-left: 12px;}
.results ol.list {padding-left: 30px;margin-top: 0;}
.results ol.list h4 {border: 0;margin-top: 0;margin-bottom: 0;}
.results ol.list li {padding: 10px 5px;margin-bottom: 5px;}
.results ol.list li p {margin-top: 0;}
#roksearch_results .container-arrows {height: 12px;width: 30px;float: left;margin-right: 5px;position: relative;}
#roksearch_results .arrow-left, #roksearch_results .arrow-left-disabled, #roksearch_results .arrow-right, #roksearch_results .arrow-right-disabled {width: 12px;height: 12px;position: absolute;top: 0;}
#roksearch_results .arrow-left {left: 0;cursor: pointer;}
#roksearch_results .arrow-left-disabled {left: 0;}
#roksearch_results .arrow-right {left: 18px;cursor: pointer;}
#roksearch_results .arrow-right-disabled {left: 18px;}
#roksearch_results .viewall span {line-height: 100%;}
#roksearch_results a.viewall {float: left;margin-right: 5px;}
#roksearch_results .estimated_res, #roksearch_results .pagination_res {font-size: 9px;font-style: italic;text-transform: none;float:left;}
#roksearch_results .pagination_res {font-style: normal;float: right;font-size: 11px;margin-top: -1px;}
#roksearch_results .powered-by-google {text-transform: lowercase;font-style: italic;font-size: 9px;}
.roksearch_wrapper4.google-search .roksearch_odd, .roksearch_wrapper4.google-search .roksearch_even {height: 110px;}
form.search_result input.button {border: 0;background: none;cursor: pointer;padding-top: 3px;line-height: 10px;}
form.search_result fieldset {padding: 15px 0;}
.search-results-full .readon-wrap1 {margin-top: 0;}
form.search_result input#search_searchword.inputbox {padding: 6px 0 1px 5px;font-size: 14px;line-height: 22px;height:19px;width: 100%;margin-bottom: 10px;width: 300px;}
form.search_result fieldset.word {margin-top: 0;margin-bottom: 0;padding: 10px 0 25px 0;}
form.search_result fieldset.phrase {margin-top: 5px;margin-bottom: 0;padding: 10px 0 35px 0;}
form.search_result fieldset.word label, form.search_result legend {font-size: 120%;display: block;height: 26px;margin: 0;padding: 0;}
.search-results-full h3 {margin-top: 10px;padding: 0;margin-bottom: 0;font-size: 130%;}
form.search_result .display {float: left;margin-left: 20px;height: 20px;margin-top: 5px;}
#roksearch_results .google-search a#roksearch_link {margin-top: 5px;}

/* Main Page Structure */
#maincontent-block {padding: 15px 20px; background:transparent url(../images/dialog-white.png) no-repeat top right;}
#inset-block-right {float: right;}
#inset-block-left {float: left;}
table.mainbody, table.blog {width: 100%;border: 0;padding: 0;}
.spacer .block {float: left;}

/* Main Body Items */
#breadcrumbs {margin: 0px 0 10px 0;display: block;position:relative;overflow: hidden;height: 20px;padding: 5px 20px;}
#breadcrumbs-home {width: 22px;height: 23px;display: block;float: left;}
#breadcrumbs h3 {display: none;}
span.breadcrumbs {display: block;font-size:90%;font-weight: bold;overflow: hidden; color:#5A010F;}
span.breadcrumbs img {width: 12px;height: 23px;float: left;}
span.breadcrumbs a, span.no-link {padding: 0 8px;float: left;display: block;height: 23px;line-height: 20px;}
span.breadcrumbs span.no-link {font-weight: bold;}
span.breadcrumbs a:hover {text-decoration: none;}
.contentheading {font-size: 200%;line-height: 140%;margin: 0 0 15px 0;padding: 0 0 5px 0;}
#maincol .contentheading a {font-weight: normal;}
p.buttonheading {float: right;margin: 0 0 15px 15px;}
.buttonheading .icon {display:block;width:14px;height:12px;float:left;margin-left:6px;}
.article-info-surround {padding: 0;margin: 0;overflow: hidden;}
p.articleinfo, .iteminfo {margin: 0;font-size: 13px;line-height: 140%;}
.iteminfo {display: block;float: left;}
p.pageinfo {padding: 2px 5px;margin-top: 0;display: block;}
.article-ratings {padding: 2px 5px;margin-top: 25px;}
span.modifydate, span.createdby, span.createdate {display: block;}
p.counter {text-indent: 5px;}
div.pagination {height: 22px;line-height: 22px;margin-top: 10px;margin-bottom: 15px;}
div.pagination div.tab {float: left;margin-right: 6px;}
div.pagination div.tab2 {padding: 0 8px;}
div.pagination div.page-block {padding: 0 4px;float: left;margin-right: 6px;}
.cols1 {display: block;float: none;margin: 0;}
.cols2 {width: 46%;}
.cols3 {width: 30%;}
.column1, .column2 {margin: 0 5px 0 0;position: relative;}
.column2, .column1 {float: left;margin: 0;}
.column2 {float: right;margin: 0;width: 49%;}
.article_row {margin: 0 0 25px 0;padding: 0;overflow: hidden;}
.blog .leading {margin-bottom: 25px;}
.leading_separator {display: none;}
.blog_more {padding-top: 15px;}
#page {padding-bottom: 15px;}
.componentheading {margin: 0 0 15px 0;font-size: 180%;font-weight: bold;line-height: 130%;padding: 0;font-family: Bebas, Helvetica,Arial,sans-serif;}
#main-content .date1 {font-size: 150%;line-height: 20px;display: block;float: left;margin-right: 5px;}
#main-content .date2 {font-size: 110%;float: left;line-height: 20px;margin-left: 5px;}
#top-bar .date-block {line-height: 24px;}
#top-bar .date1 {font-size: 16px;display: block;float: left;margin-right: 5px;font-weight: bold;}
#top-bar .date2, #top-bar .date3, #top-bar .date4 {font-size: 14px;float: left;margin-left: 5px;}
.date-div {padding-right: 8px;}
.article-info-right {float: right;}
.article-info-left {margin-bottom: 5px;}
.createdby {font-weight: bold;margin-bottom: 5px;text-align: right;}

/* Main Body Modules */
.moduletable h3 {margin-top: 0;font-size: 160%;}
.module-inner {position: relative;z-index: 4;padding: 15px 20px;}
#inset-block-right .mainblock-module, #inset-block-left .mainblock-module {padding-bottom: 10px;}
#showmodules, #featuremodules, #mainmodules, #mainmodules2, #mainmodules3, #mainmodules4, #mainmodules5 {overflow: hidden;}
#mainmodules4 a, #mainmodules5 a {font-weight: bold;}
.spacer.w99 .block {width: 99.8%;}
.spacer.w49 .block {width: 99.8%;}
.spacer.w33 .block {width: 33.3%;}
.moduletable {padding: 15px 20px;margin-bottom: 5px;}
.round .module-surround, .round2 .module-surround, .round3 .module-surround, .round4 .module-surround, .round5 .module-surround, .square .module-surround, .square2 .module-surround, .square3 .module-surround, .square4 .module-surround, .square5 .module-surround {position: relative;padding: 0;z-index: 1;}
.round .module-grad, .round2 .module-grad, .round3 .module-grad, .round4 .module-grad, .round5 .module-grad, .square .module-grad, .square2 .module-grad, .square3 .module-grad, .square4 .module-grad, .square5 .module-grad {position: absolute;top: 0;left: 0;width: 100%;height: 55px;z-index: 2;}
.round .module-surround2, .round2 .module-surround2, .round3 .module-surround2, .round4 .module-surround2, .round5 .module-surround2, .round .module-surround3, .round2 .module-surround3, .round3 .module-surround3, .round4 .module-surround3, .round5 .module-surround3 {position: absolute;height: 55px;width: 12px;z-index: 4;}
.round .module-surround4, .round2 .module-surround4, .round3 .module-surround4, .round4 .module-surround4, .round5 .module-surround4, .round .module-surround5, .round2 .module-surround5, .round3 .module-surround5, .round4 .module-surround5, .round5 .module-surround5 {position: absolute;height: 12px;width: 12px;z-index: 4;}
.round .module-surround2, .round2 .module-surround2, .round3 .module-surround2, .round4 .module-surround2, .round5 .module-surround2 {top: -1px;left: -1px;}
.round .module-surround3, .round2 .module-surround3, .round3 .module-surround3, .round4 .module-surround3, .round5 .module-surround3 {top: -1px;right: -1px;}
.round .module-surround4, .round2 .module-surround4, .round3 .module-surround4, .round4 .module-surround4, .round5 .module-surround4 {bottom: -1px;left: -1px;}
.round .module-surround5, .round2 .module-surround5, .round3 .module-surround5, .round4 .module-surround5, .round5 .module-surround5 {bottom: -1px;right: -1px;}

/* Extra Joomla Elements */
span.small, .modifydate {font-size: 90%;}
.sectiontableheader {font-weight: bold;padding: 3px;line-height: 25px;text-align: left;}
.sectiontablefooter {padding-bottom: 8px;}
tr.sectiontableentry0 td, tr.sectiontableentry1 td, tr.sectiontableentry2 td, td.sectiontableentry0, td.sectiontableentry1, td.sectiontableentry2 {text-align: left;padding: 4px 5px 4px 5px;vertical-align: middle;}
tr.sectiontableentry0 td, td.sectiontableentry0, tr.sectiontableentry1 td, td.sectiontableentry1, tr.sectiontableentry2 td, td.sectiontableentry2 {height: 30px;}
.contentpane, .contentpaneopen {width: 100%;}
.moduletable fieldset {border: 0;}
.moduletable h4 {margin-top: 0;}
table.contenttoc {float: right;margin-left: 25px;}
.weblinks .contentdescription {overflow: hidden;margin-bottom: 15px;padding: 15px 0;}
.weblinks-img {float: left;}
.weblinks-link {margin-left: 25px;}
.weblinks-img img {margin-top: 3px;}
.contact_email input.button {border: 0;background: none;}
.contact_email .readon-wrap1 {margin-top: 0;}
.contact-name {font-weight: bold;font-size: 140%;display: block;padding: 15px 0 2px 0;}
.contact-position {display: block;padding-bottom: 15px;}
.intro-article-content .article_separator {display: none;}
.contact .icon {float: left; width: 40px;}
.contact .misc, .contact .webpage, .contact .mobile, .contact .email, .contact .telephone, .contact .fax, .contact .country, .contact .state, .contact .postcode, .contact .suburb, .contact .street-address {overflow: hidden;}
.contact .other .surround {margin-top: 5px;}
.contact .vcard {margin-top: 15px;}
input#contact_name.inputbox, input#contact_email.inputbox, input#contact_subject.inputbox {padding: 1px 0 1px 5px;font-size: 14px;line-height: 22px;height:22px;width: 100%;margin-bottom: 10px;width: 300px;}
textarea#contact_text.inputbox {padding: 5px;margin-bottom: 10px;}
#main-content .inputbox.invalid {border: 1px solid #cc0000;}

/* Side Menus */
#main-body ul.menu {margin: 0;padding: 0;}
#main-body ul.menu li {list-style: none;margin: 0;padding: 0;float: none;}
#main-body ul.menu a:hover, #main-body ul.menu .separator:hover, #main-body ul.menu .item:hover {text-decoration: none;}
#main-body ul.menu span {display: block;}
#main-body ul.menu li.active.parent li .item span, #main-body ul.menu li.parent li .item span, #main-body ul.menu li.active.parent li a span, #main-body ul.menu li.parent li a span, #main-body ul.menu li.active.parent li .separator span, #main-body ul.menu li.parent li .separator span {font-size: 110%;line-height: 110%;}
#main-body ul.menu li.active.parent li, #main-body ul.menu li.parent li {padding-left: 20px;}
#main-body ul.menu a, #main-body ul.menu .separator, #main-body ul.menu .item {display: block;text-indent: 0;overflow: hidden;font-size: 120%;float: none;}
#main-body ul.menu a, #main-body ul.menu .separator, #main-body ul.menu .item {padding: 9px 20px 9px 20px;}
#main-body ul.menu a, #main-body ul.menu .separator, #main-body ul.menu .item {font-weight: normal;}
#main-body ul.menu li.active > a, #main-body ul.menu li.active > .separator, #main-body ul.menu li.active > .item {font-weight: bold;}
#main-body ul.menu ul ul {padding: 0; margin: 0;}
#main-body ul.menu li li {padding: 0;margin: 0;font-size: 10px;background: none;}
#main-body .round2 ul.menu li li, #main-body .round3 ul.menu li li, #main-body .round4 ul.menu li li, #main-body .round5 ul.menu li li, #main-body .square2 ul.menu li li, #main-body .square3 ul.menu li li, #main-body .square4 ul.menu li li, #main-body .square5 ul.menu li li {background: none;}
#main-body ul.menu li.active.parent ul {margin: 0;padding: 5px 0 15px 0;}
#main-body ul.menu li.active.parent ul li.active.parent ul {padding: 5px 0;}
#main-body ul.menu li.active {padding: 0;}
#main-body .menu .subtext em {line-height: 14px;}
#main-body .menu em {display: block;font-size:80%;font-style: normal;font-weight: normal;}

/* Extra Content Styles */
a.nounder {text-decoration: none;border: 0;cursor: pointer;}
a.nounder:hover {text-decoration: none;}
fieldset {margin:10px 0 20px 0;border:0;}
fieldset.input, a img, body .pollstableborder {border: 0;}
table.pollstableborder {width: 100%;}
.pollstableborder th {font-size: 130%;text-align: left;}
.pollstableborder td.td_1, .pollstableborder td.td_2 {width:20%;}
.pollstableborder td.td_3 {width: 60%;}
.pollstableborder td div {border-width: 5px;border-style:solid; background: transparent;}
legend {font-size:120%;}
form.poll fieldset {margin: 0 0 10px 0;padding: 0;}
.moduletable h4.poll-title {margin: 0;padding: 0;font-size: 120%;}
.moduletable .poll-line {padding: 9px 5px 11px 5px;font-size: 110%;}
.moduletable .poll-buttons {padding: 0 15px 0 15px;overflow: hidden;width: 130px;margin: 0 auto;}
form.poll input.button {background: none;cursor:pointer;border: none;text-align: center;line-height: 20px;height: 20px;margin-bottom: 5px;float: left;padding: 0;}
.vote-button-wrap .readon-wrap1 {margin-left: 15px;}
form.poll a.results:hover {text-decoration: none;}
img.content-left {float: left;margin-right: 10px;padding: 5px;}
img.content-right {float: right;margin-left: 10px;padding: 5px;}
.back_button {margin-top: 20px;margin-bottom: 10px;}
.tool-tip {padding: 4px;z-index:5000;background:#fbf3ad;color:#333;border:2px solid #f8e639;font-size:90%;}
.bannergroup .clr {clear: none !important;}
.bannergroup .banneritem {margin-bottom: 10px;}
dl.poll dt {border-bottom:solid 1px #ccc;font-weight: bold;}
dl.poll dd {padding:6px 0;margin-left: 0;}
.polls_color_1 {background:#000;}
.polls_color_2 {background:#aaa;}
.polls_color_3 {background:#93246F;}
.polls_color_4 {background:#000;}
.polls_color_5 {background:#ccc;}
.polls_color_6 {background:#93246F;}
#main-content .poll {padding-top: 15px;}
.newsfeeds-default .article-info-surround {margin-top: 10px;}
ul.latestnews, ul.mostread, .blog_more ul, .block ul#mainlevel-nav, .featured-text-block ul {margin: 0;padding: 0;}
ul.latestnews li, ul.mostread li, .blog_more ul li, .block ul#mainlevel-nav li, .featured-text-block li {list-style: none;margin-bottom: 6px;padding-bottom: 6px;padding-left: 5px;}
ul.latestnews li a, ul.mostread li a, .blog_more ul li a, .block ul#mainlevel-nav li a, .featured-text-block ul li a {font-weight: bold;font-size: 110%;display: block;padding-left: 15px;}
.bannergroup_text .bannerheader {font-size: 120%;font-weight: bold;margin-bottom: 15px;}
.bannergroup_text .banneritem_text {margin-bottom: 15px;}
.bannergroup_text .banneritem_text a {font-weight: bold;}
.contentdescription {padding:10px 0;overflow:hidden;}
.image_left {float:left;margin:0 10px 10px 0;}
.image_right {float:right;margin:0 0 10px 10px;}

/* Editor Form Overrides */
#main-content form.editor {padding:0;margin:0;}
#main-content form.editor {color:#333;}
#main-content form.editor input, #main-content form.editor textarea {border:1px solid #ccc;}
#main-content form.editor fieldset a {color: #00c;}
#main-content form.editor fieldset {padding:10px; border: 1px solid #ccc;}
#main-content form.editor legend {font-size:120%;margin:15px 0;padding:0 10px;font-weight:bold;}
#main-content form.editor label {display:block;width: 120px;float:left;}
#main-content form.editor div.radio label {display:inline;width:auto;float:none;}

/* Login Styles */
form.form-login p {margin: 0;}
form.form-login .inputbox, input#email, .register-page .inputbox {padding: 5px 0 5px 5px;font-size: 14px;width: 300px;margin-bottom: 10px;display: block;}
.main-login-form form.form-login .inputbox {width: 97%;}
form.form-login .login-links {margin-bottom: 8px;margin-top: 8px;}
form.form-login .login-links a {padding-left: 15px;}
form.form-login input.button, form.log input.button {background: none;cursor:pointer;border: none;text-align: center;line-height: 20px;height: 20px;margin-bottom: 5px;float: left;padding: 0;}
form.form-login fieldset {padding: 0;}
form.log .readon-wrap1 {margin-top: 5px;}
input.button {font-size: 100%;cursor: pointer;padding: 3px 5px;}
form.form-login span.username-label, form.form-login span.password-label {display: block;text-transform: uppercase;margin-bottom: 1px;padding-left: 2px;}
.register-page input.button, form.josForm input.validate {background: none;border: 0;}
.register-page div.name, .register-page div.user, .register-page div.email, .register-page div.pass, .register-page div.verify_pass {text-align: left;}
form#josForm.form-validate.user, .edit-user-form {float: left;overflow: hidden;padding-bottom: 15px;}
.edit-user-form {padding-top: 15px;}
.register-page fieldset {margin-bottom: 15px;margin-top: 0;padding-bottom: 15px;}
div.user_name {margin-bottom: 10px;}
div.user_name span {font-weight: bold;font-size: 110%;}
.user-params {margin-bottom: 20px;}
.user-params td.paramlist_key {width: auto;}
.edit-user-button {margin: 0 auto;width: 80px;}
.remember-me {margin-top: 5px;margin-bottom: 5px;}
form.form-login .readon-wrap1 {margin-top: 5px;}
a#rokbox-close {height: 20px;width: 20px;}
form.josForm label.hasTip {display: block;float: left;height: 25px;line-height: 25px;margin-right: 5px}

/* Bottom Section */
#bottom {margin: 0;}
#top-button {width: 90px;height: 20px;text-align: center;line-height: 22px;font-weight: bold;font-size: 12px;margin: 0 auto;}
#top-button a:hover {text-decoration: none;}
.top-button-spacer {height: 15px;}
.copyright-block {margin: 15px 0;padding: 15px 0 0 0;position: relative; display:none;}
.footer-div {height: 2px;width: 100%;position: absolute;top: 0;left: 0;}
#copyright {margin: 0 auto;text-align: center;line-height: 200%;}
#rocket {width: 111px;height: 16px;display: block;margin: 0 auto;}
#debug-mod {padding: 15px;}
#bottom ul {margin: 0;padding-left: 10px;list-style: none;}
#bottom ul li a {padding-left: 10px;padding-bottom: 5px;display: block;}
#bottom ul li:hover a {text-decoration: none;}
#footer {position: relative;overflow: hidden;}
.footer-mod {padding: 15px 0;}
#footer a {font-weight: bold;}
#mainmodules3 a {font-weight: bold;}
#bottom .moduletable {padding: 15px;}

/* RokTabs */
.roktabs-wrapper {padding: 0;position: relative;margin: 0;}
.round .roktabs-wrapper, .round2 .roktabs-wrapper, .round3 .roktabs-wrapper, .round4 .roktabs-wrapper, .round5 .roktabs-wrapper, .square .roktabs-wrapper, .square2 .roktabs-wrapper, .square3 .roktabs-wrapper, .square4 .roktabs-wrapper, .square5 .roktabs-wrapper {margin: -15px 0;}
.roktabs {position: relative;z-index: 3;}
.roktabs-wrapper .roktabs-container-inner {position:relative;overflow: hidden;}
.roktabs-wrapper .roktabs-container-wrapper {clear: both;position: relative;overflow:hidden;width:50000px;}
.roktabs-wrapper .roktabs-container-wrapper div {float: left;}
.roktabs-wrapper .roktabs-container-wrapper div.wrapper {padding: 15px 0;width: auto;}
.roktabs-wrapper .roktabs-links {margin: 0;padding: 0;height: 55px;overflow: hidden;}
.roktabs-wrapper .active-arrows .roktabs-links {margin: 0 20px;padding: 0;height: 55px;}
.roktabs-wrapper .roktabs-links ul {text-align: left;list-style-type: none;overflow:hidden;margin: 0;height: 55px;}
.roktabs-wrapper .roktabs-links ul li {float: left;padding: 0;margin: 0;text-decoration: none;position: relative;height: 55px;line-height: 42px;text-transform: lowercase;font-size: 110%;}
.tabs-bottom .roktabs-links ul li {line-height: 42px;}
.roktabs-wrapper .roktabs-links ul li span {padding: 0 11px;display: block;height: 55px;}
.roktabs-wrapper .roktabs-links ul {padding: 0;}
.roktabs-wrapper .roktabs-scroller {position: absolute;bottom: 0;right: 0;height: 50px;}
.roktabs-wrapper .arrow-next, .roktabs-wrapper .arrow-prev {line-height: 20px;text-align: center;cursor: pointer;z-index: 2;position: absolute;top: 17px;height:9px;width: 7px;}
.roktabs-wrapper .arrow-next {right: 0;}
.roktabs-wrapper .arrow-prev {left: 0;}
.roktabs-wrapper .arrow-prev span, .roktabs-wrapper .arrow-next span {display: none;}
.tabs-hidden .roktabs-container-wrapper div.wrapper {margin-top: 10px;}

/* RokStories */
.feature-module .feature-block .readon-wrap1 span {height: 21px; line-height: 21px;}
.feature-module .rokstories-layout3 .description .feature-title { line-height: 130%; height: 130%; margin-bottom: 5px;}
.feature-block .image-full {margin: 0px auto;}
.rokstories-tip {z-index: 1000;}

/* RSS Feeds */
ul.newsfeed {margin: 0;padding: 0;}
a.newsfeed-title {text-transform: uppercase;font-weight: bold;}
ul.newsfeed li {list-style: none;padding-left: 12px;margin-bottom: 12px;}
ul.newsfeed li a {font-weight: bold;font-size: 120%;}
ul.newsfeed .newsfeed-div {display: block;padding-bottom: 1px;}

/* Typography */
.readon-wrap1 {margin-top: 15px;position:relative;float:left;}
.readon-wrap1 span {display:block;height: 22px;line-height: 20px;}
a.readon {font-weight: bold;}
a.readon-main {font-size: 12px;cursor: pointer;font-weight: bold;}
a.readon-main:hover {text-decoration: none;}
.readon1-l {position:absolute;width: 8px;height: 21px;left:0;top:0;}
.readon1-m {margin-left: 8px;text-align: center;padding-left:2px;}
.readon1-r, #showcase-section .feature-module .readon1-r {margin-right: -8px;padding-right: 10px;}
.readon-wrap1 input.button {font-weight: bold;}
#main-body .round .readon1-l, #main-body .square .readon1-l {background-position: 0 -32px;}
#main-body .round .readon1-m, #main-body .square .readon1-m {background-position: 0 -32px;}
#main-body .round .readon1-r, #main-body .square .readon1-r {background-position: 100% -32px;}
#main-body .round2 .readon1-l, #main-body .square2 .readon1-l {background-position: 0 -64px;}
#main-body .round2 .readon1-m, #main-body .square2 .readon1-m {background-position: 0 -64px;}
#main-body .round2 .readon1-r, #main-body .square2 .readon1-r {background-position: 100% -64px;}
#main-body .round3 .readon1-l, #main-body .square3 .readon1-l {background-position: 0 -96px;}
#main-body .round3 .readon1-m, #main-body .square3 .readon1-m {background-position: 0 -96px;}
#main-body .round3 .readon1-r, #main-body .square3 .readon1-r {background-position: 100% -96px;}
#main-body .round4 .readon1-l, #main-body .square4 .readon1-l {background-position: 0 -161px;}
#main-body .round4 .readon1-m, #main-body .square4 .readon1-m {background-position: 0 -161px;}
#main-body .round4 .readon1-r, #main-body .square4 .readon1-r {background-position: 100% -161px;}
#main-body .round5 .readon1-l, #main-body .square5 .readon1-l {background-position: 0 -193px;}
#main-body .round5 .readon1-m, #main-body .square5 .readon1-m {background-position: 0 -193px;}
#main-body .round5 .readon1-r, #main-body .square5 .readon1-r {background-position: 100% -193px;}
ul.tablist {margin: 0;padding: 0;}
ul.tablist li {list-style: none;margin-bottom: 20px;padding-left: 85px;position: relative;}
ul.tablist li span.tabtext {display: block;position: absolute;left: 0;top: 0;font-weight: bold;text-transform: uppercase;font-size: 12px;width: 70px;height: 30px;line-height: 30px;text-align: center;padding-right: 5px;}

/* RokQuickCart*/
#main-content .cart_product_grad, #main-content .cart_grad {position: absolute;top: 0;left: 0;width: 100%;height: 55px;z-index: 2;}
#main-content .cart_product_sur1, #main-content .cart_product_sur2, #main-content .cart_sur1, #main-content .cart_sur2 {position: absolute;height: 55px;width: 12px;z-index: 4;}
#main-content .cart_product_sur3, #main-content .cart_product_sur4, #main-content .cart_sur3, #main-content .cart_sur4 {position: absolute;height: 12px;width: 12px;z-index: 4;}
#main-content .cart_product_sur1, #main-content .cart_sur1 {top: -1px;left: -1px;}
#main-content .cart_product_sur2, #main-content .cart_sur2 {top: -1px;right: -1px;}
#main-content .cart_product_sur3, #main-content .cart_sur3 {bottom: -1px;left: -1px;}
#main-content .cart_product_sur4, #main-content .cart_sur4 {bottom: -1px;right: -1px;}
#main-content .cart_padding {padding: 15px 20px;}
#main-content .cart_yourcart {overflow: visible;}
#main-content .cart_yourcart_items {border: 0;z-index: 5;}
#main-content .cart_quickcart, #main-content .cart_quickcart h2 {margin-top: 0;}

/* Demo Tutorials */
pre {overflow: auto;}
.tutorial-block .written-listing {background: url(../images/write-list.png) no-repeat 0 1px;float: left;width: 24%;margin-top: 15px;overflow: hidden;}
.tutorial-block .written-listing .content {padding: 0 15px;}
.tutorial-block .written-listing .desc {font-size: 85%;}
.tutorial-block .categories {background: url(../images/write-list.png) no-repeat 10px 2px;float: left;width: 288px;margin-top: 12px;overflow: hidden;}
.tutorial-block .categories-content {padding: 0 15px 0 25px;}
.body-dark img.demo {border: 5px solid #444;}
.body-light img.demo {border: 5px solid #ccc;}
.ext-block {margin-bottom: 20px;overflow: hidden;}
.ext-block .ext-img {float: left; margin-right: 20px; margin-bottom: 50px;}
.ext-block .ext-divider {height: 10px; display: block;}

/* Demo Frontpage Main Content */
.demo-main-left {float: left;width: 45%;}
.demo-main-right {float: right;width: 45%;}
.demo-main-divider {height: 100px;position: absolute;left: 50%;top: 32px;width: 2px;margin-left: -2px;}
.body-light .demo-main-divider {background: url(../images/body/light/assets-1.png) no-repeat 0px -126px;}
.body-dark .demo-main-divider {background: url(../images/body/dark/assets-1.png) no-repeat 0px -126px;}
.demo-submain-block {float: left;width: 25%;}
.demo-submain-text {width: 200px;margin: 0px auto;}
.demo-submain-img {margin-bottom: 10px;}
.body-light .demo-submain-img {border: 2px solid #ccc;}
.body-dark .demo-submain-img {border: 2px solid #262626;}
.demo-footer-block {float: left;width: 25%;margin-top: 25px;}
.demo-footer-text {margin: 0px 15px;}
.demo-footer-divider { height: 60px;float: left;width: 2px;margin-left: -2px;margin-top: 30px;}
.demo-footer-block .readon-wrap1 {margin-top: 0;}
.body-light .demo-footer-divider {background: url(../images/body/light/assets-1.png) no-repeat -268px -126px;}
.body-dark .demo-footer-divider {background: url(../images/body/dark/assets-1.png) no-repeat -268px -126px;}
.demo-footer-block ul.special-13 {margin-left: 0 !important;padding-left: 0 !important;margin-bottom: 0;}
.demo-footer-block ul.special-13 li {margin-bottom: 2px !important;}
.logo-list {text-transform: uppercase;font-size: 24px;list-style: none;font-family: "Trebuchet MS";margin: 0;}
.logo-list li {height: 35px;line-height: 35px;}
.logo-list a {margin: 0 0 0 12px;display: inline-block;color: #fff;text-shadow: -1px -1px 0 #333;}
.logo-list a span {margin-left: -12px;display: block;padding: 0 5px;}
.logo-list a:hover {text-decoration: none;}

h1, h2{font-family: Bebas, Helvetica,Arial,sans-serif;font-weight: bold;}
.moduletable h3{font-family: Bebas, Helvetica,Arial,sans-serif;font-weight: bold;}
/*li a {font-family:Bebas, Optima,Lucida,'MgOpen Cosmetica','Lucida Sans Unicode',sans-serif;}*/
.latestnewsround2 div span{display:block;margin-top:5px; font-weight: bold;}

Open in new window

LVL 11

Author Comment

by:Amanda Watson
ID: 29723268
// no direct access
defined( '_JEXEC' ) or die( 'Restricted index access' );
define( 'YOURBASEPATH', dirname(__FILE__) );
require( YOURBASEPATH.DS."styles.php");
require( YOURBASEPATH.DS."rt_styleswitcher.php");
JHTML::_( 'behavior.mootools' );
global $template_real_width, $leftcolumn_width, $rightcolumn_width, $tstyle;
global $js_compatibility, $menu_rows_per_column, $menu_columns, $menu_multicollevel;
global $header_style, $body_style, $menu_name;
global $f_enablejs, $f_enable_current, $f_subsoffset_top, $f_subsoffset_left, $f_vertical_animation;
global $f_vertical_duration, $f_horizontal_animation, $f_horizontal_duration, $sm_enable_current;

$live_site        		= $mainframe->getCfg('live_site');
$template_path 			= $this->baseurl . '/templates/' .  $this->template;

$preset_style 			= $this->params->get("presetStyle", "style1");
$header_style 			= $this->params->get("headerStyle", "style1");
$body_style 			= $this->params->get("bodyStyle", "light");

$frontpage_component    = $this->params->get("enableFrontpage", "show");
$enable_ie6warn         = ($this->params->get("enableIe6warn", 0)  == 0)?"false":"true";
$font_family            = $this->params->get("fontFamily", "optima");
$enable_fontspans       = ($this->params->get("enableFontspans", 1)  == 0)?"false":"true";
$enable_inputstyle		= ($this->params->get("enableInputstyle", 1) == 0)?"false":"true";
$inputs_exclusion		= $this->params->get("inputsExclusion", "'.content_vote'");

$template_width 		= $this->params->get("templateWidth", "982");
$leftcolumn_width		= $this->params->get("leftcolumnWidth", "260");
$rightcolumn_width		= $this->params->get("rightcolumnWidth", "260");
$leftinset_width		= $this->params->get("leftinsetWidth", "180");
$rightinset_width		= $this->params->get("rightinsetWidth", "180");
$splitmenu_col			= $this->params->get("splitmenuCol", "rightcol");
$menu_name 				= $this->params->get("menuName", "mainmenu");
$menu_type 				= $this->params->get("menuType", "fusion");
$default_font 			= $this->params->get("defaultFont", "default");
$show_logo		 		= ($this->params->get("showLogo", 1)  == 0)?"false":"true";
$show_textsizer			= ($this->params->get("showTextsizer", 1)  == 0)?"false":"true";
$show_date		 		= ($this->params->get("showDate", 0)  == 0)?"false":"true";
$clientside_date		= ($this->params->get("clientSideDate", 0) == 0)?"false":"true";
$show_topbutton 		= ($this->params->get("showTopbutton", 1)  == 0)?"false":"true";
$show_copyright 		= ($this->params->get("showCopyright", 1)  == 0)?"false":"true";
$copyright_text			= $this->params->get("copyrightText", "Copyright 2009, All Rights Reserved");
$js_compatibility	 	= ($this->params->get("jsCompatibility", 0)  == 0)?"false":"true";

// fusion menu
$f_enablejs             = ($this->params->get('roknavmenu_fusion_enable_js', 1) == 0)?"false":"true";
$f_opacity				= $this->params->get('roknavmenu_fusion_opacity', 1);
$f_effect				= $this->params->get('roknavmenu_fusion_effect', 'slidefade');
$f_hidedelay			= $this->params->get('roknavmenu_fusion_hidedelay', 500);
$f_menu_animation 		= $this->params->get('roknavmenu_fusion_menu_animation', 'Quad.easeOut');
$f_menu_duration	    = $this->params->get('roknavmenu_fusion_menu_duration', 400);
$f_pill		            = $this->params->get('roknavmenu_fusion_pill', 0);
$f_pill_animation 		= $this->params->get('roknavmenu_fusion_pill_animation', 'Back.easeOut');
$f_pill_duration 		= $this->params->get('roknavmenu_fusion_pill_duration', 400 );
$f_tweakInitial_x 		= $this->params->get('roknavmenu_fusion_tweakInitial_x', '0');
$f_tweakInitial_y 		= $this->params->get('roknavmenu_fusion_tweakInitial_y', '0');
$f_tweakSubsequent_x 	= $this->params->get('roknavmenu_fusion_tweakSubsequent_x', '0');
$f_tweakSubsequent_y 	= $this->params->get('roknavmenu_fusion_tweakSubsequent_y', '0');
$f_enable_current       = ($this->params->get('roknavmenu_fusion_enable_current_id', 0) == 0)?"false":"true";

// splitmenu
$sm_enable_current       = ($this->params->get('roknavmenu_splitmenu_enable_current_id', 0) == 0)?"false":"true";

require(YOURBASEPATH . "/rt_styleloader.php");


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
		<jdoc:include type="head" />
		require(YOURBASEPATH . DS . "rt_utils.php");
		require(YOURBASEPATH . DS . "rt_head_includes.php");
	<body id="ff-<?php echo $fontfamily; ?>" class="<?php echo $fontstyle; ?> <?php echo $tstyle; ?> body-<?php echo $body_style; ?> head-<?php echo $header_style; ?> <?php echo $pageclass; ?> iehandle">
	<!--Begin Header-->
	<div id="header-bg">
		<!--Begin Horizontal Menu-->
		<?php if($mtype != "none") : ?>
		<div id="horiz-menu" class="<?php echo $mtype; ?>">
			<div class="wrapper">
				<div class="padding">
					<div id="horizmenu-surround">
					<?php if($mtype != "module") : ?>
						<?php echo $topnav; ?>
					<?php else: ?>
						<jdoc:include type="modules" name="toolbar" style="none" />
					<?php endif; ?>
				<div class="clr"></div>
		<?php endif; ?>
		<!--End Horizontal Menu-->
		<!--Begin Showcase-->
		<?php $mClasses = modulesClasses('case1'); if ($this->countModules('showcase or showcase2 or showcase3') or $show_logo == "true" or $this->countModules('logo')) : ?>
		<div class="wrapper">
			<div id="showcase-section">
				<!--Begin Logo-->
				<?php if ($this->countModules('logo') or $this->countModules('logo2') or $show_logo="true") : ?>
				<div class="logo-module">
					<?php if ($this->countModules('logo')) : ?>
					<jdoc:include type="modules" name="logo" style="xhtml" />
					<?php elseif ($show_logo == "true") : ?>
					<a href="<?php echo $this->baseurl; ?>" id="logo"></a>
					<?php endif; ?>
					<?php if ($this->countModules('logo2')) : ?>
					<jdoc:include type="modules" name="logo2" style="xhtml" />
					<?php endif; ?>
				<?php endif; ?>
				<!--End Logo-->
				<?php if ($this->countModules('feature')) : ?>
				<div class="feature-module">
					<jdoc:include type="modules" name="feature" style="showcase" />
				<div class="clr"></div>
				<?php endif; ?>
				<?php if ($this->countModules('banner')) : ?>
				<div class="banner-module">
					<jdoc:include type="modules" name="banner" style="main" />
				<?php endif; ?>
				<div class="clr"></div>
				<?php $mClasses = modulesClasses('case1'); if ($this->countModules('showcase or showcase2 or showcase3')) : ?>
				<div id="showmodules" class="spacer<?php echo $showmod_width; ?>">
					<?php if ($this->countModules('showcase')) : ?>
					<div class="block <?php echo $mClasses['showcase'][0]; ?>">
						<jdoc:include type="modules" name="showcase" style="showcase" />
					<?php endif; ?>
					<?php if ($this->countModules('showcase2')) : ?>
					<div class="block <?php echo $mClasses['showcase2'][0]; ?>">
						<jdoc:include type="modules" name="showcase2" style="showcase" />
					<?php endif; ?>
					<?php if ($this->countModules('showcase3')) : ?>
					<div class="block <?php echo $mClasses['showcase3'][0]; ?>">
						<jdoc:include type="modules" name="showcase3" style="showcase" />
					<?php endif; ?>
				<?php endif; ?>
		<?php endif; ?>
		<!--End Showcase-->
	<!--End Header-->
	<!--Begin Top Bar-->
	<?php if ($show_textsizer=="true" or $show_date=="true" or $this->countModules('top-left or top-right or search')) : ?>
	<div id="top-bar">
		<div class="wrapper">
			<div class="padding">
				<!--Begin Top Left Tools-->
				<?php if ($this->countModules('top-left')) : ?>
				<div id="topleft-mod"><jdoc:include type="modules" name="top-left" style="xhtml" /></div>
				<?php elseif ($show_date == "true"): ?>
				<div class="date-block">
				    <?php $now = &JFactory::getDate(); ?>
					<span class="date1"><?php echo $now->toFormat('%A'); ?></span>
					<span class="date2"><?php echo $now->toFormat('%B'); ?></span>
					<span class="date3"><?php echo $now->toFormat('%d'); ?> ,</span>
					<span class="date4"><?php echo $now->toFormat('%Y'); ?></span>
				<?php endif; ?>
				<!--End Top Left Tools-->
				<!--Begin Top Right Tools-->
				<?php if ($this->countModules('top-right')) : ?>
				<div id="topright-mod"><jdoc:include type="modules" name="top-right" style="xhtml" /></div>
				<?php elseif ($show_textsizer=="true" or $this->countModules('search')) : ?>
				<?php if ($show_textsizer=="true") : ?>
				<div id="accessibility">
					<div class="textsizer-desc"><?php echo JText::_('TEXT_SIZE'); ?></div>
					<div id="buttons">
						<a href="<?php echo JROUTE::_($thisurl . "fontstyle=f-larger"); ?>" title="<?php echo JText::_('INC_FONT_SIZE'); ?>" class="large"><span class="button">&nbsp;</span></a>
						<a href="<?php echo JROUTE::_($thisurl . "fontstyle=f-smaller"); ?>" title="<?php echo JText::_('DEC_FONT_SIZE'); ?>" class="small"><span class="button">&nbsp;</span></a>
				<?php endif; ?>
				<?php if ($this->countModules('search')) : ?>
				<div id="searchmod"><jdoc:include type="modules" name="search" style="xhtml" /></div>
				<?php endif; ?>
				<?php endif; ?>
				<!--End Top Right Tools-->
				<div class="clr"></div>
	<?php endif; ?>
	<!--End Top Bar-->
	<!--Begin Main Body-->
	<div id="main-body">
		<div id="main-content" class="<?php echo $col_mode; ?>">
		    <div class="colmask leftmenu <?php if (rok_isIe(6)) echo 'wrapper'; ?>"><?php if (!rok_isIe(6)):?><div class="wrapper"><?php endif; ?>
		        <div class="colmid">
		    	    <div class="colright">
				       <!--Begin Main Column (col1wrap)-->   
					    <div class="col1wrap">
					        <div class="col1pad">
					            <div class="col1">
							        <div id="maincol">
										<?php if ($this->countModules('breadcrumb')) : ?>
    									<div id="breadcrumbs">
											<a href="<?php echo $this->baseurl; ?>" id="breadcrumbs-home"></a>
    										<jdoc:include type="modules" name="breadcrumb" style="none" />
    									<?php endif; ?>
										<?php $mClasses = modulesClasses('case2'); if ($this->countModules('user1 or user2 or user3')) : ?>
					<div id="mainmodules" class="spacer<?php echo $mainmod_width; ?>">
    										<?php if ($this->countModules('user1')) : ?>
    										<div class="block <?php echo $mClasses['user1'][0]; ?>">
    											<jdoc:include type="modules" name="user1" style="main" />
    										<?php endif; ?>
    										<?php if ($this->countModules('user2')) : ?>
    										<div class="block <?php echo $mClasses['user2'][0]; ?>">
    											<jdoc:include type="modules" name="user2" style="main" />
    										<?php endif; ?>
    										<?php if ($this->countModules('user3')) : ?>
    										<div class="block <?php echo $mClasses['user3'][0]; ?>">
    											<jdoc:include type="modules" name="user3" style="main" />
    										<?php endif; ?>
    									<?php endif; ?>
						<div class="bodycontent">
    										<?php if ($this->countModules('inset2') and !$editmode) : ?>
    										<div id="inset-block-right">
    											<jdoc:include type="modules" name="inset2" style="main" />
    										<?php endif; ?>
    										<?php if ($this->countModules('inset') and !$editmode) : ?>
    										<div id="inset-block-left">
    											<jdoc:include type="modules" name="inset" style="main" />
    										<?php endif; ?>
    										<div id="maincontent-block">
												<jdoc:include type="message" />
												<?php if (!($frontpage_component == 'hide' and JRequest::getVar('view') == 'frontpage')): ?>
												<jdoc:include type="component" />
												<?php endif; ?>
    									<div class="clr"></div>
       									<?php $mClasses = modulesClasses('case3'); if ($this->countModules('user4 or user5 or user6')) : ?>
       									<div id="mainmodules2" class="spacer<?php echo $mainmod2_width; ?>">
       										<?php if ($this->countModules('user4')) : ?>
       										<div class="block <?php echo $mClasses['user4'][0]; ?>">
       											<jdoc:include type="modules" name="user4" style="main" />
       										<?php endif; ?>
       										<?php if ($this->countModules('user5')) : ?>
       										<div class="block <?php echo $mClasses['user5'][0]; ?>">
       											<jdoc:include type="modules" name="user5" style="main" />
       										<?php endif; ?>
       										<?php if ($this->countModules('user6')) : ?>
       										<div class="block <?php echo $mClasses['user6'][0]; ?>">
       											<jdoc:include type="modules" name="user6" style="main" />
       										<?php endif; ?>
       									<?php endif; ?>

					    <!--End Main Column (col1wrap)-->
				        <!--Begin Left Column (col2)-->
				        <?php if ($leftcolumn_width != 0) : ?>
					    <div class="col2">
							<div id="leftcol">
								<?php if ($subnav and $splitmenu_col=="leftcol") : ?>
									<?php echo $subnav; ?>
								<?php endif; ?>
								<jdoc:include type="modules" name="left" style="main" />
								<?php if (!isset($active)) :?>
								<jdoc:include type="modules" name="inactive" style="main" />    
								<?php endif; ?>
					    <?php endif; ?> 
					    <!--End Left Column (col2)-->
					    <!--Begin Right Column (col3)-->
					    <?php if ($rightcolumn_width != 0) : ?>
					    <div class="col3">
							<div id="rightcol">
								<?php if ($subnav and $splitmenu_col=="rightcol") : ?>
								<div class="sidenav-block">
									<?php echo $subnav; ?>
								<?php endif; ?>
								<jdoc:include type="modules" name="right" style="main" />
					    <?php endif; ?> 
					    <!--End Right Column (col3)-->
			</div><?php if (!rok_isIe(6)):?></div><?php endif; ?>
		<!--Begin Main Bottom-->
		<?php $mClasses = modulesClasses('case5'); if ($this->countModules('user7 or user8 or user9')) : ?>
		<div id="bottom-main">
			<div class="wrapper">
				<div id="mainmodules3" class="spacer<?php echo $mainmod3_width; ?>">
					<?php if ($this->countModules('user7')) : ?>
					<div class="block <?php echo $mClasses['user7'][0]; ?>">
						<jdoc:include type="modules" name="user7" style="main" />
					<?php endif; ?>
					<?php if ($this->countModules('user8')) : ?>
					<div class="block <?php echo $mClasses['user8'][0]; ?>">
						<jdoc:include type="modules" name="user8" style="main" />
					<?php endif; ?>
					<?php if ($this->countModules('user9')) : ?>
					<div class="block <?php echo $mClasses['user9'][0]; ?>">
						<jdoc:include type="modules" name="user9" style="main" />
					<?php endif; ?>
		<?php endif; ?>	
		<!--End Main Bottom-->
	<!--End Main Body-->
	<!--Begin Bottom Section-->
	<?php $mClasses = modulesClasses('case4'); if ($this->countModules('bottom or bottom2 or bottom3')) : ?>
	<div id="bottom">
		<div class="wrapper">
			<div id="mainmodules4" class="spacer<?php echo $mainmod4_width; ?>">
				<?php if ($this->countModules('bottom')) : ?>
				<div class="block <?php echo $mClasses['bottom'][0]; ?>">
					<jdoc:include type="modules" name="bottom" style="main" />
				<?php endif; ?>
				<?php if ($this->countModules('bottom2')) : ?>
				<div class="block <?php echo $mClasses['bottom2'][0]; ?>">
					<jdoc:include type="modules" name="bottom2" style="main" />
				<?php endif; ?>
				<?php if ($this->countModules('bottom3')) : ?>
				<div class="block <?php echo $mClasses['bottom3'][0]; ?>">
					<jdoc:include type="modules" name="bottom3" style="main" />
				<?php endif; ?>
	<?php endif; ?>
	<!--End Bottom Section-->
	<!--Begin Footer-->
	<?php $mClasses = modulesClasses('case6'); if ($this->countModules('footer or footer2 or footer3 or footer4') or $show_copyright == "true" or $show_topbutton == "true") : ?>
	<div id="footer">
		<div class="wrapper">
			<?php $mClasses = modulesClasses('case6'); if ($this->countModules('footer or footer2 or footer3')) : ?>
			<div id="mainmodules5" class="spacer<?php echo $mainmod5_width; ?>">
				<?php if ($this->countModules('footer')) : ?>
				<div class="block <?php echo $mClasses['footer'][0]; ?>">
					<jdoc:include type="modules" name="footer" style="main" />
				<?php endif; ?>
				<?php if ($this->countModules('footer2')) : ?>
				<div class="block <?php echo $mClasses['footer2'][0]; ?>">
					<jdoc:include type="modules" name="footer2" style="main" />
				<?php endif; ?>
				<?php if ($this->countModules('footer3')) : ?>
				<div class="block <?php echo $mClasses['footer3'][0]; ?>">
					<jdoc:include type="modules" name="footer3" style="main" />
				<?php endif; ?>
			<?php endif; ?>
			<!--Begin Copyright Section-->
			<?php if ($this->countModules('footer4') or $show_copyright == "true" or $show_topbutton == "true") : ?>
			<div class="copyright-block">
			<?php if ($this->countModules('footer or footer2 or footer3')) : ?>
			<div class="footer-div"></div>
			<?php endif; ?>
			<?php if ($show_copyright == "true") : ?>
			<div id="copyright">
				&copy; <?php echo $copyright_text; ?>
			<?php else: ?>
			<div class="footer-mod">
				<jdoc:include type="modules" name="footer4" style="main" />
			<?php endif; ?>
			<?php endif; ?>
			<!--End Copyright Section-->
	<?php endif; ?>
	<!--End Footer-->	
	<?php if ($this->countModules('debug')) : ?>
	<div id="debug-mod"><jdoc:include type="modules" name="debug" style="none" /></div>
	<?php endif; ?>

Open in new window


Accepted Solution

Greg Gamble earned 2000 total points
ID: 29733107
This is a simple example.
<style type="text/css">
	.box  { width: 200px; padding: 20px; background: #ccc; text-align: center; font-size: 2em;}

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://github.com/malsup/corner/raw/master/jquery.corner.js?v2.09"></script>
	<script type="text/javascript">


		<div id="main">
			<div class="box">Round Corners</div>

Open in new window

LVL 11

Author Comment

by:Amanda Watson
ID: 29831931
Ah slight problem with this solution...it stops my rotating banner from working on the homepage...
Do you have any other solutions that don't use javascript?
I really need a solution that works on all pages and all browsers

Expert Comment

by:Greg Gamble
ID: 29860655
JQuery should not effect your code. Is the header a JavaScript rotator?

LVL 11

Author Comment

by:Amanda Watson
ID: 29863768
Its ok I found another solution thanks

Expert Comment

by:Greg Gamble
ID: 29868091
What was it??
LVL 11

Author Comment

by:Amanda Watson
ID: 29871743

Featured Post

The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

608 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question