/* CSS Rules */ /* Date: 11.09 */ /* Author: Joseph@vastvisual */ /* GENERAL *******************************************************************************************************************/ .autoMargin {margin:auto;} body { color: #000; font: 12px Arial, Helvetica, sans-serif; text-align: center; margin: 0px; padding: 0px; background: #000 url(../_images/body-bg.jpg) 0 0 repeat-x; } td {font:12px Arial, Helvetica, sals-serif;} p { border: 0px; } .home h2, .news h2, .basich h2, .instructor h2, .lessons h2 { font-size: 22px; padding: 0px; margin: 0px 0px 5px 0px; } hr { color: #83c2cd; background-color: #83c2cd; margin: 0px; padding: 0px; border-collapse: collapse; height: 1px; border: 0; } ul { margin: 0px; padding: 10px 0px 10px 15px; } li { padding-left: 0px; margin: 0px 5px 5px 0px; } ol li { background-image: none; padding-left: 0px; } a:link, a:visited, a:active { color: #666666; text-decoration: underline; } a:hover { color: #f89e24; text-decoration: none; } img { border-color: #83c2cd; border: none; } .bold { font-weight: bold; } .clear { clear: both; } .highlight { text-decoration: none;color:black;background:yellow; } /* LAYOUT RULES **************************************************************************************************************/ #header { width: 100%; margin: 0px; text-align: left; } #header-content { width: 1010px; height: 156px; padding: 0px; position: relative; margin: 0px auto; background: #FFF url(../_images/header-bg.gif) bottom left repeat-x; color: #000; } #header-content img { padding: 10px 0px 0px 15px!important; float: left; } #header-content .logo { padding: 0px!important; } #header-content .nav { height: 28px; margin: 0px; text-align: right; padding: 20px 10px 0px 0px; color: #CCC; } .nav a:link, .nav a:visited, .nav a:active { color: #000; text-decoration: none; } .nav a:hover { color: #cf6f14; text-decoration: none; } #dropshadow { width: 1010px; height: 16px; margin: 0px auto; background: url(../_images/dropshadow.png) top left repeat-x; clear: both; } #search { width: 100px; text-align: left; width: 100px; float: left; padding: 0px; margin: 0px;} #flash { width: 792px; height: 332px; float: left; } #banner-bg { width: 100%; min-width: 1000px; padding: 0px; background: url(../images/banner-bg.jpg) top center repeat-y; overflow: hidden; } #banner-content { width: 900px; height: 180px; position: relative; margin: 0px auto; } #banner { position: absolute; top: 0px; left: 0px; z-index: 0; } /* CONTENT ****************************************************************************************************************/ /* CONTENT-HOME */ #content { width: 1010px; margin: 0px auto; padding: 0px; text-align: left; background-color: #FFF; height: auto; } #content-left { width: 792px; background-color:#FFF; float: left; padding: 20px 16px 25px 20px; } #content-right { width: 166px; background-color:#FFF; float: left; padding-top: 20px; } #content-right img { padding-bottom: 10px; } .home #products { padding: 10px 0px 10px 0px; float: left; text-align: left; } .home #products img { border: solid 1px #ccc; float: left; margin-right: 19px; padding: 3px; background-color: #fff; } .home #products .last { border: solid 1px #ccc; float: left; margin: 0px; } .home #products .imgholderleft { border: solid 1px #ccc; float: left; margin-left: 17px; margin-right: 17px; background-color: #fff; background-repeat: no-repeat; width:175px; height:245px; } .home #products .imgholder { border: solid 1px #ccc; float: left; margin-right: 17px; background-color: #fff; background-repeat: no-repeat; width:175px; height:245px; } .home #products .imgholderright { border: solid 1px #ccc; float: left; background-color: #fff; background-repeat: no-repeat; width:175px; height:245px; } .home #products .text { } .home #tutorials { float: left; background-color: #FFF; padding: 0px 0px 0px 0px; } .home #tutorials .header-bar { width: 466px; height: 36px; background: url(../_images/home-tutorials-bar-bg.jpg ) 0 0 repeat-x; font-size: 16px; font-weight: bold; color: #FFF; padding: 0px; margin: 3px 0px; } .home #tutorials .header-bar .text { padding: 10px 0px 0px 10px; float: none; display: block; } .home #tutorials .border { border: solid 1px #c0c0c0; background-color:#FFF; float:left; width: 444px; padding : 10px; } .home #tutorials .pic { float: left; text-align: center; padding: 3px; background-color: #FFF; border: solid 1px #c0c0c0; margin-bottom: 20px; } .home #tutorials h1 { font-size: 18px; padding: 0px; margin: 0px; } .home #tutorials .date { font-size: 11px; padding: 0px; margin: 0px; color:#666666; float: none; } .home #tutorials span { padding-top: 10px 0px 0px 0px; display: inline; float: left; } .home #tutorials .content { width: 255px; border: solid 1px #FFF; float: left; padding: 0px 8px; } .home #tutorials .views-comments { font-size: 10px; padding: 0px; width: 200px; border: 0px; } .home #tutorials .comments { padding-left: 0px; padding-right:10px; border: 0px; } .home #tutorials p { padding: 0px; margin-top: 6px; } .home #recent-news { width: 310px; float: left; background-color:#FFF; padding-left: 15px; } .home #recent-news .header-bar { background: url(../_images/home-news-bar-bg-blank.jpg ) 0 0 repeat-x; height: 36px; font-size: 16px; font-weight: bold; color: #FFF; margin: 3px 0px; } .home #recent-news .header-bar .text{ padding: 10px 0px 0px 10px; float: left; display: block; } .home #recent-news .content { width: 308px; height: 75px; border: solid 1px #c0c0c0; margin-top: -1px; background: url(../_images/home-news-bg.jpg ) 0 0 repeat-x; float: left; } .home #recent-news .news-item { padding: 25px 0px 0px 15px; } .home #recent-news .date { font-size: 20px; font-weight: bolder; padding: 0px 20px 0px 0px; float:left; } .tutorial-item-desc { margin: 5px 0px 5px 0px; } .button-view-container { display:block; height:33px; overflow:hidden; float: left; border: none; } .button-view:hover { border: none; } .button-view-container:hover img { margin-top:-33px;border: none; } .button-misc-container { display:block; height:33px; overflow:hidden; float: left; margin-right: 10px; width:88px; } /*.button-misc:hover { 0px; }*/ .button-misc-container:hover img { margin-top:-33px; } .news .article { background: #f0f0f0 url(../_images/bt-bg-lighter.jpg) bottom left repeat-x; height: 55px; width: 788px; float: left; clear: both; margin-top: 10px; } .news .article p { margin: 20px 0px 0px 10px; padding: 0px; font-weight: bold; } .news .more { background: #d0d0d0 url(../_images/bt-bg.jpg) bottom left repeat-x; height: 36px; width: 788px; float: left; clear: both; margin-top: 10px; } .news .more p { margin: 10px 0px 0px 10px; padding: 0px; font-weight: bold; text-align: center; } /* CONTENT-INT- LESSONS */ #sub-menu { padding-bottom: 20px; text-align: center; } #sub-menu span { padding: 0px 0px; } .lessons #bucket { padding: 0px 0px 10px 0px; } .lessons #content-left #bucket { padding: 0px 0px 10px 0px; } .lessons #bucket .border { height: auto; border: solid 0px #c0c0c0; background-color: #FFF; float:left; width: 766px; padding : 10px; margin: 0px;} .lessons #bucket .border-sm { height: auto; border: solid 0px #c0c0c0; background-color: #FFF; float:left; width: 370px; padding : 10px; margin: 0px;} .lessons #bucket .pic { padding: 3px; margin: 0px; float:left; } .lessons #bucket h1 { font-size: 18px; padding: 0px; margin: 0px; margin-bottom:10px; } .lessons #bucket h2 { font-size: 14px; padding: 0px; margin: 0px; } .lessons #bucket .date { font-size: 11px; padding: 0px; margin: 0px; color:#666666; float: none; } .lessons #bucket span { padding-top: 10px 0px 0px 0px; display: inline; } .lessons #bucket .content { width: 100%; padding: 0px 0px; margin: 0px auto; } .lessons #bucket p { padding: 0px; } .lessons #bucket .content .comments { padding-left:20px; float:none; display:block; } .lessons .button-view-container { width:88px; } .more { background: url(../_images/bt-bg.jpg) top left repeat-x; height: 36px; width: 788px; float: left; clear: both; margin-top: 10px; } .more p { margin: 10px 0px 0px 10px; padding: 0px; font-weight: bold; text-align: center; } /* CONTENT-Lessons/Performance Page Buttons */ a.button { color:#FFF; display: inline-block; width: 197px; height: 24px; padding: 7px 0px 5px 0px; font-weight: bolder; font-size: 16px; text-decoration: none; background: url(../_images/bt-bg-orange.gif) no-repeat 0px 0px; text-align: center;} a.button:hover { color:#f48a1c; font-weight: bolder; font-size: 16px; background: url(../_images/bt-bg-orange.gif) no-repeat 0px -36px; text-align: center; } a.button-long { color:#FFF; display: inline-block; width: 205px; height: 24px; padding: 7px 0px 5px 0px; font-weight: bolder; font-size: 16px; text-decoration: none; background: url(../_images/bt-bg-orange-long.gif) no-repeat 0px 0px; text-align: center;} a.button-long:hover { color:#f48a1c; font-weight: bolder; font-size: 16px; background: url(../_images/bt-bg-orange-long.gif) no-repeat 0px -36px; text-align: center; } a.buttongrey { color:#FFF; display: inline-block; width: 197px; height: 24px; padding: 7px 0px 5px 0px; font-weight: bolder; font-size: 16px; text-decoration: none; background: url(../_images/bt-bg-grey.gif) no-repeat 0px 0px; } a.buttongrey:hover { color:#f48a1c; font-weight: bolder; font-size: 16px; background: url(../_images/bt-bg-grey.gif) no-repeat 0px -36px; } .videoplayer-button-top { height:79px;width:160px;background-color:black;color:white;font-weight:bold;border:solid black 1px; } .videoplayer-button { height:79px;width:160px;background-color:black;color:white;vertical-align:middle;font-weight:bold;border-bottom:solid black 1px;border-left:solid black 1px;border-right:solid black 1px; } /* CONTENT-INT- NEWS */ .news #bucket { float: left; padding: 0px 0px 10px 0px; } .news #bucket .border { border: solid 1px #c0c0c0; background-color:#fff; float:left; width: 766px; padding : 10px; } .news #bucket .pic { float: left; text-align: center; padding: 3px; background-color: #FFF; border: solid 1px #c0c0c0; margin-bottom: 20px; } .news #bucket h1 { font-size: 18px; padding: 0px; margin: 0px; } .news #bucket .date { font-size: 11px; padding: 0px; margin: 0px; color:#666666; float: none; } .news #bucket span { padding-top: 10px 0px 0px 0px; display: inline; float: left; } .news #bucket .content { width: 580px; /*border: solid 1px #c0c0c0;*/ float: left; padding: 0px 8px; } .news #bucket .views-comments { font-size: 10px; background-color:#00FF66; padding: 0px; width: 200px; } .news #bucket .comments { } .news #bucket p { padding: 0px; } .news .article { background: #f0f0f0 url(../_images/bt-bg-lighter.jpg) bottom left repeat-x; height: 55px; width: 788px; float: left; clear: both; margin-top: 10px; } .news .article p { margin: 20px 0px 0px 10px; padding: 0px; font-weight: bold; } .news .more { background: #d0d0d0 url(../_images/bt-bg.jpg) bottom left repeat-x; height: 36px; width: 788px; float: left; clear: both; margin-top: 10px; } .news .more p { margin: 10px 0px 0px 10px; padding: 0px; font-weight: bold; text-align: center; } /* CONTENT-INT- INSTRUCTORS */ .instructor #bucket { float: left; padding: 0px 0px 10px 0px; } .instructor #bucket .border { border: solid 1px #c0c0c0; background-color:#fff; float:left; width: 766px; padding : 10px; } .instructor #bucket .pic { float: left; text-align: center; padding: 3px; background-color: #FFF; border: solid 1px #c0c0c0; margin: 0px 15px 15px 0px; padding: 10px; } .instructor #bucket .pic img { display: block; } .instructor #bucket h1 { font-size: 18px; padding: 0px; margin: 0px; } .instructor #bucket .date { font-size: 11px; padding: 0px; margin: 0px; color:#666666; float: none; } .instructor #bucket span { padding: 10px 0px 0px 0px; display: inline; /*float: left; */ } .instructor #bucket .content { width: 740px; text-align:justify; /*border: solid 1px #c0c0c0;*/ /*float: left;*/ padding: 0px 8px; } .instructor #bucket .views-comments { font-size: 10px; background-color:#00FF66; padding: 0px; width: 200px; } .instructor #bucket .comments { } .instructor #bucket p { padding: 0px; } /* Comments Area */ .comment { background: #f0f0f0 url(../_images/bt-bg-lighter.jpg) bottom left repeat-x; height: auto; width: 770px; float: left; clear: both; margin-top: 10px; border: solid 1px #CCC; } .comment p { margin: 30px; padding: 0px; } .comment span { font-size: 18px; padding: 0px; margin: 0px; padding-right: 10px; } .comment-all { background: #d0d0d0 url(../_images/bt-bg.jpg) bottom left repeat-x; height: 36px; width: 770px; float: left; clear: both; margin-top: 10px; } .comment-all p { margin: 10px 0px 0px 10px; padding: 0px; font-weight: bold; text-align: center; } /* CONTENT-INT- Basic Page */ .basic #bucket { float: left; padding: 0px 0px 10px 0px; } .basic #bucket .border { border: solid 1px #c0c0c0; background-color:#fff; float:left; width: 766px; padding : 10px; } .basic #bucket h1 { font-size: 18px; padding: 0px; margin: 0px; } .basic #bucket .content { width: 100%; padding: 0px 0px; margin: 0px auto; } .basic #bucket p { padding: 0px; } /* NAVIGATION ****************************************************************************************************************/ #nav { width: 1010px; height: 70px; margin: 0px auto; background: url(../_images/nav-bg.jpg ) top left repeat-x; } #nav-buttons { width: 700px; height: 70px; padding: 0px; text-align: left; background: url(../_images/nav-bg.jpg ) top left repeat-x; float: left; display:inline; } .hover-nav-container { display:block; height:70px; overflow:hidden; } /*.hover-nav:hover { 0px; }*/ .hover-nav-container:hover img { margin-top:-70px; } /* FOOTER ********************************************************************************************************************/ #footer { width: 1010px; height: 65px; margin: 0px auto ; text-align: left; font-size: 11px; color: #e8faff; background-color: #3366CC; background: url(../_images/footer-bg.jpg ) top left repeat-x; } #footer-content { padding: 20px 0px 0px 0px; margin: 0px; text-align: center; font: 22px Arial, Helvetica, sans-serif ; } #footer a:link, #footer a:visited, #footer a:active { color: #FFF; text-decoration: none; } #footer a:hover { color: #000; text-decoration: none; background: none!important; } #footer ul { margin: 0px; list-style: none; padding: 0px 0px 0px 0px; display: inline; } #footer li { background: url(../images/bullet.gif) 0 .5em no-repeat; margin: 0px 5px 5px 0px; display: inline; } /* FORMS ********************************************************************************************************************/ fieldset { padding-top: 13px; border: none; /* Opera doesn't get border:none or border:0 on fieldsets */ width:300px; } .br { display:none; } .textfield { font: 16px Arial, Helvetica, sans-serif; color:#333 ; margin: 0px; border:solid 0 #fff; padding: 14px 0px 15px 6px; background: transparent url("../_images/search-field-bg.png") no-repeat fixed; width:150px; } fieldset>input.textfield { background: transparent url("../_images/search-field-bg.png") no-repeat; } .submit { background: transparent url("../_images/search-button.png") no-repeat; height:45px; border:solid 0 #fff; width:101px; font: 14px Arial, Helvetica, sans-serif; font-weight: bold; color:#fff; text-transform:uppercase; cursor: pointer; } /* ADMIN ********************************************************************************************************************/ .admin-button { background-color:black; color: white; border: solid 1px white; } .admin-txt { background-color:black; color: white; border: solid 1px white; } #admin-body { color: white; } #admin-header { padding:20px 0px 10px 0px; } .contactLeftCol { width: 120px; display: inline-block; padding-top: 2px; vertical-align: top; text-align:left; } .contactRightCol { width:420px; display: inline-block; text-align:left; } .contactRow { width:540px; } /* Expand/Collapse for FAQ */ .HEC h4 { margin: 0px; margin-right: 34px; padding: 0px; padding-left: 25px; padding-bottom: 4px; padding-top: 3px; font: 22px Arial, Helvetica, sans-serif; color: White; background-image: url(../_images/ExpandCollapseH4.jpg); background-repeat: no-repeat; cursor: pointer; } .HEC h4.h2Show { background-position: bottom; color:#2a2a2a; } .hecContent { padding-left:25px; } .HEC H5 { margin: 0px; margin-top: 5px; margin-right: 32px; padding: 0px; padding-left: 25px; padding-bottom: 4px; padding-top: 3px; font: 22px Arial, Helvetica, sans-serif; color: White; background-image: url(../_images/ExpandCollapseH5.jpg); background-repeat: no-repeat; cursor: pointer; } .HEC h5.h2Show { background-position: bottom; color:#2a2a2a; } .subaccordian { margin-left:1px; } .hecSubcontent { margin-left:25px; margin-top:5px; margin-right:34px; } .showHide { margin: 0px; margin-top: 5px; margin-right: 0px; padding: 0px; padding-left: 5px; padding-bottom: 4px; padding-top: 3px; font: 22px Arial, Helvetica, sans-serif; color: White; background-image: url(../_images/bt-ExpandCollapse.jpg); background-repeat: no-repeat; cursor: pointer; width:150px; display:inline-block; } .footerLinks a { font-size: 10px; color: #FFFFFF; } .lessonForum { background: #f0f0f0 url(../_images/bt-bg-lighter.jpg) bottom left repeat-x; height: auto; width: 728px; float: left; clear: both; margin-top: 10px; border: solid 1px #CCC;padding:20px; }