.select2-container { -webkit-box-sizing: border-box; box-sizing: border-box; display: inline-block; margin: 0; position: relative; vertical-align: middle; } .select2-container .select2-selection--single { -webkit-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: block; height: 28px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--single .select2-selection__rendered { display: block; padding-left: 8px; padding-right: 20px; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-selection--single .select2-selection__clear { position: relative; } .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered { padding-right: 8px; padding-left: 20px; } .select2-container .select2-selection--multiple { -webkit-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: block; min-height: 32px; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; } .select2-container .select2-selection--multiple .select2-selection__rendered { display: inline-block; overflow: hidden; padding-left: 8px; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; } .select2-container .select2-search--inline { float: left; } .select2-container .select2-search--inline .select2-search__field { -webkit-box-sizing: border-box; box-sizing: border-box; border: none; font-size: 100%; margin-top: 5px; padding: 0; } .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-dropdown { background-color: var(--white-color); border-radius: 30px; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; position: absolute; left: -100000px; width: 100%; z-index: 1051; -webkit-box-shadow: 20px 0 80px 5px rgba(0, 0, 0, 0.4); box-shadow: 20px 0 80px 5px rgba(0, 0, 0, 0.4); padding: 20px; top: 10px; } .select2-results { display: block; } .select2-results__options { list-style: none; margin: 0; padding: 0; } .select2-results__option { padding: 18px 20px; border-radius: 3px; font-size: 14px; line-height: 1; font-weight: 700; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-select: none; position: relative; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .select2-results__option:after { top: 50%; margin-top: -7px; right: 28px; border-bottom: 3px solid #fff; border-right: 3px solid #fff; content: ''; display: block; height: 12px; pointer-events: none; position: absolute; -webkit-transform-origin: 66% 66%; -ms-transform-origin: 66% 66%; transform-origin: 66% 66%; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; width: 8px; opacity: 0; } .select2-results__option[aria-selected] { cursor: pointer; } .select2-container--open .select2-dropdown { left: 0; } .select2-container--open .select2-dropdown--above { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-search--dropdown { display: block; padding: 4px; } .select2-search--dropdown .select2-search__field { padding: 4px; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button { -webkit-appearance: none; } .select2-search--dropdown.select2-search--hide { display: none; } .select2-close-mask { border: 0; margin: 0; padding: 0; display: block; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 99; background-color: #fff; filter: alpha(opacity=0); } .select2-hidden-accessible { border: 0 !important; clip: rect(0 0 0 0) !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; padding: 0 !important; position: absolute !important; width: 1px !important; } .select2-container--default .select2-selection--single { background-color: #fff; border: 1px solid #aaa; border-radius: 4px; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--link-color); line-height: 18px; } .select2-container--default .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; } .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 10px; margin-top: -6px; pointer-events: none; position: absolute; right: 55px; top: 50%; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow { left: 1px; right: auto; } .select2-container--default.select2-container--disabled .select2-selection--single { background-color: #f8fafc; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear { display: none; } .select2-container--default .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { -webkit-box-sizing: border-box; box-sizing: border-box; list-style: none; margin: 0; padding: 0 5px; width: 100%; } .select2-container--default .select2-selection--multiple .select2-selection__rendered li { list-style: none; } .select2-container--default .select2-selection--multiple .select2-selection__placeholder { color: #999; margin-top: 5px; float: left; } .select2-container--default .select2-selection--multiple .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-top: 5px; margin-right: 10px; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #999; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { color: #333; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline { float: right; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--default.select2-container--focus .select2-selection--multiple { border: solid black 1px; outline: 0; } .select2-container--default.select2-container--disabled .select2-selection--multiple { background-color: #eee; cursor: default; } .select2-container--default.select2-container--disabled .select2-selection__choice__remove { display: none; } .select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple { border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; } .select2-container--default .select2-search--inline .select2-search__field { background: transparent; border: none; outline: 0; -webkit-box-shadow: none; box-shadow: none; -webkit-appearance: textfield; } .select2-container--default .select2-results > .select2-results__options { max-height: 250px; overflow-y: auto; } .select2-container--default .select2-results__option[role=group] { padding: 0; } .select2-container--default .select2-results__option[aria-disabled=true] { color: #999; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: #f8fafc; } .select2-container--default .select2-results__option[aria-selected=true]:after { opacity: 1; } .select2-container--default .select2-results__option .select2-results__option { padding-left: 1em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__group { padding-left: 0; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option { margin-left: -1em; padding-left: 2em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -2em; padding-left: 3em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -3em; padding-left: 4em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -4em; padding-left: 5em; } .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option { margin-left: -5em; padding-left: 6em; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #f8fafc; color: var(--primary-accent-color); } .select2-container--default .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic .select2-selection--single { background-color: #f7f7f7; border: 1px solid #aaa; border-radius: 4px; outline: 0; background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, white), to(#eeeeee)); background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic .select2-selection--single:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--single .select2-selection__rendered { color: #444; line-height: 18px; } .select2-container--classic .select2-selection--single .select2-selection__clear { cursor: pointer; float: right; font-weight: bold; margin-right: 10px; } .select2-container--classic .select2-selection--single .select2-selection__placeholder { color: #999; } .select2-container--classic .select2-selection--single .select2-selection__arrow { background-color: #ddd; border: none; border-left: 1px solid #aaa; border-top-right-radius: 4px; border-bottom-right-radius: 4px; height: 26px; position: absolute; top: 1px; right: 1px; width: 20px; background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #eeeeee), to(#cccccc)); background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0); } .select2-container--classic .select2-selection--single .select2-selection__arrow b { border-color: #888 transparent transparent transparent; border-style: solid; border-width: 5px 4px 0 4px; height: 0; left: 50%; margin-left: -4px; margin-top: -2px; position: absolute; top: 50%; width: 0; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear { float: left; } .select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow { border: none; border-right: 1px solid #aaa; border-radius: 0; border-top-left-radius: 4px; border-bottom-left-radius: 4px; left: 1px; right: auto; } .select2-container--classic.select2-container--open .select2-selection--single { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow { background: transparent; border: none; } .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b { border-color: transparent transparent #888 transparent; border-width: 0 4px 5px 4px; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--single { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%); background-image: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(50%, #eeeeee)); background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0); } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--single { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #eeeeee), to(white)); background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0); } .select2-container--classic .select2-selection--multiple { background-color: white; border: 1px solid #aaa; border-radius: 4px; cursor: text; outline: 0; } .select2-container--classic .select2-selection--multiple:focus { border: 1px solid #5897fb; } .select2-container--classic .select2-selection--multiple .select2-selection__rendered { list-style: none; margin: 0; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__clear { display: none; } .select2-container--classic .select2-selection--multiple .select2-selection__choice { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove { color: #888; cursor: pointer; display: inline-block; font-weight: bold; margin-right: 2px; } .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover { color: #555; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { float: right; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice { margin-left: 5px; margin-right: auto; } .select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove { margin-left: 2px; margin-right: auto; } .select2-container--classic.select2-container--open .select2-selection--multiple { border: 1px solid #5897fb; } .select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple { border-top: none; border-top-left-radius: 0; border-top-right-radius: 0; } .select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple { border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .select2-container--classic .select2-search--dropdown .select2-search__field { border: 1px solid #aaa; outline: 0; } .select2-container--classic .select2-search--inline .select2-search__field { outline: 0; -webkit-box-shadow: none; box-shadow: none; } .select2-container--classic .select2-dropdown { background-color: white; border: 1px solid transparent; } .select2-container--classic .select2-dropdown--above { border-bottom: none; } .select2-container--classic .select2-dropdown--below { border-top: none; } .select2-container--classic .select2-results > .select2-results__options { max-height: 200px; overflow-y: auto; } .select2-container--classic .select2-results__option[role=group] { padding: 0; } .select2-container--classic .select2-results__option[aria-disabled=true] { color: grey; } .select2-container--classic .select2-results__option--highlighted[aria-selected] { background-color: #3875d7; color: white; } .select2-container--classic .select2-results__group { cursor: default; display: block; padding: 6px; } .select2-container--classic.select2-container--open .select2-dropdown { border-color: #5897fb; } /* required styles */ .leaflet-pane, .leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-tile-container, .leaflet-pane > svg, .leaflet-pane > canvas, .leaflet-zoom-box, .leaflet-image-layer, .leaflet-layer { position: absolute; left: 0; top: 0; } .leaflet-container { overflow: hidden; } .leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-drag: none; } /* Safari renders non-retina tile on retina better with this, but Chrome is worse */ .leaflet-safari .leaflet-tile { image-rendering: -webkit-optimize-contrast; } /* hack that prevents hw layers "stretching" when loading new tiles */ .leaflet-safari .leaflet-tile-container { width: 1600px; height: 1600px; -webkit-transform-origin: 0 0; } .leaflet-marker-icon, .leaflet-marker-shadow { display: block; } /* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */ /* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */ .leaflet-container .leaflet-overlay-pane svg, .leaflet-container .leaflet-marker-pane img, .leaflet-container .leaflet-shadow-pane img, .leaflet-container .leaflet-tile-pane img, .leaflet-container img.leaflet-image-layer, .leaflet-container .leaflet-tile { max-width: none !important; max-height: none !important; } .leaflet-container.leaflet-touch-zoom { -ms-touch-action: pan-x pan-y; touch-action: pan-x pan-y; } .leaflet-container.leaflet-touch-drag { -ms-touch-action: pinch-zoom; /* Fallback for FF which doesn't support pinch-zoom */ touch-action: none; touch-action: pinch-zoom; } .leaflet-container.leaflet-touch-drag.leaflet-touch-zoom { -ms-touch-action: none; touch-action: none; } .leaflet-container { -webkit-tap-highlight-color: transparent; } .leaflet-container a { -webkit-tap-highlight-color: rgba(51, 181, 229, 0.4); } .leaflet-tile { -webkit-filter: inherit; filter: inherit; visibility: hidden; } .leaflet-tile-loaded { visibility: inherit; } .leaflet-zoom-box { width: 0; height: 0; -webkit-box-sizing: border-box; box-sizing: border-box; z-index: 800; } /* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */ .leaflet-overlay-pane svg { -moz-user-select: none; } .leaflet-pane { z-index: 400; } .leaflet-tile-pane { z-index: 200; } .leaflet-overlay-pane { z-index: 400; } .leaflet-shadow-pane { z-index: 500; } .leaflet-marker-pane { z-index: 600; } .leaflet-tooltip-pane { z-index: 650; } .leaflet-popup-pane { z-index: 700; } .leaflet-map-pane canvas { z-index: 100; } .leaflet-map-pane svg { z-index: 200; } .leaflet-vml-shape { width: 1px; height: 1px; } .lvml { behavior: url(#default#VML); display: inline-block; position: absolute; } /* control positioning */ .leaflet-control { position: relative; z-index: 800; pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */ pointer-events: auto; } .leaflet-top, .leaflet-bottom { position: absolute; z-index: 1000; pointer-events: none; } .leaflet-top { top: 0; } .leaflet-right { right: 0; } .leaflet-bottom { bottom: 0; } .leaflet-left { left: 0; } .leaflet-control { float: left; clear: both; } .leaflet-right .leaflet-control { float: right; } .leaflet-top .leaflet-control { margin-top: 10px; } .leaflet-bottom .leaflet-control { margin-bottom: 10px; } .leaflet-left .leaflet-control { margin-left: 10px; } .leaflet-right .leaflet-control { margin-right: 10px; } /* zoom and fade animations */ .leaflet-fade-anim .leaflet-tile { will-change: opacity; } .leaflet-fade-anim .leaflet-popup { opacity: 0; -webkit-transition: opacity 0.2s linear; -o-transition: opacity 0.2s linear; transition: opacity 0.2s linear; } .leaflet-fade-anim .leaflet-map-pane .leaflet-popup { opacity: 1; } .leaflet-zoom-animated { -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; } .leaflet-zoom-anim .leaflet-zoom-animated { will-change: transform; } .leaflet-zoom-anim .leaflet-zoom-animated { -webkit-transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.25, 1); transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.25, 1); -o-transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1); transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1); transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1), -webkit-transform 0.25s cubic-bezier(0, 0, 0.25, 1); } .leaflet-zoom-anim .leaflet-tile, .leaflet-pan-anim .leaflet-tile { -webkit-transition: none; -o-transition: none; transition: none; } .leaflet-zoom-anim .leaflet-zoom-hide { visibility: hidden; } /* cursors */ .leaflet-interactive { cursor: pointer; } .leaflet-grab { cursor: -webkit-grab; cursor: grab; } .leaflet-crosshair, .leaflet-crosshair .leaflet-interactive { cursor: crosshair; } .leaflet-popup-pane, .leaflet-control { cursor: auto; } .leaflet-dragging .leaflet-grab, .leaflet-dragging .leaflet-grab .leaflet-interactive, .leaflet-dragging .leaflet-marker-draggable { cursor: move; cursor: -webkit-grabbing; cursor: grabbing; } /* marker & overlays interactivity */ .leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-image-layer, .leaflet-pane > svg path, .leaflet-tile-container { pointer-events: none; } .leaflet-marker-icon.leaflet-interactive, .leaflet-image-layer.leaflet-interactive, .leaflet-pane > svg path.leaflet-interactive { pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */ pointer-events: auto; } /* visual tweaks */ .leaflet-container { background: #ddd; outline: 0; } .leaflet-container a.leaflet-active { outline: 2px solid orange; } .leaflet-zoom-box { border: 2px dotted #38f; background: rgba(255, 255, 255, 0.5); } /* general typography */ .leaflet-container { font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif; } /* general toolbar styles */ .leaflet-bar { -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.65); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.65); border-radius: 4px; } .leaflet-bar a, .leaflet-bar a:hover { background-color: #fff; border-bottom: 1px solid #ccc; width: 26px; height: 26px; line-height: 26px; display: block; text-align: center; text-decoration: none; color: black; } .leaflet-bar a, .leaflet-control-layers-toggle { background-position: 50% 50%; background-repeat: no-repeat; display: block; } .leaflet-bar a:hover { background-color: #f4f4f4; } .leaflet-bar a:first-child { border-top-left-radius: 4px; border-top-right-radius: 4px; } .leaflet-bar a:last-child { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; border-bottom: none; } .leaflet-bar a.leaflet-disabled { cursor: default; background-color: #f4f4f4; color: #bbb; } .leaflet-touch .leaflet-bar a { width: 30px; height: 30px; line-height: 30px; } .leaflet-touch .leaflet-bar a:first-child { border-top-left-radius: 2px; border-top-right-radius: 2px; } .leaflet-touch .leaflet-bar a:last-child { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; } /* zoom control */ .leaflet-control-zoom-in, .leaflet-control-zoom-out { font: bold 18px 'Lucida Console', Monaco, monospace; text-indent: 1px; } .leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out { font-size: 22px; } /* layers control */ .leaflet-control-layers { -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4); background: #fff; border-radius: 5px; } .leaflet-control-layers-toggle { width: 36px; height: 36px; } .no-webp .leaflet-control-layers-toggle { background-image: url(../images/leaflet/layers.html); } .webp .leaflet-control-layers-toggle { background-image: url(../images/leaflet/layers-2.html); } .leaflet-retina .leaflet-control-layers-toggle { background-size: 26px 26px; } .no-webp .leaflet-retina .leaflet-control-layers-toggle { background-image: url(../images/leaflet/layers-2x.html); } .webp .leaflet-retina .leaflet-control-layers-toggle { background-image: url(../images/leaflet/layers-2x-2.html); } .leaflet-touch .leaflet-control-layers-toggle { width: 44px; height: 44px; } .leaflet-control-layers .leaflet-control-layers-list, .leaflet-control-layers-expanded .leaflet-control-layers-toggle { display: none; } .leaflet-control-layers-expanded .leaflet-control-layers-list { display: block; position: relative; } .leaflet-control-layers-expanded { padding: 6px 10px 6px 6px; color: #333; background: #fff; } .leaflet-control-layers-scrollbar { overflow-y: scroll; overflow-x: hidden; padding-right: 5px; } .leaflet-control-layers-selector { margin-top: 2px; position: relative; top: 1px; } .leaflet-control-layers label { display: block; } .leaflet-control-layers-separator { height: 0; border-top: 1px solid #ddd; margin: 5px -10px 5px -6px; } /* Default icon URLs */ .no-webp .leaflet-default-icon-path { background-image: url(../images/leaflet/marker-icon.html); } .webp .leaflet-default-icon-path { background-image: url(../images/leaflet/marker-icon-2.html); } /* attribution and scale controls */ .leaflet-container .leaflet-control-attribution { background: #fff; background: rgba(255, 255, 255, 0.7); margin: 0; } .leaflet-control-attribution, .leaflet-control-scale-line { padding: 0 5px; color: #333; } .leaflet-control-attribution a { text-decoration: none; } .leaflet-control-attribution a:hover { text-decoration: underline; } .leaflet-container .leaflet-control-attribution, .leaflet-container .leaflet-control-scale { font-size: 11px; } .leaflet-left .leaflet-control-scale { margin-left: 5px; } .leaflet-bottom .leaflet-control-scale { margin-bottom: 5px; } .leaflet-control-scale-line { border: 2px solid #777; border-top: none; line-height: 1.1; padding: 2px 5px 1px; font-size: 11px; white-space: nowrap; overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; background: #fff; background: rgba(255, 255, 255, 0.5); } .leaflet-control-scale-line:not(:first-child) { border-top: 2px solid #777; border-bottom: none; margin-top: -2px; } .leaflet-control-scale-line:not(:first-child):not(:last-child) { border-bottom: 2px solid #777; } .leaflet-touch .leaflet-control-attribution, .leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar { -webkit-box-shadow: none; box-shadow: none; } .leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar { border: 2px solid rgba(0, 0, 0, 0.2); background-clip: padding-box; } /* popup */ .leaflet-popup { position: absolute; text-align: center; margin-bottom: 20px; } .leaflet-popup-content-wrapper { padding: 1px; text-align: left; border-radius: 12px; } .leaflet-popup-content { margin: 13px 19px; line-height: 1.4; } .leaflet-popup-content p { margin: 18px 0; } .leaflet-popup-tip-container { width: 40px; height: 20px; position: absolute; left: 50%; margin-left: -20px; overflow: hidden; pointer-events: none; } .leaflet-popup-tip { width: 17px; height: 17px; padding: 1px; margin: -10px auto 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .leaflet-popup-content-wrapper, .leaflet-popup-tip { background: white; color: #333; -webkit-box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4); box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4); } .leaflet-container a.leaflet-popup-close-button { position: absolute; top: 0; right: 0; padding: 4px 4px 0 0; border: none; text-align: center; width: 18px; height: 14px; font: 16px/14px Tahoma, Verdana, sans-serif; color: #c3c3c3; text-decoration: none; font-weight: bold; background: transparent; } .leaflet-container a.leaflet-popup-close-button:hover { color: #999; } .leaflet-popup-scrolled { overflow: auto; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd; } .leaflet-oldie .leaflet-popup-content-wrapper { zoom: 1; } .leaflet-oldie .leaflet-popup-tip { width: 24px; margin: 0 auto; -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)"; filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678); } .leaflet-oldie .leaflet-popup-tip-container { margin-top: -1px; } .leaflet-oldie .leaflet-control-zoom, .leaflet-oldie .leaflet-control-layers, .leaflet-oldie .leaflet-popup-content-wrapper, .leaflet-oldie .leaflet-popup-tip { border: 1px solid #999; } /* div icon */ .leaflet-div-icon { background: #fff; border: 1px solid #666; } /* Tooltip */ /* Base styles for the element that has a tooltip */ .leaflet-tooltip { position: absolute; padding: 6px; background-color: #fff; border: 1px solid #fff; border-radius: 3px; color: #222; white-space: nowrap; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; pointer-events: none; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); } .leaflet-tooltip.leaflet-clickable { cursor: pointer; pointer-events: auto; } .leaflet-tooltip-top:before, .leaflet-tooltip-bottom:before, .leaflet-tooltip-left:before, .leaflet-tooltip-right:before { position: absolute; pointer-events: none; border: 6px solid transparent; background: transparent; content: ""; } /* Directions */ .leaflet-tooltip-bottom { margin-top: 6px; } .leaflet-tooltip-top { margin-top: -6px; } .leaflet-tooltip-bottom:before, .leaflet-tooltip-top:before { left: 50%; margin-left: -6px; } .leaflet-tooltip-top:before { bottom: 0; margin-bottom: -12px; border-top-color: #fff; } .leaflet-tooltip-bottom:before { top: 0; margin-top: -12px; margin-left: -6px; border-bottom-color: #fff; } .leaflet-tooltip-left { margin-left: -6px; } .leaflet-tooltip-right { margin-left: 6px; } .leaflet-tooltip-left:before, .leaflet-tooltip-right:before { top: 50%; margin-top: -6px; } .leaflet-tooltip-left:before { right: 0; margin-right: -12px; border-left-color: #fff; } .leaflet-tooltip-right:before { left: 0; margin-left: -12px; border-right-color: #fff; } /** * Swiper 5.2.1 * Most modern mobile touch slider and framework with hardware accelerated transitions * http://swiperjs.com * * Copyright 2014-2019 Vladimir Kharlampidi * * Released under the MIT License * * Released on: November 16, 2019 */ @font-face { font-family: 'swiper-icons'; src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff"); font-weight: 400; font-style: normal; } :root { --swiper-theme-color: #007aff; } .swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; /* Fix of Webkit flickering */ z-index: 1; } .swiper-container-vertical > .swiper-wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-box-sizing: content-box; box-sizing: content-box; } .swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translate3d(0px, 0, 0); transform: translate3d(0px, 0, 0); } .swiper-container-multirow > .swiper-wrapper { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .swiper-container-multirow-column > .swiper-wrapper { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .swiper-container-free-mode > .swiper-wrapper { -webkit-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto; } .swiper-slide { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform; transition-property: transform, -webkit-transform; } .swiper-slide-invisible-blank { visibility: hidden; } /* Auto Height */ .swiper-container-autoheight, .swiper-container-autoheight .swiper-slide { height: auto; } .swiper-container-autoheight .swiper-wrapper { -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; -webkit-transition-property: height, -webkit-transform; transition-property: height, -webkit-transform; -o-transition-property: transform, height; transition-property: transform, height; transition-property: transform, height, -webkit-transform; } /* 3D Effects */ .swiper-container-3d { -webkit-perspective: 1200px; perspective: 1200px; } .swiper-container-3d .swiper-wrapper, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-cube-shadow { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; } .swiper-container-3d .swiper-slide-shadow-left { background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-right { background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-top { background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-bottom { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } /* CSS Mode */ .swiper-container-css-mode > .swiper-wrapper { overflow: auto; scrollbar-width: none; /* For Firefox */ -ms-overflow-style: none; /* For Internet Explorer and Edge */ } .swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar { display: none; } .swiper-container-css-mode > .swiper-wrapper > .swiper-slide { scroll-snap-align: start start; } .swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper { -webkit-scroll-snap-type: x mandatory; -ms-scroll-snap-type: x mandatory; scroll-snap-type: x mandatory; } .swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper { -webkit-scroll-snap-type: y mandatory; -ms-scroll-snap-type: y mandatory; scroll-snap-type: y mandatory; } :root { --swiper-navigation-size: 44px; /* --swiper-navigation-color: var(--swiper-theme-color); */ } .swiper-button-prev, .swiper-button-next { position: absolute; top: 50%; width: calc(var(--swiper-navigation-size) / 44 * 27); height: var(--swiper-navigation-size); margin-top: calc(-1 * var(--swiper-navigation-size) / 2); z-index: 10; cursor: pointer; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; color: var(--swiper-navigation-color, var(--swiper-theme-color)); } .swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none; } .swiper-button-prev:after, .swiper-button-next:after { font-family: swiper-icons; font-size: var(--swiper-navigation-size); text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; } .swiper-button-prev, .swiper-container-rtl .swiper-button-next { left: 10px; right: auto; } .swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after { content: 'prev'; } .swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: 10px; left: auto; } .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after { content: 'next'; } .swiper-button-prev.swiper-button-white, .swiper-button-next.swiper-button-white { --swiper-navigation-color: #ffffff; } .swiper-button-prev.swiper-button-black, .swiper-button-next.swiper-button-black { --swiper-navigation-color: #000000; } .swiper-button-lock { display: none; } :root { /* --swiper-pagination-color: var(--swiper-theme-color); */ } .swiper-pagination { position: absolute; text-align: center; -webkit-transition: 300ms opacity; -o-transition: 300ms opacity; transition: 300ms opacity; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: 10; } .swiper-pagination.swiper-pagination-hidden { opacity: 0; } /* Common Styles */ .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 10px; left: 0; width: 100%; } /* Bullets */ .swiper-pagination-bullets-dynamic { overflow: hidden; font-size: 0; } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transform: scale(0.33); -ms-transform: scale(0.33); transform: scale(0.33); position: relative; } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { -webkit-transform: scale(0.66); -ms-transform: scale(0.66); transform: scale(0.66); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { -webkit-transform: scale(0.33); -ms-transform: scale(0.33); transform: scale(0.33); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { -webkit-transform: scale(0.66); -ms-transform: scale(0.66); transform: scale(0.66); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { -webkit-transform: scale(0.33); -ms-transform: scale(0.33); transform: scale(0.33); } .swiper-pagination-bullet { width: 8px; height: 8px; display: inline-block; border-radius: 100%; background: #000; opacity: 0.2; } button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; -webkit-box-shadow: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; } .swiper-pagination-bullet-active { opacity: 1; background: var(--swiper-pagination-color, var(--swiper-theme-color)); } .swiper-container-vertical > .swiper-pagination-bullets { right: 10px; top: 50%; -webkit-transform: translate3d(0px, -50%, 0); transform: translate3d(0px, -50%, 0); } .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 6px 0; display: block; } .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 8px; } .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { display: inline-block; -webkit-transition: 200ms top, 200ms -webkit-transform; transition: 200ms top, 200ms -webkit-transform; -o-transition: 200ms transform, 200ms top; transition: 200ms transform, 200ms top; transition: 200ms transform, 200ms top, 200ms -webkit-transform; } .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 4px; } .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic { left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); white-space: nowrap; } .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transition: 200ms left, 200ms -webkit-transform; transition: 200ms left, 200ms -webkit-transform; -o-transition: 200ms transform, 200ms left; transition: 200ms transform, 200ms left; transition: 200ms transform, 200ms left, 200ms -webkit-transform; } .swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transition: 200ms right, 200ms -webkit-transform; transition: 200ms right, 200ms -webkit-transform; -o-transition: 200ms transform, 200ms right; transition: 200ms transform, 200ms right; transition: 200ms transform, 200ms right, 200ms -webkit-transform; } /* Progress */ .swiper-pagination-progressbar { background: rgba(0, 0, 0, 0.25); position: absolute; } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--swiper-pagination-color, var(--swiper-theme-color)); position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; } .swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { -webkit-transform-origin: right top; -ms-transform-origin: right top; transform-origin: right top; } .swiper-container-horizontal > .swiper-pagination-progressbar, .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 100%; height: 4px; left: 0; top: 0; } .swiper-container-vertical > .swiper-pagination-progressbar, .swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 4px; height: 100%; left: 0; top: 0; } .swiper-pagination-white { --swiper-pagination-color: #ffffff; } .swiper-pagination-black { --swiper-pagination-color: #000000; } .swiper-pagination-lock { display: none; } /* Scrollbar */ .swiper-scrollbar { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0, 0, 0, 0.1); } .swiper-container-horizontal > .swiper-scrollbar { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98%; } .swiper-container-vertical > .swiper-scrollbar { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98%; } .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0, 0, 0, 0.5); border-radius: 10px; left: 0; top: 0; } .swiper-scrollbar-cursor-drag { cursor: move; } .swiper-scrollbar-lock { display: none; } .swiper-zoom-container { width: 100%; height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center; } .swiper-zoom-container > img, .swiper-zoom-container > svg, .swiper-zoom-container > canvas { max-width: 100%; max-height: 100%; -o-object-fit: contain; object-fit: contain; } .swiper-slide-zoomed { cursor: move; } /* Preloader */ :root { /* --swiper-preloader-color: var(--swiper-theme-color); */ } .swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; -webkit-animation: swiper-preloader-spin 1s infinite linear; animation: swiper-preloader-spin 1s infinite linear; -webkit-box-sizing: border-box; box-sizing: border-box; border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color)); border-radius: 50%; border-top-color: transparent; } .swiper-lazy-preloader-white { --swiper-preloader-color: #fff; } .swiper-lazy-preloader-black { --swiper-preloader-color: #000; } @-webkit-keyframes swiper-preloader-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes swiper-preloader-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /* a11y */ .swiper-container .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000; } .swiper-container-fade.swiper-container-free-mode .swiper-slide { -webkit-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; } .swiper-container-fade .swiper-slide { pointer-events: none; -webkit-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity; } .swiper-container-fade .swiper-slide .swiper-slide { pointer-events: none; } .swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-container-cube { overflow: visible; } .swiper-container-cube .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; visibility: hidden; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; width: 100%; height: 100%; } .swiper-container-cube .swiper-slide .swiper-slide { pointer-events: none; } .swiper-container-cube.swiper-container-rtl .swiper-slide { -webkit-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0; } .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-prev, .swiper-container-cube .swiper-slide-next + .swiper-slide { pointer-events: auto; visibility: visible; } .swiper-container-cube .swiper-slide-shadow-top, .swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-cube .swiper-cube-shadow { position: absolute; left: 0; bottom: 0px; width: 100%; height: 100%; background: #000; opacity: 0.6; -webkit-filter: blur(50px); filter: blur(50px); z-index: 0; } .swiper-container-flip { overflow: visible; } .swiper-container-flip .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; } .swiper-container-flip .swiper-slide .swiper-slide { pointer-events: none; } .swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active { pointer-events: auto; } .swiper-container-flip .swiper-slide-shadow-top, .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } /*------------- #THEME STYLES --------------*/ /*------------- #VARIABLES --------------*/ /*------------- #ROOT --------------*/ :root { --font-family-body: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; --h-family-body: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; --body-font-size: 16px; --body-font-weight: 400; --base-line-height: 1.6; --body-letter-spacing: initial; --primary-accent-color: #27c7cd; --secondary-accent-color: #6c6ff2; --body-font-color: #495057; --white-color: #ffffff; --heading-color: #1b2c38; --link-color: #1b2c38; --red-themes: #fc3e59; --green-themes: #95d133; --grey-themes: #f1f2ec; --dark-themes: #1b2c38; --yellow-themes: #ffcb05; --brown-themes: #d89961; --pink-themes: #f28089; --blue-themes: #313759; --icon-color: #aab3bd; --border-grey-color: #DAE0E8; --border-dark-color: #262d37; --input-dark: #333d44; --theme-shadow: 0 10px 20px 0 rgba(39, 199, 205, 0.2); --h1-font-size: 48px; --h2-font-size: 42px; --h3-font-size: 36px; --h4-font-size: 28px; --h5-font-size: 20px; --h6-font-size: 16px; --h-margin-bottom: 20px; --h-font-weight: 700; } /*------------- #GLOBAL STYLES --------------*/ *, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; } html, body { position: relative; } body { color: var(--body-font-color); font-family: var(--font-family-body); font-size: var(--body-font-size); font-weight: var(--body-font-weight); line-height: var(--base-line-height); letter-spacing: var(--body-letter-spacing); } img { max-width: 100%; height: auto; display: inline-block; } blockquote { -webkit-margin-before: 0; -webkit-margin-after: 0; -webkit-margin-start: 0; -webkit-margin-end: 0; } caption { padding-top: 8px; padding-bottom: 8px; color: #777; text-align: left; } a { color: var(--link-color); -webkit-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; text-decoration: none; display: inline-block; } a:hover { color: var(--primary-accent-color); text-decoration: none; } p { margin-bottom: 0; } figure { margin: 0; max-width: 100%; } select { width: 100%; border: 1px solid #495057; appearance: none; -moz-appearance: none; /* Firefox */ -webkit-appearance: none; /* Safari and Chrome */ } textarea { height: auto; min-height: 50px; } textarea::-webkit-input-placeholder, input::-webkit-input-placeholder { color: #495057; } textarea:-moz-placeholder, input:-moz-placeholder { color: #495057; } textarea:-ms-input-placeholder, input:-ms-input-placeholder { color: #495057; } input, textarea { -webkit-box-shadow: none; box-shadow: none; } input:-moz-submit-invalid, textarea:-moz-submit-invalid { box-shadow: none; } input.wpcf7-form-control, textarea.wpcf7-form-control { width: 100%; } /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } /*------------- #TYPOGRAPHY --------------*/ h1, .h1 { margin-bottom: var(--h-margin-bottom); font-weight: var(--h-font-weight); color: var(--heading-color); line-height: 1.15em; font-family: var(--h-family-body); font-size: 3rem; } @media (max-width: 1200px) { h1, .h1 { font-size: calc(1.425rem + 2.1vw) ; } } h1 a, .h1 a { color: inherit; } h2, .h2 { margin-bottom: var(--h-margin-bottom); line-height: 1.2em; font-weight: var(--h-font-weight); color: var(--heading-color); font-family: var(--h-family-body); font-size: 2.625rem; } @media (max-width: 1200px) { h2, .h2 { font-size: calc(1.3875rem + 1.65vw) ; } } h2 a, .h2 a { color: inherit; } h3, .h3 { margin-bottom: var(--h-margin-bottom); line-height: 1.25em; font-weight: var(--h-font-weight); color: var(--heading-color); font-family: var(--h-family-body); font-size: 2.25rem; } @media (max-width: 1200px) { h3, .h3 { font-size: calc(1.35rem + 1.2vw) ; } } h3 a, .h3 a { color: inherit; } h4, .h4 { margin-bottom: var(--h-margin-bottom); line-height: 1.3em; font-weight: var(--h-font-weight); color: var(--heading-color); font-family: var(--h-family-body); font-size: 1.75rem; } @media (max-width: 1200px) { h4, .h4 { font-size: calc(1.3rem + 0.6vw) ; } } h4 a, .h4 a { color: inherit; } h5, .h5 { margin-bottom: var(--h-margin-bottom); line-height: 1.3em; font-weight: var(--h-font-weight); color: var(--heading-color); font-family: var(--h-family-body); font-size: 1.25rem; } h5 a, .h5 a { color: inherit; } h6, .h6 { margin-bottom: var(--h-margin-bottom); line-height: 1.5; font-weight: var(--h-font-weight); color: var(--heading-color); font-family: var(--h-family-body); font-size: 1rem; } h6 a, .h6 a { color: inherit; } dl { margin-bottom: 24px; } dl dt { margin-bottom: 5px; color: #777; font-weight: bold; } dl dd { margin-bottom: 5px; margin-left: 20px; } abbr { cursor: help; border-color: #495057; } hr { position: relative; display: block; width: 100%; min-height: 10px; margin: 0 auto; } /*------------- #Styles for First-Letter --------------*/ .first-letter--under-text { padding: 30px 0 0 20px; position: relative; } .first-letter--under-text span:first-of-type { font-size: 80px; font-weight: 700; line-height: 1; position: absolute; top: 0; left: 0; opacity: .1; } .first-letter--before-text span:first-of-type { font-size: 100px; font-weight: 700; line-height: 1; margin-right: 30px; color: var(--primary-accent-color); float: left; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .first-letter--before-text span:first-of-type { font-size: 60px; margin-right: 20px; } } /*------------- #FORMS --------------*/ input, textarea, select { padding: 1.024rem 1.875rem; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; font-size: 16px; border-radius: 30px; background-color: var(--grey-themes); width: 100%; outline: none; caret-color: var(--body-font-color); color: var(--body-font-color); max-height: 60px; border: 2px solid var(--grey-themes); /* Firefox 19+ */ /* Firefox 18- */ } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder, select::-webkit-input-placeholder { color: var(--body-font-color); opacity: 1; } input::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder { color: var(--body-font-color); opacity: 1; } input:-moz-placeholder, textarea:-moz-placeholder, select:-moz-placeholder { color: var(--body-ont-color); opacity: 1; } input:-ms-input-placeholder, textarea:-ms-input-placeholder, select:-ms-input-placeholder { color: var(--body-font-color); opacity: 1; } input.input--white, textarea.input--white, select.input--white { background-color: var(--white-color); border-color: var(--white-color); } input.input--white:focus, textarea.input--white:focus, select.input--white:focus { background-color: var(--white-color); border-color: var(--primary-accent-color); } input.input--dark, textarea.input--dark, select.input--dark { background-color: var(--input-dark); border-color: var(--input-dark); color: #949fac; /* Firefox 19+ */ /* Firefox 18- */ } input.input--dark::-webkit-input-placeholder, textarea.input--dark::-webkit-input-placeholder, select.input--dark::-webkit-input-placeholder { color: var(--grey-themes); opacity: 1; } input.input--dark::-moz-placeholder, textarea.input--dark::-moz-placeholder, select.input--dark::-moz-placeholder { color: var(--grey-themes); opacity: 1; } input.input--dark:-moz-placeholder, textarea.input--dark:-moz-placeholder, select.input--dark:-moz-placeholder { color: var(--grey-themes); opacity: 1; } input.input--dark:-ms-input-placeholder, textarea.input--dark:-ms-input-placeholder, select.input--dark:-ms-input-placeholder { color: var(--grey-themes); opacity: 1; } input.input--dark:focus, textarea.input--dark:focus, select.input--dark:focus { background-color: var(--white-color); border-color: var(--white-color); /* Firefox 19+ */ /* Firefox 18- */ } input.input--dark:focus::-webkit-input-placeholder, textarea.input--dark:focus::-webkit-input-placeholder, select.input--dark:focus::-webkit-input-placeholder { color: #afb6c0; opacity: 1; } input.input--dark:focus::-moz-placeholder, textarea.input--dark:focus::-moz-placeholder, select.input--dark:focus::-moz-placeholder { color: #afb6c0; opacity: 1; } input.input--dark:focus:-moz-placeholder, textarea.input--dark:focus:-moz-placeholder, select.input--dark:focus:-moz-placeholder { color: #afb6c0; opacity: 1; } input.input--dark:focus:-ms-input-placeholder, textarea.input--dark:focus:-ms-input-placeholder, select.input--dark:focus:-ms-input-placeholder { color: #afb6c0; opacity: 1; } input:focus, textarea:focus, select:focus { -webkit-box-shadow: var(--theme-shadow); box-shadow: var(--theme-shadow); background-color: transparent; border-color: var(--primary-accent-color); /* Firefox 19+ */ /* Firefox 18- */ } input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder, select:focus::-webkit-input-placeholder { color: #afb6c0; opacity: 1; } input:focus::-moz-placeholder, textarea:focus::-moz-placeholder, select:focus::-moz-placeholder { color: #afb6c0; opacity: 1; } input:focus:-moz-placeholder, textarea:focus:-moz-placeholder, select:focus:-moz-placeholder { color: #afb6c0; opacity: 1; } input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder, select:focus:-ms-input-placeholder { color: #afb6c0; opacity: 1; } textarea { max-height: unset; } .form--input-dark .input-title { color: #949fac; } .form--input-dark input, .form--input-dark textarea, .form--input-dark select { background-color: var(--input-dark); border-color: var(--input-dark); color: #949fac; } .form--input-dark input:focus, .form--input-dark textarea:focus, .form--input-dark select:focus { background-color: var(--white-color); border-color: var(--white-color); color: var(--body-font-color); /* Firefox 19+ */ /* Firefox 18- */ } .form--input-dark input:focus::-webkit-input-placeholder, .form--input-dark textarea:focus::-webkit-input-placeholder, .form--input-dark select:focus::-webkit-input-placeholder { color: #afb6c0; opacity: 1; } .form--input-dark input:focus::-moz-placeholder, .form--input-dark textarea:focus::-moz-placeholder, .form--input-dark select:focus::-moz-placeholder { color: #afb6c0; opacity: 1; } .form--input-dark input:focus:-moz-placeholder, .form--input-dark textarea:focus:-moz-placeholder, .form--input-dark select:focus:-moz-placeholder { color: #afb6c0; opacity: 1; } .form--input-dark input:focus:-ms-input-placeholder, .form--input-dark textarea:focus:-ms-input-placeholder, .form--input-dark select:focus:-ms-input-placeholder { color: #afb6c0; opacity: 1; } .remember-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .remember-wrap a { text-decoration: underline; -webkit-text-decoration-color: var(--primary-accent-color); text-decoration-color: var(--primary-accent-color); } .form-item { margin-bottom: 20px; } .input-btn--inline { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .input-btn--inline .crumina-button { margin-left: 10px; } .send-message-form .form-item { margin-bottom: 30px; } .inquiry-btn-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .inquiry-btn-wrap .crumina-button { min-width: -webkit-max-content; min-width: -moz-max-content; min-width: max-content; } .inquiry-btn-wrap span { font-size: 14px; margin-left: 30px; } .inquiry-btn-wrap code { font-size: 14px; color: #949fac; } .input-title { color: var(--heading-color); font-size: 16px; margin-bottom: 15px; display: block; padding-left: 30px; } .input-title abbr[title] { color: #ed3d56; margin-left: 3px; text-decoration: none; } .form--inline { position: relative; } .form--inline button { height: 100%; position: absolute; top: 0; right: 0; } .shop-user-form { margin-top: 30px; } .shop-user-form .form-item { margin-bottom: 30px; } .seo-score-form { text-align: center; } /*------------- #Form Inline --------------*/ .form-inline-inputs-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-bottom: 30px; width: 100%; } .form-inline-inputs-wrap > * { border-radius: 0; margin-right: 1px; } .form-inline-inputs-wrap > *:first-child { border-radius: 50px 0 0 50px; } .form-inline-inputs-wrap > *:last-child { border-radius: 0 50px 50px 0; margin-right: 0; } /*------------- #SELECT2 Customization --------------*/ .select2 { padding: 1rem 1.875rem; max-height: 60px; border-radius: 30px; -webkit-transition: none; -o-transition: none; transition: none; outline: none; color: var(--heading-color); background-color: var(--grey-themes); font-size: 16px; border: 2px solid var(--grey-themes); } .select2.select2-container--open { background-color: var(--white-color); border-radius: 30px 30px 0 0; border-color: var(--primary-accent-color); border-bottom-color: transparent; } .select2:disabled { color: var(--border-grey-color); } .select2:disabled + .select2-container--default .select2-selection--single .select2-selection__arrow b { border-bottom-color: var(--body-font-color); border-right-color: var(--body-font-color); } .select2:disabled + .select2-container--default.select2-container--disabled .select2-selection--single { background-color: transparent; } .select2:disabled + .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--border-grey-color); } .select2-container--default .select2-selection--single { border-color: transparent; background-color: transparent; } .select2-container .select2-selection--single .select2-selection__rendered { padding: 0; color: var(--heading-color); } .select2-container.select2-container--open .select2-selection--single .select2-selection__rendered { color: var(--dark-themes); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .select2-container--default .select2-selection--single { outline: none; } .select2-container--default .select2-selection--single .select2-selection__arrow { right: 40px; } .select2-container--default .select2-selection--single .select2-selection__arrow b { display: block; border-bottom: 2px solid var(--body-font-color); border-right: 2px solid var(--body-font-color); height: 8px; width: 8px; pointer-events: none; position: absolute; -webkit-transform-origin: 66% 66%; -ms-transform-origin: 66% 66%; transform-origin: 66% 66%; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg); border-bottom-color: var(--primary-accent-color); border-right-color: var(--primary-accent-color); } .select2-dropdown { -webkit-box-shadow: var(--theme-shadow); box-shadow: var(--theme-shadow); border-radius: 0 0 30px 30px; top: -5px; padding: 10px 20px 30px; border: 2px solid var(--primary-accent-color); border-top-color: transparent; } .select2-results__option { border-radius: 3px; padding: 10px 12px; color: var(--heading-color); } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: var(--primary-accent-color); color: var(--white-color); } .select2-search--dropdown { margin-bottom: 15px; } .select2-container--default .select2-search--dropdown .select2-search__field { border-color: var(--grey-themes); } .select2-container--default .select2-search--dropdown .select2-search__field:focus { border-color: var(--primary-accent-color); } .select2-search--dropdown .select2-search__field { padding: 4px 15px; } /*------------- #INPPUT QUANTITY --------------*/ .quantity { overflow: hidden; display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-weight: 400; text-align: center; } .quantity input { width: 50px; height: 60px; background-color: var(--grey-themes); padding: 0; font-size: 18px; border-radius: 0; margin-bottom: 0; line-height: 1; text-align: center; } .quantity input:focus { -webkit-box-shadow: none; box-shadow: none; border-color: transparent; background-color: var(--white-color); color: var(--primary-accent-color); } @media (max-width: 980px) { .quantity input { font-size: 18px; width: 40px; height: 40px; } } @media (max-width: 480px) { .quantity input { font-size: 14px; width: 30px; height: 30px; } } .quantity .quantity-plus, .quantity .quantity-minus { display: block; width: 60px; height: 60px; padding: 0; background-color: #e8e9e1; border-radius: 0 50px 50px 0; font-size: 40px; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; cursor: pointer; font-weight: 400; padding-bottom: 4px; border: none; /* Firefox 19+ */ /* Firefox 18- */ } .quantity .quantity-plus::-webkit-input-placeholder, .quantity .quantity-minus::-webkit-input-placeholder { color: var(--body-font-color); } .quantity .quantity-plus::-moz-placeholder, .quantity .quantity-minus::-moz-placeholder { color: var(--body-font-color); } .quantity .quantity-plus:-moz-placeholder, .quantity .quantity-minus:-moz-placeholder { color: var(--body-font-color); } .quantity .quantity-plus:-ms-input-placeholder, .quantity .quantity-minus:-ms-input-placeholder { color: var(--body-font-color); } @media (max-width: 980px) { .quantity .quantity-plus, .quantity .quantity-minus { font-size: 20px; width: 40px; height: 40px; } } @media (max-width: 480px) { .quantity .quantity-plus, .quantity .quantity-minus { font-size: 14px; width: 30px; height: 30px; padding-bottom: 0; } } .quantity .quantity-plus:hover, .quantity .quantity-plus:focus, .quantity .quantity-minus:hover, .quantity .quantity-minus:focus { color: #ffffff; background-color: #1b2c38; border: none; } .quantity .quantity-plus { font-size: 24px; } @media (max-width: 980px) { .quantity .quantity-plus { font-size: 18px; } } @media (max-width: 480px) { .quantity .quantity-plus { font-size: 14px; } } .quantity .quantity-minus { border-radius: 50px 0 0 50px; } /*------------- Language Switcher --------------*/ .crumina-language-switcher { width: auto; min-width: 100px; } .crumina-language-switcher .btn { background-color: transparent; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; border: none; } .crumina-language-switcher img { width: 20px; height: 20px; min-width: 20px; min-height: 20px; border-radius: 100%; margin-right: 10px; } .crumina-language-switcher .dropdown-menu { border-radius: 10px; top: 5px; padding: 0; background-color: var(--white-color); } .crumina-language-switcher .dropdown-menu .dropdown-item { padding: 10px 30px; border-radius: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: var(--heading-color); text-decoration: none; } .crumina-language-switcher .dropdown-menu .dropdown-item:hover, .crumina-language-switcher .dropdown-menu .dropdown-item:focus { background-color: var(--grey-themes); } .crumina-language-switcher .dropdown-menu .dropdown-item:first-of-type { border-radius: 10px 10px 0 0; padding-top: 15px; } .crumina-language-switcher .dropdown-menu .dropdown-item:last-of-type { border-radius: 0 0 10px 10px; padding-bottom: 15px; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { input, textarea, select { padding: .7rem 1.1rem; font-size: 14px; } .input-btn--inline { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .input-btn--inline .crumina-button { margin-left: 0; margin-top: 20px; } .remember-wrap { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .remember-wrap .crumina-checkbox { margin-bottom: 15px; } } @media (max-width: 580px) { .seo-score-form { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .seo-score-form .form-inline-inputs-wrap { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; margin-right: 0; } .seo-score-form .form-inline-inputs-wrap > * { margin-right: 0; margin-bottom: 20px; } .seo-score-form .form-inline-inputs-wrap > *:first-child { border-radius: 50px; } .seo-score-form .form-inline-inputs-wrap > *:last-child { border-radius: 50px; } .inquiry-btn-wrap { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .inquiry-btn-wrap span { margin-left: 0; margin-top: 20px; } } /*------------- #BREADCRUMBS --------------*/ .breadcrumbs { padding-left: 0; margin-bottom: 0; color: var(--white-color); } .breadcrumbs .breadcrumbs-item { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .breadcrumbs .breadcrumbs-item .crumina-icon { color: inherit; margin: 0 15px; } .breadcrumbs .breadcrumbs-item a { text-decoration: underline; color: inherit; } .breadcrumbs .breadcrumbs-item a:hover { -webkit-text-decoration-color: transparent; text-decoration-color: transparent; } .breadcrumbs .trail-end { color: inherit; } /*------------- #STUNNING-HEADER --------------*/ .crumina-stunning-header { position: relative; padding: 80px 0; background-position: center center; } .crumina-stunning-header.blog-page { padding: 60px 0 120px; } .stunning-header-content > * { margin-bottom: 20px; } .stunning-header-content > *:last-child { margin-bottom: 0; } .stunning-header--format-video { padding-bottom: 0; } .stunning-header--format-video .post-thumb { margin-top: 60px; } .stunning-header--format-case { padding-bottom: 0; } .stunning-header--format-case .case-thumb { margin-top: 60px; } /*------------- #Any colors background --------------*/ .section-image-bg-dark { background-image: url("../images/stunning-header/pattern-bg-dark.jpg"); } .section-image-bg-blue { background-image: url("../images/stunning-header/pattern-bg-blue.jpg"); } .section-image-bg-yellow { background-image: url("../images/stunning-header/pattern-bg-yellow.jpg"); } .section-image-bg-red { background-image: url("../images/stunning-header/pattern-bg-red.jpg"); } .section-image-bg-purple { background-image: url("../images/stunning-header/pattern-bg-purple.jpg"); } .section-image-bg-moon { background-image: url("../images/stunning-header/pattern-bg-moon.jpg"); } .section-image-bg-lime { background-image: url("../images/stunning-header/pattern-bg-lime.jpg"); } .section-image-bg-grey-darken { background-image: url("../images/stunning-header/pattern-bg-grey-darken.jpg"); } .section-image-bg-grey-dark { background-image: url("../images/stunning-header/pattern-bg-grey-dark.jpg"); } .section-image-bg-grey { background-image: url("../images/stunning-header/pattern-bg-grey.jpg"); } .section-image-bg-green { background-image: url("../images/stunning-header/pattern-bg-green.jpg"); } .section-image-bg-dark { background-image: url("../images/stunning-header/pattern-bg-dark.jpg"); } .section-image-bg-brown { background-image: url("../images/stunning-header/pattern-bg-brown.jpg"); } .section-image-bg-breez { background-image: url("../images/stunning-header/pattern-bg-breez.jpg"); } .section-image-bg-blue-light { background-image: url("../images/stunning-header/pattern-bg-blue-light.jpg"); } .section-image-bg-blue-dark { background-image: url("../images/stunning-header/pattern-bg-blue-dark.jpg"); } .section-image-bg-blue { background-image: url("../images/stunning-header/pattern-bg-blue.jpg"); } .section-image-bg-black { background-image: url("../images/stunning-header/pattern-bg-black.jpg"); } .section-bg-photo { background-size: cover; } .bg-photo1 { background-image: url("../images/stunning-header/photo.jpg"); } .bg-photo2 { background-image: url("../images/illustrations/img3.jpg"); } .bg-photo3 { background-image: url("../images/illustrations/img4.jpg"); } .bg-photo4 { background-image: url("../images/illustrations/img5.jpg"); } .bg-photo5 { background-image: url("../images/illustrations/img6.jpg"); } .bg-1 { background-image: url("../images/illustrations/img26.jpg"); } .bg-2 { background-image: url("../images/illustrations/img27.jpg"); } .bg-3 { background-image: url("../images/illustrations/img28.jpg"); } .bg-4 { background-image: url("../images/illustrations/img29.jpg"); } .bg-5 { background-image: url("../images/illustrations/img30.jpg"); } .crumina-background-parallax { background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } /*================= Responsive Mode ============*/ @media (max-width: 991px) { .crumina-stunning-header { padding: 40px 0; } .stunning-header--format-case { padding-bottom: 0; } .stunning-header--format-video { padding-bottom: 0; } } /*------------- #BLOGS --------------*/ .post { position: relative; border-radius: 5px; background-color: var(--grey-themes); overflow: hidden; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .post .overlay { opacity: 0; } .post:hover { -webkit-box-shadow: var(--box-shadow-color); box-shadow: var(--box-shadow-color); } .post:hover .overlay { opacity: 1; } .post-thumb { position: relative; } .post-thumb img { margin: 0 auto; display: block; } .post-thumb iframe { width: 100%; } .post-content { padding: 20px 30px; } .post-title { margin-bottom: 20px; } .post-title:hover a { color: var(--primary-accent-color); } .post-text { margin-bottom: 20px; } .author-pocket-post { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 20px; } .author-post { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: left; padding: 40px; background-color: var(--grey-themes); border-radius: 5px; margin: 40px 0; } .author-post .author-avatar { width: 100px; height: 100px; min-width: 100px; min-height: 100px; margin-right: 30px; border-radius: 100%; background-color: #e0e4eb; } .author-avatar { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .post-author { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: left; } .post-author .author-avatar { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; width: 40px; height: 40px; min-width: 40px; min-height: 40px; margin-right: 10px; border-radius: 100%; background-color: #e0e4eb; } .post-author.post-author--column { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; text-align: center; } .post-author.post-author--column .author-avatar { margin-right: 0; margin-bottom: 15px; } .post-author-name { font-size: 14px; font-weight: 700; } .post-date { font-size: 12px; } .add-to-pocket { width: 40px; height: 40px; min-width: 40px; min-height: 40px; border-radius: 100%; border: 1px solid var(--icon-color); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .add-to-pocket:hover { background-color: var(--primary-accent-color); border-color: var(--primary-accent-color); } .add-to-pocket:hover .crumina-icon { fill: var(--white-color); } .add-to-pocket .crumina-icon { fill: var(--icon-color); margin: auto; } article .post-category-wrap { margin-bottom: 15px; } .post-category-wrap > * { margin-right: 5px; } .post-category-wrap > *:last-child { margin-right: 0; } .post-category { font-size: 11px; color: var(--white-color); display: inline-block; line-height: 1; padding: 5px 10px; background-color: var(--secondary-accent-color); text-transform: uppercase; border-radius: 3px; } .post-category:hover { opacity: .8; color: var(--white-color); } .post-additional-info { padding-top: 20px; border-top: 1px solid var(--border-grey-color); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .post-additional-info .crumina-icon { fill: var(--icon-color); } .post-additional-info a { line-height: 1; } .post-additional-info > * { margin-right: 30px; } .post-additional-info > *:last-child { margin-right: 0; } .post-additional-info-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .post-additional-info-wrap > * { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-right: 30px; font-size: 14px; } .post-additional-info-wrap > *:last-child { margin-right: 0; } .post-additional-info-wrap > * .crumina-icon { margin-right: 10px; } .post-time-reading { color: var(--heading-color); } .post-comments { color: var(--heading-color); } .post-comments:hover { color: var(--primary-accent-color); } .post-shared .crumina-icon { fill: var(--icon-color); } .post-shared:hover .crumina-icon { fill: var(--primary-accent-color); } .shared-pocket-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-left: 30px; } .shared-pocket-wrap .post-shared { margin-right: 30px; } .posts-wrapper > * { margin-bottom: 60px; } .posts-wrapper > *:last-child { margin-bottom: 0; } /*------------- #POST FORMAT VIDEO --------------*/ .format-video { position: relative; } .format-video .overlay { opacity: 1; } .format-video .play-video { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } /*------------- #POST FORMAT SLIDER --------------*/ .post.format-slider .swiper-container { position: relative; } .post.format-slider .post-thumb { overflow: hidden; } .post.format-slider .pagination-bottom-center { padding-bottom: 0; } .post.format-slider .pagination-bottom-center .swiper-pagination { bottom: 15px; } /*------------- #POST FORMAT QUOTE --------------*/ .post.format-quote .post-thumb { padding: 80px; } .post.format-quote .text { font-size: 24px; font-style: italic; color: var(--white-color); margin-bottom: 20px; } .post.format-quote .post-author-name { font-size: 18px; color: var(--primary-accent-color); } .post.format-quote .post-date { color: #949fac; font-size: 16px; } .post.format-quote .author-pocket-post { margin-bottom: 0; } .post.format-quote .post-author .author-avatar { width: initial; height: initial; min-width: 30px; min-height: 30px; margin-right: 30px; background: transparent; border-radius: 0; } .bg-boxed-dark { background-image: url("../images/theme-content/post-quote.png"); } /*------------- #POST FORMAT IMAGE --------------*/ .post.format-image .post-action { fill: var(--white-color); position: absolute; top: 0; opacity: 0; z-index: 50; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; } .post.format-image .post-action:hover { fill: var(--primary-accent-color); } .post.format-image .post-action .crumina-icon { -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; } .post.format-image .link-image { left: 40%; } .post.format-image .link-post { right: 40%; } .post.format-image .overlay { opacity: 0; } .post.format-image:hover .overlay { opacity: 1; } .post.format-image:hover .post-action .crumina-icon { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .post.format-image:hover .link-image { opacity: 1; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .post.format-image:hover .link-post { opacity: 1; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } /*------------- #POST FORMAT LINK --------------*/ .post.format-link .post-link-content { position: relative; display: block; z-index: 12; padding: 80px; } .post.format-link .link-title { color: var(--white-color); font-size: 24px; font-weight: 700; } .post.format-link .site-link { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; color: var(--heading-color); fill: #f3c418; } .bg-boxed-blue { background-image: url("../images/theme-content/post-link.png"); } /*------------- #POST Standard Details --------------*/ .post-standard-details { border-radius: 0; background-color: transparent; } .post-standard-details .post-content { padding: 0; } .post-standard-details:hover { -webkit-box-shadow: none; box-shadow: none; } .post-standard-details .post-additional-info { margin-bottom: 30px; border-top: none; } .post-standard-details ul:not([class]), .post-standard-details ol:not([class]) { margin: 35px 0; } .post-standard-details .post-details-updated { font-size: 14px; font-style: italic; } .post-details-author-info p { margin-bottom: 0; } .post-details-author-info .post-author-name { font-weight: 500; font-size: 20px; margin-bottom: 10px; text-decoration: none; } .post-details-content p { margin-bottom: 20px; } .post-details-content .tags-list { margin: 30px 0 20px 0; } /*------------- #POST Standard Details WIDE --------------*/ .post-standard-details--wide { text-align: center; } .post-standard-details--wide .post-additional-info { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; } .post-standard-details--wide .post-details-content { text-align: left; } .share-post { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .share-post > span { color: var(--heading-color); margin-right: 20px; } .share-post .socials .social-item { max-height: 20px; max-width: 20px; margin-right: 10px; } /*------------- #POST Standard Details Stunning --------------*/ .post-standard-details--with-stunning { padding: 40px 0; } .post-standard-details--with-stunning .post-additional-info { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; border-top: 0; margin-bottom: 0; padding-top: 10px; } .post-standard-details--with-stunning .post-additional-info .crumina-icon { fill: var(--heading-color); } .post-standard-details--with-stunning .post-additional-info .add-to-pocket { border-color: var(--heading-color); } .post-standard-details--with-stunning .post-additional-info .add-to-pocket:hover { border-color: var(--primary-accent-color); } .post-standard-details--with-stunning .post-additional-info .add-to-pocket:hover .crumina-icon { fill: var(--white-color); } /*------------- Post Navigation --------------*/ .post-pagination { margin: 100px 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .post-pagination .btn-nav { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .post-pagination .btn-nav:hover .crumina-icon { fill: var(--primary-accent-color); } .post-pagination .crumina-icon { fill: #949fac; } .post-pagination .btn-next-wrap { width: 45%; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; } .post-pagination .btn-next-wrap .btn-content { text-align: right; margin-right: 30px; } .post-pagination .btn-next-wrap:hover .crumina-icon { fill: currentColor; -webkit-transform: translateX(2px); -ms-transform: translateX(2px); transform: translateX(2px); } .post-pagination .btn-prev-wrap { width: 45%; } .post-pagination .btn-prev-wrap .btn-content { margin-left: 30px; } .post-pagination .btn-prev-wrap:hover .crumina-icon { fill: currentColor; -webkit-transform: translateX(-2px); -ms-transform: translateX(-2px); transform: translateX(-2px); } .post-pagination .btn-content-subtitle { font-size: 14px; color: var(--body-font-color); } .post-pagination .btn-content-title { margin-bottom: 5px; } /*------------- Responsive Mode --------------*/ @media (max-width: 1200px) { .post-additional-info-wrap > * { margin-right: 20px; font-size: 13px; } .post-additional-info > * { margin-right: 20px; } } @media (max-width: 992px) { .post.format-link .post-link-content { padding: 50px; } .post.format-quote .post-thumb { padding: 50px; } } @media (max-width: 768px) { .posts-wrapper > * { margin-bottom: 30px; } .post-pagination { margin: 30px 0; } .post.format-quote .text { font-size: 18px; } .post-pagination .btn-content-subtitle { display: none; } .post-pagination .btn-content-title { margin-bottom: 0; } .post-pagination .btn-next-wrap .btn-content { margin-right: 10px; } .post-pagination .btn-prev-wrap .btn-content { margin-left: 10px; } .post-category { font-size: 10px; padding: 4px 8px; } .post-details-author-info { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .post-details-author-info .author-text { text-align: center; } .post-content { padding: 20px; } .post-details-author-info .author-avatar { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; width: 65px; height: 65px; min-width: 65px; min-height: 65px; margin-right: 0; margin-bottom: 20px; } .post-additional-info--full { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .post-additional-info--full > * { margin-right: 0; } .post-additional-info--full .post-additional-info-wrap { margin-top: 30px; width: 100%; -webkit-box-ordinal-group: 4; -webkit-order: 3; -ms-flex-order: 3; order: 3; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; } } @media (max-width: 420px) { .post-additional-info-wrap > * { font-size: 12px; } .post-additional-info--full .post-additional-info-wrap > * { font-size: 13px; } } @media (max-width: 340px) { .post-additional-info-wrap > * { font-size: 10px; } } /*------------- #NAVIGATION --------------*/ .page-navigation { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .page-numbers { position: relative; display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin: 0 12px 0 0; width: 60px; height: 60px; min-width: 60px; min-height: 60px; line-height: 60px; text-align: center; border: 3px solid var(--grey-themes); text-transform: uppercase; color: var(--heading-color); font-size: 16px; border-radius: 100%; background-color: var(--grey-themes); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } @media (max-width: 640px) { .page-numbers { width: 40px; height: 40px; min-width: 40px; min-height: 40px; line-height: 40px; font-size: 14px; margin: 0 8px 0 0; } } @media (max-width: 460px) { .page-numbers { width: 25px; height: 25px; min-width: 25px; min-height: 25px; line-height: 22px; font-size: 12px; margin: 0 8px 0 0; } } .page-numbers.current { background-color: transparent; color: var(--primary-accent-color); border-color: var(--primary-accent-color); } .page-numbers.loading { border: 2px solid; } .page-numbers.btn--next, .page-numbers.btn--prev { width: auto; height: auto; border: none; background-color: transparent; } .page-numbers.btn--next.loading, .page-numbers.btn--prev.loading { border: none; } .btn--prev, .btn--next { fill: var(--grey-themes); } .btn--prev:hover, .btn--next:hover { fill: var(--primary-accent-color); } .btn--prev { margin-right: 70px; } .btn--prev:hover { -webkit-transform: translateX(-2px); -ms-transform: translateX(-2px); transform: translateX(-2px); } .btn--next { margin-left: 70px; } .btn--next:hover { -webkit-transform: translateX(2px); -ms-transform: translateX(2px); transform: translateX(2px); } /*================= Responsive Mode ============*/ @media (max-width: 768px) { .btn--next { margin-left: 20px; } .btn--prev { margin-right: 20px; } } /*------------- #USER MENU --------------*/ .user-menu { position: absolute; right: 6%; bottom: -35px; width: 70px; height: 70px; border: 6px solid var(--white-color); border-radius: 50%; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); overflow: hidden; background-color: var(--white-color); display: inline-block; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .user-menu-content { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; border-radius: 50%; -khtml-border-radius: 50%; text-align: center; overflow: hidden; width: 58px; height: 58px; padding-left: 14px; background-color: var(--secondary-accent-color); } .user-menu-content span { display: block; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; border-radius: 10px; height: 2px; background: var(--white-color); margin: 2px 0; } .user-menu-content span:first-of-type { width: 25%; } .user-menu-content span:nth-child(2) { width: 50%; } .user-menu-content span:last-of-type { width: 40%; } .user-menu-content:hover span { width: 70%; } .right-menu { position: relative; right: 0; top: 0; max-width: 500px; height: 100%; z-index: 555; background-color: var(--white-color); margin-left: auto; margin-right: -1px; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .right-menu .ps { max-height: 100%; } .right-menu .user-menu-close { position: absolute; left: -36px; top: 83px; width: 70px; height: 70px; border: 6px solid var(--white-color); border-radius: 50%; z-index: 35; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); opacity: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; -webkit-transition-delay: .3s; -o-transition-delay: .3s; transition-delay: .3s; cursor: pointer; } @media (max-width: 768px) { .right-menu .user-menu-close { width: 50px; height: 50px; border-width: 2px; left: auto; right: 15px; top: 15px; } } .right-menu .user-menu-content { width: 58px; height: 58px; border-radius: 50%; position: relative; display: block; background-color: var(--secondary-accent-color); } @media (max-width: 768px) { .right-menu .user-menu-content { width: 44px; height: 44px; border-width: 2px; } } .right-menu .user-menu-content span { display: block; height: 3px; background: var(--white-color); border-radius: 10px; margin: auto; width: 50%; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; left: 25%; top: 46%; position: absolute; } .right-menu .user-menu-content span:first-of-type { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); } .right-menu .user-menu-content span:last-of-type { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); } .right-menu .widget { padding: 60px 60px 0; } .right-menu .widget:last-child { margin-top: 60px; padding-bottom: 90px; } .right-menu .widget.w-contacts { background-image: url("../images/stunning-header/pattern-bg-grey.jpg"); } .modal.right-menu-popup { padding-right: 0 !important; } .modal.right-menu-popup .modal-dialog { max-width: 100%; margin: auto; } .modal.right-menu-popup .modal-body { padding: 0; } .modal.right-menu-popup .modal-content { background-color: transparent; border: none; } .modal.right-menu-popup.show .user-menu-close { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; } /*------------- #RESPONSIVE --------------*/ @media (max-width: 992px) { .user-menu { right: 30%; } } @media (max-width: 768px) { .user-menu { bottom: -25px; width: 50px; height: 50px; border-width: 2px; } .user-menu-content { width: 44px; height: 44px; border-width: 2px; padding-left: 10px; } .right-menu .widget { padding: 30px 30px 0; } .right-menu .widget:last-child { margin-top: 30px; padding-bottom: 45px; } } @media (max-width: 570px) { .right-menu { max-width: 100%; } } /*------------- #POPUP SEARCH --------------*/ .popup-search-popup .modal-dialog { max-width: initial; margin: 1.75rem auto; } .popup-search-popup .modal-content { background-color: transparent; border: none; } .search-popup-form { position: relative; width: 100%; } .search-popup-form .search-popup-input { background-color: transparent; padding: 0 0 15px; border: none; border-bottom: 4px solid var(--body-font-color); color: #949fac; font-size: 24px; border-radius: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; /* Firefox 19+ */ /* Firefox 18- */ } .search-popup-form .search-popup-input::-webkit-input-placeholder { color: #949fac; opacity: 1; } .search-popup-form .search-popup-input::-moz-placeholder { color: #949fac; opacity: 1; } .search-popup-form .search-popup-input:-moz-placeholder { color: #949fac; opacity: 1; } .search-popup-form .search-popup-input:-ms-input-placeholder { color: #949fac; opacity: 1; } .search-popup-form .search-popup-input:hover { border-bottom-color: var(--white-color); color: var(--body-font-color); } .search-popup-form .search-popup-input:hover + .search-popup-close .crumina-icon { fill: var(--body-font-color); } .search-popup-form .search-popup-input:focus { border-bottom-color: var(--primary-accent-color); color: var(--white-color); -webkit-box-shadow: none; box-shadow: none; } .search-popup-form .search-popup-input:focus + .search-popup-close .crumina-icon { fill: var(--primary-accent-color); } .search-popup-close { width: 20px; height: 25px; position: absolute; display: block; right: 0; top: 5px; opacity: 1; } .search-popup-close .crumina-icon { fill: #626a76; } .search-popup-close:hover .crumina-icon { fill: var(--primary-accent-color); } .search-popup-enter { width: 35px; height: 35px; position: absolute; right: 50px; top: 5px; } .search-popup-enter .crumina-icon { fill: #626a76; } .search-popup-enter:hover .crumina-icon { fill: var(--primary-accent-color); } .close { cursor: pointer; } /*------------- #POPUP CART --------------*/ .popup-cart { width: 370px; padding: 0; border-radius: 5px; background-color: var(--white-color); border: none; -webkit-box-shadow: 0 10px 20px 0 rgba(144, 146, 136, 0.2); box-shadow: 0 10px 20px 0 rgba(144, 146, 136, 0.2); overflow: hidden; } .popup-cart .popup-cart-content { padding: 40px; } .popup-cart .subtitle { font-size: 16px; margin-bottom: 20px; color: var(--body-font-color); } .popup-cart .cart-popup-total { padding: 30px 40px 40px; background-color: var(--grey-themes); overflow: hidden; width: 100%; } .popup-cart .cart-popup-total .cart-total-text { margin-bottom: 30px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .popup-cart .cart-popup-total .cart-total-text .title { font-size: 16px; margin-bottom: 0; } .popup-cart .cart-popup-total .cart-total-text .total-price { color: var(--primary-accent-color); font-size: 18px; font-weight: 700; } .popup-cart .cart-popup-total .crumina-button { width: 50%; float: left; border-radius: 50px 0 0 50px; padding: .688rem 1rem; } .popup-cart .cart-popup-total .crumina-button:last-child { border-radius: 0 50px 50px 0; } .popup-cart .cart-popup-total .crumina-button + .btn { margin-left: 0; } .popup-cart .cart-popup-total .crumina-button:after { display: none; } .popup-cart.with-products .popup-cart-content { padding-bottom: 20px; } .cart-popup-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 20px 0; border-bottom: 1px solid var(--border-grey-color); } .cart-popup-item:last-child { border-bottom: none; } .cart-popup-item .cart-popup-item-thumb { margin-right: 30px; } .cart-popup-item .cart-popup-item-title { font-size: 18px; margin-bottom: 15px; } .cart-popup-item .price { font-size: 18px; font-weight: 700; } /*------------- SUBSCRIBE SECTION --------------*/ .subscribe-form { margin-top: 30px; } .subscribe-form input:active, .subscribe-form input:focus { border-color: var(--white-color); } .subscribe-title { margin-bottom: 5px; } /*------------- Responsive Mode --------------*/ @media (max-width: 1200px) { .subscribe-form { margin-bottom: 40px; } } @media (max-width: 768px) { .subscribe-form { margin-top: 15px; margin-bottom: 10px; } } /* =WordPress Core */ .align-center, .aligncenter { text-align: center; } .align-left { text-align: left; } .align-right { text-align: right; } img.aligncenter { display: block; margin: 20px auto; } .alignnone { margin: 5px 20px 20px 0; } .alignright { float: right; margin: 5px 0 20px 20px; } .alignleft { float: left; margin: 5px 40px 20px 0; } a img.alignright { float: right; margin: 5px 0 20px 20px; } a img.alignnone { margin: 5px 20px 20px 0; } a img.alignleft { float: left; margin: 5px 20px 20px 0; } a img.aligncenter { display: block; margin-left: auto; margin-right: auto; } .wp-caption { margin-bottom: 20px; } .wp-caption img { margin: 0 auto 15px; display: block; } .wp-caption .wp-caption-text { margin-bottom: 0; padding: 0 40px; } .wp-caption-text { font-size: 14px; font-style: italic; } .wp-caption.alignnone { margin: 5px 20px 35px 0; } .wp-caption.alignleft { margin: 5px 20px 35px 0; } .wp-caption.alignright { margin: 5px 0 35px 20px; } .wp-caption p.wp-caption-text { font-size: 14px; line-height: 17px; margin: 0; padding: 0 4px 5px; } .wp-block-separator { margin: 35px 0; } .wp-block-separator.is-style-default { border-bottom: 1px solid var(--border-grey-color); } .wp-block-separator.is-style-dots { background: 0 0; border: none; text-align: center; max-width: none; line-height: 1; height: auto; } .wp-block-separator.is-style-dots::before { content: "\00b7 \00b7 \00b7"; color: var(--heading-color); font-size: 20px; letter-spacing: 2em; padding-left: 2em; font-family: serif; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .wp-caption .wp-caption-text { padding: 5px 0; } .wp-block-separator { margin: 20px 0; } } /*------------- #TABLES --------------*/ table { border-collapse: collapse; border-spacing: 0; width: 100%; max-width: 100%; margin: 35px 0; border-radius: 3px; border: 1px solid var(--border-grey-color); } table thead { background-color: #f1f4f9; } table * { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } table > tbody > tr:last-child { border-bottom: none; } table > tbody > tr:hover { -webkit-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.1), inset 4px 0 0 0 rgba(100, 25, 255, 0.004); box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.1), inset 4px 0 0 0 rgba(100, 25, 255, 0.004); } table > tbody > tr:hover > td:first-child:before { opacity: 1; } table > thead > tr > th, table > tbody > tr > th, table > tfoot > tr > th, table > thead > tr > td, table > tbody > tr > td, table > tfoot > tr > td { padding: 13px 20px; line-height: 1.42857143; vertical-align: middle; border: 1px solid var(--border-grey-color); } table > tbody > tr > td:first-child { position: relative; } table > tbody > tr > td:first-child:before { content: ''; display: block; width: 3px; height: 100%; background-color: var(--primary-accent-color); position: absolute; left: 0; top: 0; opacity: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } table > thead > tr > th { vertical-align: middle; color: var(--heading-color); text-align: left; } table > tbody + tbody { border-top: 2px solid var(--border-grey-color); } table table { background-color: var(--white-color); } table col[class*="col-"] { position: static; display: table-column; float: none; } table td[class*="col-"], table th[class*="col-"] { position: static; display: table-cell; float: none; } table > thead > tr > td.active, table > tbody > tr > td.active, table > tfoot > tr > td.active, table > thead > tr > th.active, table > tbody > tr > th.active, table > tfoot > tr > th.active, table > thead > tr.active > td, table > tbody > tr.active > td, table > tfoot > tr.active > td, table > thead > tr.active > th, table > tbody > tr.active > th, table > tfoot > tr.active > th { background-color: #f5f5f5; } table > thead > tr > td.success, table > tbody > tr > td.success, table > tfoot > tr > td.success, table > thead > tr > th.success, table > tbody > tr > th.success, table > tfoot > tr > th.success, table > thead > tr.success > td, table > tbody > tr.success > td, table > tfoot > tr.success > td, table > thead > tr.success > th, table > tbody > tr.success > th, table > tfoot > tr.success > th { background-color: #dff0d8; } table > thead > tr > td.info, table > tbody > tr > td.info, table > tfoot > tr > td.info, table > thead > tr > th.info, table > tbody > tr > th.info, table > tfoot > tr > th.info, table > thead > tr.info > td, table > tbody > tr.info > td, table > tfoot > tr.info > td, table > thead > tr.info > th, table > tbody > tr.info > th, table > tfoot > tr.info > th { background-color: #d9edf7; } table > thead > tr > td.warning, table > tbody > tr > td.warning, table > tfoot > tr > td.warning, table > thead > tr > th.warning, table > tbody > tr > th.warning, table > tfoot > tr > th.warning, table > thead > tr.warning > td, table > tbody > tr.warning > td, table > tfoot > tr.warning > td, table > thead > tr.warning > th, table > tbody > tr.warning > th, table > tfoot > tr.warning > th { background-color: #fcf8e3; } table > thead > tr > td.danger, table > tbody > tr > td.danger, table > tfoot > tr > td.danger, table > thead > tr > th.danger, table > tbody > tr > th.danger, table > tfoot > tr > th.danger, table > thead > tr.danger > td, table > tbody > tr.danger > td, table > tfoot > tr.danger > td, table > thead > tr.danger > th, table > tbody > tr.danger > th, table > tfoot > tr.danger > th { background-color: #f2dede; } /*================= Responsive Mode ============*/ @media (max-width: 768px) { table > thead > tr > th, table > tbody > tr > th, table > tfoot > tr > th, table > thead > tr > td, table > tbody > tr > td, table > tfoot > tr > td { padding: 15px; } table { border-radius: 10px; margin: 20px 0; } } @media (max-width: 480px) { table > thead > tr > th, table > tbody > tr > th, table > tfoot > tr > th, table > thead > tr > td, table > tbody > tr > td, table > tfoot > tr > td { padding: 5px; } table { font-size: 10px; } } /*------------- #COMMENTS --------------*/ .comments { margin-top: 40px; } .comments .crumina-heading { margin-bottom: 40px; } .comments__author-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .comment-content p { margin-bottom: 30px; } .comment-content p:last-child { margin-bottom: 0; } .comment-content p a { text-decoration: underline; -webkit-text-decoration-color: var(--primary-accent-color); text-decoration-color: var(--primary-accent-color); } .comment-reply { margin-right: 30px; } .comment-reply .crumina-icon { fill: #a1aab6; } .comment-reply:hover .crumina-icon { fill: var(--primary-accent-color); } .comments__list { padding-left: 0; margin-bottom: 0; list-style: none; } .comments__list .crumina-heading { margin-bottom: 60px; } .comments__list .comments__avatar { margin-right: 30px; min-width: 70px; min-height: 70px; width: 70px; height: 70px; background-color: var(--grey-themes); border-radius: 100%; } .comments__list .comments__body { margin-bottom: 20px; } .comments__list .comments__author { font-style: normal; margin-bottom: 5px; display: block; } .comments__list .comments__header { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .comments__list .comments__time a:hover { color: var(--primary-accent-color); } .comments__item { padding-left: 0; list-style: none; } .comments__item .children { list-style: none; padding-left: 0; } .comments__item .children .comments__article { padding-left: 50px; } .comments__item .children .children .comments__article { padding-left: 100px; } .comments__item:last-child { margin-bottom: 0; } .comments__article { padding: 30px 0; border-bottom: 1px solid #d9dfe7; } .comments__time { font-size: 14px; color: #949fac; } .comments__time a { color: var(--body-font-color); } .comments__time a:hover { color: var(--primary-accent-color); } .leave-reply { padding: 100px; } /*================= Responsive Mode ============*/ @media (max-width: 992px) { .leave-reply { padding: 20px; } .comments__item .children .comments__article { padding-left: 30px; } .comments__item .children .children .comments__article { padding-left: 60px; } } /*------------- #MASONRY --------------*/ .grid { display: block; } .grid > .grid-item { -webkit-box-flex: unset; -webkit-flex: unset; -ms-flex: unset; flex: unset; max-width: unset; display: block; margin-bottom: 30px; } .row-masonry > * { margin-bottom: 30px; } .row-masonry--col-2 .grid-sizer, .row-masonry--col-2 .grid-item { width: 50%; } .row-masonry--col-3 .grid-item { width: 33.333%; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .row-masonry--col-2 .grid-sizer, .row-masonry--col-2 .grid-item { width: 100%; } .row-masonry--col-3 .grid-item { width: 100%; } } /*------------- #SHOP --------------*/ .sorting-products-wrap { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 60px; } .sorting-products-wrap .sorting-products-text { font-size: 16px; color: var(--heading-color); margin-right: 30px; } .onsale { line-height: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin: 0; position: absolute; top: -20px; right: -20px; min-width: 70px; min-height: 70px; font-size: 14px; font-weight: 700; border-radius: 100%; color: var(--white-color); background-color: var(--red-themes); } .crumina-product-item { padding: 60px; text-align: center; margin-bottom: 30px; background-color: var(--grey-themes); } .crumina-product-item .product-item-content { position: relative; } .crumina-product-item .product-item-thumb { margin-bottom: 40px; } .crumina-product-item .product-category { margin-bottom: 15px; } .crumina-product-item .product-category a { font-size: 16px; color: var(--body-font-color); } .crumina-product-item .product-category a:hover { color: var(--primary-accent-color); } .price { margin-bottom: 20px; font-size: 18px; font-weight: 700; color: var(--green-themes); } .price ins { text-decoration: none; } .price del { -webkit-text-decoration-color: #949fac; text-decoration-color: #949fac; } .price del span { font-size: 16px; font-weight: 400; color: #949fac; } /*------------- #PRODUCT DETAILS --------------*/ .product-details-gallery-item { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; position: relative; } .product-details-gallery-item .onsale { top: 40px; right: auto; left: -40px; } .product-details-content .price { margin-right: 30px; margin-bottom: 0; } .product-details-content .reviews-link { font-size: 14px; } .product-details-content .product-description { margin-bottom: 30px; } .product-details-content .sorting-products-wrap { margin-bottom: 30px; } .product-details-content .quantity-btn-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 30px; } .product-details-content .quantity-btn-wrap .quantity { margin-right: 30px; } .product-details-content .product-details-add-info { padding-left: 0; list-style: none; } .product-details-content .product-details-add-info .add-info-item { margin-bottom: 15px; } .product-details-content .product-details-add-info .add-info-item a { display: inline-block; } .product-details-content .product-details-add-info .add-info-item:last-child { margin-bottom: 0; } .price-review-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 20px; } .price-review-wrap .rait-stars { margin-right: 10px; } .woocommerce table.shop_attributes, .woocommerce table.shop_attributes th, .woocommerce table.shop_attributes td { border: none; } .woocommerce table.shop_attributes tbody tr { border-bottom: 1px solid #d6d7d3; } .woocommerce table.shop_attributes tbody tr:last-child { border-bottom: none; } .woocommerce table.shop_attributes th { color: var(--dark-themes); } .woocommerce table.shop_attributes td { font-style: normal; } .woocommerce table.shop_attributes tr:nth-child(2n) td, .woocommerce table.shop_attributes tr:nth-child(2n) th { background: transparent; } .woocommerce table.shop_attributes td { padding: 8px; } /*------------- Responsive Mode --------------*/ @media (max-width: 991px) { .crumina-product-item { padding: 30px; } .product-item-thumb img { max-width: 200px; } } @media (max-width: 768px) { .product-details-content .product-description { margin-bottom: 10px; } .product-details-gallery-item .onsale { left: -20px; } .onsale { min-width: 40px; min-height: 40px; } } @media (max-width: 470px) { .sorting-products-wrap { font-size: 10px; } } /*------------- #PRODUCT REVIEWS --------------*/ .product-review-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; padding: 30px 0; border-bottom: 1px solid #d6d7d3; } .product-review-item:first-child { padding-top: 0; } .product-review-item .author-avatar { width: 70px; height: 70px; min-width: 70px; min-height: 70px; margin-right: 30px; border-radius: 100%; background-color: var(--grey-themes); } .product-review-item .rait-stars { margin-bottom: 20px; } .product-review-item .review-author-name { color: var(--heading-color); margin-right: 20px; } .product-review-item .review-author-name:hover { color: var(--primary-accent-color); } .product-review-item .author-time-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 15px; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .product-review-item { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding: 20px 0; } .product-review-item .author-avatar { margin-right: 0; margin-bottom: 20px; } } /*------------- #RAIT-STARS --------------*/ .rait-stars { padding-left: 0; list-style: none; margin-bottom: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .rait-stars li { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; margin-right: 2px; } .rait-stars li:last-child { margin-right: 0; } .rait-stars .crumina-icon { fill: transparent; stroke: #9ea8b4; } .rait-stars .crumina-icon.star-active { fill: var(--yellow-themes); stroke: transparent; } .rait-stars--reviews li { margin-right: 5px; } .rait-stars--reviews li:last-child { margin-right: 0; } .rait-stars--reviews:hover .crumina-icon { fill: var(--heading-color); stroke: var(--heading-color); } .rait-stars--reviews a:hover .crumina-icon { fill: var(--primary-accent-color); stroke: var(--primary-accent-color); } .rait-stars--reviews li:hover ~ li a .crumina-icon { fill: transparent; stroke: #949fac; } /*------------- #CART MAIN --------------*/ .cart-main table { border-radius: 5px; overflow: hidden; margin: 0; } .cart-main table, .cart-main table > thead > tr > th, .cart-main table > tbody > tr > th, .cart-main table > tfoot > tr > th, .cart-main table > thead > tr > td, .cart-main table > tbody > tr > td, .cart-main table > tfoot > tr > td { border: none; } .cart-main table thead { background-color: var(--dark-themes); } .cart-main table > thead > tr > th { color: var(--white-color); font-size: 14px; padding: 15px 30px; } .cart-main table > tfoot > tr > td, .cart-main table > tfoot > tr > th, .cart-main table > tbody > tr > td { padding: 30px; } .cart-main table > tbody > tr { background-color: var(--white-color); border-bottom: 1px solid #d9dfe7; } .cart-main table > tbody > tr .product-total { color: var(--red-themes); } .cart-main .actions { background-color: #e8e9e1; border-bottom: 0; } .cart-main .actions td { text-align: right; } .cart-main .product-total { text-align: right; font-weight: 700; font-size: 20px; } .cart-main .product-thumbnail { font-size: 20px; color: var(--heading-color); } .cart-main .cart-subtotal td, .cart-main .cart-subtotal th { background-color: var(--grey-themes); font-weight: 700; color: var(--heading-color); } .cart-main .cart-subtotal td { text-align: right; } .cart-main .order-total td, .cart-main .order-total th { background-color: var(--primary-accent-color); font-weight: 700; color: var(--white-color); } .cart-main .order-total td { text-align: right; } .cart-main-item .product-thumb { max-width: 90px; } .cart-main-item .cart-product-title { font-size: 20px; margin-bottom: 0; } .cart-main-item .price { font-size: 20px; color: var(--heading-color); margin-bottom: 0; } .cart-main-item .product-remove a { width: 30px; height: 30px; border-radius: 100%; line-height: 26px; text-align: center; font-size: 30px; color: var(--red-themes); } .cart-main-item .product-remove:hover ~ td { opacity: .3; } .cart-main-item:hover .product-remove a { color: var(--white-color); background-color: var(--red-themes); } .cart-price-total { margin-top: 60px; } .cart-price-total table, .cart-price-total table > thead > tr > th, .cart-price-total table > tbody > tr > th, .cart-price-total table > tfoot > tr > th, .cart-price-total table > thead > tr > td, .cart-price-total table > tbody > tr > td, .cart-price-total table > tfoot > tr > td { border: none; } .cart-price-total .cart-subtotal { border-bottom: 1px solid #d9dfe7; } .cart-price-total table > tbody > tr > th { padding: 10px 0; color: var(--heading-color); } .cart-price-total .subtotal { text-align: right; color: var(--heading-color); font-weight: 700; } .cart-price-total .order-total .subtotal { text-align: right; color: var(--red-themes); } .cart-price-total table > tbody > tr:hover { -webkit-box-shadow: none; box-shadow: none; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .cart-main table > thead > tr > th { padding: 10px; font-size: 12px; } .cart-main table > tfoot > tr > td, .cart-main table > tfoot > tr > th, .cart-main table > tbody > tr > td { padding: 10px; } .cart-main .product-total { font-size: 12px; } .cart-main .product-thumbnail { font-size: 12px; } .cart-main--products table > tbody > tr { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; width: 100%; } .cart-main--products table thead { display: none; } } /*------------- #CHECKOUT --------------*/ .checkout-dropdown { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; border-bottom: 1px solid #d9dfe7; } .checkout-dropdown-item { margin-bottom: 40px; } .checkout-dropdown-item .helped, .checkout-dropdown-item .showlogin { font-weight: 400; text-decoration: underline; -webkit-text-decoration-color: var(--primary-accent-color); text-decoration-color: var(--primary-accent-color); } .woocommerce-checkout-payment { padding: 60px 30px; background-color: var(--grey-themes); } .payment_methods { padding-left: 0; list-style: none; margin-bottom: 60px; } .payment_methods .crumina-radio label { font-size: 24px; color: var(--heading-color); } .payment_methods .crumina-radio label span { top: 5px; } .payment_methods .crumina-radio label { padding-left: 40px; } .payment_methods li { margin-bottom: 30px; } .payment_methods li:last-child { margin-bottom: 0; } .payment_methods .pay-pal { font-size: 16px; text-decoration: underline; -webkit-text-decoration-color: var(--primary-accent-color); text-decoration-color: var(--primary-accent-color); margin-left: 20px; display: inline-block; } .checkout-proceed { padding-top: 60px; border-top: 1px solid #d9dfe7; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .payment_methods .crumina-radio label { font-size: 18px; } .payment_methods li { margin-bottom: 15px; } .woocommerce-checkout-payment { padding: 20px 15px; } .payment_methods { margin-bottom: 20px; } .checkout-proceed { padding-top: 20px; } } /*------------- #BLOCKS --------------*/ /*------------- #LISTS --------------*/ ul a { display: block; } ul:not([class]) { padding-left: 40px; } ul:not([class]) li, ol:not([class]) li { margin-bottom: 15px; font-size: 16px; } ul:not([class]) li:last-child, ol:not([class]) li:last-child { margin-bottom: 0; } ul:not([class]) ul, ol:not([class]) ul { padding: 0; padding-left: 40px; margin: 20px 0 15px; list-style: inherit; } ul:not([class]) ul li, ol:not([class]) ul li { margin-bottom: 0; } ol ol li { padding-left: 40px; } ul ul, ol ul, ul ol { margin: 10px 0; padding-left: 0; } ol ol ol li { padding-left: 55px; } ul ol li { padding-left: 40px; } /*------------- List Standard --------------*/ .list--standard { list-style: none; padding-left: 20px; } .list--standard li { list-style: none; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; margin-bottom: 15px; font-size: 16px; } .list--standard li:last-child { margin-bottom: 0; } .list--standard li .crumina-icon { position: relative; top: 6px; margin-right: 20px; min-width: 12px; } /*------------- Responsive Mode --------------*/ @media (max-width: 640px) { ul li { font-size: 13px; } ol li { font-size: 13px; padding-left: 20px; } ol ol li { padding-left: 30px; } ol ol ol li { padding-left: 40px; } } /*------------- HEADING --------------*/ .crumina-heading { position: relative; } .crumina-heading .title-text-wrap { position: relative; z-index: 5; } .crumina-heading .title-text-wrap > * { display: inline-block; vertical-align: middle; margin-top: 0; margin-bottom: 0; } .crumina-heading:hover .heading-decoration:before { -webkit-animation: movebg 50s linear infinite; animation: movebg 50s linear infinite; } @-webkit-keyframes movebg { from { background-position: 0 0; } to { background-position: 4000px 0; } } @keyframes movebg { from { background-position: 0 0; } to { background-position: 4000px 0; } } .crumina-heading > *:last-child { margin-bottom: 0; } .crumina-heading > *:first-child { margin-top: 0; } .heading-decoration { position: relative; margin-top: 20px; width: 170px; height: 2px; max-width: 100%; display: inline-block; } .heading-decoration:before { content: ''; display: block; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-image: url("../images/heading/heading-decoration-bg.png"); background-repeat: repeat; } .heading-text { margin-top: 15px; font-size: 18px; color: var(--heading-color); } .read-more { color: var(--heading-color); padding: 0 0 0 30px; border-left: 1px solid #949fac; margin: 0 0 0 30px; display: inline-block; vertical-align: middle; letter-spacing: 0; } .read-more .crumina-icon { margin-left: 10px; fill: var(--primary-accent-color); } .heading--white { color: var(--white-color); } .heading--white .heading-title { color: inherit; } .heading--white .heading-text { color: inherit; } /*-------------------- MEDIA QUERIES --------------------*/ @media (max-width: 980px) { .heading-text { font-size: 20px; } } @media (max-width: 570px) { .heading-text { font-size: 16px; } .read-more { padding-left: 0; margin-left: 0; border: none; float: none; } } /*------------- #BUTTONS --------------*/ .crumina-button { position: relative; cursor: pointer; text-decoration: none; display: inline-block; border-radius: 50px; padding: 5px 10px; font-size: 14px; text-align: center; line-height: 1; font-weight: 700; color: var(--white-color); outline: none; border: 2px solid; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .crumina-button:after { content: ''; display: block; border-radius: 50px; position: absolute; top: -2px; left: -2px; width: calc(100% + 4px); height: calc(100% + 4px); -webkit-box-shadow: inset 0px -4px 0px 0px rgba(0, 0, 0, 0.2); box-shadow: inset 0px -4px 0px 0px rgba(0, 0, 0, 0.2); opacity: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .crumina-button + .btn { margin-left: 30px; } .crumina-button:hover { outline: none; text-decoration: none; } .crumina-button:hover:after { opacity: 1; } .crumina-button:focus { outline: none; } .crumina-button:active { outline: none; } .crumina-button:active:after { -webkit-box-shadow: inset 0 4px 0 0 rgba(0, 0, 0, 0.2); box-shadow: inset 0 4px 0 0 rgba(0, 0, 0, 0.2); } .crumina-button:disabled { background-color: var(--grey-themes) !important; color: var(--grey-themes) !important; border-color: var(--grey-themes) !important; cursor: not-allowed; } button { cursor: pointer; background-color: transparent; border: none; -webkit-box-shadow: none; box-shadow: none; padding: 0; } .button--xs { padding: .375rem 1rem; } .button--s { padding: .688rem 1.5rem; } .button--m { padding: 1rem 2rem; } .button--l { padding: 1.25rem 2.5rem; } .button--with-icon { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .button--with-icon .crumina-icon, .button--with-icon i { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; position: relative; } .button--icon-left .crumina-icon, .button--icon-left i { margin-right: 10px; } .button--icon-right .crumina-icon, .button--icon-right i { margin-left: 10px; } .load-more-button { border: 3px solid #d9dfe7; color: #949fac; margin-top: 60px; } .universal-btn-wrapper { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: -20px; } .universal-btn-wrapper > * { margin-right: 20px; margin-bottom: 20px; } .universal-btn-wrapper > *:last-child { margin-right: 0; } /*------------- #Color-scheme for buttons --------------*/ .button--primary { background-color: var(--primary-accent-color); border-color: var(--primary-accent-color); color: var(--white-color); } .button--primary:hover { color: var(--white-color); } .button--primary .crumina-icon, .button--primary i { color: var(--white-color); fill: var(--white-color); } .button--primary.button--bordered { color: var(--primary-accent-color); } .button--primary.button--bordered .crumina-icon, .button--primary.button--bordered i { color: var(--primary-accent-color); fill: var(--primary-accent-color); } .button--primary.button--bordered:hover { color: var(--white-color); border-color: var(--primary-accent-color); background-color: var(--primary-accent-color); } .button--primary.button--bordered:hover .crumina-icon, .button--primary.button--bordered:hover i { color: var(--white-color); fill: var(--white-color); } .button--secondary { background-color: var(--secondary-accent-color); border-color: var(--secondary-accent-color); color: var(--white-color); } .button--secondary:hover { color: var(--white-color); } .button--secondary .crumina-icon, .button--secondary i { color: var(--white-color); fill: var(--white-color); } .button--secondary.button--bordered { color: var(--secondary-accent-color); } .button--secondary.button--bordered .crumina-icon, .button--secondary.button--bordered i { color: var(--secondary-accent-color); fill: var(--secondary-accent-color); } .button--secondary.button--bordered:hover { color: var(--white-color); border-color: var(--secondary-accent-color); background-color: var(--secondary-accent-color); } .button--secondary.button--bordered:hover .crumina-icon, .button--secondary.button--bordered:hover i { color: var(--white-color); fill: var(--white-color); } .button--dark { background-color: var(--dark-themes); border-color: var(--dark-themes); color: var(--white-color); } .button--dark:hover { color: var(--white-color); } .button--dark .crumina-icon, .button--dark i { color: var(--white-color); fill: var(--white-color); } .button--dark.button--bordered { color: var(--dark-themes); } .button--dark.button--bordered .crumina-icon, .button--dark.button--bordered i { color: var(--dark-themes); fill: var(--dark-themes); } .button--dark.button--bordered:hover { color: var(--white-color); border-color: var(--dark-themes); background-color: var(--dark-themes); } .button--dark.button--bordered:hover .crumina-icon, .button--dark.button--bordered:hover i { color: var(--white-color); fill: var(--white-color); } .button--red { background-color: var(--red-themes); border-color: var(--red-themes); color: var(--white-color); } .button--red:hover { color: var(--white-color); } .button--red .crumina-icon, .button--red i { color: var(--white-color); fill: var(--white-color); } .button--red.button--bordered { color: var(--red-themes); } .button--red.button--bordered .crumina-icon, .button--red.button--bordered i { color: var(--red-themes); fill: var(--red-themes); } .button--red.button--bordered:hover { color: var(--white-color); border-color: var(--red-themes); background-color: var(--red-themes); } .button--red.button--bordered:hover .crumina-icon, .button--red.button--bordered:hover i { color: var(--white-color); fill: var(--white-color); } .button--yellow { background-color: var(--yellow-themes); border-color: var(--yellow-themes); color: var(--white-color); } .button--yellow:hover { color: var(--white-color); } .button--yellow .crumina-icon, .button--yellow i { color: var(--white-color); fill: var(--white-color); } .button--yellow.button--bordered { color: var(--yellow-themes); } .button--yellow.button--bordered .crumina-icon, .button--yellow.button--bordered i { color: var(--yellow-themes); fill: var(--yellow-themes); } .button--yellow.button--bordered:hover { color: var(--white-color); border-color: var(--yellow-themes); background-color: var(--yellow-themes); } .button--yellow.button--bordered:hover .crumina-icon, .button--yellow.button--bordered:hover i { color: var(--white-color); fill: var(--white-color); } .button--green { background-color: var(--green-themes); border-color: var(--green-themes); color: var(--white-color); } .button--green:hover { color: var(--white-color); } .button--green .crumina-icon, .button--green i { color: var(--white-color); fill: var(--white-color); } .button--green.button--bordered { color: var(--green-themes); } .button--green.button--bordered .crumina-icon, .button--green.button--bordered i { color: var(--green-themes); fill: var(--green-themes); } .button--green.button--bordered:hover { color: var(--white-color); border-color: var(--green-themes); background-color: var(--green-themes); } .button--green.button--bordered:hover .crumina-icon, .button--green.button--bordered:hover i { color: var(--white-color); fill: var(--white-color); } .button--grey { background-color: var(--grey-themes); border-color: var(--grey-themes); color: var(--body-font-color); } .button--grey:hover { color: var(--body-font-color); } .button--grey .crumina-icon, .button--grey i { color: var(--body-font-color); fill: var(--body-font-color); } .button--grey.button--bordered { color: var(--body-font-color); } .button--grey.button--bordered .crumina-icon, .button--grey.button--bordered i { color: var(--body-font-color); fill: var(--body-font-color); } .button--grey.button--bordered:hover { color: var(--body-font-color); border-color: var(--grey-themes); background-color: var(--grey-themes); } .button--grey.button--bordered:hover .crumina-icon, .button--grey.button--bordered:hover i { color: var(--body-font-color); fill: var(--body-font-color); } .button--brown { background-color: var(--brown-themes); border-color: var(--brown-themes); color: var(--white-color); } .button--brown:hover { color: var(--white-color); } .button--brown .crumina-icon, .button--brown i { color: var(--white-color); fill: var(--white-color); } .button--brown.button--bordered { color: var(--brown-themes); } .button--brown.button--bordered .crumina-icon, .button--brown.button--bordered i { color: var(--brown-themes); fill: var(--brown-themes); } .button--brown.button--bordered:hover { color: var(--white-color); border-color: var(--brown-themes); background-color: var(--brown-themes); } .button--brown.button--bordered:hover .crumina-icon, .button--brown.button--bordered:hover i { color: var(--white-color); fill: var(--white-color); } .button--pink { background-color: var(--pink-themes); border-color: var(--pink-themes); color: var(--white-color); } .button--pink:hover { color: var(--white-color); } .button--pink .crumina-icon, .button--pink i { color: var(--white-color); fill: var(--white-color); } .button--pink.button--bordered { color: var(--pink-themes); } .button--pink.button--bordered .crumina-icon, .button--pink.button--bordered i { color: var(--pink-themes); fill: var(--pink-themes); } .button--pink.button--bordered:hover { color: var(--white-color); border-color: var(--pink-themes); background-color: var(--pink-themes); } .button--pink.button--bordered:hover .crumina-icon, .button--pink.button--bordered:hover i { color: var(--white-color); fill: var(--white-color); } .button--blue { background-color: var(--blue-themes); border-color: var(--blue-themes); color: var(--white-color); } .button--blue:hover { color: var(--white-color); } .button--blue .crumina-icon, .button--blue i { color: var(--white-color); fill: var(--white-color); } .button--blue.button--bordered { color: var(--blue-themes); } .button--blue.button--bordered .crumina-icon, .button--blue.button--bordered i { color: var(--blue-themes); fill: var(--blue-themes); } .button--blue.button--bordered:hover { color: var(--white-color); border-color: var(--blue-themes); background-color: var(--blue-themes); } .button--blue.button--bordered:hover .crumina-icon, .button--blue.button--bordered:hover i { color: var(--white-color); fill: var(--white-color); } .button--white { background-color: var(--white-color); border-color: var(--white-color); color: var(--dark-themes); } .button--white:hover { color: var(--dark-themes); } .button--white .crumina-icon, .button--white i { color: var(--dark-themes); fill: var(--dark-themes); } .button--white.button--bordered { color: var(--white-color); } .button--white.button--bordered .crumina-icon, .button--white.button--bordered i { color: var(--white-color); fill: var(--white-color); } .button--white.button--bordered:hover { color: var(--dark-themes); border-color: var(--white-color); background-color: var(--white-color); } .button--white.button--bordered:hover .crumina-icon, .button--white.button--bordered:hover i { color: var(--dark-themes); fill: var(--dark-themes); } .button--bordered { background-color: transparent; } /*------------- #Button back-to-top --------------*/ .back-to-top { position: fixed; z-index: 999; width: 50px; height: 50px; display: block; fill: #20282f; stroke: inherit; bottom: 50px; right: 50px; opacity: 0.5; cursor: pointer; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .back-to-top .crumina-icon { width: 50px; height: 50px; } .back-to-top:hover { opacity: 1; fill: var(--primary-accent-color); } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .button--s { font-size: 12px; padding: .2rem 1rem; } .button--m { font-size: 12px; padding: .5rem 1.4rem; } .button--l { font-size: 12px; padding: .6rem 1.5rem; } .button--icon-left .crumina-icon, .button--icon-left i { margin-right: 7px; } .button--icon-right .crumina-icon, .button--icon-right i { margin-left: 7px; } } /*------------- #NAVIGATION-SHOP-CART --------------*/ .navigation-shop-cart { position: relative; cursor: pointer; } .navigation-shop-cart:hover .crumina-icon { fill: var(--primary-accent-color); } .cart-count { display: block; position: absolute; left: -6px; top: 4px; min-width: 16px; min-height: 16px; line-height: 14px; font-size: 10px; color: var(--white-color); background-color: var(--primary-accent-color); text-align: center; border: 1px solid transparent; border-radius: 50%; padding: 0 2px; } .navigation-shop-cart-wrapper { position: relative; } .shop-link-responsive { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 9999; display: none; } /*-------------------- MEDIA QUERIES --------------------*/ @media (max-width: 992px) { .shop-link-responsive { display: block; } } /*------------- #NAVIGATION-SEARCH-POPUP --------------*/ .navigation-search { cursor: pointer; position: relative; } .navigation-search:hover .crumina-icon { fill: var(--primary-accent-color); } /*------------- #STYLES for checkboxes --------------*/ .crumina-checkbox { display: block; position: relative; padding-left: 30px; cursor: pointer; font-size: 16px; margin-bottom: 0; } .crumina-checkbox input { position: absolute; z-index: -1; opacity: 0; } .control__indicator { position: absolute; top: 2px; left: 0; height: 20px; width: 20px; background: var(--primary-accent-color); border-radius: 3px; } .control--radio .control__indicator { border-radius: 50%; } .control:hover input ~ .control__indicator, .crumina-checkbox input:focus ~ .control__indicator { background: var(--primary-accent-color); } .crumina-checkbox input:checked ~ .control__indicator { background: var(--primary-accent-color); } .control:hover input:not([disabled]):checked ~ .control__indicator, .crumina-checkbox input:checked:focus ~ .control__indicator { background: var(--primary-accent-color); } .crumina-checkbox input:disabled ~ .control__indicator { background: #d9dfe7; opacity: 0.6; pointer-events: none; } .control__indicator:after { content: ''; position: absolute; display: none; } .crumina-checkbox input:checked ~ .control__indicator:after { display: block; } .control--checkbox .control__indicator:after { left: 8px; top: 4px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .control--checkbox input:disabled ~ .control__indicator:after { border-color: #c5ccd5; } .control--radio .control__indicator:after { left: 7px; top: 7px; height: 6px; width: 6px; border-radius: 50%; background: #fff; } .control--radio input:disabled ~ .control__indicator:after { background: #c5ccd5; } /*------------- #STYLES for RADIO buttons --------------*/ .crumina-radio label { cursor: pointer; padding-left: 30px; margin: 0; position: relative; color: var(--body-font-color); font-size: 16px; } .crumina-radio label span { display: block; position: absolute; left: 0; top: 0; -webkit-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; margin-left: 0; } .crumina-radio label .circle { border: 2px solid var(--primary-accent-color); background-color: var(--primary-accent-color); height: 18px; width: 18px; border-radius: 100%; } .crumina-radio label .check { height: 18px; width: 18px; border-radius: 100%; -webkit-transform: scale3d(0, 0, 0); -ms-transform: scale3d(0, 0, 0); transform: scale3d(0, 0, 0); } .crumina-radio label .check:after { display: block; position: absolute; content: ""; background-color: rgba(0, 0, 0, 0.87); left: -18px; top: -18px; height: 50px; width: 50px; border-radius: 100%; z-index: 1; opacity: 0; margin: 0; -webkit-transform: scale3d(1.5, 1.5, 1); -ms-transform: scale3d(1.5, 1.5, 1); transform: scale3d(1.5, 1.5, 1); } .crumina-radio input[type=radio] { opacity: 0; height: 0; width: 0; overflow: hidden; display: none; } .crumina-radio input[type=radio]:checked ~ .check, .crumina-radio input[type=radio]:checked ~ .circle { opacity: 1; border-color: var(--border-grey-color); } .crumina-radio input[type=radio]:checked ~ .check { background-color: var(--white-color); } .crumina-radio input[type=radio]:checked ~ .circle { border-color: var(--primary-accent-color); background-color: var(--primary-accent-color); } .crumina-radio input[type=radio]:checked:disabled ~ .check { background-color: #c5ccd5; border-color: #d9dfe7; } .crumina-radio input[type=radio]:checked:disabled ~ .circle { background-color: #d9dfe7; } .crumina-radio input[type=radio]:checked ~ .check { -webkit-transform: scale3d(0.45, 0.45, 1); -ms-transform: scale3d(0.45, 0.45, 1); transform: scale3d(0.45, 0.45, 1); } .crumina-radio input[type=radio][disabled] ~ .check { background-color: transparent; } .crumina-radio input[type=radio][disabled] ~ .circle { background-color: #d9dfe7; border-color: #d9dfe7; } @-webkit-keyframes rippleOn { 0% { opacity: 0; } 50% { opacity: 0.2; } 100% { opacity: 0; } } @keyframes rippleOn { 0% { opacity: 0; } 50% { opacity: 0.2; } 100% { opacity: 0; } } @-webkit-keyframes rippleOff { 0% { opacity: 0; } 50% { opacity: 0.2; } 100% { opacity: 0; } } @keyframes rippleOff { 0% { opacity: 0; } 50% { opacity: 0.2; } 100% { opacity: 0; } } /*------------- #SOCIALS --------------*/ .socials .social-item { margin-right: 20px; width: 36px; } .socials .social-item:last-child { margin-right: 0; } .socials .social-item:hover { opacity: .7; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .socials .social-item { width: 20px; margin-right: 15px; } } /*------------- #CONTACTS --------------*/ .contacts { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .footer .contacts { padding: 40px 0; border-top: 2px solid var(--border-dark-color); } .contacts-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .contacts-item .crumina-icon { margin-right: 30px; width: 70px; height: 70px; min-width: 70px; min-height: 70px; } .contacts-item .title { font-weight: 500; font-size: 19px; color: var(--heading-color); } .contacts-item .title.c-white { color: var(--white-color); } .contacts-item a.title:hover { color: var(--primary-accent-color); } .contacts-item .sub-title { font-weight: 500; font-size: 16px; } /*------------- Responsive Mode --------------*/ @media (max-width: 991px) { .contacts-item { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; text-align: center; } .contacts-item .crumina-icon { margin-right: 0; } } @media (max-width: 768px) { .contacts-item { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; margin-left: :-20px; -ms-flex-direction: row; flex-direction: row; text-align: left; margin-bottom: 15px; } .contacts-item .crumina-icon { margin-right: 20px; } .contacts-item .title { font-size: 25px; } .contacts-item .contacts { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } /*------------- #PRICING-TABLES --------------*/ .crumina-pricing-tables-item { position: relative; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .pricing-thumb { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; max-width: 100px; margin-left: auto; margin-right: auto; text-align: center; } .pricing-tables-position { padding-left: 0; list-style: none; } .pricing-tables-position li { margin-bottom: 10px; color: var(--body-font-color); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .pricing-tables-position li:last-child { margin-bottom: 0; } .position-item span { color: var(--heading-color); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .position-item span.included { color: var(--green-themes); } .bg-layer { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .main-pricing-content { position: relative; } /*------------- #pricing tables standard --------------*/ .pricing-tables-item-standard { text-align: center; background-color: var(--white-color); border-radius: 5px; padding: 40px; border: 3px solid transparent; } .pricing-tables-item-standard:hover { -webkit-box-shadow: var(--theme-shadow); box-shadow: var(--theme-shadow); border-color: var(--primary-accent-color); } .pricing-tables-item-standard .rate { margin-top: 0; font-weight: 900; color: var(--heading-color); font-size: 36px; } .pricing-tables-item-standard .main-pricing-content > * { margin-bottom: 30px; } .pricing-tables-item-standard .main-pricing-content > *:last-child { margin-bottom: 0; } /*------------- #PRICING Tables Triple --------------*/ .pricing-tables-wrap { border-radius: 5px; padding: 0; -webkit-box-shadow: 0 10px 20px 0 rgba(144, 146, 136, 0.2); box-shadow: 0 10px 20px 0 rgba(144, 146, 136, 0.2); overflow: hidden; } .pricing-tables-wrap > *:last-child .main-pricing-content { border-right: none; } .pricing-tables-wrap .pricing-tables-item-standard { padding: 60px 0; border: none; border-radius: 0; } .pricing-tables-wrap .pricing-tables-item-standard .pricing-thumb { max-height: 0; visibility: hidden; opacity: 0; overflow: hidden; } .pricing-tables-wrap .pricing-tables-item-standard:after { content: ''; display: block; height: 4px; width: calc(100% - 80px); background-color: var(--primary-accent-color); opacity: 0; position: absolute; bottom: 0; left: 40px; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .pricing-tables-wrap .pricing-tables-item-standard:hover { -webkit-box-shadow: none; box-shadow: none; } .pricing-tables-wrap .pricing-tables-item-standard:hover .pricing-thumb { max-height: 100px; visibility: visible; opacity: 1; overflow: visible; } .pricing-tables-wrap .pricing-tables-item-standard:hover:after { opacity: 1; } .pricing-tables-wrap .main-pricing-content { padding: 0 60px; border-right: 1px solid #d9dfe7; } /*------------- #PRICING Tables COLORED WRAP --------------*/ .pricing-tables-wrap-colored { border-radius: 5px; padding: 0; overflow: hidden; } .pricing-tables-wrap-colored > *:last-child .main-pricing-content { border-right: none; } .pricing-tables-wrap-colored .pricing-tables-item-standard { padding: 60px 0; border: none; border-radius: 0; } .pricing-tables-wrap-colored .pricing-tables-item-standard:after { content: ''; display: block; height: 4px; width: 100%; background-color: currentColor; position: absolute; bottom: 0; left: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .pricing-tables-wrap-colored .pricing-tables-item-standard:hover { -webkit-box-shadow: none; box-shadow: none; } .pricing-tables-wrap-colored .pricing-tables-item-standard:hover .pricing-thumb { max-height: 100px; visibility: visible; opacity: 1; overflow: visible; } .pricing-tables-wrap-colored .pricing-tables-item-standard:hover:after { height: 100%; } .pricing-tables-wrap-colored .pricing-tables-item-standard:hover .crumina-button { background-color: var(--dark-themes); } .pricing-tables-wrap-colored .pricing-tables-item-standard:hover .rate { color: var(--white-color); } .pricing-tables-wrap-colored .pricing-tables-item-standard:hover .pricing-tables-position li { color: var(--white-color); } .pricing-tables-wrap-colored .pricing-tables-item-standard:hover .position-item span { color: var(--white-color); } .pricing-tables-wrap-colored .pricing-tables-item-standard:hover .position-item span.included { color: var(--white-color); } .pricing-tables-wrap-colored .main-pricing-content { padding: 0 60px; border-right: 1px solid #d9dfe7; z-index: 10; } /*------------- #PRICING Tables COLORED --------------*/ .pricing-tables-item-colored { text-align: center; border-radius: 5px; padding: 40px; background-color: currentColor; } .pricing-tables-item-colored .main-pricing-content > * { margin-bottom: 30px; } .pricing-tables-item-colored .main-pricing-content > *:last-child { margin-bottom: 0; } .pricing-tables-item-colored .rate { color: var(--white-color); } .pricing-tables-item-colored .pricing-tables-position li { color: var(--white-color); } .pricing-tables-item-colored .position-item span { color: var(--white-color); } .pricing-tables-item-colored .position-item span.included { color: var(--white-color); } .pricing-tables-item-colored:hover .bg-layer { -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } .pricing-tables-item-colored .bg-layer { position: absolute; width: 100%; height: 100%; left: 0; top: 0; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); background-color: currentColor; border-radius: 5px; } /*------------- Responsive Mode --------------*/ /*------------- #PIE-CHARTS --------------*/ .crumina-pie-chart-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .pie-chart { width: 170px; height: 170px; min-width: 170px; min-height: 170px; position: relative; border-radius: 100%; border: 5px solid var(--grey-themes); margin-right: 30px; } .pie-chart:after { content: ''; display: block; width: 145px; height: 145px; background-color: transparent; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); border-radius: 100%; border: 5px solid var(--grey-themes); z-index: -1; } .pie-chart .content { font-size: 40px; color: var(--heading-color); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .pie-chart-content-text { margin-bottom: 20px; } .pie-chart canvas { max-width: 100%; height: auto !important; } /*------------- Responsive Mode --------------*/ @media (max-width: 1024px) { .crumina-pie-chart-item { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .pie-chart { margin-right: 0; margin-bottom: 20px; } } /*------------- #SKILLS --------------*/ .skills-item-meter-active { position: absolute; display: inline-block; border-radius: 5px 0 0 5px; bottom: 5px; left: 5px; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; color: var(--dark-themes); height: 6px; } .skills-item-meter-active.skills-animate { -webkit-animation: skills-animated 1.2s ease-out; animation: skills-animated 1.2s ease-out; } .skills-item-meter-active.skills-animate-opacity { -webkit-animation: skills-animated-opacity .2s ease-out; animation: skills-animated-opacity .2s ease-out; } .skills-item-meter-active:after { content: ''; display: block; width: 24px; height: 24px; border: 4px solid transparent; border-radius: 100%; position: absolute; right: -24px; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); background-color: transparent; } .skills-item-meter-active.bg-primary-themes:after { border-color: var(--primary-accent-color); } .skills-item-meter-active.bg-red-themes:after { border-color: var(--red-themes); } .skills-item-meter-active.bg-yellow-themes:after { border-color: var(--yellow-themes); } .skills-item-meter-active.bg-green-themes:after { border-color: var(--green-themes); } .skills-item-meter { padding: 0 5px; width: 100%; border-radius: 10px; background-color: #121517; position: relative; height: 16px; } .skills-item-title { font-size: 16px; font-weight: 700; color: var(--white-color); } .skills-item-count { font-weight: 700; font-size: 16px; color: var(--white-color); } .skills-item-info { margin-bottom: 15px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .skills-item-dark .skills-item-meter { background-color: var(--grey-themes); } .skills-item-dark .skills-item-title { color: var(--dark-themes); } .skills-item-dark .skills-item-count { color: var(--dark-themes); } @-webkit-keyframes skills-animated { 0% { width: 0; } } @keyframes skills-animated { 0% { width: 0; } } @-webkit-keyframes skills-animated-opacity { 100% { opacity: 1; } } @keyframes skills-animated-opacity { 100% { opacity: 1; } } /*------------- #COUNTERS --------------*/ .crumina-counter-item { text-align: center; } .crumina-counter-item .crumina-icon { margin-bottom: 30px; } .counter-numbers { font-size: 90px; line-height: 1; margin-bottom: -5px; font-weight: 700; } .counter-numbers .units { display: inline-block; margin-left: -15px; } .counter-title { font-size: 24px; color: var(--heading-color); font-weight: 700; } .counter-line .long-line, .counter-line .short-line { display: inline-block; height: 3px; background-color: var(--white-color); border-radius: 10px; position: relative; } .counter-line .short-line { width: 20px; margin-right: 10px; } .counter-line .long-line { width: 50px; } /*------------- #Counter modern --------------*/ .counter-item-modern .counter-numbers { margin-bottom: 0; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .crumina-counter-item { text-align: center; } .crumina-counter-item .counter-numbers { font-size: 50px; } .crumina-counter-item .counter-title { font-size: 18px; } } /*------------- #MAPS --------------*/ .crumina-map { position: relative; overflow: hidden; max-height: 80vh; } .height-500 { height: 500px; max-height: 80vh; } /*------------- #CLIENTS --------------*/ .client-items-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: space-evenly; -webkit-justify-content: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; } .clients-item { display: block; -webkit-filter: grayscale(1); filter: grayscale(1); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; text-align: center; } .clients-item:hover { -webkit-filter: grayscale(0); filter: grayscale(0); } .clients-item:last-child { margin-right: 0; } /*------------- #CRUMINA CLIENTS --------------*/ .crumina-client-item { padding: 60px; background-color: var(--grey-themes); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; text-align: center; } .crumina-client-item:hover { background-color: var(--primary-accent-color); -webkit-box-shadow: var(--theme-shadow); box-shadow: var(--theme-shadow); } .crumina-client-item:hover .crumina-button { background-color: var(--dark-themes); color: var(--white-color); border-color: var(--dark-themes); } .crumina-client-item:hover .crumina-icon { fill: var(--white-color); } .crumina-client-item:hover .client-item-text { color: var(--white-color); } .crumina-client-item .client-item-title { font-size: 24px; color: var(--heading-color); } .crumina-client-item .client-item-text { font-size: 16px; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .crumina-client-item .crumina-icon { fill: #949fac; } .crumina-client-item > * { margin-bottom: 30px; } .crumina-client-item > *:last-child { margin-bottom: 0; } /*------------- Responsive Mode --------------*/ @media (max-width: 992px) { .crumina-client-item { padding: 20px; } .crumina-client-item > * { margin-bottom: 20px; } } @media (max-width: 768px) { .client-items-wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .clients-item { margin-bottom: 20px; margin-right: 0; text-align: center; } } /*------------- #SLIDERS --------------*/ .crumina-module-slider { position: relative; } .crumina-module-slider .latest-news-item { border-bottom: none; } .slides-item { position: relative; } .swiper-container-fade .swiper-slide { opacity: 0 !important; } .swiper-container-fade .swiper-slide-active { opacity: 1 !important; } .swiper-btn-next, .swiper-btn-prev { z-index: 99; position: relative; display: inline-block; cursor: pointer; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; fill: #b0b6b6; } .swiper-btn-next:hover, .swiper-btn-prev:hover { fill: var(--primary-accent-color); } .swiper-btn-next.white, .swiper-btn-prev.white { fill: var(--white-color); } .swiper-btn-next.white:hover, .swiper-btn-prev.white:hover { fill: var(--primary-accent-color); } .navigation-center-both-sides .swiper-btn-next, .navigation-center-both-sides .swiper-btn-prev { top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); position: absolute; } .navigation-center-both-sides .swiper-btn-prev { left: -5%; } .navigation-center-both-sides .swiper-btn-next { right: -5%; } .navigation-bottom-right { padding-bottom: 50px; } .navigation-bottom-right .swiper-btn-wrap { position: absolute; bottom: 0; right: 0; } .navigation-bottom-left { padding-bottom: 50px; } .navigation-bottom-left .swiper-btn-wrap { position: absolute; bottom: 0; left: 0; } .navigation-bottom-both-sides .swiper-btn-next, .navigation-bottom-both-sides .swiper-btn-prev { bottom: 10px; position: absolute; } .navigation-bottom-both-sides .swiper-btn-prev { left: 20%; } .navigation-bottom-both-sides .swiper-btn-next { right: 20%; } .navigation-bottom-center { padding-bottom: 70px; } .navigation-bottom-center .swiper-btn-next, .navigation-bottom-center .swiper-btn-prev { bottom: 0; position: absolute; } .navigation-bottom-center .swiper-btn-prev { left: 42%; } .navigation-bottom-center .swiper-btn-next { right: 42%; } /*------------- #Swiper Pagination --------------*/ .pagination-bottom { padding-bottom: 60px; } .pagination-bottom .swiper-pagination { bottom: 0; } .pagination-bottom-center { padding-bottom: 40px; } .pagination-bottom-center .swiper-pagination { bottom: 0; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } .pagination-top-center { padding-top: 60px; } .pagination-top-center .swiper-pagination { top: 10px; bottom: auto; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); } .pagination-bottom-left { padding-bottom: 40px; } .pagination-bottom-left .swiper-pagination { bottom: 0; left: 0; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .swiper-pagination-bullets .swiper-pagination-bullet { width: 10px; height: 10px; opacity: .2; background-color: var(--dark-themes); border-radius: 100%; margin: 0 5px; } .swiper-pagination-bullets .swiper-pagination-bullet-active { background-color: transparent; position: relative; border: 2px solid var(--primary-accent-color); opacity: 1; } .swiper-pagination-white.swiper-pagination-bullets .swiper-pagination-bullet-active { border-color: var(--white-color); } .swiper-pagination-dark .swiper-pagination-bullet { opacity: 1; } .swiper-pagination-dark.swiper-pagination-bullets .swiper-pagination-bullet-active { border-color: var(--white-color); } .testimonial-slider-author-top { margin-top: -60px; } /*------------- PRODUCTS-GALLERY-SLIDER --------------*/ .products-gallery-slider { text-align: center; } .products-gallery-slider .slider-slides { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin-top: 60px; } .products-gallery-slider .slider-slides .slides-item { margin-right: 25px; max-width: 90px; opacity: .3; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .products-gallery-slider .slider-slides .slides-item:last-child { margin-right: 0; } .products-gallery-slider .slider-slides .slides-item.swiper-slide-active { opacity: 1; } .crumina-slider--vertical .swiper-container { height: 300px; } .pagination-left-center .swiper-container { padding-left: 100px; } .pagination-left-center .swiper-pagination-bullets { right: auto; left: 0; top: 50%; -webkit-transform: translate3d(0px, -50%, 0); transform: translate3d(0px, -50%, 0); } .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 10px 0; } /*------------- #Time-Line-slider --------------*/ .time-line-slider .gallery-thumbs { padding: 0 80px; } .time-line-slider .swiper-btn-next, .time-line-slider .swiper-btn-prev { position: absolute; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); z-index: 5; } .time-line-slider .swiper-btn-next { right: 0; } .time-line-slider .swiper-btn-prev { left: 0; } .time-line-slides { margin: 60px auto; position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .time-line-slides .swiper-slide { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-right: 0 !important; } .time-line-slides .swiper-slide.time-active .time-line-decoration { background-color: var(--primary-accent-color); } .time-line-slides .swiper-slide.time-active a { background-color: var(--primary-accent-color); border-color: var(--primary-accent-color); color: var(--white-color); } .time-line-slides .swiper-slide.time-active a:before { opacity: 1; } .time-line-slides .swiper-slide.time-active a:hover { background-color: var(--primary-accent-color); border-color: var(--primary-accent-color); -webkit-box-shadow: inset 2px 4px 0 0 transparent, 2px 4px 0 0 transparent; box-shadow: inset 2px 4px 0 0 transparent, 2px 4px 0 0 transparent; } .time-line-slides .swiper-slide.visited .time-line-decoration { background-color: var(--primary-accent-color); } .time-line-slides .swiper-slide.visited a { background-color: transparent; border-color: var(--primary-accent-color); } .time-line-slides .swiper-slide.visited a:hover { -webkit-box-shadow: inset 2px 4px 0 0 transparent, 2px 4px 0 0 transparent; box-shadow: inset 2px 4px 0 0 transparent, 2px 4px 0 0 transparent; } .time-line-slides a { padding: 11px 22px; line-height: 1; border: 3px solid var(--yellow-themes); border-radius: 50px; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; margin: 0 0 0 10px; max-width: 80px !important; position: relative; font-size: 16px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .time-line-slides a:before { content: ''; display: block; position: absolute; opacity: 0; width: 4px; height: 4px; border-radius: 100%; background-color: var(--primary-accent-color); -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); left: 50%; bottom: -14px; } .time-line-slides a .crumina-icon { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .time-line-slides a:active { background-color: var(--primary-accent-color); border-color: var(--primary-accent-color); color: var(--primary-accent-color); } .time-line-slides a:active:before { opacity: 1; } .time-line-slides a:active:hover { background-color: var(--primary-accent-color); border-color: var(--primary-accent-color); } .time-line-slides a:active:hover:before { opacity: 1; } .time-line-slides .time-line-decoration { display: inline-block; height: 4px; border-radius: 5px; background-color: var(--grey-themes); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; position: relative; width: 100%; } .time-line-slider--slide-rounde .time-line-slides a { max-width: 50px !important; min-width: 50px; width: 50px; height: 50px; padding: 0; font-size: 14px; } /*------------- MAIN SLIDER --------------*/ .crumina-main-slider .swiper-btn-next, .crumina-main-slider .swiper-btn-prev { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .crumina-main-slider .swiper-btn-next:hover .crumina-icon, .crumina-main-slider .swiper-btn-prev:hover .crumina-icon { fill: var(--dark-themes); } .crumina-main-slider .swiper-container, .crumina-main-slider .swiper-wrapper, .crumina-main-slider .swiper-slide { height: auto; } .crumina-main-slider .swiper-btn-prev { left: 5%; } .crumina-main-slider .swiper-btn-next { right: 5%; } .crumina-main-slider .slider-content + .slider-thumb { margin-top: 40px; } .crumina-main-slider .swiper-slide { padding: 40px 0 135px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background-size: cover; } .crumina-main-slider .slider-content-text { font-size: 24px; line-height: 1.5; font-weight: 300; margin-bottom: 30px; } .main-slider-slides { position: absolute; left: 0; bottom: 0; width: 100%; z-index: 10; } .main-slider-slides .slides-item { padding: 40px; width: 100%; min-width: 20%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; cursor: pointer; position: relative; color: var(--white-color); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .main-slider-slides .slides-item .slides-item-icon { position: absolute; right: 40px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .main-slider-slides .slides-item:hover, .main-slider-slides .slides-item.swiper-slide-active { color: var(--heading-color); } .main-slider-slides .slides-item.bg-grey-theme { color: var(--body-font-color); } .main-slider-slides .slides-item.bg-dark-theme { color: var(--white-color); } .main-slider-slides .slides-item-title { font-weight: 400; margin-bottom: 0; color: inherit; } .main-slider-slides .slides-item-text { color: inherit; } .main-slider-slides.swiper-slide-active, .main-slider-slides:hover { color: var(--heading-color); } .main-slider-slides-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } /*------------- Responsive Mode --------------*/ @media (max-width: 1300px) { .navigation-center-both-sides .swiper-btn-prev { left: 0; } .navigation-center-both-sides .swiper-btn-next { right: 0; } } @media (max-width: 1200px) { .main-slides-item { padding: 10px; } } @media (max-width: 1024px) { .navigation-bottom-right .swiper-btn-wrap { right: auto; left: 10px; bottom: 20px; } .pagination-bottom, .pagination-bottom-center { padding-bottom: 50px; } } @media (max-width: 768px) { .navigation-bottom-center .swiper-btn-next { right: 10%; } .navigation-bottom-center .swiper-btn-prev { left: 10%; } .navigation-bottom-both-sides .swiper-btn-next { right: 10%; } .navigation-bottom-both-sides .swiper-btn-prev { left: 10%; } .main-slider-slides { display: none; } .crumina-main-slider .slider-content-text { font-size: 18px; } .crumina-main-slider { text-align: center; } .crumina-main-slider .swiper-slide { padding: 40px 0 40px; } .pagination-left-center .swiper-container { padding-left: 40px; } .crumina-slider--vertical .swiper-container { height: 550px; text-align: center; } .time-line-slides .time-line-decoration { width: 0; } .time-line-slides .swiper-slide { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } /*------------- #TESTIMONIALS --------------*/ .crumina-testimonial-item .testimonial-text { margin-bottom: 30px; font-weight: 300; } .crumina-testimonial-item .post-author-name { font-size: 18px; } .crumina-testimonial-item .author-prof { font-size: 16px; } .author-quote-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } /*------------- #TESTIMONIALS ARROWS --------------*/ .testimonial-item-arrow { padding: 50px 60px 10px; background-color: var(--white-color); margin-bottom: 40px; position: relative; } .testimonial-item-arrow .post-author .author-avatar { width: initial; height: initial; min-width: initial; min-height: initial; margin-right: 30px; background-color: transparent; } .testimonial-item-arrow .author-prof { color: var(--primary-accent-color); } .testimonial-item-arrow:before { content: ""; position: absolute; bottom: -40px; right: 0; border-width: 40px 40px 0 0; border-style: solid; border-color: #e8e9e1 transparent transparent #e8e9e1; display: block; width: 0; /* Rules for Firefox 3.0 and better */ } .testimonial-item-arrow:after { content: ""; position: absolute; bottom: -40px; left: 0; right: 40px; height: 40px; width: calc(100% - 40px); background-color: inherit; } /*------------- #TESTIMONIALS AUTHOR TOP --------------*/ .testimonial-item-author-top { text-align: center; } .testimonial-item-author-top .author-avatar { width: 120px; height: 120px; border: 4px solid var(--white-color); border-radius: 100%; margin: 0 auto 50px; background-color: var(--grey-themes); } .testimonial-item-author-top .testimonial-text { color: var(--white-color); margin-bottom: 20px; } .testimonial-item-author-top .post-author { text-align: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .testimonial-item-author-top .post-author-name { color: var(--yellow-themes); } .testimonial-item-author-top .post-author-name:hover { color: var(--primary-accent-color); } .testimonial-item-author-top .author-prof { color: #949fac; } /*------------- #TESTIMONIALS AUTHOR BOTTOM --------------*/ .testimonial-item-author-bottom { text-align: center; } .testimonial-item-author-bottom .post-author { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .testimonial-item-author-bottom .author-avatar { width: initial; height: initial; min-width: initial; min-height: initial; margin-right: 30px; background-color: transparent; } .testimonial-item-author-bottom .author-prof { color: var(--primary-accent-color); } .testimonial-item-author-bottom .testimonial-text { font-style: italic; } /*------------- #TESTIMONIALS MODERN --------------*/ .testimonial-item-modern { background-color: var(--dark-themes); border-radius: 100px 0 100px 100px; padding: 40px 80px; margin: 0 30px 0 50px; position: relative; } .testimonial-item-modern:after { content: ''; display: block; position: absolute; top: 0; right: -30px; width: 0; height: 0; border-style: solid; border-width: 30px 30px 0 0; border-color: var(--dark-themes) transparent transparent transparent; } @media (max-width: 570px) { .testimonial-item-modern:after { display: none; } } @media (max-width: 570px) { .testimonial-item-modern { padding: 70px 30px 20px; border-radius: 40px; margin: 50px 0 0; } } .testimonial-item-modern.author-arrow-reverse { border-radius: 0 100px 100px 100px; margin: 0 50px 0 30px; } @media (max-width: 570px) { .testimonial-item-modern.author-arrow-reverse { padding: 70px 30px 20px; margin: 50px 0 0; border-radius: 40px; } } .testimonial-item-modern.author-arrow-reverse .author-avatar { left: auto; right: -50px; } @media (max-width: 570px) { .testimonial-item-modern.author-arrow-reverse .author-avatar { top: -50px; left: 50%; margin-left: -50px; } } .testimonial-item-modern.author-arrow-reverse:after { left: -30px; right: auto; border-width: 0 30px 30px 0; border-color: transparent var(--dark-themes) transparent transparent; } .testimonial-item-modern .testimonial-content { position: relative; z-index: 6; } .testimonial-item-modern .testimonial-text { color: var(--white-color); font-style: italic; margin-bottom: 0; } .testimonial-item-modern .author-quote-wrap { -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; } .testimonial-item-modern .post-author-name { color: var(--yellow-themes); } .testimonial-item-modern .author-prof { color: #949fac; } .testimonial-item-modern .author-avatar { position: absolute; top: 0; left: -50px; border-radius: 100%; width: 100px; height: 100px; background-color: var(--grey-themes); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } @media (max-width: 570px) { .testimonial-item-modern .author-avatar { top: -50px; left: 50%; margin-left: -50px; } } .testimonial-item-modern .author-avatar img { margin: auto; } /*------------- #TESTIMONIALS QUOTE LEFT --------------*/ .testimonial-item-quote-left { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .testimonial-item-quote-left .quote { width: 100px; height: 71px; min-width: 100px; min-height: 71px; margin-right: 30px; } .testimonial-item-quote-left .testimonial-text { font-style: italic; } .testimonial-item-quote-left .post-author-name { color: var(--primary-accent-color); } .testimonial-item-quote-left .author-avatar { width: initial; height: initial; min-width: initial; min-height: initial; margin-right: 30px; border-radius: 0; background-color: transparent; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .testimonial-item-arrow { padding: 20px 30px 10px; } .testimonial-item-quote-left { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .testimonial-item-quote-left .quote { margin-right: 0; margin-bottom: 20px; margin-top: 0; } .testimonial-item-quote-left { padding-top: 0; } } /*------------- #TABS --------------*/ .tab-content .tab-pane { display: none; } .tab-content .tab-pane.active { display: block; } .tab-content .tab-pane.fade { opacity: 1; } .crumina-module.crumina-tabs { padding: 0; margin-bottom: 0; background-color: transparent; -webkit-box-shadow: none; box-shadow: none; overflow: visible; } .crumina-module.crumina-tabs .tab-content { background-color: var(--grey-themes); padding: 70px 0 120px; } .crumina-module.crumina-tabs .tabs-list { list-style: none; padding-left: 0; margin-bottom: 0; border: none; } .crumina-module.crumina-tabs .tabs-list li { display: inline-block; line-height: 1; margin-bottom: 0; padding: 0; border: none; } .crumina-module.crumina-tabs .tabs-list li + li { margin-left: 2px; } .crumina-module.crumina-tabs .tabs-list li .nav-link { padding: 23px 45px; background-color: #e8e9e1; position: relative; line-height: 1; font-size: 14px; font-weight: 700; border: none; } .crumina-module.crumina-tabs .tabs-list li .nav-link:after { content: ''; display: block; position: absolute; width: 85%; height: 2px; background-color: var(--primary-accent-color); top: 0; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); opacity: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .crumina-module.crumina-tabs .tabs-list li .nav-link:hover { color: var(--primary-accent-color); } .crumina-module.crumina-tabs .tabs-list li .nav-link.active, .crumina-module.crumina-tabs .tabs-list li .nav-link:active { background-color: var(--grey-themes); color: var(--primary-accent-color); border: none; } .crumina-module.crumina-tabs .tabs-list li .nav-link.active:after, .crumina-module.crumina-tabs .tabs-list li .nav-link:active:after { opacity: 1; } .crumina-module.crumina-tabs .tabs-list li:last-child a { border-radius: 0 5px 0 0; } .crumina-module.crumina-tabs .tabs-list li:first-child a { border-radius: 5px 0 0 0; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .crumina-module.crumina-tabs .tabs-list li .nav-link { padding: 15px 10px; } .crumina-module.crumina-tabs .tab-content { padding: 30px 0 60px; } } @media (max-width: 460px) { .crumina-module.crumina-tabs .tabs-list { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .crumina-module.crumina-tabs .tabs-list li { text-align: center; } .crumina-module.crumina-tabs .tabs-list li + li { margin-left: 0; } } /*------------- #CRUMINA-CASE-ITEM --------------*/ .crumina-case-item { text-align: center; background-color: var(--grey-themes); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .crumina-case-item:hover { background-color: var(--primary-accent-color); } .crumina-case-item:hover .case-item-thumb img { -webkit-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15); } .crumina-case-item:hover .case-item-cat a, .crumina-case-item:hover .case-item-title { color: var(--white-color); } .crumina-case-item:hover .case-item-cat a:hover, .crumina-case-item:hover .case-item-title:hover { text-decoration: underline; } .crumina-case-item .case-item-content { padding: 10px; } .crumina-case-item .case-item-title { margin-bottom: 8px; } .crumina-case-item .case-item-cat a { color: var(--body-font-color); } .case-item-thumb { overflow: hidden; } .case-item-thumb img { -webkit-transition: all 0.3s cubic-bezier(0.465, 0.183, 0.153, 0.946); -o-transition: all 0.3s cubic-bezier(0.465, 0.183, 0.153, 0.946); transition: all 0.3s cubic-bezier(0.465, 0.183, 0.153, 0.946); } .case-time-create { font-size: 16px; color: #949fac; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 30px; } .case-time-create .crumina-icon { margin-right: 10px; fill: #949fac; } .case-item-text { margin-bottom: 30px; } .like-block { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .likes { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: var(--red-themes); margin-left: 30px; font-size: 16px; } .likes .crumina-icon { fill: var(--red-themes); margin-right: 12px; } .seo-results-thumb { padding: 0 50px; } .seo-results-thumb canvas { margin-bottom: 30px; } .results-points { padding-left: 40px; } .results-points .results-points-item { -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 10px; } .results-points .results-point-sircle { display: inline-block; width: 20px; height: 20px; min-width: 20px; min-height: 20px; border-radius: 100%; border-color: transparent; margin-right: 20px; } .results-points .results-points-item-count { font-size: 16px; font-weight: 700; color: var(--heading-color); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .results-points .results-points-item-count span { color: var(--body-font-color); font-weight: 400; } .seo-results-item-info { margin-bottom: 0; } .seo-results-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 30px; } .seo-results-item:last-of-type { margin-bottom: 0; } .seo-results-item .crumina-icon { margin-right: 30px; max-width: 60px; } .seo-results--inline { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .seo-results--inline .seo-results-item { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; margin-bottom: 0; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .seo-results--inline .seo-results-item:last-of-type { margin-bottom: 0; } .seo-results--inline .seo-results-item .crumina-icon { margin-right: 0; margin-bottom: 30px; } /*------------- Responsive Mode --------------*/ @media (max-width: 1024px) { .seo-results-item-info { font-size: 20px; } } @media (max-width: 768px) { .crumina-case-item .case-item-content { padding: 15px 20px; } .seo-results-thumb { padding: 0; } .results-points { padding-left: 0; } } @media (max-width: 420px) { .seo-results--inline { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .seo-results--inline .seo-results-item { margin-bottom: 20px; } .seo-results--inline .seo-results-item:last-child { margin-bottom: 0; } } /*------------- #INFO-BOXES --------------*/ .crumina-info-box { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .info-box-thumb { margin-right: 30px; width: 70px; min-width: 70px; } .info-box-content > * { margin-bottom: 15px; } .info-box-content > *:last-child { margin-bottom: 0; } .info-box-text { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; font-size: 16px; } .info-box-title { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } /*------------- #INFO-BOXES STYLE BG --------------*/ .info-box--style-bg { padding: 40px; background-color: var(--grey-themes); border-radius: 5px; } .info-box--style-bg:hover { -webkit-box-shadow: var(--theme-shadow); box-shadow: var(--theme-shadow); background-color: var(--dark-themes); } .info-box--style-bg:hover .info-box-text { color: #949fac; } .info-box--style-bg:hover .info-box-title { color: var(--white-color); } .info-box--style-bg:hover .link-with-icon { color: var(--primary-accent-color); } .info-box--style-bg .info-box-thumb { width: 130px; height: 130px; min-height: 130px; min-width: 130px; border-radius: 100%; background-color: var(--white-color); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } /*------------- #INFO-BOXES COLUMN-CENTERED --------------*/ .info-box--column-centered { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; text-align: center; } .info-box--column-centered .info-box-thumb { margin: 0 auto 20px; width: 80px; min-width: initial; } .info-box--column-centered .link-with-icon { display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; } /*------------- #INFO-BOXES ICON-TOP --------------*/ .info-box--style-icon-top { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; text-align: center; padding: 0 50px 50px; margin-top: 65px; background-color: var(--white-color); border-radius: 5px; } .info-box--style-icon-top:hover { -webkit-box-shadow: 0 10px 20px 0 rgba(144, 146, 136, 0.2); box-shadow: 0 10px 20px 0 rgba(144, 146, 136, 0.2); } .info-box--style-icon-top .info-box-thumb { width: 130px; height: 130px; min-height: 130px; min-width: 130px; border-radius: 100%; background-color: var(--grey-themes); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin: -65px auto 30px; } /*------------- #INFO-BOXES STANDARD --------------*/ .info-box--standard { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .info-box--standard .info-box-thumb { margin-right: 0; margin-bottom: 20px; width: 70px; min-width: 70px; } /*------------- Responsive Mode --------------*/ @media (max-width: 992px) { .info-box--style-bg { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center; } .info-box--style-bg .info-box-thumb { margin-right: 0; margin-bottom: 20px; } .info-box--style-bg .link-with-icon { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } @media (max-width: 768px) { .crumina-info-box { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center; } .info-box-thumb { margin-right: 0; margin-bottom: 20px; width: 50px; min-width: 50px; } .info-box--standard .info-box-thumb { margin-bottom: 15px; } .info-box--style-icon-top { padding: 0 20px 30px; } .info-box--style-bg { padding: 20px; } } /*------------- #ACCORDIONS --------------*/ .crumina-accordion { list-style: none; margin: 0; padding: 0; } .crumina-accordion .card-header { padding: 20px 30px; } .crumina-accordion > .card:not(:first-of-type):not(:last-of-type) { border-radius: 10px; } .crumina-accordion > .card:first-of-type { border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; } .crumina-accordion > .card:last-of-type { border-top-left-radius: 10px; border-top-right-radius: 10px; } .crumina-accordion .btn-link { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .crumina-accordion .btn-link:focus, .crumina-accordion .btn-link:hover { text-decoration: none; } .crumina-accordion .btn-link .title { font-size: 18px; color: var(--primary-accent-color); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .crumina-accordion .btn-link .icons { line-height: 1; padding-right: 20px; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; opacity: 1; position: relative; } .crumina-accordion .btn-link .icons .crumina-icon { height: 17px; width: 17px; fill: var(--primary-accent-color); -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } .crumina-accordion .btn-link .icons .active { opacity: 0; position: absolute; left: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; top: 5px; } .crumina-accordion .btn-link.collapsed .title { color: var(--heading-color); } .crumina-accordion .btn-link.collapsed .crumina-icon { fill: #9da7b3; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .crumina-accordion .btn-link.collapsed .crumina-icon.active { opacity: 1; } .crumina-accordion > .card { position: relative; background-color: var(--white-color); border-radius: 10px; margin-bottom: 10px; -webkit-box-shadow: 0 10px 20px 0 rgba(144, 146, 136, 0.2); box-shadow: 0 10px 20px 0 rgba(144, 146, 136, 0.2); border: none; } .crumina-accordion .card-body { position: relative; padding: 20px 70px; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; font-size: 16px; } .crumina-accordion .card-body:before { content: ''; display: block; height: calc(100% - 40px); width: 3px; background-color: var(--primary-accent-color); position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); left: 37px; } /*================= Responsive Mode ============*/ /*------------- #SERVICES --------------*/ .crumina-service-item { padding: 60px; height: 100%; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .crumina-service-item:hover { background-color: var(--grey-themes); } .crumina-service-item:hover .service-item-text { color: var(--body-font-color); } .service-item-link:hover { fill: var(--primary-accent-color); } .service-item-text { color: var(--white-color); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; margin-bottom: 30px; } .service-item-title { font-weight: 400; margin-bottom: 15px; } .service-item-thumb { margin-bottom: 30px; } /*------------- #TEAMMEMBER --------------*/ .crumina-teammember-item { text-align: center; } .crumina-teammember-item .socials .social-item { max-width: 20px; max-height: 20px; margin-right: 15px; } .crumina-teammember-item .socials .social-item:last-child { margin-right: 0; } .crumina-teammember-item .socials { margin-top: 20px; } .teammember-item-thumb { width: 270px; height: 270px; min-height: 270px; min-width: 270px; border-radius: 100%; background-color: var(--grey-themes); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin: 0 auto 30px; } .teammember-author-name { font-weight: 400; margin-bottom: 5px; } .teammember-author-prof { font-size: 16px; } /*------------- Responsive Mode --------------*/ @media (max-width: 1200px) { .teammember-item-thumb { width: 100px; height: 100px; min-height: 100px; min-width: 100px; } } @media (max-width: 992px) { .crumina-teammember-item .socials { margin-top: 15px; } .teammember-author-name { margin-bottom: 15px; } .teammember-item-thumb { margin-bottom: 15px; } } /*------------- #WIDGETS --------------*/ /*------------- #WIDGETS --------------*/ .widget--sidebar { margin-bottom: 60px; } .widget--sidebar:last-child { margin-bottom: 0; } .widget--sidebar .crumina-heading { margin-bottom: 25px; } /*------------- Responsive Mode --------------*/ @media (max-width: 1200px) { .widget--sidebar { margin-bottom: 30px; } .widget--sidebar .crumina-heading { margin-bottom: 15px; } } /*------------- #W-INFO --------------*/ .w-info .widget-text { margin-bottom: 20px; } .w-info .site-logo { margin-bottom: 20px; } /*------------- #W-LINKS --------------*/ .widget_links ul { list-style: none; padding-left: 0; margin-bottom: 0; } .widget_links ul a { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 15px; } .widget_links ul .crumina-icon { fill: var(--body-font-color); margin-right: 10px; } .widget_links ul li:hover a { color: var(--primary-accent-color); -webkit-transform: translateX(5px); -ms-transform: translateX(5px); transform: translateX(5px); } .widget_links ul li:hover .crumina-icon { fill: var(--primary-accent-color); } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .widget_links ul a { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } /*------------- #W-CONTACTS --------------*/ .w-contacts .contacts-text { margin-bottom: 30px; } .w-contacts .contact-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 15px; } .w-contacts .contact-item .crumina-icon { margin-right: 20px; } .w-contacts .contact-item:last-child { margin-bottom: 0; } .w-contacts .contact-item .title { font-size: 22px; font-weight: 500; color: var(--heading-color); margin-bottom: 0; } .w-contacts .contact-item .title:hover { color: var(--primary-accent-color); } /*------------- #W-POST-CATEGORY --------------*/ .post-category-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-bottom: 15px; } .post-category-item:last-child { margin-bottom: 0; } .post-category-item .crumina-icon { opacity: 0; margin-left: 10px; fill: var(--primary-accent-color); } .post-category-item:hover .crumina-icon { opacity: 1; -webkit-transform: translateX(5px); -ms-transform: translateX(5px); transform: translateX(5px); } .post-category-title { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .post-category-count { margin-right: 30px; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .post-category-count { margin-right: 15px; } } /*------------- #W-LATEST-NEWS --------------*/ .latest-news-item { margin-bottom: 20px; border-bottom: 1px solid #d9dfe7; } .latest-news-item .post-time-reading { margin-bottom: 15px; color: #949fac; } .latest-news-item .crumina-icon { fill: #949fac; } .latest-news-item .post-title { margin-bottom: 15px; } .latest-news-item .post-author { margin-bottom: 20px; } .latest-news-item .post-text { margin-bottom: 20px; font-size: 16px; } /*------------- #W-FOLLOW --------------*/ .follow-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: var(--white-color); height: 60px; padding: 10px 60px 10px 30px; position: relative; font-size: 16px; font-weight: 600; } .follow-item:hover { opacity: .8; color: var(--white-color); } .follow-item > .crumina-icon { margin-right: 20px; } .follow-item .crumina-icon { fill: currentColor; } .follow-item .check { opacity: 0; } .follow-item.active .check { opacity: 1; } .follow-item.active .add { opacity: 0; } .w-follow-add { height: 100%; width: 60px; background-color: rgba(0, 0, 0, 0.1); position: absolute; top: 0; right: 0; } .w-follow-add .crumina-icon { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .follow-wrap--inline { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .follow-wrap--inline .follow-item { width: 100%; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; padding: 10px 30px; } /*------------- Responsive Mode --------------*/ @media (max-width: 992px) { .follow-wrap--inline { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } /*------------- #W-POPULAR-TAGS --------------*/ .tags-list { padding-left: 0; margin-bottom: 0; list-style: none; } .tags-list li { display: inline-block; margin-right: 10px; margin-bottom: 10px; } .tags-list li:last-child { margin-right: 0; } .tags-list a { border-radius: 30px; line-height: 1; padding: 10px 23px; font-size: 16px; border: 2px solid #d9dfe7; } .tags-list a:hover { background-color: var(--primary-accent-color); border-color: var(--primary-accent-color); color: var(--white-color); } /*------------- #W-SEARCH --------------*/ .w-search { position: relative; } .w-search input:focus + button .crumina-icon { fill: var(--primary-accent-color); color: var(--primary-accent-color); } .w-search button { height: 100%; width: 60px; position: absolute; top: 0; right: 0; text-align: center; fill: #949fac; } .w-search button:hover { fill: var(--primary-accent-color); } /*------------- #LAYOUTS --------------*/ /*------------- #HEADER --------------*/ .site-header { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; color: var(--body-font-color); background-color: var(--white-color); padding-right: 0 !important; margin-right: 0 !important; } .site-header.site-header--white { background-color: var(--white-color); } .site-header--shadow { -webkit-box-shadow: 9px 9px 16px rgba(163, 177, 198, 0.6), -9px -9px 16px rgba(255, 255, 255, 0.5); box-shadow: 9px 9px 16px rgba(163, 177, 198, 0.6), -9px -9px 16px rgba(255, 255, 255, 0.5); } .header--absolute { position: absolute; z-index: 999; background-color: transparent; } .navigation-additional-menu { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; color: inherit; } .navigation-additional-menu .crumina-icon { fill: currentColor; } .navigation-additional-menu > * { margin-right: 92px; } .navigation-additional-menu > *:last-child { margin-right: 0; } .link-modal-popup { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 99; } .menu-item-info { padding: 10px 20px 5px 30px; margin-bottom: 0; } .menu-item-info-title { font-size: 18px; margin-bottom: 0; } .menu-item-info-text { font-size: 14px; line-height: 1.6; opacity: 1; } .site-logo { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: var(--dark-themes); } .site-logo img { min-width: 70px; } .site-logo:hover { color: var(--dark-themes); } .site-logo.c-white { color: var(--white-color); } .logo-text { margin-left: 15px; } .logo-title { font-size: 28px; line-height: 1; white-space: nowrap; } .logo-sub-title { font-size: 10px; text-transform: uppercase; opacity: .7; white-space: nowrap; } .header--fixed { -webkit-box-shadow: 4px 4px 10px rgba(163, 177, 198, 0.6), -4px -4px 10px rgba(255, 255, 255, 0.5); box-shadow: 4px 4px 10px rgba(163, 177, 198, 0.6), -4px -4px 10px rgba(255, 255, 255, 0.5); } /*------------- #RESPONSIVE --------------*/ @media (min-width: 992px) { .header--fixed .top-bar { visibility: hidden; opacity: 0; height: 0; padding: 0; margin: 0; overflow: hidden; } .header--fixed { background-color: rgba(255, 255, 255, 0.95); } .header--fixed .navigation-link { padding: 25px 10px; } .header--fixed .navigation-link::after { bottom: 25px; } .header--fixed .user-menu { -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .menu-item-info { padding: 5px 20px 5px 30px; margin-bottom: 10px; } .menu-item-info-title { margin-bottom: 0; line-height: 1.2; } .menu-item-info-text { font-size: 15px; opacity: .8; padding-right: 20px; } .menu-item-info-text + .crumina-button { margin-top: 20px; } } @media (max-width: 580px) { .site-logo img { min-width: 40px; } .logo-title { font-size: 20px; } .logo-sub-title { font-size: 8px; } } /*------------- #FOOTER --------------*/ .footer-content { padding: 60px 0 40px; } .widget--footer .widget-title { color: var(--white-color); } .sub-footer { padding: 20px 15px; background-color: #12171b; text-align: center; font-size: 14px; } .sub-footer a { color: var(--white-color); opacity: .5; } .sub-footer a:hover { color: var(--primary-accent-color); opacity: 1; } /*------------- Responsive Mode --------------*/ @media (max-width: 991px) { .footer-content { padding: 30px 0 0; } .footer .contacts { padding: 30px 0; } } @media (max-width: 768px) { .footer { text-align: center; } .footer .contacts { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } /*------------- #TOP BAR --------------*/ .top-bar { width: 100%; padding: 11px 0; -webkit-box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.06); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .top-bar .top-bar-item { color: var(--body-font-color); border-right: 1px solid #d9dfe7; } .top-bar .top-bar-item a { text-decoration: underline; -webkit-text-decoration-color: var(--primary-accent-color); text-decoration-color: var(--primary-accent-color); } .top-bar .top-bar-item a:hover { color: var(--primary-accent-color); } .top-bar select { background-color: transparent; border-radius: 0; border: none; } .top-bar.open { -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); z-index: 99999; } .top-bar-content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .top-bar-content > *:last-child { margin-left: auto; } .top-bar-dark { background-color: #181e23; -webkit-box-shadow: none; box-shadow: none; } .top-bar-dark .crumina-language-switcher { color: #949fac; } .top-bar-dark .top-bar-item { color: var(--white-color); border-right: 1px solid #2e373f; } .top-bar-dark .top-bar-item a { color: #949fac; } .login-block .crumina-icon { margin-right: 10px; fill: var(--body-font-color); } .top-bar-item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 14px; padding: 0 30px; border-right: 1px solid #2e373f; } .top-bar-item .socials { margin-left: 10px; } .top-bar-item .socials .social-item { max-height: 20px; max-width: 20px; margin-right: 10px; } .top-bar-item:first-child { padding-left: 0; padding-right: 0; } .top-bar-item:last-child { padding-right: 0; border-right: none; } .top-bar-close { width: 20px; height: 20px; position: absolute; right: 10px; top: 10px; display: none; border: none; } .top-bar-close:hover span { background-color: var(--primary-accent-color); } .top-bar-close span { display: block; height: 2px; background: #707070; border-radius: 10px; margin: auto; width: 100%; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; top: 50%; position: absolute; } .top-bar-close span:first-of-type { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); } .top-bar-close span:last-of-type { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); } .top-bar-link { display: none; visibility: hidden; border-radius: 50px; background-color: var(--primary-accent-color); text-align: center; padding: 10px; z-index: 50; cursor: pointer; margin-left: auto; } .top-bar-link .crumina-icon { fill: var(--white-color); } @media (max-width: 992px) { .top-bar-link { display: block; visibility: visible; } } /*------------- Responsive Mode --------------*/ @media (max-width: 1200px) { .top-bar-item { padding: 0 10px; } } @media (max-width: 992px) { .top-bar-close { display: block; } .top-bar { width: 320px; -webkit-transform: translate(-50%, -100%); -ms-transform: translate(-50%, -100%); transform: translate(-50%, -100%); position: absolute; left: 50%; border-radius: 0 0 10px 10px; } .top-bar-content { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .top-bar-item { margin-bottom: 15px; } .top-bar .top-bar-item { border-right: 0; } .top-bar-content > *:last-child { margin-left: initial; } } /*------------- #HELPERS --------------*/ .align-center, .aligncenter { text-align: center; } .align-left { text-align: left; } .align-right { text-align: right; } .x-large-padding { padding: 200px 0; } @media (max-width: 768px) { .x-large-padding { padding: 80px 0; } } .large-padding { padding: 80px 0; } @media (max-width: 768px) { .large-padding { padding: 40px 0; } } .medium-padding { padding: 60px 0; } @media (max-width: 768px) { .medium-padding { padding: 20px 0; } } .small-padding { padding: 40px 0; } @media (max-width: 768px) { .small-padding { padding: 15px 0; } } .large-padding-bottom { padding-bottom: 80px; } @media (max-width: 768px) { .large-padding-bottom { padding-bottom: 40px; } } .large-padding-top { padding-top: 80px; } @media (max-width: 768px) { .large-padding-top { padding-top: 40px; } } .lagre-padding-bottom { padding-bottom: 120px; } @media (max-width: 768px) { .lagre-padding-bottom { padding-bottom: 60px; } } .medium-padding-top { padding-top: 60px; } @media (max-width: 768px) { .medium-padding-top { padding-top: 30px; } } .medium-padding-bottom { padding-bottom: 60px; } @media (max-width: 768px) { .medium-padding-bottom { padding-bottom: 30px; } } .small-padding-top { padding-top: 40px; } @media (max-width: 768px) { .small-padding-top { padding-top: 20px; } } .small-padding-bottom { padding-bottom: 40px; } @media (max-width: 768px) { .small-padding-bottom { padding-bottom: 20px; } } .medium-negative-margin-top { margin-top: -40px; } @media (max-width: 992px) { .medium-negative-margin-top { margin-top: -20px; } } .c-white { color: var(--white-color); } .c-yellow-themes { color: var(--yellow-themes); } .c-red-themes { color: var(--red-themes); } .fill-red-themes { fill: var(--red-themes); } .c-green-themes { color: var(--green-themes); } .c-dark { color: var(--heading-color); } .fill-green-themes { fill: var(--green-themes); } .c-primary-themes { color: var(--primary-accent-color); } .c-secondary-themes { color: var(--secondary-accent-color); } .fill-primary-themes { fill: var(--primary-accent-color); } .bg-grey-theme { background-color: var(--grey-themes); } .bg-dark-theme { background-color: var(--dark-themes); } .bg-green-themes { background-color: var(--green-themes); } .bg-red-themes { background-color: var(--red-themes); } .bg-yellow-themes { background-color: var(--yellow-themes); } .bg-primary-themes { background-color: var(--primary-accent-color); } .bg-secondary-themes { background-color: var(--secondary-accent-color); } .dark-section { background-color: #181e23; color: #949da5; } .dark-section a { color: var(--white-color); } .bg-mountains { background-image: url("../images/illustrations/img25.png"); background-size: cover; background-position: bottom; background-repeat: no-repeat; } .crumina-icon { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(17, 17, 17, 0.3); -webkit-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; } .pt-200 { padding-top: 200px; } .pb-200 { padding-bottom: 200px; } .page-404-title { font-size: 140px; color: var(--primary-accent-color); font-weight: 900; line-height: 1; } .weight-black { font-weight: 900; } .link-with-icon { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 16px; } .link-with-icon .crumina-icon { margin-left: 10px; } .link-with-icon:hover .crumina-icon { -webkit-transform: translateX(3px); -ms-transform: translateX(3px); transform: translateX(3px); } .fs-18 { font-size: 18px; } .fs-16 { font-size: 16px; } .facebook-bg-color { background-color: #3a589b; } .twitter-bg-color { background-color: #08acee; } .linkedin-bg-color { background-color: #007bb6; } .pinterest-bg-color { background-color: #ca2127; } .vc-bg-color { background-color: #367ab1; } .gmail-bg-color { background-color: #d7503f; } body:before { content: ''; display: block; width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(47, 44, 44, 0.85); opacity: 0; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; z-index: -999; } body.overlay-enable:before { opacity: .8; z-index: 500; } .main-content-wrapper { overflow-x: hidden; } /*------------- /Styles for animation sections and elements --------------*/ .icon-demonstration { text-align: center; margin-bottom: 30px; padding: 20px; background-color: rgba(39, 199, 205, 0.15); border-radius: 20px; } .icon-demonstration .crumina-icon { fill: var(--primary-accent-color); margin-bottom: 20px; } .icon-demonstration pre { font-size: 12px; color: var(--red-themes); } .icon-demonstration code { white-space: initial; line-height: 2; } /*------------- Styles for animation sections and elements --------------*/ .section-anime-js { position: relative; overflow: hidden; opacity: 0; } .js-animate-icon .crumina-icon path { opacity: 0; } .element-anime-opacity-js, .element-anime-fadeInUp-js { opacity: 0; } /*------------- Responsive Mode --------------*/ @media (max-width: 768px) { .page-404-title { font-size: 100px; } }