/*
CSS-file for three column layout 2006
http://www.savio.no/
Developed by Eivind Savio
*/
* /*Set's border, padding and margin to 0 for all values*/
{
padding: 0;
margin: 0;
border: 0;
}
body, html {
color: #2a2a2a; 
font-family: Tahoma, Verdana, Arial, sans-serif;
line-height:20px;
text-align: justify;
background-image: url(images/background_image.png); 
text-align: center; /*** Centers the design in old IE versions ***/
}
body {
font-size: 70%;
}
p {padding: 7px 0 7px 0;}

a {
color: #c1bca5;
}


a:hover{
color: #2a2a2a;
text-decoration: none;
}

h1, h2, h3 {
font-weight: bold;
padding-bottom: 5px;
color: #372c2c; 
}
h1 {
font-size: 2em;
}
h2 {
font-size: 1.4em;
}
h3 {
font-size: 1.3em;
}
h1 a, #header h2{
color: #fff;
}
.clear { clear: both; }
#mainContainer {
width: 1060px;
margin: 0 auto; /*** Centers the design ***/
height: 680px;
background-image: url(images/main_box_short.jpg);
background-position: top center;
background-repeat: no-repeat;
text-align: left; /*** Because we centered the text in body we have to move the text back to left aligning ***/
}
* html #mainContainer {
height: 680px; /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/
}
/**************************
HEADER
**************************/
#header {
background: none;
margin-top: 10px;
padding: 10px;
height: 110px;
text-align: right;
width: 940px;
}
#logo {
background: none;
padding-top: 10px;
padding-bottom: 0px;
padding-left: 40px;
padding-right: 0px;
height: 110px;
text-align: left;
float: left;
width: 430px;
}
#menu {
background: none;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
height: 120px;
float:right;
text-align: right;
width: 450px;
}


#navlist
{
padding-top: 0px;
padding-left: 0px;
}
#navlist li
{
list-style-type: none;
padding: 0px;
margin-top: -5px;
}
/**************************
CONTENT AND COLUMNS
**************************/
.outer {
margin-top: 50px; /*** We need to add some space for our top menu ***/
}
* html .outer {
/*** No need for hacking IE on this layout ***/
}
.inner {
/*** No need to do anything with a one column solution ***/
}
* html .inner {
/***  And therefor no need for hacking IE either ***/
}
/*** div.inner is wider than its container, div.outer, and so overlaps to the right, pushing
div.right into the proper position. IE expands div.outer instead, requiring a Tan hack to avoid 
blowing the layout apart. IE gets the original 100% width as in the Livingstone layout.
***/
.float-wrap {
float: left;

}
* html .float-wrap {
/*** No need for hacking IE on this layout ***/
}
#content {
margin-top: 50px;
margin-left: 50px;
margin-right: 0px;
float: left;
width: 980px;
background:none;
height: 630px;
}
* html #content {
position: relative;  /*** IE needs this  ***/
}
.contentWrap {
padding: 5px;
}
.contentWrap ol, .contentWrap ul {
margin: 3px 0 5px 35px;
}
.contentWrap li {
padding-bottom: 2px;
}
/**************************
HOME PAGE
**************************/
#index_left {
float: left;
padding-left: 10px;
padding-right: 20px;
margin-left: 50px;
margin-right: 0px;
width: 415px;
background-image: url(images/home_textbox.png);
background-repeat: no-repeat;
height:450px;
position:relative; 
}
#home_text {
float: left;

width: 415px;
background-color:transparent;
height:450px;
position:relative; 
}
#index_right {
float: left;
margin-left: 15px;
margin-right: 0px;
width: 440px;
background: transparent;
z-index: 101;
}
/**************************
ABOUT PAGE
**************************/
#about {
float: left;
padding-left: 20px;
padding-right: 20px;
margin-left: 50px;
margin-right: 0px;
width: 960px;
background-color: transparent;
height:450px;
position:relative; 
}


/**************************
SERVICES PAGE
**************************/

#services_right {
float: right;
margin-left: 0px;
margin-right: 0px;
width: 470px;
background: transparent;
}

/**************************
CONTACT PAGE
**************************/
#contact_left {
float: left;
padding-left: 20px;
padding-right: 20px;
margin-left: 50px;
margin-right: 0px;
width: 405px;
background-image: url(images/home_textbox.png);
background-repeat: no-repeat;
height:450px;
position:relative; 
}

#contact_form {
float: left;

width: 405px;
background-color: transparent;
height:450px;
position:relative;
z-index: 101;
}

#contact_right {
float: left;
margin-left: 0px;
margin-right: 40px;
padding-top: 80px;
width: 425px;
height:450px;
background-color: transparent;
/***background-image: url(images/contact_box_right.png);
background-repeat: no-repeat;***/
}
/**************************
TITLE
**************************/
#title {
width: 940px;
height:20px;
margin: 0 auto;
text-align: left;
background-color: transparent;
}
/**************************
FOOTER
**************************/
#footer {
width: 940px;
margin: 0 auto;
text-align: right;
background-color: transparent;
}

.stain
{
    height: 355px;
    width: 350px;
    z-index: 10;
    text-align: center;
    position: absolute;
    margin-top: 400px;
    margin-left: -530px;
}



/****************************
scroller styles - services
*/
/*.Scroller-Container {
  position: absolute;
  top: 0px; left: 0px;
}
*****************************/
.Scroller-Container {
  position: absolute;
  top: 0px; left: 0px;
  z-index: 101;
}
.Scrollbar-Up {
  position: absolute;
  width: 10px; height: 10px;
  background-color: #CCC;
  font-size: 0px;
  z-index: 101;
}
.Scrollbar-Track {
  width: 10px; height: 355px;
  position: absolute;
  top: 20px;
  background-color: #EEE;
  z-index: 101;
}

.Scrollbar-Handle {
  position: absolute;
  width: 10px; height: 30px;
  background-color: #CCC;
  z-index: 101;
}
.Scrollbar-Down {
  position: absolute;
  top: 385px;
  width: 10px; height: 10px;
  background-color: #CCC;
  font-size: 0px;
  z-index: 101;
}
#Scrollbar-Container {
  position: absolute;
  top: 10px; left: 420px;
  height: 380px;
  z-index: 101;
}

#Container {
  position: absolute;
  z-index: 101;
  top: 5px; left: 15px;
  width: 400px;
  height: 385px;
}
#News, #About, #Extra { 
  position: absolute;
  top: 10px; 
  overflow: hidden;
  width: 400px;
  height: 380px;
  z-index: 101;
  display: none;
}

#News {display: block;}
p {
  margin: 0; padding: 0px 0px 10px;
  font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  line-height: 1.6;
  text-indent: 0px;
  color: #2a2a2a;
  z-index: 101;
}

#Navigation {
  position: absolute; 
  top: 30px;
  left: 75px;
}
#Navigation a {
  margin: 5px 2px 0 0;
  padding: 0 5px;
  height: 20px;
  background-color: #E4E4E4;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 10px;
  color: #AAA;
  text-decoration: none;
  display: block;
  float: left;
  letter-spacing: 1px;
}
#Navigation a:hover {
  margin-top: 0px;
  height: 25px;
}
#Navigation a.current {
  margin-top: 0px;
  height: 25px;
  background-color: #EEE;
  color: #777;
}

/****************************
scroller styles - homepage
*/
/*.Scroller-Container {
  position: absolute;
  top: 0px; left: 0px;
}
*****************************/
.Scroller-Container {
  position: absolute;
  top: 0px; left: 0px;
  z-index: 101;
}
.Scrollbar-Up {
  position: absolute;
  width: 10px; height: 10px;
  background-image: url(images/scroll_up.png);
  font-size: 0px;
  z-index: 101;
}
.Scrollbar-Track {
  width: 10px; height: 355px;
  position: absolute;
  top: 20px;
  background-image: url(images/scroll_track.png);
  z-index: 101;
}

.Scrollbar-Handle {
  position: absolute;
  width: 10px; height: 30px;
  background-image: url(images/scroll_handle.png);
  z-index: 101;
}
.Scrollbar-Down {
  position: absolute;
  top: 385px;
  width: 10px; height: 10px;
  background-image: url(images/scroll_down.png);
  font-size: 0px;
  z-index: 101;
}
#Scrollbar-Container {
  position: absolute;
  top: 10px; left: 420px;
  height: 380px;
  z-index: 101;
}

#Container {
  position: absolute;
  z-index: 101;
  top: 5px; left: 15px;
  width: 400px;
  height: 385px;
}
#News, #About, #Extra { 
  position: absolute;
  top: 10px; 
  overflow: hidden;
  width: 400px;
  height: 380px;
  z-index: 101;
  display: none;
}

#News {display: block;}
p {
  margin: 0; padding: 0px 0px 10px;
  font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-size: 10px;
  text-indent: 0px;
  color: #2a2a2a;
  z-index: 101;
}

#Navigation {
  position: absolute; 
  top: 30px;
  left: 75px;
}
#Navigation a {
  margin: 5px 2px 0 0;
  padding: 0 5px;
  height: 20px;
  background-color: #E4E4E4;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 10px;
  color: #AAA;
  text-decoration: none;
  display: block;
  float: left;
  letter-spacing: 1px;
}
#Navigation a:hover {
  margin-top: 0px;
  height: 25px;
}
#Navigation a.current {
  margin-top: 0px;
  height: 25px;
  background-color: #EEE;
  color: #777;
}


/****************************
scroller styles - about - testimonial
*/
/*.Scroller-Container {
  position: absolute;
  top: 0px; left: 0px;
}
*****************************/
.Scroller-Container-Testimonial{
  position: absolute;
  top: 0px; left: 0px;
  z-index: 101;
}
.Scrollbar-Up-Testimonial {
  position: absolute;
  width: 10px; height: 10px;
  background-image: url(images/scroll_up.png);
  background-color: #CCC;
  font-size: 0px;
  z-index: 101;
}
.Scrollbar-Track-Testimonial {
  width: 10px; height: 181px;
  position: absolute;
  background-image: url(images/scroll_track.png);
  top: 20px;
  background-color: #EEE;
  z-index: 101;
}

.Scrollbar-Handle-Testimonial {
  position: absolute;
  width: 10px; height: 30px;
  background-image: url(images/scroll_handle.png);
  background-color: #CCC;
  z-index: 101;
}
.Scrollbar-Down-Testimonial {
  position: absolute;
  top: 211px;
  width: 10px; height: 10px;
  background-image: url(images/scroll_down.png);
  background-color: #CCC;
  font-size: 0px;
  z-index: 101;
}
#Scrollbar-Container-Testimonial {
  position: absolute;
  top: 215px; left: 315px;
  z-index: 101;
  height: 206px;
}

#Container-Testimonial {
  position: absolute;
  top: 215px; left: 50px;
  width: 255px;
  height: 206px;
  z-index: 101;
}
#Testimonial { 
  position: absolute;
  top: 0px; 
  overflow: hidden;
  width: 250px;
  height: 206px;
  display: none;
  z-index: 101;
}

#Testimonial {display: block;}
p {
  margin: 0; padding: 0px 0px 10px;
  font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-size: 9px;
  text-align: left;
  line-height: 1.0;
  text-indent: 0px;
  z-index: 101;
  color: #2a2a2a;
}

#Navigation-Testimonial {
  position: absolute; 
  top: 30px;
  left: 75px;
  z-index: 101;
}
#Navigation-Testimonial a {
  margin: 5px 2px 0 0;
  padding: 0 5px;
  height: 20px;
  background-color: #E4E4E4;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 9px;
  color: #AAA;
  text-decoration: none;
  display: block;
  float: left;
  letter-spacing: 1px;
  z-index: 101;
}
#Navigation-Testimonial a:hover {
  margin-top: 0px;
  height: 25px;
  z-index: 101;
}
#Navigation-Testimonial a.current {
  margin-top: 0px;
  height: 25px;
  background-color: #EEE;
  color: #777;
  z-index: 101;
}




/****************************
scroller styles - about - blurb
*/
/*.Scroller-Container {
  position: absolute;
  top: 0px; left: 0px;
}
*****************************/
.Scroller-Container-Blurb {
  position: absolute;
  top: 0px; left: 0px;
}
.Scrollbar-Up-Blurb {
  position: absolute;
  width: 10px; height: 10px;
  background-image: url(images/scroll_up.png);
  background-color: #CCC;
  font-size: 0px;
}
.Scrollbar-Track-Blurb {
  width: 10px; height: 111px;
  position: absolute;
  background-image: url(images/scroll_track.png);
  top: 20px;
  background-color: #EEE;
}

.Scrollbar-Handle-Blurb {
  position: absolute;
  width: 10px; height: 30px;
  background-image: url(images/scroll_handle.png);
  background-color: #CCC;
}
.Scrollbar-Down-Blurb {
  position: absolute;
  top: 141px;
  width: 10px; height: 10px;
  background-image: url(images/scroll_down.png);
  background-color: #CCC;
  font-size: 0px;
}
#Scrollbar-Container-Blurb {
  position: absolute;
  top: 150px; left: 855px;
  height: 156px;
}

#Container-Blurb {
  position: absolute;
  top: 150px; left: 590px;
  width: 255px;
  height: 176px;
}
#Blurb { 
  position: absolute;
  top: 0px; 
  overflow: hidden;
  width: 255px;
  height: 156px;
  display: none;
}

#Blurb {display: block;}
p {
  margin: 0; padding: 0px 0px 10px;
  font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  line-height: 1.6;
  text-indent: 0px;
  color: #2a2a2a;
}

#Navigation-Blurb {
  position: absolute; 
  top: 30px;
  left: 75px;
}
#Navigation-Blurb a {
  margin: 5px 2px 0 0;
  padding: 0 5px;
  height: 20px;
  background-color: #E4E4E4;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 10px;
  color: #AAA;
  text-decoration: none;
  display: block;
  float: left;
  letter-spacing: 1px;
}
#Navigation-Blurb a:hover {
  margin-top: 0px;
  height: 25px;
}
#Navigation-Blurb a.current {
  margin-top: 0px;
  height: 25px;
  background-color: #EEE;
  color: #777;
}

/****************************
SAFARI HACKS
*****************************/

@media screen and (-webkit-min-device-pixel-ratio:0)
{
#mainContainer {
height: 750px;
background-image: url(images/main_box_short_safari.jpg);
}
#footer {
margin-top:-70px;
}
#Container-Testimonial {
  top: 210px; 
}
#Scrollbar-Container-Testimonial {
  top: 210px;
}
#Scrollbar-Container-Blurb {
  top: 145px;
}
#Container-Blurb {
  top: 145px;
}
}