body { margin: 0px; text-align: center; background: #ffffff url(images/background.jpg) top left repeat-x; font-size: 85%; font-family: arial, helvetica, sans-serif; line-height: 200%; }
img { border: 0px; }
table, select, textarea, input { font-size: 1em; font-family: arial, helvetica, sans-serif; }
fieldset { border: none; padding: 0px; }
label { display: block; width: 200px; height: 1.8em; float: left; clear: left; line-height: 1.7em; }
input { width: 180px; float: left; height: 1.5em; margin-bottom: 0.3em; }
input[type=radio] { clear: left; width: 1em; border: none; }
input[type=checkbox] { clear: left; width: 1em; margin-right: 10px; border: none; }
.check-mate { width: 380px; margin-top: 20px; }
select { float: left; height: 1.5em; margin-bottom: 0.3em; }
.field-options { float: left; }

form h3 { border-bottom: 1px solid #e0e0e0; }
form a { font-size: 0.8em; text-decoration: underline; display: block; float: left; margin-left: 10px; }

h1, .title { font-size: 2.4em; letter-spacing: -1px; font-weight: bold; display: block; }
h1 { border-bottom: 1px solid #e0e0e0; padding-bottom: 20px; margin-top: 20px; margin-bottom: 5px;}

.faqs { margin: 0px; }
.faq { margin: 20px 0px 60px; }

a, a:visited { color: #3ea8cd; text-decoration: none; }
a:hover { color: #47c7f3; }
a:active { color: #000000; }


#header, #page { text-align: left; margin: 0px auto !important; position: relative; }
#header { width: 950px; height: 200px; color: #ffffff; }
#header p { font-size: 1.6em; position: absolute; top: 100px; margin: 0px !important; left: 20px; line-height: 150%; }
#header p .highlight { display: block; }

#bkkwebsites { position: absolute; right: 20px; top: 40px; width: 301px; height: 37px; }
#menu { padding: 0px 40px; width: 910px; _width: 990px;  margin: 0px auto; list-style-type: none; font-weight: bold; text-transform: uppercase; height: 30px; background: url(images/menu-bottom.gif) bottom left no-repeat; margin-top: 10px; }
#menu li { padding: 0px; margin: 0px; float: left; line-height: 25px; } 
#menu li a, #menu .current { display: block; padding: 0px 22px 0px 8px; }
#menu li a, #menu li a:visited, #phone span { color: #628a2a; text-decoration: none; }
#menu li a:active { color: #000000; }
#phone { float: right !important; }


#page { padding: 20px 60px 40px; width: 870px; _width: 990px; background: url(images/content.jpg) left top no-repeat; min-height: 580px; }

#low-cost-website { display: block; border-bottom: 6px solid #ffffff; clear: both; }

#menu li a:hover, #menu .current { color: #173c15; }
#menu .current { background: url(images/current-menu.gif) left top no-repeat; }
a.get-started { color: #ffffff !important; padding-right: 12px !important; background: url(images/get-started.gif) right center no-repeat; }
a.get-started:hover { background: url(images/get-started.gif) right center no-repeat !important; color: #d8fe6a !important; padding-right: 13px !important}

#five-mins { font-size: 1.8em; line-height: 1.4em; margin-top: 0px; border: none !important; }
.fifties { width: 48%; float: left; height: auto !important; min-height: 300px; height: 300px; }
.fifties h2 { margin-top: 0px; }
.left { padding-right: 1%; }
.right { padding-left: 1%; border-left: 1px solid #d0d0d0; }

.nowrap { white-space: nowrap; }
td.nowrap { padding-right: 40px !important; }
.nostrong { font-weight: normal; }

#affordable, #impressive, #hassle-free, .box  { width: 266px; _width: 286px; padding: 0px 10px; height: 240px; float: left; display: block; color: #ffffff; text-decoration: none; position: relative; }
#drop-in { padding: 0px !important; width: 286px !important; }
#drop-in .title { padding: 5px 10px; }
#affordable .title, #impressive .title, #hassle-free .title, .box .title { margin: 8px 0px 18px; } 
.box .title { padding: 5px 0px; }
#affordable:hover .title { color: #99be30; }
#impressive:hover .title { color: #3ea8cd; }
#hassle-free:hover .title { color: #ca36a4; }
#affordable:hover .highlight, #impressive:hover .highlight, #hassle-free:hover .highlight { padding-left: 2px; color: #ffffff !important; }
.link { position: absolute; bottom: 0px; line-height: 70px; left: 10px; display: block; width: 266px; font-weight: bold; font-size: 1.4em; }
#affordable strong, #impressive strong, #hassle-free strong { font-size: 1.2em; }
#affordable strong img { float: right; position: relative; top: -4px; right: -10px; }
#affordable, #drop-in { background: url(images/affordable.gif) top left repeat-x; }
#impressive, #address { background: url(images/impressive.gif) top left repeat-x; margin: 0px 6px; }
#hassle-free, #contact { background: url(images/hassle-free.gif) top left repeat-x; }
.box { line-height: 140%; }
.box a, .box a:visited { text-decoration: none; color: #d8fe6a; }
.box a:hover { color: #ffffff; }
#affordable .link { background: url(images/piggy-bank.gif) right bottom no-repeat; }
#impressive .link { background: url(images/heart.gif) right bottom no-repeat; }
#hassle-free .link { background: url(images/key.gif) right bottom no-repeat; }

#low-cost-website { margin: 0px; padding: 0px; }
#website-templates { margin-top: 20px; }
#footer { margin-top: 20px; line-height: 140%; font-size: 0.8em; color: #444444; padding-top: 10px; border-top: 1px solid #e0e0e0; }
#footer p { margin: 0px; }
#footer address { margin-top: 2px; font-size: 0.9em; }


.submit, .skip { height: 3em; line-height: 3em; font-size: 1.2em; margin-top: 1em; margin-right: 10px; }
.submit { clear: left; margin-left: 200px; }

.pricing { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
.pricing td, .pricing th { margin: 0px; padding: 10px 5px; border: 1px solid #e0e0e0; text-align: left; vertical-align: middle; }
.pricing th { color: #ffffff; font-size: 1.6em; }
#get-started { padding: 5px; color: #ffffff; margin-bottom: 10px; font-weight: bold; font-size: 1.2em; }
.pricing th.highlightpink { background-color: #f347c7; }
.pricing th.lowlightgreen, #get-started { background-color: #9fd500; }
.pricing th.highlightblue { background-color: #47c7f3; }
.price { width: 200px; }
#terms { height: 300px; border: 1px solid #d0d0d0; overflow: auto; }

h1.lowlightgreen, h2.lowlightgreen, span.lowlightgreen, h3 .lowlightgreen { color: #9fd500; }
span.highlightgreen { color: #94ab51; }

.error { font-weight: bold; font-size: 0.8em; padding: 5px; border: 2px solid #880000; margin-bottom: 10px; }
.error ul { font-weight: normal; }

span.required { color: #aa0000; font-size: 1.1em; }
input.required { border: 1px solid #e08000; }

.get-started-link, .get-started-link:visited { font-size: 260%; color: #9fd500 !important; }
.get-started-link:hover { color: #94ab51 !important; }

#template-examples  { padding-top: 20px; }

#template-examples h2 { padding-top: 45px; }
.designer { font-size: 0.8em; margin-top: 40px; }
.designer strong { padding-left: 20px; }

.example-design { float: left; margin-right: 20px; clear: both; }

.note { margin-left: 200px; line-height: 120%; }
.bignote { margin-top: 10px; border-bottom: 1px solid #e0e0e0; }
.note, .bignote { color: #3ea8cd; font-size: 0.8em;  margin-bottom: 10px; padding-bottom: 10px; }
#webaddress { display: none; }
#webpages { clear: both; padding-top: 20px; width: 420px; float: left; }
#pageexamples { float: right; width: 410px; font-size: 0.8em; padding-top: 0px; line-height: 140%; }
#pageexamples li { margin-top: 0px; padding-top: 0px; margin-bottom: 0px; padding-bottom: 0px; width: 180px; float: left; }

#add-another-page { margin: 10px 0px !important; font-size: 1.1em; clear: both; display: block; }
#add-another-page span { font-size: 1.6em;  font-weight: bold; }
.remove-image { cursor: pointer; margin: 4px 5px 0px; }
#chosen-design { font-size: 1.6em; width: 420px; }
#design-chooser { width: 420px; float: left; }
#design-chooser .submit { margin-left: 0px !important; }
#design-preview { float: right; }

.clr { clear: both; height: 1px; overflow: hidden; margin-top: -1px; }

.highlight { color: #d8fe6a; }
.lowlight { color: #466e22; }

.halfleft, .halfright { border: 1px solid #dadece; font-size: 0.8em; margin-top: 40px; width: 415px; height: 238px; background-color: #f9faf5; color: #333333; }
.halfleft a, .halfright a { text-decoration: underline; }
.halfleft img, .halfright img { float: right; margin-left: 10px; }
.halfleft h2, .halfright h2 { font-size: 1.3em; margin-top: 20px; margin-left: 5px; padding-left: 28px; background: url(images/green-arrow.jpg) left top no-repeat; letter-spacing: -1px; }
.halfleft p, .halfright p { padding: 0px 10px 10px; line-height: 170%;  }
.halfleft { float: left; }
.halfright { float: right; }
.halfleft .highlight, .halfright .highlight, #process .highlight { color: #88ae1d; }

#process { border: 1px solid #dadece; margin-top: 40px; height: 350px; padding: 20px 10px; }
#process h1 { line-height: 100%; border: none !important; margin: 0px 0px 0px; color: #a6a6a6; }
#process strong { line-height: 140% !important; display: block; }
#process a, #process a:visited { float: right; padding-left: 18px; padding-right: 10px; background: url(images/pink-arrows.gif) left center no-repeat; font-size: 1.7em; color: #ba1690; font-weight: bold; letter-spacing: -1px; }
#process a:hover { padding-left: 17px; color: #d935af; }

#budget-websites { font-size: 0.75em; }
#budget-websites ul { list-style-type: none; padding: 0px; margin: 0px; }
#budget-websites li { width: 200px; float: left; margin: 0px; padding: 0px; }
