/* ========================================================================================== */ /* = MOVE DANCE COMPETITION - CSS - Coded by Matthew Beverly/www.mattystudios.com ...........*/ /* ========================================================================================== */ /* RESET */ @import url("reset.css"); /* =================================== */ /* = SITE STRUCTURE ................ = */ /* =================================== */ body {background-color: #000; font-size: 70%; font-family:tahoma,verdana,sans-serif; color: #999;background-image: url(../img/backgrounds/bgtile.jpg);background-repeat: repeat-x; background-position: top;} #wrap {width:960px; margin: 0 auto; padding: 0px 0px 0px 0px; position:relative; overflow: hidden;} #mainbodywrap {width:960px;margin: 0 auto;padding: 0px 0px 0px 0px;position:relative;overflow: hidden; background-color: #222;background-image: url(../img/backgrounds/mainbodywrap-bg.jpg); background-position: top;background-repeat: no-repeat;} #header {width:960px;margin: 0 auto; padding: 0px 0px 0px 0px;height:50px;font-size:12px;position:relative;z-index:98;background-image: url(../img/backgrounds/header-bg.gif); background-repeat: no-repeat; background-position: top;} #footer {width:960px; margin: 0 auto; padding: 0px 0px 0px 0px; position: relative; clear:both;overflow: hidden; background-image: url(../img/backgrounds/footer-bg.jpg); background-repeat: no-repeat; background-position: top;min-height:100px;height:auto !important;height:100px; } #footer-con {width:900px; margin: 0 auto; padding: 0px 30px 0px 30px; line-height:50px;overflow: hidden;} /* FLASH */ #flashcontent {width:960px; margin: 0 auto; padding: 0px 0px 0px 0px; z-index:1;border-bottom:1px solid #111;} #flashgallery{width:960px; margin: 0 auto; padding: 0px 0px 0px 0px;} #flashnews{width:639px; margin: 0 auto; padding: 0px 0px 0px 0px;} #pagefeatureimg {width:960px; margin: 0 auto; padding: 0px 0px 0px 0px; overflow: hidden; min-height:250px;height:auto !important;height:250px; } /* =================================== */ /* = MAIN LAYOTUS DIVS ............. = */ /* =================================== */ /*- 66% split -*/ #col-2thirds-l-wrap {width:639px; margin: 0 auto; padding: 0px 0px 0px 0px; float: left; background-image: url(../img/backgrounds/2third-con-bg.jpg);background-repeat: no-repeat;border-right:1px solid #111;} #col-2thirds-l {width:569px; margin: 0 auto; padding: 30px 30px 30px 30px; line-height: 16px; font-size: 110%; } /*- 33% split - Each is a third total of the main body wrap-*/ #col-third-l-wrap {width:319px; margin: 0 auto; padding: 0px 0px 0px 0px; float: left; background-image: url(../img/backgrounds/third-con-bg.jpg);background-repeat: no-repeat; border-right:1px solid #111;} #col-third-l{width:259px; margin: 0 auto; padding: 30px 30px 30px 30px; line-height: 16px;} #col-third-m-wrap {width:319px; margin: 0 auto; padding: 0px 0px 0px 0px; float: left; background-image: url(../img/backgrounds/third-con-bg.jpg);background-repeat: no-repeat; border-right:1px solid #111;} #col-third-m {width:259px; margin: 0 auto; padding: 30px 30px 30px 30px; line-height: 16px;} #col-third-r-wrap {width:320px; margin: 0 auto; padding: 0px 0px 0px 0px; float: right; background-image: url(../img/backgrounds/third-con-bg.jpg);background-repeat: no-repeat;} #col-third-r {width:260px; margin: 0 auto; padding: 30px 30px 30px 30px; line-height: 16px; font-size: 110%;} /*- Full Width -*/ #col-full-wrap {width:960px; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;float: left; border-top:1px solid #111;} #col-full {width:900px; margin: 0px 0px 0px 0px; padding: 30px 30px 30px 30px; line-height: 16px;} /* =================================== */ /* = NAVIGATION ELEMENTS............ = */ /* =================================== */ /* = Main menu / Header = */ /* = -------------------------------------------- = */ /* Containers and general Setup */ #header h1 {position:absolute;left:-9999px;} #header ul {list-style:none;margin: 0px 0px 0px 30px;padding:0;} /* Nav buttons setup */ #header ul li {float:left;line-height:48px;position:relative;z-index:99;outline: none;} /* Nav States */ #header ul li a {color:#999;text-decoration:none;height:48px;float:left;display:inline; /*ie*/padding:0 10px;outline: none; } #header ul li a:hover {display:block;background-image:none !important; color:#fff;} #header ul li a.active {color:#0099ff;background-image: url(../img/nav/nav-active-bg.gif); background-repeat: repeat-x;} /* = Footer Menu = */ /* = -------------------------------------------- = */ /* Containers and general Setup */ .downloadBar {width:960px; margin: 0 auto; padding:0px; position: relative; clear:both; overflow: hidden; min-height:100px;height:auto !important;height:100px;} #footernav h1 {position:absolute;left:-9999px;} #footer ul {list-style:none;margin:0;padding:0;} /* Nav buttons setup */ #footernav ul li {float:left;line-height:50px;position:relative;outline: none;} /* Nav States */ #footernav ul li a {color:#999;text-decoration:none;height:50px;float:left;display:inline; /*ie*/padding:0 8px;outline: none;} #footernav ul li a:hover {display:block;background-image:none !important;color:#fff;} #footernav ul li a.active {color:#0099ff;} ul.social { float:right;} ul.social li { margin:0!important; padding:0!important; } ul.social li img { margin:0px -4px; padding-top:3px; } /*- Nav Elements -*/ #namenum {width:300px; margin: 0px 0px 0px 0px;float:right;display:inline;} #logo {width:250px; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; float:left;position:absolute;z-index:100;overflow: hidden;} /* ======================================== */ /* Display 2 - Larg IMG - detail page con */ /* ======================================== */ /* Display 1 - Large IMG .......... */ #display-lg-con {width:639px; margin: 0 auto; padding: 0px 0px 0px 0px; float: left; overflow: hidden;} #display-lg-con img { margin-bottom:20px;} #display-lg-text {width:579px; margin: 0 auto; padding: 30px 30px 50px 30px; float: left; overflow: hidden;line-height: 18px; font-size: 110%;} /* LARGE Thumb Con */ #lg-thumb-con {width:580px; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; float: left; overflow: hidden; display:block;} #lg-thumb-con a { display: block; border:1px solid #000; overflow: hidden;} #lg-thumb-con a:hover {display: block; border:1px solid #0099ff; overflow: hidden;} /* ======================================== */ /* Display 2 - Small IMG - Grid of news teasers */ /* ======================================== */ /* Display 2 - Thumb Small IMG .......... */ #display-sm-con {width:258px; margin: 0 auto; padding: 10px 30px 14px 30px; float: left; overflow: hidden; } #display-sm-text {width:258px; margin: 0 auto; padding: 10px 0px 0px 0px; float: left; color: #777; line-height: 14px; overflow: hidden; min-height:60px;height:auto !important;height:60px; } /* SMALL Thumb Con */ #sm-thumb-con {width:258px; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; float: left; overflow: hidden; display:block;} #sm-thumb-con a { display: block; border:1px solid #000; overflow: hidden;} #sm-thumb-con a:hover {display: block; border:1px solid #0099ff; overflow: hidden;} /* =================================== */ /* Details */ /* =================================== */ /* Side bar container for simple lists and checklists */ #sb-subcon {width:258px; margin: 0 auto; padding: 20px 30px 20px 30px; float: left; overflow: hidden;} #sb-subcon-title {color: #aaaaaa; font-size: 120%; font-weight:bold; margin: 0px 0px 0px 0px; padding: 0px 0px 10px 0px;} /* Pull Quotes */ #pullquote-con {width: 513px; margin: 20px 0px 20px 0px; padding: 20px 30px 20px 30px; float: left; overflow: hidden; border-right:3px solid #333; border-left:3px solid #333; color: #0099ff; font-size: 140%; font-weight:normal; font-style: italic; font-family:Georgia, "Times New Roman", Times, serif; text-align:center;line-height: 20px; display:block} #pullquote-sb {width: 258px; margin: 0 auto; padding: 10px 30px 20px 30px; float: left; overflow: hidden; border-bottom:1px dotted #333;color: #aaaaaa; font-size: 100%; font-weight:normal; font-style: italic; font-family:Georgia, "Times New Roman", Times, serif;line-height: 18px; display:block;} /* Sponsors */ #sponsor-con {margin: 0 auto; padding: 0px 0px 30px 0px; float: left; overflow: hidden;} .sp-logo {width:100px; border:1px solid #000000; margin: 0px 30px 0px 0px; padding: 0px 0px 0px 0px; float: left; overflow: hidden; display:block } .testimonial_comment { width:258px; margin: 0 auto; padding: 10px 0px 10px 0px; float: left; overflow: hidden; font-size: 84%; line-height: 14px; border: 1px dotted #333; border-style: none none dotted;} .testimonial_comment h3 {color: #fafafa; font-size: 100%; font-weight:bold; margin: 10px 0px 0px 0px; padding: 0px 0px 0px 0px;} .testimonial_comment h2 {color: #0099ff; font-size: 120%; font-weight:bold; margin: 20px 0px 0px 0px; padding: 0px 0px 0px 0px; line-height: 20px;} .lrgtest {font-size: 130%!important;} .lrgtest .testimonial_comment {width:520px;!important; line-height: 16px!important; padding: 20px 0px 20px 0px!important;} .lrgtest #goaway {position:absolute;left:-9999px!important; } /* Styled Lists */ .winners { width:579px; margin: 0 auto; padding: 0px 0px 30px 0px; float: left; font-size: 90%; font-weight:normal; color:#666!important; line-height: 24px; display:block; overflow: hidden; } .winners ul { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; list-style: none;} .winners li { margin: 0px 0px 0px 0px; padding: 0px 0px 2px 0px; border: 1px dotted #333; border-style: none none dotted;} .winners .place { color: #0099ff; font-size: 120%; font-weight:bold;} .winners h2 {color: #0099ff; font-size: 180%; font-weight:bold; margin: 0px 0px 10px 0px; padding: 0px 0px 0px 0px; line-height: 20px;} .winners strong {color: #fff;} /* =================================== */ /* GLOBAL STYLES */ /* =================================== */ /* IMAGE Classes */ .img {border:none; margin: 0 auto; padding: 0px 0px 0px 0px; float: left; overflow: hidden; } .sb-img {border:none; margin: 0 auto; padding: 0px 0px 20px 0px; float: left; overflow: hidden; display:block } .right {border:none; margin: 0 auto; padding: 0px 0px 0px 0px; float: right; overflow: hidden;} .left {border:none; margin: 0 auto; padding: 0px 0px 0px 0px; float: left; overflow: hidden;} #footercontact {width:200px; margin: 0 auto; padding: 0px 0px 0px 0px; float: left; overflow: hidden; font-size: 100%; font-weight:bold; color:#666;} #sitecredit {width:200px; margin: 0 auto; padding: 0px 0px 0px 0px; float: left; overflow: hidden; font-size: 90%; font-weight:bold; color:#444;} #copyright {width:300px; margin: 0 auto; padding: 0px 0px 0px 0px; float: right; overflow: hidden; font-size: 90%; font-weight:normal; color:#444; text-align:right} /* Styled Lists */ #arrowlist-con {margin: 0px 0px 0px 0px; padding: 0px 0px 30px 0px; float: left; overflow: hidden; font-size: 90%; font-weight:normal; color:#aaaaaa; line-height: 18px;} #arrowlist ul {margin-left: 0;padding-left: 0;list-style: none;} #arrowlist li {padding-left: 20px; background-image: url(../img/arrow.gif); background-repeat: no-repeat; background-position: 0 .5em;} /*UL in UL*/ .Listing h3 {color: #0099ff; font-size: 120%; font-weight:bold; margin: 0px 0px 10px 0px; padding: 10px; line-height: 20px; background-color:#111} ul.Listing { display:block;} ul.Listing li { margin: 10px 0px; padding: 10px 0px; border: 1px dotted #333; border-style: none none dotted; } /* Listing - sub ul */ ul.Listing li ul { margin-left: 20px; } ul.Listing li ul li { border:none; padding:0; margin:0; line-height:18px; list-style:disc; } /* =================================== */ /* TYPOGRAPHY */ /* =================================== */ /* TYPOGRAPHY - general */ p {color:#a0a0a0; margin: 10px 0px 10px 0px;} ul {color:#a0a0a0; margin: 0px 0px 20px 0px;} ol {color:#ccc;} /* TYPOGRAPHY - headlines */ /* h1,h2 Main header page titles and detail item titles/headlines */ h1 {color: #fff; font-size: 160%; font-weight:bold; margin: 20px 0px 20px 0px; padding: 0px 0px 0px 0px; line-height: 30px; min-height:30px;height:auto !important;height:30px;} /* h2, Used as secondary story titles/tagline */ h2 {color: #0099ff; font-size: 120%; font-weight:bold; margin: 0px 0px 10px 0px; padding: 0px 0px 0px 0px; line-height: 20px;} /* h3, used as paragraph title or bold statment */ h3 {color: #fafafa; font-size: 100%; font-weight:bold; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;} /* h4, News/event - thumb con title*/ h4 {color: #ccc; font-size: 110%; font-weight:bold; margin: 0px 0px 6px 0px; padding: 0px 0px 0px 0px; line-height: 14px;} /* h5, title with line break */ h5 {color: #ccc; font-size: 90%; font-weight:bold; margin: 0px 0px 6px 0px; padding: 0px 0px 0px 0px; border: 1px dotted #333; border-style: none none dotted;padding-Bottom: 2px} /* h6, Sidebar highligh/title */ h6 {color: #aaaaaa; font-size: 90%; font-weight:bold; margin: 0px 0px 6px 0px; padding: 0px 0px 0px 0px; } /* =================================== */ /* TEXT STYLING */ /* =================================== */ .lrg {color: #0099ff; font-size: 160%; font-weight:bold;letter-spacing:0px;} .lrg-color {color:#0099ff; font-size: 120%; font-weight:bold;letter-spacing:0px; } .smallheader {font-size: 120%; font-weight:bold;} .smalltx {font-size: 90%; font-weight:normal;} .italic {font-style: italic} .italic-lg {color:#ccc; font-weight:bold; font-size: 110%; letter-spacing:0px;font-style: italic} .subdued {color:#666} .subduedsm {color:#666;font-size: 80%; } .subdued-normal {color:#777;font-weight:normal!important;} .bold {font-weight:bold; font-size: 110%; letter-spacing:0px;} .highlight {color:#ccc;} .highlightbold {color:#ccc;font-weight:bold;font-size: 100%;} .highlightbold2 {color:#aaaaaa;font-weight:bold;font-size: 100%;} .highlightsm {color:#cfcfcf;font-weight:bold;font-size: 90%} .alert {color:#ff0000;font-weight:bold;font-size: 100%} .subtlehighlightbold {color:#666;font-weight:bold;} .xl { color:#0099ff; font-size: 220%; font-weight:bold;} /* =================================== */ /* LINKS STYLING */ /* =================================== */ /* LINKS - general*/ a,a:link,a:link,a:link,a:hover {background:transparent;text-decoration:none;cursor:pointer} a:link {color:#aaaaaa;font-weight:bold;} a:visited {color:#999;font-weight:bold;} a:hover,a:active {color:#0099ff;font-weight:bold} /* =================================== */ /* TABLE STYLING */ /* =================================== */ .table-gen{font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 0.9em;font-size: 90%} .table-rw-gen{padding: 0px;} /* ========================= */ /* CLEAR FIXES */ /* ========================= */ .clear {clear:both;position:relative;font-size:0px;height:0px;line-height:0px} .fix{clear: both;height: 1px;margin: 0 0 -1px;overflow: hidden;} .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 */ /* ========================= */ /* UNUSED */ /* ========================= */ /* Drop setup */ #header ul li.hover ul, #header ul li:hover ul {display:block; outline: none;} /* Drop styling */ #header ul ul {position:absolute;top:49px;left:-1px;background:#000;border:1px dotted #222;border-width:1px 1px 0 1px; width:126px; display:none; font-size:10px; z-index:99;} #header ul ul li {float:none;border:1px solid #222;border-width:0 0 1px 0;height:29px;line-height:29px; z-index:99;} /* Drop states */ #header ul ul li a {float:none;height:29px;line-height:29px;display:block;background-image:none !important;color:#999;outline: none;padding:0 15px;} #header ul ul li a:active {float:none;height:29px;line-height:29px;display:block;background-image:none !important;background-color:#222;color:#fff;padding:0 15px;} #header ul ul li a:hover {float:none;height:29px;line-height:29px;display:block;background-image:none !important;background-color:#222;color:#fff;padding:0 15px;} /* = Side Menu = */ /* = -------------------------------------------- = */ #sidenav ul {margin:0;padding:0;list-style:none;} #sidenav ul li {display: block;} #sidenav ul li a { display: block; list-style-type:none;margin:0; padding:0; width:100%; font-weight:normal; line-height:18px;color:#999;outline: none;} #sidenav ul li a:hover{color:#fff;} #sidenav ul li a.active{color:#0099ff; margin-left:10px; font-weight:bold}