@charset "UTF-8"; /* Geochemist's Workbench - Bootstrap Overrides */ /* These are style overrides for the home page only for gwb.com, community.gwb.com, academy.GWB.com, and ChemPlugin.GWB.com. All other style are in GWB_style.css */ /* -------------- Twitter Feed ------------------ */ .twitter { margin: 1.5rem 0 3rem 0; } @media (max-width: 768px) { .twitter { padding: 0 5%; } } /* ================= Home Page Slider ================= */ /* ------------ GWB-only and common styles ------------*/ /* Main site slider */ #slider1_container { position: relative; margin: 0 auto; top: 0px; left: 0px; width: 878px; height: 300px; overflow: hidden; } #slider1_slides { position: absolute; left: 0px; top: 0px; width: 878px; height: 300px; overflow: hidden; } .caption { position: absolute; top: 30px; left: 30px; width: 270px; height: 250px; } .GWB_slide_title { font-size: 2.7rem; line-height: 3.1rem; color: #fff; font-weight: bold; padding-bottom: 1.5rem; } .GWB_slide_quote { font-size: 1.7rem; line-height: 2.4rem; color: #ddd; padding-bottom: 0.7rem; } .GWB_slide_speaker { font-size: 1.4rem; color: #ddd; font-style: italic; text-align:right; } /* The plugin scales things down for smaller screen sizes, so we have to manually increase the font size here to compensate */ @media (max-width: 992px) { .caption { top: 0px; left: 5px; width: 300px;height: 280px; } .GWB_slide_title { font-size: 2.6rem; line-height: 3.6rem; padding-bottom: 1.2rem; } .GWB_slide_quote { font-size: 1.6rem; line-height: 2.6rem; padding-bottom: 2.0rem; } .GWB_slide_speaker { font-size: 1.4rem; line-height: 2.3rem; text-align: left; margin-left: 1rem; } } /* arrow navigation */ /* The arrow navigation is one single image that is positioned within a 55px-square box; the image itself has both plain & hover versions AND left & right arrows. The styling here re-positions the image within the 55px box to show the correct arrow in each instance "l" is for left arrow; "r" is for right */ .jssora03l, .jssora03r { display: block; position: absolute; top: 240px; /* size of individual arrow element */ width: 55px; height: 55px; cursor: pointer; background: url('../images/a03.png') no-repeat; overflow: hidden; } .jssora03l { background-position: -3px -33px; left: 3px;} .jssora03r { background-position: -63px -33px; right: 3px;} .jssora03l:hover { background-position: -123px -33px; } .jssora03r:hover { background-position: -183px -33px; } /* Bullet navigation */ /* horizontal positioning is handled by plugin options */ .jssorb01 { position: absolute; top: 280px; } .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av { position: absolute; /* size of bullet elment; space between boxes handled by plugin options */ width: 12px; height: 12px; overflow: hidden; cursor: pointer; border: #777 1px solid; } .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av { filter: alpha(opacity=40); opacity: .4; } .jssorb01 div { background-color: #bbb; } .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; } .jssorb01 .av { background-color: #fff; } .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; } /* ----------------- Community & ChemPlugin & Academy sliders ------------------*/ /* Only the sizing of the slider is handled here; the text styling is included in the section (or inline) of Community/index.php because each slide is differently styled */ .community #slider1_container, .community #slider1_slides, .ChemPlugin #slider1_container, .ChemPlugin #slider1_slides, .academy #slider1_container, .academy #slider1_slides { width: 855px; height: 380px; } /* arrow navigation */ .community .jssora03l, .community .jssora03r, .ChemPlugin .jssora03l, .ChemPlugin .jssora03r, .academy .jssora03l, .academy .jssora03r { top: 310px; } .community .jssora03r, .ChemPlugin .jssora03r, .academy .jssora03r { right: 0px; } /* Bullet navigation */ /* horizontal positioning is handled by plugin options */ .community .jssorb01, .ChemPlugin .jssorb01, .academy .jssorb01 { position: absolute; top: 335px; } .ChemPlugin .jssorb01 { position: absolute; top: 345px; } .community .jssorb01 div, .community .jssorb01 div:hover, .community .jssorb01 .av { filter: alpha(opacity=70); opacity: .7; } .community .jssorb01 div { background-color: gray; border-color: #bbb; } /* The plugin scales things down for smaller screen sizes, so we have to manually increase the font size here to compensate */ @media (max-width: 992px) { .ChemPlugin_slide_title { font-size: 4rem; line-height: 4.0rem; } .academy_slide_title { font-size: 4rem; line-height: 4.0rem; } } /* ================= END Home Page Slider ================= */ /* Do not enter new styles here. This is the ChemPlugin section. Enter new CSS at the top of the file for common styles, or in the appropriate website's section */