/*!
 *  Themify Icons
 *  https://themify.me/themify-icons
 */
@font-face{font-family:themify;src:url(../fonts/themify.eot);src:url(../fonts/themify.eot?#iefix-fvbane) format('embedded-opentype'),url(../fonts/themify.woff) format('woff'),url(../fonts/themify.ttf) format('truetype'),url(../fonts/themify.svg?-fvbane#themify) format('svg');font-weight:400;font-style:normal}[class*=" ti-"],[class^=ti-]{font-family:themify;speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.ti-wand:before{content:"\e600"}.ti-volume:before{content:"\e601"}.ti-user:before{content:"\e602"}.ti-unlock:before{content:"\e603"}.ti-unlink:before{content:"\e604"}.ti-trash:before{content:"\e605"}.ti-thought:before{content:"\e606"}.ti-target:before{content:"\e607"}.ti-tag:before{content:"\e608"}.ti-tablet:before{content:"\e609"}.ti-star:before{content:"\e60a"}.ti-spray:before{content:"\e60b"}.ti-signal:before{content:"\e60c"}.ti-shopping-cart:before{content:"\e60d"}.ti-shopping-cart-full:before{content:"\e60e"}.ti-settings:before{content:"\e60f"}.ti-search:before{content:"\e610"}.ti-zoom-in:before{content:"\e611"}.ti-zoom-out:before{content:"\e612"}.ti-cut:before{content:"\e613"}.ti-ruler:before{content:"\e614"}.ti-ruler-pencil:before{content:"\e615"}.ti-ruler-alt:before{content:"\e616"}.ti-bookmark:before{content:"\e617"}.ti-bookmark-alt:before{content:"\e618"}.ti-reload:before{content:"\e619"}.ti-plus:before{content:"\e61a"}.ti-pin:before{content:"\e61b"}.ti-pencil:before{content:"\e61c"}.ti-pencil-alt:before{content:"\e61d"}.ti-paint-roller:before{content:"\e61e"}.ti-paint-bucket:before{content:"\e61f"}.ti-na:before{content:"\e620"}.ti-mobile:before{content:"\e621"}.ti-minus:before{content:"\e622"}.ti-medall:before{content:"\e623"}.ti-medall-alt:before{content:"\e624"}.ti-marker:before{content:"\e625"}.ti-marker-alt:before{content:"\e626"}.ti-arrow-up:before{content:"\e627"}.ti-arrow-right:before{content:"\e628"}.ti-arrow-left:before{content:"\e629"}.ti-arrow-down:before{content:"\e62a"}.ti-lock:before{content:"\e62b"}.ti-location-arrow:before{content:"\e62c"}.ti-link:before{content:"\e62d"}.ti-layout:before{content:"\e62e"}.ti-layers:before{content:"\e62f"}.ti-layers-alt:before{content:"\e630"}.ti-key:before{content:"\e631"}.ti-import:before{content:"\e632"}.ti-image:before{content:"\e633"}.ti-heart:before{content:"\e634"}.ti-heart-broken:before{content:"\e635"}.ti-hand-stop:before{content:"\e636"}.ti-hand-open:before{content:"\e637"}.ti-hand-drag:before{content:"\e638"}.ti-folder:before{content:"\e639"}.ti-flag:before{content:"\e63a"}.ti-flag-alt:before{content:"\e63b"}.ti-flag-alt-2:before{content:"\e63c"}.ti-eye:before{content:"\e63d"}.ti-export:before{content:"\e63e"}.ti-exchange-vertical:before{content:"\e63f"}.ti-desktop:before{content:"\e640"}.ti-cup:before{content:"\e641"}.ti-crown:before{content:"\e642"}.ti-comments:before{content:"\e643"}.ti-comment:before{content:"\e644"}.ti-comment-alt:before{content:"\e645"}.ti-close:before{content:"\e646"}.ti-clip:before{content:"\e647"}.ti-angle-up:before{content:"\e648"}.ti-angle-right:before{content:"\e649"}.ti-angle-left:before{content:"\e64a"}.ti-angle-down:before{content:"\e64b"}.ti-check:before{content:"\e64c"}.ti-check-box:before{content:"\e64d"}.ti-camera:before{content:"\e64e"}.ti-announcement:before{content:"\e64f"}.ti-brush:before{content:"\e650"}.ti-briefcase:before{content:"\e651"}.ti-bolt:before{content:"\e652"}.ti-bolt-alt:before{content:"\e653"}.ti-blackboard:before{content:"\e654"}.ti-bag:before{content:"\e655"}.ti-move:before{content:"\e656"}.ti-arrows-vertical:before{content:"\e657"}.ti-arrows-horizontal:before{content:"\e658"}.ti-fullscreen:before{content:"\e659"}.ti-arrow-top-right:before{content:"\e65a"}.ti-arrow-top-left:before{content:"\e65b"}.ti-arrow-circle-up:before{content:"\e65c"}.ti-arrow-circle-right:before{content:"\e65d"}.ti-arrow-circle-left:before{content:"\e65e"}.ti-arrow-circle-down:before{content:"\e65f"}.ti-angle-double-up:before{content:"\e660"}.ti-angle-double-right:before{content:"\e661"}.ti-angle-double-left:before{content:"\e662"}.ti-angle-double-down:before{content:"\e663"}.ti-zip:before{content:"\e664"}.ti-world:before{content:"\e665"}.ti-wheelchair:before{content:"\e666"}.ti-view-list:before{content:"\e667"}.ti-view-list-alt:before{content:"\e668"}.ti-view-grid:before{content:"\e669"}.ti-uppercase:before{content:"\e66a"}.ti-upload:before{content:"\e66b"}.ti-underline:before{content:"\e66c"}.ti-truck:before{content:"\e66d"}.ti-timer:before{content:"\e66e"}.ti-ticket:before{content:"\e66f"}.ti-thumb-up:before{content:"\e670"}.ti-thumb-down:before{content:"\e671"}.ti-text:before{content:"\e672"}.ti-stats-up:before{content:"\e673"}.ti-stats-down:before{content:"\e674"}.ti-split-v:before{content:"\e675"}.ti-split-h:before{content:"\e676"}.ti-smallcap:before{content:"\e677"}.ti-shine:before{content:"\e678"}.ti-shift-right:before{content:"\e679"}.ti-shift-left:before{content:"\e67a"}.ti-shield:before{content:"\e67b"}.ti-notepad:before{content:"\e67c"}.ti-server:before{content:"\e67d"}.ti-quote-right:before{content:"\e67e"}.ti-quote-left:before{content:"\e67f"}.ti-pulse:before{content:"\e680"}.ti-printer:before{content:"\e681"}.ti-power-off:before{content:"\e682"}.ti-plug:before{content:"\e683"}.ti-pie-chart:before{content:"\e684"}.ti-paragraph:before{content:"\e685"}.ti-panel:before{content:"\e686"}.ti-package:before{content:"\e687"}.ti-music:before{content:"\e688"}.ti-music-alt:before{content:"\e689"}.ti-mouse:before{content:"\e68a"}.ti-mouse-alt:before{content:"\e68b"}.ti-money:before{content:"\e68c"}.ti-microphone:before{content:"\e68d"}.ti-menu:before{content:"\e68e"}.ti-menu-alt:before{content:"\e68f"}.ti-map:before{content:"\e690"}.ti-map-alt:before{content:"\e691"}.ti-loop:before{content:"\e692"}.ti-location-pin:before{content:"\e693"}.ti-list:before{content:"\e694"}.ti-light-bulb:before{content:"\e695"}.ti-Italic:before{content:"\e696"}.ti-info:before{content:"\e697"}.ti-infinite:before{content:"\e698"}.ti-id-badge:before{content:"\e699"}.ti-hummer:before{content:"\e69a"}.ti-home:before{content:"\e69b"}.ti-help:before{content:"\e69c"}.ti-headphone:before{content:"\e69d"}.ti-harddrives:before{content:"\e69e"}.ti-harddrive:before{content:"\e69f"}.ti-gift:before{content:"\e6a0"}.ti-game:before{content:"\e6a1"}.ti-filter:before{content:"\e6a2"}.ti-files:before{content:"\e6a3"}.ti-file:before{content:"\e6a4"}.ti-eraser:before{content:"\e6a5"}.ti-envelope:before{content:"\e6a6"}.ti-download:before{content:"\e6a7"}.ti-direction:before{content:"\e6a8"}.ti-direction-alt:before{content:"\e6a9"}.ti-dashboard:before{content:"\e6aa"}.ti-control-stop:before{content:"\e6ab"}.ti-control-shuffle:before{content:"\e6ac"}.ti-control-play:before{content:"\e6ad"}.ti-control-pause:before{content:"\e6ae"}.ti-control-forward:before{content:"\e6af"}.ti-control-backward:before{content:"\e6b0"}.ti-cloud:before{content:"\e6b1"}.ti-cloud-up:before{content:"\e6b2"}.ti-cloud-down:before{content:"\e6b3"}.ti-clipboard:before{content:"\e6b4"}.ti-car:before{content:"\e6b5"}.ti-calendar:before{content:"\e6b6"}.ti-book:before{content:"\e6b7"}.ti-bell:before{content:"\e6b8"}.ti-basketball:before{content:"\e6b9"}.ti-bar-chart:before{content:"\e6ba"}.ti-bar-chart-alt:before{content:"\e6bb"}.ti-back-right:before{content:"\e6bc"}.ti-back-left:before{content:"\e6bd"}.ti-arrows-corner:before{content:"\e6be"}.ti-archive:before{content:"\e6bf"}.ti-anchor:before{content:"\e6c0"}.ti-align-right:before{content:"\e6c1"}.ti-align-left:before{content:"\e6c2"}.ti-align-justify:before{content:"\e6c3"}.ti-align-center:before{content:"\e6c4"}.ti-alert:before{content:"\e6c5"}.ti-alarm-clock:before{content:"\e6c6"}.ti-agenda:before{content:"\e6c7"}.ti-write:before{content:"\e6c8"}.ti-window:before{content:"\e6c9"}.ti-widgetized:before{content:"\e6ca"}.ti-widget:before{content:"\e6cb"}.ti-widget-alt:before{content:"\e6cc"}.ti-wallet:before{content:"\e6cd"}.ti-video-clapper:before{content:"\e6ce"}.ti-video-camera:before{content:"\e6cf"}.ti-vector:before{content:"\e6d0"}.ti-themify-logo:before{content:"\e6d1"}.ti-themify-favicon:before{content:"\e6d2"}.ti-themify-favicon-alt:before{content:"\e6d3"}.ti-support:before{content:"\e6d4"}.ti-stamp:before{content:"\e6d5"}.ti-split-v-alt:before{content:"\e6d6"}.ti-slice:before{content:"\e6d7"}.ti-shortcode:before{content:"\e6d8"}.ti-shift-right-alt:before{content:"\e6d9"}.ti-shift-left-alt:before{content:"\e6da"}.ti-ruler-alt-2:before{content:"\e6db"}.ti-receipt:before{content:"\e6dc"}.ti-pin2:before{content:"\e6dd"}.ti-pin-alt:before{content:"\e6de"}.ti-pencil-alt2:before{content:"\e6df"}.ti-palette:before{content:"\e6e0"}.ti-more:before{content:"\e6e1"}.ti-more-alt:before{content:"\e6e2"}.ti-microphone-alt:before{content:"\e6e3"}.ti-magnet:before{content:"\e6e4"}.ti-line-double:before{content:"\e6e5"}.ti-line-dotted:before{content:"\e6e6"}.ti-line-dashed:before{content:"\e6e7"}.ti-layout-width-full:before{content:"\e6e8"}.ti-layout-width-default:before{content:"\e6e9"}.ti-layout-width-default-alt:before{content:"\e6ea"}.ti-layout-tab:before{content:"\e6eb"}.ti-layout-tab-window:before{content:"\e6ec"}.ti-layout-tab-v:before{content:"\e6ed"}.ti-layout-tab-min:before{content:"\e6ee"}.ti-layout-slider:before{content:"\e6ef"}.ti-layout-slider-alt:before{content:"\e6f0"}.ti-layout-sidebar-right:before{content:"\e6f1"}.ti-layout-sidebar-none:before{content:"\e6f2"}.ti-layout-sidebar-left:before{content:"\e6f3"}.ti-layout-placeholder:before{content:"\e6f4"}.ti-layout-menu:before{content:"\e6f5"}.ti-layout-menu-v:before{content:"\e6f6"}.ti-layout-menu-separated:before{content:"\e6f7"}.ti-layout-menu-full:before{content:"\e6f8"}.ti-layout-media-right-alt:before{content:"\e6f9"}.ti-layout-media-right:before{content:"\e6fa"}.ti-layout-media-overlay:before{content:"\e6fb"}.ti-layout-media-overlay-alt:before{content:"\e6fc"}.ti-layout-media-overlay-alt-2:before{content:"\e6fd"}.ti-layout-media-left-alt:before{content:"\e6fe"}.ti-layout-media-left:before{content:"\e6ff"}.ti-layout-media-center-alt:before{content:"\e700"}.ti-layout-media-center:before{content:"\e701"}.ti-layout-list-thumb:before{content:"\e702"}.ti-layout-list-thumb-alt:before{content:"\e703"}.ti-layout-list-post:before{content:"\e704"}.ti-layout-list-large-image:before{content:"\e705"}.ti-layout-line-solid:before{content:"\e706"}.ti-layout-grid4:before{content:"\e707"}.ti-layout-grid3:before{content:"\e708"}.ti-layout-grid2:before{content:"\e709"}.ti-layout-grid2-thumb:before{content:"\e70a"}.ti-layout-cta-right:before{content:"\e70b"}.ti-layout-cta-left:before{content:"\e70c"}.ti-layout-cta-center:before{content:"\e70d"}.ti-layout-cta-btn-right:before{content:"\e70e"}.ti-layout-cta-btn-left:before{content:"\e70f"}.ti-layout-column4:before{content:"\e710"}.ti-layout-column3:before{content:"\e711"}.ti-layout-column2:before{content:"\e712"}.ti-layout-accordion-separated:before{content:"\e713"}.ti-layout-accordion-merged:before{content:"\e714"}.ti-layout-accordion-list:before{content:"\e715"}.ti-ink-pen:before{content:"\e716"}.ti-info-alt:before{content:"\e717"}.ti-help-alt:before{content:"\e718"}.ti-headphone-alt:before{content:"\e719"}.ti-hand-point-up:before{content:"\e71a"}.ti-hand-point-right:before{content:"\e71b"}.ti-hand-point-left:before{content:"\e71c"}.ti-hand-point-down:before{content:"\e71d"}.ti-gallery:before{content:"\e71e"}.ti-face-smile:before{content:"\e71f"}.ti-face-sad:before{content:"\e720"}.ti-credit-card:before{content:"\e721"}.ti-control-skip-forward:before{content:"\e722"}.ti-control-skip-backward:before{content:"\e723"}.ti-control-record:before{content:"\e724"}.ti-control-eject:before{content:"\e725"}.ti-comments-smiley:before{content:"\e726"}.ti-brush-alt:before{content:"\e727"}.ti-youtube:before{content:"\e728"}.ti-vimeo:before{content:"\e729"}.ti-twitter:before{content:"\e72a"}.ti-time:before{content:"\e72b"}.ti-tumblr:before{content:"\e72c"}.ti-skype:before{content:"\e72d"}.ti-share:before{content:"\e72e"}.ti-share-alt:before{content:"\e72f"}.ti-rocket:before{content:"\e730"}.ti-pinterest:before{content:"\e731"}.ti-new-window:before{content:"\e732"}.ti-microsoft:before{content:"\e733"}.ti-list-ol:before{content:"\e734"}.ti-linkedin:before{content:"\e735"}.ti-layout-sidebar-2:before{content:"\e736"}.ti-layout-grid4-alt:before{content:"\e737"}.ti-layout-grid3-alt:before{content:"\e738"}.ti-layout-grid2-alt:before{content:"\e739"}.ti-layout-column4-alt:before{content:"\e73a"}.ti-layout-column3-alt:before{content:"\e73b"}.ti-layout-column2-alt:before{content:"\e73c"}.ti-instagram:before{content:"\e73d"}.ti-google:before{content:"\e73e"}.ti-github:before{content:"\e73f"}.ti-flickr:before{content:"\e740"}.ti-facebook:before{content:"\e741"}.ti-dropbox:before{content:"\e742"}.ti-dribbble:before{content:"\e743"}.ti-apple:before{content:"\e744"}.ti-android:before{content:"\e745"}.ti-save:before{content:"\e746"}.ti-save-alt:before{content:"\e747"}.ti-yahoo:before{content:"\e748"}.ti-wordpress:before{content:"\e749"}.ti-vimeo-alt:before{content:"\e74a"}.ti-twitter-alt:before{content:"\e74b"}.ti-tumblr-alt:before{content:"\e74c"}.ti-trello:before{content:"\e74d"}.ti-stack-overflow:before{content:"\e74e"}.ti-soundcloud:before{content:"\e74f"}.ti-sharethis:before{content:"\e750"}.ti-sharethis-alt:before{content:"\e751"}.ti-reddit:before{content:"\e752"}.ti-pinterest-alt:before{content:"\e753"}.ti-microsoft-alt:before{content:"\e754"}.ti-linux:before{content:"\e755"}.ti-jsfiddle:before{content:"\e756"}.ti-joomla:before{content:"\e757"}.ti-html5:before{content:"\e758"}.ti-flickr-alt:before{content:"\e759"}.ti-email:before{content:"\e75a"}.ti-drupal:before{content:"\e75b"}.ti-dropbox-alt:before{content:"\e75c"}.ti-css3:before{content:"\e75d"}.ti-rss:before{content:"\e75e"}.ti-rss-alt:before{content:"\e75f"}
/*!
 *  GLightbox.js
 */
.glightbox-container{width:100%;height:100%;position:fixed;top:0;left:0;z-index:999999!important;overflow:hidden;-ms-touch-action:none;touch-action:none;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;outline:0}.glightbox-container.inactive{display:none}.glightbox-container .gcontainer{position:relative;width:100%;height:100%;z-index:9999;overflow:hidden}.glightbox-container .gslider{-webkit-transition:-webkit-transform .4s ease;transition:-webkit-transform .4s ease;transition:transform .4s ease;transition:transform .4s ease,-webkit-transform .4s ease;height:100%;left:0;top:0;width:100%;position:relative;overflow:hidden;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.glightbox-container .gslide{width:100%;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;opacity:0}.glightbox-container .gslide.current{opacity:1;z-index:99999;position:relative}.glightbox-container .gslide.prev{opacity:1;z-index:9999}.glightbox-container .gslide-inner-content{width:100%}.glightbox-container .ginner-container{position:relative;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;max-width:100%;margin:auto;height:100vh}.glightbox-container .ginner-container.gvideo-container{width:100%}.glightbox-container .ginner-container.desc-bottom,.glightbox-container .ginner-container.desc-top{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.glightbox-container .ginner-container.desc-left,.glightbox-container .ginner-container.desc-right{max-width:100%!important}.gslide iframe,.gslide video{outline:0!important;border:none;min-height:165px;-webkit-overflow-scrolling:touch;-ms-touch-action:auto;touch-action:auto}.gslide:not(.current){pointer-events:none}.gslide-image{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.gslide-image img{max-height:100vh;display:block;padding:0;float:none;outline:0;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;max-width:100vw;width:auto;height:auto;-o-object-fit:cover;object-fit:cover;-ms-touch-action:none;touch-action:none;margin:auto;min-width:200px}.desc-bottom .gslide-image img,.desc-top .gslide-image img{width:auto}.desc-left .gslide-image img,.desc-right .gslide-image img{width:auto;max-width:100%}.gslide-image img.zoomable{position:relative}.gslide-image img.dragging{cursor:-webkit-grabbing!important;cursor:grabbing!important;-webkit-transition:none;transition:none}.gslide-video{position:relative;max-width:100vh;width:100%!important}.gslide-video .plyr__poster-enabled.plyr--loading .plyr__poster{display:none}.gslide-video .gvideo-wrapper{width:100%;margin:auto}.gslide-video::before{content:'';position:absolute;width:100%;height:100%;background:rgba(255,0,0,.34);display:none}.gslide-video.playing::before{display:none}.gslide-video.fullscreen{max-width:100%!important;min-width:100%;height:75vh}.gslide-video.fullscreen video{max-width:100%!important;width:100%!important}.gslide-inline{background:#fff;text-align:left;max-height:calc(100vh - 40px);overflow:auto;max-width:100%;margin:auto}.gslide-inline .ginlined-content{padding:20px;width:100%}.gslide-inline .dragging{cursor:-webkit-grabbing!important;cursor:grabbing!important;-webkit-transition:none;transition:none}.ginlined-content{overflow:auto;display:block!important;opacity:1}.gslide-external{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;min-width:100%;background:#fff;padding:0;overflow:auto;max-height:75vh;height:100%}.gslide-media{display:-webkit-box;display:-ms-flexbox;display:flex;width:auto}.zoomed .gslide-media{-webkit-box-shadow:none!important;box-shadow:none!important}.desc-bottom .gslide-media,.desc-top .gslide-media{margin:0 auto;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.gslide-description{position:relative;-webkit-box-flex:1;-ms-flex:1 0 100%;flex:1 0 100%}.gslide-description.description-left,.gslide-description.description-right{max-width:100%}.gslide-description.description-bottom,.gslide-description.description-top{margin:0 auto;width:100%}.gslide-description p{margin-bottom:12px}.gslide-description p:last-child{margin-bottom:0}.zoomed .gslide-description{display:none}.glightbox-button-hidden{display:none}.glightbox-mobile .glightbox-container .gslide-description{height:auto!important;width:100%;position:absolute;bottom:0;padding:19px 11px;max-width:100vw!important;-webkit-box-ordinal-group:3!important;-ms-flex-order:2!important;order:2!important;max-height:78vh;overflow:auto!important;background:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,.75)));background:linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.75) 100%);-webkit-transition:opacity .3s linear;transition:opacity .3s linear;padding-bottom:50px}.glightbox-mobile .glightbox-container .gslide-title{color:#fff;font-size:1em}.glightbox-mobile .glightbox-container .gslide-desc{color:#a1a1a1}.glightbox-mobile .glightbox-container .gslide-desc a{color:#fff;font-weight:700}.glightbox-mobile .glightbox-container .gslide-desc *{color:inherit}.glightbox-mobile .glightbox-container .gslide-desc .desc-more{color:#fff;opacity:.4}.gdesc-open .gslide-media{-webkit-transition:opacity .5s ease;transition:opacity .5s ease;opacity:.4}.gdesc-open .gdesc-inner{padding-bottom:30px}.gdesc-closed .gslide-media{-webkit-transition:opacity .5s ease;transition:opacity .5s ease;opacity:1}.greset{-webkit-transition:all .3s ease;transition:all .3s ease}.gabsolute{position:absolute}.grelative{position:relative}.glightbox-desc{display:none!important}.glightbox-open{overflow:hidden}.gloader{height:25px;width:25px;-webkit-animation:lightboxLoader .8s infinite linear;animation:lightboxLoader .8s infinite linear;border:2px solid #fff;border-right-color:transparent;border-radius:50%;position:absolute;display:block;z-index:9999;left:0;right:0;margin:0 auto;top:47%}.goverlay{width:100%;height:calc(100vh + 1px);position:fixed;top:-1px;left:0;background:#000;will-change:opacity}.glightbox-mobile .goverlay{background:#000}.gclose,.gnext,.gprev{z-index:99999;cursor:pointer;width:26px;height:44px;border:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.gclose svg,.gnext svg,.gprev svg{display:block;width:25px;height:auto;margin:0;padding:0}.gclose.disabled,.gnext.disabled,.gprev.disabled{opacity:.1}.gclose .garrow,.gnext .garrow,.gprev .garrow{stroke:#fff}.gbtn.focused{outline:2px solid #0f3d81}iframe.wait-autoplay{opacity:0}.glightbox-closing .gclose,.glightbox-closing .gnext,.glightbox-closing .gprev{opacity:0!important}.glightbox-clean .gslide-description{background:#fff}.glightbox-clean .gdesc-inner{padding:22px 20px}.glightbox-clean .gslide-title{font-size:1em;font-weight:400;font-family:arial;color:#000;margin-bottom:19px;line-height:1.4em}.glightbox-clean .gslide-desc{font-size:.86em;margin-bottom:0;font-family:arial;line-height:1.4em}.glightbox-clean .gslide-video{background:#000}.glightbox-clean .gclose,.glightbox-clean .gnext,.glightbox-clean .gprev{background-color:rgba(0,0,0,.75);border-radius:4px}.glightbox-clean .gclose path,.glightbox-clean .gnext path,.glightbox-clean .gprev path{fill:#fff}.glightbox-clean .gprev{position:absolute;top:-100%;left:30px;width:40px;height:50px}.glightbox-clean .gnext{position:absolute;top:-100%;right:30px;width:40px;height:50px}.glightbox-clean .gclose{width:35px;height:35px;top:15px;right:10px;position:absolute}.glightbox-clean .gclose svg{width:18px;height:auto}.glightbox-clean .gclose:hover{opacity:1}.gfadeIn{-webkit-animation:gfadeIn .5s ease;animation:gfadeIn .5s ease}.gfadeOut{-webkit-animation:gfadeOut .5s ease;animation:gfadeOut .5s ease}.gslideOutLeft{-webkit-animation:gslideOutLeft .3s ease;animation:gslideOutLeft .3s ease}.gslideInLeft{-webkit-animation:gslideInLeft .3s ease;animation:gslideInLeft .3s ease}.gslideOutRight{-webkit-animation:gslideOutRight .3s ease;animation:gslideOutRight .3s ease}.gslideInRight{-webkit-animation:gslideInRight .3s ease;animation:gslideInRight .3s ease}.gzoomIn{-webkit-animation:gzoomIn .5s ease;animation:gzoomIn .5s ease}.gzoomOut{-webkit-animation:gzoomOut .5s ease;animation:gzoomOut .5s ease}@-webkit-keyframes lightboxLoader{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes lightboxLoader{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes gfadeIn{from{opacity:0}to{opacity:1}}@keyframes gfadeIn{from{opacity:0}to{opacity:1}}@-webkit-keyframes gfadeOut{from{opacity:1}to{opacity:0}}@keyframes gfadeOut{from{opacity:1}to{opacity:0}}@-webkit-keyframes gslideInLeft{from{opacity:0;-webkit-transform:translate3d(-60%,0,0);transform:translate3d(-60%,0,0)}to{visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes gslideInLeft{from{opacity:0;-webkit-transform:translate3d(-60%,0,0);transform:translate3d(-60%,0,0)}to{visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes gslideOutLeft{from{opacity:1;visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(-60%,0,0);transform:translate3d(-60%,0,0);opacity:0;visibility:hidden}}@keyframes gslideOutLeft{from{opacity:1;visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(-60%,0,0);transform:translate3d(-60%,0,0);opacity:0;visibility:hidden}}@-webkit-keyframes gslideInRight{from{opacity:0;visibility:visible;-webkit-transform:translate3d(60%,0,0);transform:translate3d(60%,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes gslideInRight{from{opacity:0;visibility:visible;-webkit-transform:translate3d(60%,0,0);transform:translate3d(60%,0,0)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@-webkit-keyframes gslideOutRight{from{opacity:1;visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(60%,0,0);transform:translate3d(60%,0,0);opacity:0}}@keyframes gslideOutRight{from{opacity:1;visibility:visible;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(60%,0,0);transform:translate3d(60%,0,0);opacity:0}}@-webkit-keyframes gzoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:1}}@keyframes gzoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:1}}@-webkit-keyframes gzoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}@keyframes gzoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}@media (min-width:769px){.glightbox-container .ginner-container{width:auto;height:auto;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.glightbox-container .ginner-container.desc-top .gslide-description{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.glightbox-container .ginner-container.desc-top .gslide-image,.glightbox-container .ginner-container.desc-top .gslide-image img{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.glightbox-container .ginner-container.desc-left .gslide-description{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0}.glightbox-container .ginner-container.desc-left .gslide-image{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.gslide-image img{max-height:97vh;max-width:100%}.gslide-image img.zoomable{cursor:-webkit-zoom-in;cursor:zoom-in}.zoomed .gslide-image img.zoomable{cursor:-webkit-grab;cursor:grab}.gslide-inline{max-height:95vh}.gslide-external{max-height:100vh}.gslide-description.description-left,.gslide-description.description-right{max-width:275px}.glightbox-open{height:auto}.goverlay{background:rgba(0,0,0,.92)}.glightbox-clean .gslide-media{-webkit-box-shadow:1px 2px 9px 0 rgba(0,0,0,.65);box-shadow:1px 2px 9px 0 rgba(0,0,0,.65)}.glightbox-clean .description-left .gdesc-inner,.glightbox-clean .description-right .gdesc-inner{position:absolute;height:100%;overflow-y:auto}.glightbox-clean .gclose,.glightbox-clean .gnext,.glightbox-clean .gprev{background-color:rgba(0,0,0,.32)}.glightbox-clean .gclose:hover,.glightbox-clean .gnext:hover,.glightbox-clean .gprev:hover{background-color:rgba(0,0,0,.7)}.glightbox-clean .gprev{top:45%}.glightbox-clean .gnext{top:45%}}@media (min-width:992px){.glightbox-clean .gclose{opacity:.7;right:20px}}@media screen and (max-height:420px){.goverlay{background:#000}}
/*!
 *  ET LINE ICONS
 */
 @font-face{font-family:et-line;src:url(../fonts/et-line.eot);src:url(../fonts/et-line.eot?#iefix) format('embedded-opentype'),url(../fonts/et-line.woff) format('woff'),url(../fonts/et-line.ttf) format('truetype'),url(../fonts/et-line.svg#et-line) format('svg');font-weight:400;font-style:normal}[data-icon]:before{font-family:et-line;content:attr(data-icon);speak:none;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:inline-block}.icon-adjustments,.icon-alarmclock,.icon-anchor,.icon-aperture,.icon-attachment,.icon-bargraph,.icon-basket,.icon-beaker,.icon-bike,.icon-book-open,.icon-briefcase,.icon-browser,.icon-calendar,.icon-camera,.icon-caution,.icon-chat,.icon-circle-compass,.icon-clipboard,.icon-clock,.icon-cloud,.icon-compass,.icon-desktop,.icon-dial,.icon-document,.icon-documents,.icon-download,.icon-dribbble,.icon-edit,.icon-envelope,.icon-expand,.icon-facebook,.icon-flag,.icon-focus,.icon-gears,.icon-genius,.icon-gift,.icon-global,.icon-globe,.icon-googleplus,.icon-grid,.icon-happy,.icon-hazardous,.icon-heart,.icon-hotairballoon,.icon-hourglass,.icon-key,.icon-laptop,.icon-layers,.icon-lifesaver,.icon-lightbulb,.icon-linegraph,.icon-linkedin,.icon-lock,.icon-magnifying-glass,.icon-map,.icon-map-pin,.icon-megaphone,.icon-mic,.icon-mobile,.icon-newspaper,.icon-notebook,.icon-paintbrush,.icon-paperclip,.icon-pencil,.icon-phone,.icon-picture,.icon-pictures,.icon-piechart,.icon-presentation,.icon-pricetags,.icon-printer,.icon-profile-female,.icon-profile-male,.icon-puzzle,.icon-quote,.icon-recycle,.icon-refresh,.icon-ribbon,.icon-rss,.icon-sad,.icon-scissors,.icon-scope,.icon-search,.icon-shield,.icon-speedometer,.icon-strategy,.icon-streetsign,.icon-tablet,.icon-target,.icon-telescope,.icon-toolbox,.icon-tools,.icon-tools-2,.icon-trophy,.icon-tumblr,.icon-twitter,.icon-upload,.icon-video,.icon-wallet,.icon-wine{font-family:et-line;speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:inline-block}.icon-mobile:before{content:"\e000"}.icon-laptop:before{content:"\e001"}.icon-desktop:before{content:"\e002"}.icon-tablet:before{content:"\e003"}.icon-phone:before{content:"\e004"}.icon-document:before{content:"\e005"}.icon-documents:before{content:"\e006"}.icon-search:before{content:"\e007"}.icon-clipboard:before{content:"\e008"}.icon-newspaper:before{content:"\e009"}.icon-notebook:before{content:"\e00a"}.icon-book-open:before{content:"\e00b"}.icon-browser:before{content:"\e00c"}.icon-calendar:before{content:"\e00d"}.icon-presentation:before{content:"\e00e"}.icon-picture:before{content:"\e00f"}.icon-pictures:before{content:"\e010"}.icon-video:before{content:"\e011"}.icon-camera:before{content:"\e012"}.icon-printer:before{content:"\e013"}.icon-toolbox:before{content:"\e014"}.icon-briefcase:before{content:"\e015"}.icon-wallet:before{content:"\e016"}.icon-gift:before{content:"\e017"}.icon-bargraph:before{content:"\e018"}.icon-grid:before{content:"\e019"}.icon-expand:before{content:"\e01a"}.icon-focus:before{content:"\e01b"}.icon-edit:before{content:"\e01c"}.icon-adjustments:before{content:"\e01d"}.icon-ribbon:before{content:"\e01e"}.icon-hourglass:before{content:"\e01f"}.icon-lock:before{content:"\e020"}.icon-megaphone:before{content:"\e021"}.icon-shield:before{content:"\e022"}.icon-trophy:before{content:"\e023"}.icon-flag:before{content:"\e024"}.icon-map:before{content:"\e025"}.icon-puzzle:before{content:"\e026"}.icon-basket:before{content:"\e027"}.icon-envelope:before{content:"\e028"}.icon-streetsign:before{content:"\e029"}.icon-telescope:before{content:"\e02a"}.icon-gears:before{content:"\e02b"}.icon-key:before{content:"\e02c"}.icon-paperclip:before{content:"\e02d"}.icon-attachment:before{content:"\e02e"}.icon-pricetags:before{content:"\e02f"}.icon-lightbulb:before{content:"\e030"}.icon-layers:before{content:"\e031"}.icon-pencil:before{content:"\e032"}.icon-tools:before{content:"\e033"}.icon-tools-2:before{content:"\e034"}.icon-scissors:before{content:"\e035"}.icon-paintbrush:before{content:"\e036"}.icon-magnifying-glass:before{content:"\e037"}.icon-circle-compass:before{content:"\e038"}.icon-linegraph:before{content:"\e039"}.icon-mic:before{content:"\e03a"}.icon-strategy:before{content:"\e03b"}.icon-beaker:before{content:"\e03c"}.icon-caution:before{content:"\e03d"}.icon-recycle:before{content:"\e03e"}.icon-anchor:before{content:"\e03f"}.icon-profile-male:before{content:"\e040"}.icon-profile-female:before{content:"\e041"}.icon-bike:before{content:"\e042"}.icon-wine:before{content:"\e043"}.icon-hotairballoon:before{content:"\e044"}.icon-globe:before{content:"\e045"}.icon-genius:before{content:"\e046"}.icon-map-pin:before{content:"\e047"}.icon-dial:before{content:"\e048"}.icon-chat:before{content:"\e049"}.icon-heart:before{content:"\e04a"}.icon-cloud:before{content:"\e04b"}.icon-upload:before{content:"\e04c"}.icon-download:before{content:"\e04d"}.icon-target:before{content:"\e04e"}.icon-hazardous:before{content:"\e04f"}.icon-piechart:before{content:"\e050"}.icon-speedometer:before{content:"\e051"}.icon-global:before{content:"\e052"}.icon-compass:before{content:"\e053"}.icon-lifesaver:before{content:"\e054"}.icon-clock:before{content:"\e055"}.icon-aperture:before{content:"\e056"}.icon-quote:before{content:"\e057"}.icon-scope:before{content:"\e058"}.icon-alarmclock:before{content:"\e059"}.icon-refresh:before{content:"\e05a"}.icon-happy:before{content:"\e05b"}.icon-sad:before{content:"\e05c"}.icon-facebook:before{content:"\e05d"}.icon-twitter:before{content:"\e05e"}.icon-googleplus:before{content:"\e05f"}.icon-rss:before{content:"\e060"}.icon-tumblr:before{content:"\e061"}.icon-linkedin:before{content:"\e062"}.icon-dribbble:before{content:"\e063"}
/******************************************************************
	
	
	@ Item          REFRAME - Personal One Page HTML Template
	@ Version       1.1
	@ Author		Avanzare
	@ Website		http://themeforest.net/user/avanzare 
	

 ******************************************************************


	-----------------------------
	----- TABLE OF CONTENTS -----
	-----------------------------
	
	--  1. Typography
    --  2. Basics
	--  3. Forms
	--  4. Loading Screen
	--  5. UI Components
	--  6. Menu
	--  7. Ultility
	--  8. Skeleton Components
    --  9. Background Components
    --  10. Plugins
 
 
 ******************************************************************/



/** 1. TYPOGRAPHY
*******************************************************************/

html
{
    font-size: 10px;
    font-size: calc(100vw / 192);
}

@media(max-width: 800px) {

    html
    {
        font-size: 8px;
    }

}

@media(max-width: 500px) {

    html
    {
        font-size: 6px;
    }

}

body
{
    font-size: 1.4rem;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 300;

    color: #fff;
    background:#212121;

    -webkit-font-smoothing: antialiased;
}

body.cursor-hidden::-webkit-scrollbar 
{
    display: none;
} 

body.cursor-hidden 
{
    -ms-overflow-style: none;
    scrollbar-width: none; 
} 

h1,
h2,
h3,
h4,
h5,
h6
{
    letter-spacing: -0.005em;
    line-height: 1.1em;
    margin-top: 0em;
    margin-bottom: 0;
    font-weight: 300;
    font-family: 'Source Sans Pro', sans-serif;
}

h1
{
    font-size: 10rem;
    line-height: 1em;
    font-weight: 200;
}

h2
{
    font-size: 6.5rem;
    font-weight: 200;
}

h3
{
    font-size: 5rem;
}

h4
{
    font-size: 4rem;
}

h5
{
    font-size: 3.4rem;
    line-height: 1.18em;
}

h6
{
    font-size: 3rem;
    font-weight: 500;
}

p
{
    font-size: 3.4rem;
    line-height: 1.4em;
    letter-spacing: -0.005em;
    font-weight: 300;
    margin-top: 0;
    margin-bottom: 0rem;
    color: #7c7c7c;
    font-family: 'Source Sans Pro', sans-serif;
}

p.small
{
    font-size: 2.1rem;
    line-height: 1.48em;
    letter-spacing: 0;
    font-weight: 400;
}


p.tag
{
    font-size: 1.3rem;
    letter-spacing: 0.14em;
    font-weight: 700;
    color: #fff;
}

a,
a:hover,
a:focus
{
    cursor: pointer;
    -webkit-transition: all 150ms ease;
    -o-transition: all 150ms ease;
    transition: all 150ms ease;
    text-decoration: none;
    outline: none !important;
    outline-color: unset !important;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
      -webkit-user-select: none; 
         -moz-user-select: none; 
          -ms-user-select: none; 
              user-select: none; 
    color: #fff;
}

span
{
    color: #7c7c7c;
}

::-moz-selection 
{
    background: none;
    color: #fdc60c;
}

::selection 
{
    background: none;
    color: #fdc60c;
}

::-moz-selection 
{
    background: none;
    color: #fdc60c;
}



/** 2. Basics
*****************************************************************/

img,svg
{
    vertical-align: middle;
}

button
{
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
      -webkit-user-select: none; 
         -moz-user-select: none; 
          -ms-user-select: none; 
              user-select: none; 
    background: none;
    border: none;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    cursor: pointer;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    font-size: 3.4rem;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    line-height: 1.4em;
    font-weight: 300;
    letter-spacing: -0.005em;
    font-family: inherit;
    padding: 0;
    margin: 0;
    height: 8.7rem;
}

button.button-filled
{
    background: #161616;
    padding: 0 4.5rem;
    border-radius: 200px;
}

button.button-border
{
    border: 0.1rem solid #fff;
    border-radius: 200px;
    padding: 0 4.5rem;
}

button.button-filled span.icon,
button.button-border span.icon
{
    font-size: 2.1rem;
    color: #fff;
}


button .button-text
{
    font-size: 3.4rem;
    color: #fff;
}

ul.default-list
{
    list-style: none;
    padding: 0;
    margin: 0;
}

ul.default-list li
{
    font-size: 2.1rem;
    line-height: 6.5rem;
}

ul.icon-list span,
ul.icon-list p
{
    display: inline-block;
}

ul.icon-list span
{
    margin-right: 1.8rem;
}

ul.icon-list.icon-filled span
{
    background: #181818;
    width: 5rem;
    height: 5rem;
    border-radius: 100%;
    text-align: center;
    line-height: 5rem;
}

table
{
    width: 100%;
    border-collapse: collapse;
}

table tr
{
    position: relative;
}

table th
{
    text-align: left;
    margin-bottom: 1rem;
}

table tbody tr
{
    border-bottom: 0.1rem solid rgba(255, 255, 255, 0.2);
}

table tbody td
{
    padding: 4rem 0 2.2rem;
    position: relative;
}

table tbody tr:first-child td
{
    padding-top: 3rem;
}

html.no-cursor
{
    cursor: none !important;
}

html.no-cursor *:hover
{
    cursor: none !important;
}

.embed-wrapper 
{
    position: relative;
    float: none;
    clear: both;
    width: 100%;
    height: 0;
    padding-bottom: 56%;
}

.embed-wrapper iframe 
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
  
canvas 
{
    position: fixed;
    z-index: -1;
}

.mobile br 
{
    display: none;
}



/** 3. Forms
*****************************************************************/

form
{
    position: relative;
}

input,
textarea
{
    display: block;
    width: 100%;
    background: none;
    border: none;
    border-bottom: 0.1rem solid #fff;
    font-size: 3.4rem;
    letter-spacing: -0.005em;
    line-height: 1.4em;
    font-weight: 300;
    border-radius: 0;
    padding: 0;
    color: #fff;
    font-family: 'Source Sans Pro', sans-serif;
}

input
{
    padding-bottom: 2rem;
}

textarea
{
    height: 14rem;
}

input:focus,
textarea:focus
{

    outline: none;
}

input.error,
textarea.error
{
    border-color: #ff5252;
}

form ::-webkit-input-placeholder 
{ 
    color: #fff;
    opacity: 1;
}

form ::-moz-placeholder 
{ 
    color: #fff;
    opacity: 1;
}

form :-ms-input-placeholder 
{ 
    color: #fff;
    opacity: 1;
}

form ::-ms-input-placeholder 
{ 
    color: #fff;
    opacity: 1;
}

form ::placeholder 
{ 
    color: #fff;
    opacity: 1;
}

form .hpc
{
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
    z-index: -999;
    position: absolute;
    display: none;
}

form .button-area
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 0;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

form .success-box
{
    position: absolute;
    z-index: -100;
    background: #181818;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    opacity: 0;
    pointer-events: none;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;
}

form.success .success-box
{
    z-index: 100;
    opacity: 1;
    pointer-events: all;
}

form .success-box p
{
    color: ##40E0D0;
}

form .success-box .icon-button
{
    color: ##40E0D0;
    border-color: ##40E0D0;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus 
{
  -webkit-text-fill-color: #fff;
  -webkit-box-shadow: 0 0 0px 1000px #161616 inset;
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
}



/** 4. Loading Screen
*****************************************************************/

.loading-screen 
{

    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 200;
    left: 0;
    background: #161616;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -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;
    will-change: transform;

}

.loading-screen .inner 
{
    overflow: hidden;
}

.loading-screen .text-box 
{
    overflow: hidden;
    margin-bottom: .6rem;
}

.loading-screen .line-frame
{
    overflow: hidden;
    height: 1px;
    width: 100%;
    position: relative;
}

.loading-screen .line
{
    position: absolute; 
    width: 100%;
    height: 100%;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
    background: rgba(255,255,255,.6);
    -webkit-animation-name: loader_animation;
            animation-name: loader_animation;
    will-change: transform;
    -webkit-animation-duration: 2s;
            animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
            animation-play-state: running;
    -webkit-animation-timing-function: cubic-bezier(.4,.1,.2,1);
            animation-timing-function: cubic-bezier(.4,.1,.2,1);
}

@-webkit-keyframes loader_animation
{
    0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}
    48%{-webkit-transform:translateZ(0);transform:translateZ(0)}
    52%{-webkit-transform:translateZ(0);transform:translateZ(0)}
    to{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}
}

@keyframes loader_animation
{
    0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}
    48%{-webkit-transform:translateZ(0);transform:translateZ(0)}
    52%{-webkit-transform:translateZ(0);transform:translateZ(0)}
    to{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}
}



/** 5. UI Components
*****************************************************************/

.scroll-bar
{
    position: fixed;
    top: 0;
    z-index: 11;
    right: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
         appearance: none;
    width: 2px;
    height: 100%;
    border: none;
    background: rgba(255, 255, 255, 0.2);
}

.scroll-bar .inner
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    border-radius: 30px;
    height: 10%;
    background: #fff;
}

.scroll-progress 
{
    position: fixed;
    top: 0;
    z-index: 11;
    right: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
         appearance: none;
    width: 2px;
    height: 100%;
    border: none;
    background: rgba(255, 255, 255, 0.2);
}

.scroll-progress .inner
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    background: #fff;
}

.c_cursor_outer 
{
    width: 50px;
    height: 50px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    border-radius: 100%;
    pointer-events: none;
    overflow: hidden;
}

.c_cursor_outer .bg
{
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    border: 1px solid #e3af00;
    z-index: 1000;
    border-radius: 100%;
    pointer-events: none;
}

.c_cursor_outer .circle
{
    width: 0;
    height: 0;
    position: absolute;
    border: 1px solid #e3af00;
    z-index: 1000;
    top: 50%;
    left: 50%;
    opacity: 0;
    background:none;
    border-radius: 100%;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
    pointer-events: none;
}

.c_cursor_inner
{
    width: 6px;
    height: 6px;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    background:#e3af00;
    border-radius: 100%;
    pointer-events: none;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

    .c_cursor_inner,
    .c_cursor_outer
    {
        display: none;
    }

}

.provoke-scroll-bottom
{
    position: fixed;
    right: 6rem;
    bottom: 9rem;
    width: 1px;
    opacity: 0;
    z-index: 3;
    pointer-events: none;
    -webkit-transition: .4s ease;
    -o-transition: .4s ease;
    transition: .4s ease;
}

.provoke-scroll-bottom.is-active
{
    opacity: 1;
}

.provoke-scroll-bottom .fill
{
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 5rem;
    background: rgba(255,255,255,.2);
}

.provoke-scroll-bottom .fill .inner
{
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
}

.provoke-scroll-bottom .text 
{
    position: relative;
    margin-top: 1rem;
}

.provoke-scroll-bottom p 
{
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
    -webkit-transform-origin: center center;
        -ms-transform-origin: center center;
            transform-origin: center center;
}


/* Mobile */

.mobile .c_cursor_inner,
.mobile .c_cursor_outer
{
    display: none;
    opacity: 0;
    width: 0;
    height: 0;
}



/** 6. Menu
*******************************************************************/

.m-menu-button
{
    position: fixed;
    right: 6rem;
    top: 6rem;
    z-index: 60;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
      -webkit-user-select: none; 
         -moz-user-select: none; 
          -ms-user-select: none; 
              user-select: none; 
}

.m-menu-button:after
{
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 100%;
    width: 7rem;
    height: 7rem;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
}

.m-menu-button .burger .line
{
    height: 0.1rem !important;
    width: 2.6rem;
    display: block;
    margin-bottom: 0.7rem;
    background: #fff;
    -webkit-transition: .25s ease;
    -o-transition: .25s ease;
    transition: .25s ease;
}

.m-menu-button:hover .burger .line
{
    background: #e3af00;
}

.m-menu-button .burger .line:last-child
{
    margin-bottom: 0rem;
}

.m-menu
{
    position: fixed;
    right: 0;
    width: 24%;
    z-index: 10;
    top: 0;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background: #181818;
}

.mobile .m-menu
{
    width: 76%;
}

.m-menu .m-menu-inner
{
    position: relative;

    width: 80%;
    height: 80%;
    left: 20%;

    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;

}

.m-menu .head
{
    overflow: hidden;
}

.m-menu .m-menu-inner .main-items
{
    list-style: none;
    margin: 0;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
      -webkit-user-select: none; 
         -moz-user-select: none; 
          -ms-user-select: none; 
              user-select: none; 

}

.m-menu .m-menu-inner .main-items > li
{
    margin: 1.1rem 0;
    padding: 0;
    overflow: hidden;
}

.mobile .m-menu .m-menu-inner .main-items > li
{
    margin: 1.6rem 0;
}

.m-menu .m-menu-inner .main-items > li:first-child
{
    margin-top: 0;
}

.m-menu .m-menu-inner .main-items > li:last-child
{
    margin-bottom: 1.3rem;
}

.m-menu .m-menu-inner .main-items > li p
{
    display: inline-block;
    letter-spacing: 0;
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
}

.m-menu .m-menu-inner .main-items > li span
{
    display: inline-block;
    color: #7c7c7c;
    font-size: 2.1rem;
    border-radius: 100%;
    padding-right: 2.6rem;
    height: 4.8rem;
    position: relative;
    text-align: center;
    line-height: 5rem;
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
}

.m-menu .m-menu-inner .main-items > li a.is-active span,
.m-menu .m-menu-inner .main-items > li a:hover span
{
    color: #fff;
}

.m-menu .m-menu-inner .main-items > li a.is-active span:after
{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 100%;
    z-index: -2;
    top: 0;
}

.m-menu .m-menu-inner .main-items > li a
{
    display: block;
    color: #fff;
}

.m-menu .m-menu-inner .main-items  li:hover p,
.m-menu .m-menu-inner .main-items  a.is-active p
{
    color: #fdc60c;
}

.m-menu .m-menu-inner .social-items
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
        -webkit-user-select: none; 
            -moz-user-select: none; 
            -ms-user-select: none; 
                user-select: none; 
}

.m-menu .m-menu-inner .social-items > *
{
    margin-right: 2rem;
    margin-bottom: 0;
}

.m-menu .m-menu-inner .social-items .item
{
    overflow: hidden;
}

.m-menu .m-menu-inner .social-items a
{
    width: 3.6rem;
    height: 3.6rem;
    line-height: 3.6rem;
    text-align: center;
    font-size: 2rem;
    display: block;
    
}

.m-menu .m-menu-inner .social-items  a:hover span
{
    color: #fdc60c;
}

.menu-overlay
{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: -100;
    background: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
      -webkit-user-select: none; 
         -moz-user-select: none; 
          -ms-user-select: none; 
              user-select: none; 
}



/** 7. Ultility
*****************************************************************/

.noselect 
{
    -webkit-touch-callout: none; 
      -webkit-user-select: none; 
         -moz-user-select: none; 
          -ms-user-select: none; 
              user-select: none; 
}

.img-responsive
{
    max-width: 100%;
    height: auto;
}

.color-white
{
    color: #fff;
}

.text-center
{
    text-align: center;
}

.text-start
{
    text-align: start;
}

.text-end
{
    text-align: end;
}

.text-bold
{
    font-weight: bold;
}

.text-italic
{
    font-style: italic;
}

.text-underline
{
    text-decoration: underline;
}

.text-linetrough
{
    text-decoration: line-through;
}

.text-highlight
{
    background: rgba(0, 0, 0, 0.25);
    padding: 0 .6rem;
}

.flex-break 
{
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    height: 0;
    margin: 0 !important;
}


/** Margin **/

.m-b-0{ margin-bottom: 0rem !important }
.m-b-0-5{ margin-bottom: 0.5rem !important }
.m-b-1{ margin-bottom: 1rem !important }
.m-b-1-5{ margin-bottom: 1.5rem !important }
.m-b-2{ margin-bottom: 2rem !important }
.m-b-2-5{ margin-bottom: 2.5rem !important }
.m-b-3{ margin-bottom: 3rem !important }
.m-b-4{ margin-bottom: 4rem !important }
.m-b-5{ margin-bottom: 5rem !important }
.m-b-6{ margin-bottom: 6rem !important }
.m-b-7{ margin-bottom: 7rem !important }
.m-b-8{ margin-bottom: 8rem !important }
.m-b-9{ margin-bottom: 9rem !important }
.m-b-10{ margin-bottom: 10rem !important }

.m-t-0{ margin-top: 0rem !important }
.m-t-0-5{ margin-top: 0.5rem !important }
.m-t-1{ margin-top: 1rem !important }
.m-t-1-5{ margin-top: 1.5rem !important }
.m-t-2{ margin-top: 2rem !important }
.m-t-2-5{ margin-top: 2.5rem !important }
.m-t-3{ margin-top: 3rem !important }
.m-t-4{ margin-top: 4rem !important }
.m-t-5{ margin-top: 5rem !important }
.m-t-6{ margin-top: 6rem !important }
.m-t-7{ margin-top: 7rem !important }
.m-t-8{ margin-top: 8rem !important }
.m-t-9{ margin-top: 9rem !important }
.m-t-10{ margin-top: 10rem !important }

.m-r-0{ margin-right: 0rem !important }
.m-r-0-5{ margin-right: 0.5rem !important }
.m-r-1{ margin-right: 1rem !important }
.m-r-1-5{ margin-right: 1.5rem !important }
.m-r-2{ margin-right: 2rem !important }
.m-r-2-5{ margin-right: 2.5rem !important }
.m-r-3{ margin-right: 3rem !important }
.m-r-4{ margin-right: 4rem !important }
.m-r-5{ margin-right: 5rem !important }
.m-r-6{ margin-right: 6rem !important }
.m-r-7{ margin-right: 7rem !important }
.m-r-8{ margin-right: 8rem !important }
.m-r-9{ margin-right: 9rem !important }
.m-r-10{ margin-right: 10rem !important }

.m-l-0{ margin-left: 0rem !important }
.m-l-0-5{ margin-left: 0.5rem !important }
.m-l-1{ margin-left: 1rem !important }
.m-l-1-5{ margin-left: 1.5rem !important }
.m-l-2{ margin-left: 2rem !important }
.m-l-2-5{ margin-left: 2.5rem !important }
.m-l-3{ margin-left: 3rem !important }
.m-l-4{ margin-left: 4rem !important }
.m-l-5{ margin-left: 5rem !important }
.m-l-6{ margin-left: 6rem !important }
.m-l-7{ margin-left: 7rem !important }
.m-l-8{ margin-left: 8rem !important }
.m-l-9{ margin-left: 9rem !important }
.m-l-10{ margin-left: 10rem !important }



/** 8. Skeleton Components
*****************************************************************/

#main
{
    position: fixed;
    width: 100vw;
    top: 0;
    left: 0;
    height: 100vh;
    overflow: hidden;
} 

.right-content
{
    position: fixed;
    width: 100%;
    overflow: auto;
    height: 100%;
}

.right-content .inner-content
{
    position: relative;
    width: 50%;
    left: 50%;
}

_:-ms-fullscreen, :root .right-content .inner-content
{ 
    position: fixed;
}

.left-content
{
    position: fixed;
    height: 100%;
    width: 50%;
    top: 0%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    z-index: 2;
    -webkit-perspective: 38rem;
    perspective: 38rem;
}

.left-content .inner-content
{
    position: relative;
    width: 26vw;
    height: 32vw;
    -webkit-transform: rotateY(5deg);
            transform: rotateY(5deg);
}

.left-content .inner-content .picture-box
{
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    overflow: hidden;
    top: 0;
}

.left-content .inner-content .picture
{
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0px;
}

.left-content .inner-content canvas
{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 1px;
    z-index: 3;
    
    left: 0;
}

.left-content .inner-content .frame
{
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    z-index: -2;
    border: 1px solid #fff;
}

.left-content .inner-content .frame.frame-1
{
    opacity: 0.25;
    -webkit-transform: translate(-2rem,2rem);
        -ms-transform: translate(-2rem,2rem);
            transform: translate(-2rem,2rem);
}

.left-content .inner-content .frame.frame-2
{
    opacity: 0.15;
    -webkit-transform: translate(-4rem,4rem);
        -ms-transform: translate(-4rem,4rem);
            transform: translate(-4rem,4rem);
}

.left-content .inner-content .frame.frame-3
{
    opacity: 0.05;
    -webkit-transform: translate(-6rem,6rem);
        -ms-transform: translate(-6rem,6rem);
            transform: translate(-6rem,6rem);
}

.left-content .inner-content .name
{
    position: absolute;
    left: 4rem;
    bottom: 3rem;
    z-index: 10;
}

.left-content .inner-content .name p
{
    letter-spacing: 0.02em;
    font-weight: 300;
}

.left-content .inner-content .name .seperator-line
{
    margin-top: 0.6rem;
}

.section-container
{
    max-width: 70rem;
}

.section-container .section
{
    position: relative;
    width: 100%;
}

.section-container .section.height-100
{
    min-height: 100vh;
}

.section-container .section.y-center
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

_:-ms-fullscreen, :root .section-container .section.y-center .container 
{ 
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
}

.section-container .section .container
{
    display: block;
    width: 100%;
}


/* Mobile Mode */

.mobile .left-content
{
    width: 100%;
}

.mobile .left-content .inner-content
{
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-transform: rotateY(0deg);
            transform: rotateY(0deg);
}

.mobile .left-content .inner-content .frame
{
    display: none !important;
}

.mobile .right-content .inner-content
{
    padding-top: 100vh;
    position: relative;
    width: 80%;
    left: 10%;
}

.mobile .left-content .inner-content:after
{
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    z-index: -15;
    background: rgba(0, 0, 0, 1);
    width: 100%;
    height: 100%;
}

.mobile .left-content .inner-content .name
{
    left: 50%;
    bottom: 50%;
    -webkit-transform: translate(-50%,50%);
        -ms-transform: translate(-50%,50%);
            transform: translate(-50%,50%);
}

.mobile .left-content .inner-content .name p
{
    font-size: 4rem;
}

.mobile .left-content .inner-content .picture-box
{
    opacity: 0.7;
}

.mobile .section-container 
{
    max-width: 60rem;
    margin: 0 auto;
}



/** 9. Background Components
*******************************************************************/

.bg-bubbles 
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .4;
    z-index: -1;
}

.bg-bubbles.white
{
    opacity: .1;
}

.bg-bubbles li 
{
    position: absolute;
    list-style: none;
    display: block;
    width: 40px;
    height: 40px;
    background-color: rgba(0, 0, 0, 0.15);
    bottom: -160px;
    -webkit-animation: square 25s infinite;
    animation: square 25s infinite;
    -webkit-transition-timing-function: linear;
         -o-transition-timing-function: linear;
            transition-timing-function: linear;
}

.bg-bubbles.white li 
{
    background-color: rgba(255, 255, 255, 0.15);
}

.bg-bubbles li:nth-child(1) 
{
    left: 10%;
}

.bg-bubbles li:nth-child(2) 
{
    left: 20%;
    width: 80px;
    height: 80px;
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
    -webkit-animation-duration: 17s;
    animation-duration: 17s;
}

.bg-bubbles li:nth-child(3) 
{
    left: 25%;
    -webkit-animation-delay: 4s;
    animation-delay: 4s;
}

.bg-bubbles li:nth-child(4) 
{
    left: 40%;
    width: 60px;
    height: 60px;
    -webkit-animation-duration: 22s;
    animation-duration: 22s;
    background-color: rgba(0, 0, 0, 0.25);
}

.bg-bubbles.white li:nth-child(4) 
{
    background-color: rgba(255, 255, 255, 0.25);
}

.bg-bubbles li:nth-child(5) 
{
    left: 70%;
}

.bg-bubbles li:nth-child(6) 
{
    left: 80%;
    width: 120px;
    height: 120px;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
    background-color: rgba(0, 0, 0, 0.2);
}

.bg-bubbles.white li:nth-child(6) 
{
    background-color: rgba(255, 255, 255, 0.2);
}

.bg-bubbles li:nth-child(7) 
{
    left: 32%;
    width: 160px;
    height: 160px;
    -webkit-animation-delay: 7s;
    animation-delay: 7s;
}

.bg-bubbles li:nth-child(8) 
{
    left: 55%;
    width: 20px;
    height: 20px;
    -webkit-animation-delay: 15s;
    animation-delay: 15s;
    -webkit-animation-duration: 40s;
    animation-duration: 40s;
}

.bg-bubbles li:nth-child(9) 
{
    left: 25%;
    width: 10px;
    height: 10px;
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
    -webkit-animation-duration: 40s;
    animation-duration: 40s;
    background-color: rgba(0, 0, 0, 0.3);
}

.bg-bubbles.white li:nth-child(9) 
{
    background-color: rgba(255, 255, 255, 0.3);
}

.bg-bubbles li:nth-child(10) 
{
    left: 90%;
    width: 160px;
    height: 160px;
    -webkit-animation-delay: 11s;
    animation-delay: 11s;
}

@-webkit-keyframes square 
{
    0% {-webkit-transform: translateY(0);transform: translateY(0);}
    100% {-webkit-transform: translateY(-700px) rotate(600deg);transform: translateY(-700px) rotate(600deg);}
}

@keyframes square 
{
    0% {-webkit-transform: translateY(0);transform: translateY(0);}
    100% {-webkit-transform: translateY(-700px) rotate(600deg);transform: translateY(-700px) rotate(600deg);}
}

.bg-color
{
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    z-index: -6;
    
    left: 0;
}

#main > canvas
{
    z-index: -5;
    top: 0;
    left: 0;
}



/** 10. Plugins
*******************************************************************/

/* Slider */

.slick-slider
{
    position: relative;

    display: block;
    -webkit-box-sizing: border-box;
            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;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}

.slick-list.dragging
{
    cursor: pointer;
    cursor: -webkit-grabbing;
    cursor: grabbing;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

.slick-slider .item:focus 
{
    outline: none !important;

}

.slick-dots
{
    position: absolute;
    bottom: -8rem;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

 
    text-align: center;
}

.slick-dots li
{
    width: 16px;
    height: 16px;
    border-radius: 100%;
    display: inline-block;
    margin: 0 6px;
    position: relative;
    cursor: pointer;
}

.slick-dots li:after
{
    cursor: pointer;
    content: "";
    position: absolute;
    width: 4px;
    height: 4px;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
    border-radius: 100%;
    background: rgba(255,255,255,.5);
    -webkit-transition: .15s ease;
    -o-transition: .15s ease;
    transition: .15s ease;
    opacity: 1;
}

.slick-dots li.slick-active,
.slick-dots li:hover
{
    border: 1px solid rgb(255 255 255 / 60%);
}

.slick-dots li.slick-active:after,
.slick-dots li:hover:after
{
    background: rgba(255,255,255,0);
}

.slick-dots li button
{
    display: none;
}


/* Panel */

.open-options-panel
{
    position: fixed;
    left: 0;
    top: 10rem;
    cursor: pointer;
    z-index: 10;
    background: #272727;
    width: 5rem;
    line-height: 5rem;
    text-align: center;
    height: 5rem;
    color: #fff;
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
}

.open-options-panel:hover
{
    width: 6.5rem;
}

.open-options-panel span
{
    font-size: 1.7rem;
    opacity: .7;
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
    color: #fff;
    line-height: inherit;
}

.options-panel
{
    position: fixed;
    left: 0;
    top: 0;
    opacity: 0;
    
    z-index: -10000;
    width: 100%;
    height: 100%;
}

.options-panel .close-button
{
    cursor: pointer;
    position: absolute;
    left: 6rem;
    top: 6rem;
    
    z-index: 11111;
    font-size: 2.1rem;
    color: #fff;
    opacity: 0.7;
}

.options-panel .close-button:after
{
    content: "";
    cursor: pointer;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 10rem;
    border-radius: 100%;
    z-index: -2;
    height: 10rem;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
}

.options-panel .panel
{
    position: absolute;
    max-width: 61.8%;
    top: 0;
    right: 0;
    opacity: 0;
    overflow: auto;
    height: 100%;
    padding: 12rem 16rem;
    z-index: 10;
    background: #272727;
}

.options-panel .panel-overlay
{
    position: absolute;
    background: #212121;
    opacity: 0.96;
    width: 100%;
    height: 100%;
    left: 0;
    cursor: pointer;
    top: 0;
    z-index: 5;
}

.options-panel .headline p
{
    color: #fff;
    display: inline-block;
}

.options-panel .options
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin-top: 2.5rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    gap: 1rem;
}

.options-panel .options .option
{
    cursor: pointer;
}

.options-panel .options .color
{
    border-radius: 100%;
    height: 5rem;
    overflow: hidden;
    position: relative;
    -webkit-transition: .15s;
    -o-transition: .15s;
    transition: .15s;
    border: 1px solid rgba(255,255,255,.0);
    width: 5rem;
}

.options-panel .options .color.active
{
    border-color: #fff;
}

.options-panel .options .color .bg
{
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
    width: 3.2rem;
    border-radius: 100%;
    height: 3.2rem;
}

.options-panel .button
{
    border: 1px solid rgba(255, 255, 255, 0);
    height: 5rem;
    border-radius: 10rem;
    line-height: 5rem;
    padding: 0 2.6rem;
}

.options-panel .button.active
{
    border-color: #fff;
    height: 5rem;
    border-radius: 10rem;
    line-height: 5rem;
    padding: 0 2.6rem;
}

.options-panel .button p
{
    color: #fff;
    line-height: inherit;
}


/* Lightbox */

.goverlay 
{
    background: rgba(22, 22, 22, 0.95) !important;
}

.gslide-media
{
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
}

.gslide-image img
{
    max-height: 86vh;
}

.glightbox-container
{
    z-index: 500 !important;
}

.glightbox-container .gprev,
.glightbox-container .gclose,
.glightbox-container .gnext 
{
    z-index: 40 !important;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
      -webkit-user-select: none; 
         -moz-user-select: none; 
          -ms-user-select: none; 
              user-select: none; 
}

.glightbox-container .gnext 
{
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
    position: fixed;
    padding: 0 !important;
    top: 50%;
    right: 6rem;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    width: unset !important;
    height: unset !important;
    background-color: rgba(0,0,0,0) !important;
    opacity: 1 !important;
    display: block;
}

.glightbox-container .gprev 
{
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
    position: fixed;
    padding: 0 !important;
    top: 50%;
    left: 6rem;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    width: unset !important;
    height: unset !important;
    background-color: rgba(0,0,0,0) !important;
    opacity: 1 !important;
    display: block;
}

.glightbox-container .gclose 
{
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    padding: 0 !important;
    transition: .2s ease;
    opacity: 1 !important;
    width: unset !important;
    height: unset !important;
    top: 6rem !important;
    left: 6rem !important;
    right: unset !important;
    position: fixed;
    display: block;
    background-color: rgba(0,0,0,0) !important;
}

.glightbox-container .gbtn span
{
    vertical-align: middle;
    display: inline-block;
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
    font-size: 2.1rem;
}

.glightbox-container .gbtn:focus-visible
{
    outline: none !important;
}

.glightbox-container .gbtn:hover span
{
    color: #fdc60c;
}

.glightbox-container .gbtn span:after
{
    position: absolute;
    content: "";
    width: 10rem;
    height: 10rem;
    border-radius: 100%;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
}

.glightbox-closing .gclose,
.glightbox-closing .gnext,
.glightbox-closing .gprev,
.glightbox-closing .info-button,
.glightbox-container .gnext.disabled,
.glightbox-container .gprev.disabled
{
    opacity: 0 !important;
}

.glightbox-container .info-button
{
    position: fixed;
    top: 5rem;
    cursor: pointer;
    z-index: 100;
    right: 5rem;
}

.glightbox-container .info
{
    position: fixed;
    left: 0;
    top: 0;
    z-index: 90;
    bottom: 0;
    width: 61.8%;
    background: #212121;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateX(-100%);
}


.glightbox-container .info-overlay
{
    position: fixed;
    left: 100%;
    width: 100%;
    height: 100%;
    cursor: pointer;
    top: 0;
    z-index: 80;
    opacity: 0;
    background: rgba(24, 24, 24, 0.4);
}

.glightbox-container .info .info-container
{
    max-width: 76rem;
    padding: 0 6rem;
    opacity: 0;
    transition: .3s ease-in-out;
}

@media (max-width: 810px) {

    .glightbox-container .info
    {
        width: 100%;
    }
   
}

/******************************************************************
	
	
	@ Item          REFRAME - Personal One Page HTML Template
	@ Version       1.1
	@ Author		Avanzare
	@ Website		http://themeforest.net/user/avanzare 
	

 ******************************************************************


	-----------------------------
	----- TABLE OF CONTENTS -----
	-----------------------------
	
	--  1. Icon Button
	--  2. Accordion / Pricing Accordion
	--  3. Seperator Line
	--  4. Customer Grid
    --  5. Skill Bar
    --  6. Number Item
    --  7. Resume
    --  8. Pricing Item
    --  9. Testimonial Carousel
    --  10. Work Grid
    --  11. Skill Tags
	--  12. Pills
	--  13. Quote
	--  14. Image Carousel
    --  15. Card
    --  16. Card Grid
    --  17. Tabs
    --  18. Audio Player
    --  19. Video Player
    --  20. Icon Wrapper
 
 
 ******************************************************************/



/** 1. Icon Button
*******************************************************************/

.icon-button
{
    border: 0.1rem solid #fff;
    font-size: 1.6rem;
    color: #fff;
    line-height: 6rem;
    position: relative;
    cursor: pointer;
    text-align: center;
    line-height: calc(5.6rem + 2px);
    border-radius: 100%;
    display: inline-block;
    width: 5.6rem;
    overflow: hidden;
    height: 5.6rem;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
    -webkit-user-select: none; 
        -moz-user-select: none; 
        -ms-user-select: none; 
            user-select: none; 
}

.icon-button.icon-button-filled
{
    border: 0;
    height: 6rem;
    width: 6rem;
    line-height: 6rem;
    background: #181818;
}

.icon-button span
{
    color: inherit;
    font-size: inherit;
    position: absolute;
    width: inherit;
    height: inherit;
    line-height: inherit;
    position: absolute;
    left: 0;
    top: 0;
}



/** 2. Accordion / Pricing Accordion
*******************************************************************/

.accordion 
{
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    margin-top: 10px;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
}

.accordion .acc_section 
{
    position: relative;
    z-index: 10;
    overflow: hidden;
    padding-bottom: 2rem;
}

.accordion .acc_section .acc_head 
{
    position: relative;
    padding: 2.2rem 5rem 2.2rem 0;
    display: block;
    cursor: pointer;
    border-bottom: 0.1rem solid #fff;
}

.accordion.pricing-accordion .acc_section .acc_head 
{
    border-bottom: 0;
    padding: 0;
}

.accordion .acc_section .acc_head .icon
{
    position: absolute;
    right: 2rem;
    top: 50%;
    width: 1.4rem;
    height: 1.4rem;
    -webkit-transform: translateY(-50%) rotate(-45deg);
        -ms-transform: translateY(-50%) rotate(-45deg);
            transform: translateY(-50%) rotate(-45deg);
    border-left: 0.1rem solid #fff;
    border-bottom: 0.1rem solid #fff;
    -webkit-transition: .1s ease;
    -o-transition: .1s ease;
    transition: .1s ease;
}

.accordion.pricing-accordion .acc_section .acc_head .icon
{
    right: 0;
}

.accordion .acc_section.acc_active .acc_head .icon
{
    -webkit-transform: translateY(-50%) rotate(-225deg);
        -ms-transform: translateY(-50%) rotate(-225deg);
            transform: translateY(-50%) rotate(-225deg);
}

.accordion .acc_section .acc_content 
{
    padding: 3rem 0rem 1rem 0rem;
}

.accordion.pricing-accordion .acc_section .acc_content 
{
    padding: 0;
}

.accordion .acc_section.acc_active > .acc_content 
{
    display: block;
}



/** 3. Seperator Line
*******************************************************************/

.seperator-line
{
    width: 4rem;
    height: 0.1rem;
    background: #fff;
}



/** 4. Customer Grid
*******************************************************************/

.customer-grid
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}

.customer-grid .item
{
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.333333%;
            flex: 0 0 33.333333%;
    opacity: .8;
}

.customer-grid .item img
{
    max-width: 65%;
}



/** 5. Skill Bar
*******************************************************************/

.skill-bar .head
{
    padding: 2rem 0;
}

.skill-bar .bar
{
    background: rgba(255, 255, 255, 0.2);
    height: 0.1rem;
    width: 100%;
    display: block;
    position: relative;
}

.skill-bar .bar .fill
{
    position: absolute;
    background: #fff;
    height: 100%;
    top: 0;
    left: 0;
}

.skill-bar .bar .number-tag
{
    position: absolute;
    background: #181818;
    color: #fff;
    padding: 0.3rem 1.2rem;
    top: 0;
    -webkit-transform: translateX(-50%) translateY(-136%);
        -ms-transform: translateX(-50%) translateY(-136%);
            transform: translateX(-50%) translateY(-136%);
}

.skill-bar .bar .number-tag:after
{
    content: "";
    position: absolute;
    background: #181818;
    color: #fff;
    width: 0.9rem;
    height: 0.9rem;
    bottom: -0.45rem;
    z-index: -2;
    left: 50%;
    -webkit-transform: translateX(-50%) rotate(45deg);
        -ms-transform: translateX(-50%) rotate(45deg);
            transform: translateX(-50%) rotate(45deg);
}

.skill-bar .bar .number-tag p
{
    color: #fff;
    font-weight: 300;
}



/** 6. Number Item
*******************************************************************/

.number-item
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

.number-item .text
{
    width: 75%;
}

.number-item .info
{
    width: 25%;
}



/** 7. Resume
*******************************************************************/

.resume
{
    border-left: 0.1rem solid rgba(255, 255, 255, 0.2);
}

.resume .item
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-left: 5rem;
    position: relative;
    padding: 7rem 9rem;
    background: #181818;
}

.resume .item:after
{
    content: "";
    position: absolute;
    left: -5rem;
    top: 20%;
    z-index: 11;
    -webkit-transform: translate(-100%,-50%);
        -ms-transform: translate(-100%,-50%);
            transform: translate(-100%,-50%);
    width: 1px;
    height: 40px;
    background: #fff;
}

.resume .item:before
{
    content: "";
    position: absolute;
    left: 0;
    top: 20%;
    z-index: 11;
    -webkit-transform: translate(-50%,-50%) rotate(45deg);
        -ms-transform: translate(-50%,-50%) rotate(45deg);
            transform: translate(-50%,-50%) rotate(45deg);
    -webkit-transform-origin: center center;
        -ms-transform-origin: center center;
            transform-origin: center center;
    width: 3.6rem;
    height: 3.6rem;
    background: inherit;
}



/** 8. Pricing Item
*******************************************************************/

.pricing-item
{
    padding: 5rem 7rem !important;
}

.pricing-item .price
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-line-pack: center;
        align-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.pricing-item .features
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}

.pricing-item .features .feature-item
{
    display: inline-block;
    vertical-align: middle;
    margin-top: 2rem;
    margin-right: 2.6rem;
}

.pricing-item .features .feature-item span
{
    display: inline-block;
    vertical-align: middle;
    color: #7c7c7c;
    font-size: 2rem;
    margin-right: 1rem;
}

.pricing-item .features .feature-item p
{
    display: inline-block;
    vertical-align: middle;
}



/** 9. Testimonial Carousel
*******************************************************************/

.testimonial-carousel .slick-list 
{
    padding: 0 !important;
}

.testimonial-carousel .item .name,
.testimonial-carousel .item .role
{
    line-height: 1.2em;
}

.testimonial-carousel .arrow-prev
{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
    -webkit-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;
}

.testimonial-carousel .arrow-next
{
    position: absolute;
    top: 0;
    right: 0;
    z-index: 4;
    -webkit-transform: translate(50%,50%);
        -ms-transform: translate(50%,50%);
            transform: translate(50%,50%);
    -webkit-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;
}

.testimonial-carousel .slick-arrow.slick-disabled
{
    opacity: 0;
}



/** 10. Work Grid
*******************************************************************/

.work-grid .item
{
    position: relative;
    padding-bottom: 46%;
    display: block;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
}

.work-grid .item:after 
{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: -o-linear-gradient(bottom, rgba(0,0,0,0.5), 40%, rgba(0,0,0,0));
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(0,0,0,0.5)), color-stop(40%), to(rgba(0,0,0,0)));
    background: linear-gradient(to top, rgba(0,0,0,0.5), 40%, rgba(0,0,0,0));
    z-index: -1;
}

.work-grid .item .cover
{
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    background-position: center;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
}

.work-grid .item .info
{
    position: absolute;
    left: 5rem;
    bottom: 4rem;
    z-index: 2;
    overflow: hidden;
}

.work-grid .item .icon-button
{
    position: absolute;
    right: 5rem;
    bottom: 3rem;
    z-index: 2;
    opacity: 0;
    -webkit-transition: .25s;
    -o-transition: .25s;
    transition: .25s;
}

.work-grid .item:hover .icon-button
{
    opacity: 1;
    -webkit-transition: .3s ease-out .1s;
    -o-transition: .3s ease-out .1s;
    transition: .3s ease-out .1s;
}

.work-grid .item .lightbox-content
{
    display: none;
}



/** 11. Skill Tags
*******************************************************************/

.skill-tags
{
    margin: 0;
    padding: 0;
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}

.skill-tags li
{
    padding: 1.4rem 2.3rem;
    margin: 1.2rem;
    font-weight: 300;
    border-radius: 100px;
    background: #181818;
    
    font-size: 2.1rem;
    line-height: 1.48em;
    letter-spacing: 0;
    font-weight: 400;
}



/** 12. Pills
*******************************************************************/

.pills
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 2.5rem;
}

.pill
{
    border: 0.1rem solid rgba(255, 255, 255, 0.2);
    padding: 0 3rem;
    height: 7.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    border-radius: 200px;
}

.pill.pill-filled
{
    border: none;
    background: #181818;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

    .pill
    {
        margin-right: 2.5rem;
        margin-bottom: 2.5rem;
    }

}



/** 13. Quote
*******************************************************************/

.quote
{
    position: relative;
    padding: 6rem 8rem;
    background: #181818;
}



/** 14. Image Carousel
*******************************************************************/

.image-carousel
{
    height: 30vh;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
}

.image-carousel .slick-list 
{
    padding: 0 !important;
    height: inherit;
}

.image-carousel .slick-track
{
    height: inherit;
}

.image-carousel .item
{
    height: inherit;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.image-carousel .arrow-prev
{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
}

.image-carousel .arrow-next
{
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 4;
    -webkit-transform: translate(50%,50%);
        -ms-transform: translate(50%,50%);
            transform: translate(50%,50%);
}

.image-carousel .slick-arrow.slick-disabled
{
    opacity: 0;
}



/** 15. Card
*******************************************************************/

.card
{
    width: 100%;
    display: inline-block;
    position: relative;
    background: #181818;
}

.card .inner
{
    display: block;
    position: relative;
    padding: 8rem;
}



/** 16. Card Grid
*******************************************************************/

.card-grid
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
}

.card-grid .left-side,
.card-grid .right-side
{
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
}

.card-grid .item
{
    padding-bottom: 100%;
    background: #111;
    position: relative;
}

.card-grid .item .item-container
{
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
}



/** 17. Tabs
*******************************************************************/

.tabs ul
{
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
    list-style: none;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin: 0;
    gap: 4rem;
    border-bottom: 0.1rem solid rgba(255, 255, 255, 0.2);
}

.tabs ul li
{
    padding: 0 0 2.2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-transition: .15s;
    -o-transition: .15s;
    transition: .15s;
    border-bottom: 0.1rem solid rgba(255, 255, 255, 0);
}

.tabs ul li.active,
.tabs ul li:hover
{
    border-bottom: 0.1rem solid #fff;
}

.tabs ul li p
{
    -webkit-transition: .15s;
    -o-transition: .15s;
    transition: .15s;
}

.tabs ul li.active p,
.tabs ul li:hover p
{
    color: #fff;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

    .tabs ul li
    {
        margin-right: 4rem;
    }

}



/** 18. Audio Player
*******************************************************************/

.audio-player
{
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
    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;
}

.audio-player audio
{
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    pointer-events: none;
}

.audio-player .toggle-btn
{
    font-size: 1.6rem;
    color: #fff;
}

.audio-player .progress-bar
{
    height: 0.1rem;
    width: calc(100% - 7.6rem);
    position: relative;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.2);
}

.audio-player .progress-bar:after
{
    height: 5rem;
    content: "";
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
}

.audio-player .progress-bar .fill
{
    width: 0%;
    will-change: width;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(255, 255, 255, 1);
}



/** 19. Video Player
*******************************************************************/

.video-player
{
    position: relative;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; 
}

.video-player .toggle-btn
{
    position: absolute;
    left: 50%;
    cursor: pointer;
    top: 50%;
    z-index: 10;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);

    font-size: 2.1rem;
    color: #fff;
    will-change: opacity;
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
}

.video-player.hide-ui .toggle-btn
{
    opacity: 0;
    pointer-events: none;
}

.video-player .fullscreen-btn
{
    position: absolute;
    right: 2rem;
    top: 2rem;
    z-index: 10;
    cursor: pointer;

    font-size: 1.8rem;
    color: #fff;
    will-change: opacity;
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
}

.video-player.hide-ui .fullscreen-btn
{
    opacity: 0;
    pointer-events: none;
}

.video-player .progress-bar
{

    height: 0.1rem;
    width: 100%;
    position: absolute;
    cursor: pointer;
    left: 0;
    z-index: 10;
    bottom: 0;
    background: rgba(255, 255, 255, 0.2);
    will-change: opacity;
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
}

.video-player.hide-ui .progress-bar
{
    opacity: 0;
    pointer-events: none;
}

.video-player .progress-bar:after
{
    height: 5rem;
    content: "";
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
}

.video-player .progress-bar .fill
{
    width: 0%;
    will-change: width;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: rgba(255, 255, 255, 1);
}



/** 3. ICON WRAPPER
*******************************************************************/

.icon-wrapper
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    gap: 5rem;
}

.icon-wrapper .icongrid
{
    font-size: 3.5rem;
    color: #7c7c7c;
}

.icon-wrapper .icongrid span
{
    font-size: 4.5rem;
    margin-right: 1.2rem;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

    .icon-wrapper .icongrid
    {
        margin-right: 5rem;
        margin-bottom: 5rem;
    }

}