/* ---------------------------------------------------------------------------- TITLE: Main Stylesheet AUTHOR: HCC Development URL: http://hccdevelopment.com/ DESCRIPTION: Sets the custom styles for objects on the site. TABLE OF CONTENTS Basic HTML Grouping Content Text-Level Semantics Tabular Data Modules/Widgets Page Elements Header Content Forms Sidebars Navigation Footer Utility Classes Borders Messages Buttons Text Margins and Padding Effects Cursors COLORS Dark Gray: #4d4d4d Green: #7dc442 Orange: #eb5b24 Blue: #00aeef Yellow: #ffc424 PROPERTY ORDER: visibility display overflow position top / right / bottom / left z-index clear float table caption-side margin padding border outline width height color font direction letter-spacing word-spacing line-height text list-style vertical-align background cursor page-break box-shadow border-radius text-shadow transition CREATED: 2007.02.12 MODIFIED: 2011.12.1 ------------------------------------------------------------------------------- =BASIC HTML ---------------------------------------------------------------------------- */ /* =FONTS ---------------------------------------------------------------------------- */ body { color: #4d4d4d; font-family: Helvetica, "Trebuchet MS", Tahoma, Verdana, sans-serif; background: #fff url('../img/site/global/background-pattern-white.png') repeat left top;} body.bg-green { background-color: #7dc442; background: #7dc442 url('../img/site/global/background-pattern-green.png') repeat left top; } body.bg-orange { background-color: #eb5b24; background: #eb5b24 url('../img/site/global/background-pattern-orange.png') repeat left top; } body.bg-blue { background-color: #00aeef; background: #00aeef url('../img/site/global/background-pattern-blue.png') repeat left top; } /* Add a shadow to the page element */ #Page { background: #fff url('../img/site/global/background-header-tile.png') repeat-x left top; -webkit-box-shadow: 0 4px 10px #4D4E53; -moz-box-shadow: 0 4px 10px #4D4E53; box-shadow: 0 4px 10px #4D4E53; } h1, h2, h3, h4, h5, h6 { margin: 0; text-transform: uppercase; } .HandySans { font-family: HandySans; font-weight: normal; font-style: normal; } .YAA-Bold { font-family: YAA-Bold; font-weight: normal; font-style: normal; } .DIN { font-family: DIN; font-weight: normal; font-style: normal; } .DIN-Medium { font-family: DIN-Medium; font-weight: normal; font-style: normal; } .DIN-Bold { font-family: DIN-Bold; font-weight: normal; font-style: normal; } .left {float: left;} .right {float: right;} /* =GROUPING CONTENT ---------------------------------------------------------------------------- */ hr { color: #d9d9d9; background: #d9d9d9; } hr.space { visibility: hidden; color: #fff; background: #fff; } blockquote { margin: 18px 40px; padding: 9px 10px; border-left: 3px solid #d9d9d9; font-style: italic; background-color: #f2f2f2; } blockquote p { font-size: 15px; } blockquote :last-child { margin: 0; } figure, .figure { border: 1px solid #d9d9d9; } figcaption, .figcaption { font-size: 11px; font-style: italic; line-height: 18px; } /* =TEXT-LEVEL SEMANTICS ---------------------------------------------------------------------------- */ /* Links */ a { color: #00aeef/* #3b5998 */; text-decoration: none; } a img { border: none; } a:visited { color: #00aeef/* 717174 */; } a:hover { color: #F26631; } a:active { color: #4D4E53; } a:focus { outline: 0; } ::-moz-focus-inner { border: 0; } ::-moz-selection { color: inherit; background-color: #ff9; } ::selection { color: inherit; background-color: #ff9; } /* =TABULAR DATA ---------------------------------------------------------------------------- */ table { border: 1px solid #d9d9d9; border-width: 1px 1px 1px 1px; } colgroup { } col { } tbody { } thead { } th { font-weight: bold; } thead th { background: #f2f2f2; } tfoot { font-style: italic; } th, td, caption { padding: 9px 10px 8px 5px; border: 1px solid #d9d9d9; border-width: 0 0 1px 1px; font-size: 12px; line-height: 18px; vertical-align: top; } caption { background: #f2f2f2; } tr.even td { background: #f2f2f2; } /* ---------------------------------------------------------------------------- =Modules/Widgets ---------------------------------------------------------------------------- */ /* =SLIDESHOW >> Homepage cycle/slideshow ---------------------------------------------------------------------------- */ .slideshow { float: left; margin: 0; width: 659px; height: 478px; } /* =ACCORDION >> Homepage Aaccordion ---------------------------------------------------------------------------- */ #home-nav {height: 93px; width: 261px;} #HN-why-link a {background-image: url('../img/site/homepage/home-1-sprite-whygalileo.gif') ; display: block; height: 93px; width: 261px;} #HN-why-link a:hover {background-position: -261px 0px;} #HN-cg-link a {background-image: url('../img/site/homepage/home-2-sprite-campgalileo.gif'); display: block; height: 131px; width: 261px;} #HN-cg-link a:hover {background-position: -261px 0px;} #HN-sq-link a {background-image: url('../img/site/homepage/home-3-sprite-galileosummerquest.gif'); display: block; height: 132px; width: 261px;} #HN-sq-link a:hover {background-position: -261px 0px;} #HN-oc-link a {background-image: url('../img/site/homepage/home-4-sprite-othercamps.gif'); display: block; height: 122px; width: 261px;} #HN-oc-link a:hover {background-position: -261px 0px;} #accordionResizer { float: right; margin: 0; width: 261px; height: 478px; } .accordion { } .accordion h2 { margin: 0; height: 76px; font-size: 14px; font-weight: normal; text-indent: -9999em; background: url('../img/site/homepage/right-campgalileo-off.png') no-repeat center top; outline: none; cursor: pointer; } /*Home Page text */ #home-text {padding: 15px 20px 0px 20px; margin-top: 0px;font-family:DIN;} #home-text h2 {color: #eb5b24; font-size: 13px; font-weight: bold; margin: 0; padding: 0; line-height: normal;} #home-text p {font-size: 16px; font-weight: normal; line-height: 19px;} .home-text-span {color: #eb5b24; font-size: 15px;font-family:DIN-Medium; margin: 0; padding: 0; text-transform: uppercase;} #home-text-blue {padding: 0px 20px 0px 20px; margin-top: 0px;font-family:DIN;} #home-text-blue h2 {color: #00aeff; font-size: 13px; font-weight: bold; margin: 0; padding: 0; line-height: normal;} #home-text-blue p {font-size: 16px; font-weight: normal; line-height: 19px;margin-bottom:0px;} .home-text-blue-span {color: #00aeff; font-size: 15px; font-family:DIN-Medium; margin: 0; padding: 0; text-transform: uppercase;} /* Headers */ #HD-Camp-Galileo { background-image: url('../img/site/homepage/hd-campgalileo-on.png'); } #HD-Galileo-Summer-Quest { height: 81px; background-image: url('../img/site/homepage/hd-galileosummerquest-on.png'); } #HD-Tech-Summer-Camps { background-image: url('../img/site/homepage/hd-techsummercamps-on.png'); } #HD-Why-Galileo { background-image: url('../img/site/homepage/hd-whygalileo-on.png'); } .accordion .ui-state-active { cursor: default; } /* Panes */ #PN-Camp-Galileo, #HD-Camp-Galileo { background-color: #7cc242; } #PN-Galileo-Summer-Quest, #HD-Galileo-Summer-Quest { background-color: #f05a21; } #PN-Tech-Summer-Camps, #HD-Tech-Summer-Camps { background-color: #00adee; } #PN-Why-Galileo, #HD-Why-Galileo { background-color: #ffc424; } .accordion .ui-accordion-content-active { } /* accordion pane */ .accordion .pane { padding: 5px 5px 10px 18px; color: #fff; font-size: 13px; line-height: 17px; } #PN-Why-Galileo { color: #4d4d4d } /* Link colors */ .accordion .pane a { color: #ffc424; } .accordion .pane a:hover { color: #ffc424; } .accordion .pane a:active { color: #4d4d4d; } .accordion .more { text-transform: uppercase; } #PN-Why-Galileo a { color: #fff } /* ---------------------------------------------------------------------------- =Page Elements ---------------------------------------------------------------------------- */ /* =HEADER ---------------------------------------------------------------------------- */ #Masthead { position: relative; z-index: 999; height: 155px; -webkit-box-shadow: 0 4px 5px rgba(2,3,3,0.15); -moz-box-shadow: 0 4px 5px rgba(2,3,3,0.15); box-shadow: 0 4px 5px rgba(2,3,3,0.15); } #Logo { position: absolute; top: 5px; left: 20px; } #Logo a { display: block; border: none; width: 125px; height: 112px; text-indent: -9999em; background: transparent url('../img/site/header/logo.png') no-repeat left top; } #Tag-Line { position: absolute; top: 48px; left: 152px; width: 228px; height: 38px; text-indent: -9999em; background: url('../img/site/header/tagline-subpages.png') no-repeat left top; } #Home #Tag-Line { top: 44px; left: 159px; width: 318px; height: 54px; background-image: url('../img/site/header/tagline-home.png'); } #Navigation-Primary { position: absolute; left: 28px; bottom: 10px; } #Navigation-Utility { position: absolute; top: 16px; right: 3px; } /* =NAVIGATION ---------------------------------------------------------------------------- */ /* Utility navigation in header ------------------------------------------- */ #Navigation-Utility { padding: 8px 0 0 13px; width: 247px; -webkit-box-shadow: -4px 4px 5px rgba(2,3,3,0.15); -moz-box-shadow: -4px 4px 5px rgba(2,3,3,0.15); box-shadow: -4px 4px 5px rgba(2,3,3,0.15); } #Navigation-Utility ul, #Navigation-Utility li { margin: 0; padding: 0; list-style-type: none; } #Navigation-Utility ul { overflow: hidden; margin-bottom: 8px; } #Navigation-Utility li { float: left; } .sprite { width: 50%; } .sprite a { overflow: hidden; display: block; text-indent: -9999em; } .enroll a { margin-right: 10px !important; width: 112px; height: 31px; background: url('../img/site/header/button-enroll.gif') no-repeat 0 -31px; } .enroll a:hover { background-position: 0 0; } .account a { width: 112px; height: 31px; background: url('../img/site/header/button-myaccount.gif') no-repeat 0 -31px; } .account a:hover { background-position: 0 0; } .call { width: 120px; } .mailing-list { width: 112px; height: 12px; background: url( 'http://www.galileo-learning.com/images/uploads/promotions/button-joinmailinglist.gif' ) no-repeat 0 -15px; } .mailing-list:hover { background-position: 0 0; } #Navigation-Utility .communicate { margin: 0; } #Navigation-Utility .social li { margin-right: 5px; } #Navigation-Utility .social .last { margin-right: 0; } #Navigation-Utility .social .middle { margin-right: 5px; } .ico { overflow: hidden; display: block; width: 17px; height: 27px; text-indent: -9999em; cursor: pointer; } .facebook { background: url('../img/site/header/logo-facebook.gif') no-repeat center center; } .twitter { background: url('../img/site/header/logo-twitter.gif') no-repeat center center; } #Navigation-Utility a { border: none; background-color: transparent; cursor: pointer; } /* Primary navigation ----------------------------------------------------- */ #Navigation-Primary ul { margin: 0; padding: 0; list-style-type: none; background-color: #fff; } #Navigation-Primary ul .parent-current a {color: #00aeef;} #Navigation-Primary ul .parent-current ul a {color: #454545;} #Navigation-Primary ul .current a {color: #00aeef;} #Navigation-Primary ul .current ul a {color: #454545;} #Navigation-Primary li { position: relative; float: left; margin: 0 8px 0 0; padding: 0; font-size: 12px; font-family: DIN-Medium ;font-weight: normal; font-style: normal; line-height: 1.0; text-transform: uppercase; } #Navigation-Primary a { display: block; padding: 0 8px 0 0; border: 1px solid #454545; border-width: 0 1px 0 0; color: #454545; font-size: 13px; line-height: 1.0; cursor: pointer; } #Navigation-Primary .last { margin-right: 0; } #Navigation-Primary .last a { padding-right: 0; border-right: none; } /* Second-level */ #Navigation-Primary ul ul { display: none; position: absolute; z-index: 900; top: 22px; left: 0; padding: 0; width: 215px; } #Navigation-Primary ul li.hovering ul { display: block; } #Navigation-Primary ul ul li { width: 100%; margin: 0 0 7px; font-size: 14px; line-height: 1.0; text-transform: capitalize; } #Navigation-Primary ul ul li:last-child { } #Navigation-Primary ul ul li a { margin: 0; padding: 2px 10px; font-size: 14px; border: none; } /* Third-level */ #Navigation-Primary ul ul ul { overflow: hidden; position: relative; top: auto; margin: 7px 0 0; padding: 0; } #Navigation-Primary ul ul ul li { font-size: 12px; line-height: 1.0; text-transform: uppercase;} #Navigation-Primary ul ul ul li:last-child { margin-bottom: 0; } #Navigation-Primary ul ul ul li a { padding-left: 20px; font-size: 12px; line-height: 1.0; } #Navigation-Primary ul ul a:hover, #Navigation-Primary ul ul .current a {color: #454545; background-color: #ffc424; } /* Secondary navigation --------------------------------------------------- */ #Navigation-Secondary ul { margin: 0; padding: 0; list-style-type: none; } #Navigation-Secondary li { margin: 0; padding: 0; font-size: 13px; line-height: 18px; } #Navigation-Secondary li a { display: block; padding: 3px 10px 3px 20px; border: none; color: #fff; font-size: 14px; line-height: 18px;font-family:DIN; } #Navigation-Secondary li a:hover { color: #454545; background-color: #ffd86a; } #Navigation-Secondary .current a, #Navigation-Secondary .current a:hover { color: #454545; background-color: #ffc424; } #Navigation-Secondary ul ul { margin: 5px 0; } #Navigation-Secondary ul ul li { font-size: 12px; line-height: 16px; } #Navigation-Secondary ul ul span { display: block; font-size: 12px; font-weight: normal; font-style: normal; line-height: 16px; } #Navigation-Secondary ul ul a { padding: 5px 10px 5px 40px; font-size: 13px; font-weight: normal; font-style: normal; line-height: 16px; } .Navigation-Secondary-CG-font ul ul li a {font-family: YAA-Bold !important; font-size: 18px; margin-left: 0px;} .Navigation-Secondary-CG-font ul ul ul a {font-family: DIN; font-size: 12px; margin: 0px; padding: 0px; line-height: 0px;} .Navigation-Secondary-GSQ-font ul ul a {font-family: HandySans !important; text-transform: uppercase;} #Navigation-Secondary ul ul ul a { padding-left: 60px; } /* Themes */ .bg-orange #Navigation-Secondary li a { color: #4d4d4d; } .bg-orange #Navigation-Secondary li a:hover { bacbackground-color: #ffd86a; } .bg-orange #Navigation-Secondary .current a, .bg-orange #Navigation-Secondary .current a:hover { background-color: #fff; } /* =CONTENT ---------------------------------------------------------------------------- */ /* Content-Primary -------------------------------------------------------- */ #Content-Primary { padding: 15px; -webkit-box-shadow: 0 7px 10px rgba(2,3,3,0.35); -moz-box-shadow: 0px 7px 10px rgba(2,3,3,0.35); box-shadow: 0 7px 10px rgba(2,3,3,0.35); } /* Header images */ .primary-heading img { margin-right: auto; margin-left: auto; } /* Content area headings */ #Content-Primary h1 { margin: 0 0 10px; font-size: 18px; line-height: 21px; text-transform: uppercase;15px; font-family:DIN-Medium;} #Content-Primary h2 { margin: 0 0 3px; font-size: 15px; line-height: 16px; text-transform: uppercase; font-family:DIN-Medium;} #Content-Primary h3 { font-size: 13px; line-height: 16px; font-weight: bold; text-transform: none; } #Content-Primary h4 { font-size: 26px; text-transform: none; line-height: 25px; font-weight: normal; color: #4d4d4d; } #Content-Primary h5 { font-size: 15px; text-transform: uppercase; font-weight: normal; margin: 0 0 15px;} #Content-Primary h6 { text-transform: none; } #Content-Primary h3 img { display: inline; margin: 0 10px 0 0; } /* #Content-Primary ul { list-style-type: none; } */ #jobs-list ul { list-style-type: none; } #jobs-list li { padding-left: 0; margin-left: 0;} #jobs-list p { margin-bottom: 0px;} #jobs-list h2 { margin: 25px 0 0px 0; font-weight: normal; font-size: 15px; text-transform: uppercase; color: #00aeef; } #jobs-list a:visited {color: #00aeef;} /* Content Headings colors */ .bg-green #Content-Primary h1, .bg-green #Content-Primary h2 { color: #00aeef; } .bg-orange #Content-Primary h1, .bg-orange #Content-Primary h2 { color: #eb5b24; } .header-meta { margin-bottom: 19px; padding-bottom: 20px; border-bottom: 1px solid #818080; font-size: 14px; line-height: 16px; } .header-meta .map-it { font-size: 12px; text-transform: uppercase; line-height: 16px; } .header-meta .map-it a { border: none; } .header-meta p { margin: 5px 0; } .header-meta img { display: inline; margin-right: 3px; vertical-align: text-bottom; } /* Change width for primary content area per wide and narrow columns */ .wide-third #Content-Primary { left: 206px; width: 387px; } .narrow-third #Content-Primary { left: 206px; width: 487px; } .two-col #Content-Primary { left: 206px; width: 645px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } /* Lists ------------------------------------------------------------------ */ .listing { margin: 0 0 0 0; padding: 0; list-style-type: none; } .listing li { margin: 0 0 10px; padding: 0; } .photos img { border: 10px solid #FFF; -webkit-box-shadow: 4px 4px 5px rgba(2,3,3,0.25); -moz-box-shadow: 4px 4px 5px rgba(2,3,3,0.25); box-shadow: 4px 4px 5px rgba(2,3,3,0.25); } #Sidebar-Secondary.col-2 .listing {margin-left:-9px} /* Buttons ---------------------------------------------------------------- */ .button { display: block; padding: 5px 15px; border: none; color: #fff; background-color: #f2f2f2; } .button:hover { background-color: #4F8EAE; } /* =CTA >> Call to action buttons ---------------------------------------------------------------------------- */ /* CTA on homepage */ #CTA { position: relative; float: left; z-index: 999; margin-top: -10px; width: 659px; } #CTA a { display: block; height: 45px; text-indent: -99999em; background: url( 'http://www.galileo-learning.com/images/uploads/promotions/offer-arrow.gif' ) no-repeat 0 -45px; } #CTA a:hover { background-position: 0 0; } /* =SIDEBARS ---------------------------------------------------------------------------- */ /* Primary/Left Sidebar --------------------------------------------------- */ #Sidebar-Primary { width: 196px; } /* Compensate for varying sidebar widths */ .wide-third #Sidebar-Primary { left: -437px; } .narrow-third #Sidebar-Primary { left: -537px; } .two-col #Sidebar-Primary { left: -685px; } #Navigation-Secondary { margin-bottom: 25px; padding-bottom: 10px; background-color: #00aeef; -webkit-box-shadow: 4px 4px 5px rgba(2,3,3,0.25); -moz-box-shadow: 4px 4px 5px rgba(2,3,3,0.25); box-shadow: 4px 4px 5px rgba(2,3,3,0.25); } #gsq-Navigation-Secondary { margin-bottom: 25px; padding-bottom: 10px; background-color: #ffbf25; -webkit-box-shadow: 4px 4px 5px rgba(2,3,3,0.25); -moz-box-shadow: 4px 4px 5px rgba(2,3,3,0.25); box-shadow: 4px 4px 5px rgba(2,3,3,0.25); } #Navigation-Secondary h3 { margin-bottom: 15px; height: 122px; text-indent: -9999em; background: url('../img/site/camp-galileo/logo-cg.png') no-repeat center top; } #gsq-Navigation-Secondary h3 { margin-bottom: 15px; height: 122px; text-indent: -9999em; background: url('../img/site/galileo-summer-quest/logo-gsq.png') no-repeat center top; } #Navigation-Secondary #gsq-Navigation-Secondary ul { } .why-button { display: block; margin: 0 auto 15px; border: none; width: 125px; } .widget { margin: 0 0 15px; padding: 0 10px 0 20px; } .testimonial {position:relative; margin: 0 0 0 20px; padding: 105px 15px 85px; border: 0; width: 149px; height: 188px; background: url('../img/site/camp-galileo/testimonial-green-graphicbackground.png') no-repeat center top; } .testimonial-orange { margin: 0 0 0 20px; padding: 105px 15px 85px; border: 0; width: 149px; height: 188px; background: url('../img/site/galileo-summer-quest/testimonial-orange-graphicbackground.png') no-repeat center top; } .testimonial-blue { margin: 0 0 0 20px; padding: 105px 15px 85px; border: 0; width: 149px; height: 188px; background: url('../img/site/about/testimonial-blue-graphicbackground.png') no-repeat center top; } .testimonial, .testimonial, .testimonial-orange, .testimonial-blue p { color: #fff; font-size: 15px; line-height: 17px; font-style: normal; text-align: center; vertical-align:middle; font-family:DIN;} .testimonial p { margin: 0; } .testimonial .source { display: block; font-size: 10px; line-height: 18px; text-transform: uppercase; vertical-align:middle; } .testimonial_inner { position:absolute; top:65%; height:188px; width: 149px; margin-top:-120px;} /* Sidebar Themes driven by body ID's/classes */ #Camp-Galileo #Navigation-Secondary { background-color: #00aeef; } #Camp-Galileo #Navigation-Secondary h3 { background-image: url('../img/site/camp-galileo/logo-cg.png'); } #GSQ #Navigation-Secondary { background-color: #ffc424; } #GSQ #Navigation-Secondary h3 { height: 90px; background-image: url('../img/site/galileo-summer-quest/logo-gsq.png'); } #TSC #Navigation-Secondary { background-color: #7dc442; } #TSC #Navigation-Secondary h3 { min-height: 290px; background-image: url('../img/site/galileo-summer-quest/TechSideNav_logo_tall.png'); } #Community #Navigation-Secondary { background-color: #ffbf25; } #Community #Navigation-Secondary h3 { height: 90px; background-image: url('../img/site/galileo-summer-quest/logo-gsq.png'); } #Blog #Navigation-Secondary { padding-top: 15px; background-color: #e6e6e6; } #Blog #Navigation-Secondary ul { margin-bottom: 15px; } #Blog #Navigation-Secondary h3, #Blog #Navigation-Secondary h4 { margin: 0; padding: 0 10px 0 20px; height: auto; font-size: 15px; line-height: 18px; text-indent: 0; background: none; font-weight: normal; font-family:DIN-Medium; } #Blog #Navigation-Secondary h4 { padding: 0; font-weight: normal; font-family:DIN-Medium;} #Blog #Navigation-Secondary a { border: none; color: #4d4d4d; } #Blog #Navigation-Secondary .monthly-archives a {font-family:DIN;} #About-Navigation-Secondary { padding-top: 15px; background-color: #e6e6e6; } #About-Navigation-Secondary ul { margin-bottom: 15px; } #About-Navigation-Secondary h3, #About-Navigation-Secondary h4 { margin: 0; padding: 0 10px 0 20px; height: auto; font-size: 13px; line-height: 18px; text-indent: 0; background: none; } #About-Navigation-Secondary a { border: none; color: #4d4d4d; } #About-Navigation-Secondary { margin-bottom: 25px; padding-bottom: 10px; background-color: #e6e6e6; -webkit-box-shadow: 4px 4px 5px rgba(2,3,3,0.25); -moz-box-shadow: 4px 4px 5px rgba(2,3,3,0.25); box-shadow: 4px 4px 5px rgba(2,3,3,0.25); } /* Set testimonial background based on the color of the page background */ .bg-green .testimonial { background-image: url('../img/site/camp-galileo/testimonial-green-graphicbackground.png'); } .bg-orange .testimonial { background-image: url('../img/site/galileo-summer-quest/testimonial-orange-graphicbackground.png'); } .bg-blue .testimonial { background-image: url('../img/site/about/testimonial-blue-graphicbackground.png'); } /* Secondary/Right Sidebar ------------------------------------------------ */ #Sidebar-Secondary { padding: 15px 0; width: 267px; min-height: 596px; } #GSQ-Sidebar-Secondary { padding: 15px 0; width: 267px; min-height: 1036px; background-image: url(/img/site/global/GSQswirlyPattern1.jpg); background-repeat: no-repeat; } .flush-right { float: right; margin: 25px 0; } .flush-right-video { float: right; margin: 0px 8px 0px 25px; } /* Compensate for varying sidebar widths */ .wide-third #Sidebar-Secondary { width: 267px; } .narrow-third #Sidebar-Secondary { width: 167px; } /* =FOOTER ---------------------------------------------------------------------------- */ #Footer { margin-top: 25px; padding-left: 10px; width: 890px; font-family: DIN-Medium, Helvetica, sans-serif; font-weight: normal; font-style: normal; text-transform: none; line-height: 1.0; } #Footer .col-2 { width: 200px; } #Footer h1 { margin: 0 0 15px; font-size: 16px; font-family: DIN-Medium, Helvetica, sans-serif; font-weight: normal; font-style: normal; text-transform: none; line-height: 1.0; } #Footer h2 { margin: 0; font-size: 11px; font-family: DIN-Medium, Helvetica, sans-serif; font-weight: normal; font-style: normal; line-height: 12px; } .green h2 { color: #7dc442; } .orange h2 { color: #eb5b24; } .blue h2 { color: #00aeef; } .yellow h2 { color: #ffc424; } #Footer a { border: none; color: #4d4d4d; font-family: DIN-Medium, Helvetica, sans-serif; font-weight: normal; font-style: normal; text-transform: none; line-height: 1.0; } #Footer a:hover {color: #eb5b24;} #Footer ul { margin: 0 0 12px; padding: 0; list-style-type: none; } #Footer li { margin: 0 0 3px; padding: 0; font-size: 12px; font-family: DIN-Bold, Helvetica, sans-serif; font-weight: normal; font-style: normal; line-height: 1.0; } #Copyright { clear: both; margin: 0; padding: 0 20px; color: #020202; font-size: 10px; line-height: 20px; text-transform: uppercase; background-color: #d2d0cf; } /* ---------------------------------------------------------------------------- TITLE: Utility Classes DESCRIPTION: Use these classes in the HTML to provide alignment, visual styling, and typography adjustments during prototyping. Ideally removed in production on high traffic sites. ---------------------------------------------------------------------------- */ /* =FLOATS ---------------------------------------------------------------------------- */ .float-left { float: left; margin: 0 40px 18px 0; } .float-right { float: right; margin: 0 0 18px 40px; } /* =BORDERS ---------------------------------------------------------------------------- */ .border { border: 1px solid #d9d9d9; } .border-top { border-top: 1px solid #d9d9d9; } .border-right { border-right: 1px solid #d9d9d9; } .border-bottom { border-bottom: 1px solid #d9d9d9; } .border-left { border-left: 1px solid #d9d9d9; } /* =MESSAGES ---------------------------------------------------------------------------- */ .error, .notice, .success { border-width: 2px; border-style: solid; padding: 7px 10px; } .error { border-color: #fbc2c4; color: #8a1f11; background: #fbe3e4; } .notice { border-color: #ffd324; color: #514721; background: #fff6bf; } .success { border-color: #c6d880; color: #264409; background: #e6efc2; } /* Links within success, error, & notice boxes */ a.error, .error a { color: #fd4239; } a.notice, .notice a { color: #514721; } a.success, .success a { color: #264409; } /* =COLOR >> Text and font styles ---------------------------------------------------------------------------- */ .quiet { color: #666; } .loud { color: #000; } .highlight { font-weight: bold; background-color: #ff9; } .added { background: #060; color: #fff; } .removed { background: #900; color: #fff; } .disabled { opacity: 0.25; cursor: default; } /* Increase/decrease text size */ .small { font-size: 11px; } .large { font-size: 15px; } /* Align or justify text inside containers */ .align-left { text-align: left; } .align-center { text-align: center; } .align-right { text-align: right; } .align-justify { text-align: justify; } /* Pagebreaks */ .page-break { page-break-before: always; } /* =MARGINS AND PADDING ---------------------------------------------------------------------------- */ /* Remove margins and padding from elements */ .first { margin-left: 0 !important; padding-left: 0 !important; border-left: none !important; } .last { margin-right: 0 !important; padding-right: 0 !important; border-right: none !important; } .top { margin-top: 0 !important; padding-top: 0 !important; border-top: none !important; } .bottom { margin-bottom: 0 !important; padding-bottom: 0 !important; border-bottom: none !important; } /* Reset margins and padding */ .reset { margin: 0 !important; padding: 0 !important; } .reset-margin { margin: 0 !important; } .reset-padding { padding: 0 !important; } /* Reset border */ .reset-border { border: none !important; } /* =EFFECTS ---------------------------------------------------------------------------- */ /* Rounded corners */ .rounded { -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; } .top-left-rounded { -webkit-border-top-left-radius: 12px; -moz-border-radius-topleft: 12px; border-top-left-radius: 12px; } .top-right-rounded { -webkit-border-top-right-radius: 12px; -moz-border-radius-topright: 12px; border-top-right-radius: 12px; } .bottom-left-rounded { -webkit-border-bottom-left-radius: 12px; -moz-border-radius-bottomleft: 12px; border-bottom-left-radius: 12px; } .bottom-right-rounded { -webkit-border-bottom-right-radius: 12px; -moz-border-radius-bottomright: 12px; border-bottom-right-radius: 12px; } /* Drop shadows */ .shadow { -webkit-box-shadow: 0 2px 4px #4D4E53; -moz-box-shadow: 0 2px 4px #4D4E53; box-shadow: 0 2px 4px #4D4E53; } /* Cursors */ .pointer { cursor: pointer; } /* Blog */ #Content-Primary .post-title h1 { margin: 0 0 3px; font-size: 16px; line-height: 20px; color: #00aeef;} .share {display: inline;} /* Videos */ .video_image {width: 120px; margin-bottom: 2px;} .video_text {width: 250px;} #videos {background-color: #fff; clear:both;margin-bottom:10px;} #right_vid {width: 265px; float: left;} /* SALES FORCE */ #mailing_list table, th, tr, td, caption {border: none;} .enroll-promo {margin-top: 10px;} .enroll-image-left {margin-left: 15px;} .enroll-image-right {margin-left: 30px;} /* Global form elements ---------------------------------------------------- */ form { } fieldset { margin: 0; padding: 8px 9px; } legend { font-weight: bold; font-size:15px; } label { font-weight: bold; vertical-align: middle; } input, textarea, select, button { } input[type=submit], button, label, select { cursor: pointer; } input[type=text], input[type=password], input[type=file], input[type=email], input[type=url], input[type=number], input[type=search], input.text, input.title, textarea, select { border: 1px solid #d9d9d9; background-color: #fff; } input[type=range] { } input[type=date], input[type=datetime], input[type=month], input[type=week], input[type=time] { } input[type=text]:focus, input[type=password]:focus, input[type=file]:focus, input[type=email]:focus, input[type=url]:focus, input[type=number]:focus, input[type=search]:focus, input.text:focus, input.title:focus, textarea:focus, select:focus { border-color: #551A8B; } input[type=text], input[type=password], input[type=file], input[type=email], input[type=url], input[type=number], input[type=search], input.text, input.title, textarea, select { margin: 0; } input[type=text], input[type=password], input[type=file], input[type=email], input[type=url], input[type=number], input[type=search], input.text, input.title { padding: 5px; width: 390px; } input.title { font-size: 18px; } input[type=checkbox], input[type=radio], input.checkbox, input.radio { position: relative; top: 0; vertical-align: text-top; } form.inline { line-height: 3; } form.inline p, form.inline div { margin-bottom: 0; } form.block label { display: block; } .inlineLabels label { display: block; float: left; width: 16em; } .inlineLabels .merged, .btnHolder { padding-left: 10em; } .merged label { display: inline; float: none; width: auto; } .btnHolder { margin: 9px 0; } button { } .datalist, datalist { } optgroup { } option { } textarea { padding: 5px; width: 390px; height: 134px; vertical-align: baseline; } .ctrlHolder span { color: red; font-size: 10px; } /* Forms ------------------------------------------------------------------- */ .form { } .form fieldset { border-width: 0; } .form ol { margin: 0; padding: 0; list-style-type: none; } .form li { margin: 9px 0; padding: 0; }