@import url('core.css');

.page { margin:20px; padding:0; height:100%; background-color:#3c573f;} /* body of the Iframe*/
body  { color:#000000; font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; font-size:12px; }


/* div to contain the editor control */
.editor { position:absolute; visibility:hidden; background-color:#FFFFFF; }

#container { margin:0 auto; padding:0; width:744px; text-align:left; vertical-align: middle; background-color:#ffffff; }

.header           { margin:0; padding:0; height:121px; background: url(../images/top.jpg) top center no-repeat; }
.header ul        { list-style-type:none; }
.header li        { display:block; float:right; width:111px; height:20px; text-align:center; margin-left:12px; margin-top:100px; }
.header li a      { color:#FDFDFD; text-decoration:none; display:block; width:100%; height:16px; font-size:10px; margin-top:3px; }
.header li.active { font-weight:bold; }

#leftColumn 	       { float:left; margin:9px 0 0 9px; padding:0; width:156px; }
#leftColumn h2 	       { color:#59705c; font-size:16px; font-weight:normal; text-align:right; display:block; padding:0 15px 10px 0; border-bottom:1px solid #CCCCCC;  }
#leftColumn ul	       { margin:0 0 30px 0; }
#leftColumn li         { display:block; height:20px; border-bottom:1px solid #CCCCCC; margin:5px 0 0 0; padding:0 15px 0 0; text-align:right; font-size:13px; background:url(../images/bullet.gif) top right no-repeat; }
#leftColumn li:hover        { background:url(../images/bulletHover.gif) top right no-repeat; }
#leftColumn li a       { color:#69956f; text-decoration:none; }
#leftColumn li a:hover { color:#3c573f; text-decoration:underline; }
#leftColumn li.active  { font-weight:bold; }

/* This has a width set to it but is not necessary for the design to work */
/* The width is set to aid me with setting other column widths and images to the exact layout */
#centerColumn { margin:9px 0 0 190px; width:545px; background-color:#deebe0; min-height: 300px; height:inherit; }
#centerColumn a { color:#1f371f; text-decoration:underline; }
#centerColumn a:hover { color:#69956f; }




div.spacer { height:20px; clear:both; }

.footer       { position:relative; bottom:0; margin:9px 0 0 0; padding:0; height:140px; background:url(../images/bottom2.jpg) bottom center no-repeat; color:#1f371f; font-size:11px; }
#footerlogo   {  padding:19px 0 0 20px; width:300px; height:40px;}
#footerlogo p { margin-left:57px;}

.footer ul                  { display:block; width:370px; height:20px; text-align:left; padding-left:30px; }
.footer li                  { display:inline; padding:0 4px 0 4px; border-left:#1f371f 1px solid; }
.footer li.no_padding_left  { padding:0 4px 0 0; border-left:none; }
.footer li.no_padding_right { padding:0 0 0 4px; }
.footer a                   { text-decoration:none; color:#1f371f; }
.footer a:hover             { text-decoration:underline; color:#FFFFFF; }


/* admin page settings DIV */
.pageSettings { width:535px; display:none; height:0px; margin: 5px 5px 5px 5px ;  }


/* Control bar */
.control   { height:20px; margin: 5px 5px 5px 5px ; border: 1px solid #C7D5C8;  }
.control a { height:20px; text-decoration:none; display:block; padding-left:6px; font-size:10px; margin-top:3px; }
#control1  { width:535px; } /* control bar for Class1 */


/* used for page headers */
.pageTitle    { padding:10px 10px 10px 10px; width:525px; font-size:16px; background-color:#C7D5C8; height:20px; background-color:#59705c; color:#FFFFFF; }
.pageTitle h1 { color:#FFFFFF; font-size:16px;}


/* Class 1 used for full width div with editable text */
.class1    { padding:10px 10px 10px 10px; width:525px; text-align: justify; color:#686667; background-color:#deebe0; line-height: 1.3;}
.class1 p  { padding:5px 5px; }
.class1 address { padding:5px 5px; font-style:italic; }
.class1 h1, h2, h3, h4, h5, h6 { color:#3c573f; font-weight:normal; }
.class1 h1 { font-size:18pt; padding:5px 5px; }
.class1 h2 { font-size:16pt; padding:5px 5px; }
.class1 h3 { font-size:14pt; padding:5px 5px; }
.class1 h4 { font-size:12pt; padding:5px 5px; }
.class1 h5 { font-size:10pt; padding:5px 5px; }
.class1 h6 { font-size:8pt; padding:5px 5px; }
.class1 ul    { margin-top: 5px; margin-bottom:5px; margin-left:0px; padding-left:0px; list-style-position: outside; padding-left:40px; }
.class1 ul li { list-style-type:disc; }
.class1 ol    { margin-top: 5px; margin-bottom:5px; margin-left:0px; padding-left:0px; list-style-position: outside; padding-left:40px; }
.class1 ol li { list-style-type:decimal; }
.class1 ul li ul li { list-style-type:circle; }
.class1 blockquote { margin:1em; padding:.5em; background-color:#eeeeee; border-top:1px solid #cccccc; border-bottom:1px solid #cccccc; }
.class1 em { font-style:italic; }
.class1 strong, b { font-weight:bold; }


#element2 { background-color:#C7D5C8; }
#element4 { padding-top:10px; }


/* Class 2 used for full width div with products */
.class2 { width:545px; color:#686667; background-color:#deebe0; padding: 0 0 0 0; height:320px; }
.productBox { height:146px; width:255px; border:1px; border-style:solid; border-color:#96a7a1; display:block; float:left; background-color:#FFFFFF; margin: 10px 6px 0 6px; }

.productBoxActive { height:146px; width:255px; border:1px; border-style:solid; border-color:#59705c; display:block; float:left; background-color:#FFFFFF;margin: 10px 6px 0 6px; cursor:pointer;}
.productBox h1 { display:block; width:253px; height:34px; padding-top:14px; text-align:center; background: #a6bbb2; margin: 1px 0 0 1px; font-size:12pt;color:#3c573f; font-weight:normal;text-decoration:none; }
.productBoxActive h1 { display:block; width:253px; height:34px; padding-top:14px; text-align:center; background: #59705c; margin: 1px 0 0 1px; font-size:12pt;color:#FFF; font-weight:normal; text-decoration:none;}
.productBox h2 { display:block; width:253px; height:41px; padding-top:7px; text-align:center; background: #a6bbb2; margin: 1px 0 0 1px; font-size:12pt;color:#3c573f; font-weight:normal;text-decoration:none; }
.productBoxActive h2 { display:block; width:253px; height:41px; padding-top:7px; text-align:center; background: #59705c; margin: 1px 0 0 1px; font-size:12pt;color:#FFF; font-weight:normal; text-decoration:none;}
.productImageArea      { width:253px; height:96px; display:block; margin: 0 0 0 1px; }
#product_bespoke       { background:url(../images/product_bespoke.jpg) no-repeat center bottom; }
#product_smallbusiness { background:url(../images/product_smallbusiness.jpg) no-repeat center bottom; }
#product_bfa           { background:url(../images/product_bfa.jpg) no-repeat center bottom; }
#product_personal      { background:url(../images/product_personal.jpg) no-repeat center bottom; }



/* Classes used in the text editor, define these in fckstyles.xml also
.Bold         { font-weight: bold; }
.Title        { font-size:12pt; color:#3c573f; font-weight:normal; padding-bottom:6px; }
.TitleSmall   { font-size:8pt;  color:#3c573f; font-weight:bolder; padding-bottom:6px; }
.blockquote   { margin:1em; padding:.5em; background-color:#eeeeee; border-top:1px solid #cccccc; border-bottom:1px solid #cccccc; }
.blockquote p { margin:.2em; }*/


/* Form styling */
form                 { margin: 0; padding: 0; width: 520px; }
form fieldset        { border-color: #C7D5C8; border-width: 1px; border-style: solid; padding: 10px;}
form fieldset legend { color:#666666; }
form label           { color:#666666; display:block; float:left; width:150px; padding:0; margin:5px 0 0; text-align:right; }
form br              { clear:left; }
form .chkbox         { border:none; }
form .button         { margin-left:162px; margin-top:15px; border:none; width:106px; height:19px; font-size:8pt; color:#fff; background-color:#69966F; cursor:pointer;}
form .error          { color:#FF0000; margin-top:5px; }
form textarea        { overflow:auto; }
form small           { display:block; margin: 0 0 5px 160px; padding:1px 3px; font-size: 88%;color:#666666; }
form .required       { font-weight:bold; }
form input, 
form textarea, 
form select 		 { width:200px; margin:5px 0 0 10px; border:#D6D6D6 1px solid; font-family:Arial, Helvetica, sans-serif; font-size:10pt; color:#666666; }


a#productsBack { background:url(../images/goBack.gif) left top no-repeat; display:block; width:200px; height:20px; padding:0 0 0 20px; }
a#productsBack:hover { background:url(../images/goBackHover.gif) left top no-repeat; }