AlkantarClanX12
Current Path : /home/thanudqk/siamfreetour.com/wp-content/plugins/LayerSlider/assets/static/iguider/ |
Current File : //home/thanudqk/siamfreetour.com/wp-content/plugins/LayerSlider/assets/static/iguider/iGuider.css |
/* ========================= */ /* == Base iGuider Style === */ /* ========================= */ html { position:relative; } .rtl { direction: rtl; } .g-shape { position:fixed; z-index:-1; background:red; pointer-events: auto; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; opacity:0; } .g-disable .g-shape { z-index:999999; } .gFooter { z-index:1; } .g-modal-body p { margin-top:1.2em; } .g-modal-body > :first-child { margin-top:0; } .g-modal-body > :last-child { margin-bottom:0; } .g-modal-type { display:none; } .rtl .gBtn { direction: rtl; } /* ================================= */ /* =========== Preloader =========== */ /* ================================= */ .g-loader { width:30px; height:30px; border-radius:50%; background-color: rgba(191,191,191,0.7); position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); z-index:999999; opacity:0; pointer-events: none; touch-action: none; transition:opacity 0.5s; } .g-loader-b { width:4px; height:12px; border-radius:2px; position:absolute; bottom:13px; left:13px; background-color:#fff; opacity:0.7; animation: loader-b 0.4s linear infinite; transform-origin:center 10px; animation-play-state: paused; } @keyframes loader-b { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .g-loader-s { width:4px; height:10px; border-radius:2px; position:absolute; bottom:50%; left:13px; background-color:#fff; opacity:0.7; animation: loader-s 1.6s linear infinite; transform-origin:center 10px; animation-play-state: paused; } @keyframes loader-s { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .g-preloader .g-loader-s, .g-preloader .g-loader-b { animation-play-state: running; } .g-preloader .g-loader { opacity:1; } /* ================================= */ /* ====== Error Message Block ====== */ /* ================================= */ .gErrorMessage { background-color:#FFE1E1; color:#f00; padding:16px 32px; clear: both; position: relative; top: 0; left: 0; width: 100%; animation: error-m 0.3s linear 1; z-index: 0; } .gEventMessage { background-color:#fff5e1; color:#ff8a00; padding:16px 32px; clear: both; position: relative; top: 0; left: 0; width: 100%; animation: error-m 0.3s linear 1; z-index: 0; } @keyframes error-m { 0% { background-color:#FA8072; } 100% { background-color:#FFE1E1; } } /* ================================= */ /* ============ Tour Map =========== */ /* ================================= */ .g-map-pos-right { right:0; transform:translateX(101%); } .g-map-pos-left { left:0; transform:translateX(-101%); } .g-map-open .g-map-pos { display:block; transform:translateX(0); opacity:1; } .g-map-no-clickable .g-step-item { cursor: default; } .g-map-pos { opacity:0; position:fixed; z-index:9999999; overflow:hidden; overflow-y:auto; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } /* ================================= */ /* ========== Modal Window ========= */ /* ================================= */ .g-modal-size { position:relative; z-index:10; max-height:calc(100vh - 20px); } .gScroll { overflow:hidden; overflow-y:auto; } .gWidget { overflow:hidden; } .g-modal-timer-line .g-modal-timer { position:absolute; left:0; top:0; } .g-modal-timer-line .rtl .g-modal-timer { left:auto; right:0; } .gPage { direction: ltr; } .g-modal-prev-hide .g-modal-prev, .g-modal-next-hide .g-modal-next, .g-modal-step-hide .gPage, .g-modal-cont-hide .gContent, .g-modal-title-hide .gHeader, .g-modal-intro-hide .g-modal-start, .g-modal-intro-hide .g-modal-close-intro, .g-modal-continue-hide .g-modal-begin-first, .g-modal-continue-hide .g-modal-begin-continue, .g-modal-map-hide .g-modal-map, .g-modal-map-hide .g-map-pos, .g-pager-hide .gPage, .g-modal-intro-show.g-modal-start-hide .g-modal-start, .g-modal-close-hide .g-modal-close-tour, .g-timer-hide .gTimer { display:none; } .g-modal-close-tour, .g-modal-map, .g-modal-start, .g-modal-close-intro, .g-modal-next, .g-modal-prev, .g-modal-begin-first, .g-modal-begin-continue, .g-map-close-tour, .g-map-hide { cursor:pointer; } .g-modal-prev-show .g-modal-prev, .g-modal-next-show .g-modal-next, .g-modal-step-show .gPage, .g-modal-intro-show .g-modal-start, .g-modal-intro-show .g-modal-close-intro, .g-modal-continue-show .g-modal-begin-first, .g-modal-continue-show .g-modal-begin-continue, .g-modal-close-show .g-modal-close-tour, .g-modal-map-show .g-modal-map, .g-timer-show .g-modal-timer { display:inline-block; } .g-modal-cont-show .gContent, .g-modal-title-show .gHeader, .g-modal-map-show .g-map-pos, .g-timer-show .g-modal-timer { display:block; } .g-modal-pos { width:0 !important; left:-1000px; top:0; height:0 !important; position:fixed; z-index:999999; direction: ltr !important; } /*radial progress*/ .g-progress { transform: rotate(-90deg); } .g-progress__meter, .g-progress__value { fill: none; } .g-progress__value { stroke-linecap: round; } .g-map-pos, .g-map-pos *, .g-modal-pos, .g-modal-pos *, .g-map-pos *:after, .g-map-pos *:before, .g-modal-pos *:after, .g-modal-pos *:before { box-sizing:border-box; } .g-modal-pos:after { content:''; width:0; height:0; position:absolute; top:50%; left:50%; z-index:8; -webkit-transform:translate(-50%,-50%) rotate(45deg); -moz-transform:translate(-50%,-50%) rotate(45deg); -ms-transform:translate(-50%,-50%) rotate(45deg); -o-transform:translate(-50%,-50%) rotate(45deg); transform:translate(-50%,-50%) rotate(45deg); } #g-overlay-wrap { position: fixed; top: 0; left: 0; margin: auto; box-sizing: border-box; pointer-events: none; touch-action: none; z-index:999998; opacity:0; transition:opacity 0.3s; } .g-show #g-overlay-wrap { opacity:1; } .g-event body, .g-disable .iGuider-highlight { pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .iGuider-highlight, .g-map-pos, .g-modal-size { pointer-events: auto; -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text; } .cone-hide:after { display:none !important; } /* ================================= */ /* == Message in center of screen == */ /* ================================= */ [data-pos="c"][data-cone="c"][data-cont="c"] { width:0; position:fixed; top:50%; left:50%; height:auto !important; } [data-pos="c"][data-cone="c"][data-cont="c"]:after { display:none; } [data-pos="c"][data-cone="c"][data-cont="c"] .g-modal-size { left:50%; top:50%; position:relative; -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); transform:translate(-50%,-50%); } .gCover img, .gContent img { width:100%; display:block; } /* =========================== */ /* == Message in right side == */ /* =========================== */ [data-pos="r"][data-cone="b"][data-cont="t"]:after, [data-pos="r"][data-cone="t"][data-cont="t"]:after, [data-pos="r"][data-cone="c"][data-cont="t"]:after{ border-right-color: transparent; border-bottom-color: transparent; } [data-pos="r"][data-cone="b"][data-cont="b"]:after, [data-pos="r"][data-cone="t"][data-cont="b"]:after, [data-pos="r"][data-cone="c"][data-cont="b"]:after { border-left-color: transparent; border-top-color: transparent; } [data-pos="r"][data-cont="c"] .g-modal-size { top:50%; left:0; -webkit-transform:translate(0,-50%); -moz-transform:translate(0,-50%); -ms-transform:translate(0,-50%); -o-transform:translate(0,-50%); transform:translate(0,-50%); } [data-pos="r"][data-cont="b"] .g-modal-size { top:0; left:0; -webkit-transform:translate(0,0); -moz-transform:translate(0,0); -ms-transform:translate(0,0); -o-transform:translate(0,0); transform:translate(0,0); } [data-pos="r"][data-cont="t"] .g-modal-size { top:0; left:0; -webkit-transform:translate(0,-100%); -moz-transform:translate(0,-100%); -ms-transform:translate(0,-100%); -o-transform:translate(0,-100%); transform:translate(0,-100%); } /* ========================== */ /* == Message in left side == */ /* ========================== */ [data-pos="l"][data-cone="b"][data-cont="t"]:after, [data-pos="l"][data-cone="t"][data-cont="t"]:after, [data-pos="l"][data-cone="c"][data-cont="t"]:after{ border-right-color: transparent; border-bottom-color: transparent; } [data-pos="l"][data-cone="b"][data-cont="b"]:after, [data-pos="l"][data-cone="t"][data-cont="b"]:after, [data-pos="l"][data-cone="c"][data-cont="b"]:after { border-left-color: transparent; border-top-color: transparent; } [data-pos="l"][data-cont="c"] .g-modal-size { top:50%; left:0; -webkit-transform:translate(-100%,-50%); -moz-transform:translate(-100%,-50%); -ms-transform:translate(-100%,-50%); -o-transform:translate(-100%,-50%); transform:translate(-100%,-50%); } [data-pos="l"][data-cont="b"] .g-modal-size { top:0; left:0; -webkit-transform:translate(-100%,0); -moz-transform:translate(-100%,0); -ms-transform:translate(-100%,0); -o-transform:translate(-100%,0); transform:translate(-100%,0); } [data-pos="l"][data-cont="t"] .g-modal-size { top:0; left:0; -webkit-transform:translate(-100%,-100%); -moz-transform:translate(-100%,-100%); -ms-transform:translate(-100%,-100%); -o-transform:translate(-100%,-100%); transform:translate(-100%,-100%); } /* ============================ */ /* == Message in bottom side == */ /* ============================ */ [data-pos="b"][data-cone="l"][data-cont="l"]:after, [data-pos="b"][data-cone="r"][data-cont="l"]:after, [data-pos="b"][data-cone="c"][data-cont="l"]:after{ border-right-color: transparent; border-top-color: transparent; } [data-pos="b"][data-cone="l"][data-cont="r"]:after, [data-pos="b"][data-cone="r"][data-cont="r"]:after, [data-pos="b"][data-cone="c"][data-cont="r"]:after { border-left-color: transparent; border-bottom-color: transparent; } [data-pos="b"][data-cont="c"] .g-modal-size { left:50%; top:0; -webkit-transform:translate(-50%,0); -moz-transform:translate(-50%,0); -ms-transform:translate(-50%,0); -o-transform:translate(-50%,0); transform:translate(-50%,0); } [data-pos="b"][data-cont="l"] .g-modal-size { top:0; left:0; -webkit-transform:translate(-100%,0); -moz-transform:translate(-100%,0); -ms-transform:translate(-100%,0); -o-transform:translate(-100%,0); transform:translate(-100%,0); } [data-pos="b"][data-cont="r"] .g-modal-size { top:0; left:0; -webkit-transform:translate(0,0); -moz-transform:translate(0,0); -ms-transform:translate(0,0); -o-transform:translate(0,0); transform:translate(0,0); } /* ========================= */ /* == Message in top side == */ /* ========================= */ [data-pos="t"][data-cone="l"][data-cont="l"]:after, [data-pos="t"][data-cone="r"][data-cont="l"]:after, [data-pos="t"][data-cone="c"][data-cont="l"]:after{ border-right-color: transparent; border-top-color: transparent; } [data-pos="t"][data-cone="l"][data-cont="r"]:after, [data-pos="t"][data-cone="r"][data-cont="r"]:after, [data-pos="t"][data-cone="c"][data-cont="r"]:after { border-left-color: transparent; border-bottom-color: transparent; } [data-pos="t"][data-cont="c"] .g-modal-size { left:50%; top:0; -webkit-transform:translate(-50%,-100%); -moz-transform:translate(-50%,-100%); -ms-transform:translate(-50%,-100%); -o-transform:translate(-50%,-100%); transform:translate(-50%,-100%); } [data-pos="t"][data-cont="l"] .g-modal-size { top:0; left:0; -webkit-transform:translate(-100%,-100%); -moz-transform:translate(-100%,-100%); -ms-transform:translate(-100%,-100%); -o-transform:translate(-100%,-100%); transform:translate(-100%,-100%); } [data-pos="t"][data-cont="r"] .g-modal-size { top:0; left:0; -webkit-transform:translate(0,-100%); -moz-transform:translate(0,-100%); -ms-transform:translate(0,-100%); -o-transform:translate(0,-100%); transform:translate(0,-100%); } /* =========================== */ /* == Tour List Button == */ /* =========================== */ .iguider-btn { width: 60px; height: 60px; border-radius: 50%; position: fixed; bottom: 40px; right: 40px; z-index: 99999; background: #4285F4; cursor: pointer; text-align: center; font:16px/60px arial; line-height: 60px; color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 15px 0px, rgba(0, 0, 0, 0.15) 0px 3px 5px 0px; transition:transform 0.3s all; } .iguider-btn-shape { width: 60px; height: 60px; border-radius: 50%; position: absolute; top: -5px; left: 0; color:#fff; padding-top: 14px; overflow:hidden; } .iguider-btn-shape:after { content: 'Help'; color:#fff; font:11px/1.2em arial; text-transform:uppercase; display:block; padding-top:6px; transition:0.3s all; transform-origin:center bottom; } .iguider-btn-icon { display:block; transition:0.3s all; transform-origin:center top; line-height:1em; } .iguider-btn-icon:after { content:'?'; font-weight:700; line-height:17px; border:1px solid #fff; border-radius:50%; width:18px; height:18px; display:inline-block; } .iguider-btn:hover { box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 20px 0px, rgba(0, 0, 0, 0.15) 0px 5px 10px 0px; } .iguider-btn:hover .iguider-btn-shape:after, .g-tour-list-show .iguider-btn-shape:after{ opacity:0; transform:scale(0.5); } .iguider-btn:hover .iguider-btn-icon, .g-tour-list-show .iguider-btn-icon { display:block; transform:scale(2.3); } /* ========================= */ /* ======= Tour List ======= */ /* ========================= */ .iguider-btnCont { display:block; pointer-events: none; touch-action: none; opacity:0; position: absolute; bottom:100%; right:0; transform:translate(0,0); width: 320px; background-color: #fff; color:#000; text-align:left; padding: 20px 0; z-index: 999999; box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 30px -10px; line-height:1.2em; overflow:hidden; overflow-y:scroll; max-height:calc(100vh - 160px); transition:.3s all; } .tourlist-item { padding:20px 40px 20px 40px; background-color:#fff; position:relative; z-index:1; opacity:0; border-bottom:1px solid rgba(0,0,0,0.1); } .tourlist-item:last-child { border-bottom:0; } .tourlist-item:after { content:''; width:6px; height:6px; display:block; border-width:2px 2px 0 0; border-style:solid; border-color:rgb(56, 112, 189); position:absolute; right:18px; top:50%; transform:translateY(-50%) rotate(45deg); } .tourlist-item:before { content:''; width:20px; height:20px; display:block; position:absolute; right:10px; top:50%; transform:translateY(-50%); background:#fff; transition:0.1s all; } .tourlist-item-title { font:700 16px/1.2em arial; opacity:0.6; transition:0.1s all; } .tourlist-item-subtitle { font:12px/1.2em arial; opacity:0.5; padding-top:5px; } .tourlist-item + .tourlist-item { margin-top:0; } .tourlist-item:hover { /*box-shadow:40px 20px 40px -30px rgba(0,0,0,0.2), 40px -20px 40px -30px rgba(0,0,0,0.2);*/ position:relative; z-index:2; } .tourlist-item:hover:before { background:#eee; } .tourlist-item:hover .tourlist-item-title { opacity:1; } .g-tour-list-show .iguider-btnCont { opacity:1; pointer-events: auto; touch-action: auto; transform:translate(0,-20px); } /*responsive styles*/ @media only screen and (max-height: 500px) { .gMapBufer { height:0 !important; } .g-map-pos { top:5px !important; bottom:5px !important; } .gCover { display:none !important; } }