@charset "utf-8";
/* CSS Document */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, tt, var, dl, dt, dd, fieldset, form, label, legend, caption {
background: transparent;
border: 0;
margin: 0;
outline: 0;
padding: 0;
}
table { border-collapse: collapse; border-spacing: 0; }
fieldset,img { border: 0; } 
address,caption,cite,code,dfn,var { font-style: normal; font-weight: normal; }
caption,th { text-align: left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight: normal; } 
q:before,q:after { content:''; } 
abbr,acronym { border: 0; }

body { background: url(background.jpg) #d0d0d0 center top; font-family: "Lucida Sans Unicode", "Lucida Grande", verdana, sans-serif; font-size: 12px; }
a { text-decoration: none; }
a.hoverline:hover, a.hoverline:hover div { text-decoration: underline; }
a.uline { text-decoration: underline; }
a.uline:hover { text-decoration: none; }
a:visited { text-decoration:none; }
a:link { text-decoration:none; }
a:active { text-decoration:none; }

.logolink a {text-decoration:none; outline:none;}

.float_left { float: left; }
.float_right { float: right; }
.marginT_10 { margin-top: 10px; }
.marginR_20 { margin-right: 20px; }
.marginB_20 { margin-bottom: 20px; }
.padding_2 { padding: 2px; }
.padding_10 { padding: 10px; }
.padding_20 { padding: 20px; }
.padding_30 { padding: 30px; }
.clear { clear: both; }

.bold { font-weight: bold; }
.color_fff { color: #FFF; }
.color_4f4f4f { color: #4f4f4f ;}
.color_7d7d7d { color: #7d7d7d; }
.color_c2e4fc { color: #c2e4fc; }
.color_00a5e5 { color: #00a5e5; }
.size_14 { font-size: 14px; }
.size_15 { font-size: 15px; }
.size_18 { font-size: 18px; }
.align_right { text-align: right; }
.align_left { text-align: left; }
.align_centre { text-align: center; }

#container { width: 986px; margin: auto; }

#header { padding: 20px 20px 0px 20px; margin-bottom: -2px; }

#navtabs { margin-top: 50px; }
#navtabs a div { float: left; }
#navtabs .tab_left { width: 3px; height: 33px; background: url(tab_orangeInactive.gif) no-repeat left; }
#navtabs .tab_mid { padding: 8px 6px 8px 6px; height: 17px; background-color: #ff9900; font-size: 13px; color: #FFF; font-weight: bold; }
#navtabs .tab_right { width: 3px; height: 33px; background: url(tab_orangeInactive.gif) no-repeat right; margin-right: 3px; }
#navtabs a:hover .tab_left { background: url(tab_orangeActive.gif) no-repeat left; }
#navtabs a:hover .tab_mid { background-color: #00a5e5; color: #000; }
#navtabs a:hover .tab_right { background: url(tab_orangeActive.gif) no-repeat right; }
#navtabs .tab_blueLeft { width: 3px; height: 33px; background: url(tab_blueInactive.gif) no-repeat left; }
#navtabs .tab_blueMid { padding: 8px; height: 17px; background-color: #228db6; font-size: 13px; color: #FFF; font-weight: bold; }
#navtabs .tab_blueRight { width: 3px; height: 33px; background: url(tab_blueInactive.gif) no-repeat right; margin-right: 3px; }
#navtabs a:hover .tab_blueLeft { background: url(tab_blueActive.gif) no-repeat left; }
#navtabs a:hover .tab_blueMid { background-color: #5a5a5a; }
#navtabs a:hover .tab_blueRight { background: url(tab_blueActive.gif) no-repeat right; }

#content_top { width: 984px; height: 12px; background: url(contentbox.png) no-repeat top; }
#content_mid { width: 944px; padding: 10px 25px; background: url(contentboxMid.gif) repeat-y; }
#content_btm { width: 984px; height: 12px; background: url(contentbox.png) no-repeat bottom; }

#spot1 { width: 236px; height: 90px; float: left; margin: 15px 6px 0px 0px; padding: 85px 50px 0px 20px; background: url(spot1bg.png) no-repeat; color: #FFF; }
#spot2 { width: 246px; height: 115px; float: left; margin: 15px 6px 0px 0px; padding: 70px 30px 0px 30px; background: url(spot2bg.png) no-repeat; color: #FFF; }
#spot3 { width: 246px; height: 115px; float: left; margin-top: 15px; padding: 70px 30px 0px 30px; background: url(spot3bg.png) no-repeat; color: #FFF; }

#footer { width: 895px; height: 92px; float: left; margin-top: -15px; padding: 20px; background: url(footer_bg.png) no-repeat; z-index: 1; }
#footer_left { float: left; padding: 60px 0px 0px 130px; }
#footer_left div { float: left; padding: 2px; font-weight: bold; }
#footer_right { float: right; padding-top: 12px; color: #FFF; font-size: 15px; }
#footer_right div { margin-right: 4px; }
#footer_padding { padding: 25px 10px 10px 10px; font-size: 11px; }

/*article*/
#article_contentbg { width: 934px; padding-bottom: 50px; margin-bottom: 20px; background: url(article_bgshade.gif) no-repeat bottom; }

#sidemenu { float: left; margin: 30px 34px 0px 0px; }
#sidemenu div { width: 194px; height: 22px; margin-bottom: 2px; padding: 7px 0px 0px 15px; background: url(sidemenu_bg.gif) no-repeat top; font-family: Verdana, Geneva, sans-serif; font-weight: bold; color: #000; }
#sidemenu a:hover div, #sidemenu a.active { background-position: bottom; }

#article_header, #form_header { width: 630px; height: 41px; padding: 30px; margin: 10px 0px 40px 0px; background: url(article_header.gif) no-repeat; font-size: 24px; color: #8acb19; }
#form_header { width: 872px; background: url(form_header.gif) no-repeat; }

#photo { width: 120px; height: 140px; padding: 15px; margin-right: 20px; float: left; background: url(photo_bg.gif) no-repeat; }
#article_profile { float: left; width: 480px; line-height: 18px; }

#form td { padding: 10px; font-size: 15px; }
#form input, #form textarea { width: 220px; }
#form textarea { height: 100px; }

.tsTable { border-spacing: 10px; margin: 0px; }
.tsBody { padding: 8px; }
.tsBody a:link {text-decoration:none; color:#006699; outline:none;}
.tsBody a:visited {text-decoration:none; color:#006699; }
.tsBody a:active {text-decoration:none; color:#006699; }

#spot1 a {text-decoration:none; color:#ffffff; outline:none;}
#spot1 a:link {text-decoration:none; color:#ffffff; }
#spot1 a:visited {text-decoration:none; color:#ffffff; }
#spot1 a:active {text-decoration:none; color:#ffffff; }
#spot1 a:hover {text-decoration:underline; color:#ffffff; }

#spot2 a {text-decoration:none; color:#ffffff; outline:none;}
#spot2 a:link {text-decoration:none; color:#ffffff; }
#spot2 a:visited {text-decoration:none; color:#ffffff; }
#spot2 a:active {text-decoration:none; color:#ffffff; }
#spot2 a:hover {text-decoration:underline; color:#ffffff; }

#spot3 a {text-decoration:none; color:#ffffff; outline:none;}
#spot3 a:link {text-decoration:none; color:#ffffff; }
#spot3 a:visited {text-decoration:none; color:#ffffff; }
#spot3 a:active {text-decoration:none; color:#ffffff; }
#spot3 a:hover {text-decoration:underline; color:#ffffff; }


/*
* You probably want to set the same width and height
* that you have set to your <video> elements.
*/
.interactive .video_wrap {
  width:640px;
  height:360px;
  display:none;
}
.interactive .video_wrap.active {
  display:block;
}

/* This will make distinguishable the currently selected thumbnail */
.interactive li.active {
  background:#000;
}

/* This will create a simple hover effect */
.interactive li img {
  opacity:.7;
}
.interactive li a:hover img, .interactive li.active img {
  opacity:1;
}

/* carousel */
div#carousel {
width: 915px;;
height: 650px;
float: left;
background: #cccccc;
overflow: scroll;
border: 1px solid #000;
}

.carouselLeft {
display: none;
background: url(rotate-left.png);
width: 40px;
height: 40px;
background-position: 0px 0px;
}

.carouselLeft:hover {
width: 40px;
height: 40px;
background-position: 0px 40px;
cursor: auto;
}

.carouselRight {
display: none;
background: url(rotate-right.png);
width: 40px;
height: 40px;
background-position: 0px 0px;
}

.carouselRight:hover {
width: 40px;
height: 40px;
background-position: 0px 40px;
}

#da-vinci-title {
display: none;
color: #ffff66;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 28px;
font-weight: bold;
margin: 18px;
letter-spacing: 1px;
margin-bottom: 5px;
width: 80%;
text-shadow: 2px 3px 4px #000000;
}

#da-vinci-alt{
width: 450px;
display: none;
color: #cccccc;
margin: 0px 20px;
font-size: 24px;
font-weight: normal;
}
/* end carousel */