html {width:100%; }
body {background:#d7d7d7; margin:0; padding:0; font-family:"Trebuchet MS", Verdana, Arial, "Times New Roman", serif; font-size:80%; color:#000000; width:100%; }
p {padding:0 0 15px 0; margin:0; line-height:140%; }
h1 {margin:0; padding:0; font-size:130%; font-weight:normal; }
h2 {margin:0; padding:0 0 20px 0; font-size:140%; font-weight:normal; }
/*link styling*/
a {color:#000000; text-decoration:underline; }
a:hover {text-decoration:none; }
#footer a {color:#637076; }
/*structural elements*/
.section {text-align:center; width:856px; margin:0 auto;}
#header {background:#d7d7d7; margin:0 auto; text-align:left; padding:0px 0px 0px 0px; width:856px;}
#container {margin:0 auto; text-align:left; padding:0px 0px 0px 0px; width:856px; min-height:350px; }
h1#logo { float:left; width:220px; text-align:center; min-height:24px;background-color:#d7d7d7; margin-top:10px; }
#content {background:#d7d7d7; padding:10px 20px 5px 20px; float:left; }
#content #sidenav {background:#d7d7d7 url("../images/navtop.png") no-repeat left top;float:left;width:200px; min-height:350px; text-align:left;}
#content #sidenav ul { padding:0px; float:left;list-style:none; margin:13px 0px 0px 0px; width:200px; font-size:120%;}
#content #sidenav li { list-style:none; width:200px; float:left; background:#d7d7d7 url("../images/navmid.png") repeat-y left top; margin:0px;}
#content #sidenav li a{ text-decoration:none; display:block; ;font-size:100%; width:180px; padding-left:20px;float:left;text-align:left; color:#ffffff;padding:5px 0px 5px 20px; margin:1px 0px 1px 0px;}
#content #sidenav li a:hover{ text-decoration:none; display:block; color:#0000ff; background:#d7d7d7 url("../images/navover.png") repeat-y left top;}
#content #sidenav li a.selected{ text-decoration:none; display:block;;font-size:100%; width:180px;float:left;text-align:left;text-decoration:none; display:block; color:#0000ff; padding-left:20px; background:#d7d7d7 url("../images/navover.png") repeat-y left top;}
#content #sidenav .end { background:#d7d7d7 url("../images/navbottom.png") repeat-y left bottom; height:23px; }
#content #sidenav li.telfax{ list-style:none; height:30px; line-height:30px; width:180px; float:left; background:#d7d7d7 url("../images/navmid.png") repeat-y left top; font-size:100%; color:#b3b3b3; padding-left:20px;}
#content #sidenav li.telfax_info{ list-style:none; height:30px; line-height:30px; width:180px; float:left; background:#d7d7d7 url("../images/navmid.png") repeat-y left top; font-size:100%; color:#ffffff; padding-left:20px;}
#content #inner{ float:left; margin:0 auto; width:600px;}
#content .maincontent { background:#ffffff url("../images/contenttop.png") repeat-x left top; min-height:300px;width:600px; float:left; }
#content .maincontent .maincontent_inner{margin-top:8px;min-height:300px; background:#ffffff url("../images/content_fill.png") repeat-y left; width:600px; float:left; }
#content .maincontent .maincontent_base{background:#ffffff url("../images/content_base.png") repeat-y left bottom; width:600px; float:left; }
#content .maincontent .maincontent_inner table {width:400px; border:none;}
#content .subcontent { background: url("../images/contenttop.png") repeat-x left top; min-height:80px;width:600px; float:left; }
#content .subcontent .subcontent_inner{margin-top:8px;min-height:10px; background:#ffffff url("../images/content_fill.png") repeat-y left; width:600px; float:left; min-height:30px; text-align:center;}
#content .subcontent .subcontent_inner span.keywords{min-width:140px; float:left; color:#0000FF; font-size:14px; font-weight:bold; text-align:center;}
#content .subcontent .subcontent_base{background:#ffffff url("../images/content_base.png") no-repeat left top; width:600px; float:left; height:23px; }
#content .logos { background:#d7d7d7; width:590px; float:left; min-height:90px; margin:5px auto; }
#content .logos { background:#d7d7d7; min-height:80px;width:600px; float:left; }
#content .logos .logos_inner{margin-top:8px;min-height:10px; background:#d7d7d7; width:600px; float:left; text-align:center; margin-left:-10px;}
#content .logos .logos_base{background:#d7d7d7; width:600px; float:left; height:14px; }
#content .logos img{ margin:0px 15px; }
#content .maincontent h2{margin:10px 0px 0px 10px; text-align:justify; padding:0px; font-size:200%; font-weight:bold; color:#0000FF;}
#content .maincontent p{margin:10px; width:570px; text-align:justify;}
#content .subcontent p{margin:0px 10px 0px 10px; width:570px; padding:8px 0px 5px 0px;}
#content .logos p{margin:10px;width:570px;}
.footer {width:600px; float:left; }
.footer p {border:none; font-size:100%; width:580px; color:#637076; text-align:right; color:#0000FF;}
/*section dependant style over-rides*/
ul#menu { }
ul#menu li {margin:0; padding:0; list-style:none; display:inline; }
ul#menu a {color:#FFFFFF; text-decoration:none; padding:10px 15px; }
#nav{background:#4E595F url('../images/body-bg.gif') repeat-x 0 0; height:34px;border-bottom:1px solid #637076;margin:0px auto 0px auto;}
#nav ul { list-style:none; margin:0px auto 0px auto; width:856px;background:#4E595F url('../images/body-bg.gif') repeat; border-left:1px solid #637076; border-right:1px solid #637076;}
#nav li { list-style:none; width:126px; display:inline;float:left;}
#nav li a{ text-decoration:none; display:block; padding:9px 0px 8px 0px;font-size:110%; width:126px;float:left;text-align:center; color:#ffffff;}
#nav li a:hover{ text-decoration:none; display:block; background-color:#E8EDF7;color:#0000ff;}
#nav li a.selected{ text-decoration:none; display:block; padding:9px 0px 8px 0px;font-size:110%; width:126px;float:left;text-align:center;text-decoration:none; display:block; background-color:#E8EDF7;color:#0000ff;}
#nav h3 {margin:0; padding:0 0 20px 0; color:#000000; font-size:120%; font-weight:bold; }
#nav p {padding:10px 0; border-top:1px solid #000000; }
.headerdiv{float:left; margin-left:10px;;}
/*This adds a little arrow under the menu item of the page you are on. (handy for navigation and usability)
To modify, edit the tag by changing the id.
e.g, if the page you are on is the contact page, change: to */
#home #homeLink,
#about #aboutLink,
#services #servicesLink,
#portfolio #portfolioLink,
#contact #contactLink
{background:url('../images/menu-a-bg.gif') no-repeat center bottom; }
/*just makes sure the content doesn't spill out the boxes, see http://www.positioniseverything.net/easyclearing.html for details*/
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
#myGallery, #myGallerySet, #flickrGallery
{
width: 560px;
height: 150px;
z-index:5;
border: 0px;
padding-left:25px;
margin-top:15px;
}
#flickrGallery
{
width: 500px;
height: 334px;
}
#myGallery img.thumbnail, #myGallerySet img.thumbnail
{
display: none;
}
.jdGallery
{
overflow: hidden;
position: relative;
}
.jdGallery img
{
border: 0;
margin: 0;
}
.jdGallery .slideElement
{
width: 100%;
height: 100%;
background-color: #cccc;
background-repeat: no-repeat;
background-position: center center;
background-image: url('img/loading-bar-black.gif');
}
.jdGallery .loadingElement
{
width: 100%;
height: 100%;
position: absolute;
left: 20px;
top: 0;
background-color: #000;
background-repeat: no-repeat;
background-position: center center;
background-image: url('img/loading-bar-black.gif');
}
.jdGallery .slideInfoZone
{
position: absolute;
z-index: 10;
width: 570px;
margin: 0px;
left: 0px;
bottom: 0;
height: 45px;
background: #3737ff;
color: #FFFFFF;
text-indent: 0;
overflow: hidden;
left:8px;
}
* html .jdGallery .slideInfoZone
{
bottom: -1px;
}
.jdGallery .slideInfoZone h2
{
padding: 0;
font-size: 90%;
font-family:Tahoma, Arial, Helvetica, sans-serif;
margin: 0;
margin: 5px 5px;
font-weight: bold;
color: inherit;
text-align:left;
filter:alpha(opacity=100);
}
.jdGallery .slideInfoZone p
{
padding: 0;
font-size: 60%;
margin: 2px 5px;
color: #eee;
}
.jdGallery div.carouselContainer
{
position: absolute;
height: 135px;
width: 100%;
z-index: 10;
margin: 0px;
left: 0;
top: 0;
}
.jdGallery a.carouselBtn
{
position: absolute;
bottom: 0;
right: 30px;
height: 20px;
/*width: 100px; background: url('img/carousel_btn.gif') no-repeat;*/
text-align: center;
padding: 0 10px;
font-size: 13px;
background: #333;
color: #fff;
cursor: pointer;
}
.jdGallery .carousel
{
position: absolute;
width: 100%;
margin: 0px;
left: 0;
top: 0;
height: 115px;
background: #333;
color: #fff;
text-indent: 0;
overflow: hidden;
}
.jdExtCarousel
{
overflow: hidden;
position: relative;
}
.jdGallery .carousel .carouselWrapper, .jdExtCarousel .carouselWrapper
{
position: absolute;
width: 100%;
height: 78px;
top: 10px;
left: 0;
overflow: hidden;
}
.jdGallery .carousel .carouselInner, .jdExtCarousel .carouselInner
{
position: relative;
}
.jdGallery .carousel .carouselInner .thumbnail, .jdExtCarousel .carouselInner .thumbnail
{
cursor: pointer;
background: #000;
background-position: center center;
float: left;
border: solid 1px #fff;
}
.jdGallery .wall .thumbnail, .jdExtCarousel .wall .thumbnail
{
margin-bottom: 10px;
}
.jdGallery .carousel .label, .jdExtCarousel .label
{
font-size: 13px;
position: absolute;
bottom: 5px;
left: 10px;
padding: 0;
margin: 0;
}
.jdGallery .carousel .wallButton, .jdExtCarousel .wallButton
{
font-size: 10px;
position: absolute;
bottom: 5px;
right: 10px;
padding: 1px 2px;
margin: 0;
background: #222;
border: 1px solid #888;
cursor: pointer;
}
.jdGallery .carousel .label .number, .jdExtCarousel .label .number
{
color: #b5b5b5;
}
.jdGallery a
{
font-size: 100%;
text-decoration: none;
color: inherit;
}
.jdGallery a.right, .jdGallery a.left
{
position: absolute;
height: 99%;
width: 25%;
cursor: pointer;
z-index:10;
filter:alpha(opacity=20);
-moz-opacity:0.2;
-khtml-opacity: 0.2;
opacity: 0.2;
}
* html .jdGallery a.right, * html .jdGallery a.left
{
filter:alpha(opacity=50);
}
.jdGallery a.right:hover, .jdGallery a.left:hover
{
filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}
.jdGallery a.left
{
left: 0;
top: 0;
background: url('img/fleche1.png') no-repeat center left;
}
* html .jdGallery a.left { background: url('img/fleche1.gif') no-repeat center left; }
.jdGallery a.right
{
right: 0;
top: 0;
background: url('img/fleche2.png') no-repeat center right;
}
* html .jdGallery a.right { background: url('img/fleche2.gif') no-repeat center right; }
.jdGallery a.open
{
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.withArrows a.open
{
position: absolute;
top: 0;
left: 25%;
height: 99%;
width: 50%;
cursor: pointer;
z-index: 10;
background: none;
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}
.withArrows a.open:hover { background: url('img/open.png') no-repeat center center; }
* html .withArrows a.open:hover { background: url('img/open.gif') no-repeat center center;
filter:alpha(opacity=80); }
/* Gallery Sets */
.jdGallery a.gallerySelectorBtn
{
z-index: 15;
position: absolute;
top: 0;
left: 30px;
height: 20px;
/*width: 100px; background: url('img/carousel_btn.gif') no-repeat;*/
text-align: center;
padding: 0 10px;
font-size: 13px;
background: #333;
color: #fff;
cursor: pointer;
opacity: .4;
-moz-opacity: .4;
-khtml-opacity: 0.4;
filter:alpha(opacity=40);
}
.jdGallery .gallerySelector
{
z-index: 20;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: #000;
}
.jdGallery .gallerySelector h2
{
margin: 0;
padding: 10px 20px 10px 20px;
font-size: 20px;
line-height: 30px;
color: #fff;
}
.jdGallery .gallerySelector .gallerySelectorWrapper
{
overflow: hidden;
}
.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton
{
margin-left: 10px;
margin-top: 10px;
border: 1px solid #888;
padding: 5px;
height: 40px;
color: #fff;
cursor: pointer;
float: left;
}
.jdGallery .gallerySelector .gallerySelectorInner div.hover
{
background: #333;
}
.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton div.preview
{
background: #000;
background-position: center center;
float: left;
border: none;
width: 40px;
height: 40px;
margin-right: 5px;
}
.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton h3
{
margin: 0;
padding: 0;
font-size: 16px;
font-weight: normal;
}
.jdGallery .gallerySelector .gallerySelectorInner div.galleryButton p.info
{
margin: 0;
padding: 0;
font-size: 12px;
font-weight: normal;
color: #aaa;
}
form
{
margin:0px;
float:left;
width:495px;
padding:15px 0px 15px 20px;
}
.formdata{
min-height:25px;
float:left;
display:block;
width:465px;
margin:1px 0px 1px 0px;
}
form label{
float:left;
width:180px;
margin-top:1px;
}
.box{
float:left;
width:200px;
border:1px solid #0759a9;
}
.checkbox{
float:left;
width:20px;
margin:0px;
}
.inputbutton{
float:left;
width:55px;
border:1px solid #cccccc;
cursor:pointer;
background:#333333 url("../imagery/nav/footerbg.png") repeat-x;
color:#ffffff;
}