/* The Nivo Slider styles */ /*.nivoSlider{ position:relative; margin: auto; height: 100%; background:url(../img/shortcodes/loading.gif) no-repeat 50% 50%; } .nivoSlider img { position:absolute; top:0px; left:0px; display:none; } .nivoSlider a.nivo-imageLink { position:absolute; top:0px; left:0px; width:100%; height:100%; border:0; padding:0; margin:0; z-index:6; display:none; } .nivo-slice { display:block; position:absolute; z-index:5; height:100%; } .nivo-box { display:block; position:absolute; z-index:5; } .nivo-caption { position:absolute; left:0px; bottom:0px; background:#000; color:#fff; opacity:0.8; width:100%; z-index:8; } .nivo-caption p { padding:5px; margin:0; } .nivo-caption a { display:inline !important; } .nivo-html-caption { display:none; } .nivo-directionNav{ position:absolute; top: 40%; left:0; width: 100%; height:53px; z-index: 10; } .nivo-directionNav a { position:absolute; top: 10%; z-index:9; width:80px; height:90px; cursor:pointer; display:block; background-repeat:no-repeat; } .nivo-directionNav a:hover { -webkit-opacity: .9; -moz-opacity: .9; opacity: .9; } .nivo-prevNav { background-position: left top; left:-27px; } .nivo-nextNav { background-position: right top; right:-27px; }*/ /* * jQuery Nivo Slider v2.7.1 * http://nivo.dev7studios.com * * Copyright 2011, Gilbert Pellegrom * Free to use and abuse under the MIT license. * http://www.opensource.org/licenses/mit-license.php * * March 2010 */ /* The Nivo Slider styles */ .nivoSlider { position:relative; height: 346px; } .nivoSlider img { position:absolute; top:0px; left:0px; } /* If an image is wrapped in a link */ .nivoSlider a.nivo-imageLink { position:absolute; top:0px; left:0px; width:900px; height:346px; border:0; padding:0; margin:0; z-index:6; display:none; } /* The slices and boxes in the Slider */ .nivo-slice { display:block; position:absolute; z-index:5; height:100%; } .nivo-box { display:block; position:absolute; z-index:5; } /* Caption styles */ .nivo-caption { position:absolute; left:0px; bottom:0px; background:#000; color:#fff; opacity:0.8; /* Overridden by captionOpacity setting */ width:100%; z-index:8; } .nivo-caption p { padding:5px; margin:0; } .nivo-caption a { display:inline !important; } .nivo-html-caption { display:none; } /* Direction nav styles (e.g. Next & Prev) */ .nivo-directionNav a { position:absolute; z-index:9; cursor:pointer; text-align: center; text-indent: -9999px; background-repeat: no-repeat; } .nivo-prevNav, .nivo-nextNav{ background-image: url(../img/shortcodes/arrowsAS.png); height: 30px; width: 30px; } .nivo-prevNav { left:0px; background-position: left top; } .nivo-nextNav{ right:0px; background-position: right top; } /* Control nav styles (e.g. 1,2,3...) */ .nivo-controlNav a { position:relative; z-index:9; cursor:pointer; } .nivo-directionNav a:hover { opacity: .8; } .nivo-controlNav a.active { font-weight:bold; } /* AnythingSlider v1.7+ Default (base) theme By Chris Coyier: http://css-tricks.com with major improvements by Doug Neiner: http://pixelgraphics.us/ based on work by Remy Sharp: http://jqueryfordesigners.com/ */ /***************************** SET DEFAULT DIMENSIONS HERE *****************************/ /* change the ID to match your slider */ /* Opera width restriction */ .anythingBase { max-width: 32766px; width: 100%; list-style: none; height: 100%; } /***************** SET COLORS HERE *****************/ /**** Default state (no keyboard focus) ****/ /* slider window - top & bottom borders, default state */ div.anythingSlider .anythingWindow { } /* Navigation buttons, default state */ div.anythingSlider .anythingControls ul a.cur, div.anythingSlider .anythingControls ul a { background: #777; color: #000; } /* start-stop button, stopped, default state */ div.anythingSlider .start-stop { background-color: #040; color: #fff; } /* start-stop button, playing, default state */ div.anythingSlider .start-stop.playing { background-color: #800; } /* start-stop button, default hovered text color (when visible) */ div.anythingSlider .start-stop:hover, div.anythingSlider .start-stop.hover { color: #ddd; } /**** Active State (slider has keyboard focus) ****/ /* slider window - top & bottom borders, active state */ div.anythingSlider.activeSlider .anythingWindow { border-color: #7C9127; } /* Navigation buttons, active state */ div.anythingSlider.activeSlider .anythingControls ul a.cur, div.anythingSlider.activeSlider .anythingControls ul a { background-color: #f0f; } /* start-stop button, stopped, active state */ div.anythingSlider .start-stop { background-color: #080; color: #fff; } /* start-stop button, playing, active state */ div.anythingSlider .start-stop.playing { background-color: #d00; } /* start-stop button, active slider hovered text color (when visible) */ div.anythingSlider .start-stop:hover, div.anythingSlider .start-stop.hover { color: #fff; } /*********************** COMMON SLIDER STYLING ***********************/ /* Overall Wrapper: 45px right & left padding for the arrows, 28px @ bottom for navigation */ div.anythingSlider { display: block; height: 346px; margin: 0 auto; position: relative; } /* anythingSlider viewport window */ div.anythingSlider .anythingWindow { overflow: hidden; position: relative; width: 100%; height: 346px; background: #CCC; background: url(../img/pattern_059.png); border-radius: 4px; box-shadow: 0 0 10px rgba(0, 0, 0, 1); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 1); -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 1); } /* anythingSlider base (original element) */ .anythingBase { background: transparent; list-style: none; position: absolute; overflow: visible !important; top: 0; left: 0; margin: 0; padding: 0; } /* all panels inside the slider */ .anythingBase .panel { background: transparent; display: block; overflow: hidden; float: left; padding: 0; margin: 0; } .anythingBase .panel.vertical { float: none; } /* Navigation Arrows */ div.anythingSlider .arrow { top: 15px; position: absolute; display: block; } div.anythingSlider .arrow a { display: block; height: 30px; width: 30px; text-align: center; outline: 0; background-image: url(../img/shortcodes/arrowsAS.png); background-repeat: no-repeat; } div.anythingSlider .arrow a:hover{ -webkit-opacity: .7; -moz-opacity: .7; opacity: .7; } /* hide text, target the span so IE7 doesn't text-indent the link */ div.anythingSlider .arrow a span { display: block; text-indent: -9999px; } /* back arrow */ div.anythingSlider .back { left: -27px; } div.anythingSlider .back a { background-position: left top; } /*div.anythingSlider .back a:hover, div.anythingSlider .back a.hover { background-position: left -140px; }*/ div.anythingSlider .back.disabled { display: none; } /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */ /* forward arrow */ div.anythingSlider .forward { right: -27px; } div.anythingSlider .forward a { background-position: right top; } /*div.anythingSlider .forward a:hover, div.anythingSlider .forward a.hover { background-position: right -140px; }*/ div.anythingSlider .forward.disabled { display: none; } /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */ /* Navigation Links */ div.anythingSlider .anythingControls { outline: 0; display: none; } div.anythingSlider .anythingControls ul { margin: 0; padding: 0; float: left; } div.anythingSlider .anythingControls ul li { display: inline; } div.anythingSlider .anythingControls ul a { font: 11px/18px Georgia, Serif; display: inline-block; text-decoration: none; padding: 2px 8px; height: 18px; margin: 0 5px 0 0; background-image: url(../images/default.png); background-position: center -288px ; background-repeat: repeat-x; text-align: center; outline: 0; border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; } div.anythingSlider .anythingControls ul a:hover { background-image: none; } /* Navigation size window */ div.anythingSlider .anythingControls .anythingNavWindow { overflow: hidden; float: left; } /* slider autoplay right-to-left, reverse order of nav links to look better */ div.anythingSlider.rtl .anythingControls ul a { float: right; } /* reverse order of nav links */ div.anythingSlider.rtl .anythingControls ul { float: left; } /* move nav link group to left */ div.anythingSlider.rtl .anythingWindow { direction: ltr; unicode-bidi: bidi-override; } /* div.anythingSlider.rtl .start-stop { float: right; } */ /* move start/stop button - in case you want to switch sides */ /* Autoplay Start/Stop button */ div.anythingSlider .start-stop { background-image: url(../images/default.png); background-position: center -288px; background-repeat: repeat-x; padding: 2px 5px; width: 40px; text-align: center; text-decoration: none; float: right; z-index: 100; outline: 0; border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; } /* hide cell shading on hover - makes the button appear to come forward */ div.anythingSlider .start-stop:hover, div.anythingSlider .start-stop.hover { background-image: none; } /* probably not necessary, but added just in case */ div.anythingSlider, div.anythingSlider .anythingWindow, div.anythingSlider .anythingControls ul a, div.anythingSlider .arrow a, div.anythingSlider .start-stop { transition-duration: 0s; -o-transition-duration: 0s; -moz-transition-duration: 0s; -webkit-transition-duration: 0s; } /******************/ /* Content slider */ /******************/ div.anythingSlider .contentSlide img, div.anythingSlider .info_content{ position: absolute; } div.anythingSlider .contentSlide img{ width: 200px; height: 200px; border-radius: 5px; border: 1px solid #999; background: #e7e7e7; padding: 5px; top: 18%; right: 5%; } div.anythingSlider .info_content{ text-shadow: none; top: 5%; left: 5%; width: 60%; color: #333; } div.anythingSlider .info_content h1{ padding-bottom: 20px; } div.anythingSlider .info_content p{ text-align: justify; } div.anythingSlider .info_content .more-link{ margin: 0!important; } /*************/ /* Accordion */ /*************/ ul#accordion-slider{ padding: 0; list-style: none; position: relative; background-color:none; margin: 0 auto; } ul#accordion-slider li{ display: block; overflow: hidden; padding: 0; float: left; width: 229px; } /* STYLES FOR THE IMAGE DESCRIPTIONS IN THE PIECEMAKER IMAGE GALLERY BY MODULARWEB */ headline { display: block; font-size: 20; color: #FFFFFF; } paragraph { display: block; color: #80B2E4; } inline { display: inline; color: #80B2E4; } break { font-size: 7; display:block; }