/* jQuery Coda-Slider v2.0 - http://www.ndoherty.biz/coda-slider Copyright (c) 2009 Niall Doherty This plugin available for use in all personal or commercial projects under both MIT and GPL licenses. */ /* Most common stuff you'll need to change */ a {-moz-outline: none 0; outline: none 0;} /* INDEX PAGES - TOP MENU FOR NEW LAYOUT */ #header-menu-tabs { position: relative; float: left; left: -15px; top: 100px; } #header-menu-tabs ul { list-style: none; } #header-menu-tabs li { display: inline; } #header-menu-tabs li a { display: block; width: 138px; height: 35px; text-indent: -9999px; background: url(../images/index-menu.png) no-repeat ; z-index: 20; float: left; border: none; padding: 0; margin-left: 0px; } #header-menu-tabs li a#display:hover { background-position: 0px 0px; height:38px; } #header-menu-tabs li a#display-ON { background-position: 0px 0px; } #header-menu-tabs li a#display { background-position: 0px -38px; } #header-menu-tabs li a#signage:hover { background-position: -138px 0px; height:38px; } #header-menu-tabs li a#signage-ON { background-position: -138px 0px; } #header-menu-tabs li a#signage { background-position: -138px -38px; } #header-menu-tabs li a#print:hover { background-position: -276px 0px; height:38px; } #header-menu-tabs li a#print-ON { background-position: -276px 0px; } #header-menu-tabs li a#print { background-position: -276px -38px; } #header-menu-tabs li a#design:hover { background-position: -414px 0px; height:38px; } #header-menu-tabs li a#design-ON { background-position: -414px 0px; } #header-menu-tabs li a#design { background-position: -414px -38px; } #header-menu-tabs li a#contact:hover { background-position: -552px 0px; height:38px; } #header-menu-tabs li a#contact-ON { background-position: -552px 0px; } #header-menu-tabs li a#contact { background-position: -552px -38px; } /* POSITION OF SPRITE IMAGE SLIDER - change height if getting scrollbars on slider - height 175px cause scrollbars in Chrome but not in Firefox or IE - Height 180px works in chrome IE firefox */ .coda-slider-wrapper { padding: 0px; margin-bottom: 0px; -moz-border-radius: 0px; -webkit-border-radius: 5px; overflow: hidden; position: absolute; top:160px; height: 180px; } /* Use this to keep the slider content contained in a box even when JavaScript is disabled */ .coda-slider-no-js .coda-slider { height: 150px; overflow: auto !important;} /* Change the width of the entire slider (without dynamic arrows) */ .coda-slider { width: 798px; padding: 0px; float: left; overflow: hidden; top:14px; background-color: white; border: 1px solid #ffffff; border-top: 0px; } /* Positions the Slide Gallery */ .panel { width: 805px; padding: 0px; float: left; margin: 0px; } .coda-slider-nav-margin { margin: 0px 80px; } /* Panel padding */ .coda-slider .panel-wrapper { padding: 0px; margin: 0px; } /* Preloader */ .coda-slider p.loading { padding: 0px; text-align: center; } /* Arrow styling GREEN EXHIBITION DISPLAY */ .coda-nav-left-green a { background: url(../images/slider-arrow-left-green.png) no-repeat; width: 73px; height: 110px; text-indent: -9999px; cursor: pointer; position: absolute; left: 15px; top: 40px; } .coda-nav-left-green a:hover { background: url(../images/slider-arrow-left-ro.png) no-repeat; width: 73px; height: 110px; text-indent: -9999px; cursor: pointer; } .coda-nav-right-green a { background: url(../images/slider-arrow-right-green.png) no-repeat; width: 73px; height: 110px; text-indent: -9999px; cursor: pointer; position: absolute; left: 887px; top: 40px; } .coda-nav-right-green a:hover { background: url(../images/slider-arrow-right-ro.png) no-repeat; width: 73px; height: 110px; text-indent: -9999px; cursor: pointer; } /* exhibition display coda slider navigation */ #nav-main-display { margin: 0px; padding: 0px; background: none; } #nav-main-display li { display: inline;} #nav-main-display li a { display: block; width: 160px; height: 140px; background: url(../images/index-display-sprite.jpg); float: left; border-right: 0px solid #5c5c5c; padding: 0; } #nav-main-display a#nav-banner-stands { background-position: 0px 140px; } #nav-main-display li.nav-active a#nav-banner-stands { background-position: 0px 280px; } #nav-main-display li a#nav-banner-stands:hover { background-position: 0px 420px; } #nav-main-display a#nav-pop-up { background-position: -160px 140px; } #nav-main-display li.nav-active a#nav-pop-up { background-position: -160px 280px; } #nav-main-display li a#nav-pop-up:hover { background-position: -160px 420px; } #nav-main-display a#nav-replace-graphic { background-position: -320px 140px; } #nav-main-display li.nav-active a#nav-replace-graphic { background-position: -320px 280px; } #nav-main-display li a#nav-replace-graphic:hover { background-position: -320px 420px; } #nav-main-display a#nav-custom-portable { background-position: -480px 140px; } #nav-main-display li.nav-active a#nav-custom-portable { background-position: -480px 280px; } #nav-main-display li a#nav-custom-portable:hover { background-position: -480px 420px; } #nav-main-display a#nav-custom-modular { background-position: -640px 140px; } #nav-main-display li.nav-active a#nav-custom-modular { background-position: -640px 280px; } #nav-main-display li a#nav-custom-modular:hover { background-position: -640px 420px; } #nav-main-display a#nav-literature { background-position: -800px 140px; } #nav-main-display li.nav-active a#nav-literature { background-position: -800px 280px; } #nav-main-display li a#nav-literature:hover { background-position: -800px 420px; } #nav-main-display a#nav-retail { background-position: -960px 140px; } #nav-main-display li.nav-active a#nav-retail { background-position: -960px 280px; } #nav-main-display li a#nav-retail:hover { background-position: -960px 420px; } #nav-main-display a#nav-counters { background-position: -1120px 140px; } #nav-main-display li.nav-active a#nav-counters { background-position: -1120px 280px; } #nav-main-display li a#nav-counters:hover { background-position: -1120px 420px; } #nav-main-display a#nav-kiosks { background-position: -1280px 140px; } #nav-main-display li.nav-active a#nav-kiosks { background-position: -1280px 280px; } #nav-main-display li a#nav-kiosks:hover { background-position: -1280px 420px; } #nav-main-display a#nav-audio-visual { background-position: -1440px 140px; } #nav-main-display li.nav-active a#nav-audio-visual { background-position: -1440px 280px; } #nav-main-display li a#nav-audio-visual:hover { background-position: -1440px 420px; } #nav-main-display a#nav-folding-panel { background-position: -1600px 140px; } #nav-main-display li.nav-active a#nav-folding-panel { background-position: -1600px 280px; } #nav-main-display li a#nav-folding-panel:hover { background-position: -1600px 420px; } #nav-main-display a#nav-rentals { background-position: -1760px 140px; } #nav-main-display li.nav-active a#nav-rentals { background-position: -1760px 280px; } #nav-main-display li a#nav-rentals:hover { background-position: -1760px 420px; } #nav-main-display a#nav-overhead { background-position: -1920px 140px; } #nav-main-display li.nav-active a#nav-overhead { background-position: -1920px 280px; } #nav-main-display li a#nav-overhead:hover { background-position: -1920px 420px; } #nav-main-display a#nav-cases { background-position: -2080px 140px; } #nav-main-display li.nav-active a#nav-cases { background-position: -2080px 280px; } #nav-main-display li a#nav-cases:hover { background-position: -2080px 420px; } #nav-main-display a#nav-eco { background-position: -2240px 140px; } #nav-main-display li.nav-active a#nav-eco { background-position: -2240px 280px; } #nav-main-display li a#nav-eco:hover { background-position: -2240px 420px; } /* Arrow styling CYAN SIGNAGE */ .coda-nav-left-cyan a { background: url(../images/slider-arrow-left-cyan.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; position: absolute; left: 15px; top: 40px; } .coda-nav-left-cyan a:hover { background: url(../images/slider-arrow-left-ro.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; } .coda-nav-right-cyan a { background: url(../images/slider-arrow-right-cyan.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; position: absolute; left: 887px; top: 40px; } .coda-nav-right-cyan a:hover { background: url(../images/slider-arrow-right-ro.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; } /* SIGNAGE slider navigation */ #nav-main-signage { margin: 0px; padding: 0px; background: none; } #nav-main-signage li { display: inline; } #nav-main-signage li a { display: block; width: 160px; height: 140px; background: url(../images/index-signage-sprite.jpg); float: left; border-right: 0px solid #5c5c5c; padding: 0; z-index: 20; } #nav-main-signage a#nav-poster { background-position: 0px 140px; } #nav-main-signage li.nav-active a#nav-poster { background-position: 0px 280px; } #nav-main-signage li a#nav-poster:hover { background-position: 0px 420px; } #nav-main-signage a#nav-outdoor-banners { background-position: -160px 140px; } #nav-main-signage li.nav-active a#nav-outdoor-banners { background-position: -160px 280px; } #nav-main-signage li a#nav-outdoor-banners:hover { background-position: -160px 420px; } #nav-main-signage a#nav-indoor { background-position: -320px 140px; } #nav-main-signage li.nav-active a#nav-indoor { background-position: -320px 280px; } #nav-main-signage li a#nav-indoor:hover { background-position: -320px 420px; } #nav-main-signage a#nav-outdoor-signs { background-position: -480px 140px; } #nav-main-signage li.nav-active a#nav-outdoor-signs { background-position: -480px 280px; } #nav-main-signage li a#nav-outdoor-signs:hover { background-position: -480px 420px; } #nav-main-signage a#nav-pavement { background-position: -640px 140px; } #nav-main-signage li.nav-active a#nav-pavement { background-position: -640px 280px; } #nav-main-signage li a#nav-pavement:hover { background-position: -640px 420px; } #nav-main-signage a#nav-vehicle { background-position: -800px 140px; } #nav-main-signage li.nav-active a#nav-vehicle { background-position: -800px 280px; } #nav-main-signage li a#nav-vehicle:hover { background-position: -800px 420px; } #nav-main-signage a#nav-stickers { background-position: -960px 140px; } #nav-main-signage li.nav-active a#nav-stickers { background-position: -960px 280px; } #nav-main-signage li a#nav-stickers:hover { background-position: -960px 420px; } #nav-main-signage a#nav-crowd-control { background-position: -1120px 140px; } #nav-main-signage li.nav-active a#nav-crowd-control { background-position: -1120px 280px; } #nav-main-signage li a#nav-crowd-control:hover { background-position: -1120px 420px; } /* Arrow styling ORANGE PRINT */ .coda-nav-left-orange a { background: url(../images/slider-arrow-left-orange.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; position: absolute; left: 15px; top: 40px; } .coda-nav-left-orange a:hover { background: url(../images/slider-arrow-left-ro.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; } .coda-nav-right-orange a { background: url(../images/slider-arrow-right-orange.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; position: absolute; left: 887px; top: 40px; } .coda-nav-right-orange a:hover { background: url(../images/slider-arrow-right-ro.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; } /* PRINT Slider navigation */ #nav-main-print { margin: 0px; padding: 0px; background: none; } #nav-main-print li { display: inline; } #nav-main-print li a { display: block; width: 160px; height: 140px; background: url(../images/index-print-sprite.jpg); float: left; border-right: 0px solid #5c5c5c; padding: 0; z-index: 20; } #nav-main-print a#nav-stationery { background-position: 0px 140px; } #nav-main-print li.nav-active a#nav-stationery { background-position: 0px 280px; } #nav-main-print li a#nav-stationery:hover { background-position: 0px 420px; } #nav-main-print a#nav-promo-lit { background-position: -160px 140px; } #nav-main-print li.nav-active a#nav-promo-lit { background-position: -160px 280px; } #nav-main-print li a#nav-promo-lit:hover { background-position: -160px 420px; } #nav-main-print a#nav-pos { background-position: -320px 140px; } #nav-main-print li.nav-active a#nav-pos { background-position: -320px 280px; } #nav-main-print li a#nav-pos:hover { background-position: -320px 420px; } #nav-main-print a#nav-merchandise { background-position: -480px 140px; } #nav-main-print li.nav-active a#nav-merchandise { background-position: -480px 280px; } #nav-main-print li a#nav-merchandise:hover { background-position: -480px 420px; } #nav-main-print a#nav-speciality { background-position: -640px 140px; } #nav-main-print li.nav-active a#nav-speciality { background-position: -640px 280px; } #nav-main-print li a#nav-speciality:hover { background-position: -640px 420px; } #nav-main-print a#nav-large-format { background-position: -800px 140px; } #nav-main-print li.nav-active a#nav-large-format { background-position: -800px 280px; } #nav-main-print li a#nav-large-format:hover { background-position: -800px 420px; } /* Arrow styling PURPLE DESIGN */ .coda-nav-left-purple a { background: url(../images/slider-arrow-left-purple.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; position: absolute; left: 15px; top: 40px; } .coda-nav-left-purple a:hover { background: url(../images/slider-arrow-left-ro.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; } .coda-nav-right-purple a { background: url(../images/slider-arrow-right-purple.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; position: absolute; left: 887px; top: 40px; } .coda-nav-right-purple a:hover { background: url(../images/slider-arrow-right-ro.png) no-repeat; width: 46px; height: 46px; text-indent: -9999px; cursor: pointer; } /* DESIGN Slider navigation */ #nav-main-design { margin: 0px; padding: 0px; background: none; } #nav-main-design li { display: inline; } #nav-main-design li a { display: block; width: 160px; height: 140px; background: url(../images/index-design-sprite.jpg); float: left; border-right: 0px solid #5c5c5c; padding: 0; z-index: 20; } #nav-main-design a#nav-id { background-position: 0px 140px; } #nav-main-design li.nav-active a#nav-id { background-position: 0px 280px; } #nav-main-design li a#nav-id:hover { background-position: 0px 420px; } #nav-main-design a#nav-design-print { background-position: -160px 140px; } #nav-main-design li.nav-active a#nav-design-print { background-position: -160px 280px; } #nav-main-design li a#nav-design-print:hover { background-position: -160px 420px; } #nav-main-design a#nav-design-display { background-position: -320px 140px; } #nav-main-design li.nav-active a#nav-design-display { background-position: -320px 280px; } #nav-main-design li a#nav-design-display:hover { background-position: -320px 420px; } #nav-main-design a#nav-marketing { background-position: -480px 140px; } #nav-main-design li.nav-active a#nav-marketing { background-position: -480px 280px; } #nav-main-design li a#nav-marketing:hover { background-position: -480px 420px; }