|
Server : Apache/2.4.62 System : FreeBSD fbsdweb2.web.rcn.net 14.1-RELEASE FreeBSD 14.1-RELEASE releng/14.1-n267679-10e31f0946d8 GENERIC amd64 User : www ( 80) PHP Version : 8.3.8 Disable Function : NONE Directory : /domains/klengineers/css/ |
Upload File : |
/*-------- Table of Contents --------------
1. Global, Redefine Default HTML
2. Page Layout
2.1 Header
2.2 Body
2.3 Footer
3. Main Nav Tabs
4. Sub Navigation
5. Section Specific wells, etc.
--------------------------------------------
*/
/* --- 1. Global, Redefine Default HTML ----- */
body {
margin: 0px;
padding: 0px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px; font-weight:normal;
background-color: #FFFFFF;
behavior: url(/includes/hover.htc); /* This allows css hover effects to work in ie6. Needed for tabs and drop-downs */
}
a:link, a:visited {
color: #0088cc;
text-decoration: none;
}
a:hover {
color: #0ca3ee;
text-decoration: underline;
}
p {
line-height: 18px;
margin: 12px 0px;
padding: 0px;
color: #414141;
}
h1 {
font-size: 20px;
color: #666;
line-height: 24px;
margin: 24px 0px 12px 0px;
letter-spacing: 1px;
}
h2 {
font-size: 18px;
color: #666;
font-weight: normal;
margin: 24px 0px 12px 0px;
display: block;
}
h3 {
font-size: 16px;
color: #666;
font-weight: normal;
margin: 24px 0px 12px 0px;
display: block;
}
h4 {
font-size: 14px;
color: #666;
font-weight: normal;
margin: 24px 0px 12px 0px;
}
ul {
margin-left: 30px; padding: 0px;
}
li {
margin: 4px 0px 4px 0px;
}
form {
padding: 0px;
margin: 0px;
}
.search-box {
width: 180px;
margin: 0px auto;
}
.search-box .search-field {
width: 150px;
height: 18px;
border: 1px solid #CCC;
font-size: 11px;
float: left;
}
.search-box img {
float: left;
}
/* --- 2. Page Layout ------------- */
#page-wrapper {
width: 100%;
}
/* -------- 2.1. Header ------------- */
#header {
margin: 0px auto;
}
#header-left {
width: 250px;
float: left;
text-align: center;
}
.logo {
margin: 0px;
}
.byline {
margin: 45px 20px 25px 20px;
text-align: right;
}
#header-right #header-right-top {
height: 96px;
}
#header-right #header-right-bottom {
}
#header-right #top-nav {
position: absolute;
width: 255px;
right: 0px;
background-color: #CCCCCC;
}
#header-right #top-nav-inner {
margin: 10px 0px 0px 30px;
}
#header-right #top-nav a {
padding: 2px 14px 2px 4px;
text-decoration: none;
display: inline-block;
background: url(../images/nav-arrow.png) no-repeat right;
}
/* -------- 2.2. Body Area -------- */
#sidebar {
float: left;
width: 230px;
background-color: #EDEDED;
margin: 0px 0px 20px 0px;
overflow: hidden;
}
#maincontent {
float: left;
width: 730px;
background-color: #EDEDED;
margin: 0px 0px 20px 0px;
}
#maincontent .inner {
margin: 20px;
}
/* -------- 2.3 Footer -------- */
.footer-wrapper {
width: 100%;
clear: both;
border-top: 1px solid #CCCCCC;
background: url(/images/footer-bg.png) repeat-x;
}
.footer {
width: 980px;
margin: 20px auto;
overflow: hidden;
}
.footer-left {
margin: 0px;
}
.footer-right {
text-align: right;
margin: 20px;
}
.gray {
color: #999;
}
.footer-links {
margin-left: -6px;
}
.footer-links a {
padding: 2px 6px 2px 6px;
}
/* --- 3. Main Nav Tabs ------------- */
#nav-bar {
line-height:normal;
width: auto;
margin-left: 130px;
z-index: 1000;
position: relative;
}
#nav-bar ul {
margin:0;
padding:0px 10px 0px 7px;
list-style:none;
width: auto;
}
#nav-bar li {
float:left;
margin: 0px 1px 0px 1px;
padding:0 0 0 0px;
}
#nav-bar a {
float:left;
padding:6px 20px 6px 20px;
text-decoration:none;
font-weight:normal;
color:#666;
font-size: 12px;
text-transform: uppercase;
display: block;
}
#nav-bar > ul a {width:auto;}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#nav-bar a {float:none;}
/* End IE5-Mac hack */
#nav-bar a:hover {
color:#333;
}
#nav-bar #current {
background-position:0 -150px;
border-width:0;
}
#nav-bar #current a {
background-position:100% -150px;
color:#999;
}
#nav-bar li:hover, #nav-bar li:hover a {
background-position:0% -150px;
color:#333;
background: #EDEDED;
}
#nav-bar li:hover a {
background-position:100% -150px;
}
/* Main Nav Drop Downs */
#nav, #nav ul {
background-image: none;
margin: 0px 0px 0px 0px;
padding: 0px;
position: relative;
}
/* -- 1st Level Drop down --*/
#nav li ul {
position: absolute;
left: -999em;
height: auto;
width: 200px;
w\idth: 200px;
font-weight: normal;
margin: 0px 0px 0px -4px;
padding-bottom: 4px;
padding-top: 4px;
border-bottom-width: 4px;
border-left-width: 4px;
border-right-width: 4px;
border-top-width: 0px;
border-style: solid;
border-color: #FFF;
background: #EDEDED;
}
#nav li li {
margin: 0px 4px 0px 4px;
width: 192px;
border-bottom: 1px dotted #CCC;
padding: 0;
background: transparent;
}
#nav li ul a, #nav-bar #current ul a{
font-size: 11px;
font-family: Arial, Helvetica, sans-serif;
padding: 6px;
text-transform: none;
display: block;
background: transparent;
color: #333;
}
#nav li ul a:hover {
background: #FFF;
}
/* -- 2nd Level Drop down, offset --*/
#nav li ul ul {
margin: -30px 0 0 190px;
border-top-width: 1px;
}
#nav ul li li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
left: -999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
left: auto;
}
#nav ul li:hover, #nav ul li.sfhover {
background: #FFF;
}
/*** arrows **/
#nav a.sf-with-ul {
padding-right: 36px;
min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
position: relative;
}
.sf-sub-indicator {
position: absolute;
display: block;
right: 15px;
top: 8px; /* IE6 only */
width: 10px;
height: 10px;
text-indent: -999em;
overflow: hidden;
background: url('/images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator { /* give all except IE6 the correct values */
top: 8px;
background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
background-position: -10px -100px; /* arrow hovers for modern browsers*/
}
/* point right for anchors in subs */
#nav ul .sf-sub-indicator { background-position: -10px 0; }
#nav ul a > .sf-sub-indicator { background-position: 0 0; top: 10px;}
/* apply hovers to modern browsers */
#nav ul a:focus > .sf-sub-indicator,
#nav ul a:hover > .sf-sub-indicator,
#nav ul a:active > .sf-sub-indicator,
#nav ul li:hover > a > .sf-sub-indicator,
#nav ul li.sfHover > a > .sf-sub-indicator {
background-position: -10px 0; /* arrow hovers for modern browsers*/
}
.splitcol { float: left; }
.splitcol-portfolio { float: left; }
/* --- 4. Sub Navigation ------------- */
.sub-nav {
line-height:normal;
overflow: hidden;
clear: both;
margin: 10px 0px 20px 0px;
background-color: #EDEDED;
border: 4px solid #FFF;
}
.sub-nav h3 {
margin: 0px 0px 6px 20px;
}
.sub-nav h3 a {
color:#866a53;
}
.sub-nav ul {
margin: 0px 0px 0px 0px;
padding:4px 0px 4px 0px;
list-style:none;
}
.sub-nav li {
margin:0px 6px 2px 6px;
padding:0 0 0 0px;
overflow: hidden;
height: 1%;
}
.sub-nav li a:link, .sub-nav li a:visited {
display: block;
text-decoration:none;
margin: 0px;
padding: 10px 10px 10px 10px;
background-repeat:repeat-x;
background-position: bottom;
overflow: hidden;
color:#0088cc;
font-size: 11px;
}
.sub-nav li a:hover {
background-color: #FFF;
}
.sub-nav ul ul {
padding: 0px 0px 6px 15px;
margin: 0px;
border: none;
}
.sub-nav li.current {
margin:0px 6px 2px 6px;
}
.sub-nav li.current a {
background-color: #FFF;
color:#333;
}
.sub-nav li.current a:link, .sub-nav li.current a:visited { color: #333;}
.sub-nav li li {
background-color: none;
border: none;
margin: 0px;
}
.sub-nav li ul li {
padding-left: 0px;
}
.sub-nav li ul li a:link, .sub-nav li ul li a:visited {
background: none;
padding: 6px 2px 6px 12px;
}
.sub-nav li ul li a:hover {
background-color: #FFF;
}
.sub-nav li.current li a:link, .sub-nav li.current li a:visited { background: none; color:#866a53; }
.sub-nav li.current li a:hover { background-color:#FFF; }
/* --- 4. Section Specific, wells, etc. ------------- */
/* Home Page */
#home-banner{
background: url(/images/pagebg-home.png) repeat-x;
overflow: hidden;
}
#banner-wrapper {
position: relative;
width: 1001px;
background-color: #333333;
color: #999999;
text-align: center;
margin: 0px auto 5px auto;
z-index: 0;
}
.caption {
z-index: 1000; position: absolute; bottom: 375px; left: 0px;
background:black; margin: 0; padding: 20px;
color: #ccc;
text-align: left;
overflow: hidden;
}
.photo_caption {
z-index: 1000; position: absolute; bottom: 0px; left: 0px;
background:black;
opacity: .75;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=75)";
filter:alpha(opacity=75);
margin: 0;
padding: 10px;
color: #ccc;
text-align: left;
overflow: hidden;
font-size: 10px;
line-height: 1.3em;
}
#home-content {
margin: 20px auto 20px auto;
}
.well-home h3 {
font-size: 14px;
padding: 4px 4px 4px 4px;
display: block;
margin-top: 0px;
background: #EDEDED url(/images/arrow-h3.png) no-repeat 5px 5px;
}
.well-home h3 a:link, .well-home h3 a:visited {display: block; padding-left: 16px; }
.well-home h2 {
font-size: 20px;
display: block;
}
#banner-nav {
width: 100%;
margin: 1px auto;
overflow: hidden;
}
#ban-nav {
display: inline-block;
margin: 3px auto 5px auto;
overflow: hidden;
text-align: center;
}
#ban-nav a {
display: block;
width: 30px;
height: 10px;
border: 1px solid #CCC;
float: left;
margin: 4px;
background-color: #FFF;
color: #FFF;
overflow: hidden;
}
#ban-nav a:hover, #ban-nav a.activeSlide {
background-color: #666;
}
#ban-nav a:focus { outline: none; }
/* Sub Page */
#content {
background: url(/images/pagebg-sub.png) repeat-x;
overflow: hidden;
margin: 0px auto 20px auto;
width: 100%;
}
#change-type {
}
#change-type .change-type-link {
position: absolute;
background: #999999 url(/images/changetype-arrow.png) no-repeat right;
color: #FFF;
display: inline;
padding: 3px 23px 3px 8px;
right: 0px;
top: 0px;
border-radius: 3px;
-moz-border-radius: 3px;
color: #FFF;
text-decoration: none;
}
#changetype-box {
position: absolute;
width: 500px;
display: none;
left: 226px;
top: 0px;
}
#changetype-box ul {
position: absolute;
width: 200px;
height: auto;
font-weight: normal;
margin: 0px 0px 0px -4px;
padding-bottom: 4px;
padding-top: 4px;
padding-left: 0px;
border-bottom-width: 4px;
border-left-width: 4px;
border-right-width: 4px;
border-top-width: 4px;
border-style: solid;
border-color: #FFF;
background: #EDEDED;
list-style-type: none;
}
#changetype-box li {
margin: 0px 4px 0px 4px;
width: 192px;
border-bottom: 1px dotted #CCC;
padding: 0;
display: block;
background: transparent;
}
#changetype-box li a:link, #changetype-box li a:visited{
font-size: 11px;
font-family: Arial, Helvetica, sans-serif;
padding: 6px;
text-transform: none;
display: block;
background: transparent;
color: #333;
}
#changetype-box ul a:hover {
background: #FFF;
}
.sidebar-well {
position: relative;
z-index: 6000;
}
#slideshow-wrapper {
margin-top: 20px;
position: relative;
z-index: 0;
}
.slide {
display: none;
width: auto;
}
.slide img {
display: block;
}
.first {
display: block;
width: auto;
}
.slides {display: none;}
.slideshow {
background-color: #333;
width: 718px; height: 360px; overflow: hidden;
position: relative;
}
#slideshow-nav {
display: inline-block;
margin: 10px auto;
overflow: hidden;
text-align: center;
}
#slideshow-nav a {
width: 20px;
height: 8px;
border: 1px solid #CCC;
float: left;
margin: 4px;
background-color: #FFF;
color: #FFF;
overflow: hidden;
}
#slideshow-nav a:hover, #slideshow-nav a.activeSlide {
background-color: #666;
}
#slideshow-nav a:focus { outline: none; }
.content-box1 {
border: 1px solid #CCC;
padding: 15px;
margin: 10px 0px;
}
.content-box1 .thumb, .img {
float: left;
margin: 0px 20px 0px 0px;
}
.content-box1 h3 {
margin: 0px 0px 0px 0px;
}
.portfolio-list .last {
margin-right: 0px;
}
.portfolio-list {
}
.portfolio-list .item {
/* padding: 0px; */
margin: 20px 0px 0px 20px;
width: 223px;
height: 175px;
float: left;
}
.portfolio-list .item a {
display: block;
}
.portfolio-list .item a:hover {
text-decoration: none;
}
.portfolio-list .first {
margin: 20px 0px 0px 0px !important;
clear: left;
}
.portfolio-list .item .thumb {
margin: 10px 0px 0px 0px;
border: none;
}
.portfolio-list .item .title {
display: block;
line-height: 18px;
font-size: 12px;
font-weight: normal;
margin: 10px 10px 0px 0px;
}
.portfolio-list .item .title span {
background: url(/images/arrow-blue.png) no-repeat right bottom;
padding-right: 20px;
}
.portfolio-list .item h3 a {
text-decoration: none;
}
.portfolio-list .item p {
margin: 6px 10px 6px 10px;
}
.grid-border {
border: 1px solid #CCC;
padding: 10px;
}
.grid-border h3, .grid-border h2, .grid-border h4{
}
.banner-image {
margin: 5px 0px 15px 0px;
}
.locations {
border: 1px solid #CCC;
padding: 15px;
margin: 10px 0px;
}
.locations .content {
width: 300px;
float: left;
margin: 0px 20px 0px 0px;
}
.locations .content_contact {
width: 210px;
float: left;
}
.locations .map {
width: 363px;
height: 260px;
float: left;
margin: 0px 0px 0px 0px;
background: #333; color: #FFF;
}
.locations h3 {
margin: 0px 0px 0px 0px;
}
/* herbs box styles | start */
.box-gray, .box-info, .box-error, .box-notice, .box-success {padding:.8em;margin-bottom:1em;border:2px solid #ddd;}
.box-gray{background:#EDEDED;color:#444444;border-color:#CCCCCC;}
.box-gray .img_panel{
float:left;
overflow:hidden;
margin:5px;
width:120px;
}
.box-info {background:#E0ECFF;color:#444444;border-color:#7799BB;}
.box-error {background:#FBE3E4;color:#8a1f11;border-color:#FBC2C4;}
.box-notice {background:#FFF6BF;color:#514721;border-color:#FFD324;}
.box-success {background:#E6EFC2;color:#264409;border-color:#C6D880;}
.box-error a {color:#8a1f11;}
.box-notice a {color:#514721;}
.box-success a {color:#264409;}
/* herbs box styles | stop */
.image-right {width: 360px; float: right; margin: 20px 0px 20px 20px;}
#banner-nav123 {
width: 100%;
margin: 1px auto;
overflow: hidden;
float:left;
}
#ban-nav123 {
display: inline-block;
margin: 0 300px 0 0;
overflow: hidden;
text-align: center;
float:right;
}
#ban-nav123 a {
display: block;
width: 30px;
height: 10px;
border: 1px solid #CCC;
float: right;
margin: 4px;
background-color: #FFF;
color: #FFF;
overflow: hidden;
}
#ban-nav123 a:hover, #ban-nav123 a.activeSlide {
background-color: #666;
}
#ban-nav123 a:focus { outline: none; }