/* ///// non-fixed items ////////////////////////////////////////////////////////////// */ #nonfixed { position: relative; overflow: visible; height: 100%; } /* ///// the gaps for big images and such ///////////////////////////////////////////// */ /* areas that are sized to a specific % of the browsers height - usually contains fluff */ .px-gap { position: relative; background-color: transparent; background-repeat: no-repeat; background-size: cover; z-index: 2; /* so the content area drop shadows are on top of the gaps */ } /* 'window' height for fixed bg images that are 50% - 100% tall */ .px-gap-50 { height: 50%; min-height: 280px; max-height: 768px; } .px-gap-60 { height: 60%; min-height: 280px; max-height: 768px; } .px-gap-75 { height: 75%; min-height: 280px; max-height: 768px; } .px-gap-80 { height: 80%; min-height: 320px; max-height: 768px; } .px-gap-95 { height: 95%; min-height: 320px; max-height: 768px; } .px-gap-100 { height: 100%; min-height: 320px; max-height: 768px; } /* ie8 polyfill for background-size: cover */ .ie8 .fix-cover, .ie8 .px-gap, .ie8 .homeSlide { -ms-behavior: url(scripts/backgroundsize/backgroundsize.min.htc);/* url relative to the page, not the .css */ } /* when parallax is enabled (and images are enabled), clear out the fallback bg images */ @media only screen {/* on screen only (not print) */ /* .images-on.skrollr .px-gap { background: transparent !important; } */ .skrollr .px-gap { background: transparent !important; } } /* on phones, make the gaps a little smaller */ @media only screen and (max-width: 479px) { .px-gap-50 { height: 45%; } .px-gap-60 { height: 55%; } .px-gap-75 { height: 70%; } .px-gap-80 { height: 75%; } .px-gap-95 { height: 90%; } } /* on print (where parallax is disabled), show the fallback bgs and shorten their heights */ @media print {/* on print only (not screen) */ /* make the inline bg images less humongous and don't let the page break inside them */ .px-gap-50, .px-gap-60, .px-gap-75, .px-gap-80, .px-gap-95, .px-gap-100 { height: 260px !important; min-height: 260px !important; page-break-inside: avoid; } } /* remove the usual padding when the content is in a bg area or fixed area */ .px-gap .pxc-sizer { padding: 0; } /* ///// content areas between bg image gaps ////////////////////////////////////////// */ /* a content area of any height, that goes between the gap areas */ .px-content { position: relative; /* so the content area drop shadows are on top of the gaps */ padding: 1em 1em 60px 1em; background: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; z-index: 3; /* so the content area drop shadows are on top of the gaps */ } /* .images-off .px-content { padding: 1em; } */ /* a content area that is 100% tall (fills the viewport even if the content in it is short) */ .px-content-full { height: 100%; } /* a content area that is at least x% tall (used in the last section to make sure the section is always tall enough to trigger the menu highlighting - must have a (100-x)% tall img bg above it) */ .px-content-end { padding-bottom: 1em; } .px-content-end-50 { min-height: 50%; } /* use with 50% gap */ .px-content-end-40 { min-height: 40%; } /* use with 60% gap */ .px-content-end-25 { min-height: 25%; } /* use with 75% gap */ .px-content-end-5 { min-height: 5%; } /* use with 95% gap */ /* only give the content areas drop shadows when on screen & images are enabled */ @media only screen { /* .images-on .px-content { */ #header, .px-content { -webkit-box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, .25); -moz-box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, .25); box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, .25); } .safari.windows #header, .safari.windows .px-content { -webkit-box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, .15); -moz-box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, .15); box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, .15); } /* on tablets the bg gaps aren't sizing exactly right, so you see a little space above and below the content areas. removing the shadows makes it so you don't see the gaps, because they are the same color as the content bg. */ .android #header, .ipad #header, .android .px-content, .ipad .px-content { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } } /* on print, remove extra space, adjust colors, and limit height */ @media print { /* remove extra space in the content areas */ .px-content { padding: 1em 0; background: #fff; } /* make the fullscreen content areas normal sized */ .px-content-full { height: auto; } /* make the 50% tall content areas normal sized */ .px-content-end { min-height: 0; } } /* ///// scroll hints ///////////////////////////////////////////////////////////////// */ /* icons you click on to scroll to the next section, for people who don't know how to web */ .first-scroll-hint, .scroll-hint { display: inline; position: absolute; bottom: 30px; right: 30px; width: 48px; height: 48px; cursor: pointer; } #sect-slides #home .scroll-hint, #sect-home #home .scroll-hint { bottom: 20px; } @media only screen and (max-height: 640px) { .px-gap .scroll-hint { display: none !important; } } /* .images-off .scroll-hint { display: none !important; } */ /* make the first button bounce */ @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -moz-transform: translateY(0); transform: translateY(0); } 40% { -moz-transform: translateY(-20px); transform: translateY(-20px); } 60% { -moz-transform: translateY(-10px); transform: translateY(-10px); } } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-20px); transform: translateY(-20px); } 60% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -moz-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } 40% { -moz-transform: translateY(-20px); -ms-transform: translateY(-20px); -webkit-transform: translateY(-20px); transform: translateY(-20px); } 60% { -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -webkit-transform: translateY(-10px); transform: translateY(-10px); } } .first-scroll-hint { -moz-animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite; animation: bounce 2s infinite; } @media only screen and (max-width: 1175px) { #sect-slides #home .scroll-hint, #sect-home #home .scroll-hint { bottom: 10px; right: 10px; width: 31px; height: 31px; } #sect-slides #home .scroll-hint img, #sect-home #home .scroll-hint img { width: 31px; height: 31px; } } @media only screen and (max-width: 480px) { .first-scroll-hint, .scroll-hint { bottom: 10px; right: 10px; width: 31px; height: 31px; } .first-scroll-hint img, .scroll-hint img { width: 31px; height: 31px; } #sect-slides #home .scroll-hint, #sect-home #home .scroll-hint { display: none !important; opacity: 0 !important; } } .scroll-hint { display: none; } /* only show on home */ #sect-slides .scroll-hint, #sect-home .scroll-hint { display: block; } /* don't show the last one on long pages */ #sect-slides .last-scroll-hint, #sect-home .last-scroll-hint { display: none; } @media only screen and (max-height: 640px) { #sect-slides .last-scroll-hint, #sect-home .last-scroll-hint { display: block; } } /* hide on print */ @media print { .scroll-hint { display: none !important; opacity: 0 !important; } } /* for this site, since it should scroll the section below the header instead of to the top of the page, we can't use the scroll hints on sites that don't allow smooth scrolling. Otherwise, it scrolls to far, so the top of the section is hidden behind the header. (example: ipad) */ .no-smooth-scroll #sect-home .scroll-hint { display: none !important; } /* ///// HOME ///////////////////////////////////////////////////////////////////////// */ #home { position: relative; background-color: #dea057; } /* don't let the header overlap the content on print */ @media print { #home { padding-top: 140px; } } /* slides ============== */ /* slide container parts */ #home-slides-container { position: absolute; top: 140px; bottom: 0; left: 0; right: 0; height: auto; } @media only screen and (max-width: 767px) { #home-slides-container { top: 70px; } } @media only screen and (max-width: 640px) { #home-slides-container { top: 50px; } } @media only print, only screen and (max-height: 480px) { #home-slides-container { top: 50px; } } #home-slides { height: 100%; } #home-slides .slick-list, #home-slides .slick-track { height: 100%; } /* slide prev/next controls */ #home-slides .slick-prev { left: 0; } #home-slides .slick-next { right: 0; } /* slide dot controls */ #home-slides .slick-dots { bottom: -10px; } @media only screen and (max-width: 480px) { #home-slides .slick-dots { bottom: -15px; } } #home-slides .slick-dots li button:before { font-size: 70px; color: #fff; opacity: 1 !important; } #home-slides .slick-dots li.slick-active button:before { opacity: 1 !important; color: #ee1d23; } #home-slides .slick-dots li button:hover:before, #home-slides .slick-dots li button:focus:before { color: #222; } #home-slides .slick-prev, #home-slides .slick-next { display: none !important; } #home-slides .slick-prev { -webkit-border-top-right-radius: 2px; -webkit-border-bottom-right-radius: 2px; -moz-border-radius-topright: 2px; -moz-border-radius-bottomright: 2px; border-top-right-radius: 2px; border-bottom-right-radius: 2px; } #home-slides .slick-next { -webkit-border-top-left-radius: 2px; -webkit-border-bottom-left-radius: 2px; -moz-border-radius-topleft: 2px; -moz-border-radius-bottomleft: 2px; border-top-left-radius: 2px; border-bottom-left-radius: 2px; } @media print { #home-slides .slick-dots { display: none !important; } #home-slides .slick-slide { display: none; } #home-slides .slick-active { display: block; width: 100% !important; } #home-slides .slick-track { width: 100% !important; transform: none !important; } } /* individual slides */ #home-slides .homeSlide { width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover !important; background-color: #DFCD9E; } @media only print, only screen and (max-width: 767px) { #home-slides .homeSlide { font-family: Georgia, serif; } } /* specifics for slides after 00 */ #home-slides .bg-slide01 { background-color: #BE9869; background-position: center center; } #home-slides .bg-slide02 { background-color: #222D1C; background-position: left center; } #home-slides .bg-slide03 { background-color: #E3E0D9; background-position: right center; } /* on large sized screens, use large images */ @media only screen and (min-width: 769px) { #home-slides .bg-slide01 { background-image: url(../images/slides/bg-slide01.jpg); } #home-slides .bg-slide02 { background-image: url(../images/slides/bg-slide02.jpg); } #home-slides .bg-slide03 { background-image: url(../images/slides/bg-slide03.jpg); } } /* on medium sized screens, use smaller images */ @media only print, only screen and (min-width: 480px) and (max-width: 768px) { #home-slides .bg-slide01 { background-image: url(../images/slides/bg-slide01-med.jpg); } #home-slides .bg-slide02 { background-image: url(../images/slides/bg-slide02-med.jpg); } #home-slides .bg-slide03 { background-image: url(../images/slides/bg-slide03-med.jpg); } } /* on small sized screens, use even smaller images */ @media only print, only screen and (min-width: 480px) and (max-height: 480px) { #home-slides .bg-slide01 { background-image: url(../images/slides/bg-slide01-sm.jpg); } #home-slides .bg-slide02 { background-image: url(../images/slides/bg-slide02-sm.jpg); } #home-slides .bg-slide03 { background-image: url(../images/slides/bg-slide03-sm.jpg); } } @media only print, only screen and (max-width: 479px) { #home-slides .bg-slide01 { background-image: url(../images/slides/bg-slide01-sm.jpg); } #home-slides .bg-slide02 { background-image: url(../images/slides/bg-slide02-sm.jpg); } #home-slides .bg-slide03 { background-image: url(../images/slides/bg-slide03-sm.jpg); } } @media only screen and (max-height: 640px) and (min-width: 640px) { #home-slides .homeSlide.bg-slide03 { background-position: center -75px !important; } } @media only print { #home-slides .homeSlide.bg-slide03 { background-position: center top !important; } } /* ---------------------------------------------------------------------------------------------- */ /* specifics for slides after 00 */ #home-slides .bg-slide-01 { background-color: #FFE793; background-position: center center; } #home-slides .bg-slide-02 { background-color: #4D5480; background-position: center center; } #home-slides .bg-slide-03 { background-color: #1F100D; background-position: center center; } #home-slides .bg-slide-04 { background-color: #493E21; background-position: center center; } #home-slides .bg-slide-05 { background-color: #143910; background-position: center center; } #home-slides .bg-slide-06 { background-color: #CDB56B; background-position: center center; } #home-slides .bg-slide-07 { background-color: #222D1C; background-position: center top; } #home-slides .bg-slide-08 { background-color: #433802; background-position: center center; } #home-slides .bg-slide-09 { background-color: #1F2C10; background-position: center center; } #home-slides .bg-slide-10 { background-color: #460B0A; background-position: center center; } #home-slides .bg-slide-11 { background-color: #E9D599; background-position: center center; } #home-slides .bg-slide-12 { background-color: #6F8FBE; background-position: center center; } #home-slides .bg-slide-13 { background-color: #A9AC99; background-position: center center; } #home-slides .bg-slide-14 { background-color: #4D452E; background-position: center center; } #home-slides .bg-slide-15 { background-color: #BCB7B1; background-position: center center; } #home-slides .bg-slide-16 { background-color: #C59161; background-position: center center; } #home-slides .bg-slide-17 { background-color: #CFC2B1; background-position: center center; } #home-slides .bg-slide-18 { background-color: #BED3D8; background-position: center center; } #home-slides .bg-slide-19 { background-color: #FFF5DE; background-position: center center; } #home-slides .bg-slide-20 { background-color: #7C5D23; background-position: left center; } #home-slides .bg-slide-21 { background-color: #B3C8E7; background-position: center center; } #home-slides .bg-slide-22 { background-color: #9D9A87; background-position: center center; } #home-slides .bg-slide-23 { background-color: #BE9869; background-position: center center; } #home-slides .bg-slide-24 { background-color: #1A3653; background-position: center center; } #home-slides .bg-slide-25 { background-color: #D4D6C0; background-position: center bottom; } #home-slides .bg-slide-26 { background-color: #687681; background-position: center center; } #home-slides .bg-slide-27 { background-color: #A5A5AF; background-position: center bottom; } #home-slides .bg-slide-28 { background-color: #6789A4; background-position: center center; } #home-slides .bg-slide-29 { background-color: #000000; background-position: center center; } #home-slides .bg-slide-30 { background-color: #EDD989; background-position: center center; } #home-slides .bg-slide-31 { background-color: #5D7B97; background-position: center center; } #home-slides .bg-slide-32 { background-color: #79797B; background-position: center center; } #home-slides .bg-slide-33 { background-color: #E3E0D9; background-position: center center; } #home-slides .bg-slide-34 { background-color: #414449; background-position: center center; } #home-slides .bg-slide-35 { background-color: #87592F; background-position: center center; } #home-slides .bg-slide-36 { background-color: #875F00; background-position: center center; } #home-slides .bg-slide-37 { background-color: #6D6D4B; background-position: center center; } #home-slides .bg-slide-38 { background-color: #A69166; background-position: center center; } #home-slides .bg-slide-39 { background-color: #6A6955; background-position: center center; } #home-slides .bg-slide-40 { background-color: #EDEDED; background-position: center bottom; } #home-slides .bg-slide-41 { background-color: #B8B8AC; background-position: center center; } #home-slides .bg-slide-42 { background-color: #B87942; background-position: center center; } #home-slides .bg-slide-43 { background-color: #B5B2AD; background-position: center center; } #home-slides .bg-slide-44 { background-color: #A0A6B6; background-position: center center; } #home-slides .bg-slide-45 { background-color: #975D09; background-position: center center; } #home-slides .bg-slide-46 { background-color: #525051; background-position: center center; } #home-slides .bg-slide-47 { background-color: #432F14; background-position: center center; } #home-slides .bg-slide-48 { background-color: #131605; background-position: center center; } #home-slides .bg-slide-49 { background-color: #951A1C; background-position: center center; } #home-slides .bg-slide-50 { background-color: #090601; background-position: center center; } #home-slides .bg-slide-51 { background-color: #0D0D17; background-position: center center; } #home-slides .bg-slide-52 { background-color: #131B1D; background-position: right center; } #home-slides .bg-slide-53 { background-color: #034600; background-position: center center; } #home-slides .bg-slide-54 { background-color: #FEA389; background-position: center center; } #home-slides .bg-slide-55 { background-color: #B7A58D; background-position: center center; } #home-slides .bg-slide-56 { background-color: #3B3F01; background-position: center center; } #home-slides .bg-slide-57 { background-color: #876451; background-position: center center; } #home-slides .bg-slide-58 { background-color: #876451; background-position: center center; } /* on large sized screens, use large images */ @media only screen and (min-width: 769px) { #home-slides .bg-slide-01 { background-image: url(../images/slides/bg-slide-01.jpg); } #home-slides .bg-slide-02 { background-image: url(../images/slides/bg-slide-02.jpg); } #home-slides .bg-slide-03 { background-image: url(../images/slides/bg-slide-03.jpg); } #home-slides .bg-slide-04 { background-image: url(../images/slides/bg-slide-04.jpg); } #home-slides .bg-slide-05 { background-image: url(../images/slides/bg-slide-05.jpg); } #home-slides .bg-slide-06 { background-image: url(../images/slides/bg-slide-06.jpg); } #home-slides .bg-slide-07 { background-image: url(../images/slides/bg-slide-07.jpg); } #home-slides .bg-slide-08 { background-image: url(../images/slides/bg-slide-08.jpg); } #home-slides .bg-slide-09 { background-image: url(../images/slides/bg-slide-09.jpg); } #home-slides .bg-slide-10 { background-image: url(../images/slides/bg-slide-10.jpg); } #home-slides .bg-slide-11 { background-image: url(../images/slides/bg-slide-11.jpg); } #home-slides .bg-slide-12 { background-image: url(../images/slides/bg-slide-12.jpg); } #home-slides .bg-slide-13 { background-image: url(../images/slides/bg-slide-13.jpg); } #home-slides .bg-slide-14 { background-image: url(../images/slides/bg-slide-14.jpg); } #home-slides .bg-slide-15 { background-image: url(../images/slides/bg-slide-15.jpg); } #home-slides .bg-slide-16 { background-image: url(../images/slides/bg-slide-16.jpg); } #home-slides .bg-slide-17 { background-image: url(../images/slides/bg-slide-17.jpg); } #home-slides .bg-slide-18 { background-image: url(../images/slides/bg-slide-18.jpg); } #home-slides .bg-slide-19 { background-image: url(../images/slides/bg-slide-19.jpg); } #home-slides .bg-slide-20 { background-image: url(../images/slides/bg-slide-20.jpg); } #home-slides .bg-slide-21 { background-image: url(../images/slides/bg-slide-21.jpg); } #home-slides .bg-slide-22 { background-image: url(../images/slides/bg-slide-22.jpg); } #home-slides .bg-slide-23 { background-image: url(../images/slides/bg-slide-23.jpg); } #home-slides .bg-slide-24 { background-image: url(../images/slides/bg-slide-24.jpg); } #home-slides .bg-slide-25 { background-image: url(../images/slides/bg-slide-25.jpg); } #home-slides .bg-slide-26 { background-image: url(../images/slides/bg-slide-26.jpg); } #home-slides .bg-slide-27 { background-image: url(../images/slides/bg-slide-27.jpg); } #home-slides .bg-slide-28 { background-image: url(../images/slides/bg-slide-28.jpg); } #home-slides .bg-slide-29 { background-image: url(../images/slides/bg-slide-29.jpg); } #home-slides .bg-slide-30 { background-image: url(../images/slides/bg-slide-30.jpg); } #home-slides .bg-slide-31 { background-image: url(../images/slides/bg-slide-31.jpg); } #home-slides .bg-slide-32 { background-image: url(../images/slides/bg-slide-32.jpg); } #home-slides .bg-slide-33 { background-image: url(../images/slides/bg-slide-33.jpg); } #home-slides .bg-slide-34 { background-image: url(../images/slides/bg-slide-34.jpg); } #home-slides .bg-slide-35 { background-image: url(../images/slides/bg-slide-35.jpg); } #home-slides .bg-slide-36 { background-image: url(../images/slides/bg-slide-36.jpg); } #home-slides .bg-slide-37 { background-image: url(../images/slides/bg-slide-37.jpg); } #home-slides .bg-slide-38 { background-image: url(../images/slides/bg-slide-38.jpg); } #home-slides .bg-slide-39 { background-image: url(../images/slides/bg-slide-39.jpg); } #home-slides .bg-slide-40 { background-image: url(../images/slides/bg-slide-40.jpg); } #home-slides .bg-slide-41 { background-image: url(../images/slides/bg-slide-41.jpg); } #home-slides .bg-slide-42 { background-image: url(../images/slides/bg-slide-42.jpg); } #home-slides .bg-slide-43 { background-image: url(../images/slides/bg-slide-43.jpg); } #home-slides .bg-slide-44 { background-image: url(../images/slides/bg-slide-44.jpg); } #home-slides .bg-slide-45 { background-image: url(../images/slides/bg-slide-45.jpg); } #home-slides .bg-slide-46 { background-image: url(../images/slides/bg-slide-46.jpg); } #home-slides .bg-slide-47 { background-image: url(../images/slides/bg-slide-47.jpg); } #home-slides .bg-slide-48 { background-image: url(../images/slides/bg-slide-48.jpg); } #home-slides .bg-slide-49 { background-image: url(../images/slides/bg-slide-49.jpg); } #home-slides .bg-slide-50 { background-image: url(../images/slides/bg-slide-50.jpg); } #home-slides .bg-slide-51 { background-image: url(../images/slides/bg-slide-51.jpg); } #home-slides .bg-slide-52 { background-image: url(../images/slides/bg-slide-52.jpg); } #home-slides .bg-slide-53 { background-image: url(../images/slides/bg-slide-53.jpg); } #home-slides .bg-slide-54 { background-image: url(../images/slides/bg-slide-54.jpg); } #home-slides .bg-slide-55 { background-image: url(../images/slides/bg-slide-55.jpg); } #home-slides .bg-slide-56 { background-image: url(../images/slides/bg-slide-56.jpg); } #home-slides .bg-slide-57 { background-image: url(../images/slides/bg-slide-57.jpg); } #home-slides .bg-slide-58 { background-image: url(../images/slides/bg-slide-58.jpg); } } /* on medium sized screens, use smaller images */ @media only print, only screen and (min-width: 480px) and (max-width: 768px) { #home-slides .bg-slide-01 { background-image: url(../images/slides/bg-slide-med-01.jpg); } #home-slides .bg-slide-02 { background-image: url(../images/slides/bg-slide-med-02.jpg); } #home-slides .bg-slide-03 { background-image: url(../images/slides/bg-slide-med-03.jpg); } #home-slides .bg-slide-04 { background-image: url(../images/slides/bg-slide-med-04.jpg); } #home-slides .bg-slide-05 { background-image: url(../images/slides/bg-slide-med-05.jpg); } #home-slides .bg-slide-06 { background-image: url(../images/slides/bg-slide-med-06.jpg); } #home-slides .bg-slide-07 { background-image: url(../images/slides/bg-slide-med-07.jpg); } #home-slides .bg-slide-08 { background-image: url(../images/slides/bg-slide-med-08.jpg); } #home-slides .bg-slide-09 { background-image: url(../images/slides/bg-slide-med-09.jpg); } #home-slides .bg-slide-10 { background-image: url(../images/slides/bg-slide-med-10.jpg); } #home-slides .bg-slide-11 { background-image: url(../images/slides/bg-slide-med-11.jpg); } #home-slides .bg-slide-12 { background-image: url(../images/slides/bg-slide-med-12.jpg); } #home-slides .bg-slide-13 { background-image: url(../images/slides/bg-slide-med-13.jpg); } #home-slides .bg-slide-14 { background-image: url(../images/slides/bg-slide-med-14.jpg); } #home-slides .bg-slide-15 { background-image: url(../images/slides/bg-slide-med-15.jpg); } #home-slides .bg-slide-16 { background-image: url(../images/slides/bg-slide-med-16.jpg); } #home-slides .bg-slide-17 { background-image: url(../images/slides/bg-slide-med-17.jpg); } #home-slides .bg-slide-18 { background-image: url(../images/slides/bg-slide-med-18.jpg); } #home-slides .bg-slide-19 { background-image: url(../images/slides/bg-slide-med-19.jpg); } #home-slides .bg-slide-20 { background-image: url(../images/slides/bg-slide-med-20.jpg); } #home-slides .bg-slide-21 { background-image: url(../images/slides/bg-slide-med-21.jpg); } #home-slides .bg-slide-22 { background-image: url(../images/slides/bg-slide-med-22.jpg); } #home-slides .bg-slide-23 { background-image: url(../images/slides/bg-slide-med-23.jpg); } #home-slides .bg-slide-24 { background-image: url(../images/slides/bg-slide-med-24.jpg); } #home-slides .bg-slide-25 { background-image: url(../images/slides/bg-slide-med-25.jpg); } #home-slides .bg-slide-26 { background-image: url(../images/slides/bg-slide-med-26.jpg); } #home-slides .bg-slide-27 { background-image: url(../images/slides/bg-slide-med-27.jpg); } #home-slides .bg-slide-28 { background-image: url(../images/slides/bg-slide-med-28.jpg); } #home-slides .bg-slide-29 { background-image: url(../images/slides/bg-slide-med-29.jpg); } #home-slides .bg-slide-30 { background-image: url(../images/slides/bg-slide-med-30.jpg); } #home-slides .bg-slide-31 { background-image: url(../images/slides/bg-slide-med-31.jpg); } #home-slides .bg-slide-32 { background-image: url(../images/slides/bg-slide-med-32.jpg); } #home-slides .bg-slide-33 { background-image: url(../images/slides/bg-slide-med-33.jpg); } #home-slides .bg-slide-34 { background-image: url(../images/slides/bg-slide-med-34.jpg); } #home-slides .bg-slide-35 { background-image: url(../images/slides/bg-slide-med-35.jpg); } #home-slides .bg-slide-36 { background-image: url(../images/slides/bg-slide-med-36.jpg); } #home-slides .bg-slide-37 { background-image: url(../images/slides/bg-slide-med-37.jpg); } #home-slides .bg-slide-38 { background-image: url(../images/slides/bg-slide-med-38.jpg); } #home-slides .bg-slide-39 { background-image: url(../images/slides/bg-slide-med-39.jpg); } #home-slides .bg-slide-40 { background-image: url(../images/slides/bg-slide-med-40.jpg); } #home-slides .bg-slide-41 { background-image: url(../images/slides/bg-slide-med-41.jpg); } #home-slides .bg-slide-42 { background-image: url(../images/slides/bg-slide-med-42.jpg); } #home-slides .bg-slide-43 { background-image: url(../images/slides/bg-slide-med-43.jpg); } #home-slides .bg-slide-44 { background-image: url(../images/slides/bg-slide-med-44.jpg); } #home-slides .bg-slide-45 { background-image: url(../images/slides/bg-slide-med-45.jpg); } #home-slides .bg-slide-46 { background-image: url(../images/slides/bg-slide-med-46.jpg); } #home-slides .bg-slide-47 { background-image: url(../images/slides/bg-slide-med-47.jpg); } #home-slides .bg-slide-48 { background-image: url(../images/slides/bg-slide-med-48.jpg); background-position: left center; } #home-slides .bg-slide-49 { background-image: url(../images/slides/bg-slide-med-49.jpg); background-position: left center; } #home-slides .bg-slide-50 { background-image: url(../images/slides/bg-slide-med-50.jpg); } #home-slides .bg-slide-51 { background-image: url(../images/slides/bg-slide-med-51.jpg); } #home-slides .bg-slide-52 { background-image: url(../images/slides/bg-slide-med-52.jpg); } #home-slides .bg-slide-53 { background-image: url(../images/slides/bg-slide-med-53.jpg); } #home-slides .bg-slide-54 { background-image: url(../images/slides/bg-slide-med-54.jpg); } #home-slides .bg-slide-55 { background-image: url(../images/slides/bg-slide-med-55.jpg); } #home-slides .bg-slide-56 { background-image: url(../images/slides/bg-slide-med-56.jpg); } #home-slides .bg-slide-57 { background-image: url(../images/slides/bg-slide-med-57.jpg); } #home-slides .bg-slide-58 { background-image: url(../images/slides/bg-slide-med-58.jpg); } } /* on small sized screens, use even smaller images */ @media only print, only screen and (min-width: 480px) and (max-height: 480px) { #home-slides .bg-slide-01 { background-image: url(../images/slides/bg-slide-sm-01.jpg); } #home-slides .bg-slide-02 { background-image: url(../images/slides/bg-slide-sm-02.jpg); } #home-slides .bg-slide-03 { background-image: url(../images/slides/bg-slide-sm-03.jpg); } #home-slides .bg-slide-04 { background-image: url(../images/slides/bg-slide-sm-04.jpg); background-position: center -50px; } #home-slides .bg-slide-05 { background-image: url(../images/slides/bg-slide-sm-05.jpg); } #home-slides .bg-slide-06 { background-image: url(../images/slides/bg-slide-sm-06.jpg); } #home-slides .bg-slide-07 { background-image: url(../images/slides/bg-slide-sm-07.jpg); } #home-slides .bg-slide-08 { background-image: url(../images/slides/bg-slide-sm-08.jpg); } #home-slides .bg-slide-09 { background-image: url(../images/slides/bg-slide-sm-09.jpg); } #home-slides .bg-slide-10 { background-image: url(../images/slides/bg-slide-sm-10.jpg); } #home-slides .bg-slide-11 { background-image: url(../images/slides/bg-slide-sm-11.jpg); } #home-slides .bg-slide-12 { background-image: url(../images/slides/bg-slide-sm-12.jpg); } #home-slides .bg-slide-13 { background-image: url(../images/slides/bg-slide-sm-13.jpg); } #home-slides .bg-slide-14 { background-image: url(../images/slides/bg-slide-sm-14.jpg); background-position: center -50px; } #home-slides .bg-slide-15 { background-image: url(../images/slides/bg-slide-sm-15.jpg); } #home-slides .bg-slide-16 { background-image: url(../images/slides/bg-slide-sm-16.jpg); } #home-slides .bg-slide-17 { background-image: url(../images/slides/bg-slide-sm-17.jpg); } #home-slides .bg-slide-18 { background-image: url(../images/slides/bg-slide-sm-18.jpg); } #home-slides .bg-slide-19 { background-image: url(../images/slides/bg-slide-sm-19.jpg); } #home-slides .bg-slide-20 { background-image: url(../images/slides/bg-slide-sm-20.jpg); } #home-slides .bg-slide-21 { background-image: url(../images/slides/bg-slide-sm-21.jpg); } #home-slides .bg-slide-22 { background-image: url(../images/slides/bg-slide-sm-22.jpg); } #home-slides .bg-slide-23 { background-image: url(../images/slides/bg-slide-sm-23.jpg); } #home-slides .bg-slide-24 { background-image: url(../images/slides/bg-slide-sm-24.jpg); background-position: center -50px; } #home-slides .bg-slide-25 { background-image: url(../images/slides/bg-slide-sm-25.jpg); background-position: center -50px; } #home-slides .bg-slide-26 { background-image: url(../images/slides/bg-slide-sm-26.jpg); background-position: center -50px; } #home-slides .bg-slide-27 { background-image: url(../images/slides/bg-slide-sm-27.jpg); } #home-slides .bg-slide-28 { background-image: url(../images/slides/bg-slide-sm-28.jpg); } #home-slides .bg-slide-29 { background-image: url(../images/slides/bg-slide-sm-29.jpg); background-position: center -50px; } #home-slides .bg-slide-30 { background-image: url(../images/slides/bg-slide-sm-30.jpg); background-position: center -50px; } #home-slides .bg-slide-31 { background-image: url(../images/slides/bg-slide-sm-31.jpg); } #home-slides .bg-slide-32 { background-image: url(../images/slides/bg-slide-sm-32.jpg); } #home-slides .bg-slide-33 { background-image: url(../images/slides/bg-slide-sm-33.jpg); } #home-slides .bg-slide-34 { background-image: url(../images/slides/bg-slide-sm-34.jpg); } #home-slides .bg-slide-35 { background-image: url(../images/slides/bg-slide-sm-35.jpg); } #home-slides .bg-slide-36 { background-image: url(../images/slides/bg-slide-sm-36.jpg); } #home-slides .bg-slide-37 { background-image: url(../images/slides/bg-slide-sm-37.jpg); } #home-slides .bg-slide-38 { background-image: url(../images/slides/bg-slide-sm-38.jpg); } #home-slides .bg-slide-39 { background-image: url(../images/slides/bg-slide-sm-39.jpg); } #home-slides .bg-slide-40 { background-image: url(../images/slides/bg-slide-sm-40.jpg); background-position: center -50px; } #home-slides .bg-slide-41 { background-image: url(../images/slides/bg-slide-sm-41.jpg); } #home-slides .bg-slide-42 { background-image: url(../images/slides/bg-slide-sm-42.jpg); } #home-slides .bg-slide-43 { background-image: url(../images/slides/bg-slide-sm-43.jpg); } #home-slides .bg-slide-44 { background-image: url(../images/slides/bg-slide-sm-44.jpg); } #home-slides .bg-slide-45 { background-image: url(../images/slides/bg-slide-sm-45.jpg); } #home-slides .bg-slide-46 { background-image: url(../images/slides/bg-slide-sm-46.jpg); } #home-slides .bg-slide-47 { background-image: url(../images/slides/bg-slide-sm-47.jpg); } #home-slides .bg-slide-48 { background-image: url(../images/slides/bg-slide-sm-48.jpg); background-position: left center; } #home-slides .bg-slide-49 { background-image: url(../images/slides/bg-slide-sm-49.jpg); background-position: left center; } #home-slides .bg-slide-50 { background-image: url(../images/slides/bg-slide-sm-50.jpg); } #home-slides .bg-slide-51 { background-image: url(../images/slides/bg-slide-sm-51.jpg); } #home-slides .bg-slide-52 { background-image: url(../images/slides/bg-slide-sm-52.jpg); } #home-slides .bg-slide-53 { background-image: url(../images/slides/bg-slide-sm-53.jpg); } #home-slides .bg-slide-54 { background-image: url(../images/slides/bg-slide-sm-54.jpg); } #home-slides .bg-slide-55 { background-image: url(../images/slides/bg-slide-sm-55.jpg); } #home-slides .bg-slide-56 { background-image: url(../images/slides/bg-slide-sm-56.jpg); } #home-slides .bg-slide-57 { background-image: url(../images/slides/bg-slide-sm-57.jpg); } #home-slides .bg-slide-58 { background-image: url(../images/slides/bg-slide-sm-58.jpg); } } @media only print, only screen and (max-width: 479px) { #home-slides .bg-slide-01 { background-image: url(../images/slides/bg-slide-sm-01.jpg); } #home-slides .bg-slide-02 { background-image: url(../images/slides/bg-slide-sm-02.jpg); } #home-slides .bg-slide-03 { background-image: url(../images/slides/bg-slide-sm-03.jpg); } #home-slides .bg-slide-04 { background-image: url(../images/slides/bg-slide-sm-04.jpg); } #home-slides .bg-slide-05 { background-image: url(../images/slides/bg-slide-sm-05.jpg); } #home-slides .bg-slide-06 { background-image: url(../images/slides/bg-slide-sm-06.jpg); } #home-slides .bg-slide-07 { background-image: url(../images/slides/bg-slide-sm-07.jpg); } #home-slides .bg-slide-08 { background-image: url(../images/slides/bg-slide-sm-08.jpg); } #home-slides .bg-slide-09 { background-image: url(../images/slides/bg-slide-sm-09.jpg); } #home-slides .bg-slide-10 { background-image: url(../images/slides/bg-slide-sm-10.jpg); } #home-slides .bg-slide-11 { background-image: url(../images/slides/bg-slide-sm-11.jpg); } #home-slides .bg-slide-12 { background-image: url(../images/slides/bg-slide-sm-12.jpg); } #home-slides .bg-slide-13 { background-image: url(../images/slides/bg-slide-sm-13.jpg); } #home-slides .bg-slide-14 { background-image: url(../images/slides/bg-slide-sm-14.jpg); } #home-slides .bg-slide-15 { background-image: url(../images/slides/bg-slide-sm-15.jpg); } #home-slides .bg-slide-16 { background-image: url(../images/slides/bg-slide-sm-16.jpg); } #home-slides .bg-slide-17 { background-image: url(../images/slides/bg-slide-sm-17.jpg); background-position: left center; } #home-slides .bg-slide-18 { background-image: url(../images/slides/bg-slide-sm-18.jpg); } #home-slides .bg-slide-19 { background-image: url(../images/slides/bg-slide-sm-19.jpg); } #home-slides .bg-slide-20 { background-image: url(../images/slides/bg-slide-sm-20.jpg); } #home-slides .bg-slide-21 { background-image: url(../images/slides/bg-slide-sm-21.jpg); } #home-slides .bg-slide-22 { background-image: url(../images/slides/bg-slide-sm-22.jpg); } #home-slides .bg-slide-23 { background-image: url(../images/slides/bg-slide-sm-23.jpg); } #home-slides .bg-slide-24 { background-image: url(../images/slides/bg-slide-sm-24.jpg); } #home-slides .bg-slide-25 { background-image: url(../images/slides/bg-slide-sm-25.jpg); } #home-slides .bg-slide-26 { background-image: url(../images/slides/bg-slide-sm-26.jpg); } #home-slides .bg-slide-27 { background-image: url(../images/slides/bg-slide-sm-27.jpg); } #home-slides .bg-slide-28 { background-image: url(../images/slides/bg-slide-sm-28.jpg); } #home-slides .bg-slide-29 { background-image: url(../images/slides/bg-slide-sm-29.jpg); } #home-slides .bg-slide-30 { background-image: url(../images/slides/bg-slide-sm-30.jpg); } #home-slides .bg-slide-31 { background-image: url(../images/slides/bg-slide-sm-31.jpg); } #home-slides .bg-slide-32 { background-image: url(../images/slides/bg-slide-sm-32.jpg); } #home-slides .bg-slide-33 { background-image: url(../images/slides/bg-slide-sm-33.jpg); background-position: right center; } #home-slides .bg-slide-34 { background-image: url(../images/slides/bg-slide-sm-34.jpg); } #home-slides .bg-slide-35 { background-image: url(../images/slides/bg-slide-sm-35.jpg); } #home-slides .bg-slide-36 { background-image: url(../images/slides/bg-slide-sm-36.jpg); } #home-slides .bg-slide-37 { background-image: url(../images/slides/bg-slide-sm-37.jpg); } #home-slides .bg-slide-38 { background-image: url(../images/slides/bg-slide-sm-38.jpg); } #home-slides .bg-slide-39 { background-image: url(../images/slides/bg-slide-sm-39.jpg); } #home-slides .bg-slide-40 { background-image: url(../images/slides/bg-slide-sm-40.jpg); } #home-slides .bg-slide-41 { background-image: url(../images/slides/bg-slide-sm-41.jpg); } #home-slides .bg-slide-42 { background-image: url(../images/slides/bg-slide-sm-42.jpg); } #home-slides .bg-slide-43 { background-image: url(../images/slides/bg-slide-sm-43.jpg); } #home-slides .bg-slide-44 { background-image: url(../images/slides/bg-slide-sm-44.jpg); } #home-slides .bg-slide-45 { background-image: url(../images/slides/bg-slide-sm-45.jpg); } #home-slides .bg-slide-46 { background-image: url(../images/slides/bg-slide-sm-46.jpg); } #home-slides .bg-slide-47 { background-image: url(../images/slides/bg-slide-sm-47.jpg); } #home-slides .bg-slide-48 { background-image: url(../images/slides/bg-slide-sm-48.jpg); background-position: left center; } #home-slides .bg-slide-49 { background-image: url(../images/slides/bg-slide-sm-49.jpg); background-position: left center; } #home-slides .bg-slide-50 { background-image: url(../images/slides/bg-slide-sm-50.jpg); } #home-slides .bg-slide-51 { background-image: url(../images/slides/bg-slide-sm-51.jpg); } #home-slides .bg-slide-52 { background-image: url(../images/slides/bg-slide-sm-52.jpg); } #home-slides .bg-slide-53 { background-image: url(../images/slides/bg-slide-sm-53.jpg); } #home-slides .bg-slide-54 { background-image: url(../images/slides/bg-slide-sm-54.jpg); } #home-slides .bg-slide-55 { background-image: url(../images/slides/bg-slide-sm-55.jpg); } #home-slides .bg-slide-56 { background-image: url(../images/slides/bg-slide-sm-56.jpg); } #home-slides .bg-slide-57 { background-image: url(../images/slides/bg-slide-sm-57.jpg); } #home-slides .bg-slide-58 { background-image: url(../images/slides/bg-slide-sm-58.jpg); } } /* on odd screens, adjust image position */ @media only screen and (max-height: 640px) and (min-width: 640px) { #home-slides .bg-slide-33 { background-position: center -75px; } } @media only screen and (max-height: 640px) and (min-width: 1000px) { #home-slides .bg-slide-16 { background-position: center -140px; } #home-slides .bg-slide-17 { background-position: center -140px; } #home-slides .bg-slide-27 { background-position: center -180px; } #home-slides .bg-slide-35 { background-position: center -100px; } #home-slides .bg-slide-36 { background-position: center -100px; } } @media only screen and (max-height: 640px) and (min-width: 1200px) { #home-slides .bg-slide-03 { background-position: center -220px; } #home-slides .bg-slide-05 { background-position: center -180px; } #home-slides .bg-slide-13 { background-position: center -200px; } #home-slides .bg-slide-14 { background-position: center -200px; } #home-slides .bg-slide-15 { background-position: center -170px; } #home-slides .bg-slide-16 { background-position: center -170px; } #home-slides .bg-slide-17 { background-position: center -170px; } #home-slides .bg-slide-18 { background-position: center -170px; } #home-slides .bg-slide-19 { background-position: center -170px; } #home-slides .bg-slide-21 { background-position: center -180px; } #home-slides .bg-slide-25 { background-position: center -320px; } #home-slides .bg-slide-27 { background-position: center -220px; } #home-slides .bg-slide-31 { background-position: center -200px; } #home-slides .bg-slide-33 { background-position: center -200px; } #home-slides .bg-slide-35 { background-position: center -170px; } #home-slides .bg-slide-36 { background-position: center -170px; } #home-slides .bg-slide-38 { background-position: center -200px; } #home-slides .bg-slide-39 { background-position: center -190px; } #home-slides .bg-slide-41 { background-position: center -200px; } #home-slides .bg-slide-42 { background-position: center -200px; } } @media only print { #home-slides .homeSlide.bg-slide-05, #home-slides .homeSlide.bg-slide-13, #home-slides .homeSlide.bg-slide-14, #home-slides .homeSlide.bg-slide-15, #home-slides .homeSlide.bg-slide-16, #home-slides .homeSlide.bg-slide-17, #home-slides .homeSlide.bg-slide-18, #home-slides .homeSlide.bg-slide-19, #home-slides .homeSlide.bg-slide-20, #home-slides .homeSlide.bg-slide-21, #home-slides .homeSlide.bg-slide-22, #home-slides .homeSlide.bg-slide-31, #home-slides .homeSlide.bg-slide-33, #home-slides .homeSlide.bg-slide-35, #home-slides .homeSlide.bg-slide-36, #home-slides .homeSlide.bg-slide-37, #home-slides .homeSlide.bg-slide-38, #home-slides .homeSlide.bg-slide-39, #home-slides .homeSlide.bg-slide-41, #home-slides .homeSlide.bg-slide-42, #home-slides .homeSlide.bg-slide-44, #home-slides .homeSlide.bg-slide-49, #home-slides .homeSlide.bg-slide-53, #home-slides .homeSlide.bg-slide-55, #home-slides .homeSlide.bg-slide-58, #home-slides .homeSlide.bg-slide-56 { background-position: center top !important; } } /* ---------------------------------------------------------------------------------------------- */ /* slide blurbs: the semi-transparent black box on top of the slide with text */ /* text box positioning on top of slides: 4 options -- top left, top right, bottom left, bottom right */ #home-slides .slide-blurb { position: absolute; } #home-slides .slide-blurb { padding: 30px; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjciLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjciLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==); background: -moz-linear-gradient(top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.7) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.7)), color-stop(100%,rgba(0,0,0,0.7))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#b3000000',GradientType=0 ); /* IE6-8 */ text-align: left; } .ie9 #home-slides .slide-blurb { filter: none; } #home-slides .slide-blurb p { margin: 0; max-width: 300px; font-size: 1.5em; line-height: 1.25em; color: #fff; } #home-slides .slide-blurb.imgSlideTextPos1 { top: 20px; left: 20px; } /* tl */ #home-slides .slide-blurb.imgSlideTextPos2 { top: 20px; right: 20px; } /* tr */ #home-slides .slide-blurb.imgSlideTextPos3 { bottom: 50px; left: 20px; } /* bl */ #home-slides .slide-blurb.imgSlideTextPos4 { bottom: 50px; right: 20px; } /* br */ @media only screen and (max-width: 1024px) { #home-slides .slide-blurb p { font-size: 1.25em; max-width: 250px; } #home-slides .slide-blurb.imgSlideTextPos1 { top: 20px; left: 15px; } /* tl */ #home-slides .slide-blurb.imgSlideTextPos2 { top: 20px; right: 15px; } /* tr */ #home-slides .slide-blurb.imgSlideTextPos3 { bottom: 50px; left: 15px; } /* bl */ #home-slides .slide-blurb.imgSlideTextPos4 { bottom: 50px; right: 15px; } /* br */ } @media only screen and (max-width: 768px) { #home-slides .slide-blurb p { font-size: 1em; line-height: 1.4em; max-width: 200px; } #home-slides .slide-blurb.imgSlideTextPos1 { top: 20px; left: 15px; } /* tl */ #home-slides .slide-blurb.imgSlideTextPos2 { top: 20px; right: 15px; } /* tr */ #home-slides .slide-blurb.imgSlideTextPos3 { bottom: 50px; left: 15px; } /* bl */ #home-slides .slide-blurb.imgSlideTextPos4 { bottom: 50px; right: 15px; } /* br */ } @media only screen and (max-width: 640px) { #home-slides .slide-blurb { padding: 20px; } } @media only screen and (max-height: 700px) { #home-slides .slide-blurb p { font-size: 1em; line-height: 1.2em; } } @media only screen and (max-width: 480px) { /* all are changed to just a strip at the bottom */ #home-slides .slide-blurb p { font-size: .95em; max-width: 100%; padding: 6px 10px; } #home-slides .slide-blurb.imgSlideTextPos1, #home-slides .slide-blurb.imgSlideTextPos2, #home-slides .slide-blurb.imgSlideTextPos3, #home-slides .slide-blurb.imgSlideTextPos4 { top: auto; bottom: 37px; left: 0; right: 0; } #home-slides .slide-blurb { padding: 0; width: 100%; } } @media only print { /* all are changed to just a strip at the bottom */ #home-slides .slide-blurb p { font-size: .95em; max-width: 100%; padding: 6px 10px; } #home-slides .slide-blurb.imgSlideTextPos1, #home-slides .slide-blurb.imgSlideTextPos2, #home-slides .slide-blurb.imgSlideTextPos3, #home-slides .slide-blurb.imgSlideTextPos4 { top: auto; bottom: 37px; left: 0; right: 0; } #home-slides .slide-blurb { padding: 0; width: 100%; } } /* first slide (00): same on all sites except for the name */ #home-slides .homeSlide00 { background-color: #ede1b9; } #home-slides .homeSlide.homeSlide00 img, #home-slides .homeSlide.homeSlide00 p { font-size: 5em; line-height: 1em; color: #000; } #home-slides .homeSlide.homeSlide00 p { margin-top: -.35em; max-width: 100%; } #home-slides .homeSlide.homeSlide00 p span { font-size: .5em; line-height: .5em; text-transform: uppercase; } #home-slides .homeSlide.homeSlide00 .slide-title { display: table; table-layout: fixed; width: 100%; height: 100%; } #home-slides .homeSlide.homeSlide00 .slide-title-row { display: table-row; height: 100%; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell { display: table-cell; padding: 0 20px; height: 100%; text-align: center; vertical-align: middle; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell .slide-title-blurb p { margin: auto; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell.slide-logo { width: 40%; } #home-slides .homeSlide.homeSlide00 .slide-logo img { max-width: 100%; max-height: 90%; } #home-slides .homeSlide.homeSlide00 .slide-logo img.sl-lg { display: inline-block !important; } #home-slides .homeSlide.homeSlide00 .slide-logo img.sl-sm { display: none !important; } @media only screen and (max-width: 1024px) { #home-slides .homeSlide.homeSlide00 img, #home-slides .homeSlide.homeSlide00 p { font-size: 4.25em; } } @media only screen and (max-width: 768px) { #home-slides .homeSlide.homeSlide00 img, #home-slides .homeSlide.homeSlide00 p { font-size: 4em; } } @media only screen and (max-width: 700px) { #home-slides .homeSlide.homeSlide00 img, #home-slides .homeSlide.homeSlide00 p { font-size: 3.75em; } } @media only screen and (max-width: 640px) { #home-slides .homeSlide.homeSlide00 .slide-title { display: table; } #home-slides .homeSlide.homeSlide00 .slide-title-row { display: table-cell; vertical-align: middle; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell { display: block; padding: 0 !important; width: 100%; height: auto; text-align: center; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell.slide-logo { margin-top: 0; width: 100%; height: auto; } #home-slides .homeSlide.homeSlide00 img, #home-slides .homeSlide.homeSlide00 p { padding: 0; font-size: 4em; margin-top: 0 !important; text-align: center; } #home-slides .homeSlide.homeSlide00 .slide-logo img { max-width: 95%; max-height: 100%; } #home-slides .homeSlide.homeSlide00 .slide-logo img.sl-lg { display: none !important; } #home-slides .homeSlide.homeSlide00 .slide-logo img.sl-sm { display: inline-block !important; } #home-slides .homeSlide.homeSlide00 strong, #home-slides .homeSlide.homeSlide00 p span { display: none; } } @media only screen and (max-height: 700px) { #home-slides .homeSlide00 { font-size: 90%; } #home-slides .homeSlide.homeSlide00 p { margin-top: -1em; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell { padding: 0 10px; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell.slide-logo img { max-height: 320px; } } @media only screen and (max-height: 600px) { #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell p { text-align: center; } #home-slides .homeSlide.homeSlide00 p span { display: none; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell.slide-logo img { margin-top: -1em; max-width: 90%; max-height: 240px; } #home-slides .homeSlide.homeSlide00 .slide-logo img.sl-lg { display: none !important; } #home-slides .homeSlide.homeSlide00 .slide-logo img.sl-sm { display: inline-block !important; } } @media only screen and (max-height: 500px) and (max-width: 640px) { #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell.slide-logo img { max-height: 150px; } } @media only screen and (max-height: 500px) { #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell.slide-logo img, #home-slides .homeSlide.homeSlide00 p { font-size: 3.5em; } } @media only screen and (max-width: 480px) { #home-slides .homeSlide.homeSlide00 img, #home-slides .homeSlide.homeSlide00 p { font-size: 2.5em; margin-top: 1em; } #home-slides .homeSlide.homeSlide00 img { height: 150px !important; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell.slide-logo {} } @media only print { #home-slides .homeSlide.homeSlide00 img, #home-slides .homeSlide.homeSlide00 p { font-size: 5em; margin-top: 1em; } #home-slides .homeSlide.homeSlide00 img { height: 150px !important; } #home-slides .homeSlide.homeSlide00 .slide-title .slide-title-cell.slide-logo { width: 30%; text-align: right; } } @media only screen and (min-width: 769px) { #home-slides .homeSlide00 { background-image: url(../images/slides/bg-slide00.jpg); } } @media only print, only screen and (min-width: 480px) and (max-width: 768px) { #home-slides .homeSlide00 { background-image: url(../images/slides/bg-slide00-med.jpg); } } @media only print, only screen and (min-width: 480px) and (max-height: 480px) { #home-slides .homeSlide00 { background-image: url(../images/slides/bg-slide00-sm.jpg); } } @media only print, only screen and (max-width: 479px) { #home-slides .homeSlide00 { background-image: url(../images/slides/bg-slide00-sm.jpg); } } /* ///// MAKING A DIFFERENCE ////////////////////////////////////////////////////////// */ #difference .icon-blurbs p { font-size: 1.125em; line-height: 1.2em; color: #262626; } #difference .pxc-2col.icon-blurbs p { margin: 1em 0 2em 0; } #difference .pxc-4col.icon-blurbs p { margin: 1em 1em 2em 1em; } @media only screen and (max-width: 980px) { #difference .pxc-2col.icon-blurbs p { font-size: 1em; } } @media only screen and (max-width: 767px) { #difference .pxc-2col.icon-blurbs p { font-size: 1.125em; margin: 1em 1.5em 2em 1.5em; } } @media only screen and (max-width: 640px) { #difference .pxc-2col.icon-blurbs p { font-size: 1em; margin: 1em 1em 2em 1em; } #difference .pxc-4col.icon-blurbs p { font-size: 1em; } } @media only screen and (max-width: 480px) { #difference .pxc-2col.icon-blurbs p { margin: 1em 0 2em 0; } #difference .pxc-4col.icon-blurbs p { margin: 1em 0 2em 0; } } .diff-3col { width: 100%; height: 100%; border-collapse: collapse; } .diff-3col td { padding: 0; width: 33%; height: 50%; vertical-align: middle; background-position: center center; background-repeat: no-repeat; background-size: cover; } .diff-3col td.diff-td-02 { border-left: 1px solid #fff; border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .diff-3col td.diff-td-03 { border-bottom: 1px solid #fff; } .diff-3col td.diff-td-04 { padding: 10px 40px; font-size: 1.25em; color: #fff; background: #ee1d23; border-left: 1px solid #fff; border-right: 1px solid #fff; } @media only screen and (max-width: 980px) { .diff-3col td.diff-td-04 { padding: 10px 30px; font-size: 1em; } } @media only screen and (max-width: 767px) { .diff-3col td { width: 50%; } .diff-3col td.diff-td-01 { display: none; } #difference .pxc-4col .pxc-td { float: left; width: 42% !important; margin: 0 4%; padding: 0; vertical-align: top; } } @media only screen and (max-width: 640px) { .diff-3col td.diff-td-04 { padding: 5px 10px; } } @media only screen and (max-width: 480px) { .diff-3col td.diff-td-04 { padding: 5px 15px; } .diff-3col td { width: 100%; } .diff-3col td.diff-td-03, .diff-3col td.diff-td-05 { display: none; } #difference .pxc-4col .pxc-td { float: left; width: 46% !important; margin: 0 2%; padding: 0; vertical-align: top; } } @media only screen and (max-height: 640px) { .diff-3col td.diff-td-04 { padding-top: 5px; padding-bottom: 5px; font-size: 1em; } } @media only screen and (max-height: 480px) { .diff-3col td.diff-td-04 { padding-top: 0; padding-bottom: 0; font-size: .9em; } } @media only screen and (max-height: 420px) { .diff-3col tr.diff-tr-01 { display: none; } #diff.px-gap-60 { height: auto; min-height: 100px; } } @media print { #difference .icon-blurbs img { height: 50px; } .diff-3col td.diff-td-04 { padding: 0 10px; font-size: 1em; } } /* android wouldn't adjust properly on rotate, so this fixes it */ @media screen and (orientation: portrait) { .android #diff { max-height: 300px; } .android .diff-tt-01, .android .diff-td-01, .android .diff-td-02, .android .diff-td-03 { display: none; } .android .diff-td-04, .android .diff-td-05 { height: 100%; } } #diff { background-color: #dea057; } /* other bg images that fade in and out */ .diff-fades { position: relative; margin: 0; padding: 0; width: 100%; height: 100%; } .diff-fade { position: absolute; top: 0; left: 0; margin: 0; padding: 0; width: 100%; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; } /* background images assigned in index.dpi so they can be dynamic */ /* .diff-3col td.diff-td-01 { background-image: url(../images/diff-01a.jpg); } .diff-3col td.diff-td-02 { background-image: url(../images/diff-02a.jpg); } .diff-3col td.diff-td-03 { background-image: url(../images/diff-03a.jpg); } .diff-3col td.diff-td-05 { background-image: url(../images/diff-05a.jpg); } .diff-td-01 .diff-fade.dfb { background-image: url(../images/diff-01b.jpg); display: none; } .diff-td-01 .diff-fade.dfc { background-image: url(../images/diff-01c.jpg); display: none; } .diff-td-01 .diff-fade.dfd { background-image: url(../images/diff-01d.jpg); display: none; } .diff-td-02 .diff-fade.dfb { background-image: url(../images/diff-02b.jpg); display: none; } .diff-td-02 .diff-fade.dfc { background-image: url(../images/diff-02c.jpg); display: none; } .diff-td-02 .diff-fade.dfd { background-image: url(../images/diff-02d.jpg); display: none; } .diff-td-03 .diff-fade.dfb { background-image: url(../images/diff-03b.jpg); display: none; } .diff-td-03 .diff-fade.dfc { background-image: url(../images/diff-03c.jpg); display: none; } .diff-td-03 .diff-fade.dfd { background-image: url(../images/diff-03d.jpg); display: none; } .diff-td-05 .diff-fade.dfb { background-image: url(../images/diff-05b.jpg); display: none; } .diff-td-05 .diff-fade.dfc { background-image: url(../images/diff-05c.jpg); display: none; } .diff-td-05 .diff-fade.dfd { background-image: url(../images/diff-05d.jpg); display: none; } */ .diff-td-01 .diff-fade.dfb, .diff-td-01 .diff-fade.dfc, .diff-td-01 .diff-fade.dfd, .diff-td-02 .diff-fade.dfb, .diff-td-02 .diff-fade.dfc, .diff-td-02 .diff-fade.dfd, .diff-td-03 .diff-fade.dfb, .diff-td-03 .diff-fade.dfc, .diff-td-03 .diff-fade.dfd, .diff-td-05 .diff-fade.dfb, .diff-td-05 .diff-fade.dfc, .diff-td-05 .diff-fade.dfd { display: none; } @media only screen and (max-width: 655px) { .diff-fades { display: none; } } @media only screen and (max-height: 655px) { .diff-fades { display: none; } } /* ///// HOW IT WORKS ///////////////////////////////////////////////////////////////// */ .how-6col { display: table; border-collapse: separate; border-spacing: 4px; } .how-tr { display: table-row; } .how-td { display: table-cell; background: #f2f2f2; } .how-img { height: 200px; background-position: center center; background-repeat: no-repeat; } .how-td-01 .how-img { background-image: url(../images/how-01.jpg); } .how-td-02 .how-img { background-image: url(../images/how-02.jpg); } .how-td-03 .how-img { background-image: url(../images/how-03.jpg); } .how-td-04 .how-img { background-image: url(../images/how-04.jpg); } .how-td-05 .how-img { background-image: url(../images/how-05.jpg); } .how-td-06 .how-img { background-image: url(../images/how-06.jpg); } .how-num { padding: 5px; font-size: 6.25em; line-height: .75em; color: #c0c0c0; } .how-txt { padding: 5px 10px; font-size: .875em; color: #464646; } /* 1 column */ @media only screen and (max-width: 400px) { .how-img { height: 150px; } .how-num { font-size: 4em; } .how-table { display: block; border-spacing: 0; } .how-tr { display: block; } .how-td { display: block; padding: 0 0 15px 0; margin: 4px 0; } .how-tr-02, .how-tr-03 { display: none; } } /* 2 column */ @media only screen and (min-width: 401px) and (max-width: 600px) { .how-img { height: 150px; } .how-num { font-size: 4em; } .how-td { padding: 0 0 25px 0; width: 50%; } .how-tr-01 .how-td-03, .how-tr-01 .how-td-04, .how-tr-01 .how-td-05, .how-tr-01 .how-td-06, .how-tr-02 .how-td-05, .how-tr-02 .how-td-06 { display: none; } } /* 3 column */ @media only screen and (min-width: 601px) and (max-width: 900px) { .how-td { padding: 0 0 35px 0; width: 33%; } .how-tr-01 .how-td-04, .how-tr-01 .how-td-05, .how-tr-01 .how-td-06, .how-tr-02 .how-td-03, .how-tr-03 { display: none; } } /* 6 column */ @media only print, only screen and (min-width: 901px){ .how-td { padding: 0 0 35px 0; width: 16%; } .how-tr-02, .how-tr-03 { display: none; } } /* ///// LOCATIONS //////////////////////////////////////////////////////////////////// */ #locations { padding: 1em 0 0 0; } @media only screen { #locations { box-shadow: 0 15px 10px -5px rgba(0, 0, 0, 0.25); border-bottom: 14px solid #ee1d23; } .safari.windows .px-content#locations { -webkit-box-shadow: 0 15px 10px -5px rgba(0, 0, 0, .15); -moz-box-shadow: 0 15px 10px -5px rgba(0, 0, 0, .15); box-shadow: 0 15px 10px -5px rgba(0, 0, 0, .15); } } #locations .pxc-sizer { padding: 0; } #locations .map-tab { overflow: hidden; margin: 0 auto; height: 24px; text-align: center; white-space: nowrap; } #locations .map-tab .mtl, #locations .map-tab .mtr { display: inline-block; margin: 0; padding: 0; width: 0; height: 0; border-style: solid; } #locations .map-tab .mtl { border-width: 0 0 24px 24px; border-color: transparent transparent #ee1d23 transparent; -moz-transform: scale(.9999) } #locations .map-tab .mtr { border-width: 24px 0 0 24px; border-color: transparent transparent transparent #ee1d23; -moz-transform: scale(.9999) } #locations .map-tab .mtc { position: relative; top: -6px; display: inline-block; margin: 0; padding: 0 1em; min-width: 50%; height: 26px; line-height: 24px; color: #fff; background: #ee1d23; text-align: center; } #locations .map-tab .mtc a { display: inline-block; padding-right: 15px; background: url(../images/icon-offsite.png) right center no-repeat; } #locations .map-tab .mtc a:link, #locations .map-tab .mtc a:visited { color: #fff; text-decoration: none; } #locations .map-tab .mtc a:active, #locations .map-tab .mtc a:hover { color: #fff; text-decoration: underline; } @media only screen and (max-width: 767px) { #locations .map-tab .mtc { top: -7px; padding: 0 5px; } } @media only screen and (max-width: 640px) { #locations .map-tab .text-long { display: none; } } @media only screen and (max-width: 480px) { #locations .map-tab .mtl, #locations .map-tab .mtr { display: none; } #locations .map-tab .mtc { top: 0; padding: 3px 0; height: auto; width: 100%; min-width: 100%; line-height: 1.1em; } #locations .map-tab { height: auto; white-space: normal; } #locations .map-tab .mtc a {padding: 0 15px 2px 5px; background-image: none; } #locations { border: 0; } } @media only print { #locations { page-break-inside: avoid; } #locations .map-tab .mtc { top: -9px; } } #dmap { background-color: #e9e5dc; } /* #dmap iframe { display: none; */ /* only turn on if api map is not supported */ /* width: 100%; height: 100%; border: 0 !important; } */ #dmap #non-map { display: none; /* only turn on if api map is not supported */ } #dmap #map-canvas { margin: 0; padding: 0; width: 100%; height: 100%; } /* .no-google-map #dmap iframe { display: block; } */ .no-google-map #dmap #non-map { display: block; } .no-google-map #dmap #map-canvas { display: none; } .gm-style { font-family: inherit !important; } @media only print { #dmap { display: none; } } /* ///// HISTORY ////////////////////////////////////////////////////////////////////// */ #history .partners img { margin: 0 35px 10px 0; } #history .logo-angeltree { margin: 0 0 15px 55px; max-width: 35%; } #history .partners-box { float: left; width: 46%; } #history .partners-box ul { font-size: 1.25em; } #history .partners-box#corp-partners { margin-right: 7%; } #history .partner-wrap { opacity: 0; visibility: hidden; } @media only screen and (max-width: 767px) { #history .partners img { margin: 0 15px 10px 15px; } /*#partner-logos { text-align: center; }*/ } @media only screen and (max-width: 640px) { #history .logo-angeltree { margin: 0 0 15px 25px; max-width: 35%; } #history .partners-box { float: none; width: 100%; } #history .partners-box#corp-partners { margin-right: 0; } #history .partner-wrap { display: none; } } @media print { #history .logo-angeltree { width: 200px; } #history #partners h2 { margin-top: 50px; } } /* ///// ADOPT //////////////////////////////////////////////////////////////////////// */ #adopt { text-align: center; background-color: #ee1d23; box-shadow: none; } @media print { #adopt { background-color: #f7f7f7; } } /* we can't actually hide it b/c that screws with the menu script, so sorta hide it */ #adopt.hideish { padding: 0; background-color: #fff; } #adopt.hideish .pxc-sizer { display: none; } /* ///// print basics ///////////////////////////////////////////////////////////////// */ @media print { /* when modals are open */ .modal-open #fixed-bgs, .modal-open #nonfixed { display: none; } }