/* copyright 2009 Shaolin Kung Fu Institute. All Rights Reserved Author: Maya Lindenmuth Date: 3/25/2009 */ /* default styles go in to browser reset. fonts sizes, font families, general color information, ect. can be changed to accomodate project needs. clearfix should also reside here */ 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, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0px; padding: 0px; white-space: normal; border: 0px; outline: 0px; font-weight: normal; font-style: normal; font-size: 1em; vertical-align: baseline; font-family: Arial, Helvetica, sans-serif; } body { background: #2f000f; line-height: 1.2em; color: #666; font-size: 11px; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0px; } caption, th, td { text-align: left; font-weight: normal; } /* form elements */ input, textarea { margin: 0px; padding: 1px 6px 1px; border: 1px solid #ccc; outline: 0px; font-size: 1em; font-family: Arial, Helvetica, sans-serif; color: #666; } select { margin: 0px; padding: 0px 0px 0px 3px; border: 1px solid #ccc; outline: 0px; font-size: 1em; font-family: Arial, Helvetica, sans-serif; color: #000; } select option { padding-right: 10px; }/*so text isn't hidden by drop down in selects with only 2 characters*/ button { margin: 0px; } h2 { background: url(../images/background/h2.gif) left top repeat-x; color: #fff; padding: 10px; text-transform: uppercase; font-size: 1.4em; } h3 { color: #903; font-size: 1.3em; line-height: 1.3em; margin-bottom: 7px; } h3.media { background: url(../images/background/media_header.png) left bottom no-repeat; text-align: left; } p.h4 { color: #000; font-weight: bold; } p { line-height: 1.7em; letter-spacing: .1em; } ol, ul { list-style: none; } #content ol, #content ul { line-height: 1.7em; letter-spacing: .1em; } /* default links */ a { cursor: pointer; } a:link { color: #000; text-decoration: none; } a:visited { color: #000; text-decoration: none; } a:hover { color: #000; text-decoration: underline; } /* remember to define focus styles! */ a:focus { overflow: hidden; } /* hides flash outline when clicked */ object { outline:none; } /* skip links for accessibility */ #skip_points { position: absolute; left: -9999px; top: -9999px; } /* Clearfix */ .clearfix:after, #container:after, #navSupplementary ul:after, .col_content:after, .col_content_wrapper:after {content: "."; display: block; height: 0px; clear: both; visibility: hidden;} .clearfix, #container, #navSupplementary ul, .col_content, .col_content_wrapper {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix, * html #container, * html #navSupplementary ul, * html .col_content, * html .col_content_wrapper {height: 1%;} .clearfix, #container, #navSupplementary ul, .col_content, .col_content_wrapper {display: block;} /* End hide from IE-mac */ /* copyright 2009 Shaolin Kung Fu Institute. All Rights Reserved Author: Maya Lindenmuth Date: 3/25/2009 */ /* Styles that go in here include the layout elements of the site -- float, display, position, margin, padding, height, width, z-index, clear */ body { } /****************************** START :: page **********************/ #wrapper { padding-bottom: 54px; } #container { width: 990px; margin: 0px auto;position:relative; padding-bottom: 55px; } #wrapper_container { position: relative; left: 0; /* ie layout fix */padding-top:167px;/* to account for height of footer */} /* stant :: content */ #content { position: relative; top: 0; left: 0; width: 790px; float:right;} #content #content_container { height: auto;} #flashBanner_container { margin-bottom: 9px; height: 227px; } .col1 { width: 590px; float: left; } .col2 { width: 450px; float: left; } .col3 { width: 330px; float: right; } .col_ful { width: 788px; float: left; } .last { float: right; } .col_additional { width: 190px; float: right; } .col_content { margin-bottom: 13px; } .col_additional .col_content { margin-bottom: 10px; } .col_content .col_content_wrapper { padding: 7px 7px 3px 7px; } .col_content .col_content_wrapper img.al { float: left; padding: 1px 8px 0px 0px; } .col_content .img, .col_content .cont, .col_content .links { margin: 13px 0px 20px; } .col_content .img { float: left; padding-left: 10px; } .col_content .cont { float: left; width: 180px; padding: 0px 10px 0px 23px; } .col_content .long { width: 370px; } .col_content .long p { padding-bottom: 17px; } .col_content .cont ul, .col_content .types ul, .col_content .gen ul, .col_content .gen p { padding-bottom: 17px; } .col_content .cont ul li, .col_content .types ul li, .col_content .gen ul li { padding-left: 12px; } .col_content .links { height: 155px; float: left; padding: 18px 0px 0px 17px; width: 175px; } .col_content .additional { padding-left: 10px; clear: left; } .col_content .spot { float: left; padding: 10px 15px 20px 11px; width: 160px; height: 170px; } .col_content .spot img { padding-bottom: 8px; } .col_content #classesPlaceholder { margin: 12px 0px 10px 9px; height: 208px; } .col_content .types { float: left; } .col_content .types .type_class { width: 250px; padding: 0px 16px; float: left; } .col_content .directions .types .type_class { width: 162px; padding-right: 6px; } .col_content .types .type_class ul { padding-bottom: 0px; } .action { margin: 17px 0px; } .action button { padding: 0px; margin: 0px; width: 67px; height: 27px; } .action button.learn { width: 102px; } .action button strong { position: relative; left: -9999px; } .directions p { padding: 0px 0px 17px; } .directions ul li { display: inline; padding-left: 16px; } .directions p.schedule a { display: block; } .directions p.schedule a span { } .wrapper, .gen { padding: 17px 0px 17px 9px; } .wrapper p { padding-bottom: 17px; } .vcard { margin: 0px 0px 17px; } .wrapper fieldset { width: 272px; float: left; margin-top: 12px; } .wrapper fieldset .field { float: left; margin-bottom: 7px; width: 272px; clear: left; } .wrapper fieldset label { width: 100px; float: left; padding-right: 12px; } .wrapper fieldset input { width: 144px; } .wrapper fieldset select { width: 158px; } .wrapper fieldset textarea { width: 144px; height: 86px; } .wrapper fieldset .action { clear: left; margin-left: 20px; } .wrapper fieldset p.required { margin-left: 112px; } table { width: 770px; margin-bottom: 17px; } table caption { position: absolute; left: -9999px; } table th { padding: 6px; } table td { padding: 6px 12px; } .col2 h3 { margin-bottom: 3px; } .col2 p { margin-bottom: 17px; } .col2 .h4 { margin-bottom: 8px !important; } .heirarchy { padding-left: 6px; } .lineage { width: 292px; height: 128px; padding: 0px 0px 0px 16px; } .lineage img { float: left; } .lineage p { float: right; margin-top: 35px; padding-right: 15px; text-align: left;width: 165px; } .heirarchy .last { height: 90px; margin-bottom: 35px; } /* end :: content */ /* start :: branding elements */ #branding { position: absolute; left:0;top:0;height:154px;} /* start :: logo */ #branding #logo { width: 716px; float: left; position: absolute; left:36px; top: 19px; } #branding #logo h1 a { width: 716px; height: 126px; display: block; } #branding #logo strong { position: relative; left: -9999px; } /* end :: logo */ /* start :: main navigation */ #branding #navMain { width: 255px; position: absolute; left: 735px; margin-top: 25px; float: right; } #branding #navMain ul { float: right; } #navMain ul li { display: inline; padding: 0px 0px 4px 18px;} #navMain ul li.first { padding-top: 1px; float: left; width: auto; } /* end :: main navigation */ /* start :: secondary (left) navigation */ #navSecondary { top:0; width: 190px;float:left; left:0;clear:left; } #navSecondary .navSecondaryWrapper { padding: 17px 0px } #navSecondary .navSecondaryWrapper a { display: block; padding: 16px 0px 15px 12px; margin-right: 18px; } /* end :: secondary (left) navigation */ /* end :: branding elements */ /* start :: footer navigation */ #navSupplementary { width: 990px; position: absolute; display: block;bottom:0;/* position the footer at the bottom of the page. */ left:0;height:20px;} #navSupplementary ul { float: right; } #navSupplementary ul li { float: left; padding-left: 13px; } /* end :: footer navigation */ #print { display: none; } /* Styles that go in here include the graphic look and feel styles for the site -- background, border, list-style-type */ /****************************** START :: page **********************/ #wrapper { background: url(../images/background/footer.png) left bottom repeat-x; } #body { background: #ccc url(../images/background/branding.png) left top repeat-x; } #logo h1 a { background: url(../images/branding/logo.png) left top no-repeat; } .col_content { border: 2px solid #fff; } .col_content .col_content_wrapper { background: #c8c8c8 url(../images/background/content_container.png) left top repeat-x; } .col_content .cont ul li, .col_content .types ul li, .col_content .gen ul li { background: url(../images/background/bullet.gif) 0px 8px no-repeat; } .col_content .links { background: url(../images/background/links_divide.gif) left center no-repeat; } .col_content .types { background: url(../images/background/vert_divide.png) center no-repeat; } .col_content .directions .types, .col_content .directions .types .first { background: none !important; } .col_content .directions .types .type_class { background: url(../images/background/vert_divide.png) left center no-repeat; } .action button { background: url(../images/content/submit.gif) left top no-repeat; border: none; cursor: pointer; } .action button.learn { background: url(../images/content/learnMore.gif) left top no-repeat; } .directions { } .directions ul li { background: url(../images/background/divider2.gif) 6px 0px no-repeat; } .directions ul li.first { background: none; } .directions p.schedule a { } table th { background: #c8c8c8; border-left: 1px solid #fff; } table th.first { border-left: 1px solid #c8c8c8; } table td.none { border-bottom: none; } table tr.kwoon th { border-top: 1px solid #fff !important; } table td { border: 1px solid #c8c8c8; border-left: none; border-top: none; } table td.first { border-left: 1px solid #c8c8c8; } .lineage { background: url(../images/background/heirarchy.gif) 0px 8px no-repeat; } #navMain ul li { background: url(../images/branding/divider.gif) 9px 0px no-repeat; } #navMain ul li.first { background: none; } #navSecondary { background: #000; } #navSecondary .navSecondaryWrapper { background: url(../images/branding/left_nav_divide.png) left 17px no-repeat; } #navSecondary .navSecondaryWrapper li { background: url(../images/branding/left_nav_divide.png) left bottom no-repeat; } #navSecondary .navSecondaryWrapper a { border-left: 7px solid #000; background: url(../images/branding/arrow.gif) right center no-repeat; } #navSecondary .navSecondaryWrapper a:hover, #navSecondary .navSecondaryWrapper a.on { border-left: 7px solid #fff; } #navSupplementary ul li { background: url(../images/branding/bullet.gif) 5px 6px no-repeat; } #navSupplementary ul li.first { background: none; } body.popup { background: #fff; } body.popup .pop { margin: 10px auto; width: 600px; } .pop .mediaContainer { padding: 10px 0px; background: #ccc; text-align: center; } /* Styles that go in here include the styling of the text for the site -- font-size, font-family, font-weight, color, line-height, text-transform, text-align */ /****************************** START :: page **********************/ #branding #logo h1 a { text-decoration: none; } #navMain ul li a { font-size: .9em; text-decoration: underline; } #navMain ul li a:hover { text-decoration: none; } #navMain ul li, #navMain ul li a { color: #fff; text-transform: uppercase; } #navMain ul li.first { font-size: 1em; } .col_content .links li { font-weight: bold; } .col_content .links li a { font-weight: bold; } .col_content a { text-decoration: underline; } .col_content a:hover { text-decoration: none; } .col_content .spot p { color: #000; font-weight: bold; line-height: 1.3em; } .action { text-align: center; } .action button { color: #fff; text-transform: uppercase; font-size: 1.1em; letter-spacing: .05em; } .type_class .action { text-align: left; } .directions p { text-align: center; color: #000; font-weight: bold; } .directions .types p { text-align: left; font-weight: normal; color: #666; } .directions ul { text-align: center; } .directions ul li a { font-weight: bold; } .vcard { text-align: center; font-weight: bold; color: #000; line-height: 1.5em; } .vcard span, .vcard div, .vcard a { font-weight: bold; } .wrapper fieldset label { font-weight: bold; color: #000; text-align: right; } .required { color: #903; font-weight: bold; } .wrapper fieldset p.required { font-size: .9em; letter-spacing: 0px; } table th { text-align: center !important; } .lineage p, .lineage a { color: #000; font-weight: bold; } #navSecondary li { font-size: 1.1em; letter-spacing: .15em; } #navSecondary li a:hover { text-decoration: none; } #navSecondary li, #navSecondary li a { color: #fff; text-transform: uppercase; font-weight: bold; } #navSupplementary ul li { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: .9em; color: #000; }