/** * Copyright © Magento, Inc. All rights reserved. * See COPYING.txt for license details. */ .ui-datepicker { display: none; z-index: 999999 !important; } .ui-datepicker .ui-datepicker-header { position: relative; padding: .2em 0; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top: 2px; width: 1.8em; height: 1.8em; cursor: pointer; } .ui-datepicker .ui-datepicker-next-hover span, .ui-datepicker .ui-datepicker-prev-hover span { border-color: transparent #ff8400 transparent transparent; } .ui-datepicker .ui-datepicker-prev { left: 2px; } .ui-datepicker .ui-datepicker-next { right: 2px; } .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -5px; font-size: 0px; width: 0px; height: 0px; border: solid; border-width: 5px 8px 5px 0; border-color: transparent #ff9635 transparent transparent; } .ui-datepicker .ui-datepicker-next span { margin-left: 0px; top: 50%; margin-top: -5px; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent #ff9635; } .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } .ui-datepicker .ui-datepicker-title select { font-size: 1em; margin: 1px 0; } .ui-datepicker select.ui-datepicker-month-year { width: 100%; } .ui-datepicker table { width: 100%; font-size: .9em; } .ui-datepicker td span, .ui-datepicker td a { display: block; padding: 4px; text-align: right; text-decoration: none; color: #000000; } .ui-datepicker .ui-datepicker-buttonpane button { float: right; } .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; } .ui-datepicker-rtl { direction: rtl; } .ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } .ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } .ui-datepicker-rtl .ui-datepicker-buttonpane { clear: right; } .ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float: right; } .ui-datepicker-rtl .ui-datepicker-group { float: right; } .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width: 0; border-left-width: 1px; } .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width: 0; border-left-width: 1px; } .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; } .ui-timepicker-div dl { text-align: left; } .ui-timepicker-div dl dt { height: 25px; margin-bottom: -22px; } .ui-timepicker-div dl .ui_tpicker_time_label { margin-bottom: -25px; } .ui-timepicker-div dl dd { margin: 0 10px 10px 65px; } .ui-timepicker-div td { font-size: 90%; } .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; } .ui-datepicker { padding: 15px; border: #ffffff 4px solid; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background: #efefef; -webkit-box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.35); box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.35); } .ui-datepicker .ui-datepicker-header { background: transparent; border: none; padding-bottom: 10px; } .ui-datepicker .ui-datepicker-title .ui-datepicker-month { width: 47%; margin-right: 6%; } .ui-datepicker .ui-datepicker-title .ui-datepicker-year { width: 47%; } .ui-datepicker .ui-datepicker-calendar td { border: #cfcfcf 1px solid; } .ui-datepicker .ui-datepicker-calendar td a { padding: 4px; display: block; } .ui-datepicker .ui-datepicker-calendar td .ui-state-hover { background: #f9eae7; } .ui-datepicker .ui-datepicker-calendar { background: #ffffff; border: #cfcfcf 1px solid; border-collapse: collapse; } .ui-datepicker .ui-datepicker-calendar th { background: #efefef; border: #cfcfcf 1px solid; padding: 4px; text-transform: uppercase; } .ui-datepicker .ui-datepicker-calendar .ui-datepicker-week-col { text-align: center; border: #cfcfcf 1px solid; } .ui-datepicker { width: auto; } .ui-datepicker .ui-datepicker-calendar .ui-datepicker-today { background: #f3d7d2; } .ui-datepicker .ui-datepicker-calendar .ui-state-active { background: #ffdf66; } .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; } .ui-timepicker-div dl { text-align: left; } .ui-timepicker-div dl dd { margin: 0 0 10px 65px; } .ui-timepicker-div td { font-size: 90%; } .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; } .ui-slider { position: relative; text-align: left; } .ui-slider-horizontal .ui-slider-handle { margin-left: -5px; } .ui-slider .ui-slider-handle { position: absolute; z-index: 2; cursor: default; } .ui-slider-horizontal { height: 10px; -webkit-border-radius: 10px; border-radius: 10px; border: none; background: #dadada; } .ui-slider-handle { height: 10px; width: 10px; -webkit-border-radius: 10px; border-radius: 10px; background: #f98b25; display: block; position: absolute; } .ui-timepicker-div { padding: 10px 0 5px 0; } .ui-datepicker .ui-datepicker-buttonpane { overflow: hidden; padding-top: 10px; border-top: #cfcfcf 1px solid; } .ui-datepicker .ui-datepicker-calendar .ui-state-disabled { background: #f9f9f9; } .ui-datepicker .ui-datepicker-calendar .ui-state-disabled span { color: #959595; } /* IE6 IFRAME FIX (taken from datepicker 1.5.3 */ .ui-datepicker-cover { position: absolute; /*must have*/ z-index: -1; /*must have*/ filter: mask(); /*must have*/ top: -4px; /*must have*/ left: -4px; /*must have*/ width: 200px; /*must have*/ height: 200px; /*must have*/ } .slick-dots li button:focus,.slick-dots li button:hover,.slick-list:focus{outline:0}.slick-list,.slick-slider,.slick-track{display:block;position:relative}.slick-loading .slick-slide,.slick-loading .slick-track{visibility:hidden}.slick-list{overflow:hidden;margin:0;padding:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{top:0;left:0;margin:0 auto}.slick-track:after,.slick-track:before{display:table;content:''}.slick-slide,.slick-slide.slick-loading img{display:none}.slick-track:after{clear:both}.slick-slide{float:left;height:100%;min-height:1px;vertical-align:middle}[dir=rtl] .slick-slide{float:right}.slick-slide.dragging img{pointer-events:none}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}.slick-loading .slick-list{position:relative;background:0 0}.slick-loading .slick-list:before{position:absolute;top:50%;left:50%;display:block;content:'';border-radius:100%;border-style:solid;border-width:3px;height:25px;width:25px;border-color:rgba(0,0,0,.2);border-top-color:#5c5c5c;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);animation:loading 1s infinite linear}@keyframes loading{0%{-webkit-transform:translate(-50%,-50%) rotate(0);transform:translate(-50%,-50%) rotate(0)}100%{-webkit-transform:translate(-50%,-50%) rotate(359.9deg);transform:translate(-50%,-50%) rotate(359.9deg)}}.slick-next.slick-disabled,.slick-prev.slick-disabled{opacity:.25}.slick-dotted.slick-slider{margin-bottom:30px}.slick-dots{position:absolute;left:0;display:block;width:100%;padding:0;margin:0;list-style:none;text-align:center}.slick-dots li{position:relative;display:inline-block;width:20px;height:20px;margin:0 5px;padding:0;cursor:pointer}.slick-dots li button,.slick-slider .slick-arrow{display:block;cursor:pointer;outline:0;box-shadow:none}.slick-dots li button{font-size:0;line-height:0;width:20px;height:20px;padding:5px;color:transparent;border:0;background:0 0}.slick-dots li button:focus:before,.slick-dots li button:hover:before{opacity:1}.slick-dots li button:before{font-size:16px;line-height:20px;position:absolute;top:0;left:0;width:20px;height:20px;content:'•';text-align:center;opacity:.25;color:#000;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.slick-dots li.slick-active button:before{opacity:.75;color:#000}.slick-slider{box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent;padding:0 20px}.slick-slider .slick-arrow{position:absolute;top:50%;padding:0;width:15px;height:22px;font-size:0;line-height:0;-webkit-transform:translate(0,-50%);-moz-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);color:transparent;border:none;background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMjIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0uMi40QTEgMSAwIDAgMSAxLjYuMmwxMiAxMGExIDEgMCAwIDEgMCAxLjZsLTEyIDEwYTEgMSAwIDAgMS0xLjItMS42TDExLjMzMyAxMSAuNCAxLjhBMSAxIDAgMCAxIC4yLjR6IiBmaWxsPSIjQzRDNEM0Ii8+PC9zdmc+) center no-repeat !important;-webkit-transition:background .3s ease;-moz-transition:background .3s ease;-ms-transition:background .3s ease;transition:background .3s ease}.slick-slider .slick-arrow:after,.slick-slider .slick-arrow:before{content:''}.slick-slider .slick-arrow:hover{background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMjIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0uMi40QTEgMSAwIDAgMSAxLjYuMmwxMiAxMGExIDEgMCAwIDEgMCAxLjZsLTEyIDEwYTEgMSAwIDAgMS0xLjItMS42TDExLjMzMyAxMSAuNCAxLjhBMSAxIDAgMCAxIC4yLjR6IiBmaWxsPSIjMTYxNjE2Ii8+PC9zdmc+) center no-repeat}.slick-slider .slick-arrow.slick-next{right:0}.slick-slider .slick-arrow.slick-prev{left:0;-webkit-transform:rotate(180deg) translate(0,50%);-moz-transform:rotate(180deg) translate(0,50%);-ms-transform:rotate(180deg) translate(0,50%);transform:rotate(180deg) translate(0,50%)}.slick-initialized .slick-slide{float:none!important;display:inline-block!important;height:auto;}.product-items.slick-slider>.slick-list{padding:15px 0}.product-items.slick-slider .slick-slide .product-item{display:block!important;margin:auto!important;max-width:205px}.sidebar.sidebar-additional{width:100%}/** * Swiper 5.4.5 * Most modern mobile touch slider and framework with hardware accelerated transitions * http://swiperjs.com * * Copyright 2014-2020 Vladimir Kharlampidi * * Released under the MIT License * * Released on: June 16, 2020 */ @font-face{font-family:swiper-icons;src:url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}.swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-container-multirow>.swiper-wrapper{flex-wrap:wrap}.swiper-container-multirow-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-container-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-container-3d{perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-container-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(-1 * var(--swiper-navigation-size)/ 2);z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;text-transform:none;font-variant:initial;line-height:1}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{left:10px;right:auto}.swiper-button-prev:after,.swiper-container-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{right:10px;left:auto}.swiper-button-next:after,.swiper-container-rtl .swiper-button-prev:after{content:'next'}.swiper-button-next.swiper-button-white,.swiper-button-prev.swiper-button-white{--swiper-navigation-color:#ffffff}.swiper-button-next.swiper-button-black,.swiper-button-prev.swiper-button-black{--swiper-navigation-color:#000000}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0px,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white{--swiper-pagination-color:#ffffff}.swiper-pagination-black{--swiper-pagination-color:#000000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;animation:swiper-preloader-spin 1s infinite linear;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden} .sms-redem-glass { } .sms-redem-glass div[class*="col-"] { } .sms-redem-glass img { display: block; margin: 0 auto 0; } .sms-redem-glass a.bunton { /* background: #e50019; margin: 0 auto; color: #fff; padding: 8px 15px; border-radius: 8px; margin-top: 30px!important; margin-bottom: 20px; */ } .sms-redem-glass { background: #231f20; } .sms-container input:invalid { border: 1px dashed red; } .sms-box { position: fixed; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 99; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; background: rgb(0 0 0 / 70%); } .sms-redem-glass .col-md-6 { text-align: center; } .sms-container { padding: 30px; background: #fff; box-shadow: 3px 4px 11px 3px rgb(0 0 0 / 36%); max-width: 400px; min-width: 400px; position: relative; } .sms-container button { display: block; background: #e50019; color: #fff; margin: 15px auto; border-radius: 7px; } .sms-container a { text-decoration: underline; } .sms-container label { line-height: 1.4; } .box-input input.error { border: 1px dashed red; } .sms-container .close { width: 30px; height: 30px; border: 1px solid #000; border-radius: 50%; position: absolute; right: 10px; top: 10px; } .sms-container .close:before { content: ''; display: block; width: 20px; height: 2px; background: red; position: absolute; transform: rotate(45deg); top: 13px; margin: 0 auto; left: 0; right: 0; } .sms-container .close:after { content: ''; display: block; width: 20px; height: 2px; background: red; position: absolute; transform: rotate(-45deg); top: 13px; margin: 0 auto; left: 0; right: 0; } a.read-btn { background: #e50019; color: #fff!important; display: block; text-align: center; padding: 10px; border-radius: 10px; margin: 15px; } .redem-term-condition { margin: 50px 0 0; border: 1px solid #ccc; padding: 30px; } @media (max-width: 595px){ .sms-redem-glass .col-md-6 { width: 50%; } .sms-container { max-width: 90%; min-width: initial; } }/** * prism.js default theme for JavaScript, CSS and HTML */ code[class*="language-"], pre[class*="language-"] { color: black; text-shadow: 0 1px white; font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; } pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection, code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection { text-shadow: none; background: #b3d4fc; } pre[class*="language-"]::selection, pre[class*="language-"] ::selection, code[class*="language-"]::selection, code[class*="language-"] ::selection { text-shadow: none; background: #b3d4fc; } @media print { code[class*="language-"], pre[class*="language-"] { text-shadow: none; } } /* Code blocks */ pre[class*="language-"] { padding: 1em; margin: .5em 0; overflow: auto; } :not(pre) > code[class*="language-"], pre[class*="language-"] { background: #f5f2f0; } /* Inline code */ :not(pre) > code[class*="language-"] { padding: .1em; border-radius: .3em; } .token.comment, .token.prolog, .token.doctype, .token.cdata { color: slategray; } .token.punctuation { color: #999; } .namespace { opacity: .7; } .token.property, .token.tag, .token.boolean, .token.number, .token.constant, .token.symbol { color: #905; } .token.selector, .token.attr-name, .token.string, .token.builtin { color: #690; } .token.operator, .token.entity, .token.url, .language-css .token.string, .style .token.string, .token.variable { color: #a67f59; background: hsla(0,0%,100%,.5); } .token.atrule, .token.attr-value, .token.keyword { color: #07a; } .token.regex, .token.important { color: #e90; } .token.important { font-weight: bold; } .token.entity { cursor: help; } .intl-tel-input { position: relative; display: block; } .intl-tel-input * { box-sizing: border-box; -moz-box-sizing: border-box; } .intl-tel-input .hide { display: none; } .intl-tel-input .v-hide { visibility: hidden; } .intl-tel-input input, .intl-tel-input input[type=text], .intl-tel-input input[type=tel] { position: relative; z-index: 0; margin-top: 0 !important; margin-bottom: 0 !important; padding-right: 36px; margin-right: 0; border: 2px solid #d2dae2; border-radius: 6px; max-width: 600px; padding-right: 50px; box-shadow: 0px 3px 8.55px 0.45px rgba(0, 0, 0, 0.21); height: 40px !important; font-size: 12px; font-family: Montserrat-Bold; } .intl-tel-input .country-list { z-index:9999 !important; } .intl-tel-input .flag-container { position: absolute; top: 0; bottom: 0; right: 0; padding: 1px; } .modal { z-index: 9999999999 !important; } .intl-tel-input .selected-flag { z-index: 1; position: relative; width: 36px; height: 100%; padding: 0 0 0 8px; } .intl-tel-input .selected-flag .iti-flag { position: absolute; top: 0; bottom: 0; margin: auto; } .intl-tel-input .selected-flag .iti-arrow { position: absolute; top: 50%; margin-top: -2px; right: 6px; width: 0; height: 0; border-left: 3px solid transparent; border-right: 3px solid transparent; border-top: 4px solid #555; } .intl-tel-input .selected-flag .iti-arrow.up { border-top: none; border-bottom: 4px solid #555; } .intl-tel-input .country-list { position: absolute; z-index: 2; list-style: none; text-align: left; padding: 0; margin: 0 0 0 -1px; box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2); background-color: white; border: 1px solid #CCC; white-space: nowrap; max-height: 200px; overflow-y: scroll; } .intl-tel-input .country-list.dropup { bottom: 100%; margin-bottom: -1px; } .intl-tel-input .country-list .flag-box { display: inline-block; width: 20px; } @media (max-width: 500px) { .intl-tel-input .country-list { white-space: normal; } } .intl-tel-input .country-list .divider { padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px solid #CCC; } .intl-tel-input .country-list .country { padding: 5px 10px; } .intl-tel-input .country-list .country .dial-code { color: #999; } .intl-tel-input .country-list .country.highlight { background-color: rgba(0, 0, 0, 0.05); } .intl-tel-input .country-list .flag-box, .intl-tel-input .country-list .country-name, .intl-tel-input .country-list .dial-code { vertical-align: middle; } .intl-tel-input .country-list .flag-box, .intl-tel-input .country-list .country-name { margin-right: 6px; } .intl-tel-input.allow-dropdown input, .intl-tel-input.allow-dropdown input[type=text], .intl-tel-input.allow-dropdown input[type=tel], .intl-tel-input.separate-dial-code input, .intl-tel-input.separate-dial-code input[type=text], .intl-tel-input.separate-dial-code input[type=tel] { padding-right: 6px; padding-left: 52px; margin-left: 0; } .intl-tel-input.allow-dropdown .flag-container, .intl-tel-input.separate-dial-code .flag-container { right: auto; left: 0; } .intl-tel-input.allow-dropdown .selected-flag, .intl-tel-input.separate-dial-code .selected-flag { width: 46px; } .intl-tel-input.allow-dropdown .flag-container:hover { cursor: pointer; } .intl-tel-input.allow-dropdown .flag-container:hover .selected-flag { background-color: rgba(0, 0, 0, 0.05); } .intl-tel-input.allow-dropdown input[disabled] + .flag-container:hover, .intl-tel-input.allow-dropdown input[readonly] + .flag-container:hover { cursor: default; } .intl-tel-input.allow-dropdown input[disabled] + .flag-container:hover .selected-flag, .intl-tel-input.allow-dropdown input[readonly] + .flag-container:hover .selected-flag { background-color: transparent; } .intl-tel-input.separate-dial-code .selected-flag { background-color: rgba(0, 0, 0, 0.05); display: table; } .intl-tel-input.separate-dial-code .selected-dial-code { display: table-cell; vertical-align: middle; padding-left: 28px; } .intl-tel-input.separate-dial-code.iti-sdc-2 input, .intl-tel-input.separate-dial-code.iti-sdc-2 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-2 input[type=tel] { padding-left: 66px; } .intl-tel-input.separate-dial-code.iti-sdc-2 .selected-flag { width: 60px; } .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 input[type=tel] { padding-left: 76px; } .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 .selected-flag { width: 70px; } .intl-tel-input.separate-dial-code.iti-sdc-3 input, .intl-tel-input.separate-dial-code.iti-sdc-3 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-3 input[type=tel] { padding-left: 74px; } .intl-tel-input.separate-dial-code.iti-sdc-3 .selected-flag { width: 68px; } .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input[type=tel] { padding-left: 84px; } .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 .selected-flag { width: 78px; } .intl-tel-input.separate-dial-code.iti-sdc-4 input, .intl-tel-input.separate-dial-code.iti-sdc-4 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-4 input[type=tel] { padding-left: 82px; } .intl-tel-input.separate-dial-code.iti-sdc-4 .selected-flag { width: 76px; } .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 input[type=tel] { padding-left: 92px; } .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 .selected-flag { width: 86px; } .intl-tel-input.separate-dial-code.iti-sdc-5 input, .intl-tel-input.separate-dial-code.iti-sdc-5 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-5 input[type=tel] { padding-left: 90px; } .intl-tel-input.separate-dial-code.iti-sdc-5 .selected-flag { width: 84px; } .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 input[type=tel] { padding-left: 100px; } .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 .selected-flag { width: 94px; } .intl-tel-input.iti-container { position: absolute; top: -1000px; left: -1000px; z-index: 1060; padding: 1px; } .intl-tel-input.iti-container:hover { cursor: pointer; } .iti-mobile .intl-tel-input.iti-container { top: 30px; bottom: 30px; left: 30px; right: 30px; position: fixed; } .iti-mobile .intl-tel-input .country-list { max-height: 100%; width: 100%; } .iti-mobile .intl-tel-input .country-list .country { padding: 10px 10px; line-height: 1.5em; } .iti-flag { width: 20px; } .iti-flag.be { width: 18px; } .iti-flag.ch { width: 15px; } .iti-flag.mc { width: 19px; } .iti-flag.ne { width: 18px; } .iti-flag.np { width: 13px; } .iti-flag.va { width: 15px; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .iti-flag { background-size: 5652px 15px; } } .iti-flag.ac { height: 10px; background-position: 0px 0px; } .iti-flag.ad { height: 14px; background-position: -22px 0px; } .iti-flag.ae { height: 10px; background-position: -44px 0px; } .iti-flag.af { height: 14px; background-position: -66px 0px; } .iti-flag.ag { height: 14px; background-position: -88px 0px; } .iti-flag.ai { height: 10px; background-position: -110px 0px; } .iti-flag.al { height: 15px; background-position: -132px 0px; } .iti-flag.am { height: 10px; background-position: -154px 0px; } .iti-flag.ao { height: 14px; background-position: -176px 0px; } .iti-flag.aq { height: 14px; background-position: -198px 0px; } .iti-flag.ar { height: 13px; background-position: -220px 0px; } .iti-flag.as { height: 10px; background-position: -242px 0px; } .iti-flag.at { height: 14px; background-position: -264px 0px; } .iti-flag.au { height: 10px; background-position: -286px 0px; } .iti-flag.aw { height: 14px; background-position: -308px 0px; } .iti-flag.ax { height: 13px; background-position: -330px 0px; } .iti-flag.az { height: 10px; background-position: -352px 0px; } .iti-flag.ba { height: 10px; background-position: -374px 0px; } .iti-flag.bb { height: 14px; background-position: -396px 0px; } .iti-flag.bd { height: 12px; background-position: -418px 0px; } .iti-flag.be { height: 15px; background-position: -440px 0px; } .iti-flag.bf { height: 14px; background-position: -460px 0px; } .iti-flag.bg { height: 12px; background-position: -482px 0px; } .iti-flag.bh { height: 12px; background-position: -504px 0px; } .iti-flag.bi { height: 12px; background-position: -526px 0px; } .iti-flag.bj { height: 14px; background-position: -548px 0px; } .iti-flag.bl { height: 14px; background-position: -570px 0px; } .iti-flag.bm { height: 10px; background-position: -592px 0px; } .iti-flag.bn { height: 10px; background-position: -614px 0px; } .iti-flag.bo { height: 14px; background-position: -636px 0px; } .iti-flag.bq { height: 14px; background-position: -658px 0px; } .iti-flag.br { height: 14px; background-position: -680px 0px; } .iti-flag.bs { height: 10px; background-position: -702px 0px; } .iti-flag.bt { height: 14px; background-position: -724px 0px; } .iti-flag.bv { height: 15px; background-position: -746px 0px; } .iti-flag.bw { height: 14px; background-position: -768px 0px; } .iti-flag.by { height: 10px; background-position: -790px 0px; } .iti-flag.bz { height: 14px; background-position: -812px 0px; } .iti-flag.ca { height: 10px; background-position: -834px 0px; } .iti-flag.cc { height: 10px; background-position: -856px 0px; } .iti-flag.cd { height: 15px; background-position: -878px 0px; } .iti-flag.cf { height: 14px; background-position: -900px 0px; } .iti-flag.cg { height: 14px; background-position: -922px 0px; } .iti-flag.ch { height: 15px; background-position: -944px 0px; } .iti-flag.ci { height: 14px; background-position: -961px 0px; } .iti-flag.ck { height: 10px; background-position: -983px 0px; } .iti-flag.cl { height: 14px; background-position: -1005px 0px; } .iti-flag.cm { height: 14px; background-position: -1027px 0px; } .iti-flag.cn { height: 14px; background-position: -1049px 0px; } .iti-flag.co { height: 14px; background-position: -1071px 0px; } .iti-flag.cp { height: 14px; background-position: -1093px 0px; } .iti-flag.cr { height: 12px; background-position: -1115px 0px; } .iti-flag.cu { height: 10px; background-position: -1137px 0px; } .iti-flag.cv { height: 12px; background-position: -1159px 0px; } .iti-flag.cw { height: 14px; background-position: -1181px 0px; } .iti-flag.cx { height: 10px; background-position: -1203px 0px; } .iti-flag.cy { height: 14px; background-position: -1225px 0px; } .iti-flag.cz { height: 14px; background-position: -1247px 0px; } .iti-flag.de { height: 12px; background-position: -1269px 0px; } .iti-flag.dg { height: 10px; background-position: -1291px 0px; } .iti-flag.dj { height: 14px; background-position: -1313px 0px; } .iti-flag.dk { height: 15px; background-position: -1335px 0px; } .iti-flag.dm { height: 10px; background-position: -1357px 0px; } .iti-flag.do { height: 14px; background-position: -1379px 0px; } .iti-flag.dz { height: 14px; background-position: -1401px 0px; } .iti-flag.ea { height: 14px; background-position: -1423px 0px; } .iti-flag.ec { height: 14px; background-position: -1445px 0px; } .iti-flag.ee { height: 13px; background-position: -1467px 0px; } .iti-flag.eg { height: 14px; background-position: -1489px 0px; } .iti-flag.eh { height: 10px; background-position: -1511px 0px; } .iti-flag.er { height: 10px; background-position: -1533px 0px; } .iti-flag.es { height: 14px; background-position: -1555px 0px; } .iti-flag.et { height: 10px; background-position: -1577px 0px; } .iti-flag.eu { height: 14px; background-position: -1599px 0px; } .iti-flag.fi { height: 12px; background-position: -1621px 0px; } .iti-flag.fj { height: 10px; background-position: -1643px 0px; } .iti-flag.fk { height: 10px; background-position: -1665px 0px; } .iti-flag.fm { height: 11px; background-position: -1687px 0px; } .iti-flag.fo { height: 15px; background-position: -1709px 0px; } .iti-flag.fr { height: 14px; background-position: -1731px 0px; } .iti-flag.ga { height: 15px; background-position: -1753px 0px; } .iti-flag.gb { height: 10px; background-position: -1775px 0px; } .iti-flag.gd { height: 12px; background-position: -1797px 0px; } .iti-flag.ge { height: 14px; background-position: -1819px 0px; } .iti-flag.gf { height: 14px; background-position: -1841px 0px; } .iti-flag.gg { height: 14px; background-position: -1863px 0px; } .iti-flag.gh { height: 14px; background-position: -1885px 0px; } .iti-flag.gi { height: 10px; background-position: -1907px 0px; } .iti-flag.gl { height: 14px; background-position: -1929px 0px; } .iti-flag.gm { height: 14px; background-position: -1951px 0px; } .iti-flag.gn { height: 14px; background-position: -1973px 0px; } .iti-flag.gp { height: 14px; background-position: -1995px 0px; } .iti-flag.gq { height: 14px; background-position: -2017px 0px; } .iti-flag.gr { height: 14px; background-position: -2039px 0px; } .iti-flag.gs { height: 10px; background-position: -2061px 0px; } .iti-flag.gt { height: 13px; background-position: -2083px 0px; } .iti-flag.gu { height: 11px; background-position: -2105px 0px; } .iti-flag.gw { height: 10px; background-position: -2127px 0px; } .iti-flag.gy { height: 12px; background-position: -2149px 0px; } .iti-flag.hk { height: 14px; background-position: -2171px 0px; } .iti-flag.hm { height: 10px; background-position: -2193px 0px; } .iti-flag.hn { height: 10px; background-position: -2215px 0px; } .iti-flag.hr { height: 10px; background-position: -2237px 0px; } .iti-flag.ht { height: 12px; background-position: -2259px 0px; } .iti-flag.hu { height: 10px; background-position: -2281px 0px; } .iti-flag.ic { height: 14px; background-position: -2303px 0px; } .iti-flag.id { height: 14px; background-position: -2325px 0px; } .iti-flag.ie { height: 10px; background-position: -2347px 0px; } .iti-flag.il { height: 15px; background-position: -2369px 0px; } .iti-flag.im { height: 10px; background-position: -2391px 0px; } .iti-flag.in { height: 14px; background-position: -2413px 0px; } .iti-flag.io { height: 10px; background-position: -2435px 0px; } .iti-flag.iq { height: 14px; background-position: -2457px 0px; } .iti-flag.ir { height: 12px; background-position: -2479px 0px; } .iti-flag.is { height: 15px; background-position: -2501px 0px; } .iti-flag.it { height: 14px; background-position: -2523px 0px; } .iti-flag.je { height: 12px; background-position: -2545px 0px; } .iti-flag.jm { height: 10px; background-position: -2567px 0px; } .iti-flag.jo { height: 10px; background-position: -2589px 0px; } .iti-flag.jp { height: 14px; background-position: -2611px 0px; } .iti-flag.ke { height: 14px; background-position: -2633px 0px; } .iti-flag.kg { height: 12px; background-position: -2655px 0px; } .iti-flag.kh { height: 13px; background-position: -2677px 0px; } .iti-flag.ki { height: 10px; background-position: -2699px 0px; } .iti-flag.km { height: 12px; background-position: -2721px 0px; } .iti-flag.kn { height: 14px; background-position: -2743px 0px; } .iti-flag.kp { height: 10px; background-position: -2765px 0px; } .iti-flag.kr { height: 14px; background-position: -2787px 0px; } .iti-flag.kw { height: 10px; background-position: -2809px 0px; } .iti-flag.ky { height: 10px; background-position: -2831px 0px; } .iti-flag.kz { height: 10px; background-position: -2853px 0px; } .iti-flag.la { height: 14px; background-position: -2875px 0px; } .iti-flag.lb { height: 14px; background-position: -2897px 0px; } .iti-flag.lc { height: 10px; background-position: -2919px 0px; } .iti-flag.li { height: 12px; background-position: -2941px 0px; } .iti-flag.lk { height: 10px; background-position: -2963px 0px; } .iti-flag.lr { height: 11px; background-position: -2985px 0px; } .iti-flag.ls { height: 14px; background-position: -3007px 0px; } .iti-flag.lt { height: 12px; background-position: -3029px 0px; } .iti-flag.lu { height: 12px; background-position: -3051px 0px; } .iti-flag.lv { height: 10px; background-position: -3073px 0px; } .iti-flag.ly { height: 10px; background-position: -3095px 0px; } .iti-flag.ma { height: 14px; background-position: -3117px 0px; } .iti-flag.mc { height: 15px; background-position: -3139px 0px; } .iti-flag.md { height: 10px; background-position: -3160px 0px; } .iti-flag.me { height: 10px; background-position: -3182px 0px; } .iti-flag.mf { height: 14px; background-position: -3204px 0px; } .iti-flag.mg { height: 14px; background-position: -3226px 0px; } .iti-flag.mh { height: 11px; background-position: -3248px 0px; } .iti-flag.mk { height: 10px; background-position: -3270px 0px; } .iti-flag.ml { height: 14px; background-position: -3292px 0px; } .iti-flag.mm { height: 14px; background-position: -3314px 0px; } .iti-flag.mn { height: 10px; background-position: -3336px 0px; } .iti-flag.mo { height: 14px; background-position: -3358px 0px; } .iti-flag.mp { height: 10px; background-position: -3380px 0px; } .iti-flag.mq { height: 14px; background-position: -3402px 0px; } .iti-flag.mr { height: 14px; background-position: -3424px 0px; } .iti-flag.ms { height: 10px; background-position: -3446px 0px; } .iti-flag.mt { height: 14px; background-position: -3468px 0px; } .iti-flag.mu { height: 14px; background-position: -3490px 0px; } .iti-flag.mv { height: 14px; background-position: -3512px 0px; } .iti-flag.mw { height: 14px; background-position: -3534px 0px; } .iti-flag.mx { height: 12px; background-position: -3556px 0px; } .iti-flag.my { height: 10px; background-position: -3578px 0px; } .iti-flag.mz { height: 14px; background-position: -3600px 0px; } .iti-flag.na { height: 14px; background-position: -3622px 0px; } .iti-flag.nc { height: 10px; background-position: -3644px 0px; } .iti-flag.ne { height: 15px; background-position: -3666px 0px; } .iti-flag.nf { height: 10px; background-position: -3686px 0px; } .iti-flag.ng { height: 10px; background-position: -3708px 0px; } .iti-flag.ni { height: 12px; background-position: -3730px 0px; } .iti-flag.nl { height: 14px; background-position: -3752px 0px; } .iti-flag.no { height: 15px; background-position: -3774px 0px; } .iti-flag.np { height: 15px; background-position: -3796px 0px; } .iti-flag.nr { height: 10px; background-position: -3811px 0px; } .iti-flag.nu { height: 10px; background-position: -3833px 0px; } .iti-flag.nz { height: 10px; background-position: -3855px 0px; } .iti-flag.om { height: 10px; background-position: -3877px 0px; } .iti-flag.pa { height: 14px; background-position: -3899px 0px; } .iti-flag.pe { height: 14px; background-position: -3921px 0px; } .iti-flag.pf { height: 14px; background-position: -3943px 0px; } .iti-flag.pg { height: 15px; background-position: -3965px 0px; } .iti-flag.ph { height: 10px; background-position: -3987px 0px; } .iti-flag.pk { height: 14px; background-position: -4009px 0px; } .iti-flag.pl { height: 13px; background-position: -4031px 0px; } .iti-flag.pm { height: 14px; background-position: -4053px 0px; } .iti-flag.pn { height: 10px; background-position: -4075px 0px; } .iti-flag.pr { height: 14px; background-position: -4097px 0px; } .iti-flag.ps { height: 10px; background-position: -4119px 0px; } .iti-flag.pt { height: 14px; background-position: -4141px 0px; } .iti-flag.pw { height: 13px; background-position: -4163px 0px; } .iti-flag.py { height: 11px; background-position: -4185px 0px; } .iti-flag.qa { height: 8px; background-position: -4207px 0px; } .iti-flag.re { height: 14px; background-position: -4229px 0px; } .iti-flag.ro { height: 14px; background-position: -4251px 0px; } .iti-flag.rs { height: 14px; background-position: -4273px 0px; } .iti-flag.ru { height: 14px; background-position: -4295px 0px; } .iti-flag.rw { height: 14px; background-position: -4317px 0px; } .iti-flag.sa { height: 14px; background-position: -4339px 0px; } .iti-flag.sb { height: 10px; background-position: -4361px 0px; } .iti-flag.sc { height: 10px; background-position: -4383px 0px; } .iti-flag.sd { height: 10px; background-position: -4405px 0px; } .iti-flag.se { height: 13px; background-position: -4427px 0px; } .iti-flag.sg { height: 14px; background-position: -4449px 0px; } .iti-flag.sh { height: 10px; background-position: -4471px 0px; } .iti-flag.si { height: 10px; background-position: -4493px 0px; } .iti-flag.sj { height: 15px; background-position: -4515px 0px; } .iti-flag.sk { height: 14px; background-position: -4537px 0px; } .iti-flag.sl { height: 14px; background-position: -4559px 0px; } .iti-flag.sm { height: 15px; background-position: -4581px 0px; } .iti-flag.sn { height: 14px; background-position: -4603px 0px; } .iti-flag.so { height: 14px; background-position: -4625px 0px; } .iti-flag.sr { height: 14px; background-position: -4647px 0px; } .iti-flag.ss { height: 10px; background-position: -4669px 0px; } .iti-flag.st { height: 10px; background-position: -4691px 0px; } .iti-flag.sv { height: 12px; background-position: -4713px 0px; } .iti-flag.sx { height: 14px; background-position: -4735px 0px; } .iti-flag.sy { height: 14px; background-position: -4757px 0px; } .iti-flag.sz { height: 14px; background-position: -4779px 0px; } .iti-flag.ta { height: 10px; background-position: -4801px 0px; } .iti-flag.tc { height: 10px; background-position: -4823px 0px; } .iti-flag.td { height: 14px; background-position: -4845px 0px; } .iti-flag.tf { height: 14px; background-position: -4867px 0px; } .iti-flag.tg { height: 13px; background-position: -4889px 0px; } .iti-flag.th { height: 14px; background-position: -4911px 0px; } .iti-flag.tj { height: 10px; background-position: -4933px 0px; } .iti-flag.tk { height: 10px; background-position: -4955px 0px; } .iti-flag.tl { height: 10px; background-position: -4977px 0px; } .iti-flag.tm { height: 14px; background-position: -4999px 0px; } .iti-flag.tn { height: 14px; background-position: -5021px 0px; } .iti-flag.to { height: 10px; background-position: -5043px 0px; } .iti-flag.tr { height: 14px; background-position: -5065px 0px; } .iti-flag.tt { height: 12px; background-position: -5087px 0px; } .iti-flag.tv { height: 10px; background-position: -5109px 0px; } .iti-flag.tw { height: 14px; background-position: -5131px 0px; } .iti-flag.tz { height: 14px; background-position: -5153px 0px; } .iti-flag.ua { height: 14px; background-position: -5175px 0px; } .iti-flag.ug { height: 14px; background-position: -5197px 0px; } .iti-flag.um { height: 11px; background-position: -5219px 0px; } .iti-flag.un { height: 14px; background-position: -5241px 0px; } .iti-flag.us { height: 11px; background-position: -5263px 0px; } .iti-flag.uy { height: 14px; background-position: -5285px 0px; } .iti-flag.uz { height: 10px; background-position: -5307px 0px; } .iti-flag.va { height: 15px; background-position: -5329px 0px; } .iti-flag.vc { height: 14px; background-position: -5346px 0px; } .iti-flag.ve { height: 14px; background-position: -5368px 0px; } .iti-flag.vg { height: 10px; background-position: -5390px 0px; } .iti-flag.vi { height: 14px; background-position: -5412px 0px; } .iti-flag.vn { height: 14px; background-position: -5434px 0px; } .iti-flag.vu { height: 12px; background-position: -5456px 0px; } .iti-flag.wf { height: 14px; background-position: -5478px 0px; } .iti-flag.ws { height: 10px; background-position: -5500px 0px; } .iti-flag.xk { height: 15px; background-position: -5522px 0px; } .iti-flag.ye { height: 14px; background-position: -5544px 0px; } .iti-flag.yt { height: 14px; background-position: -5566px 0px; } .iti-flag.za { height: 14px; background-position: -5588px 0px; } .iti-flag.zm { height: 14px; background-position: -5610px 0px; } .iti-flag.zw { height: 10px; background-position: -5632px 0px; } .iti-flag { width: 20px; height: 15px; box-shadow: 0px 0px 1px 0px #888; background-image: url("../../frontend/Sm/market/th_TH/Magecomp_Mobilelogin/img/flags.png"); background-repeat: no-repeat; background-color: #DBDBDB; background-position: 20px 0; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .iti-flag { background-image: url("../../frontend/Sm/market/th_TH/Magecomp_Mobilelogin/img/flags@2x.png"); } } .iti-flag.np { background-color: transparent; } #error-msg { color: red; } #valid-msg { color: #00C900; } input.error { border: 1px solid #FF7C7C; }/* The Modal (background) */ @font-face { font-family: Montserrat-Bold; src: url(../../frontend/Sm/market/th_TH/Magecomp_Mobilelogin/font/Montserrat-Bold.ttf) } @font-face { font-family: Montserrat-Regular; src: url(../../frontend/Sm/market/th_TH/Magecomp_Mobilelogin/font/Montserrat-Regular.ttf) } #blankerror, #mobileNotValid, #otpNotValid, #validmsg, #reg_mob_error_msg, #reg-sms-please-wait, #regi_otp_cont, #reg-submit-please-wait, #checkforgototperror, #blankerror_forgorpass, #forgotmobileerror, #mobile-forgot-email, #valid-msg, #forgot-mob-error-msg, #forgot-sms-please-wait, #otp-cont, #passresetbyotp, #passresetbyemail, #forgot-sms-verify-please-wait, #forgototpverify, #checkforgototperror, #blankerror_forgot1, #forgot-sms-verify-please-wait, #setnewpass, #passmatcherror, #resetpassvalidation, #blankerror_forgot2, #set-new-pass-please-wait { display: none; } #loginotpmobbtnerror, #loginsendotperror, #updatepasssuccess, #sendemail_success, #checkloginotperror, #emptyotp, #valid-msg, #login-mob-error-msg, #login-sms-please-wait, #loginotpverify, #login-verify-please-wait { display: none; } #notice { margin-left: 44px !important; } #forgotmob-div { float: left; width: 100%; } #updatepasssuccess, #sendemail_success, #emailpasswrong_error1, #progress-indicator { display: none; } #form-list { padding: 0; } #input-box-login, #input-box-password { position: relative; } #notice1 { margin-left: 5px; } #progress_indecator { float: right; } #blankpage_customer_register, #mobileNotValid, #reg-sms-please-wait, #otpverify, #reg-otp-verify-please-wait, #customer-progress-indicator { display: none; } #sending { display: none; cursor: pointer; } #submitbtnajax1 { float: left; } #submitbtnajax { float: left; } #emailpasswrong_msg, #customer-login-please-wait { display: none; } #updatemobile_img { display: none; } .modal { display: none; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 9999999999; /* Sit on top */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ overflow: auto; /* Enable scroll if needed */ background-color: rgb(0, 0, 0); /* Fallback color */ background-color: rgba(0, 0, 0, 0.71); /* Black w/ opacity */ } .left { float: left !important; margin-right: 15px; } .mobile-modal-content .input-text { } select:focus { outline: none; } .modal .error1 { color: #f44242; padding: 9px; margin-top: 10px; clear: both; } .modal .success { color: #30b201; font-weight: 600; width: 90%; padding: 2px; clear: both; } .customer-progress-indicator { background-color: rgba(0, 0, 0, 0.5); height: 100%; left: 0; position: absolute; text-align: center; top: 0; width: 100%; z-index: 10003; } .customer-please-wait { display: block; left: 50%; position: absolute; top: 50%; } .page_title { color: #169fc8; font-family: Montserrat-Bold; font-size: 30px; font-variant-caps: all-small-caps; font-weight: bold; text-align: center; } .modal .page-title { color: #169fc8; font-family: Montserrat-Bold; font-size: 30px; font-variant-caps: all-small-caps; font-weight: bold; text-align: center; } .modal .error span { font-size: 12px; margin-left: 11px; } .mobile-modal-content .form-list { margin: 0; padding: 0; text-align: center; } .modal .button { font-weight: bold !important; } /* Modal Content/Box */ .mobile-modal-content { background-color: #ffffff; font-family: Montserrat-Regular; height: 550px; left: 0; margin: 0 auto; padding: 20px; position: absolute; right: 0; top: 25%; max-width: 460px; } .ajax-register-form .ultimate, .ajax-forgot-form .ultimate, .ajax-login-form .ultimate { width: 800px; height: 600px; } .ultimate { background-color: #ffffff; left: 0; margin: 0 auto; position: absolute; right: 0; top: 25%; font-family: Montserrat-Regular; } .submitbtnajax, .progress-indicator { text-align: center; } .ultimate .email, .ultimate .mobilenumber { width: 100% !important; } .ultimate .notice { margin-left: 5px; margin-bottom: 10px; } .progress-indicator { /*margin-right: 53px;*/ } .mobile-modal-content .progress-indicator { } .model-bottom { float: left; margin-top: 30px; width: 100%; } .notice { font-size: 11px; } .submitbtnajax { margin: 0 auto; width: 97px; } .buttons-set a:hover { text-decoration: none !important; } /* The Close Button */ .close { color: #000; font-size: 26px; font-weight: bold; position: absolute; right: 10px; } .closediv { float: right; height: 20px; position: relative; right: -20px; text-align: center; top: -10px; vertical-align: middle; } .mobile-modal-content .action { background-color: rgb(255, 255, 255); border: medium none; border-radius: 8px; box-shadow: 0 3px 13.05px 1.95px rgba(0, 0, 0, 0.21); color: #169fc8; font-family: Montserrat-Bold; font-size: 26px; height: 50px; text-transform: uppercase; width: 100%; padding: 0; } .mobbtn { background-color: rgb(255, 255, 255); border: medium none; border-radius: 6px; box-shadow: 0 3px 13.05px 1.95px rgba(0, 0, 0, 0.21); color: #169fc8; font-family: Montserrat-Bold; height: 40px; text-transform: uppercase; width: 100%; padding: 0; max-width: 150px; } .ajax-register-form .sendotp { float: right; } .progress-indicator.forgot-mobile-progress-indicator { float: right !important; margin-right: 60px; margin-top: 18px; } .forogotlink a { color: #169fc8; font-size: 12px; } .close:hover, .close:focus { text-decoration: none; cursor: pointer; } .ajax-login-form .mobile-modal-content { font-family: Montserrat-Regular; height: auto; /* max-width: 550px; width: 60%;*/ } .right { float: left; padding: 20px; width: 53%; } .leftimg { float: left; height: 100%; object-fit: cover; width: 100%; display: inline-block; } .closediv-ultimate { float: right; height: 20px; position: relative; right: -25px; text-align: center; top: -10px; vertical-align: middle; width: 20px; } .register-ultimate { float: left; font-size: 11px; margin-left: 24px; } .leftimage { float: left; width: 47%; height: 600px; max-width: 330px; } .ajax-register-form .ultimate .leftimage { height: 600px !important; } /*.ajax-register-form .mobile-modal-content { width: 41%; } .ajax-forgot-form .mobile-modal-content { width: 41%; }*/ .reg-form { /* margin-left: 8%;*/ } .register { font-size: 12px; } .reg-form .register { margin-top: 10px; font-size: 12px; } .reg-form .reginput { width: 47%; float: left; margin-bottom: 12px; } .setnewpass .reginput { margin-bottom: 12px; } /* For Login Type Tab Start */ #myModal input::-webkit-input-placeholder { color: grey !important; } #myModal input:-moz-placeholder { /* Firefox 18- */ color: grey !important; } #myModal input::-moz-placeholder { /* Firefox 19+ */ color: grey !important; } #myModal input:-ms-input-placeholder { color: red !important; } #login-type { height: 33px; padding-right: 2px; margin-top: 30px; margin-bottom: 0px; padding-left: 0px; margin-left: 9px; } #login-type li { float: left; list-style: none; outline: none; width: 49%; text-align: center; } #login-type li a { font-family: Arial, Helvetica, sans-serif; font-size: small; font-weight: bold; color: #5685bc;; padding-top: 12px; padding-left: 7px; padding-right: 7px; padding-bottom: 6%; display: block; background: #FFF; text-decoration: none; outline: none; text-transform: uppercase; font-size: 13px !important; background-color: #169fc8 !important; color: white; border-radius: 6px; box-shadow: 0 3px 13.05px 1.95px rgba(0, 0, 0, 0.21); font-family: Montserrat-Regular; } #login-type .login-type-last { margin-left: 2% !important; } #login-type li a.inactive { padding-top: 12px; padding-bottom: 5.4%; padding-left: 8px; padding-right: 8px; color: #333 !important; background: #EEE !important; outline: none; text-transform: uppercase; box-shadow: none !important; } #login-type li a:hover, #tabs li a.inactive:hover { color: #169fc8 !important; outline: none; background-color: rgb(255, 255, 255) !important; border: medium none; border-radius: 8px; color: #169fc8; box-shadow: 0 3px 13.05px 1.95px rgba(0, 0, 0, 0.21) !important; } .login-container h2 { margin-left: 15px; margin-right: 15px; margin-bottom: 10px; color: #5685bc; } .login-container p { margin-left: 15px; margin-right: 15px; margin-top: 10px; margin-bottom: 10px; line-height: 1.3; font-size: small; } .login-container ul { margin-left: 4px; font-size: small; line-height: 1.4; list-style-type: disc; } .login-container li { padding-bottom: 5px; margin-left: 5px; } /* For Login Type Tab End */ /* for custom drop down */ .custom-select { position: relative; font-family: Arial; width: 26%; float: left; border: 2px solid #d2dae2; border-radius: 8px; box-shadow: 0 3px 13.05px 1.95px rgba(0, 0, 0, 0.21); font-weight: bold; margin-bottom: 31px; margin-left: 5%; margin-right: 2%; } .custom-select select { display: none; /*hide original SELECT element:*/ } .select-selected { background-color: white; border-radius: 8px; } /*style the arrow inside the select element:*/ .select-selected:after { position: absolute; content: ""; top: 14px; right: 10px; width: 0; height: 0; border: 6px solid transparent; border-color: #000 transparent transparent transparent; } /*point the arrow upwards when the select box is open (active):*/ .select-selected.select-arrow-active:after { border-color: transparent transparent #fff transparent; top: 7px; } /*style the items (options), including the selected item:*/ .select-items div, .select-selected { padding: 8px 16px; border: 1px solid transparent; cursor: pointer; user-select: none; } .select-items { background-color: rgb(255, 255, 255); border: medium none; box-shadow: 0 3px 13.05px 1.95px rgba(0, 0, 0, 0.21); font-family: Montserrat-Bold; border-radius: 4px; } /*style items (options):*/ .select-items { position: absolute; background-color: white; top: 100%; left: 0; right: 0; z-index: 99; } /*hide the items when the select box is closed:*/ .select-hide { display: none; } .select-items div:hover, .same-as-selected { background-color: rgba(0, 0, 0, 0.1); } /* */ .reset-type { border: 2px solid #d2dae2; border-radius: 8px; box-shadow: 0 3px 13.05px 1.95px rgba(0, 0, 0, 0.21); float: none; font-weight: bold; height: 43px; margin-bottom: 31px; margin-left: 5%; margin-right: 2%; width: 28%; } .reset-msg { font-size: 14px; float: left; width: 64%; } .reg-form .send-otp-button { float: right; margin-right: 0.5%; margin-bottom: 12px; } .ultimate .reg-form .send-otp-button { margin-right: 0.5% !important; } #ajaxlogin-forgot-window .send-otp-button { float: right; margin-right: 9.5%; margin-bottom: 12px; margin-top: 18px; } #ajaxlogin-forgot-window .reset-passwd { /* float: right;*/ } .reg-form .otp-content { width: 100%; margin: 0; } .reg-form .even { margin-left: 6%; } .ajax-forgot-form .mobile-modal-content { height: 550px; } .modal input[type="text"], .modal input[type="password"] { border: 2px solid #d2dae2; border-radius: 6px; max-width: 600px; padding-right: 50px; box-shadow: 0px 3px 8.55px 0.45px rgba(0, 0, 0, 0.21); height: 40px !important; font-size: 12px; font-family: Montserrat-Bold; } .reg-submit { padding-top: 0px; width: 190px !important; } .registraionform .content { margin-top: 23px !important; } .create-account-page-main-div .progress-indicator { float: left; position: absolute; } .create-account-resend-otp { float: right; cursor: pointer; } .create-account-page-main-div .error { color: #e02b27; } .ajax-register-form .error { color: #903; } .forgotmobileerror { color: #903; } #forgotmob { font-family: Montserrat-Regular !important; } .option { background-color: rgb(255, 255, 255); border: medium none; border-radius: 8px; box-shadow: 0 3px 13.05px 1.95px rgba(0, 0, 0, 0.21); color: #169fc8; font-family: Montserrat-Bold; height: 50px; text-transform: uppercase; } .mobileotpsenderror, .checkotperror, .mobileExist, .regcontollererror { display: none; } .forogotlink { float: right; } .modal .button { font-weight: bold; } .modal .buttons-set button.button { float: right; } .modal .buttons-set { margin: 31px auto 80px; max-width: 510px; width: 88%; } .mobile-modal-content .buttons-set { margin: 31px auto 80px !important; max-width: 578px !important; width: 100% !important; } .modal .buttons-set-ultimate { margin: 31px auto 80px; max-width: 450px; width: 95%; font-size: 12px; } .ajax-login-form ul li { list-style: outside none none !important; } .login-window .content { margin-top: 47px; } .register { float: left; } .notice { margin-left: 3px; margin-bottom: 10px; } .ajax-login-form .mobile-modal-content .notice, .ajax-forgot-form .mobile-modal-content .notice { margin-left: 43px; margin-bottom: 10px; text-align: left; margin-top: 10px; } label.reset-msg { line-height: 40px; } .passresetbyemail { margin-right: 8.5%; } input.forgotverifyotp.reset-password.mobbtn { width: 140px !important; } .forgotverifyotp.reset-password .model-bottom { width: 95% !important; float: none !important; } .ajax-login-form .mobile-modal-content .notice { margin-left: 6px !important; } .ajax-login-form .ultimate .notice, .ajax-forgot-form .ultimate .notice { margin-left: 40px; margin-bottom: 10px; text-align: left; margin-top: 10px; } .ajax-forgot-form .ultimate .notice { margin-left: 40px !important; } .modal input[type="text"]::-moz-placeholder, .modal input[type="password"]::-moz-placeholder { color: #313131; font-family: Montserrat-Regular; opacity: 1; } .modal input[type="text"]::-webkit-input-placeholder, .modal input[type="password"]::-webkit-input-placeholder { color: #000; font-family: Montserrat-Regular; } .createlinking { color: #fa6000 !important; } .loginlink { margin: 0 auto; width: 97px; } .mobbtn { font-size: 13px !important; background-color: #169fc8; color: white; } .ajax-register-form .verifyotp { max-width: 192px !important; } .user-icon, .pass-icon { background-image: url("../../frontend/Sm/market/th_TH/Magecomp_Mobilelogin/images/icons.png"); background-repeat: no-repeat; padding: 20px; position: absolute; right: 4px; top: -18px; } .user-icon { background-position: -15px 10px; } .pass-icon { background-position: -104px 11px; } .close { background-image: url("../../frontend/Sm/market/th_TH/Magecomp_Mobilelogin/images/icons.png"); background-position: -65px -2px; padding: 11px; } .ajax-login-form .page-title { margin-top: 20px; } .otp-content { margin: 30px auto 0; width: 83%; } .loginotpverify { float: left; width: 100%; } .info { margin: 29px auto 0; width: 85%; } .loginotpverify .submitbtnajax { width: 250px; } .info > p { margin-bottom: 0; } .form-create-account .info { margin: 0; width: 100%; } .form-create-account .otp-content { margin: 0; width: 100%; } .form-create-account .submitbtnajax { width: 0; } .mobbtn:hover { background-color: rgb(255, 255, 255) !important; border: medium none; border-radius: 8px; color: #169fc8; font-family: Montserrat-Bold; padding: 0; text-transform: uppercase; } .reg-email, .reg-mobile { width: 100% !important; } .forgotsendotp.mobbtn { float: right; } @media screen and (max-width: 1500px) { .ultimate { top: 5%; } .mobile-modal-content { top: 2%; } } @media screen and (max-width: 768px) { .ajax-login-form .mobile-modal-content, .ajax-register-form .mobile-modal-content, .ajax-forgot-form .mobile-modal-content { width: 95%; } .ajax-register-form .ultimate, .ajax-forgot-form .ultimate, .ajax-login-form .ultimate { width: 95%; } .right { width: 46%; } } @media screen and (max-width: 650px) { .ajax-login-form .mobile-modal-content, .ajax-register-form .mobile-modal-content, .ajax-forgot-form .mobile-modal-content { width: 85%; } .ajax-register-form .ultimate, .ajax-forgot-form .ultimate, .ajax-login-form .ultimate { width: 85%; } .leftimage { display: none; } .right { padding: 0px; } .ajax-login-form .ultimate { max-width: 550px; width: 80%; } .right { width: 100%; float: left; margin: 0 auto; } .closediv-ultimate { top: -6px; } .ultimate { padding: 20px; } .ajax-login-form .right { float: left; margin: 0 auto; padding: 7px; width: 93%; } } @media screen and (max-width: 585px) { .forogotlink { font-size: 12px; float: left; width: 100%; } } @media screen and (max-width: 480px) { .ajax-login-form .mobile-modal-content, .ajax-register-form .mobile-modal-content, .ajax-forgot-form .mobile-modal-content { width: 85%; height: auto; } #login-type li a { padding-bottom: 8.7%; font-size: 11px !important; } #login-type li a.inactive { padding-bottom: 7.7%; } .modal .buttons-set { width: 100%; } .mobile-modal-content .input-text { height: 55px !important; } .forogotlink { font-size: 12px; float: left; width: 100%; } .modal .buttons-set { font-size: 12px; } .mobile-modal-content { top: 3%; } .reset-type { margin-top: 10px; margin-left: 0px; } .reg-form { margin-left: 0; } .reg-form .reginput { width: 100% !important; } .ultimate .reg-form .reginput { width: 98% !important; } .reg-form .even { margin-left: 0; } .reg-form .otp-content { width: 100%; } .reg-form .send-otp-button { margin-right: 1%; } } /** * Mageplaza * * NOTICE OF LICENSE * * This source file is subject to the Mageplaza.com license that is * available through the world-wide-web at this URL: * https://www.mageplaza.com/LICENSE.txt * * DISCLAIMER * * Do not edit or add to this file if you wish to upgrade this extension to newer * version in the future. * * @category Mageplaza * @package Mageplaza_Shopbybrand * @copyright Copyright (c) Mageplaza (https://www.mageplaza.com/) * @license https://www.mageplaza.com/LICENSE.txt */ .brand-container { margin: 0 20px; } .brand-image-container, .brand-description-container, .brand-cms-container { margin-bottom: 20px; } .brand-image-container .brand-image-photo { display: block; height: auto; max-width: 100%; } .product-list-container.brand-list-container { border-top: solid 1px #dfdfdf; padding-top: 20px; } .block-brand-search { padding: 15px; background-color: #0ed08e; text-align: center; color: #fff; } .block-brand-search .block-title { font-size: 3.5em; display: block; margin-top: 20px; margin-bottom: 10px; text-align: center; font-weight: normal; } .block-brand-search .block-content { margin-bottom: 40px; margin-top: 1em; } .block-brand-search .block-content .mp-searchbox { position: relative; max-width: 790px; text-align: left; margin: 0 auto; } .block-brand-search .search-btn { display: inline-block; background: none; -moz-box-sizing: content-box; border: 0; box-shadow: none; line-height: inherit; margin: 0; padding: 0; text-decoration: none; text-shadow: none; font-weight: 400; position: absolute; right: 20px; top: 0; z-index: 1; height: 61px !important; } .block-brand-search .search-btn > span { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .block-brand-search .search-btn:before { -webkit-font-smoothing: antialiased; font-size: 39px; line-height: 61px; color: #8f8f8f; margin: 0; vertical-align: top; display: inline-block; font-weight: normal; overflow: hidden; speak: none; text-align: center; } @media (max-width: 500px) { .block-brand-search .search-btn:before { -webkit-font-smoothing: antialiased; font-size: 25px; line-height: 61px; color: #8f8f8f; margin: 0; vertical-align: top; display: inline-block; font-weight: normal; overflow: hidden; text-align: center; } } .block-brand-search .block-content .mp-searchbox .form-control { display: block; width: 100%; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out .15s; padding: 20px 10px 20px 50px !important; height: auto !important; } @media (max-width: 500px) { .block-brand-search .block-content .mp-searchbox .form-control { display: block; width: 100%; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out .15s; padding: 20px 10px 20px 15px !important; height: auto !important; } } .ui-autocomplete { position: absolute; top: 100%; left: 0; z-index: 1000; float: left; display: none; min-width: 160px; _width: 160px; padding: 4px 0; margin: 2px 0 0 0; list-style: none; background-color: #ffffff; border-color: #ccc; border-color: rgba(0, 0, 0, 0.2); border-style: solid; border-width: 1px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; *border-right-width: 2px; *border-bottom-width: 2px; } .autocomplete-suggestions { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #ddd; background: #FFF; cursor: default; overflow: auto; -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); border-top: 0; padding: 10px 0; } .autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; } .autocomplete-no-suggestion { padding: 2px 5px; } .autocomplete-selected { background: #F0F0F0; } .autocomplete-suggestions strong { font-weight: bold; color: #000; } .autocomplete-group { padding: 2px 5px; font-weight: bold; font-size: 16px; color: #000; display: block; border-bottom: 1px solid #000; } .autocomplete-suggestion a.shopbybrand-suggestion:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .autocomplete-suggestion a.shopbybrand-suggestion .shopbybrand-suggestion-left, .autocomplete-suggestion a.shopbybrand-suggestion .shopbybrand-suggestion-right { float: left; padding: 5px 10px; } .shopbybrand-product-name { font-size: 18px; color: #333333; } .shopbybrand-product-des { color: #333333; } .block-brand-feature .block-content .owl-carousel { width: calc(100% - 40px); margin: auto; } .page-layout-1column .column.main { width: 100% !important; } .block-brand-feature .owl-carousel .owl-item img { height: 200px; } .block-brand-list ul.brand-options { list-style-type: none; } .block-brand-list ul.brand-options:after, .block-brand-list .brand-mix-container:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .block-brand-list ul.brand-options li { border: 1px solid #ddd; position: relative; min-width: 38px; float: left; margin-bottom: 5px; margin-left: 2px; } .block-brand-list ul.brand-options li#mp-first-opt { border-left: 1px solid #ddd; } .block-brand-list ul.brand-options li.active { background: #0ed08e; color: #ffffff; } .block-brand-list ul.brand-options li.control { cursor: pointer; } .block-brand-list ul.brand-options li.disabled { cursor: not-allowed; } .block-brand-list ul.brand-options a.mp-option-item { color: inherit; position: relative; display: block; padding: 10px 14px; line-height: 20px; text-decoration: none; } .block-brand-list ul.brand-options li.disabled a { color: #777; opacity: 0.5; } .block-brand-list .mp-filter.mix { float: left; margin: 5px; } .block-brand-list .mp-filter.mix .mp-label { text-align: center; padding: 10px; } .products { margin: 15px 0 !important; } .brand-list-content { width: 97%; float: right; } .brand-list-content ol { display: flex; flex-wrap: wrap; } .column.main .product-items { margin-left: 0 !important; } .product-list-container .brand-char-title { float: left; font-weight: 700; font-size: 22px; width: 3%; margin-top: 10px; } .block-brand-feature .brand-image { display: unset; } #quick-view .brand_title { float: left; padding: 10px 0; width: 100%; text-align: center; font-size: 24px; font-weight: 700; } #quick-view .related-product-modal-title { float: left; padding: 10px 0; width: 100%; text-align: center; font-size: 24px; font-weight: 700; } .related-product-modal-content .toolbar-products { position: inherit !important; } .related-product-modal-content ol { display: flex; flex-wrap: wrap; } .related-product-modal-content .product-item-info { width: 90%; } @media (max-width: 769px) { #quick-view .related-product-modal-title { float: left; padding: 10px 0; width: 100%; text-align: center; font-size: 24px; font-weight: 700; border-bottom: solid 1px #dfdfdf; margin-bottom: 15px; } .related-product-modal-content .toolbar-products { position: relative !important; } } #quick-view .brand-info-container { float: left; width: 30%; padding: 0 25px; } #quick-view .related-product-container { float: left; width: 60%; } .limiter { display: none; } .quickview_popup a { color: #dfdfdf; } @media (max-width: 603px) { #quick-view .brand-info-container { float: left; width: 100%; padding: 0; } #quick-view .related-product-container { float: left; width: 100%; } } .img-content { float: left; width: 100%; text-align: center; margin: 15px 0; } .img-content img { width: 250px; } .brand_description { clear: both; } .brand-information .product-image-container { margin-top: 25px; } .shopbybrand-product-des p { white-space: nowrap; width: 90px; overflow: hidden; text-overflow: ellipsis; } @media (min-width: 480px) { .shopbybrand-product-des p { white-space: nowrap; width: 255px; overflow: hidden; text-overflow: ellipsis; } } @media (min-width: 720px) { .shopbybrand-product-des p { white-space: nowrap; width: 480px; overflow: hidden; text-overflow: ellipsis; } } @media (min-width: 1024px) { .shopbybrand-product-des p { white-space: nowrap; width: 640px; overflow: hidden; text-overflow: ellipsis; } } #category-brand-menu ul { list-style-type: none; margin: 0; padding: 0; } #category-brand-subtitle { display: block; } #block-category-brand-container { border-bottom: solid 1px #ccc; } .block-brand-feature .relate-content { text-align: center } .block-brand-feature .relate-content a { color: #333 } .block-brand-feature .relate-content a span { display: block; margin-top: 10px } @media only screen and (max-width: 767px) { .page-with-filter .columns .sidebar-main { width: 100% } } #thumbnail-brand-subtitle { display: block; } #block-brand-thumbnail-container { border-bottom: solid 1px #ccc; padding-bottom: 10px; } #brand-thumbnail-menu ul { list-style-type: none; margin: 0; padding: 0; } #brand-thumbnail-menu li a { display: block; color: #000; padding: 3px 0; text-decoration: none; } #brand-thumbnail-menu li span { display: block; padding: 8px 8px 8px 50px; } .brand-items { padding-bottom: 4px; } .ln_overlay { background-color: #FFFFFF; height: 100%; left: 0; opacity: 0.5; filter: alpha(opacity=50); position: absolute; top: 0; width: 100%; z-index: 555; display: none; } .loader img { top: 40%; left: 45%; display: block; position: fixed; } .ln_slider_container { width: calc(100% - 20px); margin: 0 15px 0 5px; } .brand-topmenu-image { width: 40px; height: 30px; float: left; padding: 2px 5px; } @media (max-width: 768px) { .nav-bottom-item li { width: 100%; text-align: center; } } .owl-carousel.brand-carousel .owl-item img { height: 200px; } .page-layout-1column .column.main { width: 100% !important; } @media (max-width: 600px) { .brand-detail .product-item-photo { width: 100%; float: left; text-align: center; } .brand-detail .product-item-details { float: left; } } /** * Mageplaza * * NOTICE OF LICENSE * * This source file is subject to the mageplaza.com license that is * available through the world-wide-web at this URL: * https://www.mageplaza.com/LICENSE.txt * * DISCLAIMER * * Do not edit or add to this file if you wish to upgrade this extension to newer * version in the future. * * @category Mageplaza * @package Mageplaza_Core * @copyright Copyright (c) Mageplaza (https://www.mageplaza.com/) * @license https://www.mageplaza.com/LICENSE.txt */ .row-mp { min-height: 1px; margin: 0 -10px; } .col-mp { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-background-clip: padding-box !important; -webkit-background-clip: padding-box !important; background-clip: padding-box !important; float: left; padding: 0 10px; } /*All*/ .mp-1 { width: 8.33333333333%; } .mp-2 { width: 16.6666666667%; } .mp-3 { width: 25.0%; } .mp-4 { width: 33.3333333333%; } .mp-5 { width: 41.6666666667%; } .mp-6 { width: 50.0%; } .mp-7 { width: 58.3333333333%; } .mp-8 { width: 66.6666666667%; } .mp-9 { width: 75.0%; } .mp-10 { width: 83.3333333333%; } .mp-11 { width: 91.6666666667%; } .mp-12 { margin-left: 0; width: 100%; } .a-center { text-align: center; } .mp-clear { clear: both } @media (min-width: 1200px) { .mp-lg-1 { width: 8.33333333333%; } .mp-lg-2 { width: 16.6666666667%; } .mp-lg-3 { width: 25.0%; } .mp-lg-4 { width: 33.3333333333%; } .mp-lg-5 { width: 41.6666666667%; } .mp-lg-6 { width: 50.0%; } .mp-lg-7 { width: 58.3333333333%; } .mp-lg-8 { width: 66.6666666667%; } .mp-lg-9 { width: 75.0%; } .mp-lg-10 { width: 83.3333333333%; } .mp-lg-11 { width: 91.6666666667%; } .mp-lg-12 { margin-left: 0; width: 100%; } } @media (min-width: 992px) and (max-width: 1199px) { .mp-md-1 { width: 8.33333333333%; } .mp-md-2 { width: 16.6666666667%; } .mp-md-3 { width: 25.0%; } .mp-md-4 { width: 33.3333333333%; } .mp-md-5 { width: 41.6666666667%; } .mp-md-6 { width: 50.0%; } .mp-md-7 { width: 58.3333333333%; } .mp-md-8 { width: 66.6666666667%; } .mp-md-9 { width: 75.0%; } .mp-md-10 { width: 83.3333333333%; } .mp-md-11 { width: 91.6666666667%; } .mp-md-12 { margin-left: 0; width: 100%; } } @media (min-width: 768px) and (max-width: 991px) { .mp-sm-1 { width: 8.33333333333%; } .mp-sm-2 { width: 16.6666666667%; } .mp-sm-3 { width: 25.0%; } .mp-sm-4 { width: 33.3333333333%; } .mp-sm-5 { width: 41.6666666667%; } .mp-sm-6 { width: 50.0%; } .mp-sm-7 { width: 58.3333333333%; } .mp-sm-8 { width: 66.6666666667%; } .mp-sm-9 { width: 75.0%; } .mp-sm-10 { width: 83.3333333333%; } .mp-sm-11 { width: 91.6666666667%; } .mp-sm-12 { margin-left: 0; width: 100%; } } @media (min-width: 481px) and (max-width: 767px) { .mp-xs-1 { width: 8.33333333333%; } .mp-xs-2 { width: 16.6666666667%; } .mp-xs-3 { width: 25.0%; } .mp-xs-4 { width: 33.3333333333%; } .mp-xs-5 { width: 41.6666666667%; } .mp-xs-6 { width: 50.0%; } .mp-xs-7 { width: 58.3333333333%; } .mp-xs-8 { width: 66.6666666667%; } .mp-xs-9 { width: 75.0%; } .mp-xs-10 { width: 83.3333333333%; } .mp-xs-11 { width: 91.6666666667%; } .mp-xs-12 { margin-left: 0; width: 100%; } } @media (max-width: 480px) { .col-mp { width: 100%; } } .v-badge { position: fixed; font: 13px/20px Arial; color: rgb(255, 255, 255); cursor: pointer; z-index: 999; background: rgb(17, 17, 17) none repeat scroll 0% 0%; padding: 6px 11px 2px; box-shadow: rgb(0, 0, 0) 0px 0px 3px; left: 10px; bottom: 0px; border-top-left-radius: 5px; border-top-right-radius: 5px; } #m-cookienotice { overflow: hidden; color: #444; z-index: 9999; font-size: 13px; } #m-cookienotice .m-message { padding: 5px 10px; } #m-cookienotice .m-actions { } #m-cookienotice .m-button { margin-top: 10px; display: inline-block; border: 1px solid #d4d4d4; padding: 4px 10px; text-decoration: none; border-radius: 2px; } #m-cookienotice .m-button.m-accept:before { content: "\2714"; } #m-cookienotice .m-button:hover, #m-cookienotice .m-button:focus { color: #fff; border-color: #3072b3; border-bottom-color: #2a65a0; } #m-cookienotice .m-button:active { border-color: #2a65a0; border-bottom-color: #3884cd; } #message-custom-css { float: left; } #action-custom-css { float: right; margin-top: 0; } #m-cookienotice.v-bar { width: 100%; padding: 5px 0; } #m-cookienotice.v-bar .m-actions { vertical-align: middle; padding-right: 10px; text-align: center; } #m-cookienotice.v-bar.v-top { position: relative; border-bottom: 1px solid #000; border-top: 1px solid #000; } #m-cookienotice.v-bar.v-bottom { position: fixed; bottom: 0; border-top: 1px solid #000; border-bottom: 1px solid #000; } #m-cookienotice.v-box { position: fixed; max-width: 300px; border: 1px solid #000; border-radius: 3px; margin: 10px; } #m-cookienotice.v-box .m-actions { float: left; margin: 5px 10px; } #m-cookienotice.v-box.v-top-left { top: 0; left: 0; border-radius: 10px; } #m-cookienotice.v-box.v-top-right { top: 0; right: 0; border-radius: 10px; } #m-cookienotice.v-box.v-center { top: 40%; left: 40%; border-radius: 10px; opacity: 0.7; } #m-cookienotice.v-box.v-bottom-left { bottom: 0; left: 0; border-radius: 10px; } #m-cookienotice.v-box.v-bottom-right { bottom: 0; right: 0; border-radius: 10px; } @media (max-width: 980px) { #message-custom-css { float: left; } #action-custom-css { float: right; margin-top: 0; } } /* RWD */ @media (max-width: 360px) { #m-cookienotice.v-box { width: 100% !important; padding: 5px 0 0; position: fixed; bottom: 0 !important; top: auto !important; border-top: 1px solid #000; max-width: 100%; margin: 0; border-radius: 0; border-right: 0; border-left: 0; border-bottom: 0; } #m-cookienotice.v-box .m-actions { vertical-align: middle; width: 100%; padding-right: 10px; text-align: left; } #m-cookienotice .m-actions { float: left; margin: 5px 10px; } #m-cookienotice.v-bar .m-actions { width: auto; } } /* Skin - Dark Clean */ #m-cookienotice.v-dark-clean { color: #fff; border-color: #55575f !important; } #m-cookienotice.v-dark-clean .m-button { color: #fff; text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3); border-color: #3072b3; border-bottom-color: #2a65a0; } #m-cookienotice.v-dark-clean .m-button:hover, #m-cookienotice.v-dark-clean .m-button:focus { background-color: #3678a0; background-image: linear-gradient(#68abdc, #387cb3); } /* Skin - Custom Colors */ #m-cookienotice.v-custom-css { color: #fff; border-color: #55575f !important; } #m-cookienotice.v-custom-css .m-button { color: #fff; text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3); border-color: #3072b3; border-bottom-color: #2a65a0; } #m-cookienotice.v-custom-css .m-button:hover, #m-cookienotice.v-custom-css .m-button:focus { background-color: #3678a0; background-image: linear-gradient(#68abdc, #387cb3); } /* Skin - Minimalist */ #m-cookienotice.v-minimalist { color: #2c2c2c; border-color: #e0e0e0 !important; font-size: 11px; font-family: Verdana; } #m-cookienotice.v-bar.v-minimalist { padding: 2px 0; } #m-cookienotice.v-box.v-minimalist { width: 260px; } #m-cookienotice.v-box.v-minimalist .m-actions { margin: 5px; } #m-cookienotice.v-box.v-minimalist .m-message { padding: 5px; } #m-cookienotice.v-minimalist .m-button { padding: 3px 6px; } /** * @package Plumrocket_Popuplogin * @copyright Copyright (c) 2019 Plumrocket Inc. (https://plumrocket.com) * @license https://plumrocket.com/license End-user License Agreement */ #prpl-modal-popup.prpl-modal-popup .modal-inner-wrap { width: 380px; margin: 10% auto; height: auto; } /*=== wrapper ===*/ #prpl-modal-popup { padding: 0 15px 30px 15px; width: 100%; left: 0; top: 0; -webkit-box-sizing: border-box; box-sizing: border-box; pointer-events: auto; } #prpl-modal-inner-wrap { max-width: 380px; height: auto; border-radius: 4px; margin: 7% auto 0 auto; background-color: #ffffff; position: relative; overflow: visible; } #prpl-modal-inner-wrap * { -webkit-box-sizing: border-box; box-sizing: border-box; } #prpl-modal-popup input[type="text"]::-moz-placeholder, #prpl-modal-popup input[type="password"]::-moz-placeholder, #prpl-modal-popup input[type="url"]::-moz-placeholder, #prpl-modal-popup input[type="tel"]::-moz-placeholder, #prpl-modal-popup input[type="search"]::-moz-placeholder, #prpl-modal-popup input[type="number"]::-moz-placeholder, #prpl-modal-popup input[type="datetime"]::-moz-placeholder, #prpl-modal-popup input[type="email"]::-moz-placeholder { color: #000000; } /*=== form ===*/ /* header */ #prpl-modal-inner-wrap .modal-header { padding: 30px 0 10px 0; text-align: center; width: 240px; border-bottom: 1px solid #c9c9c9; margin: 0 auto 20px auto; } #prpl-modal-inner-wrap .modal-header img { display: inline-block; } #prpl-modal-inner-wrap .action-close { padding: 5px; line-height: normal; margin: 10px 0 0 0; right: 10px; top: 0; position: absolute; z-index: 100; } /* content */ #prpl-modal-inner-wrap .modal-content { padding: 0 0 20px 0; max-width: 258px; width: 100%; margin: 0 auto 15px auto; } #prpl-modal-inner-wrap .modal-content h2 { margin: 0 0 15px 0; font-size: 22px; line-height: 25px; } #prpl-modal-inner-wrap .modal-content div.mage-error { font-size: 11px; margin-top: 3px; } #prpl-modal-inner-wrap .modal-content a { color: #2f4c81; text-decoration: underline } #prpl-modal-inner-wrap .modal-content a:hover { text-decoration: none; cursor: pointer; } #prpl-modal-inner-wrap .modal-content a.action { margin-top: 7px; display: inline-block; } #prpl-modal-inner-wrap .modal-content .fieldset { margin-bottom: 5px; } #prpl-modal-inner-wrap .modal-content .field { margin: 0 0 12px 0; } #prpl-modal-inner-wrap .modal-content .field label, #prpl-modal-inner-wrap .modal-content .field .label { display: none; } #prpl-modal-inner-wrap .modal-content .field .choice label { display: inline-block; font-size: 12px; vertical-align: top; } #prpl-modal-inner-wrap .modal-content .field input[type="text"], #prpl-modal-inner-wrap .modal-content .field input[type="password"], #prpl-modal-inner-wrap .modal-content .field input[type="url"], #prpl-modal-inner-wrap .modal-content .field input[type="tel"], #prpl-modal-inner-wrap .modal-content .field input[type="search"], #prpl-modal-inner-wrap .modal-content .field input[type="number"], #prpl-modal-inner-wrap .modal-content .field input[type="datetime"], #prpl-modal-inner-wrap .modal-content .field input[type="email"] { height: 38px; line-height: 38px; border: 1px solid #b2b2b2; border-radius: 4px; -webkit-box-shadow: inset 0 2px 4px 0 #ebebeb; box-shadow: inset 0 2px 4px 0 #ebebeb; padding: 0 9px; width: 100%; } #prpl-modal-inner-wrap .modal-content .field .control { position: relative; width: 100%; } #prpl-modal-inner-wrap .modal-content .fieldset.login .field.email .control:before, #prpl-modal-inner-wrap .modal-content .fieldset.login .field.password .control:before { background-image: url("../../frontend/Sm/market/th_TH/Plumrocket_Popuplogin/images/1455552331_user_male.svg")!important; background-size: cover; content: ""; display: inline-block; width: 15px; height: 15px; position: absolute; top: 12px; left: 7px; } #prpl-modal-inner-wrap .modal-content .fieldset.login .field.password .control:before { background-image: url("../../frontend/Sm/market/th_TH/Plumrocket_Popuplogin/images/1455551701_103.svg")!important; z-index: 3; } #prpl-modal-inner-wrap .modal-content .fieldset.login .field input[type="email"], #prpl-modal-inner-wrap .modal-content .fieldset.login .field input[type="password"] { padding: 0 9px 0 27px; } #prpl-modal-inner-wrap .modal-content .field input[type="text"]:focus, #prpl-modal-inner-wrap .modal-content .field input[type="password"]:focus, #prpl-modal-inner-wrap .modal-content .field input[type="url"]:focus, #prpl-modal-inner-wrap .modal-content .field input[type="tel"]:focus, #prpl-modal-inner-wrap .modal-content .field input[type="search"]:focus, #prpl-modal-inner-wrap .modal-content .field input[type="number"]:focus, #prpl-modal-inner-wrap .modal-content .field input[type="datetime"]:focus, #prpl-modal-inner-wrap .modal-content .field input[type="email"]:focus { -webkit-box-shadow: none; box-shadow: none; } #prpl-modal-inner-wrap .modal-content .field select { border: 1px solid #b2b2b2; padding: 0 25px 0 5px; height: 38px; line-height: 38px; color: #000000; border-radius: 4px; -webkit-box-shadow: inset 0 2px 4px 0 #ebebeb; box-shadow: inset 0 2px 4px 0 #ebebeb; } #prpl-modal-inner-wrap .modal-content .field select:hover, #prpl-modal-inner-wrap .modal-content .field select:focus { outline: none; -webkit-box-shadow: none; box-shadow: none; } #prpl-modal-inner-wrap .actions-toolbar .primary { float: none; width: 100%; margin: 0 0 5px 0; padding: 0; } #prpl-modal-inner-wrap .actions-toolbar button.action { margin: 0; width: 100%; background: #36596f; background: -webkit-linear-gradient(top, #36596f 0%,#263b4c 100%); background: -webkit-gradient(linear, left top, left bottom, from(#36596f),to(#263b4c)); background: -o-linear-gradient(top, #36596f 0%,#263b4c 100%); background: linear-gradient(to bottom, #36596f 0%,#263b4c 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#36596f', endColorstr='#263b4c',GradientType=0 ); border: 1px solid #11110f; -webkit-box-shadow: inset 0 1px 0 0 #558cb5; box-shadow: inset 0 1px 0 0 #558cb5; color: #ffffff; text-shadow: 0 1px 1px #000; font-family: "Open Sans", Arial, sans-serif; font-size: 14px; height: 37px; line-height: 36px; padding: 0; border-radius: 6px; text-align: center; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } #prpl-modal-inner-wrap .actions-toolbar button.action:hover { opacity: 0.9; } #prpl-modal-inner-wrap .actions-toolbar .prpl-f-password { font-size: 11px; text-align: center; width: 100%; } #prpl-modal-inner-wrap .actions-toolbar .prpl-f-password a.action { margin-top: 7px; text-decoration: underline; } #prpl-modal-inner-wrap .actions-toolbar .prpl-f-password a.action:hover { text-decoration: none; } #prpl-modal-inner-wrap .actions-toolbar .prpl-cr-account { text-align: center; width: 100%; border-top: 1px solid #E8E8E8; margin-top: 20px; padding-top: 15px; } #prpl-modal-inner-wrap .actions-toolbar .prpl-cr-account a { background-image: url("../../frontend/Sm/market/th_TH/Plumrocket_Popuplogin/images/1455552331_user_male_blue.svg")!important; background-size: 20px; background-repeat: no-repeat; padding-left: 22px; margin-top: 3px; width: auto; } #prpl-modal-inner-wrap ._block-content-loading{ position: static; } #prpl-modal-inner-wrap .loading-mask{ background: rgba(230, 230, 230, 0.6); } #prpl-modal-inner-wrap .loader{ width: 55px; height: 55px; position: absolute; top: 50%; left: 50%; margin-top: -26px; margin-left: -26px; } #prpl-modal-inner-wrap .loader:before{ content: ""; width: 45px; height: 45px; border: 4px solid #fff; display: inline-block; border-radius: 50%; border-top-color: #888888; vertical-align: middle; -webkit-animation: spin .8s linear infinite; animation: spin .8s linear infinite; } #prpl-modal-inner-wrap .loading-mask img{ display: none; } /* social login */ #prpl-modal-inner-wrap #socialLoginButtons .pslogin-spacer table td { vertical-align: middle; padding: 5px 0; } #prpl-modal-inner-wrap #socialLoginButtons .pslogin-block { margin: 0; } #prpl-modal-inner-wrap #socialLoginButtons .pslogin-buttons ul { margin-bottom: 0; } #prpl-modal-inner-wrap #socialLoginButtons .pslogin-buttons li { width: 100%; height: auto; } #prpl-modal-inner-wrap .pslogin-buttons .pslogin-button-auto { width: 100%; position: relative; border-radius: 6px; padding-left: 37px; -webkit-box-shadow: inset 0 1px 0 0 rgba(255,255,255,0.5); box-shadow: inset 0 1px 0 0 rgba(255,255,255,0.5); border: 1px solid rgba(0,0,0,0.1); overflow: hidden; } #prpl-modal-inner-wrap .pslogin-buttons .pslogin-button-icon { position: absolute; background-color: inherit; top: 3px; left: 2px; height: 32px; line-height: 36px; border-radius: 4px 0 0 4px; } #prpl-modal-inner-wrap .pslogin-buttons-show-short .pslogin-button-icon { top: 2px; left: 1px; } #prpl-modal-inner-wrap .pslogin-buttons .pslogin-button-text { display: block; width: 100%; font-size: 13px; height: 37px; line-height: 36px; padding-right: 1px; } .pslogin-block .pslogin-buttons .facebook .pslogin-button-icon { background-position: -1px 1px } .pslogin-block .pslogin-buttons ul li.facebook .pslogin-button-text, .pslogin-block .pslogin-buttons ul li.google .pslogin-button-text { background-color: transparent; } .pslogin-block .pslogin-buttons .facebook .pslogin-button-auto { background-color: #4267B2!important; } #socialLoginButtons .pslogin-button.google .pslogin-button-icon::before { top: -3px; right: -2px; bottom: -3px; left: -2px; -webkit-box-shadow: inset 0 0 0 5px white; box-shadow: inset 0 0 0 5px white; } #prpl-modal-inner-wrap .pslogin-buttons-show-short ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } #prpl-modal-inner-wrap #socialLoginButtons .pslogin-buttons.pslogin-buttons-show-short li { width: 37px; height: 37px; } #prpl-modal-inner-wrap .pslogin-buttons-show-short .pslogin-button-link { display: block; width: 100%; height: 37px; } #prpl-modal-inner-wrap .pslogin-buttons-show-short .pslogin-button-auto { width: 37px; height: 37px; padding: 0 !important; -webkit-box-sizing: border-box; box-sizing: border-box; } #prpl-modal-inner-wrap .pslogin-buttons-show-short .pslogin-button-text { display: none; } /* footer */ #prpl-modal-inner-wrap .actions-toolbar .secondary { width: 100%; } #prpl-modal-popup .actions-toolbar > .secondary .action.back { display: inline-block; font-size: 12px; text-decoration: underline; } #prpl-modal-popup .actions-toolbar > .secondary .action.back:hover { text-decoration: none; } #prpl-modal-popup.prpl-modal-scroll { overflow: auto; } /* ---------- Glamour Gray ---------- */ .glamourGrey #prpl-modal-inner-wrap{ background: #000; background: rgba(0, 0, 0, 0.7); border-radius: 0; color: #fff; } .glamourGrey #prpl-modal-inner-wrap .modal-header img { background: #fff; padding: 6px; border-radius: 6px; } .glamourGrey #prpl-modal-inner-wrap .modal-header{ border-bottom: 1px solid #5a5a5c; } .glamourGrey #prpl-modal-inner-wrap .modal-content .field input[type="text"], .glamourGrey #prpl-modal-inner-wrap .modal-content .field input[type="password"], .glamourGrey #prpl-modal-inner-wrap .modal-content .field input[type="url"], .glamourGrey #prpl-modal-inner-wrap .modal-content .field input[type="tel"], .glamourGrey #prpl-modal-inner-wrap .modal-content .field input[type="search"], .glamourGrey #prpl-modal-inner-wrap .modal-content .field input[type="number"], .glamourGrey #prpl-modal-inner-wrap .modal-content .field input[type="datetime"], .glamourGrey #prpl-modal-inner-wrap .modal-content .field input[type="email"]{ border-radius: 0; } .glamourGrey #prpl-modal-inner-wrap .actions-toolbar button.action{ background: #fba328; background: -webkit-linear-gradient(top, #fba328 0%,#b5751e 100%); background: -webkit-gradient(linear, left top, left bottom, from(#fba328),to(#b5751e)); background: -o-linear-gradient(top, #fba328 0%,#b5751e 100%); background: linear-gradient(to bottom, #fba328 0%,#b5751e 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fba328', endColorstr='#b5751e',GradientType=0 ); -webkit-box-shadow: none; box-shadow: none; border-radius: 0; } .glamourGrey #prpl-modal-inner-wrap .modal-content a{ color: #f9ab25; } .glamourGrey #prpl-modal-inner-wrap .pslogin-spacer .pslogin-border{ border-top: 1px solid #5a5a5c; } .glamourGrey #prpl-modal-inner-wrap #socialLoginButtons .pslogin-buttons li span.pslogin-button-auto{ -webkit-box-shadow: none; box-shadow: none; border-radius: 0; } .glamourGrey #prpl-modal-inner-wrap .actions-toolbar .prpl-cr-account{ border-top: 1px solid #5a5a5c; } .glamourGrey #prpl-modal-inner-wrap .actions-toolbar .prpl-cr-account a { background-image: url("../../frontend/Sm/market/th_TH/Plumrocket_Popuplogin/images/1455552331_user_male_yellow.svg")!important; } .glamourGrey #prpl-modal-inner-wrap ._block-content-loading{ position: static; } .glamourGrey #prpl-modal-inner-wrap .loading-mask{ background: rgba(0, 0, 0, 0.6); } .glamourGrey #prpl-modal-inner-wrap .loader{ width: 55px; height: 55px; position: absolute; top: 50%; left: 50%; margin-top: -26px; margin-left: -26px; } .glamourGrey #prpl-modal-inner-wrap .loader:before{ content: ""; width: 45px; height: 45px; border: 4px solid #fff; display: inline-block; border-radius: 50%; border-top-color: #d48316; vertical-align: middle; -webkit-animation: spin .8s linear infinite; animation: spin .8s linear infinite; } .glamourGrey #prpl-modal-inner-wrap .loading-mask img{ display: none; } .glamourGrey #password-strength-meter { color: #000000; } /* ---------- modern Blue ---------- */ .modernBlue #prpl-modal-inner-wrap{ background: #f8f8f8; background: -webkit-linear-gradient(top, #f8f8f8 0%,#d1d1d1 100%); background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8),to(#d1d1d1)); background: -o-linear-gradient(top, #f8f8f8 0%,#d1d1d1 100%); background: linear-gradient(to bottom, #f8f8f8 0%,#d1d1d1 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#d1d1d1',GradientType=0 ); } .modernBlue #prpl-modal-inner-wrap .modal-header{ padding: 0; border: 0; } .modernBlue #prpl-modal-inner-wrap .modal-header img{ display: none; } .modernBlue #prpl-modal-inner-wrap .modal-content{ padding: 60px 0 20px 0; max-width: 258px; } .modernBlue #prpl-modal-inner-wrap .actions-toolbar button.action{ border: 1px solid #1b9af7; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.15), 0 0 0 rgba(27, 154, 247, 0.3); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.15), 0 0 0 rgba(27, 154, 247, 0.3); background: #34a5f8; background: -webkit-linear-gradient(top, #34a5f8 0%,#088ef0 100%); background: -webkit-gradient(linear, left top, left bottom, from(#34a5f8),to(#088ef0)); background: -o-linear-gradient(top, #34a5f8 0%,#088ef0 100%); background: linear-gradient(to bottom, #34a5f8 0%,#088ef0 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#34a5f8', endColorstr='#088ef0',GradientType=0 ); text-shadow: 0 1px 1px #1780cc; } .modernBlue #prpl-modal-inner-wrap .actions-toolbar .prpl-cr-account, .modernBlue #prpl-modal-inner-wrap .pslogin-spacer .pslogin-border{ border-top: 1px solid #b3b3b3; margin-top: 20px; padding-top: 15px; } .modernBlue #prpl-modal-inner-wrap ._block-content-loading{ position: static; } .modernBlue #prpl-modal-inner-wrap .loading-mask{ background: rgba(230, 230, 230, 0.6); } .modernBlue #prpl-modal-inner-wrap .loader{ width: 55px; height: 55px; position: absolute; top: 50%; left: 50%; margin-top: -26px; margin-left: -26px; } .modernBlue #prpl-modal-inner-wrap .loader:before{ content: ""; width: 45px; height: 45px; border: 4px solid #fff; display: inline-block; border-radius: 50%; border-top-color: #888888; vertical-align: middle; -webkit-animation: spin .8s linear infinite; animation: spin .8s linear infinite; } .modernBlue #prpl-modal-inner-wrap .loading-mask img{ display: none; } .modernBlue .pslogin-spacer.pslogin-showmore .pslogin-showmore-button { color: black; background-color: #e4e3e3; border: 1px solid #b7b7b7; } /* ---------- loader ---------- */ @-webkit-keyframes spin{ 0%{ -webkit-transform:rotate(0deg); transform:rotate(0deg); } 100%{ -webkit-transform:rotate(360deg); transform:rotate(360deg); } } @keyframes spin{ 0%{ -webkit-transform:rotate(0deg); transform:rotate(0deg); } 100%{ -webkit-transform:rotate(360deg); transform:rotate(360deg); } } /* ---------- @media ---------- */ @media only screen and (min-width: 640px) { #prpl-modal-inner-wrap .modal-content div.mage-error { background: #8D0000; bottom: 3px; color: #fff; font-size: 11px; font-weight: bold; line-height: 13px; min-height: 13px; padding: 10px; position: absolute; right: -160px; width: 150px; border-radius: 5px; -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.5); box-shadow: 0 0 4px rgba(0,0,0,0.5); } #prpl-modal-inner-wrap .modal-content div.mage-error:after { position: absolute; left: -8px; bottom: 8px; content: " "; width: 0; height: 0; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-right: 8px solid #8D0000; } } @media only screen and (max-width: 640px) { #prpl-modal-popup { padding: 30px 15px; margin-top: 0; } #prpl-modal-inner-wrap .modal-header { padding: 20px 0 10px 0; } #prpl-modal-inner-wrap .modal-header img { max-width: 200px; } #prpl-modal-inner-wrap .actions-toolbar .prpl-f-password a.action, #prpl-modal-inner-wrap .modal-content a.action { margin-top: 12px; } } @media only screen and (max-width: 480px) { #prpl-modal-popup { padding: 20px 15px; } #prpl-modal-inner-wrap .actions-toolbar .prpl-cr-account { margin-top: 0; padding-top: 0; border-top: 0; } } /*=== animate ===*/ #prpl-modal-inner-wrap { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; visibility: hidden; } #prpl-modal-popup._show #prpl-modal-inner-wrap { visibility: visible; } #prpl-modal-popup.prpl-popuplogin._show .actions-toolbar { opacity: 1; } #prpl-modal-popup.prpl-popuplogin .actions-toolbar { opacity: 0; } @-webkit-keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } @keyframes fadeIn { 0% {opacity: 0;} 100% {opacity: 1;} } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -10%, 0); transform: translate3d(0, -10%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -10%, 0); transform: translate3d(0, -10%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } @keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } /* Effect 8: 3D flip horizontal */ @-webkit-keyframes flip3d_hor { 0% { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-110deg); -ms-transform: rotateY(-110deg); transform: rotateY(-110deg); -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; opacity: 0; } 100% { -webkit-transform: rotateY(0deg); -ms-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } } @keyframes flip3d_hor { 0% { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-110deg); -ms-transform: rotateY(-110deg); transform: rotateY(-110deg); -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; opacity: 0; } 100% { -webkit-transform: rotateY(0deg); -ms-transform: rotateY(0deg); transform: rotateY(0deg); opacity: 1; } } .flip3d_hor { -webkit-animation-name: flip3d_hor; animation-name: flip3d_hor; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } #prpl-modal-inner-wrap .g-recaptcha > div:not(.grecaptcha-badge) { transform: translateX(-23px) scale(0.85); } /** * @package Plumrocket_SocialLoginFree * @copyright Copyright (c) 2015 Plumrocket Inc. (https://plumrocket.com) * @license https://plumrocket.com/license End-user License Agreement */ .pslogin-addedoverlay { left: 0; top: 0; width: 100%; height: 100%; position: fixed; z-index: 2010; background-color: black; filter: alpha(opacity=60); opacity: 0.6; /*display: none;*/ } .pslogin-pop-up-form { left: 0; top: 0; position:fixed; width: 100%; z-index: 2020; height:100%; color:#666666; text-align:left; /*display:none;*/ overflow-y: auto; } #pslogin-pop-up-bg { max-width: 450px; font-size: 12px; padding: 0 10px 0 10px; margin: 10% auto 5% auto; color: #444; font-family: Arial, Helvetica, sans-serif; height: 100%; box-sizing: border-box; } .pslogin-share { background-color: white; min-height: 210px; padding: 18px 21px; position: relative; } .pslogin-fake-email-message { position: fixed; top: 20px; width: 100%; padding: 0 5%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; z-index: 9999; } .pslogin-fake-email-message .content { padding: 5px 10px; background: #fff; max-width: 960px; min-width: 250px; margin: 0 auto; box-shadow: 0 2px 15px 0px rgba(0, 0, 0, 0.42); -webkit-box-shadow: 0 2px 15px 0px rgba(0, 0, 0, 0.42); -moz-box-shadow: 0 2px 15px 0px rgba(0, 0, 0, 0.42); font-size: 14px; color: #636363; z-index: 9999; } .pslogin-fake-email-message p { margin: 10px auto; text-align: left; } .pslogin-fake-email-message .close-message { float: right; } .pslogin-fake-email-message .close-message:hover { cursor: pointer; color: #AEAEAE; } /* general classes */ .pslogin-share .ta-center { text-align: center; } .pslogin-share h2 { padding: 0px 0px 7px 0px; color: #3399cc; font-weight: 400; font-size: 15px; text-transform: uppercase; border-bottom: 1px solid #DDD; margin-bottom: 10px; } .pslogin-share .prpop-close-btn { position: absolute; right: 9px; left: auto; margin-right: 10px; top: 14px; text-decoration: none; color: #727272; font-size: 16px; background: none; } .pslogin-share .prpop-close-btn:hover { color: #b6aba5; } .pslogin-share p { margin-bottom: 7px; } .pslogin-share img { max-width: 100%; height: auto; } .pslogin-share .button-top { height: 7px; } .pslogin-share a { display: inline-block; height: 30px; color: white; margin: 0 10px 10px 0; } .pslogin-share a:hover { cursor: pointer; opacity: 0.7; filter: apha(filter=70); } /*form*/ .w25 { width: 25px!important; } .w100 { width: 100px; } .pslogin-block.account-login .content { margin: 0; } .pslogin-form .registered-users .content { margin: 0!important; } .pslogin-block.account-login .form-list label, #checkout-step-login .pslogin-block .form-list label { width: auto; float: none; } .pslogin-block.account-login .form-list .input-box, #checkout-step-login .pslogin-block .form-list .input-box { float: none; } #checkout-step-login .col2-set { box-sizing: border-box; } .pslogin-block.account-login .buttons-set { min-height: 40px; } .pslogin-block.col2-set { margin: 0; } .pslogin-block.col2-set .buttons-set { padding: 0; } .pslogin-block.col2-set .fieldset { margin: 15px 0; } .pslogin-block button.button span, .pslogin-block button.button span span { height: auto; } .pslogin-share .soc-name { height: 30px; line-height: 30px; padding: 0 7px; display: block; float: left; box-sizing: border-box; } .pslogin-share .vkontakte { background-position: -77px -78px; } .pslogin-share .facebook { background-position: -5px -5px } .pslogin-share .twitter { background-position: -41px -5px; } .pslogin-share .googleplus { background-position: -113px -5px; } /* welcome message */ .pslogin-welcome-msg { height: 22px; line-height: 22px; float: none; display: inline-block; margin: 0 0 5px 0; } .pslogin-welcome-msg:after { clear: both; content: ""; } .pslogin-welcome-msg img { height: 25px; display: inline-block; padding: 0 5px 0 0; float: left; } /* Buttons */ .popup-authentication .pslogin-block:before, .popup-authentication .pslogin-block:after{ content: ''; display: block; clear: both; } .pslogin-block { width: 100%; margin: 0 0 20px 0; } .pslogin-block * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .pslogin-block.pslogin-hidden-text .pslogin-button-text { display: none!important; } .pslogin-block .pslogin-xs { display: none!important; } .pslogin-block .pslogin-button-image { display: block; max-height: 32px; } .pslogin-block .pslogin-clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .pslogin-block .title { text-align: center; margin-bottom: 10px; font-size: 12px; } .pslogin-spacer { display: block; margin: 10px auto; position: relative; text-align: center; line-height: 16px!important; top: auto; left: auto; height: auto; width: auto; line-height: normal; overflow: visible; font-size: 13px; } .pslogin-spacer table { width: 100%; } .pslogin-spacer table tr td:first-child { padding-left: 0; } .pslogin-spacer table tr td:last-child { padding-right: 0; } .pslogin-spacer table td { vertical-align: middle; padding: 10px 5px; } .pslogin-spacer .pslogin-border { border-top: 1px solid #e5e2e2; width: 100%; } .pslogin-spacer .pslogin-bordertext { color: #b2b2b2; text-align: center; font-size: 11px; } .pslogin-spacer .circle { width: 90%; height: 25px; line-height: 22px; font-size: 11px; border: 1px solid #b2b2b2; border-radius: 0px 7px; margin: 0 auto; background-color: #eeeeee; } .pslogin-spacer .circle:hover { cursor: pointer; background-color: #FAFAFA; } .pslogin-block.pslogin-login .pslogin-buttons { display: block; } .modal-inner-wrap .pslogin-block .pslogin-buttons ul, .form-login .pslogin-block .pslogin-buttons ul { padding-left: 0; } .pslogin-block .pslogin-buttons ul { display: flex; justify-content: center; flex-wrap: wrap; padding: 0; } .customer-account-login .pslogin-buttons .ps-default{ max-width: 186px; } .pslogin-block .pslogin-buttons ul li { display: block; line-height: normal; list-style: none !important; padding: 0 !important; background: none !important; min-height: 48px; margin: 7px; position: relative; } .pslogin-block .pslogin-button:not(.ps-default){ width: 52px; height: 52px; border-radius: 50%; } .pslogin-block .pslogin-buttons ul li a { display: block; height: 100%; text-decoration: none; } .pslogin-block .pslogin-buttons ul li.show-button-image { background: none!important; } .pslogin-block .pslogin-buttons ul li:hover { opacity: 0.9; filter: alpha(opacity=90); } .pslogin-block .pslogin-buttons ul li span.pslogin-button-auto { background-color: #3399cc; display: flex; align-items: center; height: 100%; padding: 5px 4px; border-radius: 4px; border: 1px solid transparent; box-shadow: 0 3px 4px rgba(0, 0, 0, 0.18); } .pslogin-button:not(.ps-default) .pslogin-button-auto{ justify-content: center; } .pslogin-block .pslogin-buttons ul .ps-round span.pslogin-button-auto { border-radius: 50%; } .pslogin-block .pslogin-buttons ul li .pslogin-button-icon { background: url('../../frontend/Sm/market/th_TH/Plumrocket_SocialLoginFree/images/social.png'); display: block; flex-shrink: 0; width: 32px; height: 32px; margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; } .pslogin-block .pslogin-buttons ul li .pslogin-button-icon img { width: 100%; } .pslogin-button.ps-default .pslogin-button-text { display: flex; } .pslogin-buttons .pslogin-button-text { box-sizing: border-box; font: 600 13px/1 'Roboto', Arial, sans-serif; text-align: left; color: #fff; min-width: 144px; height: 100%; display: none; align-items: center; justify-content: flex-start; padding-left: 4px; } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull .pslogin-button-auto .pslogin-button-text { display: inline-block; } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull .pslogin-button-image { display: inline-block; } .pslogin-block .pslogin-buttons .pslogin-button-icon-image { display: inline-block; } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull .pslogin-button-icon-image { display: none; } .pslogin-block .pslogin-buttons .pslogin-button-auto .pslogin-button-icon-image { display: inline-block; width: 32px; height: 32px; } .pslogin-block .pslogin-buttons ul li.facebook .pslogin-button-text { background-color: transparent; } .pslogin-block .pslogin-buttons ul li.facebook span.pslogin-button-auto { background-color: #4267B2; } .pslogin-block .pslogin-buttons ul li.facebook .pslogin-button-icon { background-position: -1px 1px; } .pslogin-block .pslogin-buttons ul li.twitter span.pslogin-button-auto { background-color: #28a9e2; } .pslogin-block .pslogin-buttons ul li.twitter .pslogin-button-icon { background-position: -34px 0; } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) { .pslogin-block .pslogin-buttons ul li .pslogin-button-icon { background: url('../../frontend/Sm/market/th_TH/Plumrocket_SocialLoginFree/images/social_retina.png'); background-size: 236px 340px; -webkit-background-size: 236px 340px; -moz-background-size: 236px 340px; } } @media screen and ( max-width: 767px ) { .pslogin-block .pslogin-buttons { width: 100%; } .pslogin-block .pslogin-buttons.show-button-text ul li .pslogin-button-text { display: inline-block; } .pslogin-block .pslogin-xs { display: inline-block!important; } } @media screen and (max-width: 640px) { .pslogin-block .pslogin-button.ps-default { margin: 0 0 15px 0; width: 100%; max-width: 100%; } .pslogin-block .pslogin-buttons ul li span.pslogin-button-auto { width: 100%; } } /*=== animate ===*/ #pslogin-pop-up-bg { -webkit-animation-duration: 1s; -moz-animation-duration:1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); -moz-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; -moz-transform: none; transform: none; } } @-moz-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); -moz-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; -moz-transform: none; transform: none; } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); -moz-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; -moz-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; -moz-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } /** * @package Plumrocket_SocialLoginFree * @copyright Copyright (c) 2020 Plumrocket Inc. (https://plumrocket.com) * @license https://plumrocket.com/license End-user License Agreement */ .empty{} /** * Plumrocket Inc. * * NOTICE OF LICENSE * * This source file is subject to the End-user License Agreement * that is available through the world-wide-web at this URL: * http://wiki.plumrocket.net/wiki/EULA * If you are unable to obtain it through the world-wide-web, please * send an email to support@plumrocket.com so we can send you a copy immediately. * * @package Plumrocket_SocialLoginPro * @copyright Copyright (c) 2019 Plumrocket Inc. (http://www.plumrocket.com) * @license http://wiki.plumrocket.net/wiki/EULA End-user License Agreement */ .pslogin-addedoverlay { left: 0; top: 0; width: 100%; height: 100%; position: fixed; z-index: 2010; background-color: black; filter: alpha(opacity=60); opacity: 0.6; } .pslogin-pop-up-form { left: 0; top: 0; position: fixed; width: 100%; z-index: 2020; height: 100%; color: #666666; text-align: left; overflow-y: auto; } #pslogin-pop-up-bg { max-width: 450px; font-size: 12px; padding: 0 10px 0 10px; margin: 10% auto 5% auto; color: #444; font-family: Arial, Helvetica, sans-serif; height: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .pslogin-reminder-container { margin-left: auto; margin-right: 0; } .pslogin-share { background-color: white; min-height: 210px; padding: 18px 21px; position: relative; } #pslogin-sharepopup .pslogin-pop-up-form { height: auto; } .pslogin-reminder { position: fixed; top: 10px; right: 10px; width: 430px; background-color: white; min-height: 210px; padding: 18px 21px; box-shadow: 0 5px 5px rgba(0, 0, 0, 0.19); } .pslogin-fake-email-message { position: fixed; top: 20px; width: 100%; padding: 0 5%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; z-index: 9999; } .pslogin-fake-email-message .content { padding: 5px 10px; background: #fff; max-width: 960px; min-width: 250px; margin: 0 auto; box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.42); -webkit-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.42); -moz-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.42); font-size: 14px; color: #636363; z-index: 9999; } .pslogin-fake-email-message p { margin: 10px auto; text-align: left; } .pslogin-fake-email-message .close-message { float: right; } .pslogin-fake-email-message .close-message:hover { cursor: pointer; color: #aeaeae; } /* general classes */ .pslogin-share .ta-center { text-align: center; } .pslogin-share h2 { padding: 0 0 7px 0; color: #3399cc; font-weight: 400; font-size: 15px; text-transform: uppercase; border-bottom: 1px solid #ddd; margin-bottom: 10px; } .pslogin-share .prpop-close-btn, .pslogin-reminder .prpop-close-btn { position: absolute; right: 9px; left: auto; margin-right: 10px; top: 14px; text-decoration: none; color: #727272; font-size: 16px; background: none; } .pslogin-share .prpop-close-btn:hover { color: #b6aba5; } .pslogin-share p { margin-bottom: 7px; } .pslogin-share img { max-width: 100%; height: auto; } .pslogin-share .button-top { height: 7px; } .pslogin-share a { display: inline-block; height: 30px; color: white; margin: 0 10px 10px 0; } .pslogin-share a:hover { cursor: pointer; opacity: 0.7; -webkit-filter: apha(filter=70); filter: apha(filter=70); } /*form*/ .w25 { width: 25px !important; } .w100 { width: 100px; } .pslogin-block.account-login .content { margin: 0; } .pslogin-form .registered-users .content { margin: 0 !important; } .pslogin-block.account-login .form-list label, #checkout-step-login .pslogin-block .form-list label { width: auto; float: none; } .pslogin-block.account-login .form-list .input-box, #checkout-step-login .pslogin-block .form-list .input-box { float: none; } #checkout-step-login .col2-set { -webkit-box-sizing: border-box; box-sizing: border-box; } .pslogin-block.account-login .buttons-set { min-height: 40px; } .pslogin-block.col2-set { margin: 0; } .pslogin-block.col2-set .buttons-set { padding: 0; } .pslogin-block.col2-set .fieldset { margin: 15px 0; } .pslogin-block button.button span, .pslogin-block button.button span span { height: auto; } .pslogin-share .soc-name { height: 30px; line-height: 30px; padding: 0 7px; display: block; float: left; -webkit-box-sizing: border-box; box-sizing: border-box; } .pslogin-share .vkontakte { background-position: -77px -78px; } .pslogin-share .facebook { background-position: -5px -5px; } .pslogin-share .twitter { background-position: -41px -5px; } .pslogin-share .google { background-position: -113px -5px; } /* welcome message */ .pslogin-welcome-msg { height: 22px; line-height: 22px; float: none; display: inline-block; margin: 0 0 5px 0; } .pslogin-welcome-msg:after { clear: both; content: ""; } .pslogin-welcome-msg img { height: 25px; display: inline-block; padding: 0 5px 0 0; float: left; } /* Buttons */ .pslogin-block { width: 100%; margin: 0 0 20px 0; } .pslogin-block * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .pslogin-block .linked-account:before, .pslogin-block .linked-account:after { content: ""; display: block; clear: both; } .pslogin-block.pslogin-hidden-text .pslogin-button-text { display: none !important; } .pslogin-block .pslogin-xs { display: none !important; } .pslogin-block .pslogin-button-image { display: block; } .pslogin-block .pslogin-clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .pslogin-block .title { text-align: center; margin-bottom: 10px; font-size: 12px; } .pslogin-spacer { display: block; margin: 10px auto; position: relative; text-align: center; line-height: 16px !important; top: auto; left: auto; height: auto; width: auto; overflow: visible; font-size: 13px; } .pslogin-spacer table { width: 100%; } .pslogin-spacer table tr td:first-child { padding-left: 0; } .pslogin-spacer table tr td:last-child { padding-right: 0; } .pslogin-spacer.pslogin-showmore table td { padding: 5px 0; } .pslogin-spacer table td { vertical-align: middle; padding: 10px 5px; } .pslogin-spacer .pslogin-border { border-top: 1px solid #e5e2e2; width: 100%; } .pslogin-spacer .pslogin-bordertext { color: #b2b2b2; text-align: center; font-size: 11px; text-transform: uppercase; } .pslogin-spacer .pslogin-showmore-button.pslogin-bordertext { text-transform: none; } .pslogin-spacer.pslogin-showmore .pslogin-bordertext { height: 20px; line-height: 17px; padding: 0; border: 1px solid #e5e2e2; border-radius: 9px; -moz-border-radius: 9px; -webkit-border-radius: 9px; } .pslogin-spacer.pslogin-showmore .pslogin-bordertext:hover { color: #989898; cursor: pointer; } .pslogin-spacer .circle { width: 90%; height: 25px; line-height: 22px; font-size: 11px; border: 1px solid #b2b2b2; border-radius: 0 7px; margin: 0 auto; background-color: #eeeeee; } .pslogin-spacer .circle:hover { cursor: pointer; background-color: #fafafa; } .pslogin-block .pslogin-showmore { margin-top: 20px; } .pslogin-block.pslogin-login .pslogin-buttons { display: block; } .pslogin-block.pslogin-register .pslogin-buttons { display: block; } .modal-inner-wrap .pslogin-block .pslogin-buttons ul, .form-login .pslogin-block .pslogin-buttons ul { padding-left: 0; } .pslogin-block .pslogin-buttons ul { display: flex; justify-content: center; flex-wrap: wrap; padding: 0; } .pslogin-block .pslogin-buttons ul li { display: block; float: left; line-height: normal; list-style: none !important; padding: 0 !important; background: none !important; height: 32px; margin: 0 7px 7px 0; position: relative; } .pslogin-block .pslogin-buttons ul li a { width: 100% !important; vertical-align: top; } .pslogin-block .pslogin-buttons ul li.show-button-image { background: none !important; } .pslogin-block .pslogin-buttons ul li:hover { opacity: 0.9; filter: alpha(opacity=90); } .pslogin-block .pslogin-buttons ul li span.pslogin-button-auto { background-color: #3399cc; display: inline-block; } .pslogin-block .pslogin-buttons ul li .pslogin-button-icon { background: url('../../frontend/Sm/market/th_TH/Plumrocket_SocialLoginPro/images/social.png'); display: block; float: left; width: 32px; height: 32px; margin: 0; padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; } .pslogin-block .pslogin-buttons ul li .pslogin-button-icon img { width: 100%; } .pslogin-block .pslogin-buttons ul li .pslogin-button-text { display: none; float: left; height: 32px; line-height: 32px; vertical-align: top; padding: 0; text-align: center; min-width: 144px; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 11px; color: white; background-color: rgba(255, 255, 255, 0.2); } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull .pslogin-button-auto .pslogin-button-text { display: inline-block; padding: 0 5px; letter-spacing: 0; } .pslogin-block .pslogin-buttons .pslogin-button-image { display: none; } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull .pslogin-button-image { display: inline-block; } .pslogin-block .pslogin-buttons .pslogin-button-icon-image { display: inline-block; } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull .pslogin-button-icon-image { display: none; } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull .pslogin-button-auto.pslogin-has-button-image { display: none; } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull .pslogin-button-auto.pslogin-has-button-icon-image { display: inline-block; } .pslogin-block .pslogin-buttons .pslogin-button-auto.pslogin-has-button-icon-image { display: none; } .pslogin-block .pslogin-buttons .pslogin-button-auto .pslogin-button-icon-image { display: inline-block; width: 32px; height: 32px; } .pslogin-button.kakao .pslogin-button-auto .pslogin-button-icon { background-color: #f7e317; background-position: 134px -307px; } .pslogin-button.kakao .pslogin-button-auto .pslogin-button-text { color: #3d1e1f; background-color: #f7e317; } .checkout-index-index .authentication-wrapper { line-height: 1; } @media (max-width: 640px) { .pslogin-block .pslogin-buttons.pslogin-buttons-showfull ul li .pslogin-button-icon { position: absolute; z-index: 101; top: 0; left: 0; } } .pslogin-block .pslogin-buttons .kakao .pslogin-button-auto { background-color: #f7e317 !important; } .pslogin-block .pslogin-buttons .custinfo.kakao .pslogin-button-auto .pslogin-button-text { background-color: transparent; color: #3d1e1f; } .pslogin-block .pslogin-buttons .apple .pslogin-button-auto { background-color: #000; } .pslogin-block .pslogin-buttons .custinfo.apple .pslogin-button-auto { background-color: #3399cc; } .pslogin-block .pslogin-buttons .custinfo.apple .pslogin-button-auto .pslogin-button-text { background-color: transparent; color: #fff; } .pslogin-block .pslogin-buttons .apple .pslogin-button-icon { background-position: -135px 33px; } .pslogin-block .pslogin-buttons .facebook .pslogin-button-auto { background-color: #1e4389; } .pslogin-block .pslogin-buttons .facebook .pslogin-button-icon { background-position: 0 0; } .pslogin-block .pslogin-buttons .twitter .pslogin-button-auto { background-color: #28a9e2; } .pslogin-block .pslogin-buttons .twitter .pslogin-button-icon { background-position: -34px 0; } .pslogin-block .pslogin-buttons .linkedin .pslogin-button-auto { background-color: #11669c; } .pslogin-block .pslogin-buttons .linkedin .pslogin-button-icon { background-position: -170px -1px; } .pslogin-block .pslogin-buttons .yahoo .pslogin-button-auto { background-color: #85228f; } .pslogin-block .pslogin-buttons .yahoo .pslogin-button-icon { background-position: -204px -1px; } .pslogin-block .pslogin-buttons .vkontakte .pslogin-button-auto { background-color: #3f658c; } .pslogin-block .pslogin-buttons .vkontakte .pslogin-button-icon { background-position: -68px 0; } .pslogin-block .pslogin-buttons .google .pslogin-button-auto { background-color: #3367d6; } .pslogin-block .pslogin-buttons .google .pslogin-button-icon { background-position: -136px -2px; background-color: white; } .pslogin-block .pslogin-buttons .hotmail .pslogin-button-auto { background-color: #f67d20; } .pslogin-block .pslogin-buttons .hotmail .pslogin-button-icon { background-position: 0 -34px; } .pslogin-block .pslogin-buttons .live .pslogin-button-auto { background-color: #0cb3ee; } .pslogin-block .pslogin-buttons .live .pslogin-button-icon { background-position: -35px -205px; } .pslogin-block .pslogin-buttons .pinterest .pslogin-button-auto { background-color: #cb2028; } .pslogin-block .pslogin-buttons .pinterest .pslogin-button-icon { background-position: -34px -34px; } .pslogin-block .pslogin-buttons .amazon .pslogin-button-auto { background-color: #ff8e2e; } .pslogin-block .pslogin-buttons .amazon .pslogin-button-icon { background-position: -68px -34px; } .pslogin-block .pslogin-buttons .aol .pslogin-button-auto { background-color: #008bd3; } .pslogin-block .pslogin-buttons .aol .pslogin-button-icon { background-position: -102px -34px; } .pslogin-openid.aol input[type=submit] { background-color: #008bd3; -webkit-appearance: none; } .pslogin-block .pslogin-buttons .github .pslogin-button-auto { background-color: black; } .pslogin-block .pslogin-buttons .github .pslogin-button-icon { background-position: -135px -35px; } .pslogin-block .pslogin-buttons .instagram .pslogin-button-auto { background-color: #ce4db6; } .pslogin-block .pslogin-buttons .instagram .pslogin-button-icon { background-position: -169px -35px; } .pslogin-block .pslogin-buttons .foursquare .pslogin-button-auto { background-color: #f94777; } .pslogin-block .pslogin-buttons .foursquare .pslogin-button-icon { background-position: -204px -34px; } .pslogin-block .pslogin-buttons .dropbox .pslogin-button-auto { background-color: #008bd3; } .pslogin-block .pslogin-buttons .dropbox .pslogin-button-icon { background-position: -2px -68px; } .pslogin-block .pslogin-buttons .disqus .pslogin-button-auto { background-color: #3d7198; } .pslogin-block .pslogin-buttons .disqus .pslogin-button-icon { background-position: -32px -69px; } .pslogin-block .pslogin-buttons .livejournal .pslogin-button-auto { background-color: #104378; } .pslogin-block .pslogin-buttons .livejournal .pslogin-button-icon { background-position: -66px -69px; } .pslogin-openid.livejournal input[type=submit] { background-color: #104378; -webkit-appearance: none; } .pslogin-block .pslogin-buttons .tumblr .pslogin-button-auto { background-color: #304e6c; } .pslogin-block .pslogin-buttons .tumblr .pslogin-button-icon { background-position: -102px -69px; } .pslogin-block .pslogin-buttons .openid .pslogin-button-auto { background-color: #f8931f; } .pslogin-block .pslogin-buttons .openid .pslogin-button-icon { background-position: -135px -69px; } .pslogin-block .pslogin-buttons .flickr .pslogin-button-auto { background-color: #ff0084; } .pslogin-block .pslogin-buttons .flickr .pslogin-button-icon { background-position: -169px -69px; } .pslogin-block .pslogin-buttons .wordpress .pslogin-button-auto { background-color: #1b3f57; } .pslogin-block .pslogin-buttons .wordpress .pslogin-button-icon { background-position: -204px -69px; } .pslogin-block .pslogin-buttons .blogger .pslogin-button-auto { background-color: #ec7825; } .pslogin-block .pslogin-buttons .blogger .pslogin-button-icon { background-position: 0 -103px; } .pslogin-block .pslogin-buttons .odnoklassniki .pslogin-button-auto { background-color: #ee6600; } .pslogin-block .pslogin-buttons .odnoklassniki .pslogin-button-icon { background-position: -34px -103px; } .pslogin-block .pslogin-buttons .mailru .pslogin-button-auto { background-color: #00468c; } .pslogin-block .pslogin-buttons .mailru .pslogin-button-icon { background-position: -67px -103px; } .pslogin-block .pslogin-buttons .yandex .pslogin-button-auto { background-color: #dd0000; } .pslogin-block .pslogin-buttons .yandex .pslogin-button-icon { background-position: -102px -103px; } .pslogin-block .pslogin-buttons .paypal .pslogin-button-auto { background-color: #195d82; } .pslogin-block .pslogin-buttons .paypal .pslogin-button-icon { background-position: -134px -103px; } .pslogin-block .pslogin-buttons .myspace .pslogin-button-auto { background-color: #0022a0; } .pslogin-block .pslogin-buttons .myspace .pslogin-button-icon { background-position: -169px -103px; } .pslogin-block .pslogin-buttons .salesforce .pslogin-button-auto { background-color: #00a0de; } .pslogin-block .pslogin-buttons .salesforce .pslogin-button-icon { background-position: -203px -103px; } .pslogin-block .pslogin-buttons .steamcommunity .pslogin-button-auto { background-color: #282828; } .pslogin-block .pslogin-buttons .steamcommunity .pslogin-button-icon { background-position: -1px -137px; } .pslogin-block .pslogin-buttons .hyves .pslogin-button-auto { background-color: #ffca63; } .pslogin-block .pslogin-buttons .hyves .pslogin-button-icon { background-position: -33px -137px; } .pslogin-block .pslogin-buttons .stackoverflow .pslogin-button-auto { background-color: #e6eef1; } .pslogin-block .pslogin-buttons .stackoverflow .pslogin-button-icon { background-position: -67px -137px; } .pslogin-block .pslogin-buttons .stackoverflow .pslogin-button-text { color: #000000; } .pslogin-block .pslogin-buttons .evernote .pslogin-button-auto { background-color: #7ac141; } .pslogin-block .pslogin-buttons .evernote .pslogin-button-icon { background-position: -101px -137px; } .pslogin-block .pslogin-buttons .mixi .pslogin-button-auto { background-color: #d1ac5b; } .pslogin-block .pslogin-buttons .mixi .pslogin-button-icon { background-position: -135px -137px; } .pslogin-block .pslogin-buttons .mydigipass .pslogin-button-auto { background-color: #49bbeb; } .pslogin-block .pslogin-buttons .mydigipass .pslogin-button-icon { background-position: -169px -137px; } .pslogin-block .pslogin-buttons .netlog .pslogin-button-auto { background-color: #bb2026; } .pslogin-block .pslogin-buttons .netlog .pslogin-button-icon { background-position: -203px -137px; } .pslogin-block .pslogin-buttons .qq .pslogin-button-auto { background-color: #c46f1c; } .pslogin-block .pslogin-buttons .qq .pslogin-button-icon { background-position: 0 -171px; } .pslogin-block .pslogin-buttons .sinaweibo .pslogin-button-auto { background-color: #bd4342; } .pslogin-block .pslogin-buttons .sinaweibo .pslogin-button-icon { background-position: -34px -171px; } .pslogin-block .pslogin-buttons .soundcloud .pslogin-button-auto { background-color: #ff5419; } .pslogin-block .pslogin-buttons .soundcloud .pslogin-button-icon { background-position: -66px -171px; } .pslogin-block .pslogin-buttons .tencentweibo .pslogin-button-auto { background-color: #28a4e4; } .pslogin-block .pslogin-buttons .tencentweibo .pslogin-button-icon { background-position: -100px -171px; } .pslogin-block .pslogin-buttons .verisign .pslogin-button-auto { background-color: #b22253; } .pslogin-block .pslogin-buttons .verisign .pslogin-button-icon { background-position: -134px -171px; } .pslogin-openid.verisign input[type=submit] { background-color: #b22253; -webkit-appearance: none; } .pslogin-block .pslogin-buttons .xing .pslogin-button-auto { background-color: #005d5e; } .pslogin-block .pslogin-buttons .xing .pslogin-button-icon { background-position: -168px -171px; } .pslogin-block .pslogin-buttons .kaixin001 .pslogin-button-auto { background-color: #e2332e; } .pslogin-block .pslogin-buttons .kaixin001 .pslogin-button-icon { background-position: -203px -171px; } .pslogin-block .pslogin-buttons .orange .pslogin-button-auto { background-color: #ff6600; } .pslogin-block .pslogin-buttons .orange .pslogin-button-icon { background-position: -1px -205px; } .pslogin-block .pslogin-buttons .bitbucket .pslogin-button-auto { background-color: #013567; } .pslogin-block .pslogin-buttons .bitbucket .pslogin-button-icon { background-position: -67px -205px; } .pslogin-block .pslogin-buttons .bitly .pslogin-button-auto { background-color: #ed6022; } .pslogin-block .pslogin-buttons .bitly .pslogin-button-icon { background-position: -101px -205px; } .pslogin-block .pslogin-buttons .boxcom .pslogin-button-auto { background-color: #00b9f2; } .pslogin-block .pslogin-buttons .boxcom .pslogin-button-icon { background-position: -135px -205px; } .pslogin-block .pslogin-buttons .vimeo .pslogin-button-auto { background-color: #1fb9eb; } .pslogin-block .pslogin-buttons .vimeo .pslogin-button-icon { background-position: -170px -205px; } .pslogin-block .pslogin-buttons .reddit .pslogin-button-auto { background-color: #337fb9; } .pslogin-block .pslogin-buttons .reddit .pslogin-button-icon { background-position: -203px -205px; } .pslogin-block .pslogin-buttons .odesk .pslogin-button-auto { background-color: #6fda44; } .pslogin-block .pslogin-buttons .odesk .pslogin-button-icon { background-position: -169px -273px; } .pslogin-block .pslogin-buttons .odesk .pslogin-button-text { color: #4c4c4c; } .pslogin-block .pslogin-buttons .teamviewer .pslogin-button-auto { background-color: #0171b9; } .pslogin-block .pslogin-buttons .teamviewer .pslogin-button-icon { background-position: -34px -239px; } .pslogin-block .pslogin-buttons .skyrock .pslogin-button-auto { background-color: #009afe; } .pslogin-block .pslogin-buttons .skyrock .pslogin-button-icon { background-position: -67px -239px; } .pslogin-block .pslogin-buttons .renren .pslogin-button-auto { background-color: #153765; } .pslogin-block .pslogin-buttons .renren .pslogin-button-icon { background-position: -101px -239px; } .pslogin-block .pslogin-buttons .etsy .pslogin-button-auto { background-color: #ee5931; } .pslogin-block .pslogin-buttons .etsy .pslogin-button-icon { background-position: -134px -239px; } .pslogin-block .pslogin-buttons .imgur .pslogin-button-auto { background-color: #312e2f; } .pslogin-block .pslogin-buttons .imgur .pslogin-button-icon { background-position: -170px -239px; } .pslogin-block .pslogin-buttons .intuit .pslogin-button-auto { background-color: #b8b8b8; } .pslogin-block .pslogin-buttons .intuit .pslogin-button-icon { background-position: -204px -239px; } .pslogin-block .pslogin-buttons .intuit .pslogin-button-text { color: #000000; } .pslogin-block .pslogin-buttons .mailchimp .pslogin-button-auto { background-color: #73cff4; } .pslogin-block .pslogin-buttons .mailchimp .pslogin-button-icon { background-position: 0 -273px; } .pslogin-block .pslogin-buttons .mailchimp .pslogin-button-text { color: #000000; } .pslogin-block .pslogin-buttons .persona .pslogin-button-auto { background-color: #ee5931; } .pslogin-block .pslogin-buttons .persona .pslogin-button-icon { background-position: -34px -273px; } .pslogin-block .pslogin-buttons .dribbble .pslogin-button-auto { background-color: #f26798; } .pslogin-block .pslogin-buttons .dribbble .pslogin-button-icon { background-position: -67px -273px; } .pslogin-block .pslogin-buttons .goodreads .pslogin-button-auto { background-color: #743900; } .pslogin-block .pslogin-buttons .goodreads .pslogin-button-icon { background-position: -100px -273px; } .pslogin-block .pslogin-buttons .lastfm .pslogin-button-auto { background-color: #c02c0c; } .pslogin-block .pslogin-buttons .lastfm .pslogin-button-icon { background-position: -135px -273px; } .pslogin-block .pslogin-buttons .alipay .pslogin-button-auto { background-color: #00a0e9; } .pslogin-block .pslogin-buttons .alipay .pslogin-button-icon { background-position: -202px -274px; } .pslogin-block .pslogin-buttons .wechat .pslogin-button-auto { background-color: #4ec034; } .pslogin-block .pslogin-buttons .wechat .pslogin-button-icon { background-position: -1px -306px; } .pslogin-block .pslogin-buttons ul li.naver span.pslogin-button-auto { background-color: #23b300; } .pslogin-block .pslogin-buttons ul li.naver .pslogin-button-icon { background-position: -34px -307px; } .pslogin-block .pslogin-buttons .line .pslogin-button-auto { background-color: #00c300; } .pslogin-block .pslogin-buttons .line .pslogin-button-icon { background-position: -67px -307px; } /*======= social buttons =======*/ #prpop-pop-up-bg .pslogin-block { text-align: center; clear: both; margin-bottom: 5px; } #prpop-pop-up-bg .prpop-account-create .pslogin-block { display: none; } #prpop-pop-up-bg .pslogin-block .pslogin-buttons.pslogin-buttons-showfull { width: 100%; } #prpop-pop-up-bg .pslogin-block li a span.pslogin-button-auto { width: 100%; position: relative; display: block; height: 32px; } #prpop-pop-up-bg .pslogin-block li a span.pslogin-button-icon { position: absolute; background-color: inherit; } #prpop-pop-up-bg .pslogin-block li a span.pslogin-button-text { width: 100%; padding-left: 32px; font-size: 12px; } /*=== modern blue ===*/ #prpop-pop-up-bg.prpop-default .pslogin-spacer { margin: 0 auto 10px; width: 100%; } #prpop-pop-up-bg.prpop-default .pslogin-spacer:before { display: block; content: ""; clear: both; width: 100%; } #prpop-pop-up-bg.prpop-default .pslogin-spacer table { margin-top: 15px; } #prpop-pop-up-bg.prpop-default .pslogin-block { margin-top: 10px; } #prpop-pop-up-bg.prpop-default .pslogin-block .pslogin-buttons { width: 100%; margin: 0 auto; text-align: center; } #prpop-pop-up-bg.prpop-default .pslogin-block li a span.pslogin-button-auto { min-width: 32px; } #prpop-pop-up-bg.prpop-default .pslogin-block .pslogin-buttons.pslogin-buttons-showfull li { width: 70%; min-height: 32px; margin-bottom: 0; vertical-align: inherit; display: inline-block; float: none; } #prpop-pop-up-bg.prpop-default .pslogin-block .pslogin-buttons li { width: auto; min-height: 32px; margin-bottom: 5px; vertical-align: middle; } #prpop-pop-up-bg.prpop-default .pslogin-buttons .pslogin-spacer { width: 100%; } /*=== glamour gray ===*/ #prpop-pop-up-bg.glamour-grey .pslogin-spacer { margin: 0 auto 10px; width: 100%; float: left; } #prpop-pop-up-bg.glamour-grey .pslogin-spacer.pslogin-showmore .pslogin-bordertext:hover { color: white; } #prpop-pop-up-bg.glamour-grey .pslogin-spacer:before { display: block; content: ""; clear: both; width: 100%; } #prpop-pop-up-bg.glamour-grey .pslogin-spacer table { margin-top: 15px; } #prpop-pop-up-bg.glamour-grey .pslogin-block { margin-top: 10px; } #prpop-pop-up-bg.glamour-grey .pslogin-block .pslogin-buttons { width: 100%; margin: 0 auto; text-align: center; } #prpop-pop-up-bg.glamour-grey .pslogin-block .pslogin-buttons.pslogin-buttons-showfull li { width: 70%; min-height: 32px; margin-bottom: 5px; } #prpop-pop-up-bg.glamour-grey .pslogin-block .pslogin-buttons li { width: auto; min-height: 32px; margin: 0 5px 5px 0; vertical-align: middle; } #prpop-pop-up-bg.glamour-grey .pslogin-block li a span.pslogin-button-auto { border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; min-width: 32px; } #prpop-pop-up-bg.glamour-grey .pslogin-block li a span.pslogin-button-text { border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; } #prpop-pop-up-bg.glamour-grey .pslogin-block li a span.pslogin-button-icon { border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; } #prpop-pop-up-bg.glamour-grey .pslogin-buttons.pslogin-buttons-showfull li a span.pslogin-button-icon { border-radius: 3px 0 0 3px; -webkit-border-radius: 3px 0 0 3px; -moz-border-radius: 3px 0 0 3px; } #prpop-pop-up-bg.glamour-grey .pslogin-buttons .pslogin-spacer { width: 100%; } /*=== light silver ===*/ #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-spacer { margin: 10px auto; width: 70%; } #prpop-pop-up-bg.simple-form-logo .pslogin-border { border-top: 1px solid #a5a5a5; } #prpop-pop-up-bg.simple-form-logo .pslogin-bordertext { color: #444; } #prpop-pop-up-bg.simple-form-logo .pslogin-spacer { width: 70%; } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons .pslogin-spacer:before { display: none; } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-spacer .pslogin-border { border-top: 1px solid #a5a5a5; } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-spacer.pslogin-showmore .pslogin-bordertext { border: 1px solid #a5a5a5; color: #444; } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-spacer.pslogin-showmore .pslogin-bordertext:hover { color: black; } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons { width: 70%; margin: 0 auto; text-align: center; } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons.pslogin-buttons-showfull li { width: 100%; min-width: 32px; min-height: 34px; margin-bottom: 5px; } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons li { width: auto; min-width: 34px; height: 34px; margin: 0 0 5px 0; } .prprivatesale-splashpage-login #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons li{ margin: 0 7px 7px 0; } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons ul li a { display: inline-block; width: 100%; } #prpop-pop-up-bg.simple-form-logo .pslogin-block li a span.pslogin-button-auto { border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -webkit-box-shadow: 0 1px 1px 0 rgba(31, 31, 31, 0.47), inset 0 1px 0 0 rgba(255, 255, 255, 0.33); box-shadow: 0 1px 1px 0 rgba(31, 31, 31, 0.47), inset 0 1px 0 0 rgba(255, 255, 255, 0.33); } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons.pslogin-buttons-showfull li a span.pslogin-button-auto { border: 1px solid rgba(0, 0, 0, 0.09); height: 34px; } #prpop-pop-up-bg.simple-form-logo .pslogin-block li a span.pslogin-button-text { height: 34px; } #prpop-pop-up-bg.simple-form-logo .pslogin-block li a span.pslogin-button-icon { -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.33); box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.33); } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons.pslogin-buttons-showfull li a span.pslogin-button-icon { border: none; border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; } #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons.pslogin-buttons-showfull li a span.pslogin-button-icon { height: 32px; width: 32px; } #prpop-pop-up-bg.simple-form-logo .pslogin-block li a span.pslogin-button-icon { border: 1px solid rgba(0, 0, 0, 0.09); border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; height: 34px; width: 34px; } #prpop-pop-up-bg.simple-form-logo .pslogin-buttons .pslogin-spacer { width: 100%; } /*=== open-id Page ===*/ .pslogin-openid { font-family: Arial, Helvetica, sans-serif; font-size: 14px; text-align: center; padding: 20px; } .pslogin-openid .network-logo { background: url('../../frontend/Sm/market/th_TH/Plumrocket_SocialLoginPro/images/social_openid.png'); width: 180px; height: 70px; margin: 0 auto 15px auto; } .pslogin-openid.livejournal .network-logo { background-position: -180px 0; } .pslogin-openid.verisign .network-logo { background-position: 0 -70px; } .pslogin-openid input[type=submit] { height: 32px; line-height: 32px; vertical-align: top; padding: 0; text-align: center; min-width: 144px; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 12px; color: white; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; border: 0; } .pslogin-openid input[type=submit]:hover { opacity: 0.8; filter: alpha(opacity=80); } .pslogin-openid input[type=text] { width: 100%; border: 1px solid #d0d0d0; height: 30px; line-height: 25px; margin-bottom: 5px; margin-top: 10px; padding: 2px; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 14px; } .pslogin-openid .form-wrapper { background-color: #f3f3f3; color: #464646; width: 300px; margin: 0 auto; padding: 25px; box-shadow: 0 2px 7px 0 #c1c1c1; -moz-box-shadow: 0 2px 7px 0 #c1c1c1; -webkit-box-shadow: 0 2px 7px 0 #c1c1c1; border-radius: 15px; font-size: 14px; } .pslogin-openid .ajax-loader { width: 110px; height: 14px; margin: 0 auto 5px auto; } .pslogin-openid .ajax-loader .image-gif { background: url('../../frontend/Sm/market/th_TH/Plumrocket_SocialLoginPro/images/ajax-loader-h.gif'); width: 110px; height: 14px; display: none; } .pslogin-openid .ajax-loader .error-text { color: red; font-size: 11px; } /* Social account section */ .linked-account { margin-bottom: 20px; } .pslogin-block .custinfo.social { color: white; text-align: center; text-transform: capitalize; font-size: 12px; float: left; width: 82px; margin-right: 8px; margin-bottom: 8px; position: relative; } .pslogin-block .custinfo.social a { color: white; text-decoration: none; } .pslogin-block .custinfo.social:hover { cursor: pointer; } .pslogin-block .custinfo.social .unlink-link { content: "x"; font-family: Arial, Helvetica, sans-serif; display: block; width: 25px; height: 25px; border-radius: 50%; top: -5px; position: absolute; right: -4px; font-size: 10px; line-height: 25px; cursor: pointer; opacity: 0.4; } .pslogin-block .custinfo.social .unlink-link:hover { opacity: 1; } .pslogin-block .custinfo .pslogin-button-auto { padding: 11px 0 6px 0; background: #ffffff; } .pslogin-block .custinfo.social .user-photo { background-image: url("../../frontend/Sm/market/th_TH/Plumrocket_SocialLoginPro/images/user_icon.png"); background-size: cover; background-position: center; width: 56px; height: 56px; vertical-align: middle; float: none; margin: 0 auto 3px auto; border-radius: 50%; display: block; border: 3px solid #fff; -webkit-box-sizing: content-box; box-sizing: content-box; } .ps-login-wrapper.modal-slide .modal-inner-wrap { width: -webkit-max-content; width: -moz-max-content; width: max-content; min-width: 350px; max-width: 630px; } .ps-login-wrapper.modal-popup.modal-slide .modal-footer { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; border-top: none; } .ps-login-wrapper.modal-popup.modal-slide .modal-footer.hidden { display: none; } .ps-login-wrapper button.action.primary { margin-left: 0; margin-right: 10px; margin-bottom: 12px; padding-top: 10px; padding-bottom: 10px; } .ps-login-wrapper button.action.pslogin-bind-step-4 { width: 275px; margin-left: auto; margin-right: auto; } .ps-login-wrapper .pslogin-clearfix { margin-top: 10px; margin-bottom: 0; } .ps-login-wrapper .pslogin-block { margin-bottom: 0; } .modal-popup.ps-login-wrapper .modal-content { padding-bottom: 26px; overflow-y: hidden; } .pslogin-button.google .pslogin-button-icon { position: relative; } .pslogin-button.google .pslogin-button-icon::before { content: ""; position: absolute; top: 1px; right: 1px; bottom: 1px; left: 1px; outline: 1px solid #006bb4; } .ps-login-wrapper .pslogin-authorization-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 15px; } .pslogin-state-step-1, .pslogin-state-step-2.ps-no-linked, .pslogin-state-step-3 { max-width: 290px; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* IE10+ specific styles go here */ .pslogin-state-step-1, .pslogin-state-step-2, .pslogin-state-step-3 { max-width: 100%; } } .ps-login-wrapper #pslogin_bind { width: 100%; } .pslogin-state-step-5 #pslogin_bind { width: 45%; } #pslogin_bind .label { font-weight: 600; } .ps-login-wrapper .pslogin-or-border { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 200px; margin-left: 2.5%; margin-right: 2.5%; color: #b2b2b2; font-size: 11px; } .ps-login-wrapper .pslogin-or-border::before, .ps-login-wrapper .pslogin-or-border::after { content: ""; position: absolute; left: 50%; width: 1px; height: 90px; background-color: #b2b2b2; } .ps-login-wrapper .pslogin-or-border::before { top: 0; } .ps-login-wrapper .pslogin-or-border::after { bottom: 0; } .ps-login-wrapper .modal-slide._inner-scroll .modal-content { overflow-y: visible; } .ps-login-wrapper .fieldset-wrapper .field { margin-bottom: 10px; } .ps-login-wrapper .pslogin-authorization-wrapper button.action.primary { margin-left: 0; } .ps-login-wrapper .button-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .ps-login-wrapper .button-wrapper button.action.primary { margin-bottom: 0; } .pslogin-authorization-wrapper fieldset { margin-bottom: 20px; } .ps-login-wrapper .pslogin-buttons ul li { width: 100%; } .ps-login-wrapper .pslogin-buttons ul li a { display: block; } .ps-login-wrapper .pslogin-block .pslogin-button-link .pslogin-button-auto { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; } .ps-login-wrapper .pslogin-button-text { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .pslogin-block .pslogin-buttons .facebook .pslogin-button-icon { background-position: -1px 1px; } .pslogin-block .pslogin-buttons ul li.facebook .pslogin-button-text { background-color: transparent; } .pslogin-success-icon { position: relative; left: 50%; margin-left: -46px; margin-top: 28px; -webkit-transform: scale(3); -ms-transform: scale(3); transform: scale(3); -webkit-animation: success-message-icon-anim 2s 0.5s; animation: success-message-icon-anim 2s 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .pslogin-thank-text { margin-top: 15px; text-align: center; font-size: 22px; } .ps-login-networks-container { width: 45%; } #pslogin_bind_email:disabled { background-color: #f1f1f1; color: #6d6d6d; opacity: 1; } .pslogin-reminder-container { height: 0; } .pslogin-form-title { margin-top: 10px; } .checkout-index-index .authentication-dropdown .pslogin-button { margin: 0 4px 4px 0; } .customer-account-login #login-form .pslogin-buttons ul { margin-left: -7px; } .customer-account-login #login-form .pslogin-buttons ul li { margin-left: 7px; margin-right: 0; } .customer-account-login #login-form .pslogin-buttons.pslogin-buttons-showfull .pslogin-button-text { min-width: 161px; } .pslogin-reminder { max-height: 80vh; overflow: auto; } @media screen and (max-width: 1280px) and (min-width: 767px) { .authentication-dropdown .pslogin-buttons-showfull { text-align: center; } .authentication-dropdown .pslogin-block .pslogin-buttons ul li { float: none; } .authentication-dropdown .pslogin-block .pslogin-buttons.pslogin-buttons-show-short ul li { float: left; } } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) { .pslogin-block .pslogin-buttons ul li .pslogin-button-icon { background: url('../../frontend/Sm/market/th_TH/Plumrocket_SocialLoginPro/images/social_retina.png'); background-size: 236px 340px; -webkit-background-size: 236px 340px; -moz-background-size: 236px 340px; } } @media screen and (max-width: 1280px) { .pslogin-block .pslogin-buttons ul li .pslogin-button-text { min-width: 155px; } } @media screen and (max-width: 1190px) { .pslogin-block .pslogin-buttons ul li .pslogin-button-text { min-width: 144px; } } @media screen and (max-width: 767px) { .pslogin-block .pslogin-buttons.show-button-text ul li .pslogin-button-text { display: inline-block; } .pslogin-block .pslogin-xs { display: inline-block !important; } .ps-login-wrapper.modal-slide .modal-inner-wrap { width: 100%; max-width: none; } .ps-login-wrapper._inner-scroll .modal-footer { margin-top: 0; text-align: right; } .pslogin-state-step-1, .pslogin-state-step-2, .pslogin-state-step-3 { max-width: 100%; } } @media (max-width: 680px) { .modal-footer { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .ps-login-wrapper button.action.pslogin-bind-step-4 { width: 100%; } .ps-login-wrapper button.action.primary { margin-right: 0; } .ps-login-wrapper.modal-slide .modal-inner-wrap { min-width: 260px; } } @media screen and (max-width: 640px) { /*=== social login ===*/ #prpop-pop-up-bg.prpop-default .pslogin-spacer, #prpop-pop-up-bg.prpop-default .pslogin-block .pslogin-buttons { width: 60%; } #prpop-pop-up-bg.glamour-grey .pslogin-spacer { float: none; } #prpop-pop-up-bg.glamour-grey .pslogin-spacer, #prpop-pop-up-bg.glamour-grey .pslogin-block .pslogin-buttons { width: 60%; } #prpop-pop-up-bg.prpop-default .pslogin-block .pslogin-buttons.pslogin-buttons-showfull li, #prpop-pop-up-bg.glamour-grey .pslogin-block .pslogin-buttons.pslogin-buttons-showfull li { width: 100%; } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull ul li { margin: 0 0 7px 0; width: 100%; } .pslogin-block .pslogin-buttons ul li span.pslogin-button-auto { width: 100%; } .pslogin-block .pslogin-buttons.pslogin-buttons-showfull ul li .pslogin-button-icon { position: absolute; top: 0; left: 0; } .pslogin-block .pslogin-buttons ul li .pslogin-button-text { width: 100%; position: relative; z-index: 100; } .ps-login-wrapper .pslogin-authorization-wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .ps-login-wrapper #pslogin_bind, .ps-login-wrapper .ps-login-networks-container { width: 100%; } .ps-login-wrapper .pslogin-or-border { height: 20px; margin-top: 15px; } .ps-login-wrapper .pslogin-or-border::before, .ps-login-wrapper .pslogin-or-border::after { top: 50%; width: 45%; height: 1px; } .ps-login-wrapper .pslogin-or-border::before { left: 0; } .ps-login-wrapper .pslogin-or-border::after { right: 0; left: auto; } } @media screen and (max-width: 480px) { /*=== social buttons ===*/ #prpop-pop-up-bg.prpop-default .pslogin-spacer, #prpop-pop-up-bg.prpop-default .pslogin-block .pslogin-buttons { width: 100%; } #prpop-pop-up-bg.glamour-grey .pslogin-spacer, #prpop-pop-up-bg.glamour-grey .pslogin-block .pslogin-buttons { width: 100%; } #prpop-pop-up-bg.simple-form-logo .pslogin-spacer, #prpop-pop-up-bg.simple-form-logo .pslogin-block .pslogin-buttons { width: 100%; } .ps-login-wrapper button.action.primary.pslogin-bind-step-4 { width: 100%; margin-left: 0; } .modal-popup.ps-login-wrapper .modal-footer { padding-top: 20px; } .ps-login-wrapper input { height: 34px; font-size: 16px; } .pslogin-reminder { width: auto; left: 10px; } } @media screen and (max-width: 399px) { .modal-popup.ps-login-wrapper .modal-header, .modal-popup.ps-login-wrapper .modal-content, .modal-popup.ps-login-wrapper .modal-footer { padding-left: 15px; padding-right: 15px; } .ps-login-wrapper .pslogin-bind-step-4 { padding-left: 5px; padding-right: 5px; } } /*=== animate ===*/ #pslogin-pop-up-bg { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @-webkit-keyframes success-message-icon-anim { 0% { opacity: 0; -webkit-transform: scale(3); transform: scale(3); } 33% { opacity: 0.5; -webkit-transform: scale(0.2); transform: scale(0.2); } 66% { opacity: 0.7; -webkit-transform: scale(1.2); transform: scale(1.2); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes success-message-icon-anim { 0% { opacity: 0; -webkit-transform: scale(3); transform: scale(3); } 33% { opacity: 0.5; -webkit-transform: scale(0.2); transform: scale(0.2); } 66% { opacity: 0.7; -webkit-transform: scale(1.2); transform: scale(1.2); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } /** * Plumrocket Inc. * * NOTICE OF LICENSE * * This source file is subject to the End-user License Agreement * that is available through the world-wide-web at this URL: * http://wiki.plumrocket.net/wiki/EULA * If you are unable to obtain it through the world-wide-web, please * send an email to support@plumrocket.com so we can send you a copy immediately. * * @package Plumrocket_SocialLoginPro * @copyright Copyright (c) 2020 Plumrocket Inc. (http://www.plumrocket.com) * @license http://wiki.plumrocket.net/wiki/EULA End-user License Agreement *//** * @package Plumrocket_AdvancedReviewAndReminder * @copyright Copyright (c) 2020 Plumrocket Inc. (https://plumrocket.com) * @license https://plumrocket.com/license End-user License Agreement */ /*normalize styles*/ .sidebar.sidebar-main, .sidebar.sidebar-additional{ max-width: 100%; } /*owl styles*/ /*owl carousel*/ .reviews-carousel-wrapper .owl-stage, .reviews-grid-wrapper .owl-stage{ display: flex; } .container-four-item .owl-item{ align-self: flex-start; } .reviews-carousel-wrapper .owl-item, .reviews-grid-wrapper .owl-item { display: inline-block; } .reviews-grid-wrapper > .owl-nav { position: absolute; top: 41px; right: 0; width: 180px; } .reviews-grid-wrapper .owl-nav.dotsHide{ width: 60px; } .reviews-carousel-wrapper .owl-nav > .owl-prev, .reviews-carousel-wrapper .owl-nav > .owl-next, .reviews-grid-wrapper .owl-nav > .owl-prev, .reviews-grid-wrapper .owl-nav > .owl-next { font-size: 0; font-weight: 600; width: 10px; height: 10px; cursor: pointer; text-align: center; margin: 0 20px; border: solid #B5B5B5; border-width: 0 3px 3px 0; display: inline-block; padding: 3px; } .reviews-carousel-wrapper .owl-nav > .owl-prev.disabled, .reviews-carousel-wrapper .owl-nav > .owl-next.disabled, .reviews-grid-wrapper .owl-nav > .owl-prev.disabled, .reviews-grid-wrapper .owl-nav > .owl-next.disabled{ border: solid #E2E2E2; border-width: 0 3px 3px 0; cursor: default; } .reviews-grid-wrapper .owl-nav > .owl-prev{ position: absolute; left:2px; right: auto; transform: translate(-100%, -50%) rotate(135deg); -webkit-transform: translate(-100%, -50%) rotate(135deg); } .reviews-grid-wrapper .owl-nav > .owl-next{ position: absolute; right: 2px; left: auto; transform: translate(100%, -50%) rotate(-45deg); -webkit-transform: translate(100%, -50%) rotate(-45deg); } .reviews-grid-wrapper .owl-dots, .reviews-carousel-wrapper .owl-dots{ text-align: center; -webkit-tap-highlight-color: transparent; z-index: 10; } .reviews-carousel-wrapper .owl-dots{ margin-top: 1rem; } .reviews-grid-wrapper .owl-dots{ position: absolute; top: 30px; right: 90px; transform: translateX(50%); } .reviews-grid-wrapper button.owl-dot, .reviews-carousel-wrapper button.owl-dot{ background: 0 0; color: inherit; border: none; padding: 0!important; font: inherit; border-radius: 0; transition: background-color 300ms ease-out; box-shadow: none; } .reviews-grid-wrapper .owl-dots .owl-dot span, .reviews-carousel-wrapper .owl-dots .owl-dot span{ width: 6px; height: 6px; margin: 4px; background: #E5E5E5; display: block; -webkit-backface-visibility: visible; transition: opacity .2s ease; border-radius: 50%; } .reviews-grid-wrapper .owl-dots .owl-dot.active span, .reviews-grid-wrapper .owl-dots .owl-dot:hover > span, .reviews-carousel-wrapper .owl-dots .owl-dot.active span, .reviews-carousel-wrapper .owl-dots .owl-dot:hover > span{ background: #C4C4C4; } /*rating stars color*/ .prar-box-reviews .rating-summary .rating-result > span:before, .prar-rating .rating-summary .rating-result > span:before, .prar-review-helpful-critical .rating-summary .rating-result > span:before, .prar-review-helpful-positive .rating-summary .rating-result > span:before, .prar-rev-item-rat .rating-summary .rating-result > span:before, .reviews-content-wrapper .rating-summary .rating-result > span:before{ color: #ffc700; } /*grid styles*/ .reviews-content-wrapper *{ font-family: 'Open Sans', sans-serif; } .reviews-content-wrapper { position: relative; margin-bottom: 2rem; padding-top: 30px; } .reviews-content-wrapper .title-container { min-height: 30px; display: inline-block; width: 100%; } .reviews-content-wrapper .title-container h2{ margin-top: 0; margin-bottom: .7rem; margin-right: 190px; } .reviews-content-wrapper .title-container.margin-small h2{ margin-right: 75px; } .reviews-carousel-wrapper, .reviews-grid-wrapper { overflow: hidden; } .container-four-item .review-grid-item:first-child{ margin-bottom: 25px; } .review-grid-item, .container-item{ box-sizing: border-box; height: 100%; width: 100%; } .review-grid-item { display: flex; display: -ms-flexbox; padding: 1rem; overflow: hidden; border: 1px solid #BDE1FC; border-radius: 5px; font-size: 1rem; } .container-four-item .review-grid-item > *{ height: auto; align-self: flex-start; } .review-item-img { min-width: 100px; } .review-item-content { width: 100%; max-width: 100%; margin-left: 1rem; position: relative; } .review-item-product{ margin-bottom: 1rem; border-bottom: 1px solid #E8E8E8; } .review-item-product a{ display: inline-block; color: #258DEC; font-size: 1.2rem; line-height: 1.6rem; font-weight: 600; padding-bottom: 1rem; } .user-stars-container, .user-stars-container > div{ display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .review-item-content .review-nickname-wrapper, .review-item-content .rating-summary{ margin: 0 1rem 1rem 0; } .review-nickname-wrapper .nickname{ font-size: 1.2rem; color: #8A8A8A; font-weight: 600; } .date-created-review { margin-bottom: 1rem; color: #9D9D9D; font-size: 1rem; } .grid-review-url{ font-size: 1.4rem; color: #414141; font-weight: 600; margin-bottom: 15px; display: block; } .grid-review-url:hover, .grid-review-url:visited{ text-decoration: none; color: #414141; } .grid-item-detail{ margin: 0; font-size: 1.2rem; line-height: 1.4rem; color: #787878; } .grid-item-detail > a{ color: #258DEC; } .grid-item-detail > a:hover, .grid-item-detail > a:visited{ color: #2781d2; } /*carousel style*/ .reviews-carousel-wrapper { margin: 0 25px; background: #F7F7F7; padding: 15px; } .reviews-content-wrapper.__carousel .title-container{ min-height: 0; } .reviews-content-wrapper.__carousel .title-container h2{ margin: 0 0 2rem 0; text-align: center; } .owl-loaded .review-carousel-item{ display: flex; display: -ms-flexbox; flex-direction: column; align-items: center; padding: 15px; text-align: center; background: #ffffff; justify-content: space-between; min-height: 350px; border: 1px solid #F3F3F3; } .reviews-content-wrapper.__carousel .review-carousel-item *:not(.container-img){ max-width: 100%; } .review-carousel-item .container-img{ max-width: 45%; } .review-carousel-item .container-img img{ display: block; max-width: 100%; height: auto; } _:-ms-fullscreen, :root .review-carousel-item .container-img img{ margin: 0 auto; } .review-carousel-item .product-name{ font-size: 1.2rem } .review-carousel-item .carousel-item-title{ color: #333333; font-size: 1.6rem; font-weight: 600; } .review-carousel-item .carousel-item-title:hover{ text-decoration: none; } .reviews-carousel-wrapper .carousel-item-customer > span{ display: block; } .reviews-carousel-wrapper .carousel-item-detail{ font-size: 1.3rem; } .__carousel .carousel-item-customer > img{ width: 36px; height: 36px; object-fit: cover; border-radius: 50%; } .carousel-item-customer > span{ font-weight: 400; font-size: 1rem; color: #a9a9a9; } .reviews-carousel-wrapper .owl-nav > .owl-prev, .reviews-carousel-wrapper .owl-nav > .owl-next { position: absolute; top: 50%; z-index: 10; } .reviews-carousel-wrapper .owl-nav > .owl-prev { transform: translate(-80%, 50%) rotate(135deg); -webkit-transform: translate(-80%, 50%) rotate(135deg); left: 0; } .reviews-carousel-wrapper .owl-nav > .owl-next { transform: translate(80%, 50%) rotate(-45deg); -webkit-transform: translate(80%, 50%) rotate(-45deg); right: 0; } .modals-overlay { background-color: rgba(51, 51, 51, .55); bottom: 0; left: 0; position: fixed; right: 0; top: 0; } /* ################################ */ @media (min-width: 768px){ /*review grid*/ .reviews-carousel-wrapper{ margin: 0 50px; } .review-carousel-item .container-img{ max-width: 50%; } .reviews-carousel-wrapper .owl-nav > .owl-prev { transform: translateY(50%) rotate(135deg); -webkit-transform: translateY(50%) rotate(135deg); left: 0; } .reviews-carousel-wrapper .owl-nav > .owl-next { transform: translateY(50%) rotate(-45deg); -webkit-transform: translateY(50%) rotate(-45deg); right: 0; } /*review sidebar*/ .sidebar .reviews-content-wrapper .title-container{ min-height: 0; } .sidebar .reviews-content-wrapper .title-container h2{ margin-right: 0; text-align: center; } .sidebar .review-grid-item{ flex-direction: column; height: auto; border: none; border-radius: 0; overflow: visible; } .sidebar .review-item-img a, .sidebar .review-item-img img{ display: block; } .sidebar .review-item-img img{ margin: 0 auto; } .sidebar .review-item-img, .sidebar .review-item-content{ width: 100%; } .sidebar .review-item-content{ display: flex; display: -ms-flexbox; flex-direction: column; margin: 1rem 0 2rem 0; } .sidebar .date-created-review { position: absolute; top: calc(100% + 1rem); left: 0; } .sidebar .user-stars-container{ margin-top: 1rem; } .sidebar .grid-review-url{ line-height: 1.2; margin-bottom: 0.5rem; } .sidebar .reviews-grid-wrapper > .owl-nav{ bottom: -12px; top: auto; position: relative; height: 0; border: 1px solid transparent; width: 100%; } .sidebar .reviews-grid-wrapper .owl-dots{ position: relative; top: auto; right: auto; transform: none; } .sidebar .reviews-grid-wrapper .owl-nav.dotsHide{ position: relative; bottom: auto; margin: 1rem 0; } .sidebar .reviews-grid-wrapper .owl-nav > .owl-next, .sidebar .reviews-grid-wrapper .owl-nav > .owl-prev{ position: absolute; top: 0; z-index: 11; } .sidebar .owl-stage{ display: block; } .sidebar .owl-item{ display: inline-block; } .sidebar .review-grid-item, .sidebar .container-item{ height: auto; } /*------------------border------------------------*/ .sidebar .reviews-grid-wrapper{ padding: 1.5rem 1rem; border: 1px solid #BDE1FC; border-radius: 3px; } .sidebar .review-grid-item{ padding: 0; margin-bottom: 2rem; } /*------------------/border------------------------*/ } @media (min-width: 769px){ .sidebar .reviews-grid-wrapper{ padding: 2rem; } } /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ /* * Owl Carousel - Core */ .owl-carousel { display: none; width: 100%; -webkit-tap-highlight-color: transparent; /* position relative and z-index fix webkit rendering fonts issue */ position: relative; z-index: 1; } .owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; touch-action: manipulation; -moz-backface-visibility: hidden; /* fix firefox animation glitch */ } .owl-carousel .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .owl-carousel .owl-stage-outer { position: relative; overflow: hidden; /* fix for flashing background */ -webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper, .owl-carousel .owl-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); } .owl-carousel .owl-item { position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .owl-carousel .owl-item img { display: block; width: 100%; } .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled { display: none; } .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot { cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next, .owl-carousel button.owl-dot { background: none; color: inherit; border: none; padding: 0 !important; font: inherit; } .owl-carousel.owl-loaded { display: block; } .owl-carousel.owl-loading { opacity: 0; display: block; } .owl-carousel.owl-hidden { opacity: 0; } .owl-carousel.owl-refresh .owl-item { visibility: hidden; } .owl-carousel.owl-drag .owl-item { -ms-touch-action: pan-y; touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-grab { cursor: move; cursor: grab; } .owl-carousel.owl-rtl { direction: rtl; } .owl-carousel.owl-rtl .owl-item { float: right; } /* No Js */ .no-js .owl-carousel { display: block; } /* * Owl Carousel - Animate Plugin */ .owl-carousel .animated { animation-duration: 1000ms; animation-fill-mode: both; } .owl-carousel .owl-animated-in { z-index: 0; } .owl-carousel .owl-animated-out { z-index: 1; } .owl-carousel .fadeOut { animation-name: fadeOut; } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } /* * Owl Carousel - Auto Height Plugin */ .owl-height { transition: height 500ms ease-in-out; } /* * Owl Carousel - Lazy Load Plugin */ .owl-carousel .owl-item { /** This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong calculation of the height of the owl-item that breaks page layouts */ } .owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity 400ms ease; } .owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) { max-height: 0; } .owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d; } /* * Owl Carousel - Video Plugin */ .owl-carousel .owl-video-wrapper { position: relative; height: 100%; background: #000; } .owl-carousel .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url("../../frontend/Sm/market/th_TH/Plumrocket_AdvancedReviewAndReminder/css/owl.video.play.png") no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: transform 100ms ease; } .owl-carousel .owl-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); } .owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon { display: none; } .owl-carousel .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 400ms ease; } .owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; }.loading-details { background: url("../../frontend/Sm/market/th_TH/Ves_Trackorder/images/main-bg.png") repeat scroll 0 0 transparent; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 99; display: none; } #loading-details .update-popup { position: fixed; top: 45%; left: 45%; width: 300px; margin-left: -105px; padding: 15px 30px; background: #fff; color: #d85909; font-weight: bold; text-align: center; z-index: 400; webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } #loading-mask { background: none repeat scroll 0 0 #F5F5F5; border: 1px solid #F18200; margin: 20% auto; padding: 15px; text-align: center; width: 200px; } #loading-mask p { margin-bottom: 0; } .track-data-table { margin-bottom: 20px; } .order-info-message { padding-top: 15px; } .ves-trackorder .block .block-title { border-bottom: 1px solid #e8e8e8; font-size: 1.8rem; margin-bottom: 15px; padding-bottom: 12px } .ves-trackorder .block .block-title strong { font-weight: 500 } .ves-trackorder .track-order { float: left; width: 48%; } .ves-trackorder .track-login { float: right; width: 48%; } .ves-trackorder .form-login{ display: none; } .ves-trackorder #orderinfo{ width: 100%; float: left } .ves-trackorder .block-left{ width: 48%; float: left } .ves-trackorder .block-right{ width: 48%; float: right } .ves-trackorder ul{ list-style: none; margin: 0; padding: 0; } .ves-trackorder .block-row{ float: left; width: 100% } .vestrackorder-tab .vestrackorder-item{ display: none; } .vestrackorder-tab .vestrackorder-item.current{ display: block; } .ves-trackorder ul.order-links{ float: left; width: 100%; position: absolute; } .vestrackorder-tab{ float: left; width: 100%; margin-top: 43px; } .order-links .item.current a { background: #fff; border: 1px solid #ccc; display: block; font-weight: 400; border-bottom: 0; } .trackorder-tab{ position: relative; float: left; width: 100%; } .status{ position: relative; padding: 12px 20px 12px 28px; } .status.status-complete:before{ -webkit-font-smoothing: antialiased; font-size: 24px; line-height: 24px; color: #5ac714; content: '\e60e'; font-family: 'luma-icons'; margin: -12px 0 0; vertical-align: middle; display: inline-block; font-weight: normal; overflow: hidden; speak: none; left: 0; top: 22px; width: 25px; position: absolute; text-align: center; } .vestrackorder-index-track .column.main > ul.items.order-links { display: none; } @media all and (min-width: 768px), print { .ves-trackorder .fieldset > .field > .control { width: 55%; } } @media all and (max-width: 767px){ .ves-trackorder .track-order, .ves-trackorder .track-login, .ves-trackorder .block-right, .ves-trackorder .block-left{ width: 100%; } .ves-trackorder ul.order-links{ position: relative; } .vestrackorder-tab{ margin-top: 0 } }.webforms { margin-bottom: 1.5rem; } .webforms .field { box-sizing: border-box; padding-left: 1rem; padding-right: 1rem; } .webforms .fieldset { box-sizing: border-box; padding-left: 1rem; padding-right: 1rem; } .webforms .actions-toolbar { box-sizing: border-box; padding-left: 2rem; padding-right: 2rem; clear: both; } .webforms .inline-elements .choice { display: inline-flex; } /* Success text */ .webforms-success-text { margin-bottom: 2rem; } /* Starry script */ div.starry { width: auto; margin: -4px 0 10px 0; padding: 5px; width: auto; } div.standard_star { background-repeat: no-repeat; cursor: pointer; float: left; display: inline; background-image: url(../../frontend/Sm/market/th_TH/VladimirPopov_WebForms/images/stars.gif); } div.feedback { border: 1px solid #ddd; padding: 5px 3px 3px; display: inline; } /* Date of birth */ .customer-dob .dob-month, .customer-dob .dob-day, .customer-dob .dob-year { float: left; width: 8.5rem; } .customer-dob input.input-text { display: block; width: 7.4rem; } .customer-dob label { font-size: 10px; font-weight: normal; color: #888; } .customer-dob .dob-day, .customer-dob .dob-month { width: 6rem; } .customer-dob .dob-day input.input-text, .customer-dob .dob-month input.input-text { width: 4.6rem; } .customer-dob .dob-year { width: 14rem; } .customer-dob .dob-year input.input-text { width: 13.4rem; } /* Tooltip */ .ot-content { text-align: left; } .tooltip-icon { background-image: url('../../frontend/Sm/market/th_TH/VladimirPopov_WebForms/images/tooltip.png'); background-size: 1.5rem 1.5rem; width: 1.5rem; height: 1.5rem; cursor: pointer; display: inline-block; vertical-align: middle; margin: 0 0 0.2rem 0.5rem; } /* Select images */ .webforms figcaption { padding: 5px 0; margin: 5px; } /* Form */ .webforms-description-text { margin-bottom: 4rem; } .webforms-fields-comment { font-size: 90%; clear: both; margin-top: 1rem; } .please-wait { padding-top: 0.5rem; } .please-wait .loading-indicator { background: #fff url(../../frontend/Sm/market/th_TH/VladimirPopov_WebForms/images/ajax-loader-big.gif) no-repeat; background-size: 1.8rem; display: inline-block; width: 1.8rem; height: 1.8rem; vertical-align: bottom; margin-bottom: 0.2rem; } /* reCaptcha v2 */ .recaptcha2 { clear: both; box-sizing: border-box; padding: 0 2rem 2rem 0; width: 100%; float: left; } /* Validation */ .validation-advice { margin-top: 0.7rem; font-size: 1.2rem; color: #e02b27; clear: both; } input.validation-failed, textarea.validation-failed { border-color: #ed8380; } /* Customer Account */ .webforms-customer-account-form { margin-top: 3rem; border: 1px solid #eee; padding: 2rem; } .webforms-customer-account-message { background: rgba(255, 212, 96, 0.26); padding: 3rem; } .block-webforms-form .actions-toolbar { margin: 17px 0; } /* Results */ .webforms-results-block { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted #cccccc; float: left; width: 100%; clear: both; } .webforms-results-field { margin-bottom: 5px; width: 100%; } .webforms-results-label { font-weight: bold; width: 100%; } .webforms-results-value { padding: 5px 0; } .webforms-results-value .webforms-image { float: left; margin-right: 2rem; } /* Star rating */ .stars { padding: 0 5px; width: 80px; display: inline; float: left; } .stars-bar { list-style: none; margin: 0px; padding: 0px !important; height: 16px; position: relative; background: url(../../frontend/Sm/market/th_TH/VladimirPopov_WebForms/images/results_stars.png) top left repeat-x; } .stars-bar li { padding: 0px; margin: 0px; /*\*/ float: left; /* */ } .stars-bar li.stars-value { background: url(../../frontend/Sm/market/th_TH/VladimirPopov_WebForms/images/results_stars.png) left bottom; position: absolute; height: 16px; display: block; z-index: 1; } .webforms-rating-summary { margin-bottom: 15px; } .webforms-results-table .col.id { width: 15%; } /* Auto-complete */ .autocomplete-suggestions { text-align: left; cursor: default; border: 1px solid #ccc; border-top: 0; background: #fff; box-shadow: -1px 1px 3px rgba(0, 0, 0, .1); /* core styles should not be changed */ position: absolute; display: none; z-index: 9999; max-height: 254px; overflow: hidden; overflow-y: auto; box-sizing: border-box; } .autocomplete-suggestion { position: relative; padding: 0 .6em; line-height: 23px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1.02em; color: #333; } .autocomplete-suggestion b { font-weight: normal; color: #1f8dd6; } .autocomplete-suggestion.selected { background: #f0f0f0; } /* File preview */ .file-preview { list-style: none; padding: 0; margin: 0; } .file-preview h3 { font-size: 12px; } .file-preview li { margin: 0; padding: 10px 0; margin: 0; overflow: auto; position: relative; } .file-preview li img { border: solid 1px #999; border-radius: 3px; padding: 3px; margin: 0 10px 0 0; display: block; float: left; } .file-cancel { margin-top: 1rem; cursor: pointer; } .file-progress { font-size: 90%; color: #777; } /* Calendar */ .webforms-datepicker { margin-bottom: 1rem; } .webforms-calendar { position: relative; width: 20rem; display: inline-block; margin-right: .5rem; margin-bottom: .5rem; } .webforms-calendar .ui-datepicker-trigger { margin-left: -3.2rem; height: 2.8rem; position: absolute; top: .4rem; right: .5rem; } .webforms-time { display: inline-block; } .webforms-time .hours, .webforms-time .minutes { display: inline; width: 6rem; } .multiselect { height: auto; background-image: none; } /* Date picker button */ @font-face { font-family: 'luma-icons'; src: url(../../frontend/Sm/market/th_TH/VladimirPopov_WebForms/css/fonts/Luma-Icons.woff); } .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger { background-image: none; background: none; -moz-box-sizing: content-box; border: 0; box-shadow: none; line-height: inherit; margin: 0; padding: 0; text-shadow: none; font-weight: 400; display: block; text-decoration: none; display: inline-block; margin-top: -4px; vertical-align: middle; } .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger:focus, .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger:active { background: none; border: none; } .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger:hover { background: none; border: none; } .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger.disabled, .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger[disabled], fieldset[disabled] .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger { cursor: not-allowed; pointer-events: none; opacity: 0.5; } .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger > span { border: 0; clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger:before { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 23px; line-height: 23px; color: #7d7d7d; content: '\e612'; font-family: 'luma-icons'; vertical-align: middle; display: inline-block; font-weight: normal; overflow: hidden; speak: none; text-align: center; } .webforms-datepicker ._has-datepicker ~ .ui-datepicker-trigger:focus { box-shadow: none; outline: 0; } /* Drop-zone */ .drop-zone { padding: 2rem .7rem; color: #777; border: .2rem dashed #ddd; border-radius: .4rem; opacity: .9; cursor: pointer; } .drop-zone-preview-container { margin-bottom: 10px; } .drop-zone:hover { background-color: #f5f5f5; } .drop-zone-label { display: inline-block !important; vertical-align: top !important } .icon-paperclip { color: rgb(240, 120, 0) !important; fill: rgb(240, 120, 0) !important; } .icon-paperclip svg { transform: rotate(45deg) scaleX(-1); } .text-center { text-align: center !important } .drop-zone-preview { background: #f8f8f8; border: .09167rem solid #dadada; border-radius: .33333rem; color: #999; padding: 5px; margin-bottom: 5px; line-height: inherit; position: relative; } .drop-zone-attachment { overflow: auto; height: auto; z-index: 2; width: 100% !important; position: relative; } .drop-zone-preview-icon-file { padding-right: .66667rem; float: left !important; } .drop-zone-preview-icon-file svg path { } .drop-zone-preview-file { width: 70%; float: left !important; } .drop-zone-preview-filename { max-width: 62%; color: #333; overflow: hidden !important; text-overflow: ellipsis !important; word-wrap: normal !important; white-space: nowrap !important; float: left !important; vertical-align: top !important; } .drop-zone-preview-filename-end { color: #333; } .drop-zone-preview-size, .drop-zone-error { clear: left; float: left !important; } .drop-zone-error { color: red; } .drop-zone-preview-icon-close { position: absolute; top: 50%; right: .41667rem; margin-top: -2.2rem !important; padding-top: 1rem; border: 0; cursor: pointer !important; float: right !important; } .drop-zone-preview-icon-close svg { fill: #999; } .drop-zone-progress, .drop-zone-progress-success { position: absolute; border-radius: .33333rem; background-color: #00ff08; opacity: .1; height: 100% !important; z-index: 1; top: 0; left: 0; display: block; } .drop-zone-progress-success { opacity: 0; } .webforms .webforms-gdpr { padding-left: 2rem; padding-right: 2rem; box-sizing: border-box; float:left; } .webforms .webforms-gdpr-checkbox { margin-top: 1.5rem; margin-bottom: 2rem; padding-left: 0; } .webforms-popup { position: relative; background: #FFF; padding: 2rem; margin: 2rem auto; box-sizing: border-box; border-radius: .7rem; } @media screen and (min-width: 20em) { .webforms-popup { width: 100%; } } @media screen and (min-width: 48em) { .webforms-popup { width: 90%; } } @media screen and (min-width: 64em) { .webforms-popup { width: 80%; } } /* Customer result action buttons */ .webforms-result-action{ display: block; background: #f5f5f5; text-align: center; padding: .3rem .1rem; margin: .5rem .1rem; white-space: nowrap; color: #888; text-decoration: none; } .webforms-result-action:hover{ text-decoration: none; color:white; background: #8bc53f; } .result-action-delete { border-color: red; } .result-action-delete:hover{ background: red; } /* File pool */ .webforms-file-pool { display: table; margin-bottom: 10px; } .webforms-file-pool-selectall{ margin-bottom:5px; } .webforms-file-pool-selectall label{ font: bold 10px/16px Arial, Helvetica, sans-serif; text-transform: uppercase; color: #888; float:none !important; margin-left:5px; } .webforms-file-cell{ float:left; flex:1; height: auto; text-align: center; font: bold 9px/16px Arial, Helvetica, sans-serif; text-transform: uppercase; color: #888; display: table-cell; } .webforms-file-cell p label{ color: #888; } .webforms-file-cell p { padding-top: 5px; margin-left: -10px; float: left; clear: both; width: 100%; } .webforms-file-cell label{ float:none !important; margin-left:5px; } .webforms-file-link{ display: block; border-radius:5px; float:left; margin-right:10px; height:auto; box-shadow: 0 0 3px rgba(0,0,0,0.6); background: #f5f5f5; max-width:200px; padding:5px 10px; } .webforms-file-link:hover { box-shadow: 0 0 7px rgba(0,0,0,0.6); background: white; color: #888; } .webforms-file-link figure p{ margin:10px 0 5px 0; } .webforms-file-link figure img{ background:white; } .webforms-file-link-name { display:inline; max-width:60%; overflow: hidden !important; text-overflow: ellipsis !important; word-wrap: normal !important; white-space: nowrap !important; float:left; } .webforms-file-link-name-end {display:inline;} .webforms-file-delete-checkbox{ vertical-align: baseline; } @media screen and (min-width: 20em) { .wf-sm-row{ clear:left; } .wf-sm-1, .wf-sm-1-1, .wf-sm-1-2, .wf-sm-1-3, .wf-sm-2-3, .wf-sm-1-4, .wf-sm-3-4, .wf-sm-1-6, .wf-sm-1-5, .wf-sm-2-5, .wf-sm-3-5, .wf-sm-4-5, .wf-sm-5-6, .wf-sm-1-12, .wf-sm-2-12, .wf-sm-3-12, .wf-sm-4-12, .wf-sm-5-12, .wf-sm-6-12, .wf-sm-7-12, .wf-sm-8-12, .wf-sm-9-12, .wf-sm-10-12, .wf-sm-11-12, .wf-sm-12-12 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto; float:left; } .wf-sm-1-12 { width: 8.3333%; *width: 8.3023%; } .wf-sm-1-6, .wf-sm-2-12 { width: 16.6667%; *width: 16.6357%; } .wf-sm-1-5 { width: 20%; } .wf-sm-1-4, .wf-sm-3-12 { width: 25%; *width: 24.9690%; } .wf-sm-1-3, .wf-sm-4-12 { width: 33.3333%; *width: 33.3023%; } .wf-sm-2-5 { width: 40%; } .wf-sm-5-12 { width: 41.6667%; *width: 41.6357%; } .wf-sm-1-2, .wf-sm-6-12 { width: 50%; *width: 49.9690%; } .wf-sm-7-12 { width: 58.3333%; *width: 58.3023%; } .wf-sm-3-5 { width: 60%; } .wf-sm-2-3, .wf-sm-8-12 { width: 66.6667%; *width: 66.6357%; } .wf-sm-3-4, .wf-sm-9-12 { width: 75%; *width: 74.9690%; } .wf-sm-4-5 { width: 80%; } .wf-sm-5-6, .wf-sm-10-12 { width: 83.3333%; *width: 83.3023%; } .wf-sm-11-12 { width: 91.6667%; *width: 91.6357%; } .wf-sm-1, .wf-sm-1-1, .wf-sm-12-12 { width: 100%; } } @media screen and (min-width: 48em) { .wf-md-row{ clear:left; } .wf-sm-row{ clear:unset; } .wf-md-1, .wf-md-1-1, .wf-md-1-2, .wf-md-1-3, .wf-md-2-3, .wf-md-1-4, .wf-md-3-4, .wf-md-1-6, .wf-md-1-5, .wf-md-2-5, .wf-md-3-5, .wf-md-4-5, .wf-md-5-6, .wf-md-1-12, .wf-md-2-12, .wf-md-3-12, .wf-md-4-12, .wf-md-5-12, .wf-md-6-12, .wf-md-7-12, .wf-md-8-12, .wf-md-9-12, .wf-md-10-12, .wf-md-11-12, .wf-md-12-12 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto; float:left; } .wf-md-1-12 { width: 8.3333%; *width: 8.3023%; } .wf-md-1-6, .wf-md-2-12 { width: 16.6667%; *width: 16.6357%; } .wf-md-1-5 { width: 20%; } .wf-md-1-4, .wf-md-3-12 { width: 25%; *width: 24.9690%; } .wf-md-1-3, .wf-md-4-12 { width: 33.3333%; *width: 33.3023%; } .wf-md-2-5 { width: 40%; } .wf-md-5-12 { width: 41.6667%; *width: 41.6357%; } .wf-md-1-2, .wf-md-6-12 { width: 50%; *width: 49.9690%; } .wf-md-7-12 { width: 58.3333%; *width: 58.3023%; } .wf-md-3-5 { width: 60%; } .wf-md-2-3, .wf-md-8-12 { width: 66.6667%; *width: 66.6357%; } .wf-md-3-4, .wf-md-9-12 { width: 75%; *width: 74.9690%; } .wf-md-4-5 { width: 80%; } .wf-md-5-6, .wf-md-10-12 { width: 83.3333%; *width: 83.3023%; } .wf-md-11-12 { width: 91.6667%; *width: 91.6357%; } .wf-md-1, .wf-md-1-1, .wf-md-12-12 { width: 100%; } } @media screen and (min-width: 64em) { .wf-lg-row{ clear:left !important; } .wf-md-row, .wf-sm-row{ clear:unset; } .wf-lg-1, .wf-lg-1-1, .wf-lg-1-2, .wf-lg-1-3, .wf-lg-2-3, .wf-lg-1-4, .wf-lg-3-4, .wf-lg-1-5, .wf-lg-2-5, .wf-lg-3-5, .wf-lg-4-5, .wf-lg-1-6, .wf-lg-5-6, .wf-lg-1-12, .wf-lg-2-12, .wf-lg-3-12, .wf-lg-4-12, .wf-lg-5-12, .wf-lg-6-12, .wf-lg-7-12, .wf-lg-8-12, .wf-lg-9-12, .wf-lg-10-12, .wf-lg-11-12, .wf-lg-12-12 { display: inline-block; *display: inline; zoom: 1; letter-spacing: normal; word-spacing: normal; vertical-align: top; text-rendering: auto; float:left; } .wf-lg-1-12 { width: 8.3333%; *width: 8.3023%; } .wf-lg-1-6, .wf-lg-2-12 { width: 16.6667%; *width: 16.6357%; } .wf-lg-1-5 { width: 20%; } .wf-lg-1-4, .wf-lg-3-12 { width: 25%; *width: 24.9690%; } .wf-lg-1-3, .wf-lg-4-12 { width: 33.3333%; *width: 33.3023%; } .wf-lg-2-5 { width: 40%; } .wf-lg-5-12 { width: 41.6667%; *width: 41.6357%; } .wf-lg-1-2, .wf-lg-6-12 { width: 50%; *width: 49.9690%; } .wf-lg-7-12 { width: 58.3333%; *width: 58.3023%; } .wf-lg-3-5 { width: 60%; } .wf-lg-2-3, .wf-lg-8-12 { width: 66.6667%; *width: 66.6357%; } .wf-lg-3-4, .wf-lg-9-12 { width: 75%; *width: 74.9690%; } .wf-lg-4-5 { width: 80%; } .wf-lg-5-6, .wf-lg-10-12 { width: 83.3333%; *width: 83.3023%; } .wf-lg-11-12 { width: 91.6667%; *width: 91.6357%; } .wf-lg-1, .wf-lg-1-1, .wf-lg-12-12 { width: 100%; } }.opentip-container, .opentip-container * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .opentip-container { position: absolute; max-width: 300px; z-index: 100; -webkit-transition: -webkit-transform 1s ease-in-out; -moz-transition: -moz-transform 1s ease-in-out; -o-transition: -o-transform 1s ease-in-out; -ms-transition: -ms-transform 1s ease-in-out; transition: transform 1s ease-in-out; pointer-events: none; -webkit-transform: translateX(0) translateY(0); -moz-transform: translateX(0) translateY(0); -o-transform: translateX(0) translateY(0); -ms-transform: translateX(0) translateY(0); transform: translateX(0) translateY(0); } .opentip-container.ot-fixed.ot-hidden.stem-top.stem-center, .opentip-container.ot-fixed.ot-going-to-show.stem-top.stem-center, .opentip-container.ot-fixed.ot-hiding.stem-top.stem-center { -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -o-transform: translateY(-5px); -ms-transform: translateY(-5px); transform: translateY(-5px); } .opentip-container.ot-fixed.ot-hidden.stem-top.stem-right, .opentip-container.ot-fixed.ot-going-to-show.stem-top.stem-right, .opentip-container.ot-fixed.ot-hiding.stem-top.stem-right { -webkit-transform: translateY(-5px) translateX(5px); -moz-transform: translateY(-5px) translateX(5px); -o-transform: translateY(-5px) translateX(5px); -ms-transform: translateY(-5px) translateX(5px); transform: translateY(-5px) translateX(5px); } .opentip-container.ot-fixed.ot-hidden.stem-middle.stem-right, .opentip-container.ot-fixed.ot-going-to-show.stem-middle.stem-right, .opentip-container.ot-fixed.ot-hiding.stem-middle.stem-right { -webkit-transform: translateX(5px); -moz-transform: translateX(5px); -o-transform: translateX(5px); -ms-transform: translateX(5px); transform: translateX(5px); } .opentip-container.ot-fixed.ot-hidden.stem-bottom.stem-right, .opentip-container.ot-fixed.ot-going-to-show.stem-bottom.stem-right, .opentip-container.ot-fixed.ot-hiding.stem-bottom.stem-right { -webkit-transform: translateY(5px) translateX(5px); -moz-transform: translateY(5px) translateX(5px); -o-transform: translateY(5px) translateX(5px); -ms-transform: translateY(5px) translateX(5px); transform: translateY(5px) translateX(5px); } .opentip-container.ot-fixed.ot-hidden.stem-bottom.stem-center, .opentip-container.ot-fixed.ot-going-to-show.stem-bottom.stem-center, .opentip-container.ot-fixed.ot-hiding.stem-bottom.stem-center { -webkit-transform: translateY(5px); -moz-transform: translateY(5px); -o-transform: translateY(5px); -ms-transform: translateY(5px); transform: translateY(5px); } .opentip-container.ot-fixed.ot-hidden.stem-bottom.stem-left, .opentip-container.ot-fixed.ot-going-to-show.stem-bottom.stem-left, .opentip-container.ot-fixed.ot-hiding.stem-bottom.stem-left { -webkit-transform: translateY(5px) translateX(-5px); -moz-transform: translateY(5px) translateX(-5px); -o-transform: translateY(5px) translateX(-5px); -ms-transform: translateY(5px) translateX(-5px); transform: translateY(5px) translateX(-5px); } .opentip-container.ot-fixed.ot-hidden.stem-middle.stem-left, .opentip-container.ot-fixed.ot-going-to-show.stem-middle.stem-left, .opentip-container.ot-fixed.ot-hiding.stem-middle.stem-left { -webkit-transform: translateX(-5px); -moz-transform: translateX(-5px); -o-transform: translateX(-5px); -ms-transform: translateX(-5px); transform: translateX(-5px); } .opentip-container.ot-fixed.ot-hidden.stem-top.stem-left, .opentip-container.ot-fixed.ot-going-to-show.stem-top.stem-left, .opentip-container.ot-fixed.ot-hiding.stem-top.stem-left { -webkit-transform: translateY(-5px) translateX(-5px); -moz-transform: translateY(-5px) translateX(-5px); -o-transform: translateY(-5px) translateX(-5px); -ms-transform: translateY(-5px) translateX(-5px); transform: translateY(-5px) translateX(-5px); } .opentip-container.ot-fixed .opentip { pointer-events: auto; } .opentip-container.ot-hidden { display: none; } .opentip-container .opentip { position: relative; font-size: 13px; line-height: 120%; padding: 9px 14px; color: #4f4b47; text-shadow: -1px -1px 0px rgba(255,255,255,0.2); } .opentip-container .opentip .header { margin: 0; padding: 0; } .opentip-container .opentip .ot-close { pointer-events: auto; display: block; position: absolute; top: -12px; left: 60px; color: rgba(0,0,0,0.5); background: rgba(0,0,0,0); text-decoration: none; } .opentip-container .opentip .ot-close span { display: none; } .opentip-container .opentip .ot-loading-indicator { display: none; } .opentip-container.ot-loading .ot-loading-indicator { width: 30px; height: 30px; font-size: 30px; line-height: 30px; font-weight: bold; display: block; } .opentip-container.ot-loading .ot-loading-indicator span { display: block; -webkit-animation: otloading 2s linear infinite; -moz-animation: otloading 2s linear infinite; -o-animation: otloading 2s linear infinite; -ms-animation: otloading 2s linear infinite; animation: otloading 2s linear infinite; text-align: center; } .opentip-container.style-dark .opentip, .opentip-container.style-alert .opentip { color: #f8f8f8; text-shadow: 1px 1px 0px rgba(0,0,0,0.2); } .opentip-container.style-glass .opentip { padding: 15px 25px; color: #317cc5; text-shadow: 1px 1px 8px rgba(0,94,153,0.3); } .opentip-container.ot-hide-effect-fade { -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 1s ease-in-out; -moz-transition: -moz-transform 0.5s ease-in-out, opacity 1s ease-in-out; -o-transition: -o-transform 0.5s ease-in-out, opacity 1s ease-in-out; -ms-transition: -ms-transform 0.5s ease-in-out, opacity 1s ease-in-out; transition: transform 0.5s ease-in-out, opacity 1s ease-in-out; opacity: 1; -ms-filter: none; filter: none; } .opentip-container.ot-hide-effect-fade.ot-hiding { opacity: 0; filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; } .opentip-container.ot-show-effect-appear.ot-going-to-show, .opentip-container.ot-show-effect-appear.ot-showing { -webkit-transition: -webkit-transform 0.5s ease-in-out, opacity 1s ease-in-out; -moz-transition: -moz-transform 0.5s ease-in-out, opacity 1s ease-in-out; -o-transition: -o-transform 0.5s ease-in-out, opacity 1s ease-in-out; -ms-transition: -ms-transform 0.5s ease-in-out, opacity 1s ease-in-out; transition: transform 0.5s ease-in-out, opacity 1s ease-in-out; } .opentip-container.ot-show-effect-appear.ot-going-to-show { opacity: 0; filter: alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; } .opentip-container.ot-show-effect-appear.ot-showing { opacity: 1; -ms-filter: none; filter: none; } .opentip-container.ot-show-effect-appear.ot-visible { opacity: 1; -ms-filter: none; filter: none; } @-moz-keyframes otloading { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes otloading { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } } @-o-keyframes otloading { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } } @-ms-keyframes otloading { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes otloading { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } } /* colpick Color Picker / colpick.com */ /*Main container*/ .colpick { position: absolute; box-sizing:content-box; width: 346px; height: 170px; overflow: hidden; display: none; font-family: Arial, Helvetica, sans-serif; direction:ltr; background:#ebebeb; border: 1px solid #bbb; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; /*Prevents selecting text when dragging the selectors*/ -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; z-index: 100000; } /*Color selection box with gradients*/ .colpick .colpick_color { position: absolute; left: 7px; top: 7px; width: 156px; height: 156px; overflow: hidden; outline: 1px solid #aaa; cursor: crosshair; } .colpick .colpick_color_overlay1 { position: absolute; left:0; top:0; width: 156px; height: 156px; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#ffffff', endColorstr='#00ffffff')"; /* IE8 */ background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* IE10+ */ background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#ffffff', endColorstr='#00ffffff'); /* IE6 & IE7 */ } .colpick .colpick_color_overlay2 { position: absolute; left:0; top:0; width: 156px; height: 156px; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#00000000', endColorstr='#000000')"; /* IE8 */ background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); /* IE6-9 */ } /*Circular color selector*/ .colpick .colpick_selector_outer { background:none; position: absolute; width: 11px; height: 11px; margin: -6px 0 0 -6px; border: 1px solid black; border-radius: 50%; } .colpick .colpick_selector_inner{ position: absolute; width: 9px; height: 9px; border: 1px solid white; border-radius: 50%; } /*Vertical hue bar*/ .colpick .colpick_hue { position: absolute; top: 6px; left: 175px; width: 19px; height: 156px; border: 1px solid #aaa; cursor: n-resize; } /*Hue bar sliding indicator*/ .colpick .colpick_hue_arrs { position: absolute; left: -8px; width: 35px; height: 7px; margin: -7px 0 0 0; } .colpick .colpick_hue_larr { position:absolute; width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 7px solid #858585; } .colpick .colpick_hue_rarr { position:absolute; right:0; width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-right: 7px solid #858585; } /*New color box*/ .colpick .colpick_new_color { position: absolute; left: 207px; top: 6px; width: 60px; height: 27px; background: #f00; border: 1px solid #8f8f8f; } /*Current color box*/ .colpick .colpick_current_color { position: absolute; left: 277px; top: 6px; width: 60px; height: 27px; background: #f00; border: 1px solid #8f8f8f; } /*Input field containers*/ .colpick .colpick_field, .colpick .colpick_hex_field { position: absolute; height: 20px; width: 60px; overflow:hidden; background:#f3f3f3; color:#b8b8b8; font-size:12px; border:1px solid #bdbdbd; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .colpick .colpick_rgb_r { top: 40px; left: 207px; } .colpick .colpick_rgb_g { top: 67px; left: 207px; } .colpick .colpick_rgb_b { top: 94px; left: 207px; } .colpick .colpick_hsb_h { top: 40px; left: 277px; } .colpick .colpick_hsb_s { top: 67px; left: 277px; } .colpick .colpick_hsb_b { top: 94px; left: 277px; } .colpick .colpick_hex_field { width: 68px; left: 207px; top: 121px; } /*Text field container on focus*/ .colpick .colpick_focus { border-color: #999; } /*Field label container*/ .colpick .colpick_field_letter { position: absolute; width: 12px; height: 20px; line-height: 20px; padding-left: 4px; background: #efefef; border-right: 1px solid #bdbdbd; font-weight: bold; color:#777; } /*Text inputs*/ .colpick .colpick_field input, .colpick .colpick_hex_field input { position: absolute; right: 11px; margin: 0; padding: 0; height: 20px; line-height: 20px; background: transparent; border: none; font-size: 12px; font-family: Arial, Helvetica, sans-serif; color: #555; text-align: right; outline: none; } .colpick .colpick_hex_field input { right: 4px; } /*Field up/down arrows*/ .colpick .colpick_field_arrs { position: absolute; top: 0; right: 0; width: 9px; height: 21px; cursor: n-resize; } .colpick .colpick_field_uarr { position: absolute; top: 5px; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 4px solid #959595; } .colpick .colpick_field_darr { position: absolute; bottom:5px; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid #959595; } /*Submit/Select button*/ .colpick .colpick_submit { position: absolute; left: 207px; top: 149px; width: 130px; height: 22px; line-height:22px; background: #efefef; text-align: center; color: #555; font-size: 12px; font-weight:bold; border: 1px solid #bdbdbd; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .colpick .colpick_submit:hover { background:#f3f3f3; border-color:#999; cursor: pointer; } /*full layout with no submit button*/ .colpick.colpick_full_ns .colpick_submit, .colpick.colpick_full_ns .colpick_current_color{ display:none; } .colpick.colpick_full_ns .colpick_new_color { width: 130px; height: 25px; } .colpick.colpick_full_ns .colpick_rgb_r, .colpick.colpick_full_ns .colpick_hsb_h { top: 42px; } .colpick.colpick_full_ns .colpick_rgb_g, .colpick.colpick_full_ns .colpick_hsb_s { top: 73px; } .colpick.colpick_full_ns .colpick_rgb_b, .colpick.colpick_full_ns .colpick_hsb_b { top: 104px; } .colpick.colpick_full_ns .colpick_hex_field { top: 135px; } /*rgbhex layout*/ .colpick.colpick_rgbhex .colpick_hsb_h, .colpick.colpick_rgbhex .colpick_hsb_s, .colpick.colpick_rgbhex .colpick_hsb_b { display:none; } .colpick.colpick_rgbhex { width:282px; } .colpick.colpick_rgbhex .colpick_field, .colpick.colpick_rgbhex .colpick_submit { width:68px; } .colpick.colpick_rgbhex .colpick_new_color { width:34px; border-right:none; } .colpick.colpick_rgbhex .colpick_current_color { width:34px; left:240px; border-left:none; } /*rgbhex layout, no submit button*/ .colpick.colpick_rgbhex_ns .colpick_submit, .colpick.colpick_rgbhex_ns .colpick_current_color{ display:none; } .colpick.colpick_rgbhex_ns .colpick_new_color{ width:68px; border: 1px solid #8f8f8f; } .colpick.colpick_rgbhex_ns .colpick_rgb_r { top: 42px; } .colpick.colpick_rgbhex_ns .colpick_rgb_g { top: 73px; } .colpick.colpick_rgbhex_ns .colpick_rgb_b { top: 104px; } .colpick.colpick_rgbhex_ns .colpick_hex_field { top: 135px; } /*hex layout*/ .colpick.colpick_hex .colpick_hsb_h, .colpick.colpick_hex .colpick_hsb_s, .colpick.colpick_hex .colpick_hsb_b, .colpick.colpick_hex .colpick_rgb_r, .colpick.colpick_hex .colpick_rgb_g, .colpick.colpick_hex .colpick_rgb_b { display:none; } .colpick.colpick_hex { width:206px; height:201px; } .colpick.colpick_hex .colpick_hex_field { width:72px; height:25px; top:168px; left:80px; } .colpick.colpick_hex .colpick_hex_field div, .colpick.colpick_hex .colpick_hex_field input { height: 25px; line-height: 25px; } .colpick.colpick_hex .colpick_new_color { left:9px; top:168px; width:30px; border-right:none; } .colpick.colpick_hex .colpick_current_color { left:39px; top:168px; width:30px; border-left:none; } .colpick.colpick_hex .colpick_submit { left:164px; top: 168px; width:30px; height:25px; line-height: 25px; } /*hex layout, no submit button*/ .colpick.colpick_hex_ns .colpick_submit, .colpick.colpick_hex_ns .colpick_current_color { display:none; } .colpick.colpick_hex_ns .colpick_hex_field { width:80px; } .colpick.colpick_hex_ns .colpick_new_color{ width:60px; border: 1px solid #8f8f8f; } /*Dark color scheme*/ .colpick.colpick_dark { background: #161616; border-color: #2a2a2a; } .colpick.colpick_dark .colpick_color { outline-color: #333; } .colpick.colpick_dark .colpick_hue { border-color: #555; } .colpick.colpick_dark .colpick_field, .colpick.colpick_dark .colpick_hex_field { background: #101010; border-color: #2d2d2d; } .colpick.colpick_dark .colpick_field_letter { background: #131313; border-color: #2d2d2d; color: #696969; } .colpick.colpick_dark .colpick_field input, .colpick.colpick_dark .colpick_hex_field input { color: #7a7a7a; } .colpick.colpick_dark .colpick_field_uarr { border-bottom-color:#696969; } .colpick.colpick_dark .colpick_field_darr { border-top-color:#696969; } .colpick.colpick_dark .colpick_focus { border-color:#444; } .colpick.colpick_dark .colpick_submit { background: #131313; border-color:#2d2d2d; color:#7a7a7a; } .colpick.colpick_dark .colpick_submit:hover { background-color:#101010; border-color:#444; } .type-colorpicker input{cursor:pointer} /* WHATSOCK, 2016 */ /* Specific styles for ARIA Calendar */ #datepicker-demo { background: #E0E0E0; padding: 1rem; margin: 1rem 0 2rem; } #datepicker-demo em {display: block; font-size: 90%;} #date, #party { width: 90%; max-width: 25em; vertical-align: 20px; } a.accCalendar { display: inline-block; background: transparent; } div.calendar { text-align: center; color: #FFF; background: #2E3135; padding: 0.5rem; border-radius: 0.3rem; -webkit-box-shadow: 0 10px 6px -6px #777; -moz-box-shadow: 0 10px 6px -6px #777; box-shadow: 0 10px 6px -6px #777; } table.calendar { border-collapse: separate; border-spacing: 1px; } table.calendar td, table.calendar th { padding: 0.3em 0.5em; border-radius: 0.15rem; } td.empty { background: rgba(255, 255, 255, .07); } th.week {} td.nav, td.day {cursor: pointer;} td.day { text-shadow: 0 1px 0 rgba(255, 255, 255, .5); color: #000; background: #63B7C2; } td.day:hover {background: #E2A037;} td.selected {background: #E2A037;} div.calendar *:focus, div.commentAdd *:focus { background: #E2A037; } td.month { font-weight: 600; color: #63B7C2; text-shadow: 0 1px 0 #000; } td.comment {position: relative;} td.comment span::after { display: block; position: absolute; width: 7px; height: 7px; top: 0.2rem; right: 0.2rem; content: ""; background: #49182E; border-radius: 7px; } td.comment.selected { background: #E2A037; } td.disabled, td.disabled:hover { color: #CCC; background: #bdbdbd; cursor: auto; } td.disabled.selected {background: #C2C2C2;} div.commentTooltip { width: 271px; padding: 0.5rem; color: #FFF; background: #3D4043; font-size: 0.8em; font-weight: bold; max-height: 50px; overflow-x: hidden; overflow-y: auto; word-wrap: break-word; text-align: left; } div.commentAdd { background: #2E3135; border-radius: 0.3rem; } div.commentAdd button { font-size: 100%; text-transform: uppercase; color: #FFF; background: #2E3135; padding: 0.5rem; margin-top: -5px; border: none; border-bottom-left-radius: 0.3rem; border-bottom-right-radius: 0.3rem; -webkit-box-shadow: 0 10px 6px -6px #777; -moz-box-shadow: 0 10px 6px -6px #777; box-shadow: 0 10px 6px -6px #777; } div.commentAdd textarea { width: 270px; height: 2em; overflow: auto; word-wrap: break-word; text-align: left; padding: 0.2em; margin: 0.5rem 0.5rem 0; } /* Magnific Popup CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #CCC; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #CCC; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 1046; box-shadow: none; touch-action: manipulation; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 28px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #CCC; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: transparent; } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; } .mfp-arrow:before, .mfp-arrow:after { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before { border-left: 27px solid #3F3F3F; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #F3F3F3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } button.wk-ui-datepicker-trigger.v-middle{ background-image: none; background: none; -moz-box-sizing: content-box; border: 0; box-shadow: none; line-height: inherit; margin: 0; padding: 0; text-shadow: none; font-weight: 400; text-decoration: none; display: inline-block; height: 3.2rem; margin-left: 9.8rem; overflow: hidden; margin-top: -2px; position: absolute; vertical-align: top; z-index: 1; } button.wk-ui-datepicker-trigger.v-middle + input{ width:130px; } button.wk-ui-datepicker-trigger.v-middle:after{ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 2.1rem; line-height: 32px; color: #514943; content: '\e627'; font-family: 'Admin Icons'; vertical-align: middle; display: inline-block; font-weight: normal; overflow: hidden; speak: none; text-align: center; }/** * Mpshipping * * @category Webkul * @package Webkul_Mpshipping * @author Webkul * @copyright Copyright (c) 2010-2018 Webkul Software Private Limited (https://webkul.com) * @license https://store.webkul.com/license.html */ .wk_mp_list_table { width: 100%; border: 1px solid #CCCCCC; } .wk_mp_list_table thead span{ font-weight: bold; } .mpship_edit, .mpship_delete{ cursor: pointer; } .wk_shipping_rate_wrapper{ background: none repeat scroll 0 0 rgba(13, 11, 11, 0.72); display: none; height: 100%; left: 0; position:fixed; top: 0; width: 100%; z-index: 9999; } .wk_shipping_rate_wrapper .wk_mp_design{ position:relative; top: 10px; right: 0; left: 0; margin-right: auto; margin-left: auto; max-width: 35em; height: 40em; overflow: auto; overflow-x:hidden; border: 2px solid #7f8c8d; background: none repeat scroll 0 0 #fff; padding:7px; z-index: 999999999999; } .wk_shipping_rate_wrapper .wk_mp_design .input-box{ overflow: hidden !important; } .wk_shipping_rate_wrapper .wk_mp_design .block{ margin-bottom: 30px !important; } .wk_shipping_rate_wrapper .wk_mp_design .form-list li { margin-bottom: 10px; } .wk_shipping_rate_wrapper .wk_mp_design .wk_close_wrapper{ height: 24px; padding: 3px; width: 23px; text-align: center; border-radius:5px; float: right; font-weight: bold; background: #000; color: #fff; cursor: pointer; } .wk_shipping_rate_wrapper .wk_mp_shippingset{ height: 30em !important; } .wk_mp_design .block-account { display: block; margin-top: 10px; width: 50%; } .wk_mp_design .form-list label { color: #000; margin-bottom: 0; position: relative; z-index: 0; } #uploadshippingform li{ list-style: none; } #uploadshippingform ul{ padding: 0px; margin-top: 10px; } .wk_mp_design .form-list { margin: -16px auto; padding: 0px; } .wk_mp_design .form-list li { list-style: none; } .shipping_method_outer { margin-bottom: 20px; padding: 10px; } .shipping_method_head { height: 40px; width: 100%; background-color: #f0f0f0; border: 1px solid #ccc; box-sizing: border-box; } .shipping_method_head>label, .shipping_rate>label.label{ display: inline-block; padding: 10px; font-weight: 600; line-height: 1.1; font-size: 1.8rem; } .shipping_method_head label{ color: black; } .shipping_method_head span{ float: right; padding: 10px; } .shipping_rate .addlabel { float: right; color: #247FC6; font-weight: 400; line-height: 1.1; font-size: 1.6rem; padding: 10px; cursor: pointer; } .wk_shipping_rate_wrapper label.colortheme{ color: #247FC6; } .wkplussign { display: inline-block; width: 20px; border: 2px #247FC6 dotted; text-align: center; margin: 10px; font-weight: bold; font-size: 20px; height: 20px; line-height: 20px; cursor: pointer; } .colortheme{ color: #247FC6; } .wk-tooltip{ width: 30px; height: 30px; background-color: #247FC6; float: right; color: white; border-radius: 15px; text-align: center; font-weight: 700; line-height: 1.1; font-size: 2.4rem; margin-bottom: 2rem; cursor: pointer; } .wk-tooltip:before{ content: '?'; } .wk-tooltip p{ display: none; height: auto; width: 60%; border-radius: 3px; color: #65666A; background-color: #D2E3F3; position: absolute; right: 5px; font-size: small; font-weight: 600; margin-top: 10px; padding: 5px; line-height: 1.4em; } .wk-tooltip p:before{ content: ''; height: 0px; width: 0px; border: 6px solid transparent; border-bottom-color: #D2E3F3; position: absolute; top: -12px; right: 10px; } .wk-tooltip:hover p { display: block; } .add_shipping_form{ display: none; background-color: #F1F1F1; padding: 30px; } .add_shipping_form input[name='shipping_method'] { width: 300px; } .add_shipping_form>label{ float: left; padding: 10px; } .display_inline-block{ display: inline-block; } .wk_sugestion_list{ display: none; width: 300px; margin: 0px; padding: 0px; border: 1px solid #C2C2C2; box-sizing: border-box; max-height: 180px; overflow: auto; position: absolut7pxe; } .wk_sugestion_list>span{ margin: 0px!important; background-color: white; padding: 5px; display: block; cursor: pointer; } .wk_sugestion_list>span:hover{ background-color: #247FC6; color: white; } .wk_sugestion_list>span:first-child{ background-color: #F4F4F4; color: #B6B6B6; font-family: monospace; font-weight: 900; } .wk_ship_method_delete i{ color: black; } .wk_ship_method_delete, .wk_ship_method_delete label{ cursor: pointer; } .wk_mpshippingset{ margin-top: 30px; } .mpshipping { position: relative; } .mpshipping ul.nav { display:none; top: 0px; position: absolute; background-color: #f5f5f5; margin-left: 35%; border: 1px solid rgb(204, 204, 204); z-index: 9999; } .mpshipping:hover ul.nav { display:block; } .block-collapsible-nav .mpshipping.current .item a { font-weight: normal; border-left:none; } tr.merchant-shipping-value th span { padding-left: 15px!important; } .checkout-cart-index tr.totals.shipping, .checkout-index-index tr.totals.shipping { display: none; } /* #################################### */ @media (max-width: 500px) { #wk-mp-tr-heading th { padding: 0px 0px; font-size: 7px; } .wk-row-view td { padding: 0px; } } @media only screen and (min-width: 500px) and (max-width: 600px) { #wk-mp-tr-heading th { padding: 0px 0px; font-size: 12px; } .wk-row-view td { padding: 0px; } }