No-one offered me their assistance
I have no CSS knowledge but I did eventually manage to change the style to what I want (through persistance, backwards engineering, and trial and error!
).
-
THE NEW CSS CODE FOR STYLE-1
- Code: Select all
.gkTabItemSpace{ padding-left: 25px; padding-right: 25px; padding-bottom: 15px; padding-top: 0px }
.gkTab { position: relative; }
.gkTabWrap { margin: 0 auto; border: 1px solid #e8e8e8!important; border-bottom-color: #e1e1e1 !important; -moz-border-radius-topleft: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-bottom-left-radius: 10px; -webkit-border-top-right-radius: 10px;
-webkit-border-bottom-right-radius: 10px; -moz-border-radius-topright: 10px; -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; }
ul.gkTabs { margin:0!important; padding: 0!important; background: url('../images/style1/bg.png') repeat-x 0 0 !important; height:42px; border-left: 0px solid #ffffff!important; border-right: 1px solid #6b9735!important; border-bottom-color: #e1e1e1 !important;
-moz-border-radius-topright: 10px; -webkit-border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; -webkit-border-top-right-radius: 10px; }
ul.gkTabs li { list-style-type: none; position: relative; line-height: 42px !important; margin: 0 !important; padding: 0 20px!important; border: none !important; border-right: 2px groove #85aa57!important; background: none!important; float: left; cursor: pointer;
font-weight: bold; color: #f3f5ef; }
ul.gkTabs li:hover,
ul.gkTabs li.active { background: #fff !important; color: #6ba228 !important; }
ul.gkTabs li:hover:first-child,
ul.gkTabs li.active:first-child { -moz-border-radius-topleft: 10px; -webkit-border-top-left-radius: 10px; border-radius-topright: 10px; }
.gkTabContainer0 { clear: both; }
.gkTabContainer1 { overflow: hidden; }
.gkTabItem { float: left; overflow: hidden; padding: 26px 0; text-align: justify; }
.gkTabButtonNext,
.gkTabButtonPrev { width: 18px; height: 18px; background: url('../images/style1/b_next.png') no-repeat 0 0; cursor: pointer; position: absolute; top: 43%; right: 0; text-indent:-999em; }
.gkTabButtonPrev { background: url('../images/style1/b_prev.png') no-repeat 0 0; left: 0; right:inherit; }
.gkTabButtonNext:hover,
.gkTabButtonPrev:hover { background-position: 100% 0; }
.gkTabContainer0,
.gkTabContainer1,
.gkTabContainer2 { position:relative; }
.gkTabItem { position: absolute; left: -999em; top: 0; width: 100%; }
.gkTabItem.active { position: static; left: 0; }
-
THE RESULT
New Look_2011-08-26-2.jpg