/* ---------------------------------------------------------------------------------------------- */ /* Rhinestonz - Screen CSS */ /* Note : */ /* - Reset CSS based on Eric Meyer's Reset CSS ver2.0 http://meyerweb.com/eric/tools/css/reset/ */ /* - IE7 : IE7 specific styles exist in screen-ie7.css */ /* - IE8 : IE8 specific styles exist in screen-ie8.css */ /* - IE9 : IE9 specific styles exist in screen-ie9.css */ /* - CSS Grouping Properties Format: */ /* 1. Box: display, float, position, left, top, height, width, etc. */ /* 2. Border: border, border-radius, etc. */ /* 3. Background */ /* 4. Text: font-family, font-size, text-transform, letter-spacing. etc. */ /* 5. Others */ /* ---------------------------------------------------------------------------------------------- */ /* --------------------------------------------------- /* TABLE OF CONTENTS /* --------------------------------------------------- 1. BASE 2. LAYOUT 3. MODULES & COMPONENTS 3.1. Nav 3.1.1. Accessibility Nav 3.1.2. Main Nav 3.1.3. Side Nav 3.1.4. Pagination 3.1.5. Breadcrumb 3.1.6. Main Nav Toggle 3.2. Button 3.3. Icon 3.4. CMS Copy 3.5. Form Elements 3.5.1. Common 3.5.2. Option Item Container 3.5.3. Textbox/area With Inner Label 3.6. Search Bar 3.7. Search Result 3.8. Currency Options 3.9. Nav Cart 3.10. Content Rotator 3.11. Product Tile 3.12. Img Banner 3.13. Aside Text Panel 3.14. Footer Panel 3.15. Logo, Copyright & By Line 3.16. Iconed Link 3.17. Product Filter 3.18. Customer Service 3.19. Product Detail 3.20. Blog Entry 3.21. Blog Comment 3.22. Blog Form 3.23. Social Control Panel 3.24. Shopping Cart 3.25. Overlay Elements 3.26. Table Responsive 4. 3RD PARTY COMPONENTS 5. STATE & UTILITIES /* --------------------------------------------------- /* 1. BASE /* --------------------------------------------------- */ /*! * Font Awesome 4.2.0 by @davegandy - http://fontawesome.io - @fontawesome * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) */ @font-face{font-family:'FontAwesome';src:url('font/fontawesome-webfont.eot?v=4.2.0');src:url('font/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'),url('font/fontawesome-webfont.woff?v=4.2.0') format('woff'),url('font/fontawesome-webfont.ttf?v=4.2.0') format('truetype'),url('font/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571429em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14285714em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14285714em;width:2.14285714em;top:.14285714em;text-align:center}.fa-li.fa-lg{left:-1.85714286em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);-webkit-transform:scale(1, -1);-ms-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\f000"}.fa-music:before{content:"\f001"}.fa-search:before{content:"\f002"}.fa-envelope-o:before{content:"\f003"}.fa-heart:before{content:"\f004"}.fa-star:before{content:"\f005"}.fa-star-o:before{content:"\f006"}.fa-user:before{content:"\f007"}.fa-film:before{content:"\f008"}.fa-th-large:before{content:"\f009"}.fa-th:before{content:"\f00a"}.fa-th-list:before{content:"\f00b"}.fa-check:before{content:"\f00c"}.fa-remove:before,.fa-close:before,.fa-times:before{content:"\f00d"}.fa-search-plus:before{content:"\f00e"}.fa-search-minus:before{content:"\f010"}.fa-power-off:before{content:"\f011"}.fa-signal:before{content:"\f012"}.fa-gear:before,.fa-cog:before{content:"\f013"}.fa-trash-o:before{content:"\f014"}.fa-home:before{content:"\f015"}.fa-file-o:before{content:"\f016"}.fa-clock-o:before{content:"\f017"}.fa-road:before{content:"\f018"}.fa-download:before{content:"\f019"}.fa-arrow-circle-o-down:before{content:"\f01a"}.fa-arrow-circle-o-up:before{content:"\f01b"}.fa-inbox:before{content:"\f01c"}.fa-play-circle-o:before{content:"\f01d"}.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}.fa-refresh:before{content:"\f021"}.fa-list-alt:before{content:"\f022"}.fa-lock:before{content:"\f023"}.fa-flag:before{content:"\f024"}.fa-headphones:before{content:"\f025"}.fa-volume-off:before{content:"\f026"}.fa-volume-down:before{content:"\f027"}.fa-volume-up:before{content:"\f028"}.fa-qrcode:before{content:"\f029"}.fa-barcode:before{content:"\f02a"}.fa-tag:before{content:"\f02b"}.fa-tags:before{content:"\f02c"}.fa-book:before{content:"\f02d"}.fa-bookmark:before{content:"\f02e"}.fa-print:before{content:"\f02f"}.fa-camera:before{content:"\f030"}.fa-font:before{content:"\f031"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-text-height:before{content:"\f034"}.fa-text-width:before{content:"\f035"}.fa-align-left:before{content:"\f036"}.fa-align-center:before{content:"\f037"}.fa-align-right:before{content:"\f038"}.fa-align-justify:before{content:"\f039"}.fa-list:before{content:"\f03a"}.fa-dedent:before,.fa-outdent:before{content:"\f03b"}.fa-indent:before{content:"\f03c"}.fa-video-camera:before{content:"\f03d"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\f03e"}.fa-pencil:before{content:"\f040"}.fa-map-marker:before{content:"\f041"}.fa-adjust:before{content:"\f042"}.fa-tint:before{content:"\f043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}.fa-share-square-o:before{content:"\f045"}.fa-check-square-o:before{content:"\f046"}.fa-arrows:before{content:"\f047"}.fa-step-backward:before{content:"\f048"}.fa-fast-backward:before{content:"\f049"}.fa-backward:before{content:"\f04a"}.fa-play:before{content:"\f04b"}.fa-pause:before{content:"\f04c"}.fa-stop:before{content:"\f04d"}.fa-forward:before{content:"\f04e"}.fa-fast-forward:before{content:"\f050"}.fa-step-forward:before{content:"\f051"}.fa-eject:before{content:"\f052"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-plus-circle:before{content:"\f055"}.fa-minus-circle:before{content:"\f056"}.fa-times-circle:before{content:"\f057"}.fa-check-circle:before{content:"\f058"}.fa-question-circle:before{content:"\f059"}.fa-info-circle:before{content:"\f05a"}.fa-crosshairs:before{content:"\f05b"}.fa-times-circle-o:before{content:"\f05c"}.fa-check-circle-o:before{content:"\f05d"}.fa-ban:before{content:"\f05e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrow-down:before{content:"\f063"}.fa-mail-forward:before,.fa-share:before{content:"\f064"}.fa-expand:before{content:"\f065"}.fa-compress:before{content:"\f066"}.fa-plus:before{content:"\f067"}.fa-minus:before{content:"\f068"}.fa-asterisk:before{content:"\f069"}.fa-exclamation-circle:before{content:"\f06a"}.fa-gift:before{content:"\f06b"}.fa-leaf:before{content:"\f06c"}.fa-fire:before{content:"\f06d"}.fa-eye:before{content:"\f06e"}.fa-eye-slash:before{content:"\f070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}.fa-plane:before{content:"\f072"}.fa-calendar:before{content:"\f073"}.fa-random:before{content:"\f074"}.fa-comment:before{content:"\f075"}.fa-magnet:before{content:"\f076"}.fa-chevron-up:before{content:"\f077"}.fa-chevron-down:before{content:"\f078"}.fa-retweet:before{content:"\f079"}.fa-shopping-cart:before{content:"\f07a"}.fa-folder:before{content:"\f07b"}.fa-folder-open:before{content:"\f07c"}.fa-arrows-v:before{content:"\f07d"}.fa-arrows-h:before{content:"\f07e"}.fa-bar-chart-o:before,.fa-bar-chart:before{content:"\f080"}.fa-twitter-square:before{content:"\f081"}.fa-facebook-square:before{content:"\f082"}.fa-camera-retro:before{content:"\f083"}.fa-key:before{content:"\f084"}.fa-gears:before,.fa-cogs:before{content:"\f085"}.fa-comments:before{content:"\f086"}.fa-thumbs-o-up:before{content:"\f087"}.fa-thumbs-o-down:before{content:"\f088"}.fa-star-half:before{content:"\f089"}.fa-heart-o:before{content:"\f08a"}.fa-sign-out:before{content:"\f08b"}.fa-linkedin-square:before{content:"\f08c"}.fa-thumb-tack:before{content:"\f08d"}.fa-external-link:before{content:"\f08e"}.fa-sign-in:before{content:"\f090"}.fa-trophy:before{content:"\f091"}.fa-github-square:before{content:"\f092"}.fa-upload:before{content:"\f093"}.fa-lemon-o:before{content:"\f094"}.fa-phone:before{content:"\f095"}.fa-square-o:before{content:"\f096"}.fa-bookmark-o:before{content:"\f097"}.fa-phone-square:before{content:"\f098"}.fa-twitter:before{content:"\f099"}.fa-facebook:before{content:"\f09a"}.fa-github:before{content:"\f09b"}.fa-unlock:before{content:"\f09c"}.fa-credit-card:before{content:"\f09d"}.fa-rss:before{content:"\f09e"}.fa-hdd-o:before{content:"\f0a0"}.fa-bullhorn:before{content:"\f0a1"}.fa-bell:before{content:"\f0f3"}.fa-certificate:before{content:"\f0a3"}.fa-hand-o-right:before{content:"\f0a4"}.fa-hand-o-left:before{content:"\f0a5"}.fa-hand-o-up:before{content:"\f0a6"}.fa-hand-o-down:before{content:"\f0a7"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-globe:before{content:"\f0ac"}.fa-wrench:before{content:"\f0ad"}.fa-tasks:before{content:"\f0ae"}.fa-filter:before{content:"\f0b0"}.fa-briefcase:before{content:"\f0b1"}.fa-arrows-alt:before{content:"\f0b2"}.fa-group:before,.fa-users:before{content:"\f0c0"}.fa-chain:before,.fa-link:before{content:"\f0c1"}.fa-cloud:before{content:"\f0c2"}.fa-flask:before{content:"\f0c3"}.fa-cut:before,.fa-scissors:before{content:"\f0c4"}.fa-copy:before,.fa-files-o:before{content:"\f0c5"}.fa-paperclip:before{content:"\f0c6"}.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}.fa-square:before{content:"\f0c8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\f0c9"}.fa-list-ul:before{content:"\f0ca"}.fa-list-ol:before{content:"\f0cb"}.fa-strikethrough:before{content:"\f0cc"}.fa-underline:before{content:"\f0cd"}.fa-table:before{content:"\f0ce"}.fa-magic:before{content:"\f0d0"}.fa-truck:before{content:"\f0d1"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-google-plus-square:before{content:"\f0d4"}.fa-google-plus:before{content:"\f0d5"}.fa-money:before{content:"\f0d6"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-columns:before{content:"\f0db"}.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}.fa-sort-down:before,.fa-sort-desc:before{content:"\f0dd"}.fa-sort-up:before,.fa-sort-asc:before{content:"\f0de"}.fa-envelope:before{content:"\f0e0"}.fa-linkedin:before{content:"\f0e1"}.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-legal:before,.fa-gavel:before{content:"\f0e3"}.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}.fa-comment-o:before{content:"\f0e5"}.fa-comments-o:before{content:"\f0e6"}.fa-flash:before,.fa-bolt:before{content:"\f0e7"}.fa-sitemap:before{content:"\f0e8"}.fa-umbrella:before{content:"\f0e9"}.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}.fa-lightbulb-o:before{content:"\f0eb"}.fa-exchange:before{content:"\f0ec"}.fa-cloud-download:before{content:"\f0ed"}.fa-cloud-upload:before{content:"\f0ee"}.fa-user-md:before{content:"\f0f0"}.fa-stethoscope:before{content:"\f0f1"}.fa-suitcase:before{content:"\f0f2"}.fa-bell-o:before{content:"\f0a2"}.fa-coffee:before{content:"\f0f4"}.fa-cutlery:before{content:"\f0f5"}.fa-file-text-o:before{content:"\f0f6"}.fa-building-o:before{content:"\f0f7"}.fa-hospital-o:before{content:"\f0f8"}.fa-ambulance:before{content:"\f0f9"}.fa-medkit:before{content:"\f0fa"}.fa-fighter-jet:before{content:"\f0fb"}.fa-beer:before{content:"\f0fc"}.fa-h-square:before{content:"\f0fd"}.fa-plus-square:before{content:"\f0fe"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}.fa-desktop:before{content:"\f108"}.fa-laptop:before{content:"\f109"}.fa-tablet:before{content:"\f10a"}.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}.fa-circle-o:before{content:"\f10c"}.fa-quote-left:before{content:"\f10d"}.fa-quote-right:before{content:"\f10e"}.fa-spinner:before{content:"\f110"}.fa-circle:before{content:"\f111"}.fa-mail-reply:before,.fa-reply:before{content:"\f112"}.fa-github-alt:before{content:"\f113"}.fa-folder-o:before{content:"\f114"}.fa-folder-open-o:before{content:"\f115"}.fa-smile-o:before{content:"\f118"}.fa-frown-o:before{content:"\f119"}.fa-meh-o:before{content:"\f11a"}.fa-gamepad:before{content:"\f11b"}.fa-keyboard-o:before{content:"\f11c"}.fa-flag-o:before{content:"\f11d"}.fa-flag-checkered:before{content:"\f11e"}.fa-terminal:before{content:"\f120"}.fa-code:before{content:"\f121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\f122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}.fa-location-arrow:before{content:"\f124"}.fa-crop:before{content:"\f125"}.fa-code-fork:before{content:"\f126"}.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}.fa-question:before{content:"\f128"}.fa-info:before{content:"\f129"}.fa-exclamation:before{content:"\f12a"}.fa-superscript:before{content:"\f12b"}.fa-subscript:before{content:"\f12c"}.fa-eraser:before{content:"\f12d"}.fa-puzzle-piece:before{content:"\f12e"}.fa-microphone:before{content:"\f130"}.fa-microphone-slash:before{content:"\f131"}.fa-shield:before{content:"\f132"}.fa-calendar-o:before{content:"\f133"}.fa-fire-extinguisher:before{content:"\f134"}.fa-rocket:before{content:"\f135"}.fa-maxcdn:before{content:"\f136"}.fa-chevron-circle-left:before{content:"\f137"}.fa-chevron-circle-right:before{content:"\f138"}.fa-chevron-circle-up:before{content:"\f139"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-html5:before{content:"\f13b"}.fa-css3:before{content:"\f13c"}.fa-anchor:before{content:"\f13d"}.fa-unlock-alt:before{content:"\f13e"}.fa-bullseye:before{content:"\f140"}.fa-ellipsis-h:before{content:"\f141"}.fa-ellipsis-v:before{content:"\f142"}.fa-rss-square:before{content:"\f143"}.fa-play-circle:before{content:"\f144"}.fa-ticket:before{content:"\f145"}.fa-minus-square:before{content:"\f146"}.fa-minus-square-o:before{content:"\f147"}.fa-level-up:before{content:"\f148"}.fa-level-down:before{content:"\f149"}.fa-check-square:before{content:"\f14a"}.fa-pencil-square:before{content:"\f14b"}.fa-external-link-square:before{content:"\f14c"}.fa-share-square:before{content:"\f14d"}.fa-compass:before{content:"\f14e"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}.fa-euro:before,.fa-eur:before{content:"\f153"}.fa-gbp:before{content:"\f154"}.fa-dollar:before,.fa-usd:before{content:"\f155"}.fa-rupee:before,.fa-inr:before{content:"\f156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}.fa-won:before,.fa-krw:before{content:"\f159"}.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}.fa-file:before{content:"\f15b"}.fa-file-text:before{content:"\f15c"}.fa-sort-alpha-asc:before{content:"\f15d"}.fa-sort-alpha-desc:before{content:"\f15e"}.fa-sort-amount-asc:before{content:"\f160"}.fa-sort-amount-desc:before{content:"\f161"}.fa-sort-numeric-asc:before{content:"\f162"}.fa-sort-numeric-desc:before{content:"\f163"}.fa-thumbs-up:before{content:"\f164"}.fa-thumbs-down:before{content:"\f165"}.fa-youtube-square:before{content:"\f166"}.fa-youtube:before{content:"\f167"}.fa-xing:before{content:"\f168"}.fa-xing-square:before{content:"\f169"}.fa-youtube-play:before{content:"\f16a"}.fa-dropbox:before{content:"\f16b"}.fa-stack-overflow:before{content:"\f16c"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-adn:before{content:"\f170"}.fa-bitbucket:before{content:"\f171"}.fa-bitbucket-square:before{content:"\f172"}.fa-tumblr:before{content:"\f173"}.fa-tumblr-square:before{content:"\f174"}.fa-long-arrow-down:before{content:"\f175"}.fa-long-arrow-up:before{content:"\f176"}.fa-long-arrow-left:before{content:"\f177"}.fa-long-arrow-right:before{content:"\f178"}.fa-apple:before{content:"\f179"}.fa-windows:before{content:"\f17a"}.fa-android:before{content:"\f17b"}.fa-linux:before{content:"\f17c"}.fa-dribbble:before{content:"\f17d"}.fa-skype:before{content:"\f17e"}.fa-foursquare:before{content:"\f180"}.fa-trello:before{content:"\f181"}.fa-female:before{content:"\f182"}.fa-male:before{content:"\f183"}.fa-gittip:before{content:"\f184"}.fa-sun-o:before{content:"\f185"}.fa-moon-o:before{content:"\f186"}.fa-archive:before{content:"\f187"}.fa-bug:before{content:"\f188"}.fa-vk:before{content:"\f189"}.fa-weibo:before{content:"\f18a"}.fa-renren:before{content:"\f18b"}.fa-pagelines:before{content:"\f18c"}.fa-stack-exchange:before{content:"\f18d"}.fa-arrow-circle-o-right:before{content:"\f18e"}.fa-arrow-circle-o-left:before{content:"\f190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}.fa-dot-circle-o:before{content:"\f192"}.fa-wheelchair:before{content:"\f193"}.fa-vimeo-square:before{content:"\f194"}.fa-turkish-lira:before,.fa-try:before{content:"\f195"}.fa-plus-square-o:before{content:"\f196"}.fa-space-shuttle:before{content:"\f197"}.fa-slack:before{content:"\f198"}.fa-envelope-square:before{content:"\f199"}.fa-wordpress:before{content:"\f19a"}.fa-openid:before{content:"\f19b"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\f19c"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\f19d"}.fa-yahoo:before{content:"\f19e"}.fa-google:before{content:"\f1a0"}.fa-reddit:before{content:"\f1a1"}.fa-reddit-square:before{content:"\f1a2"}.fa-stumbleupon-circle:before{content:"\f1a3"}.fa-stumbleupon:before{content:"\f1a4"}.fa-delicious:before{content:"\f1a5"}.fa-digg:before{content:"\f1a6"}.fa-pied-piper:before{content:"\f1a7"}.fa-pied-piper-alt:before{content:"\f1a8"}.fa-drupal:before{content:"\f1a9"}.fa-joomla:before{content:"\f1aa"}.fa-language:before{content:"\f1ab"}.fa-fax:before{content:"\f1ac"}.fa-building:before{content:"\f1ad"}.fa-child:before{content:"\f1ae"}.fa-paw:before{content:"\f1b0"}.fa-spoon:before{content:"\f1b1"}.fa-cube:before{content:"\f1b2"}.fa-cubes:before{content:"\f1b3"}.fa-behance:before{content:"\f1b4"}.fa-behance-square:before{content:"\f1b5"}.fa-steam:before{content:"\f1b6"}.fa-steam-square:before{content:"\f1b7"}.fa-recycle:before{content:"\f1b8"}.fa-automobile:before,.fa-car:before{content:"\f1b9"}.fa-cab:before,.fa-taxi:before{content:"\f1ba"}.fa-tree:before{content:"\f1bb"}.fa-spotify:before{content:"\f1bc"}.fa-deviantart:before{content:"\f1bd"}.fa-soundcloud:before{content:"\f1be"}.fa-database:before{content:"\f1c0"}.fa-file-pdf-o:before{content:"\f1c1"}.fa-file-word-o:before{content:"\f1c2"}.fa-file-excel-o:before{content:"\f1c3"}.fa-file-powerpoint-o:before{content:"\f1c4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\f1c5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\f1c6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\f1c7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\f1c8"}.fa-file-code-o:before{content:"\f1c9"}.fa-vine:before{content:"\f1ca"}.fa-codepen:before{content:"\f1cb"}.fa-jsfiddle:before{content:"\f1cc"}.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\f1cd"}.fa-circle-o-notch:before{content:"\f1ce"}.fa-ra:before,.fa-rebel:before{content:"\f1d0"}.fa-ge:before,.fa-empire:before{content:"\f1d1"}.fa-git-square:before{content:"\f1d2"}.fa-git:before{content:"\f1d3"}.fa-hacker-news:before{content:"\f1d4"}.fa-tencent-weibo:before{content:"\f1d5"}.fa-qq:before{content:"\f1d6"}.fa-wechat:before,.fa-weixin:before{content:"\f1d7"}.fa-send:before,.fa-paper-plane:before{content:"\f1d8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\f1d9"}.fa-history:before{content:"\f1da"}.fa-circle-thin:before{content:"\f1db"}.fa-header:before{content:"\f1dc"}.fa-paragraph:before{content:"\f1dd"}.fa-sliders:before{content:"\f1de"}.fa-share-alt:before{content:"\f1e0"}.fa-share-alt-square:before{content:"\f1e1"}.fa-bomb:before{content:"\f1e2"}.fa-soccer-ball-o:before,.fa-futbol-o:before{content:"\f1e3"}.fa-tty:before{content:"\f1e4"}.fa-binoculars:before{content:"\f1e5"}.fa-plug:before{content:"\f1e6"}.fa-slideshare:before{content:"\f1e7"}.fa-twitch:before{content:"\f1e8"}.fa-yelp:before{content:"\f1e9"}.fa-newspaper-o:before{content:"\f1ea"}.fa-wifi:before{content:"\f1eb"}.fa-calculator:before{content:"\f1ec"}.fa-paypal:before{content:"\f1ed"}.fa-google-wallet:before{content:"\f1ee"}.fa-cc-visa:before{content:"\f1f0"}.fa-cc-mastercard:before{content:"\f1f1"}.fa-cc-discover:before{content:"\f1f2"}.fa-cc-amex:before{content:"\f1f3"}.fa-cc-paypal:before{content:"\f1f4"}.fa-cc-stripe:before{content:"\f1f5"}.fa-bell-slash:before{content:"\f1f6"}.fa-bell-slash-o:before{content:"\f1f7"}.fa-trash:before{content:"\f1f8"}.fa-copyright:before{content:"\f1f9"}.fa-at:before{content:"\f1fa"}.fa-eyedropper:before{content:"\f1fb"}.fa-paint-brush:before{content:"\f1fc"}.fa-birthday-cake:before{content:"\f1fd"}.fa-area-chart:before{content:"\f1fe"}.fa-pie-chart:before{content:"\f200"}.fa-line-chart:before{content:"\f201"}.fa-lastfm:before{content:"\f202"}.fa-lastfm-square:before{content:"\f203"}.fa-toggle-off:before{content:"\f204"}.fa-toggle-on:before{content:"\f205"}.fa-bicycle:before{content:"\f206"}.fa-bus:before{content:"\f207"}.fa-ioxhost:before{content:"\f208"}.fa-angellist:before{content:"\f209"}.fa-cc:before{content:"\f20a"}.fa-shekel:before,.fa-sheqel:before,.fa-ils:before{content:"\f20b"}.fa-meanpath:before{content:"\f20c"} @font-face { font-family: 'discoregular'; src: url('font/DISCO___-webfont.eot'); src: url('font/DISCO___-webfont.eot?#iefix') format('embedded-opentype'), url('font/DISCO___-webfont.woff') format('woff'), url('font/DISCO___-webfont.ttf') format('truetype'), url('font/DISCO___-webfont.svg#discoregular') format('svg'); font-weight: normal; font-style: normal; } html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,caption,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0;}table,tbody,tfoot,thead,tr,th,td{font-size:100%;font:inherit;vertical-align:baseline;border-collapse:collapse;border-spacing:0;margin:0;padding:0;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:100%;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:none;} body { margin: 0; padding: 0; background: #FFF url(../Content/img/bg-top.jpg) no-repeat top center; color: #5a5a5a; font: 62.5% Arial, Helvetica, sans-serif; } h1, h2, h3, h4, .h1, .h2, .h3, .h4 { padding: 15px 0 7px; color: #9f9f9f; font-weight: normal; line-height: 1.3; } h1:first-child, h2:first-child, h3:first-child, h4:first-child { padding-top: 0; } h1, .h1 { font-size: 2.6em; } h2, .h2 { font-size: 2.2em; } h3, .h3 { font-size: 1.8em; } h4, .h4 { font-size: 1.6em; } p { padding: 5px 0; font-size: 1.2em; line-height: 1.5; } p a { font-size: 1em; } address { padding: 5px 0; font-size: 1.2em; font-style: normal; line-height: 1.5; } address p { font-size: 1em; } a { color: #ea6cb0; font-size: 1.2em; text-decoration: none; outline: none; cursor: pointer; } a:hover { color: #bebebe; text-decoration: none; } table { margin: 0 0 20px 0; width: 100%; } td, th { padding: 5px; font-size: 1.1em; line-height: 1.5; vertical-align: middle; } label { display: block; padding: 5px 0; font-size: 1.2em; } label a { font-size: 1em; } input::-moz-focus-inner /* Remove button padding in FF */ { border: 0; padding: 0; } input, textarea, button { margin: 0; padding: 0; border: 0; background: none; background-color: #FFF; font-family: Arial, Helvetica, sans-serif; font-size: 1.2em; outline: none; } input[type="text"], input[type="password"], input.text, input.password { display: block; padding: 0 8px; width: 260px; height: 28px; border: 1px solid #d6d6d6; background: #FFF; font: 1.2em/28px Arial, Helvetica, Sans-serif; } @media screen and (max-width: 639px) { input[type="text"], input[type="password"], input.text, input.password { box-sizing: border-box; width: 100%; min-width: 40px; max-width: 100%; } } input.text-dbl-size { width: 551px; } @media screen and (max-width: 969px) { input.text-dbl-size { box-sizing: border-box; max-width: 100%; } } input[type="submit"], input[type="button"], button { cursor: pointer; } input[type="radio"], input[type="checkbox"], input.radio, input.checkbox { display: inline; } textarea { display: block; padding: 8px; width: 465px; height: 112px; border: 1px solid #d6d6d6; background: #FFF; font: 1.2em/1.5 Arial, Helvetica, Sans-serif; resize: none; } @media screen and (max-width: 969px) { textarea { box-sizing: border-box; max-width: 100%; } } .l-grid-main-content .text { width: 217px; } .l-grid-main-content .text-dbl-size, .l-grid-main-content textarea { width:467px; } select { font-family: Arial, Helvetica Sans-serif; font-size: 12px; } @media screen and (max-width: 639px) { select { width: 100%; max-width: 100%; } } .group:after { display: block; clear: both; height: 0; content: ""; visibility: hidden; } .img-rep { display: block; font-size: 0; line-height: 0; text-indent: -9999px; } .divider { margin: 0 5px; font-size: 13px; position: relative; z-index: 1; } .c-spr { background: transparent url(../Content/img/common-sprite.png) no-repeat 0 0; } .hd-main { font-size: 3em; color: #2b68b3; } .hd-aside { padding-top: 0; padding-bottom: 5px; color: #9f9f9f; font-size: 2.4em; } .hd-section { color: #9f9f9f; font-size: 1.8em; } .hd-section-alt { color: #2B68B3; } .hd-home-main-panel { margin-left: 7px; margin-right: 7px; } @media screen and (max-width: 969px) { .hd-home-main-panel { margin-left: 0; margin-right: 0; } } .small-link { font-size: 12px !important; font-weight: normal; } /* --------------------------------------------------- /* 2. LAYOUT /* --------------------------------------------------- */ #l-grand-wrapper /* Opera - For removing space on the top of page */ { margin: 0; padding: 0; width: 100%; position: absolute; top: 0; /* overflow: hidden; NOTE: removed so lower resolution screen will able to scroll */ background: transparent url(../Content/img/bg-bot.jpg) no-repeat bottom center; } .l-wrapper { margin: 0 auto; width: 974px; position: relative; } @media screen and (max-width: 969px) { .l-wrapper { width: 640px; } } @media screen and (max-width: 639px) { .l-wrapper { width: 320px; } } #l-header { } #l-content { margin: 5px 0; min-height: 350px; } @media screen and (max-width: 969px) { #l-content { margin-top: 0; } } #l-footer { padding: 50px 0 10px; } @media screen and (max-width: 969px) { #l-footer { padding-top: 30px; } } .l-grid { width: 100%; } .l-grid-col { float: left; margin: 7px; width: 960px; } @media screen and (max-width: 969px) { .l-grid-col { width: 626px; } } @media screen and (max-width: 639px) { .l-grid-col { margin: 7px 15px; width: 290px; } } .l-grid-col-m-top-nav { } @media screen and (min-width: 640px) { .l-grid-col-m-top-nav { display: block !important; /* NOTE: to ensure that main nav will always displayed from tablet view onward */ } } @media screen and (max-width: 639px) { .l-grid-col-m-top-nav { display: none; } } .l-grid-hdr-logo { width: 804px; } @media screen and (max-width: 969px) { .l-grid-hdr-logo { width: 470px; } } @media screen and (max-width: 639px) { .l-grid-hdr-logo { width: 290px; } } .l-grid-hdr-tools { width: 142px; } @media screen and (max-width: 639px) { .l-grid-hdr-tools { width: 290px; } } .l-grid-adv { width: 210px; -webkit-box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); overflow: hidden; } @media screen and (max-width: 969px) { .l-grid-adv { width: 170px; } } @media screen and (max-width: 639px) { .l-grid-adv { margin-right: 7px; width: 170px; } } .l-grid-adv img { display: block; } @media screen and (max-width: 969px) { .l-grid-adv img { position: relative; left: -7px; width: 180px; } } @media screen and (max-width: 639px) { .l-grid-adv img { position: relative; left: -8px; width: 180px; } } .l-grid-adv-m-right { } @media screen and (max-width: 639px) { .l-grid-adv-m-right { margin-left: 7px; width: 108px; position: absolute; top: 0; right: 8px; } } .l-grid-adv-m-right img { } @media screen and (max-width: 639px) { .l-grid-adv-m-right img { left: -35px; width: 180px; } } .l-grid-side-nav { width: 210px; } @media screen and (max-width: 969px) { .l-grid-side-nav { width: 626px; } } @media screen and (max-width: 639px) { .l-grid-side-nav { width: 290px; } } .l-grid-search-bar { width: 512px; position: relative; top: 12px; -webkit-box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); } @media screen and (max-width: 969px) { .l-grid-search-bar { width: 258px; top: 8px; } } @media screen and (max-width: 639px) { .l-grid-search-bar { width: 290px; top: 0; } } .l-grid-tile { width: 236px; } .l-grid-tile-m-home-main { } @media screen and (max-width: 969px) { .l-grid-tile-m-home-main { box-sizing: border-box; margin-left: 0; margin-right: 0; width: 100%; } } .l-grid-tile-m-main { } @media screen and (max-width: 969px) { .l-grid-tile-m-main { width: 306px; } } @media screen and (max-width: 639px) { .l-grid-tile-m-main { width: 290px; } } .l-grid-tile-m-aside { box-sizing: border-box; width: 100%; } .l-grid-main-content { width: 486px; } @media screen and (max-width: 969px) { .l-grid-main-content { width: 400px; } } @media screen and (max-width: 639px) { .l-grid-main-content { width: 290px; } } .l-grid-aside { width: 236px; } @media screen and (max-width: 969px) { .l-grid-aside { width: 212px; } } @media screen and (max-width: 639px) { .l-grid-aside { width: 290px; } } .l-grid-copy { width: 473px; } @media screen and (max-width: 969px) { .l-grid-copy { width: 400px; } } @media screen and (max-width: 639px) { .l-grid-copy { margin-right: 7px; width: 164px; } } .l-grid-by { width: 473px; } @media screen and (max-width: 969px) { .l-grid-by { width: 212px; } } @media screen and (max-width: 639px) { .l-grid-by { margin-left: 7px; width: 112px; text-align: center; } } .l-grid-pagination { width: 736px; } @media screen and (max-width: 969px) { .l-grid-pagination { width: 626px; } } @media screen and (max-width: 639px) { .l-grid-pagination { margin-left: 15px; margin-right: 15px; width: 290px; } } .l-grid-main-content-2-3 { width: 736px; } @media screen and (max-width: 969px) { .l-grid-main-content-2-3 { width: 626px; } } @media screen and (max-width: 639px) { .l-grid-main-content-2-3 { width: 290px; } } .l-w-horz-gutter { margin-right: 7px; margin-left: 7px; } @media screen and (max-width: 639px) { .l-w-horz-gutter { margin-left: 15px; margin-right: 15px; } } .l-grid-main-container-middle { margin-left: 0; margin-right: 0; width: 500px; } @media screen and (max-width: 969px) { .l-grid-main-container-middle { margin: 7px; width: 400px; } } @media screen and (max-width: 639px) { .l-grid-main-container-middle { margin: 7px 15px; width: 290px; } } .l-grid-main-container-right { margin-left: 0; margin-right: 0; width: 750px; } @media screen and (max-width: 969px) { .l-grid-main-container-right { box-sizing: border-box; width: 100%; } } .l-grid-aside .l-grid-col { margin-left: 0; margin-right: 0; } .l-dynamic-content { margin: 0; width: 750px; position: relative; } @media screen and (max-width: 969px) { .l-dynamic-content { width: 100%; } } .l-dynamic-content--loader { width: 100%; height: 100%; background: transparent url(../Content/img/bg-white-opa-90.png); position: absolute; top: 0; left: 0; z-index: 2; } .l-dynamic-content--loader img { display: block; margin-left: -20px; width: 39px; height: 39px; position: absolute; top: 15%; left: 50%; } .l-pg-section { margin-bottom: 25px; } .l-pg-section-tight { margin-bottom: 15px; } .l-pg-section-tight-2 { margin-bottom: 10px; } .l-pg-section-tight-3 { margin-bottom: 5px; } /* --------------------------------------------------- /* 3. MODULES & COMPONENTS /* --------------------------------------------------- */ /* 3.1. Nav */ /* -------- */ /* 3.1.1. Accessibility Nav */ #nav-access { position: absolute; top: -9999px; left: -9999px; } /* 3.1.2. Main Nav */ .top-nav { padding-top: 8px; width: 958px; height: 27px; overflow: hidden; -webkit-box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); /* -webkit-box-shadow: inset 0px 0px 2px 1px #f5f5f5; box-shadow: inset 0px 0px 2px 1px #f5f5f5; */ border: 1px solid #FFF; -webkit-border-radius: 2px; border-radius: 2px; background: #FFF; } @media screen and (max-width: 969px) { .top-nav { width: 624px; } } @media screen and (max-width: 639px) { .top-nav { box-sizing: border-box; padding: 10px 10px 20px; width: 290px; height: auto; } } .top-nav .main-nav { float: left; } @media screen and (max-width: 639px) { .top-nav .main-nav { float: none; } } .top-nav .social-nav { float: right; } @media screen and (max-width: 639px) { .top-nav .social-nav { float: none; } } .main-nav { } .main-nav li { float: left; border-left: 1px solid #e7e6e7; } @media screen and (max-width: 639px) { .main-nav li { float: none; border-left: 0; } } .main-nav li:first-child { border-left: 0; } .main-nav a { display: block; margin: 0 50px; height: 18px; line-height: 18px; font-size: 14px; } @media screen and (max-width: 969px) { .main-nav a { margin: 0 19px; font-size: 13px; } } @media screen and (max-width: 639px) { .main-nav a { margin: 0; padding: 10px; border-bottom: 1px solid #e3e7ea; } } .main-nav a:hover, .main-nav .selected a { color: #bebebe; text-decoration: none; } .social-nav { } @media screen and (max-width: 639px) { .social-nav { margin-top: 15px; text-align: center; } } .social-nav li { float: left; border-left: 1px solid #e7e6e7; } @media screen and (max-width: 639px) { .social-nav li { float: none; display: inline-block; } } .social-nav li:first-child { } @media screen and (max-width: 639px) { .social-nav li:first-child { border-left: 0; } } .social-nav a { display: block; margin: 0 14px; height: 18px; line-height: 18px; font-size: 14px; } @media screen and (max-width: 639px) { .social-nav a { border-bottom: 0; } } /* 3.1.3. Side Nav */ .side-nav { -webkit-box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); } @media screen and (max-width: 969px) { .side-nav { padding: 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #FFF; overflow: hidden; } } .side-nav--hd { display: none; position: relative; color: #ea6cb0; } @media screen and (max-width: 969px) { .side-nav--hd { display: block; padding-bottom: 0; cursor: pointer; } } .side-nav--hd--icon { height: 23px; position: absolute; top: 0; right: 0; color: #ea6cb0; line-height: 23px; } .side-nav--menu { } @media screen and (min-width: 970px) { .side-nav--menu { display: block !important; /* NOTE: to ensure it will be displayed on desktop view */ } } @media screen and (max-width: 969px) { .side-nav--menu { display: none; padding-top: 10px; } } .side-nav--menu li:first-child a { border-top: 1px solid #e3e7ea; } .side-nav--menu a { box-sizing: border-box; display: block; padding: 15px 12px; width: 100%; background: #FFF; border-bottom: 1px solid #e3e7ea; } @media screen and (max-width: 969px) { .side-nav--menu a { display: block; padding: 15px 10px; border-top: 1px solid #e3e7ea; border-bottom: 0; } } .side-nav--menu a:hover, .side-nav--menu .selected a { text-decoration: none; color: #bebebe; } /* 3.1.4. Pagination */ .pagination-hd , .pagination-num { color: #2a68b5; font-size: 1.8em; } .pagination a { margin: 0 3px 0 0; font-size: 1.1em; } .pagination .selected { margin: 0 3px 0 0; font-size: 1.1em; font-weight: bold; } .blog-entry--pagination .pagination-num { float: left; } .l-grid-pagination .pagination-num { float: left; } @media screen and (max-width: 639px) { .l-grid-pagination .pagination-num { float: none; margin-bottom: 5px; } } .l-grid-pagination .pagination-hd { float: left; } @media screen and (max-width: 639px) { .l-grid-pagination .pagination-hd { float: none; } } .l-grid-pagination .pagination-nav { margin-top: 4px; margin-left: 15px; float: right; } @media screen and (max-width: 639px) { .l-grid-pagination .pagination-nav { float: none; margin-left: 0; } } .blog-entry--pagination .pagination-nav { margin-top: 4px; margin-left: 15px; float: right; } /* 3.1.5. Breadcrumb */ .b-crumb { margin-bottom: 7px; color: #9b9b9b; font: 1.2em/1.5 Arial, Helvetica, Sans-serif; } .b-crumb a { font-size: 1em; text-decoration: none; } .b-crumb a:hover { text-decoration: underline; } /* 3.1.6. Main Nav Toggle */ .main-nav-toggle { display: none; } @media screen and (max-width: 639px) { .main-nav-toggle { display: block; float: left; margin-left: 7px; padding: 12px 10px; height: 53px; -webkit-box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); border: 1px solid #fff; -webkit-border-radius: 3px; border-radius: 3px; } } .main-nav-toggle--icon { float: left; } .main-nav-toggle--bar { display: block; margin-top: 4px; width: 28px; height: 4px; background-color: #ea6cb0; } .main-nav-toggle--bar:first-child { margin-top: 0; } .main-nav-toggle:hover .main-nav-toggle--bar { background-color: #bebebe; } .main-nav-toggle--text { display: inline-block; margin-left: 10px; color: #ea6cb0; width: 50px; font-weight: bold; font-size: 14px; line-height: 20px; text-transform: uppercase; } .main-nav-toggle:hover .main-nav-toggle--text { color: #bebebe; } /* 3.2. Button */ /* ----------- */ .btn /* IE7 */ { display: inline-block; padding: 0 6px; height: 20px; overflow: hidden; outline: none; border: 1px solid #ea6cb0; -webkit-border-radius: 2px; border-radius: 2px; background-color: #FFF; color: #ea6cb0; font-size: 14px; font-weight: bold; line-height: 20px; text-decoration: none; } button.btn { height: 22px; line-height: 18px; } input.btn { height: 22px; line-height: 18px; } .btn:hover { border: 1px solid #d6d6d6; background-color: #FFF; color: #bebebe; text-decoration: none; } .btn-green, .btn-green:hover { border: 1px solid #73bf43; color: #73bf43; } .btn-iconed .ico { float: left; margin-right: 6px; } .btn-iconed .label /* IE9 */ { float: left; height: 20px; line-height: 20px; } .btn-iconed .ico-cart-small, .btn-iconed .ico-tick {margin-top: 3px;} .btn-iconed:hover .ico-cart-small {background-position: -107px -17px;} .btn-added, .btn-added-small {display: none;} .btn-added-small .ico {margin-right: 3px;} .btn-added-small .label {font-size: 9px;} .btn-on-button { height: 28px; line-height: 20px; } /* 3.3. Icon */ /* --------- */ .ico-cart { width: 28px; height: 25px; } .ico-cart-small { width: 16px; height: 14px; background-position: -107px 0; } .ico-cart-small:hover {background-position: -107px -17px;} .ico-tick { width: 16px; height: 14px; background-position: -326px 0; } .ico-pinterest { width: 15px; height: 18px; background-position: -31px 0; } .ico-twitter { width: 20px; height: 18px; background-position: -49px 0; } .ico-fb { width: 9px; height: 18px; background-position: -72px 0; } .ico-pinterest:hover{background-position: -31px -21px;} .ico-twitter:hover {background-position: -49px -21px;} .ico-fb:hover {background-position: -72px -21px;} .ico-search { width: 20px; height: 20px; background-position: -84px 0; } .ico-comment { width: 12px; height: 12px; background-position: -292px 0; } .iconed-link:hover .ico-comment {background-position: -292px -15px;} .ico-circle-15 { width: 15px; height: 15px; } .ico-cross {background-position: -126px 0;} .iconed-link:hover .ico-cross {background-position: -126px -18px;} .ico-right-arrow {background-position: -144px 0;} .iconed-link:hover .ico-right-arrow {background-position: -144px -18px;} .ico-left-arrow {background-position: -162px 0;} .iconed-link:hover .ico-left-arrow {background-position: -162px -18px;} .ico-up-arrow {background-position: -180px 0;} .iconed-link:hover .ico-up-arrow {background-position: -180px -18px;} .ico-down-arrow {background-position: -198px 0;} .iconed-link:hover .ico-down-arrow {background-position: -198px -18px;} .share-ico { width: 16px; height: 16px; } .share-ico-email {background-position: -216px 0;} .share-ico-pinterest {background-position: -235px 0;} .share-ico-fb {background-position: -254px 0;} .share-ico-twitter {background-position: -273px 0;} .ico-sqr-16 { width: 16px; height: 16px; } .ico-sqr-cross {background-position: -307px 0;} .ico-sqr-cross:hover {background-position: -307px -19px;} /* 3.4. CMS Copy */ /* ------------- */ .cms-copy h1, .cms-copy h2, .cms-copy h3 { padding: 20px 0 7px 0; } .cms-copy h4 { padding: 20px 0 10px 0; } .cms-copy a, .cms-copy ul li ul li, .cms-copy ol li ol li, .cms-copy ul li ol li, .cms-copy ol li ul li, .cms-copy li a, .cms-copy li p a, .cms-copy table p, .cms-copy table li, .cms-copy table li p { font-size: 1em; } .cms-copy ul { padding: 5px 0; margin-left: 20px; list-style: disc outside none; } .cms-copy ul li ul, .cms-copy ol li ul { padding-top: 10px; list-style: disc outside none; } .cms-copy ol { padding: 5px 0; margin-left: 24px; list-style: decimal outside none; } .cms-copy ul li ol, .cms-copy ol li ol { padding-top: 10px; list-style: decimal outside none; } .cms-copy li { padding: 5px 0; font-size: 1.2em; line-height: 1.5; } .cms-copy li p { padding: 0; font-size: 1em; } .cms-copy table { margin-top: 10px; border-top: 1px solid #bebebe; border-right: 1px solid #bebebe; } .cms-copy td, .cms-copy th { border-color: #000; } .cms-copy td, .cms-copy th { padding: 5px 10px; border-bottom: 1px solid #bebebe; border-left: 1px solid #bebebe; font-size: 1.2em; } .cms-copy img { margin: 10px 0; max-width: 100%; } .cms-copy-welcome { color: #9F9F9F; } @media screen and (max-width: 969px) { .cms-copy-welcome { margin-left: 0; margin-right: 0; } } .cms-copy-welcome h1 { color: #409cdb; font-size: 2.2em; } .cms-copy-welcome h4 { padding: 7px 0 5px 0; } /* 3.5. Form Elements */ /* ------------------ */ /* 3.5.1. Common */ .form-section { padding: 10px 0 25px; } .form-error, .field-validation-error { display: block; margin: 5px 0 0 0; color: #cc0000; font-size: 1.2em; } .form-line { /* For form element especially styled drop down */ margin-bottom: 10px; position: relative; z-index: 1; } .form-line .form-el-cont { float: left; padding-left: 15px; } @media screen and (max-width: 969px) { .form-line .form-el-cont { float: none; padding-left: 0; margin-bottom: 10px; } } .form-line .form-el-cont:first-child { padding-left: 0; } .form-line-w-dd-expanded { /* For form element especially styled drop down */ z-index: 999; } .form-line-w-col .form-el-cont { padding-left: 0; padding-right: 15px; } .form-line-2-col .form-el-cont { width: 45%; } @media screen and (max-width: 969px) { .form-line-2-col .form-el-cont { margin-bottom: 0; } } @media screen and (max-width: 639px) { .form-line-2-col .form-el-cont { padding-right: 0; width: 100%; } } .form-el-cont .opt-item-container { margin-bottom: 0; } .form-action-panel { padding-top: 15px; } .form-action-panel .btn { float: right; margin-right: 10px; } @media screen and (max-width: 969px) { .form-action-panel .btn { float: none; } } .form-action-panel .btn:first-child { margin-right : 0; } .form-action-panel-m-group { } .form-action-panel-m-group .btn { float: left; margin-left: 10px; } .form-action-panel-m-group .btn:first-child { margin-left: 0; } /* 3.5.2. Option Item Container (For checkbox and radio button with inline label) */ .opt-item-container { margin: 0 0 15px; } .opt-item-container label /* IE7 */ { display: inline-block; margin-top: -2px; margin-bottom: 0; padding: 0; width: auto; vertical-align: top; line-height: 1.5; /* the current setting is for 1.5 line height - adjust the margin if line-height changed */ } .opt-item-container input /* IE7 */ { margin-right: 7px; margin-bottom: 0; } .opt-item-container-float label, .opt-item-container-float input { float: left; } .tick { } .tick input { float: left; margin-top: 2px; } .tick label { padding: 0; margin-left: 25px; line-height: 1.5 } /* 3.5.3. Textbox/area With Inner Label */ .form-txt-box-cont, .form-txt-area-cont { position: relative; z-index: 1; } .inner-form-default-label { padding: 0; font-size: 12px; height: 28px; line-height: 28px; position: absolute; top: 1px; left: 10px; } input.text-focus, textarea.text-area-focus {border: 1px solid #00AEEF;} /* 3.6. Search Bar */ /* --------------- */ .search-bar { width: 512px; height: 30px; position: relative; z-index: 1; -webkit-box-shadow: inset 0px 0px 2px 3px #f5f5f5; box-shadow: inset 0px 0px 2px 3px #f5f5f5; border: 1px solid #FFF; -webkit-border-radius: 3px; border-radius: 3px; background: #FFF; } @media screen and (max-width: 969px) { .search-bar { width: 256px; } } @media screen and (max-width: 639px) { .search-bar { width: 288px; } } .search-bar .text { float: right; margin: 0 10px; padding: 0; width: 452px; height: 30px; border: 0; background: none; line-height: 30px; } @media screen and (max-width: 969px) { .search-bar .text { width: 206px; } } @media screen and (max-width: 639px) { .search-bar .text { width: 230px; } } .search-bar .submit { float: left; margin: 5px 10px 0; } @media screen and (max-width: 969px) { .search-bar .submit { margin-right: 0; } } .l-grid-search-bar .search-bar { margin: 0 auto; } /* 3.7. Search Result */ /* ------------------ */ .search-result {margin: 0 0 35px;} .search-result li { margin-top: 15px; border-bottom: 1px solid #efefef; } /* 3.8. Currency Options */ /* --------------------- */ .currency-opt { margin-bottom: 8px; width: 141px; } .currency-opt label { float: left; margin: 0 10px 0 7px; padding: 0; height: 26px; line-height: 26px; color: #969696; } .currency-opt select /* IE7 */ { float: right; padding: 4px; width: 74px; -webkit-box-shadow: inset 0px 0px 2px 1px #f5f5f5; box-shadow: inset 0px 0px 2px 1px #f5f5f5; border: 1px solid #FFF; -webkit-border-radius: 2px; border-radius: 2px; color: #969696; font-size: 11px; font-weight: bold; } /* 3.9. Nav Cart */ /* ------------- */ .nav-cart { margin-top: 21px; padding: 10px 12px 10px 52px; width: 75px; -webkit-box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); /* -webkit-box-shadow: inset 0px 0px 2px 1px #f5f5f5; box-shadow: inset 0px 0px 2px 1px #f5f5f5; */ border: 1px solid #FFF; -webkit-border-radius: 3px; border-radius: 3px; background: #FFF; color: #969696; position: relative; } @media screen and (max-width: 969px) { .nav-cart { width: 76px; } } @media screen and (max-width: 639px) { .nav-cart { box-sizing: border-box; float: left; margin: 0 7px 0 0; width: 160px; height: 53px; } } .nav-cart a { font-size: 11px; } .nav-cart--ico { position: absolute; top: 13px; left: 11px; } .nav-cart--item { font-size: 14px; } /* 3.10. Content Rotator */ /* -------------------- */ .content-rotator { width: 486px; height: 331px; position: relative; z-index: 1; } @media screen and (max-width: 969px) { .content-rotator { margin-left: 0 !important; margin-right: 0 !important; width: 400px; height: 295px; } } @media screen and (max-width: 639px) { .content-rotator { width: 290px; height: 230px; } } .content-rotator li { width: 100%; overflow: hidden; position: absolute; top: 0; left: 0; z-index: 1; } .content-rotator li:first-child { z-index: 2; } .content-rotator img { display: block; width: 100%; height: 100%; } .content-rotator-txt { width: 456px; color : #FFF; text-shadow: 2px 2px 2px #000000; filter: dropshadow(color=#000000, offx=2, offy=2); position: absolute; bottom: 15px; left: 10px; z-index: 9999; } @media screen and (max-width: 969px) { .content-rotator-txt { width: 370px; } } @media screen and (max-width: 639px) { .content-rotator-txt { width: 280px; bottom: 42px; } } .content-rotator-txt p { padding-left: 10px; font-size: 17px; line-height: 1.3; } .content-rotator-hd /* IE7 */ { padding-top: 0; color: #ea6cb0; font: bold 60px/75% discoregular; color: #FFF; letter-spacing: -0.13em; text-shadow: 2px 2px 2px #000000; filter: dropshadow(color=#000000, offx=2, offy=2); } .content-rotator-nav { overflow: hidden; position: absolute; bottom: 15px; right: 15px; z-index: 9999; } @media screen and (max-width: 969px) { .content-rotator-nav { right: -7px; bottom: 0; } } @media screen and (max-width: 639px) { .content-rotator-nav { right: -10px; bottom: 10px; } } .content-rotator-nav-btn { float: left; margin-right: 5px; width: 10px; height: 10px; overflow: hidden; -webkit-border-radius: 1px; border-radius: 1px; background: transparent url(../content/img/bg-white-opa-90.png); color: #FFF; font-size: 0; line-height: 0; text-align: center; text-indent: -9999px; text-decoration: none; } @media screen and (max-width: 969px) { .content-rotator-nav-btn { width: 13px; height: 13px; margin-right: 7px; background-color: #000; } } @media screen and (max-width: 639px) { .content-rotator-nav-btn { width: 15px; height: 15px; margin-right: 10px; } } .content-rotator-nav .s-selected { background: #2967B3; } .content-rotator-alt-nav { display: block; width: 46px; height: 46px; background-color: #000; color: #FFF; font-size: 30px; line-height: 46px; text-align: center; text-decoration: none; position: absolute; top: 361px; z-index: 10; } .content-rotator-alt-nav:hover, .content-rotator-nav-btn:hover { background: #2967B3; } .content-rotator-alt-nav-prev { left: 30px; } .content-rotator-alt-nav-next { right: 30px; } .hm-content-rotator .content-rotator-alt-nav { display: none; } /* 3.11. Product Tile */ /* ------------------ */ .product-tile { padding: 11px; width: 212px; height: 212px; -webkit-box-shadow: inset 0px 0px 2px 1px #CCC; box-shadow: inset 0px 0px 2px 1px #CCC; border: 1px solid #bebebe; -webkit-border-radius: 2px; border-radius: 2px; background-color: #f5f5f5; } @media screen and (max-width: 969px) { .product-tile { box-sizing: border-box; width: 100%; } } .product-tile--hd, .product-tile--hd a { padding-top: 0; height: 36px; overflow: hidden; color: #2a68b3; font-size: 14px; font-weight: bold; } .product-tile--img { margin-bottom: 13px; width: 210px; height: 130px; overflow: hidden; border: 1px solid #FFF; -webkit-border-radius: 2px; border-radius: 2px; background-color: #FFF; } .product-tile--img img { display: block; width: 100%; } .product-tile--price { height: 22px; color: #2a68b3; font-size: 16px; line-height: 23px; } @media screen and (max-width: 639px) { .product-tile--price { box-sizing: border-box; padding-right: 0; width: auto; } } .product-tile--price .price-cents { font-size: 11px; vertical-align: top; font-weight: bold; position: relative; top: -2px; } .product-tile--qty-select { display: block; width: 82px; font-size: 12px; } .product-tile--qty-input { } .product-tile--qty-input label { float: left; padding: 0 5px 0 0; height: 22px; font-size: 1.1em; line-height: 22px; } .product-tile--qty-input .text { float: left; width: 15px; height: 20px; line-height: 20px; text-align: center; } .product-tile--panel { position: relative; } .product-tile--panel .product-tile--price { float: left; width: 55px; height: 22px; overflow: hidden; line-height: 22px; } .product-tile--panel .product-tile--qty-select /* IE7 */ { float: right; margin-top: 2px; } .product-tile--btn { float: right; margin-left: 4px; width: 66px; height: 22px; } .product-tile--btn .btn { width: 50px; } .product-tile-m-home-main { } @media screen and (max-width: 969px) { .product-tile-m-home-main { height: auto; } } .product-tile-m-home-main .product-tile--img { } @media screen and (max-width: 969px) { .product-tile-m-home-main .product-tile--img { box-sizing: border-box; width: 376px; height: 233px; } } @media screen and (max-width: 639px) { .product-tile-m-home-main .product-tile--img { box-sizing: border-box; width: 100%; height: auto; } } .product-tile-m-home-main .product-tile--img img { width: 100%; } .product-tile-m-home-main .product-tile--hd { } @media screen and (max-width: 969px) { .product-tile-m-home-main .product-tile--hd { height: auto; } } .product-tile-m-home-main .product-tile--price { } @media screen and (max-width: 969px) { .product-tile-m-home-main .product-tile--price { box-sizing: border-box; padding-right: 0; width: auto; } } .product-tile-m-home-main .product-tile--qty-input { } @media screen and (max-width: 969px) { .product-tile-m-home-main .product-tile--qty-input { float: right; position: static; } } .product-tile-m-home-main .product-tile--qty-select { } @media screen and (max-width: 969px) { .product-tile-m-home-main .product-tile--qty-select { float: right; position: static; } } .product-tile-m-home-main .product-tile--btn { } @media screen and (max-width: 969px) { .product-tile-m-home-main .product-tile--btn { float: right; width: auto; margin-top: 0; margin-left: 88px; } } @media screen and (max-width: 639px) { .product-tile-m-home-main .product-tile--btn { margin-left: 38px; } } .product-tile-m-main { } @media screen and (max-width: 969px) { .product-tile-m-main { height: auto; } } .product-tile-m-main .product-tile--img { } @media screen and (max-width: 969px) { .product-tile-m-main .product-tile--img { box-sizing: border-box; width: 280px; height: 173px; } } @media screen and (max-width: 639px) { .product-tile-m-main .product-tile--img { box-sizing: border-box; width: 100%; height: auto; } } .product-tile-m-main .product-tile--img img { } @media screen and (max-width: 969px) { .product-tile-m-main .product-tile--img img { width: 100%; } } .product-tile-m-main .product-tile--price { } @media screen and (max-width: 969px) { .product-tile-m-main .product-tile--price { box-sizing: border-box; padding-right: 0; width: auto; } } .product-tile-m-main .product-tile--qty-input { } @media screen and (max-width: 969px) { .product-tile-m-main .product-tile--qty-input { float: right; position: static; } } .product-tile-m-main .product-tile--qty-select { } @media screen and (max-width: 969px) { .product-tile-m-main .product-tile--qty-select { float: right; position: static; } } .product-tile-m-main .product-tile--btn { } @media screen and (max-width: 969px) { .product-tile-m-main .product-tile--btn { float: right; width: auto; margin-top: 0; margin-left: 38px; } } .product-tile-m-aside { height: auto; } .product-tile-m-aside .product-tile--hd { height: auto; } .product-tile-m-aside .product-tile--img { } @media screen and (max-width: 969px) { .product-tile-m-aside .product-tile--img { box-sizing: border-box; width: 100%; height: auto; } } .product-tile-m-aside .product-tile--img img { } @media screen and (max-width: 969px) { .product-tile-m-aside .product-tile--img img { width: 100%; } } .product-tile-m-aside .product-tile--price { } @media screen and (max-width: 969px) { .product-tile-m-aside .product-tile--price { box-sizing: border-box; padding-right: 95px; width: 100%; } } @media screen and (max-width: 639px) { .product-tile-m-aside .product-tile--price { box-sizing: border-box; padding-right: 0; width: auto; } } .product-tile-m-aside .product-tile--qty-input { } @media screen and (max-width: 969px) { .product-tile-m-aside .product-tile--qty-input { position: absolute; top: 0; right: 0; } } @media screen and (max-width: 639px) { .product-tile-m-aside .product-tile--qty-input { float: right; position: static; } } .product-tile-m-aside .product-tile--qty-select { } @media screen and (max-width: 969px) { .product-tile-m-aside .product-tile--qty-select { position: absolute; top: 0; right: 0; } } @media screen and (max-width: 639px) { .product-tile-m-aside .product-tile--qty-select { float: right; position: static; } } .product-tile-m-aside .product-tile--btn { } @media screen and (max-width: 969px) { .product-tile-m-aside .product-tile--btn { box-sizing: border-box; float: left; margin-left: 0; margin-top: 5px; width: 100%; } } @media screen and (max-width: 639px) { .product-tile-m-aside .product-tile--btn { float: right; width: auto; margin-top: 0; margin-left: 38px; } } .product-tile-m-aside .product-tile--btn .btn { } @media screen and (max-width: 969px) { .product-tile-m-aside .product-tile--btn .btn { box-sizing: border-box; width: 100%; height: 22px; text-align: center; } } @media screen and (max-width: 639px) { .product-tile-m-aside .product-tile--btn .btn { box-sizing: content-box; width: 50px; height: 20px; text-align: left; } } .product-tile-m-aside .product-tile--btn .ico-cart-small { } @media screen and (max-width: 969px) { .product-tile-m-aside .product-tile--btn .ico-cart-small { float: none; display: inline-block; } } @media screen and (max-width: 639px) { .product-tile-m-aside .product-tile--btn .ico-cart-small { float: left; display: block; } } .product-tile-m-aside .product-tile--btn .label { } @media screen and (max-width: 969px) { .product-tile-m-aside .product-tile--btn .label { float: none; display: inline-block; position: relative; top: -2px; } } @media screen and (max-width: 639px) { .product-tile-m-aside .product-tile--btn .label { float: left; display: block; position: static; } } /* 3.12. Img Banner */ /* ---------------- */ .img-banner { display: block; margin-bottom: 15px; background-color: #e4f2ff; } .img-banner img { display: block; width: 100%; max-width: 100%; } /* 3.13. Aside Text Panel */ /* ---------------------- */ .aside-txt-panel { padding: 0 10px; margin-bottom: 14px; } .aside-txt-panel--author { display: block; color: #2967b3; font-size: 1.4em; font-style: italic; font-weight: bold; text-align: right; } /* 3.14. Footer Panel */ /* ------------------ */ .footer-panel { padding: 15px 0; width: 958px; -webkit-box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); /* -webkit-box-shadow: inset 0px 0px 2px 1px #f5f5f5; box-shadow: inset 0px 0px 2px 1px #f5f5f5; */ border: 1px solid #FFF; -webkit-border-radius: 2px; border-radius: 2px; background: #FFF; } @media screen and (max-width: 969px) { .footer-panel { box-sizing: border-box; padding: 20px 15px; width: 100%; } } .footer-panel--col { float: left; padding: 5px 37px; height: 121px; border-left: 1px solid #e7e6e7; } @media screen and (max-width: 969px) { .footer-panel--col { padding: 5px 35px 0 0; margin-right: 35px; height: 110px; border-left: 0; border-right: 1px solid #e7e6e7; } } @media screen and (max-width: 639px) { .footer-panel--col { margin-right: 0; padding: 25px 0 0; width: 100%; height: auto; border-right: 0; } } .footer-panel--col:first-child { border-left: 0; border-right: 0; } @media screen and (max-width: 969px) { .footer-panel--col:first-child { box-sizing: border-box; padding: 0 0 20px; width: 100%; height: auto; } } @media screen and (max-width: 639px) { .footer-panel--col:first-child { padding-bottom: 0; } } .footer-panel--col:last-child { border-right: 0; margin-right: 0; } .footer-panel--logo { display: block; } @media screen and (max-width: 969px) { .footer-panel--logo { float: left; } } @media screen and (max-width: 639px) { .footer-panel--logo { float: none; margin-bottom: 12px; } } .footer-panel--contact { margin-left: 48px; } @media screen and (max-width: 969px) { .footer-panel--contact { float: left; line-height: 39px; } } @media screen and (max-width: 639px) { .footer-panel--contact { margin-left: 0; line-height: 1.5; } } .footer-panel--contact dt { margin-top: 5px; color: #969696; font-weight: bold; font-size: 13px; } @media screen and (max-width: 969px) { .footer-panel--contact dt { float: left; margin: 0 10px; } } @media screen and (max-width: 639px) { .footer-panel--contact dt { margin-left: 0; width: 40px; } } .footer-panel--contact dd { color: #EA6CB0; font-size: 13px; } @media screen and (max-width: 969px) { .footer-panel--contact dd { float: left; margin-right: 20px; } } @media screen and (max-width: 639px) { .footer-panel--contact dd { margin-right: 0; width: 200px; } } .footer-panel--contact a { font-size: 13px; } .footer-panel--hd { padding-top: 0; font-size: 20px; } .footer-panel--link-list { } .footer-panel--link-list li { margin-bottom: 4px; } .footer-panel--link-list a { font-size: 11px; } @media screen and (max-width: 639px) { .footer-panel--link-list a { font-size: 13px; } } /* 3.15. Logo, Copyright & By Line */ /* ------------------------------- */ .logo { display: block; width: 763px; height: 64px; } @media screen and (max-width: 969px) { .logo { width: 455px; height: 95px; } } @media screen and (max-width: 639px) { .logo { margin: 0 auto; width: 276px; height: 120px; } } .l-grid-hdr-logo .logo { margin: 15px 0 0 15px; } @media screen and (max-width: 969px) { .l-grid-hdr-logo .logo { margin: 10px 0 0; } } @media screen and (max-width: 639px) { .l-grid-hdr-logo .logo { margin: 0 auto; padding-top: 15px; } } .copyright-line { padding: 0 0 0 15px; height: 37px; font-size: 11px; line-height: 37px; } @media screen and (max-width: 969px) { .copyright-line { padding-left: 0; } } .by-line { padding-right: 15px; } @media screen and (max-width: 969px) { .by-line { padding-right: 0; } } .by-line .efinity { float: left; } .by-line--label { float: left; margin-right: 10px; padding-bottom: 0; padding-top: 0; height: 37px; font-size: 11px; line-height: 37px; } .efinity { width: 68px; height: 37px; background: transparent url(../Content/img/logo-efinity-color.png?v=2) no-repeat 0 0; } #l-footer .by-line {float: right;} /* 3.16. Iconed Link */ /* ----------------- */ .iconed-link { display: inline-block; } .iconed-link--ico { float: left; margin-right: 5px; } .iconed-link--label { float: left; height: 15px; line-height: 15px; } .iconed-link-m-reverse { } .iconed-link-m-reverse .iconed-link--ico { float: right; margin-left: 5px; margin-right: 0; } .iconed-link-m-reverse .iconed-link--label { float: right; } .iconed-link-m-back-to-list { display: block; padding: 15px 12px; border-top: 1px solid #e3e7ea; border-bottom: 1px solid #e3e7ea; background-color: #FFF; } @media screen and (max-width: 969px) { .iconed-link-m-back-to-list { float: right; background-color: transparent; padding: 10px 5px 10px 0; border: 0; } } /* 3.17. Product Filter */ .product-filter { -webkit-box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); box-shadow: 0px 0px 2px 3px rgba(204,204,204,0.2); } @media screen and (max-width: 969px) { .product-filter { padding: 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #FFF; overflow: hidden; } } .product-filter--hdr { padding: 12px 10px; width: 190px; border-top: 1px solid #ebe9ea; background: #FFF; position: relative; } @media screen and (max-width: 969px) { .product-filter--hdr { box-sizing: border-box; padding: 0; border-top: 0; width: 100%; } } .product-filter--hdr .js-link-clear-filter { position: absolute; top: 20px; right: 10px; } @media screen and (max-width: 969px) { .product-filter--hdr .js-link-clear-filter { top: 5px; right: 5px; } } .product-filter--hd { padding-bottom: 0; font-size: 2.4em; } @media screen and (max-width: 969px) { .product-filter--hd { display: inline-block; color: #ea6cb0; font-size: 1.8em; cursor: pointer; } } .product-filter--hd .fa { display: none; } @media screen and (max-width: 969px) { .product-filter--hd .fa { display: inline-block; margin-left: 10px; } } .product-filter--menu { border-top: 1px solid #ebe9ea; } @media screen and (min-width: 970px) { .product-filter--menu { display: block !important; /* NOTE: to ensure it will be displayed on desktop view */ } } @media screen and (max-width: 969px) { .product-filter--menu { display: none; padding-top: 10px; border-top: 0; } } .product-filter--category { padding: 12px 10px; width: 190px; border-top: 1px solid #ebe9ea; background: #FFF; color: #969696; } @media screen and (max-width: 969px) { .product-filter--category { box-sizing: border-box; width: 100%; } } .product-filter--category:first-child { border-top: 0; } @media screen and (max-width: 969px) { .product-filter--category:first-child { border-top: 1px solid #ebe9ea; } } .product-filter--category .opt-item-container { margin: 5px 0; } .product-filter--category .opt-item-container-float label { width: 140px; font-size: 12px; } @media screen and (max-width: 969px) { .product-filter--category .opt-item-container-float label { width: auto; } } .js .product-filter--category--hdr { cursor: pointer; } .product-filter--category--hd { color: #409cd9; font-size: 20px; } .product-filter--category--hdr .product-filter--category--hd { float: left; width: 165px; } .product-filter--category--hdr .ico-circle-15 { float: right; margin-top: 7px; } .js .product-filter--category--hd { cursor: pointer; } /* 3.18. Customer Service */ .customer-service--faq-list { padding: 0 10px; } .customer-service--faq-list a { display: block; padding: 3px 0; font-size: 1.3em; line-height: 1.3; } .customer-service--faq-list ul { margin-left: 10px; } .customer-service--faq-list li { } .customer-service--faq-list--questions { display: block; padding-bottom: 5px; } .customer-service--faq { padding: 15px 0; } .customer-service--faq--hd { color: #2B68B3; font-size: 2em; } .customer-service--faq--hdr .customer-service--faq--hd { float: left; width: 381px; } @media screen and (max-width: 969px) { .customer-service--faq--hdr .customer-service--faq--hd { float: none; width: auto; } } .customer-service--faq--hdr .js-link-to-top { margin-top: 5px; float: right; } @media screen and (max-width: 969px) { .customer-service--faq--hdr .js-link-to-top { float: none; margin-bottom: 5px; } } .customer-service--faq .cms-copy h3 { font-weight: bold; color: #595959; font-size: 1.2em; padding: 5px 0; } /* 3.19. Product Detail */ .product-detail { margin-bottom: 30px; } .product-detail--hd { font-size: 2.2em; color: #5a5a5a; } .product-detail--img { margin-bottom: 13px; width: 484px; height: 301px; overflow: hidden; -webkit-box-shadow: inset 0px 0px 2px 1px #CCC; box-shadow: inset 0px 0px 2px 1px #CCC; border: 1px solid #bebebe; background-color: #FFF; } @media screen and (max-width: 969px) { .product-detail--img { box-sizing: border-box; width: 100%; height: auto; } } .product-detail--img img { box-sizing: border-box; display: block; margin: 2px; } @media screen and (max-width: 969px) { .product-detail--img img { width: 100%; margin: 0; } } .product-detail--description { margin-bottom: 15px; } .product-detail--price { margin-bottom: 20px; color: #2967b2; height: 30px; } .product-detail--price .num { font-size: 30px; vertical-align: middle; } .product-detail--price .unit { margin-left: 5px; font-size: 13px; line-height: 100%; position: relative; z-index: 1; top: -5px; vertical-align: bottom; } .product-detail--cart--pack { float: left; margin-top: 1px; margin-right: 25px; } @media screen and (max-width: 969px) { .product-detail--cart--pack { margin-bottom: 15px; } } .product-detail--cart--qty { float: left; margin-right: 25px; } @media screen and (max-width: 969px) { .product-detail--cart--qty { margin-bottom: 15px; } } .product-detail--cart--qty label { float: left; padding: 0 10px 0 0; height: 22px; line-height: 22px; } .product-detail--cart--qty .text { float: left; width: 15px; height: 20px; line-height: 20px; text-align: center; } .product-detail--cart--btn { float: left; height: 22px; } /* 3.20. Blog Entry */ .blog-entry { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #ececec; } .blog-entry--title, .blog-entry--title a { color: #2a68b3; font-size: 20px; line-height: 1.2; } .blog-entry--meta { margin-top: 5px; margin-bottom: 10px; color: #EA6CB0; } .blog-entry--meta--date { float: left; font-size: 1.2em; } .blog-entry--meta--comments { float: right; } .blog-entry--meta--comments .iconed-link--label { height: 12px; line-height: 12px; } .blog-entry--img { display: block; margin-bottom: 10px; max-width: 100%; border: 1px solid #bebebe; } .blog-entry--act { padding-top: 15px; } .blog-entry--pagination { margin-bottom: 35px; } .blog-entry-m-single { border-bottom: 0; } /* 3.21. Blog Comment */ .blog-comment { margin: 15px 0; padding: 20px; width: 446px; border: 1px solid #bebebe; } @media screen and (max-width: 969px) { .blog-comment { box-sizing: border-box; width: 100%; } } .blog-comment:first-child { margin-top: 50px; } .blog-comment--hd { padding-bottom: 5px; color: #ea6cb0; font-size: 1.4em; } .blog-comment--meta { color: #999; font-size: 1.2em; } /* 3.22. Blog Form */ .blog-form {margin-top: 50px;} .blog-form--hd { padding-bottom: 20px; color: #5a5a5a; font-size: 2em; } .blog-form .btn {margin-top: 10px;} /* 3.23. Social Control Panel */ .social-share-panel { margin-bottom: 15px; } .social-share-panel a { height: 16px; line-height: 16px; text-decoration: underline; } .social-share-panel a:hover { text-decoration: none; } .social-share-panel li { float: left; margin-left: 5px; } @media screen and (max-width: 969px) { .social-share-panel li { float: left; margin-left: 10px; } } .social-share-panel li:first-child { margin-left: 10px; } @media screen and (max-width: 969px) { .social-share-panel li:first-child { margin-left: 15px; } } .social-share-panel--label { float: left; height: 16px; line-height: 16px; font-size: 12px; } /* 3.24. Shopping Cart */ .hide { display: none;} .tbl-area table {margin-bottom: 0;} .cart-table { } @media screen and (max-width: 969px) { .cart-table { width: 100%; } } .cart-table th { color: #9f9f9f; font-size: 18px; text-align: left; } .cart-table td { padding: 30px 5px; border-bottom: 1px solid #ebe9ea; font-size: 14px; font-weight: bold; } .cart-table a { font-size: 1em; } .cart-table .first-col { padding-left: 0; } .cart-table .last-col { text-align: right; } .cart-table--header { } @media screen and (max-width: 639px) { .cart-table--header { display: none; } } .cart-table--body { } .cart-table--body tr { } @media screen and (max-width: 639px) { .cart-table--body tr { box-sizing: border-box; display: block; margin-bottom: 15px; padding-left: 110px; padding-bottom: 15px; border-bottom: 1px solid #ebe9ea; position: relative; } } .cart-table--body td { } @media screen and (max-width: 639px) { .cart-table--body td { display: block; padding: 0; border: 0; } } .cart-table--footer { } @media screen and (max-width: 639px) { .cart-table--footer { display: block; position: relative; width: 290px; overflow: hidden; } } .cart-table--footer--confirm-row { } @media screen and (max-width: 639px) { .cart-table--footer--confirm-row { position: relative; display: block; } } .cart-table--footer--confirm-row td { } @media screen and (max-width: 639px) { .cart-table--footer--confirm-row td { display: block; } } .cart-table--img-col { } @media screen and (max-width: 639px) { .cart-table--img-col { position: absolute; top: 0; left: 0; } } td.cart-table--shipping-opt-col { } @media screen and (max-width: 639px) { td.cart-table--shipping-opt-col { padding: 5px 0 0; width: 100%; } } td.cart-table--shipping-opt-col select { width: 225px; } @media screen and (max-width: 639px) { td.cart-table--shipping-opt-col select { width: 100% } } td.cart-table--shipping-opt-info-col { } @media screen and (max-width: 639px) { td.cart-table--shipping-opt-info-col { padding: 5px 0 10px !important; border-bottom: 1px solid #ebe9ea !important; } } td.cart-table--shipping-opt-info-col-m-overseas { } @media screen and (max-width: 639px) { td.cart-table--shipping-opt-info-col-m-overseas { padding-bottom: 100px !important; } } td.cart-table--insurance-opt-col { } @media screen and (max-width: 639px) { td.cart-table--insurance-opt-col { padding: 0; width: 290px; position: absolute; top: -155px; left: 0; } } td.cart-table--insurance-opt-col select { width: 225px; } @media screen and (max-width: 639px) { td.cart-table--insurance-opt-col select { width: 100% } } td.cart-table--insurance-opt-info-col { } @media screen and (max-width: 639px) { td.cart-table--insurance-opt-info-col { padding: 0; position: absolute; top: -129px; left: 0; } } td.cart-tbl--details-col { width: 200px; padding-right: 50px; color: #2a68b3; } @media screen and (max-width: 969px) { td.cart-tbl--details-col { width: 180px; padding-right: 5px; } } @media screen and (max-width: 639px) { td.cart-tbl--details-col { padding-right: 0; padding-bottom: 5px; } } td.cart-tbl--item-price-col { } @media screen and (max-width: 639px) { td.cart-tbl--item-price-col { display: inline-block; height: 28px; line-height: 28px; } } td.cart-tbl--qty-col { } @media screen and (max-width: 639px) { td.cart-tbl--qty-col { display: inline-block; margin-left: 10px; } } .cart-tbl--qty-col--label { display: none; } @media screen and (max-width: 639px) { .cart-tbl--qty-col--label { display: inline-block; } } td.cart-tbl--act-col { } @media screen and (max-width: 639px) { td.cart-tbl--act-col { display: inline-block; margin-left: 10px; height: 28px; line-height: 28px; } } td.cart-tbl-act--col .cart-tbl--btn { float: right; } td.cart-tbl--price-col { color: #2a68b3; } @media screen and (max-width: 639px) { td.cart-tbl--price-col { padding-top: 10px; font-size: 16px; } } td.cart-tbl--total-price-col { color: #2a68b3; } @media screen and (max-width: 639px) { td.cart-tbl--total-price-col { padding: 0 0 10px !important; width: 75px; text-align: right; font-size: 16px; } } td.cart-tbl--total-price-col-m-confirm { } @media screen and (max-width: 639px) { td.cart-tbl--total-price-col-m-confirm { display: inline-block; padding: 10px 0 !important; width: 71px; } } td.cart-tbl--promo-code-col { } @media screen and (max-width: 639px) { td.cart-tbl--promo-code-col { padding: 0; width: 90px; } } td.cart-table--confirm-footer-blank-col { } @media screen and (max-width: 639px) { td.cart-table--confirm-footer-blank-col { display: none; } } td.cart-table-hd { color: #9f9f9f; font-weight: normal; } @media screen and (max-width: 639px) { td.cart-table-hd { padding-top: 0; } } .cart-table-hd-m-footer { } @media screen and (max-width: 639px) { .cart-table-hd-m-footer { padding: 0 25px 10px !important; width: 65px; } } .cart-table-hd-m-full { } @media screen and (max-width: 639px) { .cart-table-hd-m-full { padding: 0; width: 90px; } } td.cart-table-hd-m-shipping-method { } @media screen and (max-width: 639px) { td.cart-table-hd-m-shipping-method { padding-right: 0; width: 100%; } } td.cart-table-hd-m-confirm-footer-hd { } @media screen and (max-width: 639px) { td.cart-table-hd-m-confirm-footer-hd { display: inline-block; padding: 10px 25px 10px 51px !important; width: 140px; } } td.cart-table-hd-m-insurance-opt { } @media screen and (max-width: 639px) { td.cart-table-hd-m-insurance-opt { padding: 0; width: 290px; position: absolute; top: -180px; left: 0; } } .cart-table--img { width: 98px; height: auto; -webkit-box-shadow: inset 0px 0px 2px 1px #CCC; box-shadow: inset 0px 0px 2px 1px #CCC; border: 1px solid #bebebe; background-color: #FFF; } .cart-table--img img { display: block; margin: 2px; } .cart-table--form-promo { } .cart-table--form-promo .text { float: left; margin-right: 15px; } @media screen and (max-width: 639px) { .cart-table--form-promo .text { float: none; width: 90px; } } .cart-table--form-promo .btn { float: left; margin-top: 4px; margin-right: 15px; } @media screen and (max-width: 639px) { .cart-table--form-promo .btn { margin-top: 7px; } } .cart-table--form-promo--label { font-size: 18px; } @media screen and (max-width: 639px) { .cart-table--form-promo--label { padding-top: 0; width: 90px; font-size: 13px; line-height: 1.3; } } .cart-table--form-promo--label-m-error { color: #CC0000; } @media screen and (max-width: 639px) { .cart-table--form-promo--label-m-error { display: block; padding-bottom: 10px; } } .cart-table--total-row th { padding-bottom: 0; padding-top: 30px; } .cart-table--total-row td { padding-top: 0; } .cart-section { padding: 30px 0; border-bottom: 1px solid #EBE9EA; } .cart-section--address { float: left; margin-left: 100px; } @media screen and (max-width: 639px) { .cart-section--address { float: none; margin-left: 0; } } .cart-section--address:first-child { margin-left: 0; } @media screen and (max-width: 639px) { .cart-section--address { padding-bottom: 25px; } } .cart-table--sub-total-top-row { } .cart-table--sub-total-top-row td { padding-bottom: 0; border-bottom: 0; } .cart-table--sub-total-mid-row td { padding-top: 0; padding-bottom: 0; border-bottom: 0; } .cart-table--sub-total-bot-row td { padding-top: 0; border-bottom: 0; } .cart-table--airline-insurance td { padding-top: 0; border-bottom: 0; } .cart-table--grand-total-row { } .cart-table--grand-total-row td { border-top: 0; padding-top: 0; } .cart-table--grand-total-row-m-confirm { } @media screen and (max-width: 639px) { .cart-table--grand-total-row-m-confirm { border-bottom: 1px solid #ebe9ea; } } .cart-table--grand-total-row-m-confirm td { } @media screen and (max-width: 639px) { .cart-table--grand-total-row-m-confirm td { border-bottom: 0; } } input.cart-tbl--qty-input { width: 30px; text-align: center; font-size: 1em; } .message-box { width: auto; height: auto; border: 1px solid #2b68b3; border-radius: 10px; -moz-border-radius: 10px; padding:10px; } .cart-message { margin-bottom: 25px; border-bottom: 1px solid #EBE9EA; } .cart-message .cms-copy { padding-bottom: 25px; } .cart-questionnaire {padding-bottom: 30px;} #questionaire-other-interest-line, .cart-payment-note {display: none;} .cart-payment-option { float: left; } @media screen and (max-width: 639px) { .cart-payment-option { float: none; margin-bottom: 15px; } } .cart-payment-option select { width: 150px; } @media screen and (max-width: 639px) { .cart-payment-option select { width: 100%; } } .cart-payment-btn-cont { float: right; width: 400px; height: 22px; position: relative; } @media screen and (max-width: 639px) { .cart-payment-btn-cont { width: 100%; } } .cart-payment-btn-cont .btn { display: none; float: right; position: absolute; top: 0; right: 0; } @media screen and (max-width: 639px) { .cart-payment-btn-cont .btn { float: none; } } .cart-payment-note { padding-top: 30px; float: right; width: 400px; color: #2a68b3; } @media screen and (max-width: 639px) { .cart-payment-note { width: 100%; } } #bank-transfer-payment-line { padding: 10px 0; } /* 3.25. Overlay Elements */ .overlay { display: none; width: 100%; height: 100%; background: transparent url(../Content/img/bg-black-opa-80.png); position: fixed; top: 0; left: 0; z-index: 10000; } .d-box { min-width: 300px; max-width: 690px; background: #FFF; position: fixed; top: 50%; left: 50%; z-index: 10001; } @media screen and (max-width: 639px) { .d-box { min-width: 290px; max-width: 290px; } } .d-box--hdr { height: 40px; background-color: #ea6cb0; line-height: 35px; overflow: hidden; position: relative; z-index: 1; } .d-box--title { margin: 5px 0 0 0; padding: 0 56px 0 15px; height: 35px; background-color: #FFF; font-size: 1.4em; line-height: 35px; overflow: hidden; } .d-box--body { padding: 20px; color: #555; } .d-box--body-hd { font-size: 1.4em; font-weight: bold; } .d-box--close { width: 40px; height: 40px; border-left: 1px solid #bfc4c6; background-color: #FFF; color: #bfc4c6; font-size: 15px; line-height: 40px; text-align: center; position: absolute; top: 0; right: 0; z-index: 9999; } .d-box--close:hover { color: #ea6cb0; text-decoration: none; } /* 3.26. Table Responsive */ .tbl-responsive { width: 100%; overflow-x: auto; overflow-y: hidden; border: 1px solid #bebebe; -webkit-overflow-scrolling: touch; /* NOTE: Important for horizontal scrolling in IOS */ } .tbl-responsive table { margin-top: 0; margin-bottom: 0; border: 0 !important; } .tbl-responsive tr td:first-child, .tbl-responsive tr th:first-child { border-left: 0; } .tbl-responsive--note { font-style: italic; font-size: 12px; } .cms-copy .tbl-responsive { margin-top: 10px; } /* --------------------------------------------------- /* 4. 3RD PARTY COMPONENTS /* --------------------------------------------------- */ /*reCAPTCHA*/ .g-recaptcha iframe { transform: scale(.83); -webkit-transform: scale(.83); -moz-transform: scale(.83); -o-transform: scale(.83); -ms-transform: scale(.83); margin-left: -26px; } @media (min-width: 768px) { .g-recaptcha iframe { margin-left: -12px; transform: scale(.92); -webkit-transform: scale(.92); -moz-transform: scale(.92); -o-transform: scale(.92); -ms-transform: scale(.92); } } /* MailChimp Form Embed Code - Slim - 08/17/2011 /* --------------------------------------------------- */ #mc_embed_signup form { box-sizing: border-box; display: block; position: relative; text-align: left; padding: 10px; } #mc_embed_signup h2 { font-weight:bold; padding:0; margin:15px 0; font-size:1.4em; } #mc_embed_signup input { border:1px solid #999; -webkit-appearance:none; } #mc_embed_signup input[type=checkbox]{-webkit-appearance:checkbox;} #mc_embed_signup input[type=radio]{-webkit-appearance:radio;} #mc_embed_signup input:focus {border-color:#333;} #mc_embed_signup .button { clear:both; background-color: #aaa; border: 0 none; border-radius:4px; color: #FFFFFF; cursor: pointer; display: inline-block; font-size:15px; font-weight: bold; height: 32px; line-height: 32px; margin: 0 5px 10px 0; padding:0; text-align: center; text-decoration: none; vertical-align: top; white-space: nowrap; width: auto; } #mc_embed_signup .button:hover {background-color:#777;} #mc_embed_signup .small-meta {font-size: 11px;} #mc_embed_signup .nowrap {white-space:nowrap;} #mc_embed_signup .clear {clear:none; display:inline;} #mc_embed_signup label { display:block; font-size:16px; padding-bottom:10px; font-weight:bold; } #mc_embed_signup input.email { box-sizing: border-box; display: block; padding: 8px; margin-bottom: 10px; width: 100%; min-width:130px; font-size: 12px; } @media screen and (max-width: 969px) { #mc_embed_signup input.email { } } #mc_embed_signup input.button { display:block; width:35%; margin:0 0 10px 0; min-width:90px; } #mc_embed_signup div#mce-responses { float:left; top:-1.4em; padding:0em .5em 0em .5em; overflow:hidden; width:90%; margin: 0 5%; clear: both; } #mc_embed_signup div.response { margin:1em 0; padding:1em .5em .5em 0; font-weight:bold; float:left; top:-1.5em; z-index:1; width:80%; } #mc_embed_signup #mce-error-response {display:none;} #mc_embed_signup #mce-success-response {color:#529214; display:none;} #mc_embed_signup label.error { display:block; float:none; width:auto; margin-left:1.05em; text-align:left; padding:.5em 0; } #mc_embed_signup { background: #fff; clear: left; font: 14px Helvetica,Arial,sans-serif; } .text-input { position: absolute; left: -5000px; } /* Recaptcha (NOTE: overwriting original style) /* --------------------------------------------------- */ .recaptchatable { width: 100%; } @media screen and (max-width: 969px) { .recaptchatable { width: 100%; } } .recaptchatable td { } @media screen and (max-width: 969px) { .recaptchatable td { display: inline-block; } } .recaptchatable center { } @media screen and (max-width: 639px) { .recaptchatable center { display: inline-block !important; text-align: center !important; } } .recaptchatable .recaptcha_image_cell { } @media screen and (max-width: 639px) { .recaptchatable .recaptcha_image_cell { box-sizing: border-box; width: 100% !important; } } .recaptchatable #recaptcha_image { } @media screen and (max-width: 639px) { .recaptchatable #recaptcha_image { margin: 0 !important; width: 270px !important; text-align: left !important; } } .recaptchatable #recaptcha_challenge_image { } @media screen and (max-width: 639px) { .recaptchatable #recaptcha_challenge_image { width: 100%; } } .recaptchatable #recaptcha_response_field { font-size: 12px !important; } @media screen and (max-width: 639px) { .recaptchatable #recaptcha_response_field { width: 100% !important; } } .recaptchatable #recaptcha_privacy { display: block; } @media screen and (max-width: 969px) { .recaptchatable #recaptcha_privacy { padding: 0 10px 10px 10px; } } @media screen and (max-width: 639px) { .recaptchatable #recaptcha_privacy { padding: 5px 10px 10px 30px; } } .recaptchatable #recaptcha_privacy a { font-size: 12px; } /* --------------------------------------------------- /* 5. STATE & UTILITIES /* --------------------------------------------------- */ .s-hidden { display: none !important; } .u-relative { position: relative; } .u-no-margin-bottom { margin-bottom: 0; }