html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; text-shadow: 0 0 none}
 body {line-height: 1}
 ol, ul {list-style: none}
blockquote, q {quotes: none}
  ins {text-decoration: none}
del {text-decoration: line-through}
 table {border-collapse: collapse; border-spacing: 0}
 .floatLeft {float: left; text-align: left}
img.floatLeft {margin: 0 10px 10px 10px}
.floatRight {float: right; text-align: right}
img.floatRight {margin: 0 10px 10px 10px}
.floatClear, .cleaner {clear: both}
br.floatClear {margin: -1px -1px 0px 0px; width: 1px; height: 1px; clear: both}
 .clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden}
.alignRight {text-align: right}
.alignCenter {text-align: center}
div.hr {clear: both; margin: 0; padding: 0;  }
div.hr hr {display: none}
.hide {display: none !important}
.bold {font-weight: bold}
.noBg {background: none !important}
.error {color: #f00; font-weight: bold}
:focus, a {-moz-outline-style: none;  outline: none !important;  }
.nb {border: 0;}
 html {height: 100%; margin: 0px; padding: 0px; overflow-x: hidden;  }
html.home {overflow: hidden}
body {background: #fff url("images/checker-board.gif") fixed left -1px; font-family: Arial, Helvetica, sans-serif; color: #515253; margin: 0; padding: 0; font-size: 11px; height: 100%; */ }
body.home {overflow: hidden}
 div#fudge {display: block; position: relative; text-align: left; width: 1024px; background-image: url("images/columns.gif"); min-height: 100%; padding: 0px 0 60px 0}
div#rule-vert {position: fixed; z-index: 1001; width: 15px; min-height: 100%; left: 0px; top: 0px; background: #fff url("images/rule-vert.gif") no-repeat left 15px}
div#rule-vert span {width: 15px; height: 1px; background: #fff url("images/marker.gif") repeat-x; display: block}
div#rule-hor {z-index: 1001; position: fixed; height: 15px; width: 100%; left: 0px; top: 0px; background: #fff url("images/rule-hor.gif") no-repeat left top}
div#rule-hor span {width: 1px; height: 15px; background: #fff url("images/marker.gif") repeat-y; display: block}
div.guide-hor {background-color: #b1f8f8; height: 1px; width: 100%; position: absolute; margin: 200px 0 0 0}
/*div#toolbar {position: fixed; top: 514px; z-index: 1002; left: 0px; width: 26px; height: 626px; background: url("images/toolbar.gif")}*/
 div#col1 {width: 196px; padding: 113px 0 0 0px; position: fixed; _position: absolute; top: 0px}
div#col2 { width: 436px; margin: 0 0 0 196px; position: relative}
div#col3 { margin: 0 0 0 632px; width: 392px; position: fixed; _position: absolute; top: 0px}
 h1 {height: 60px; width: 154px; margin: 0 0 161px 27px}
h1 a {display: block; height: 60px; width: 154px; font-size:50px; text-align: left; color: #515253;}
p {line-height: 1.2em}
a {text-decoration: none; color: #f94903}
a:hover {color: #000}
div#col3 div#filters {height: 101px; position: relative; padding: 0 0 0 11px}
div#col3 div#filters ul {position: absolute; top: 24px}
div#col3 div#filters ul li {float: left; margin: 0 10px 0 0}
div#col3 div#filters ul li a {color: #515253; font-weight: normal; background: url("images/checkboxes.gif") no-repeat 0 2px; padding: 0 0 0 12px}
div#col3 div#filters ul li a:hover, div#col3 div#filters ul li.current a {color: #000; background: url("images/checkboxes.gif") no-repeat 0 -14px}
/*div#col3 div#filters a#twitter {position: absolute; right: 14px; top: 25px}
body.isIE div#col3 div#filters a#twitter {position: absolute; right: 13px; top: 25px}*/
div#col1 p {margin: 0px 0 0 32px}
/*div#col1 p a {text-indent: -1000px; display: block; height: 175px; width: 138px; background: url("images/slant-launcher.gif")}
div#col1 p a:hover {background: url("images/slant-launcher.gif") 0px -175px}*/
/*div#col3 div#time-of-day {padding: 0 0 0 11px; height: 48px; background: url("images/anim-morning-cursor.gif") 11px 0px no-repeat}
div#col3 div#time-of-day.afternoon {background: url("images/anim-afternoon-cursor.gif") 11px 0px no-repeat}
div#col3 div#time-of-day.evening {background: url("images/anim-evening-cursor.gif") 11px 0px no-repeat}*/
div#col3 p#hello, div#col3 p#about {font-size: 40px; margin-left: 10px;}
div#col3 p#hello {color: #000;}
div#col3 p#about {color: #F94903; line-height: 90%;}
div#col3 h2 {display: block; text-indent: -2000px; width: 351px; height: 196px; background: url("images/welcome.gif") 0px 0px no-repeat; margin: -2px 0 19px 11px}
div#col3 div.info {height: 174px; width: 327px; overflow: hidden; margin: 0 0 0 11px; position: relative}
div#col3 div.info p {margin: 0 0 12px 0}
div#col3 div.copy { width: 1000px; position: absolute}
div#col3 div.copy div.col1, div#col3 div.copy div.col2, div#col3 div.copy div.col3, div#col3 div.copy div.col4, div#col3 div.copy div.col5, div#col3 div.copy div.col6 {float: left; margin: 0 18px 0 0}
div#col3 div.copy div.col1 {margin: 0 16px 0 0}
body.isSafari div#col3 div.copy div.col2 {margin: 0 19px 0 0 !important}
body.isIE div#col3 div.copy div.col2, body.isIE div#col3 div.copy div.col4 {margin: 0 12px 0 0 !important}
div#col3 div.copy div.col1 p, div#col3 div.copy div.col4 p {margin: 0 0 12px 0}
div#col3 div.copy div.col1 p.no-margin {margin: 0px}
div#col3 div.copy div.col2 {margin: 0 11px 0 0px !important; width: }
div#col2 div.copy ul, div#col2 div.copy ol {margin-left: 12px;}
div#col2 div.copy ul {list-style-type: disc;}
div#col2 div.copy ol {list-style-type: decimal;}
body.isSafari div#col3 div.copy div.col2 {margin: 0 13px 0 0px !important}
body.isSafari div#col3 div.copy div.col4 {margin: 0 24px 0 0px}
div#col3 div.copy div.col3 {margin: 0 26px 0 0}
div#col3 ul#info-pagination {margin: 140px 0 0 0px}
div#col3 ul {  }
div#col3 ul li {float: left; margin: 0 3px 0 0}
div#col3 ul li.current a {color: #101010; cursor: default}
div#col3 ul li a {color: #f94903; font-weight: bold; text-decoration: none}
div#col3 ul li a:hover {color: #101010}
div#contact {padding: 0 0 0 11px}
div#contact p {margin: 0 0 10px 0; line-height: 1.3em}
div#contact a {color: #f94903; text-decoration: none; font-weight: normal}
div#contact a:hover {color: #000}
div#contact a.light {color: #feb598}
div#contact a.light:hover {color: #f94903}
div#contact div.col1, div#contact div.col2 {float: left; width: 169px}
div#contact div.col2 h3 {margin: 2px 0 11px 0}
body.isSafari div#contact div.col2 h3 {margin: 1px 0 10px 0}
div#contact div.col2 ul {margin: 0px; padding: 0px}
div#contact div.col2 ul li {float: none; margin: 0 0 4px 0}
div#contact div.col2 ul li a {font-weight: normal}
 div.guide-horizontal {position: fixed; height: 10px; width: 100%; background: url("images/guide.gif") repeat-x center center}
div.guide-horizontal:hover {cursor: ns-resize}
div.guide-vertical {position: fixed; top: 0px; left: 0px; width: 10px; height: 100%; background: url("images/guide.gif") repeat-y center center}
div.guide-vertical:hover {cursor: ew-resize}
div.story {background: #f5f4f3; padding: 113px 0 0 0;}
div.story div.header {background-color: #000; padding: 9px 0 8px 9px; position: relative; margin: 0 0 18px 0}
div.story div.header h2 {color: #fff; margin: 0 0 2px 0}
div.story div.header p {color: #f94903}
div.story div.header ul {position: absolute; right: 0px; top: 0px}
div.story div.header ul li {float: left}
div.story div.header ul li a {display: block; height: 13px; width: 13px; text-indent: -1000px; background: url("images/image-nav.gif")}
div.story div.header ul li a:hover, div.story div.header ul li.current a {background: url("images/image-nav.gif") 0 -13px}
div.story div.copy {padding: 0 9px 9px 9px}
div.story div.copy p {margin: 0 0 14px 0; line-height: 1.15em}
p.back {margin: 0px !important; padding: 0px !important}
p.back a {text-indent: -1000px; display: block; height: 21px; width: 21px; background: url("images/back.gif") 0px 0px}
p.back a:hover {background: url("images/back.gif") 0px -21px}
div.story div.images {position: relative; overflow: hidden; width: 436px; height: 268px}
div.story div.images div.slider {position: absolute; width: 5000px}
div.story div.images div.slider ul {margin: 0px; padding: 0px}
div.story div.images div.slider ul li {float: left}
 div#mask-top {height: 74px; background-color: #f5f4f3; opacity: .75; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; filter: alpha(opacity=75); position: absolute; left: 0px; top: 0px; width: 436px; cursor: pointer}
div#mask-top-solid-bg {height: 113px; background-color: #f5f4f3; position: absolute; left: 0px; top: 0px; width: 436px}
div#mask-top-solid {height: 74px; background-color: #f5f4f3; position: absolute; left: 0px; top: 39px; width: 436px}
div#mask-bg {height: 3000px; background-color: #f5f4f3; position: absolute; left: 0px; top: 0px; width: 436px}
div#mask-bottom {height: 1000px; background-color: #f5f4f3; opacity: .75; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; filter: alpha(opacity=75); position: absolute; left: 0px; top: 599px; width: 436px; cursor: pointer}
div#mask-middle {height: 75px; background-color: #f5f4f3; position: absolute; left: 0px; top: 524px; width: 436px}
  div.articles {position: absolute}
div.article-group {height: 1%; background: #fff;  padding: 0 0 73px 0}
div.article-group.last {padding: 0px; background: none !important}
div.article {width: 218px; float: left}
div.hover {cursor: pointer}
div.article a img {*margin-bottom: -3px}
div.article div.info {background-color: #222222; height: 60px; padding: 7px 7px 7px 8px}
div.hover div.info {background-color: #000}
div.article div.info h3 {margin-bottom: 3px}
div.article div.info h3 a {color: #fff; font-weight: bold; text-decoration: none}
div.hover div.info h3 a {color: #f94903}
div.article div.info p {color: #c0bfbf; margin-bottom: 3px}
div.article div.info p.date {color: #f94903}
  div.article-nav {position: absolute; top: 535px}
div.article-nav ul {height: 500px; position: relative}
div.article-nav ul li.up {top: -453px; position: absolute}
div.article-nav ul li.up a {display: block; height: 21px; width: 21px; text-indent: -1000px; background-image: url("images/list-arrows.gif")}
div.article-nav ul li.up a:hover {background-position: 0 -42px}
div.article-nav ul li.down a {display: block; height: 21px; width: 21px; text-indent: -1000px; background: url("images/list-arrows.gif") no-repeat 0 -21px}
div.article-nav ul li.down a:hover {background-position: 0 -63px}
 #slant-container {position: absolute; top: 0px; left: 0px;  width: 100%; height: 100%; z-index: 999999;  }
#slant-inner {width: 100%; height: 100%; position: relative}
#slant-tint {position: absolute; top: 0px; left: 0px; background: #000; width: 100%; height: 100%; -moz-opacity:.80; filter:alpha(opacity=80); opacity:.80}
#slant-content {position: absolute; top: 51px; left: 0px}
 #slant-content ul.controls {position: absolute; right: 0px}
#slant-content ul.controls li {width: 21px; height: 21px; margin: 0px; padding: 0px}
#slant-content ul.controls li a {text-indent: -1000px; display: block; height: 21px; margin: 0px; padding: 0px}
#slant-content ul.controls li.close a {background: #fff url("images/close.gif")}
#slant-content ul.controls li.close a:hover {background: #fff url("images/close.gif") 0px -21px}
#slant-content ul.controls li.back a {background: #fff url("images/back-slant.gif")}
#slant-content ul.controls li.back a:hover {background: #fff url("images/back-slant.gif") 0px -21px}
 #slant-content div.col1 {float: left; width: 196px; position: relative}
div.slant-active {background:#fff url("images/border.gif"); height: 203px; width: 178px; margin: 268px 0 0 15px; padding: 1px; text-indent: -1000px}
div.slant-active div {background: #fff url("images/slant-active.gif"); width: 178px; height: 203px}
/*#slant-content div.col1 div#crop-handles {position: absolute; height: 211px; width: 186px; background: url("images/crop-handles.gif"); left: 12px; top: 265px}*/
#slant-content div.col2 {float: left; width: 457px; position: relative; overflow: hidden; height: 754px}
body.isIE #slant-content div.col2 img {margin: 0px 0 -2px 0}
#slant-content div.col2 div#slide-wrapper {position: absolute; left: 0px; padding: 0px}
#slant-content div.col2 div.inner {width: 436px; background: #000; padding: 0 0 1000px 0}
#slant-content div.inner div.content {background: #000; padding: 0 10px}
#slant-content div.header {padding: 9px 0 8px 0px; margin: 0 10px 18px 10px; background: #000 url("images/dashed-line.gif") repeat-x 0 bottom}
#slant-content div.header h2 {color: #fff; margin: 0 0 2px 0}
#slant-content div.header p {color: #f94903; margin: 0px 0 0px 0; padding: 0px}
#slant-content p {color: #f5f4f3; margin: 0 0 13px 0; line-height: 13px}
#slant-content h3 {color: #fff; padding: 14px 0 0 0; font-weight: normal; margin: 0 0 7px 0}
#slant-content div.content ul li {float: left; margin: 0 10px 0 0}
#slant-content div.content ul li a {color: #fff; background: url("images/checkboxes-white.gif") no-repeat 0 2px; padding: 0 0 0 12px}
#slant-content div.content ul li a:hover {background-position: 0 -14px;  }
 div#error_container p {color: #f6b608}
div#error_container p a:hover {color: #fff}
div.slant-form {padding: 0 0 0 10px}
div.slant-form form {}
div.slant-form fieldset {}
div.slant-form fieldset.buttons {padding: 11px 0 0 0}
div.slant-form fieldset ol {}
div.slant-form fieldset ol li {margin: 0 0 9px 0}
div.slant-form-post fieldset ol li.floatField {float: left; margin: 0 9px 9px 0}
div.slant-form fieldset ol li.post-field {}
div.slant-form fieldset ol li label {display: block; color: #fff; margin: 0 0 8px 0}
div.slant-form fieldset ol li input {width: 163px; border: 1px solid #434342; background: none; color: #fff; font-family: arial; padding: 3px 1px}
div.slant-form fieldset ol li input.error {border: 1px solid #f6b608; font-weight: normal}
div.slant-form fieldset ol li.short input {width: 75px}
div.slant-form input.submit {background: url("images/submit.gif") no-repeat left top; font-size: 1px; height: 19px !important; width: 78px !important; text-align: left; color: #fff; padding: 0; margin: 0; cursor: pointer; border: none}
div.slant-form-post input.submit {margin: 0 0 0 172px}
 * >input[type=submit] {text-indent: -9999em}
 input[type=submit]:hover {background-position: left bottom}
 div.slant-form input.submit:hover {background: url("images/submit.gif") no-repeat 0 -19px !important}
  div#download {}
div#download p {margin: 0 0 17px 0}
div#download a {text-indent: -1000px; display: block; width: 109px; height: 19px; background: url("images/download.gif") 0 0}
div#download a:hover {display: block; width: 109px; height: 19px; background: url("images/download.gif") 0 -19px}
 div.blog div#col1 {padding: 25px 0 0 0}
div.blog div#col1 p {margin: 0 0 77px 27px}
div.blog div#col1 p a {height: 11px; width: 85px; text-indent: -1000px; background: url("images/back-to-home.gif") no-repeat; padding: 0 0 0 20px}
div.blog div#col1 p a:hover {text-indent: 0px; background-position: bottom left}
#posts {padding: 113px 0 0 0; background-color: #f5f4f3}
#posts div {margin: 0 0 31px 0}
#posts div div.header {background-color: #000; padding: 9px 0 8px 9px; position: relative; margin: 0 0 18px 0}
#posts div div.header h2, #posts div div.header h2 a {color: #fff; margin: 0 0 2px 0}
#posts div div.header p {color: #f94903}
#posts div div.snippet {margin: 0px 7px 18px 9px; background: url("images/dashed-line-light.gif") repeat-x bottom left; padding: 0 0 8px 0}
#posts div div.snippet p {margin: 0 0 13px 0}
#posts div div.snippet p.comments {margin: 0 0 0px 0}
p#more-posts {padding: 0 0 16px 0}
p#more-posts a {display: block; width: 126px; height: 22px; background: url("images/more-posts.gif"); text-indent: -1000px}
p#more-posts a:hover {background-position: bottom left}
p#up {padding: 0 0 10px 0}
p#up a {display: block; width: 21px; height: 21px; background: url("images/up.gif"); text-indent: -1000px}
p#up a:hover {background-position: bottom left}
div.blog div#col3 img {margin: 0 0 0 11px}
div.blog div#col3 h2 {display: block; text-indent: -2000px; width: 351px; height: 205px; background: url("images/welcome-blog.gif") 0px 0px no-repeat; margin: -2px 0 30px 11px}
div.blog div.lists {padding: 0 0 0 11px}
div.blog div.lists div {float: left; width: 120px}
div.blog div.lists h3 {background-color: #000; padding: 5px 10px 6px 7px; font-weight: normal; color: #fff; margin: 0 0 8px 0; display: inline-block}
div.blog div.lists div ul li {clear: both; margin: 0 0 2px 0 !important}
div.blog div.lists div ul li a {color: #515253 !important; font-weight: normal !important}
div.blog div.lists div ul li a:hover {color: #f94903 !important}
 div.blog div#col3 {padding: 25px 0 0 0}
div.blog div#col3 div.search {margin: 0 0 34px 0; padding: 0px}
div.blog div#col3 form {margin: 0 0 20px 0; padding: 0 0 0 11px}
div.blog div#col3 form ol li {float: left; padding: 0px; margin: 0px}
div.blog div#col3 form ol li input {border-top: 1px solid #b8b7b6; border-left: 1px solid #b8b7b6; border-bottom: 1px solid #b8b7b6; padding: 3px; font-family: arial; color: #515253; width: 159px; margin: 0px}
body.isSafari div.blog div#col3 form ol li input {padding: 4px 3px 3px 3px}
div.blog div#col3 form p input.submit {background: url("images/search-submit.gif") no-repeat left top; font-size: 1px; height: 21px !important; width: 21px !important; text-align: left; color: #fff; padding: 0; margin: 0 0 0 -2px; cursor: pointer; border: none}
div.blog div#col3 form p input.submit:hover {background-position: bottom left}
 
@import url("common.css");
@import url("application.css");
/* modules */

/* pages */
@import url("home.css");  
@import url("detail.css");  
@import url("slant.css");