/********** gloabl **********/
body { font: 90%/1.25  helvetica, arial, trebuchet ms, verdana, sans-serif;  
 width:100%; padding: 0px 0px;  letter-spacing: 1px; 
background:#bbb; background-image: url(/assets/images/graygradient.gif); background-repeat: repeat-x; }

h1, h2, h3 {font-weight: bold; margin: 0px; padding: 5px 0px; }
h1 {font-size: 150%; color: #22668B;}
h2 {font-size: 130%; color: #C61A2B;}
h3 {font-size: 110%;color: #C61A2B;}
h4 {font-size: 110%;}
p {padding: 5px 0px; }
strong {font-weight: bold;}
li {list-style: none;}
img {margin: 10px;}
a {color: red;}
a:hover {color: #666;}
input { background: #F3F4EC !important; } /*  correct FF yellow fields  */ 
input.radio {background: #FFFF80 !important;}

/************* Editor Styles **********/
.textleft { padding: 10px; width: 25%; float: left; font-size: 100%; 
 color: #D8D8D8; margin: 20px 20px 10px 0px; border: 1px solid #ffc700;}
.textright { padding: 20px; width: 25%; float: right; font-size: 100%; 
 color: #D8D8D8; margin-right: 10px; border: 1px solid #ffc700;}
.imageleft {float: left; margin-left: 0px;}

.imageright {float: right; margin-right: 0px; clear: right;}

.rts { color: #C61A2B; font-weight: bold; font-style: italic; }
.imagecenter {display: block; margin:0 auto;}
#mceContentBody {background-color: #fff;}
/***** Wrapper *****/
#wrapper { width: 900px; margin: 30px auto 0px; background: #fff; border: 1px solid #000;}

/********** masthead **********/
#masthead {background-image: url(/assets/images/Header1.jpg); height: 190px; background-repeat: none;}
#masthead { padding: 5px; border-bottom: 1px solid #000;  }
#masthead img {float: left; height: 135px;}
#masthead .phone { margin: 10px 20px 0 360px; color: #; padding: 10px;}


/********** main **********/
.imagegrid img {padding: 0; margin: 2px 4px 15px 0; width: 145px; height: 150px; border: 1px solid #000;}
.contentbox {background-color: #eee; margin: 0px 0 25px; padding: 10px;}

#gotoform  {display: inline-block; color: #fff; margin: 0 10px; padding: 2px 5px; border: 1px solid gray; 
 background: #C61A2B; float: right; }
#gotoform a, #formlist a {text-decoration: none; color: #000; }
#formlist li a { display: block; font-weight: bold; font-size: 110%;padding:10px; height: 6em;}
#formlist li { float: left; display: block; width: 165px; heightx: 6em; margin: 10px; background-color: #FFFF80; 
border: 3px outset #ccc; padding: 0px;}
#formlist a:hover, #formlist li:hover {background-color: #C61A2B; }

#content {width: 100%; background-color: #fff; }
#rightcolumn {background-image: url(/assets/images/background.gif)  ; background-repeat: repeat-y;} 
#rightcolumn {float: right; ; margin-left: 0px; padding: 25px 20px 25px 235px; width: 645px;}
#leftcolumn { width: 225px; float: left; margin-right: -225px; }
#leftcolumn h2 {color: #fff; margin-left: 30px;}
#rightcolumn ul {padding: 10px 10px 10px 45px;}
#rightcolumn li {list-style: disc outside; }

#formlist ul {padding: 0px}
#folds {margin: 10px 20px; display: inline-block; text-align: center;}
#folds img, #folds span {float: left; width: 115px; margin:auto; text-align: center;}
/*********  accordian  *********/
.header { /*header of 1st demo*/
}

#map {border: 1px solid #000;}
/**********  Forms  ************/

fieldset {padding: 0 10px 10px; border: 1px solid #666; background-color: #FFFF80; 
   clear: both; }
legend {display: inline-block; color: #fff; margin: 20px 10px; padding: 2px 5px; 
   border: 1px solid gray; background: #C61A2B; }
input, select {margin-bottom: 5px; font-size: 90%; }

select {margin-bottom: 2px ; font-size: 90%;}
.button {margin-left: 243px;  cursor: pointer; }
.button:hover {background-color: #bbb!important;}
#spf_form input.button {margin-left: 10px;}


.yourinfo {padding: 2px 5px; margin-top: 25px; border: 1px solid gray; background: #C61A2B; }
.errors {background-color: yellow;padding: 0 3px;}
.orderform {padding: 5px; width: 100%; }


#orderform {clear: left; }
.orderformbooklets {clear: right; width: 100%;}
#orderform input.radio, #orderform select.radio, #orderform label.choice { width: 30px;  }
#orderform label.choice2 {width: 90px; text-align: left;}
#orderform label {display:inline-block; text-align: right; width: 240px; vertical-align: top; padding-top: 3px; font-size: 90%; }
#location {margin-left: 195px;}
#location label {width: 45px; float: left;}
#location input {float: left; margin-left: 5px;}
#orderform input.radio {margin-right: 0px}
#orderform input {margin-right: 0px;}
#orderform label.choice {margin: 0 0 0 -5px;  width: 70px; text-align: left;}
#orderform #job {margin-top: 20px;}
#form_container ul {padding-top: 0px;}

#bookletstock label {width: 125px;}
span.bookletstock label {width: 125px;}
#orderform label#length, #orderform label#width, #orderform label#height {width: 80px; text-align: left; }


#cutting {border: 1px solid #666; padding: 10px; margin: 25px 0; }
#cutting span {width: 240px; text-align: right;}
#infoinstructions {margin-left: 245px; font-size: 90%;}



/******** CONTACT FROM *********/
.spform_input {
		position:absolute;
		text-decoration:underline;
		background-color:#CC0000;
		left:0px;
		top:-500px;
		width:1px;
		height:1px;
		overflow:hidden;
		}

/***** Footer *****/

#footer {clear: both;  background-color: #C61A2B; width: 900px; margin: 0px auto 0px; border: 1px solid #c61a2b; 
  border-top: 0px; padding: 10px 0;}
#footer p {font-size: 75%; text-align: center; clear: both; color: #fff;}
#footer a {color: #fff;}
#footer a:hover {color: #666;}

#credit {clear: both;  width: 900px; margin: 0px auto 30px; padding: 10px 0;}
#credit p {text-align: right; color: #707070; font-size: 80%;}
#credit a {color: #707070;} 
#credit a:hover {text-decoration: none;}

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from ie-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from ie-mac */