/* CSS Document */

* {	margin:0; padding:0; font-size:100%;}


table.photocodebg{width: auto;}
body.photocode{background-color: #FFFFFF;}

.container{}
body{background-color: #000000 ;}
#pic1,
#pic2, #pic3, #pic4{opacity:0;filter:alpha(opacity=0);position:fixed; }
#pic1 img, #pic2 img, #pic3 img, #pic4 img{width: 178px; height: 240px;}
#fadeshow1 img{width: 250px; height: 333px;}

body.bodygreen{background-image: url(/images/website311/bggreen.jpg); background-repeat: repeat-x;}
body.bodysubgreen{background-image: url(/images/website311/bggreensub.jpg); background-repeat: repeat-x;}

/*Some of Vicks customizations*/
h1{font-size: 24px; color: #000000; font-weight: bold;line-height: 30px;}
h2{font-size: 18px; color: #000000; font-weight: bold; line-height: 22px;}
table.formattedtable td{padding: 10px; font-size: 12px; vertical-align: top; border-bottom: solid 1px #e6eded;}
#articledisplay div.articlebig span.title a{background-color: #000000; font-size: 14px;}
div.box1 #articledisplay div.articlebig span.title a{font-size: 11px;background-color: transparent;}

div.articlebigpadding img{float: right; margin: 10px;}
#articledisplay div.article img{float: right; margin: 10px;}
#articledisplay div.article{margin-bottom: 10px; clear: both;}
#articledisplay div.article span.title a{font-size: 11px; line-height: 13px;}



/*For other Links*/
ul.list3058{list-style: none;padding: 0px; margin: 0px;}
ul.list3058 li.list3058{padding: 0px; margin: 0px;}
ul.list3058 li.list3058 a{font-size: 11px;}



img {vertical-align:top;}
a img { border:0;}
ul { list-style:none;}

/*Vick added so bullet lists would look normal if using the bullet list component -- The submenus will look the way the template wants. -- no bullets*/
span.smaller ul{list-style: disc; list-style-position: inside; padding-left: 25px;padding-top: 10px;}


.left { float:left;}
.right {float:right;}
.clear  { clear:both;}

html{ font-family:Arial, Helvetica, sans-serif; font-size:0.8125em; line-height:1.462em; color:#000000; min-width:950px;}
input, select { vertical-align:middle; font-weight:normal;}

a {color:#000000; outline:none;}
a:hover{text-decoration:none;}
p {padding-top:19px;}
h3{ font-size:1.692em; font-weight:normal; color:#000000; padding-bottom:16px;}
h3 span{ color:#000000;}
h4{ font-size:1.462em; font-weight:normal; color:#99cc33; line-height:1em; padding:5px 0 7px 53px;}
h4 span{ display:block; color:#d8fb9b;}

/* ============================= main layout ====================== */
.imgindent {margin:0 18px 0 0; float:left;}
.phone{ float:right; padding-right:20px;}
.space1{ margin-left:50px;}
.margin1{ margin-top:14px !important;}

/* ============================= header ====================== */
#header{ background:url(/images/website311/header-bgtwinoaks.jpg) top center no-repeat;}
#header .menu{ width:100%; overflow:hidden; height:51px;}
#header .menu ul{ padding-left:5px;}
#header .menu li{ float:left; font-size:1.167em; font-weight:bold;}
#header .menu a{ color:#000000; text-decoration:none; display:inline-block; padding:15px 7px 17px 7px; word-spacing:-2px;}
#header .menu a:hover, #header .menu .active{ background:#000000;}

#header .logo{ padding-top:14px;}
#header .slogan{ display:none;}
#header .text{ font-size:1.307em; color:#000000; padding:7px 0 0 32px;}
#header .text a{ color:#000000; text-decoration:none;}
#header .text a:hover{ text-decoration:underline;}

#headersub{background:url(/images/website311/headersub.jpg) top center no-repeat;height: 192px;}
#headersub .menu{ width:100%; overflow:hidden; height:51px;}
#headersub .menu ul{ padding-left:5px;}
#headersub .menu li{ float:left; font-size:1.167em; font-weight:bold;}
#headersub .menu a{ color:#000; text-decoration:none; display:inline-block; padding:15px 7px 17px 7px; word-spacing:-2px;}
#headersub .menu a:hover, #header .menu .active{ background:#3eb8fc;}

#headersub .logo{ display:none;}
#headersub .slogan{ display:none;}
#headersub .text{ font-size:0.907em; color:#000; padding:5px 0 0 32px; line-height: 14px;}
#headersub .text a{ color:#000; text-decoration:none;}
#headersub .text a:hover{ text-decoration:underline;}

/*========= LIGHT GREEN IMAGES ==============*/

#headergreen{ background:url(/images/website311/headerbgtwinoaksgreen.jpg) top center no-repeat;}
#headergreen .menu{ width:100%; overflow:hidden; height:51px;}
#headergreen .menu ul{ padding-left:5px;}
#headergreen .menu li{ float:left; font-size:1.167em; font-weight:bold;}
#headergreen .menu a{ color:#fff; text-decoration:none; display:inline-block; padding:15px 7px 17px 7px; word-spacing:-2px;}
#headergreen .menu a:hover, #header .menu .active{ background:#871c38;}

#headergreen .logo{ padding-top:14px;}
#headergreen .slogan{ display:none;}
#headergreen .textgreen{ font-size:1.007em; color:#333333; padding:5px 0 0 32px; line-height: 1.207em;}
#headergreen .textgreen a{ color:#333333; text-decoration:none;}
#headergreen .textgreen a:hover{ text-decoration:underline;}

#headergreen .slogangreen{ background-color: #94c343; width: 250px; height: 250px; float: right; margin-right: 80px; margin-top: 20px;padding: 5px;}
#headergreen .slogangreen .pictures{ background-color: #999999; width: 178px; height: 240px; margin: 5px;}

#headersubgreen{background:url(/images/website311/headersubgreen.jpg) top center no-repeat;height: 192px;}
#headersubgreen .menu{ width:100%; overflow:hidden; height:51px;}
#headersubgreen .menu ul{ padding-left:5px;}
#headersubgreen .menu li{ float:left; font-size:1.167em; font-weight:bold;}
#headersubgreen .menu a{ color:#fff; text-decoration:none; display:inline-block; padding:15px 7px 17px 7px; word-spacing:-2px;}
#headersubgreen .menu a:hover, #header .menu .active{ background:#871c38;}

#headersubgreen .logo{ display:none;}
#headersubgreen .slogan{ display:none;}
#headersubgreen .textgreen{ font-size:1.007em; color:#333333; padding:7px 0 0 32px; line-height: 1.307em;}
#headersubgreen .textgreen a{ color:#333333; text-decoration:none;}
#headersubgreen .textgreen a:hover{ text-decoration:underline;}




/*Web Builder Stuff*/
#content #articledisplay{}
#content #articledisplay div.article{}
#content #articledisplay div.article span.title{font-size: 14px;}
#content #articledisplay div.article span.title a{ background-color: #FFFFFF;}
#content #articledisplay div.article span.teaser{}

ul.list3051{list-style-position:inside;}
ul.list3051 li.list3051{ background-repeat: no-repeat;}

/* ============================= content ====================== */
#content{}
.row-1{background-color: #FFFFFF ;}
.row-1 .indent{ padding:23px 2px 26px 5px;}
.row-1 .column-2, .row-1 .column-3{ margin-left:23px;}

.row-2 .indent{ padding:24px 0; line-height:1.385em;}
.row-2 .column-2, .row-2 .column-3{ margin-left:21px;}

.title{ background:url(/images/website311/title-tail.gif) top repeat-x;}

.title .left-bg{ background:url(/images/website311/title-left-bg.gif) left top no-repeat;}
.title .right-bg{ background:url(/images/website311/title-right-bg.gif) right top no-repeat; height:63px; padding:13px 0 0 13px;}

.title1{ background:url(/images/website311/title1-bg.gif) no-repeat 0 0;}
.title1{ background:url(/images/website311/iconbrochures.gif) no-repeat 0 0;}
.title2{ background:url(/images/website311/title2-bg.gif) no-repeat 0 0;}
.title2{ background:url(/images/website311/icontennis.gif) no-repeat 0 0;}
.title3{ background:url(/images/website311/title3-bg.gif) no-repeat 0 0;}
.title3{ background:url(/images/website311/iconcamera.gif) no-repeat 0 0;}

.box1{ background:url(/images/website311/box1-top-tail.gif) top repeat-x ##FFFFFF  ; width:100%;}
.box1 .left-border{ background:url(/images/website311/box1-left-tail.gif) left repeat-y;}
.box1 .right-border{ background:url(/images/website311/box1-right-tail.gif) right repeat-y;}
.box1 .bot-border{ background:url(/images/website311/box1-bot-tail.gif) bottom repeat-x;}
.box1 .left-top{ /*background:url(/images/website311/box1-corner-left-top.gif) left top no-repeat;*/}
.box1 .right-top{/* background:url(/images/website311/box1-corner-right-top.gif) right top no-repeat;*/}
.box1 .left-bot{ /*background:url(/images/website311/box1-corner-left-bot-to.gif) left bottom no-repeat;*/}
.box1 .right-bot{ /*background:url(/images/website311/box1-corner-right-bot-to.gif) right bottom no-repeat; */min-height:364px; height:auto !important; height:364px;}
.box1 .indent{ padding:25px 19px 20px 26px;}
.box1 .indent1{ padding:25px 19px 35px 26px;}
.box1 strong{ display:block; font-weight:normal; font-size:1.154em; color:#FFF; padding-bottom:12px;}

.box2{ background:url(/images/website311/box2-border.gif) top repeat-x #fff; width:100%;}
.box2 .left-border{ background:url(/images/website311/box2-border.gif) left repeat-y;}
.box2 .right-border{ background:url(/images/website311/box2-border.gif) right repeat-y;}
.box2 .bot-border{ background:url(/images/website311/box2-border.gif) bottom repeat-x;}
.box2 .left-top{ background:url(/images/website311/box2-corner-left-top.gif) left top no-repeat;}
.box2 .right-top{ background:url(/images/website311/box2-corner-right-top.gif) right top no-repeat;}
.box2 .left-bot{ background:url(/images/website311/box2-corner-left-bot.gif) left bottom no-repeat;}
.box2 .right-bot{ background:url(/images/website311/box2-corner-right-bot.gif) right bottom no-repeat;}
.box2 .indent{ padding:34px 25px 21px 30px; position:relative;}
.box2 strong{ display:block; font-weight:normal; font-size:1.231em; color:#0eb6fc; padding-bottom:17px; line-height:1.25em;}

.link{ display:inline-block; float:right; background:url(/images/website311/link-tail.gif) top repeat-x; color:#000000; text-decoration:none; margin-top:33px; cursor:pointer; font-size:0.923em;}
.link span{ display:inline-block; background:url(/images/website311/link-left-bg.gif) left top no-repeat;}
.link span span{ background:url(/images/website311/link-right-bg.gif) right top no-repeat; padding:5px 12px 7px 13px;}
.link:hover{ background:url(/images/website311/link-tail-act.gif) top repeat-x; color:#000000;}
.link:hover span{ background:url(/images/website311/link-left-bg-act.gif) left top no-repeat;}
.link:hover span span{ background:url(/images/website311/link-right-bg-act.gif) right top no-repeat;}

.row-2 .link{ display:inline-block; float:right; background:url(images/row2-link-tail.gif) top repeat-x; color:#fff; text-decoration:none; margin-top:33px; cursor:pointer; font-size:0.923em;}
.row-2 .link span{ display:inline-block; background:url(/images/website311/row2-link-left-bg.gif) left top no-repeat;}
.row-2 .link span span{ background:url(/images/website311/row2-link-right-bg.gif) right top no-repeat; padding:6px 12px 7px 13px;}
.row-2 .link:hover{ background:url(/images/website311/row2-link-tail-act.gif) top repeat-x; color:#fff;}
.row-2 .link:hover span{ background:url(/images/website311/row2-link-left-bg-act.gif) left top no-repeat;}
.row-2 .link:hover span span{ background:url(images/row2-link-right-bg-act.gif) right top no-repeat;}

.list li{ font-size:0.923em; line-height:1.833em; background:url(/images/website311/row1-list-marker.gif) no-repeat 0 7px; padding-left:22px;}

.row-2 .list li{ background:url(/images/website311/row2-list-marker.gif) no-repeat 0 7px;}

.text1{ font-size:0.923em; line-height:1.333em;}
.text1 strong{ font-size:1em; color:#000000; font-weight:bold; padding-bottom:6px;}
.text1 a{ color:#000000;}
.text1 p{ padding-top:25px;}
.text1 .link1{ float:right; font-weight:bold; color:#000000; display:inline-block; margin-top:22px;}

/* ============================= footer ====================== */
#footer{ background:#9ACD32 ; font-size:0.923em; color:#000;}
#footer p{ padding:16px 0 0 2px;}
#footer a{ display:inline-block; color:#000; margin-left:9px;}

/* ============================= forms ============================= */
#ContactForm{ padding-top:5px; color:#000000;}
#ContactForm .col-1{ width:240px;}
#ContactForm .col-2{ width:330px;}
#ContactForm label{ display:block; height:42px;}
#ContactForm input{ border:solid 1px #000000; background:none; font-family:Arial, Helvetica, sans-serif; font-size:1em; color:#000000; padding:2px 2px 1px 3px; width:202px;}
#ContactForm textarea{ border:solid 1px #a09b96; background:none; font-family:Arial, Helvetica, sans-serif; font-size:1em; color:#000000; padding:2px 2px 2px 3px; width:320px; height:100px; overflow:auto;}
#ContactForm .link{ float:right; margin:20px 0 0 20px;}



.main { width:950px; margin:0 auto; text-align:left;}

#header .main{height:465px;}

#footer { height:53px;}

.column-1, .column-2, .column-3, .col-1, .col-2, .col-3 {}
.container {width:100%; overflow:hidden; }
.column-sub{width: 299px; margin-right: 20px;}

/* ============================= page1 ===========================*/
#page1 .row-1 .column-1{ width:299px;}
#page1 .row-1 .column-2{ width:299px;}
#page1 .row-1 .column-3{ width:299px;}

#page1 .row-2 .column-1{ width:304px;}
#page1 .row-2 .column-2{ width:625px;}

/* ============================= page2 ===========================*/
#page2 .row-1 .column-1{ width:621px;}
#page2 .row-1 .column-2{ width:299px;}

#page2 .row-2 .column-1{ width:625px;}
#page2 .row-2 .column-2{ width:304px;}
#page2 .row-2 .col-1{ width:240px;}
#page2 .row-2 .col-2{ width:240px;}

/* ============================= page3 ===========================*/
#page3 .row-1 .column-1{ width:299px;}
#page3 .row-1 .column-2{ width:621px;}

#page3 .row-2 .column-1{ width:304px;}
#page3 .row-2 .column-2{ width:300px;}
#page3 .row-2 .column-3{ width:304px;}

/* ============================= page4 ===========================*/
#page4 .row-1 .column-1{ width:621px;}
#page4 .row-1 .column-2{ width:299px;}

#page4 .row-2 .column-1{ width:625px;}
#page4 .row-2 .column-2{ width:304px;}

/* ============================= page5 ===========================*/
#page5 .row-1 .column-1{ width:299px;}
#page5 .row-1 .column-2{ width:621px;}

#page5 .row-2 .column-1{ width:304px;}
#page5 .row-2 .column-2{ width:625px;}
#page5 .row-2 .col-1{ width:240px;}
#page5 .row-2 .col-2{ width:240px;}

/* ============================= page6 ===========================*/
#page6 .row-1 .column-1{ width:621px;}
#page6 .row-1 .column-2{ width:299px;}

#page6 .row-2 .column-1{ width:625px;}
#page6 .row-2 .column-2{ width:304px;}


/*Web Builder Stuff*/
#content #articledisplay{}
#content #articledisplay div.article{}
#content #articledisplay div.article span.title, div.articledisplaydetail span.title{font-size: 14px; background-image: none;}
#content #articledisplay div.article span.title a, 
#content #articledisplay div.article span.title a:visited{ color: #014a91;}
#content #articledisplay div.article span.title a:hover{color: #1fa3fb;}
#content #articledisplay div.article span.teaser{}