/* main.css for CRE - Decorative Concrete Specialists */

/* page layout ---------------------------------------------------------------*/
body {
 margin: 0;
 background: #999999 url(./bg.gif);
}
div#container {
 position: absolute;
 width: 760px;
 left: 50%;
 margin: 0 0 0 -380px;
 border-top: 0;
 border-right: 1px solid #000000;
 border-bottom: 1px solid #000000;
 border-left: 1px solid #000000;
}
div#pagebanner {
 background: url(./top_banner.jpg) no-repeat;
 width: 760px;
 height: 80px;
}
div#pagetop_menu {
 background: url(./menu_bar.jpg) no-repeat;
 width: 760px;
 height: 20px;
}
div#pagecontent {
 width: 760px;
 float: left;
 background: #555555;
}
div#pagefooter {
 float: left;
 width: 760px;
 height: 25px; 
 background: #000000 url(./footer.jpg) no-repeat center top;
}
.banner_text {
 padding-left: 10px;
 font: normal 10pt Verdana;
 color: #ffffff;
}
.banner_text a:link,
.banner_text a:visited,
.banner_text a:active {
 color: #ffffff;
 text-decoration: none;
}
.banner_text a:hover {
 color: #000000;
}

/* general styles ------------------------------------------------------------*/
.error {
 font: normal 8pt Tahoma;
 color: #ffffff;
}
.text {
 font: normal 10pt Verdana;
 color: #ffffff;
}
.pageheader {
 width: 100%;
 font: bold 10pt Verdana;
 color: #ffffff;
 padding-bottom: 2px;
 border-bottom: 2px solid #aa3030;
 margin: 0;
}
div#content {
 width: 740px;
 padding: 10px;
 background: url(../images/web/path.jpg) no-repeat right bottom;
}
.copy {
 text-align: center;
 font: normal 8pt Tahoma;
 color: #555555;
 padding: 8px 0 0 0;
}
.copy a:link,
.copy a:active,
.copy a:visited {
 color: #555555;
 text-decoration: none;
}
.copy a:hover {
 color: #999999;
 text-decoration: none;
}
input.field_on {
 background: #ffffff;
}
input.field_off {
 background: #cccccc;
}
.user_form input.button {
 color: #ffffff;
 background: #aa3030;
 border: 1px solid #960000;
}
.user_form {
 font: normal 10pt Verdana;
 color: #ffffff;
}
.user_form input {
 border: 1px solid #000000;
 color: #000000;
}

/* top navigational menu -----------------------------------------------------*/
div#nav {
 float: left;
 margin: 0;
 background: transparent;
 border: 0;
 padding: 0;
}
div#nav ul {
 margin: 0;
 padding: 0;
 background: #960000;
 border: 1px solid #aa3030;
 border-width: 0 1px;
}
div#nav li {
 position: relative;
 list-style: none;
 margin: 0;
 padding: 0;
 float: left;
 width: 106px;
}
div#nav li:hover {background: #aa3030;}
div#nav li.submenu {
 width: 122px;
}
div#nav li.submenu:hover {background: #aa3030;}
div#nav li a {
 display: block;
 margin: 0;
 padding: 1px 0 3px 0;
 text-decoration: none;
 width: 106px;
 font: bold 10pt Tahoma;
 color: #ffffff;
 text-align: center;
}
div#nav li a.services_top {
 display: block;
 margin: 0;
 padding: 1px 0 3px 0;
 text-decoration: none;
 width: 122px;
 font: bold 10pt Tahoma;
 color: #ffffff;
 text-align: center;
}
div#nav li a.services {
 display: block;
 margin: 0;
 padding: 2px 0 4px 0;
 text-decoration: none;
 width: 122px;
 font: normal 8pt Tahoma;
 color: #ffffff;
 text-align: center;
}
div#nav ul ul {
 position: absolute;
 width: 122px;
 display: none;
}
div#nav ul ul li {
 width: 122px;
 border-bottom: 1px solid #aa3030;
}
div#nav li.submenu li.submenu {}
div#nav li.submenu li.submenu:hover {background-color: #aa3030;}
div#nav ul.level1 li.submenu:hover ul.level2, 
div#nav ul.level2 li.submenu:hover ul.level3 {display: block;}
div#nav ul.level2 {top: 20px; left: -1px;}
div#nav ul.level3 {
 top: -1px; left: 121px;
 border-top: 1px solid #aa3030;
}

/* side navigation menu ------------------------------------------------------*/
div#sidenav { float: left; }
div#sidenav td {vertical-align: top;}
div#sidenav td h1 {
 background-color: transparent;
 color: #ffffff;
 margin: 0 3px 0 0;
 padding: 5px 0 1px 5px; 
 font-family: Tahoma;
 font-size: 8pt;
 font-weight: bold;
 border-right: 1px solid #000000;
 border-bottom: 1px solid #000000;
}
div#sidenav td a {
 display: block;
 margin: 0 3px 0 0;
 padding: 2px 10px 2px 10px;
 text-decoration: none;
 font-family: Tahoma;
 font-size: 8pt;
 font-weight: normal;
 border-right: 1px solid #000000;
 color: #999999;
 background: transparent;
}
div#sidenav td a:hover {
 background-color: #aa3030;
 color: #ffffff;
 border-right: 7px solid #960000;
 padding-right: 7px;
 margin-right: 0;
}
div#cms_content {
 float: left;
 width: 630px;
 padding: 10px;
}

/* faq page ------------------------------------------------------------------*/
div#faq {
 width: 740px;
 padding: 10px;
 background: url(../images/web/path.jpg) no-repeat right bottom;
}
.question {
 margin-top: 10px;
 padding-top: 5px;
 border-top: 1px dashed #ffffff;
 font: bold 10pt Verdana;
 color: #ffffff;
}
.question_top {
 margin-top: 10px;
 font: bold 10pt Verdana;
 color: #ffffff;
}
.answer {
 font: normal 10pt Verdana;
 color: #ffffff;
 margin-left: 20px;
}

/* services page -------------------------------------------------------------*/
div#services {
 width: 740px;
 padding: 10px;
}
div#services a {
 text-decoration: none;
 color: #ffffff;
}
div#services a:hover {
 text-decoration: underline;
}
.engraving {
 margin-top: 10px;
 border-top: 1px dashed #ffffff;
 background: url(../images/web/engraving.jpg) no-repeat right top;
 padding: 5px 200px 5px 0;
 height: 90px;
}
.staining {
 margin-top: 10px;
 border-top: 1px dashed #ffffff;
 background: url(../images/web/staining.jpg) no-repeat left top;
 padding: 5px 0 5px 200px;
 height: 90px;
}
.sealing {
 margin-top: 10px;
 border-top: 1px dashed #ffffff;
 background: url(../images/web/sealing.jpg) no-repeat right top;
 padding: 5px 200px 5px 0;
 height: 90px;
}
.cleaning {
 margin-top: 10px;
 border-top: 1px dashed #ffffff;
 background: url(../images/web/cleaning.jpg) no-repeat left top;
 padding: 5px 0 5px 200px;
 height: 90px;
}
.polishing {
 margin-top: 10px;
 border-top: 1px dashed #ffffff;
 background: url(../images/web/polishing.jpg) no-repeat right top;
 padding: 5px 200px 5px 0;
 height: 90px;
}
.epoxy {
 margin-top: 10px;
 border-top: 1px dashed #ffffff;
 background: url(../images/web/epoxy.jpg) no-repeat left top;
 padding: 5px 0 5px 200px;
 height: 90px;
}
.counter {
 margin-top: 10px;
 border-top: 1px dashed #ffffff;
 background: url(../images/web/counter.jpg) no-repeat right top;
 padding: 5px 200px 5px 0;
 height: 90px;
}
.stone {
 margin-top: 10px;
 border-top: 1px dashed #ffffff;
 padding: 5px 0 5px 0;
}
.floor {
 margin-top: 10px;
 border-top: 1px dashed #ffffff;
 background: url(../images/web/floorprep.jpg) no-repeat left top;
 padding: 5px 0 5px 200px;
 height: 90px;
}
.services_top {
 font: bold 10pt Verdana;
 color: #ffffff;
}
.services_desc {
 font: normal 10pt Verdana;
 color: #ffffff;
 margin-left: 20px;
}

/* contact us page -----------------------------------------------------------*/
div#contact {
 width: 740px;
 padding: 10px;
 background: url(../images/web/poolbg.jpg) no-repeat center bottom;
}
.contact_form {
 font: normal 10pt Verdana;
 color: #ffffff;
 text-align: center;
}
.contact_form input,
.contact_form textarea {
 border: 1px solid #000000;
 font: normal 10pt Verdana;
 color: #000000;
}
.contact_form input.button {
 font: normal 10pt Verdana;
 color: #ffffff;
 background: #aa3030;
 border: 1px solid #960000;
}

/* about us page -------------------------------------------------------------*/
div#about {
 width: 740px;
 padding: 10px;
 background: url(../images/web/path.jpg) no-repeat right bottom;
}
.speeceimage {
 width: 260px;
 height: 200px;
 background: url(../images/web/speecefamily.jpg) no-repeat left top;
 float: left;
}
.speecetext {
 font: normal 10pt Verdana;
 color: #ffffff;
 padding: 0 10px 0 0;
}

/* login page ----------------------------------------------------------------*/
div#login_form {
 width: 300px;
 height: 60px;
 font: normal 10pt Verdana;
 color: #ffffff; 
}
div#login_form input {
 border: 1px solid #000000;
 color: #000000;
}
div#login_form input.button {
 color: #ffffff;
 background: #aa3030;
 border: 1px solid #960000;
}

/* images page----------------------------------------------------------------*/
.image_form {
 font: normal 8pt Verdana;
 color: #ffffff;
 text-align: left;
 float: left;
 vertical-align: top;
}
.image_form .header {
 padding-top: 10px;
 font-weight: bold;
}
.image_form textarea,
.image_form select {
 border: 1px solid #000000;
 font: normal 8pt Verdana;
 color: #000000;
}
.image_form input.button {
 font: normal 10pt Verdana;
 color: #ffffff;
 background: #aa3030;
 border: 1px solid #960000;
}
div#eng_patterns {
 font: italic 8pt Verdana;
 color: #ffffff;
 display: none;
 padding: 0 0 5px 20px;
}
div#add_project {
 display: none;
}
div#save_button {
 display: none;
}

/* Manage Pages  -------------------------------------------------------------*/
.view_table {
 font-family: Tahoma;
 font-size: 8pt;
 color: #ffffff;
 text-align: left;
 width: 100%;
}
.view_table a {
 text-decoration: none;
 color: #ffffff;
}
.view_table a:hover {
 text-decoration: underline;
 color: #000000;
}
.view_table td.header {
 font-weight: bold;
 color: #ffffff;
 background: #aa3030;
 border-bottom: 1px solid #960000;
 padding-bottom: 2px;
}
.view_table img {
 border: 1px solid #ffffff;
 margin-top: 2px;
}
.projects_form {
 font: normal 10pt Verdana;
 color: #ffffff;
 text-align: left;
}
.projects_form input,
.projects_form textarea {
 font: normal 10pt Verdana;
 color: #000000;
}
.projects_form input.button {
 font: normal 10pt Verdana;
 color: #ffffff;
 background: #aa3030;
 border: 1px solid #960000;
}
.page_links {
 font: bold 8pt/16px Tahoma;
 color: #ffffff;
 cursor: default;
}
.page_links a {
 color: #999999;
 text-decoration: none;
}
.page_links a:hover {
 color: #ffffff;
}
