/*!***************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./assets/src/css/bundle.scss ***! \***************************************************************************************************************************************************************************************************************************************************/ @import url(https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap); /*!*******************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./assets/src/css/bundle.scss (1) ***! \*******************************************************************************************************************************************************************************************************************************************************/ @import url(https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap); /*!*******************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./assets/src/css/bundle.scss (2) ***! \*******************************************************************************************************************************************************************************************************************************************************/ @import url(https://db.onlinewebfonts.com/c/0f64bc9fbd20b8f7ddb4ea11756cbbb7?family=Jameel+Noori+Nastaleeq); /*!*************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./assets/src/css/vendors/magnific-popup.css ***! \*************************************************************************************************************************/ .mfp-bg{top:0;left:0;width:100%;height:100%;z-index:1042;overflow:hidden;position:fixed;background:#0b0b0b;opacity:.8}.mfp-wrap{top:0;left:0;width:100%;height:100%;z-index:1043;position:fixed;outline:none!important;-webkit-backface-visibility:hidden}.mfp-container{text-align:center;position:absolute;width:100%;height:100%;left:0;top:0;padding:0 8px;box-sizing:border-box}.mfp-container:before{content:"";display:inline-block;height:100%;vertical-align:middle}.mfp-align-top .mfp-container:before{display:none}.mfp-content{position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:1045}.mfp-inline-holder .mfp-content,.mfp-ajax-holder .mfp-content{width:100%;cursor:auto}.mfp-ajax-cur{cursor:progress}.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:-moz-zoom-out;cursor:-webkit-zoom-out;cursor:zoom-out}.mfp-zoom{cursor:pointer;cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in}.mfp-auto-cursor .mfp-content{cursor:auto}.mfp-close,.mfp-arrow,.mfp-preloader,.mfp-counter{-webkit-user-select:none;-moz-user-select:none;user-select:none}.mfp-loading.mfp-figure{display:none}.mfp-hide{display:none!important}.mfp-preloader{color:#ccc;position:absolute;top:50%;width:auto;text-align:center;margin-top:-.8em;left:8px;right:8px;z-index:1044}.mfp-preloader a{color:#ccc}.mfp-preloader a:hover{color:#fff}.mfp-s-ready .mfp-preloader{display:none}.mfp-s-error .mfp-content{display:none}button.mfp-close,button.mfp-arrow{overflow:visible;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;display:block;outline:none;padding:0;z-index:1046;box-shadow:none;touch-action:manipulation}button::-moz-focus-inner{padding:0;border:0}.mfp-close{width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:.65;padding:0 0 18px 10px;color:#fff;font-style:normal;font-size:28px;font-family:Arial,Baskerville,monospace}.mfp-close:hover,.mfp-close:focus{opacity:1}.mfp-close:active{top:1px}.mfp-close-btn-in .mfp-close{color:#333}.mfp-image-holder .mfp-close,.mfp-iframe-holder .mfp-close{color:#fff;right:-6px;text-align:right;padding-right:6px}.mfp-counter{position:absolute;top:0;right:0;color:#ccc;font-size:12px;line-height:18px;white-space:nowrap}.mfp-arrow{position:absolute;opacity:.65;margin:0;top:50%;margin-top:-55px;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:transparent}.mfp-arrow:active{margin-top:-54px}.mfp-arrow:hover,.mfp-arrow:focus{opacity:1}.mfp-arrow:before,.mfp-arrow:after{content:"";display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:medium inset transparent}.mfp-arrow:after{border-top-width:13px;border-bottom-width:13px;top:8px}.mfp-arrow:before{border-top-width:21px;border-bottom-width:21px;opacity:.7}.mfp-arrow-left{left:0}.mfp-arrow-left:after{border-right:17px solid #fff;margin-left:31px}.mfp-arrow-left:before{margin-left:25px;border-right:27px solid #3f3f3f}.mfp-arrow-right{right:0}.mfp-arrow-right:after{border-left:17px solid #fff;margin-left:39px}.mfp-arrow-right:before{border-left:27px solid #3f3f3f}.mfp-iframe-holder{padding-top:40px;padding-bottom:40px}.mfp-iframe-holder .mfp-content{line-height:0;width:100%;max-width:900px}.mfp-iframe-holder .mfp-close{top:-40px}.mfp-iframe-scaler{width:100%;height:0;overflow:hidden;padding-top:56.25%}.mfp-iframe-scaler iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;box-shadow:0 0 8px rgba(0,0,0,.6);background:#000}img.mfp-img{width:auto;max-width:100%;height:auto;display:block;line-height:0;box-sizing:border-box;padding:40px 0 40px;margin:0 auto}.mfp-figure{line-height:0}.mfp-figure:after{content:"";position:absolute;left:0;top:40px;bottom:40px;display:block;right:0;width:auto;height:auto;z-index:-1;box-shadow:0 0 8px rgba(0,0,0,.6);background:#444}.mfp-figure small{color:#bdbdbd;display:block;font-size:12px;line-height:14px}.mfp-figure figure{margin:0}.mfp-bottom-bar{margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto}.mfp-title{text-align:left;line-height:18px;color:#f3f3f3;word-wrap:break-word;padding-right:36px}.mfp-image-holder .mfp-content{max-width:100%}.mfp-gallery .mfp-image-holder .mfp-figure{cursor:pointer}@media screen and (max-width:800px) and (orientation:landscape),screen and (max-height:300px){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0}.mfp-img-mobile img.mfp-img{padding:0}.mfp-img-mobile .mfp-figure:after{top:0;bottom:0}.mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px}.mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;box-sizing:border-box}.mfp-img-mobile .mfp-bottom-bar:empty{padding:0}.mfp-img-mobile .mfp-counter{right:5px;top:3px}.mfp-img-mobile .mfp-close{top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0,0,0,.6);position:fixed;text-align:center;padding:0}}@media all and (max-width:900px){.mfp-arrow{-webkit-transform:scale(.75);transform:scale(.75)}.mfp-arrow-left{-webkit-transform-origin:0;transform-origin:0}.mfp-arrow-right{-webkit-transform-origin:100%;transform-origin:100%}.mfp-container{padding-left:6px;padding-right:6px}} /*!***************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./assets/src/css/vendors/owl.carousel.min.css ***! \***************************************************************************************************************************/ /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ .owl-carousel, .owl-carousel .owl-item { -webkit-tap-highlight-color: transparent; position: relative; } .owl-carousel { display: none; width: 100%; z-index: 1; } .owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; touch-action: manipulation; -moz-backface-visibility: hidden; } .owl-carousel .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .owl-carousel .owl-stage-outer { position: relative; overflow: hidden; -webkit-transform: translate3d(0, 0, 0); } .owl-carousel .owl-item, .owl-carousel .owl-wrapper { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); } .owl-carousel .owl-item { min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-touch-callout: none; } .owl-carousel .owl-item img { display: block; width: 100%; } .owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled { display: none; } .no-js .owl-carousel, .owl-carousel.owl-loaded { display: block; } .owl-carousel .owl-dot, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev { cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot { background: 0 0; color: inherit; border: none; padding: 0 !important; font: inherit; } .owl-carousel.owl-loading { opacity: 0; display: block; } .owl-carousel.owl-hidden { opacity: 0; } .owl-carousel.owl-refresh .owl-item { visibility: hidden; } .owl-carousel.owl-drag .owl-item { -ms-touch-action: pan-y; touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-grab { cursor: move; cursor: grab; } .owl-carousel.owl-rtl { direction: rtl; } .owl-carousel.owl-rtl .owl-item { float: right; } .owl-carousel .animated { animation-duration: 1s; animation-fill-mode: both; } .owl-carousel .owl-animated-in { z-index: 0; } .owl-carousel .owl-animated-out { z-index: 1; } .owl-carousel .fadeOut { animation-name: fadeOut; } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } .owl-height { transition: height 0.5s ease-in-out; } .owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity 0.4s ease; } .owl-carousel .owl-item .owl-lazy:not([src]), .owl-carousel .owl-item .owl-lazy[src^=""] { max-height: 0; } .owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d; } .owl-carousel .owl-video-wrapper { position: relative; height: 100%; background: #000; } .owl-carousel .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: transform 0.1s ease; } .owl-carousel .owl-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); } .owl-carousel .owl-video-playing .owl-video-play-icon, .owl-carousel .owl-video-playing .owl-video-tn { display: none; } .owl-carousel .owl-video-tn { opacity: 0; height: 100%; transition: opacity 0.4s ease; } .owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; } /*!********************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./assets/src/css/vendors/owl.theme.default.min.css ***! \********************************************************************************************************************************/ /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ .owl-theme .owl-dots, .owl-theme .owl-nav { text-align: center; -webkit-tap-highlight-color: transparent; } .owl-theme .owl-nav { margin-top: 10px; } .owl-theme .owl-nav [class*="owl-"] { color: #fff; font-size: 14px; margin: 5px; padding: 4px 7px; background: #d6d6d6; display: inline-block; cursor: pointer; border-radius: 3px; } .owl-theme .owl-nav [class*="owl-"]:hover { background: #869791; color: #fff; text-decoration: none; } .owl-theme .owl-nav .disabled { opacity: 0.5; cursor: default; } .owl-theme .owl-nav.disabled + .owl-dots { margin-top: 10px; } .owl-theme .owl-dots .owl-dot { display: inline-block; zoom: 1; } .owl-theme .owl-dots .owl-dot span { width: 10px; height: 10px; margin: 5px 7px; background: #d6d6d6; display: block; -webkit-backface-visibility: visible; transition: opacity 0.2s ease; border-radius: 30px; } .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background: #869791; } /*!*******************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./assets/src/css/bundle.scss (3) ***! \*******************************************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /* Theme Name: Khatme Nabuwat Theme URI: http://glidedesign.com Author: Team Glide Author URI: http://glidedesign.com/team Description: WordPress theme by Glide Design Version: 1.0 */ /* ------------------------------------------------------------------ >>> TABLE OF CONTENTS: <<< -------------------------------------------------------------------- > Variables >> Colors >> Columns > Mixins > Fonts > Defaults >> Normalize >> Forms Defaults >> Clearings > Typography >> Headings >> Copy > Elements >> Lists >> Quotes >> Tables >> Images >> Links > Forms >> Buttons >> Fields >> Form Elements > Media >> Captions >> Galleries > WordPress Core >> Accessibility >> Alignments >> Posts & Pages >> Pagination >> Comments >> Widgets > Site >> Layout >>> Header >>> Footer >> Theme >> Blog >> Single >> Home Page >> About Us >> Contact Us >> Burgers Landing >> Single Burger >> Blocks > Responsive >> Regular Queries >> Extra Queries > Import Fonts > Vendors > Owl Carousel > Slick Nav ------------------------------------------------------------------ */ /* ------------------------------------------------------------------ > Variables ------------------------------------------------------------------ */ :root { --kn_base_unit: 0.125rem; --base_unit-half: math.div(var(--kn_base_unit), 2); /*------------------------------------------------- >> Variables for Spaces -------------------------------------------------*/ --space_base_unit: var(--kn_base_unit); /* Mobile Spacer Value */ --kn_space_1_min: var(--space_base_unit) * 1; /* 2px */ --kn_space_2_min: var(--space_base_unit) * 2; /* 4px */ --kn_space_3_min: var(--space_base_unit) * 3; /* 6px */ --kn_space_4_min: var(--space_base_unit) * 5; /* 10px */ --kn_space_5_min: var(--space_base_unit) * 6; /* 12px */ --kn_space_6_min: var(--space_base_unit) * 8; /* 16px */ --kn_space_7_min: var(--space_base_unit) * 11; /* 22px */ --kn_space_8_min: var(--space_base_unit) * 14; /* 28px */ --kn_space_9_min: var(--space_base_unit) * 18; /* 36px */ --kn_space_10_min: var(--space_base_unit) * 21; /* 42px */ --kn_space_11_min: var(--space_base_unit) * 24; /* 48px */ --kn_space_12_min: var(--space_base_unit) * 27; /* 54px */ --kn_space_13_min: var(--space_base_unit) * 30; /* 60px */ --kn_space_14_min: var(--space_base_unit) * 36; /* 72px */ --kn_space_15_min: var(--space_base_unit) * 42; /* 84px */ --kn_space_16_min: var(--space_base_unit) * 48; /* 96px */ /* Desktop Spacer Value */ --kn_space_1_max: var(--space_base_unit) * 1; /* 2px */ --kn_space_2_max: var(--space_base_unit) * 2; /* 4px */ --kn_space_3_max: var(--space_base_unit) * 4; /* 8px */ --kn_space_4_max: var(--space_base_unit) * 6; /* 12px */ --kn_space_5_max: var(--space_base_unit) * 8; /* 16px */ --kn_space_6_max: var(--space_base_unit) * 10; /* 20px */ --kn_space_7_max: var(--space_base_unit) * 18; /* 36px */ --kn_space_8_max: var(--space_base_unit) * 22; /* 44px */ --kn_space_9_max: var(--space_base_unit) * 24; /* 48px */ --kn_space_10_max: var(--space_base_unit) * 30; /* 60px */ --kn_space_11_max: var(--space_base_unit) * 36; /* 72px */ --kn_space_12_max: var(--space_base_unit) * 48; /* 96px */ --kn_space_13_max: var(--space_base_unit) * 60; /* 120px */ --kn_space_14_max: var(--space_base_unit) * 80; /* 160px */ --kn_space_15_max: var(--space_base_unit) * 100; /* 200px */ --kn_space_16_max: var(--space_base_unit) * 120; /* 240px */ --kn_space_1: clamp(var(--kn_space_1_min), 0.125rem + 0vw, var(--kn_space_1_max)); --kn_space_2: clamp(var(--kn_space_2_min), 0.25rem + 0vw, var(--kn_space_2_max)); --kn_space_3: clamp(var(--kn_space_3_min), 0.03790613718411551rem + 0.7220216606498195vw, var(--kn_space_3_max)); --kn_space_4: clamp(var(--kn_space_4_min), 0.2879061371841155rem + 0.7220216606498195vw, var(--kn_space_4_max)); --kn_space_5: clamp(var(--kn_space_5_min), 0.07581227436823101rem + 1.444043321299639vw, var(--kn_space_5_max)); --kn_space_6: clamp(var(--kn_space_6_min), 0.325812274368231rem + 1.444043321299639vw, var(--kn_space_6_max)); --kn_space_7: clamp(var(--kn_space_7_min), -0.9846570397111916rem + 5.054151624548737vw, var(--kn_space_7_max)); --kn_space_8: clamp(var(--kn_space_8_min), -0.9467509025270759rem + 5.776173285198556vw, var(--kn_space_8_max)); --kn_space_9: clamp(var(--kn_space_9_min), 0.22743682310469282rem + 4.332129963898917vw, var(--kn_space_9_max)); --kn_space_10: clamp(var(--kn_space_10_min), -0.40884476534296077rem + 6.498194945848376vw, var(--kn_space_10_max)); --kn_space_11: clamp(var(--kn_space_11_min), -1.0451263537906144rem + 8.664259927797834vw, var(--kn_space_11_max)); --kn_space_12: clamp(var(--kn_space_12_min), 8.407vw + -0.305rem, var(--kn_space_12_max)); --kn_space_13: clamp(var(--kn_space_13_min), -6.362815884476534rem + 21.660649819494584vw, var(--kn_space_13_max)); --kn_space_14: clamp(var(--kn_space_14_min), -10.332129963898918rem + 31.768953068592058vw, var(--kn_space_14_max)); --kn_space_15: clamp(var(--kn_space_15_min), -14.3014440433213rem + 41.87725631768953vw, var(--kn_space_15_max)); --kn_space_16: clamp(var(--kn_space_16_min), -18.270758122743686rem + 51.98555956678701vw, var(--kn_space_16_max)); /* ------------------------------------------------- >> Font Sizes ------------------------------------------------- */ --font_base_unit: var(--kn_base_unit); --kn_font_size_1_min: var(--font_base_unit) * 5.5; /* 11px */ --kn_font_size_2_min: var(--font_base_unit) * 6.5; /* 13px */ --kn_font_size_3_min: var(--font_base_unit) * 7.5; /* 15px */ --kn_font_size_4_min: var(--font_base_unit) * 9; /* 17px */ --kn_font_size_5_min: var(--font_base_unit) * 9; /* 18px */ --kn_font_size_6_min: var(--font_base_unit) * 10; /* 20px */ --kn_font_size_7_min: var(--font_base_unit) * 10; /* 20px */ --kn_font_size_8_min: var(--font_base_unit) * 11; /* 22px */ --kn_font_size_9_min: var(--font_base_unit) * 12; /* 24px */ --kn_font_size_10_min: var(--font_base_unit) * 13; /* 26px */ --kn_font_size_11_min: var(--font_base_unit) * 15; /* 30px */ --kn_font_size_12_min: var(--font_base_unit) * 20; /* 45px */ --kn_font_size_13_min: var(--font_base_unit) * 27.5; /* 55px */ --kn_font_size_1_max: var(--font_base_unit) * 6; /* 12px */ --kn_font_size_2_max: var(--font_base_unit) * 7; /* 14px */ --kn_font_size_3_max: var(--font_base_unit) * 8; /* 16px */ --kn_font_size_4_max: var(--font_base_unit) * 9; /* 18px */ --kn_font_size_5_max: var(--font_base_unit) * 10; /* 20px */ --kn_font_size_6_max: var(--font_base_unit) * 11; /* 22px */ --kn_font_size_7_max: var(--font_base_unit) * 12; /* 24px */ --kn_font_size_8_max: var(--font_base_unit) * 13; /* 26px */ --kn_font_size_9_max: var(--font_base_unit) * 16; /* 32px */ --kn_font_size_10_max: var(--font_base_unit) * 20; /* 40px */ --kn_font_size_11_max: var(--font_base_unit) * 24; /* 48px */ --kn_font_size_12_max: var(--font_base_unit) * 27; /* 60px */ --kn_font_size_13_max: var(--font_base_unit) * 34; /* 68px */ --kn_font_size_1: clamp(var(--kn_font_size_1_min), 0.599906191369606rem + 0.18761726078799248vw, var(--kn_font_size_1_max)); --kn_font_size_2: clamp(var(--kn_font_size_2_min), 0.724906191369606rem + 0.18761726078799248vw, var(--kn_font_size_2_max)); --kn_font_size_3: clamp(var(--kn_font_size_3_min), 0.849624060150376rem + 0.18796992481203006vw, var(--kn_font_size_3_max)); --kn_font_size_4: clamp(var(--kn_font_size_4_min), 0.974624060150376rem + 0.18796992481203006vw, var(--kn_font_size_4_max)); --kn_font_size_5: clamp(var(--kn_font_size_5_min), 0.9492481203007519rem + 0.37593984962406013vw, var(--kn_font_size_5_max)); --kn_font_size_6: clamp(var(--kn_font_size_6_min), 1.074248120300752rem + 0.37593984962406013vw, var(--kn_font_size_6_max)); --kn_font_size_7: clamp(1.25rem, 0.926vw + 0.806rem, 1.5rem); --kn_font_size_8: clamp(var(--kn_font_size_8_min), 1.0234962406015038rem + 0.7518796992481203vw, var(--kn_font_size_8_max)); --kn_font_size_9: clamp(var(--kn_font_size_9_min), 0.15162454873646203rem + 2.888086642599278vw, var(--kn_font_size_9_max)); --kn_font_size_10: clamp(1.875rem, 2.315vw + 0.764rem, 2.5rem); --kn_font_size_11: clamp(var(--kn_font_size_11_min), -1.1588447653429608rem + 6.498194945848376vw, var(--kn_font_size_11_max)); --kn_font_size_12: clamp(2.5rem, 3.241vw + 0.944rem, 3.375rem); --kn_font_size_13: clamp(var(--kn_font_size_13_min), 0.9092960288808665rem + 5.415162454873646vw, var(--kn_font_size_13_max)); /* ------------------------------------------------- >> Line Height ------------------------------------------------- */ --kn_line_height_base_unit: 0.063rem; --line_height_xsmall: calc(var(--kn_line_height_base_unit) * 1); --line_height_small: calc(var(--kn_line_height_base_unit) * 1.1); --line_height_medium: calc(var(--kn_line_height_base_unit) * 1.3); --line_height_large: calc(var(--kn_line_height_base_unit) * 1.4); --line_height_xlarge: calc(var(--kn_line_height_base_unit) * 1.5); /* ------------------------------------------------- >> Letter Spacing ------------------------------------------------- */ --kn_letter_spacing_base_unit: 1rem; --letter_spacing_xsmall: calc(var(--kn_letter_spacing_base_unit) * 0); --letter_spacing_small: calc(var(--kn_letter_spacing_base_unit) * -0.5); --letter_spacing_medium: normal; --letter_spacing_large: calc(var(--kn_letter_spacing_base_unit) * 1); --letter_spacing_xlarge: calc(var(--kn_letter_spacing_base_unit) * 1.5); /* ------------------------------------------------- >> Border Radius ------------------------------------------------- */ --border_radius_small: calc(var(--kn_base_unit) * 1); --border_radius_medium: calc(var(--kn_base_unit) * 2); --border_radius_large: calc(var(--kn_base_unit) * 2); /* ------------------------------------------------- >> Color variables ------------------------------------------------- */ /* >> Base Colors */ --kn_color_primary: #ffdb16; --kn_color_on_primary: #2f4640; --kn_color_secondary: #007F5F; --kn_white: #ffffff; --kn_brown: #ffdb16; --kn_brown_2: #FFE484; --kn_brown_3: rgba(255, 228, 132, .6); --kn_black: #222222; --kn_green: #007F5F; --kn_green_2: rgba(0, 127, 95, .85); --kn_green_3: #1A472A; --kn_blue: #002366; --kn_blue_2: rgba(0, 35, 102, .7); --kn_blue_3: rgba(0, 35, 102, .8); --kn_gray: #F5F5F5; --kn_gray_2: #8B8B8B; --kn_red: #bf262b; --kn_transparent: transparent; --kn_regular_text: #222222; --kn_dark_text: #111111; --kn_white_text: #fff; --kn_success: #134b38; --kn_info: #0dcaf0; --kn_warning: #ffc107; --kn_danger: #bf262b; --kn_light: #faf7ee; --kn_dark: #333834; --kn_signal: #bf262b; --kn_signal_bg: #fbede9; --kn_color_background: #ffffff; --kn_color_on_background: #222222; --kn_border: rgba(212, 175, 55, .5); --kn_border1: #002366; --kn_border2: #222222; --kn_border_3: #007F5F; --kn_border_4: #ffdb16; --kn_border_5: #000000; --kn_border_6: #ffffff; --kn_border_7: #FFE484; /* ------------------------------------------------- >> Base Colors >> Base colors are used for essential elements such as the logo, tables, links, blockquote, default buttons styling and this should't conflict with theme colors ------------------------------------------------- */ --kn_body_color: var(--kn_color_on_background); --kn_body_bg: var(--kn_color_background); --kn_text_strong: var(--kn_black); --kn_white_text: var(--kn_white); --kn_highlight_color: var(--kn_color_on_primary); --kn_highlight_bg: var(--kn_color_primary); --kn_caption: var(--kn_black_2); --kn_heading_color: var(--kn_regular_text); --kn_link_color: var(--kn_blue); --kn_link_color_hover: var(--kn_color_primary); --kn_link_border_color: var(--kn_border1); --kn_link_border_color_hover: transparent; --kn_list_ul_marker_color: var(--kn_color_primary); --kn_list_ol_marker_color: var(--kn_color_primary); --kn_blockquote_color: var(--kn_regular_text); --kn_blockquote_border_color: var(--kn_regular_text); --kn_quote_color: var(--kn_regular_text); --kn_blockqoute_cite_color: var(--kn_light_text); --kn_table_border_color: var(--kn_border); --kn_table_head_border_color: var(--kn_dark_text); --kn_table_foot_border_color: var(--kn_dark_text); --kn_strong_color: var(--kn_regular_text); --kn_underline_border_color: var(--kn_regular_text); --kn_abbr_border_color: var(--kn_regular_text); --kn_delete_color: var(--kn_danger); --kn_insert_color: var(--kn_success); --kn_insert_border_color: var(--kn_success); --kn_code_color: var(--kn_white_text); --kn_code_bgcolor: var(--kn_dark_text); --kn_pre_color: var(--kn_white_text); --kn_pre_bgcolor: var(--kn_dark_text); --kn_mark_bgcolor: var(--kn_dark_text); --kn_mark_color: var(--kn_white_text); --kn_hr_color: var(--kn_border); --kn_input_color: var(--kn_dark_text); --kn_input_bg: var(--kn_mgray); --kn_input_border_color: var(--kn_border); --kn_input_focus_color: var(--kn_black); --kn_input_focus_bgcolor: var(--kn_white); --kn_input_focus_border_color: var(--kn_border_2); --kn_disabled_input_bgcolor: var(--kn_field_bg); --kn_disabled_input_border_color: var(--kn_border_1); --kn_placeholder_color: var(--kn_gray_2); --kn_range_track_bgcolor: var(--kn_field_bg); --kn_range_thumb_bgcolor: var(--kn_color_primary); --kn_color_field_border_color: var(--kn_border); --kn_color_field_bgcolor: var(--kn_field_bg); --kn_radio_color: var(--kn_regular_text); --kn_radio_border_color: var(--kn_border); --kn_radio_bgcolor: var(--kn_field_bg); --kn_radio_after_bgcolor: var(--kn_color_primary); --kn_checkbox_color: var(--kn_regular_text); --kn_checkbox_border_color: var(--kn_border); --kn_checkbox_bgcolor: var(--kn_field_bg); --kn_checkbox_after_bgcolor: var(--kn_color_primary); --kn_progress_bgcolor: var(--kn_field_bg); --kn_progress_value_bgcolor: var(--kn_color_primary); --kn_meter_bgcolor: var(--kn_field_bg); --kn_meter_value_bgcolor: var(--kn_color_primary); --kn_button_color: var(--kn_color_secondary); --kn_button_bgcolor: var(--kn_color_primary); --kn_button_color_hover: var(--kn_color_secondary); --kn_button_bgcolor_hover: var(--kn_brown_2); --kn_reset_button_bgcolor: var(--kn_button_bgcolor); --kn_reset_button_color: var(--kn_white_text); --kn_theme_btn_color: var(--kn_button_color); --kn_theme_btn_bgcolor: var(--kn_button_bgcolor); --kn_theme_btn_color_hover: var(--kn_button_color_hover); --kn_theme_btn_bgcolor_hover: var(--kn_button_bgcolor_hover); --kn_theme_btn_border_color: var(--kn_button_border_color); --kn_theme_btn_border_color_hover: var(--kn_button_border_color_hover); --kn_datepicker_bg_color: var(--kn_gray); --kn_datepicker_select_bgcolor: var(--kn_white); --kn_datepicker_link_color: var(--kn_color_secondary); --kn_datepicker_link_active_color: var(--kn_color_primary); --kn_datepicker_calendar: var(--kn_white_text); --kn_datepicker_th_bgcolor: var(--kn_border_1); --kn_datepicker_even_tr_td_bgcolor: var(--kn_border_1); --kn_datepicker_border_color: var(--kn_border_1); --kn_datepicker_date_color: var(--kn_dark_text); --kn_valiation_error_bg_color: var(--kn_danger_bg); --kn_valiation_message_color: var(--kn_danger); --kn_error_field_border_color: var(--kn_danger); --kn_valiation_error_color: var(--kn_danger); --kn_confirmation_message_bgcolor: var(--kn_success_bg); --kn_confirmation_message_color: var(--kn_dark_text); --kn_confirmation_message_border_color: var(--kn_danger); --kn_required_text_color: var(--kn_danger); --kn_invalid_error_border_color: var(--kn_danger); --kn_hubspot_error_label_color: var(--kn_danger); --kn_hubspot_required_color: var(--kn_danger); --kn_fileupload_rule_color: var(--kn_light_text); --kn_error_menu_color: var(--kn_dark_text); --kn_acc_btn_color: var(--kn_white_text); --kn_acc_btn_bgcolor: var(--kn_button_bg); --kn_acc_btn_shadow: var(--kn_danger); --kn_comments_reply_btn_bgcolor: var(--kn_button_bg); --kn_comments_reply_btn_color: var(--kn_white_text); --kn_comments_reply_btn_bgcolor_hover: var(--kn_button_bg_hover); --kn_comments_reply_btn_color_hover: var(--kn_white_text); --kn_comment_meta_color: var(--kn_dark_text); --kn_comment_metadata_color: var(--kn_light_text); --kn_comments_list_border_color: var(--kn_border); --kn_widget_comments_meta_color: var(--kn_light_text); --kn_pagination_bgcolor: var(--kn_color_primary); --kn_pagination_color: var(--kn_color_secondary); --kn_pagination_color_hover: var(--kn_color_secondary); --kn_pagination_bgcolor_hover: var(--kn_brown_2); --kn_pagination_bgcolor_current: var(--kn_brown_2); --kn_pagination_color_current: var(--kn_color_secondary); --kn_pagination_first_bgcolor: var(--kn_brown_2); --kn_pagination_first_color: var(--kn_color_secondary); --kn_pagination_border: var(--kn_transparent); --kn_widget_latest_post_meta_color: var(--kn_danger); --kn_widget_rss_feed_meta_color: var(--kn_danger); --kn_widget_search_button_color: var(--kn_pure_black); --kn_wp_table_block_stripe_bg_color: var(--kn_pure_white); --kn_breadcrumb_color: var(--kn_white); --kn_breadcrumb_link_color: var(--kn_color_primary); --kn_breadcrumb_border_color: transparent; --kn_breadcrumb_border_color_hover: var(--kn_pure_black); --kn_breadcrumb_span_color: var(--kn_white); --kn_header_bgcolor: var(--kn_color_secondary); --kn_header_color: var(--kn_white); --kn_header_color_hover: var(--kn_black); --kn_header_bgcolor_sticky: var(--kn_white); --kn_header_nav_border_color: var(--kn_white); --kn_header_submenu_bgcolor: var(--kn_white); --kn_header_submenu_color: var(--kn_blue); --kn_header_submenu_color_hover: var(--kn_brown); --kn_header_mobile_color: var(--kn_link_color); --kn_header_mobile_submenu_color: var(--kn_color_primary); --kn_nav_overlay_bgcolor: var(--kn_white); --kn_mobile_nav_icon_bgcolor: var(--kn_white); --kn_abbr_border: var(--kn_dark_text); --kn_topbar_bgcolor: var(--kn_color_primary); --kn_topbar_color: var(--kn_color_secondary); --kn_topbar_link_color: var(--kn_color_secondary); --kn_footer_bgcolor: var(--kn_color_secondary); --kn_footer_color: var(--kn_white_text); --kn_footer_color_hover: var(--kn_white_text); --kn_f_nav_color: var(--kn_footer_color); --kn_f_nav_color_hover: var(--kn_footer_color_hover); --kn_f_nav_border_color: var(--kn_footer_color); --kn_f_nav_border_color_hover: var(--kn_footer_color_hover); --kn_copyright_color: var(--kn_white_text); --kn_legal_nav_color: var(--kn_white_text); --kn_legal_nav_border_color: var(--kn_white_text); --kn_legal_nav_border_color_hover: var(--kn_white_text); --kn_legal_text_color: var(--kn_white_text); --kn_ctn_red: var(--kn_red); --kn_ctn_black: var(--kn_black); --kn_ctn_sea_green: var(--kn_sea_green); --kn_style_bg: #821212; --kn_style_text: #000000; --kn_style_link: #000000; --kn_style_button: #00a4eb; } /* ------------------------------------------------------------------ > Mixins ------------------------------------------------------------------ */ /* Rem output with px fallback */ /* Rem output with px fallback with !important */ /* Column width with margin */ /* Column width with margin */ /* Mixin for transition */ /* ------------------------------------------------------------------ > Fonts ------------------------------------------------------------------ */ /* ------------------------------------------------------------------ > Defaults ------------------------------------------------------------------ */ /*------------------------------------------------- >> Normalize styles -------------------------------------------------*/ /*------------------------------------------------- >> Base Styles --------------------------------------------------- >> Do not edit these styles -------------------------------------------------*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; outline: 0; vertical-align: baseline; } *, *::before, *::after { box-sizing: inherit; } html { -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004); scroll-behavior: smooth; scroll-padding: 140px; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } a { background-color: transparent; -webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004); } img { border-style: none; } summary { display: list-item; } template, [hidden] { display: none; } /*------------------------------------------------- >> Clearing styles -------------------------------------------------*/ .clear { content: ""; display: table; table-layout: fixed; clear: both; } .clear::before, .clear::after { clear: both; } /* ------------------------------------------------------------------ > Typography ------------------------------------------------------------------ */ /*------------------------------------------------- >> Styles for headings -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ h1, \ .heading-1, h2, .heading-2, h3, .heading-3, h4, .heading-4, h5, .heading-5, h6, .heading-6 { margin: 0 0 20px; color: var(--kn_heading_color); font-family: "PT Serif", Georgia, serif; line-height: 1.3; font-weight: 700; } h1 mark, \ .heading-1 mark, h2 mark, .heading-2 mark, h3 mark, .heading-3 mark, h4 mark, .heading-4 mark, h5 mark, .heading-5 mark, h6 mark, .heading-6 mark { background-color: transparent; padding: 0; color: var(--kn_green); } h1 a, \ .heading-1 a, h2 a, .heading-2 a, h3 a, .heading-3 a, h4 a, .heading-4 a, h5 a, .heading-5 a, h6 a, .heading-6 a { color: var(--kn_heading_link_color); border-bottom: none; font-weight: 700; font-family: "PT Serif", Georgia, serif; text-decoration: underline; } h1 a:hover, \ .heading-1 a:hover, h2 a:hover, .heading-2 a:hover, h3 a:hover, .heading-3 a:hover, h4 a:hover, .heading-4 a:hover, h5 a:hover, .heading-5 a:hover, h6 a:hover, .heading-6 a:hover { color: var(--kn_heading_link_color_hover); } h1, .heading-1, h2, .heading-2 { color: var(--kn_color_secondary); } h1, .heading-1 { font-size: var(--kn_font_size_12); } h2, .heading-2 { font-size: var(--kn_font_size_10); } h3, .heading-3 { font-size: var(--kn_font_size_8); } h4, .heading-4 { font-size: var(--kn_font_size_7); } h5, .heading-5 { font-size: var(--kn_font_size_5); } h6, .heading-6 { font-size: var(--kn_font_size_4); } /*------------------------------------------------- >> Styles for content tags -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ i, em, var, address, dfn { font-style: italic; } code, pre, kbd, tt, var, samp { font-family: monospace; } abbr, acronym { border-bottom: 1px dotted var(--kn_abbr_border_color); text-decoration: none; cursor: help; } abbr[title] { text-decoration: none; } address { margin: 0 0 30px; } mark { background-color: var(--kn_mark_bgcolor); color: var(--kn_mark_color); padding: 3px 7px; } small { font-size: 80%; } big { font-size: 125%; } s, strike, del { text-decoration: line-through; } b, strong { font-weight: 700; color: var(--kn_strong_color); } u { border-bottom: 1px solid var(--kn_underline_border_color); text-decoration: none; } del { color: var(--kn_delete_color); } ins { color: var(--kn_insert_color); border-bottom: 1px solid var(--kn_insert_border_color); text-decoration: none; } sub, sup { font-size: 70%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -4px; } sup { top: -8px; } code, pre, kbd, tt { max-width: 100%; overflow: auto; margin: 0 0 30px; } code, kbd, tt { color: var(--kn_code_color); background-color: var(--kn_code_bgcolor); padding: 3px 7px; } pre { color: var(--kn_pre_color); background-color: var(--kn_pre_bgcolor); padding: 20px 25px; overflow-x: scroll; } hr { background-color: var(--kn_hr_bgcolor); border: 0; height: 1px; margin-bottom: 30px; } audio, video { margin-bottom: 30px; width: 100%; } /* ------------------------------------------------------------------ > Elements ------------------------------------------------------------------ */ /*------------------------------------------------- >> Styles for tables -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ body { position: relative; font-size: var(--kn_font_size_3); color: var(--kn_body_color); line-height: 1.5; padding-top: 120px; } p { margin: 0 0 30px; } p:last-of-type { margin-bottom: 0; } ::-moz-selection { color: var(--kn_color_secondary); background-color: var(--kn_highlight_bg); } ::selection { color: var(--kn_color_secondary); background-color: var(--kn_highlight_bg); } strong { color: var(--kn_text_strong) !important; } .english-language { font-family: "Open Sans", sans-serif; line-height: 1.5; } .english-language h1, .english-language .heading-1, .english-language h2, .english-language .heading-2, .english-language h3, .english-language .heading-3, .english-language h4, .english-language .heading-4, .english-language h5, .english-language .heading-5, .english-language h6, .english-language .heading-6 { font-family: "PT Serif", Georgia, serif; line-height: 1.3; } .english-language h1 a, .english-language .heading-1 a, .english-language h2 a, .english-language .heading-2 a, .english-language h3 a, .english-language .heading-3 a, .english-language h4 a, .english-language .heading-4 a, .english-language h5 a, .english-language .heading-5 a, .english-language h6 a, .english-language .heading-6 a { font-family: "PT Serif", Georgia, serif; } .english-language a { font-family: "Open Sans", sans-serif; } .english-language input[type=text], .english-language input[type=number], .english-language input[type=email], .english-language input[type=tel], .english-language input[type=url], .english-language input[type=search], .english-language input[type=password], .english-language input[type=time], .english-language input[type=date], .english-language input[type=datetime-local], .english-language input[type=week], .english-language input[type=month], .english-language input[type=file], .english-language input[type=range], .english-language input[list], .english-language input[type=string], .english-language select, .english-language textarea, .english-language .gform-text-input-reset { font-family: "Open Sans", sans-serif; } .english-language ul ul, .english-language ol ol, .english-language ul ol, .english-language ol ul { margin: 12px 0 0 30px; } .english-language ul, .english-language ol { margin: 0 0 30px 20px; } .english-language .page-section ul ul, .english-language .page-section ul ol { margin-left: 13px; } .english-language .page-section ul li { padding-left: 20px; } .english-language .page-section ul li::before { background-position: left top; left: 0; } .english-language .page-section ol { margin-left: 0; } .english-language .page-section ol ol, .english-language .page-section ol ul { margin-left: 13px; } .english-language .page-section ol > li { padding-left: 24px; } .english-language .page-section ol > li::before { left: 0; } .english-language .page-section ol ol li { padding-left: 34px; } .english-language .page-section ol ol ol li { padding-left: 64px; } .english-language .page-section ol ol ol ol li { padding-left: 80px; } .english-language .page-section ol ul li { padding-left: 20px; } .english-language .page-section ol ul li::before { background-position: left top; left: 0; } .urdu-language { font-family: "Jameel Noori Nastaleeq", serif; line-height: 1.7; font-size: clamp(1rem, 0.231vw + 0.889rem, 1.063rem); } .urdu-language a { font-family: "Jameel Noori Nastaleeq", serif; font-weight: 400; } .urdu-language h1, .urdu-language .heading-1, .urdu-language h2, .urdu-language .heading-2, .urdu-language h3, .urdu-language .heading-3, .urdu-language h4, .urdu-language .heading-4, .urdu-language h5, .urdu-language .heading-5, .urdu-language h6, .urdu-language .heading-6 { line-height: 1.5; } .urdu-language h1 a, .urdu-language h1 a:visited, .urdu-language .heading-1 a, .urdu-language .heading-1 a:visited, .urdu-language h2 a, .urdu-language h2 a:visited, .urdu-language .heading-2 a, .urdu-language .heading-2 a:visited, .urdu-language h3 a, .urdu-language h3 a:visited, .urdu-language .heading-3 a, .urdu-language .heading-3 a:visited, .urdu-language h4 a, .urdu-language h4 a:visited, .urdu-language .heading-4 a, .urdu-language .heading-4 a:visited, .urdu-language h5 a, .urdu-language h5 a:visited, .urdu-language .heading-5 a, .urdu-language .heading-5 a:visited, .urdu-language h6 a, .urdu-language h6 a:visited, .urdu-language .heading-6 a, .urdu-language .heading-6 a:visited { font-weight: 700; } .urdu-language .jump-links-ctn a, .urdu-language .jump-links-ctn a:visited { font-size: clamp(1.25rem, 0.462vw + 1.029rem, 1.375rem); } .urdu-language input[type=text], .urdu-language input[type=number], .urdu-language input[type=email], .urdu-language input[type=tel], .urdu-language input[type=url], .urdu-language input[type=search], .urdu-language input[type=password], .urdu-language input[type=time], .urdu-language input[type=date], .urdu-language input[type=datetime-local], .urdu-language input[type=week], .urdu-language input[type=month], .urdu-language input[type=file], .urdu-language input[type=range], .urdu-language input[list], .urdu-language input[type=string], .urdu-language select, .urdu-language textarea, .urdu-language .gform-text-input-reset { font-family: "Jameel Noori Nastaleeq", serif; } .urdu-language ul ul, .urdu-language ol ol, .urdu-language ul ol, .urdu-language ol ul { margin: 12px 30px 0 0; } .urdu-language ul, .urdu-language ol { margin: 0 20px 30px 0; } .urdu-language .page-section ul ul, .urdu-language .page-section ul ol { margin-right: 13px; } .urdu-language .page-section ul li { padding-right: 20px; } .urdu-language .page-section ul li::before { right: 0; background-position: right top; } .urdu-language .page-section ol { margin-right: 0; } .urdu-language .page-section ol ol, .urdu-language .page-section ol ul { margin-right: 13px; } .urdu-language .page-section ol > li { padding-right: 24px; } .urdu-language .page-section ol > li::before { right: 0; } .urdu-language .page-section ol ol li { padding-right: 34px; } .urdu-language .page-section ol ol ol li { padding-right: 64px; } .urdu-language .page-section ol ol ol ol li { padding-right: 80px; } .urdu-language .page-section ol ul li { padding-right: 20px; } .urdu-language .page-section ol ul li::before { background-position: right top; right: 0; } .english-language .header-nav ul, .urdu-language .header-nav ul, .arabic-language .header-nav ul { margin: 0; } /*------------------------------------------------- >> Styles for links -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Do not edit these styles ------------------------------------------------- */ a { text-decoration: none; transition: all 0.3s ease-in-out; outline: none; position: relative; font-weight: 600; color: var(--kn_link_color); font-family: "Open Sans", sans-serif; } /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ .page-section a, .page-section:visited { border-bottom: none; line-height: 1.3; } .page-section a:hover, .page-section a:active, .page-section:visited:hover, .page-section:visited:active { color: var(--kn_link_color_hover); } .post-image a, .post-image:visited, .post-title a, .post-title:visited { border-bottom: none; } /*------------------------------------------------- >> Styles for images and figures -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Do not edit these styles ------------------------------------------------- */ img { height: auto; max-width: 100%; } a img { border: none; outline: none; margin-bottom: 0; } /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ img, video, audio, embed, iframe, figure, figure img { border-radius: 8px; } figure { margin: 0 0 30px; } figure figcaption { color: var(--kn_caption); font-size: 90%; margin: 0 0 30px; } picture { margin: 0 0 30px; display: inline-block; } svg { margin: 0 0 30px; } .gallery .gallery-item a { border-bottom: none; } figure.wp-block-image.alignfull.size-thumbnail { margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); max-width: 100vw; } figure.wp-block-image.alignwide.size-thumbnail { margin: 0 -200px; max-width: 140%; } /*------------------------------------------------- >> Styles for lists -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Do not edit these styles ------------------------------------------------- */ header ul, header ol, footer ul, footer ol { list-style: none; } /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ dl { margin: 0 0 30px; } dl dt { font-weight: 700; } dl dd { margin: 0 0 12px; } ul li, ol li { margin: 0 0 12px; box-sizing: border-box; position: relative; } .page-section ul { list-style: none; } .page-section ul li::before { content: ""; width: 7px; height: 7px; position: absolute; background-color: var(--kn_list_ul_marker_color); top: 9px; border-radius: 50%; } .page-section ul ol { counter-reset: list1; } .page-section ul ol > li::before { counter-increment: list1; content: counters(list1, ".") "."; } .page-section ol { counter-reset: list; list-style-type: none; } .page-section ol > li { position: relative; } .page-section ol > li::marker { display: none; } .page-section ol > li::before { color: var(--kn_list_ol_marker_color); content: counters(list, ".") "."; counter-increment: list; top: 0; position: absolute; background-color: transparent; } .page-section ol ul { counter-reset: unset; } .page-section ol ul li::before { content: ""; width: 7px; height: 7px; background-position: left top; position: absolute; background-color: var(--kn_list_ul_marker_color); top: 9px; } /*------------------------------------------------- >> Styles for quotes -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ blockquote, q { quotes: none; } blockquote { position: relative; color: var(--kn_blockquote_color); border-left: 3px solid var(--kn_blockquote_border_color); padding: 5px 0 5px 20px; margin: 0 0 30px; } blockquote p { margin-bottom: 15px; } blockquote p:last-child { margin-bottom: 0; } .wp-block-quote.has-text-align-right { border-left: none; border-right: 3px solid var(--kn_blockquote_border_color); padding: 5px 20px 5px 0; } .wp-block-quote.has-text-align-right.is-style-plain { border-right: none; } .wp-block-quote.has-text-align-left.is-style-plain { border-left: none; padding: 0; } .wp-block-quote.has-text-align-center { border-left: none; padding: 20px 5px; } .wp-block-quote.is-style-plain { border-left: none; } .wp-block-quote.is-style-large { border-left: 0; } figure.wp-block-pullquote { border-top: 3px solid var(--kn_blockquote_border_color); border-bottom: 3px solid var(--kn_blockquote_border_color); padding-left: 10px; padding-right: 10px; } figure.wp-block-pullquote blockquote { border-left: none; margin-bottom: 0; padding: 10px; } figure.wp-block-pullquote.alignleft, figure.wp-block-pullquote.alignright { padding: 35px 10px; } q { quotes: "“" "”"; color: var(--kn_quote_color); position: relative; } cite { display: block; margin-top: 15px; font-size: 80%; text-transform: uppercase; font-weight: 500; color: var(--kn_blockqoute_cite_color); font-family: "IBM Plex Mono", monospace; font-style: italic; position: relative; } cite::before { content: "- "; display: inline-block; top: -11px; } /*------------------------------------------------- >> Styles for tables -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ table { border-collapse: collapse; border-spacing: 0; margin: 0 0 30px; width: 100%; table-layout: fixed; text-align: left; box-sizing: border-box; } table p:last-child { margin-bottom: 0; } table caption { color: var(--kn_caption_color); font-size: 90%; margin: 0 0 20px; } tr, tbody tr { border-bottom: 1px solid var(--kn_table_border_color); } tr:last-child, tbody tr:last-child { border-bottom: none; } td, th { padding: 10px 15px; vertical-align: middle; } thead tr { border: none; } thead tr:last-child { border-bottom: 3px solid var(--kn_table_head_border_color); } thead th { font-weight: 700; } tfoot tr { border: none; } tfoot tr:first-child { border-top: 3px solid var(--kn_table_foot_border_color); } tfoot td { font-weight: 700; } .wp-block-table tbody td { border: 2px solid var(--kn_table_border_color); } .wp-block-table.is-style-stripes tbody tr, .wp-block-table.is-style-stripes tbody td { border: none; } .wp-block-table.is-style-stripes tfoot tr { border-top: 3px solid var(--kn_table_head_border_color); } .wp-block-table.is-style-stripes .has-background tbody tr:nth-child(odd) { background-color: transparent; } .wp-block-table table.has-background tbody td, .wp-block-table table.has-background tbody tr { border: none; } .wp-block-table table.has-background tfoot tr { border-top: 3px solid var(--kn_table_head_border_color); } /*------------------------------------------------- >> Styles for frames and embeds -------------------------------------------------*/ /*------------------------------------------------- >> Base Styles --------------------------------------------------- >> Do not edit these styles -------------------------------------------------*/ embed, iframe, object { max-width: 100%; } /*------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required -------------------------------------------------*/ /* ------------------------------------------------------------------ > Forms ------------------------------------------------------------------ */ /* ------------------------------------------------- >> Styles for form fields ------------------------------------------------- */ /* ------------------------------------------------- >> Styles for form Input fields ------------------------------------------------- */ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ form { margin: 0 0 20px; } label { margin: 0 0 6px; display: inline-block; line-height: 1.2; } fieldset { margin: 10px 0 30px; display: block; } legend { display: block; margin: 0 0 10px; } input[type=text], input[type=number], input[type=email], input[type=tel], input[type=url], input[type=search], input[type=password], input[type=time], input[type=date], input[type=datetime-local], input[type=week], input[type=month], input[type=file], input[type=range], input[list], input[type=string], select, textarea, .gform-text-input-reset { font-family: "Open Sans", sans-serif; font-size: var(--kn_font_size_3); height: 44px; width: 100%; border: 1px solid var(--kn_border1); background-color: var(--kn_input_bg); color: var(--kn_input_color); outline: none; padding: 0 20px; margin: 0 0 16px; max-width: 100%; box-sizing: border-box; border-radius: 6px; transition: all 0.4s ease-in-out; } input[type=text]:focus, input[type=number]:focus, input[type=email]:focus, input[type=tel]:focus, input[type=url]:focus, input[type=search]:focus, input[type=password]:focus, input[type=time]:focus, input[type=date]:focus, input[type=datetime-local]:focus, input[type=week]:focus, input[type=month]:focus, input[type=file]:focus, input[type=range]:focus, input[list]:focus, input[type=string]:focus, select:focus, textarea:focus, .gform-text-input-reset:focus { border-color: var(--kn_border_4); background-color: var(--kn_white); } ::input-placeholder { color: var(--kn_placeholder_color); } ::input-placeholder { color: var(--kn_placeholder_color); } ::-moz-placeholder { color: var(--kn_placeholder_color); } ::placeholder { color: var(--kn_placeholder_color); } input[type=text]:disabled { background-color: var(--kn_disabled_input_bgcolor); border: 1px solid var(--kn_disabled_input_border_color); } input[type=hidden], datalist { display: none; } input[type=file] { padding: 9px; } input[type=search] { padding-right: 45px; position: relative; background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBmaWxsPSIjMDAyMzY2IiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgMTkyMCAxOTIwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHN0cm9rZT0iIzAwMjM2NiIgc3Ryb2tlLXdpZHRoPSIxOS4yIj4KDTxnIGlkPSJTVkdSZXBvX2JnQ2FycmllciIgc3Ryb2tlLXdpZHRoPSIwIi8+Cg08ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KDTxnIGlkPSJTVkdSZXBvX2ljb25DYXJyaWVyIj4gPHBhdGggZD0iTTc5MC41ODggMTQ2OC4yMzVjLTM3My43MjIgMC02NzcuNjQ3LTMwMy45MjQtNjc3LjY0Ny02NzcuNjQ3IDAtMzczLjcyMiAzMDMuOTI1LTY3Ny42NDcgNjc3LjY0Ny02NzcuNjQ3IDM3My43MjMgMCA2NzcuNjQ3IDMwMy45MjUgNjc3LjY0NyA2NzcuNjQ3IDAgMzczLjcyMy0zMDMuOTI0IDY3Ny42NDctNjc3LjY0NyA2NzcuNjQ3Wm01OTYuNzgxLTE2MC43MTVjMTIwLjM5Ni0xMzguNjkyIDE5My44MDctMzE5LjI4NSAxOTMuODA3LTUxNi45MzJDMTU4MS4xNzYgMzU0Ljc0OCAxMjI2LjQyOCAwIDc5MC41ODggMFMwIDM1NC43NDggMCA3OTAuNTg4czM1NC43NDggNzkwLjU4OCA3OTAuNTg4IDc5MC41ODhjMTk3LjY0NyAwIDM3OC4yNC03My40MTEgNTE2LjkzMi0xOTMuODA3bDUxNi4wMjggNTE2LjE0MiA3OS45NjMtNzkuOTYzLTUxNi4xNDItNTE2LjAyOFoiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPiA8L2c+Cg08L3N2Zz4=); background-repeat: no-repeat; background-position: center right 12px; background-size: 20px; } /* clears the ‘X’ from Internet Explorer */ input[type=search]::-ms-clear { display: none; width: 0; height: 0; } input[type=search]::-ms-reveal { display: none; width: 0; height: 0; } /* clears the ‘X’ from Chrome */ input[type=search]::-webkit-search-decoration, input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-results-button, input[type=search]::-webkit-search-results-decoration { display: none; } input[type=color] { border: 1px solid var(--kn_color_field_border_color); background-color: var(--kn_color_field_bgcolor); height: 25px; width: 50px; margin: 0 0 20px; padding: 3px; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; } ::-webkit-color-swatch-wrapper { padding: 0; } ::-webkit-color-swatch { border: 0; border-radius: 0; } ::-moz-color-swatch, ::-moz-focus-inner { border: 0; } ::-moz-focus-inner { padding: 0; } select { cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; position: relative; background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDU2IDMyIiB3aWR0aD0iNTYiIGhlaWdodD0iMzIiPgoJPHRpdGxlPmRvd24tYXJyb3ctYmFja3VwLTItc3ZncmVwby1jb208L3RpdGxlPgoJPHN0eWxlPgoJCS5zMCB7IGZpbGw6ICMwMDIzNjYgfSAKCTwvc3R5bGU+Cgk8ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiPgoJPC9nPgoJPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciI+Cgk8L2c+Cgk8ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+CgkJPHBhdGggY2xhc3M9InMwIiBkPSJtNTIuNSAwbDMuNSAzLjItMjggMjguOC0yOC0yOC44IDMuNS0zLjIgMjQuNSAyNS4yeiIvPgoJPC9nPgo8L3N2Zz4=); background-repeat: no-repeat; background-position: center right 12px; background-size: 17px; } .ginput_container_multiselect select { min-height: 77px; } textarea { padding: 10px 0 0 10px; height: 150px; resize: none; overflow: auto; } .gfield, .hs-form-field { box-sizing: border-box; position: relative; } .gfield_list_icons { margin-top: 20px; } /* ------------------------------------------------- >> Styles for buttons ------------------------------------------------- */ /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ input[type=image] { margin: 0 10px 0 0; } input[type=submit], button, input[type=button], input[type=reset] { padding: 0 30px; display: inline-block; line-height: 1; box-sizing: border-box; font-weight: 600; transition: all 0.4s ease-in-out; border-radius: 6px; background-color: var(--kn_button_bgcolor); border: 1px solid var(--kn_button_bgcolor); color: var(--kn_button_color); outline: none; font-size: var(--kn_font_size_3); height: 44px; cursor: pointer; margin: 0 10px 10px 0; } input[type=submit]:hover, button:hover, input[type=button]:hover { color: var(--kn_button_color_hover); background-color: var(--kn_button_bgcolor_hover); border-color: var(--kn_border_7); } input[type=reset] { background-color: var(--kn_theme_btn_bgcolor); color: var(--kn_theme_btn_color); } input[type=reset]:hover { color: var(--kn_theme_btn_color); background-color: var(--kn_theme_btn_bgcolor_hover); } .is-style-fill-boxed a.wp-block-button__link { border-radius: inherit; } .is-style-outline-boxed a.wp-block-button__link { color: black; border-radius: inherit; background-color: transparent; background-image: none; } /* ------------------------------------------------- >> Default styles for CheckBoxes ------------------------------------------------- */ /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ [type=checkbox]:checked, [type=checkbox]:not(:checked) { position: absolute; left: -9999px; } [type=checkbox]:checked + label, [type=checkbox]:not(:checked) + label, [type=checkbox]:checked + span, [type=checkbox]:not(:checked) + span { position: relative; padding-left: 26px; cursor: pointer; line-height: 20px; display: inline-block; color: var(--kn_checkbox_color); box-sizing: border-box; margin: 0 20px 10px 0; } [type=checkbox]:checked + label::before, [type=checkbox]:not(:checked) + label::before, [type=checkbox]:checked + span::before, [type=checkbox]:not(:checked) + span::before { content: ""; position: absolute; left: 0; top: 0; width: 18px; height: 18px; border: 1px solid var(--kn_checkbox_border_color); background-color: var(--kn_checkbox_bgcolor); } [type=checkbox]:checked + label::after, [type=checkbox]:not(:checked) + label::after, [type=checkbox]:checked + span::after, [type=checkbox]:not(:checked) + span::after { content: ""; width: 10px; height: 10px; background-color: var(--kn_checkbox_after_bgcolor); position: absolute; top: 4px; left: 4px; transition: all 0.2s ease; } [type=checkbox]:not(:checked) + label::after, [type=checkbox]:not(:checked) + span::after { opacity: 0; transform: scale(0); } [type=checkbox]:checked + label::after, [type=checkbox]:checked + span::after { opacity: 1; transform: scale(1); } /* ------------------------------------------------- >> Default styles for Radio Buttons ------------------------------------------------- */ /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ [type=radio]:checked, [type=radio]:not(:checked) { position: absolute; left: -9999px; } [type=radio]:checked + label, [type=radio]:not(:checked) + label, [type=radio]:checked + span, [type=radio]:not(:checked) + span { position: relative; padding-left: 26px; cursor: pointer; display: inline-block; color: var(--kn_radio_color); box-sizing: border-box; margin: 0 12px 10px 0; } [type=radio]:checked + label::before, [type=radio]:not(:checked) + label::before, [type=radio]:checked + span::before, [type=radio]:not(:checked) + span::before { content: ""; position: absolute; left: 0; top: 0; width: 16px; height: 16px; border: 1px solid var(--kn_radio_border_color); border-radius: 100%; background-color: var(--kn_radio_bgcolor); } [type=radio]:checked + label::after, [type=radio]:not(:checked) + label::after, [type=radio]:checked + span::after, [type=radio]:not(:checked) + span::after { content: ""; width: 10px; height: 10px; background-color: var(--kn_radio_after_bgcolor); position: absolute; top: 3px; left: 3px; border-radius: 100%; transition: all 0.2s ease; } [type=radio]:not(:checked) + label::after, [type=radio]:not(:checked) + span::after { opacity: 0; transform: scale(0); } [type=radio]:checked + label::after, [type=radio]:checked + span::after { opacity: 1; transform: scale(1); } /* ------------------------------------------------- >> Default styles for Meter Tag ------------------------------------------------- */ meter { -webkit-appearance: none; -moz-appearance: none; appearance: none; appearance: none; appearance: none; width: 100%; height: 6px; background-color: var(--kn_meter_bgcolor); border-radius: 0; margin: 0 0 20px; box-shadow: none; } /* WebKit */ meter::-webkit-meter-bar { background: none; background-color: var(--kn_meter_value_bgcolor); border-radius: 0; box-shadow: none; } meter::-webkit-meter-optimum-value { background: var(--kn_meter_value_bgcolor); } meter::-webkit-meter-suboptimum-value { background: var(--kn_meter_value_bgcolor); } meter::-webkit-meter-even-less-good-value { background: var(--kn_meter_value_bgcolor); } /* Firefox */ meter::-moz-meter-bar { background: none; border-radius: 0; box-shadow: none; } meter:-moz-meter-optimum::-moz-meter-bar { background: var(--kn_meter_value_bgcolor); } meter:-moz-meter-sub-optimum::-moz-meter-bar { background: var(--kn_meter_value_bgcolor); } meter:-moz-meter-sub-sub-optimum::-moz-meter-bar { background: var(--kn_meter_value_bgcolor); } /* ------------------------------------------------- >> Default styles for Progress Tag ------------------------------------------------- */ /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ progress { vertical-align: baseline; -webkit-appearance: none; -moz-appearance: none; appearance: none; appearance: none; appearance: none; width: 100%; height: 6px; border: none; background-color: var(--kn_progress_bgcolor); border-radius: 0; margin: 0 0 20px; } progress::-webkit-progress-bar { background-color: var(--kn_progress_bgcolor); border-radius: 0; } progress::-webkit-progress-value { background-color: var(--kn_progress_value_bgcolor); border-radius: 0; } progress::-moz-progress-bar { background-color: var(--kn_progress_value_bgcolor); border-radius: 0; } /* ------------------------------------------------- >> Default styles for Range Field ------------------------------------------------- */ /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ input[type=range] { padding: 0; border: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; border-radius: 0; height: 22px; } input[type=range]::-webkit-slider-runnable-track { width: 100%; height: 6px; cursor: pointer; background-color: var(--kn_range_track_bgcolor); border: none; animate: 0.2s; box-shadow: none; border-radius: 0; } input[type=range]::-moz-range-track { width: 100%; height: 6px; cursor: pointer; background-color: var(--kn_range_track_bgcolor); border: none; animate: 0.2s; box-shadow: none; border-radius: 0; } input[type=range]::-webkit-slider-thumb { height: 14px; width: 14px; background-color: var(--kn_range_thumb_bgcolor); cursor: pointer; -webkit-appearance: none; appearance: none; margin-top: -4px; box-shadow: none; border: none; border-radius: 0; } input[type=range]::-moz-range-thumb { height: 14px; width: 14px; background-color: var(--kn_range_thumb_bgcolor); cursor: pointer; -moz-appearance: none; appearance: none; margin-top: -4px; box-shadow: none; border: none; border-radius: 0; } /* ------------------------------------------------- >> Default styles for forms ------------------------------------------------- */ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Do not edit these styles ------------------------------------------------- */ /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type=button], [type=reset], [type=submit] { -webkit-appearance: button; -moz-appearance: button; appearance: button; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Add the correct box sizing in IE 10. */ [type=checkbox], [type=radio] { box-sizing: border-box; padding: 0; } [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; } /** * Remove the inner padding in Chrome and Safari on macOS. */ [type=search]::-webkit-search-decoration { -webkit-appearance: none; appearance: none; } [type=search] { -webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield; outline-offset: -2px; } ::-webkit-file-upload-button { -webkit-appearance: button; appearance: button; font: inherit; } .search-form { display: flex; justify-content: center; align-items: flex-start; } .search-form input[type=submit], .search-form button, .search-form input[type=button], .search-form input[type=reset] { margin: 0 0 10px 10px; } /* ------------------------------------------------- >> Default styles for Gravity Forms ------------------------------------------------- */ /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ .gfields { margin: 0; } .gf_clear { clear: both; } .gfield_time_hour, .gfield_time_minute, .gfield_time_ampm { width: calc(33.33% - 3px); display: inline-block; } .gfield_time_minute { margin: 0 10px; width: calc(33.33% - 23px); } .below.hour_minute_colon { display: none; } .gfield_post_tags_hint { margin-top: 0; font-size: 0.875rem; } .gfield.half-input-field { width: 48%; margin-right: calc(4% - 5px); display: inline-block; vertical-align: top; } .gfield.half-input-field.last { margin-right: 0; } .gfield_list_group { margin-bottom: 20px; } button.add_list_item, button.delete_list_item { margin: 0 10px 10px 0; padding: 4px 11px; font-size: 90%; height: 37px; position: relative; } button.delete_list_item { background-color: var(--kn_reset_button_bgcolor); color: var(--kn_reset_button_color); border: 2px solid transparent; } button.delete_list_item:hover { background-color: transparent; border: 2px solid var(--kn_reset-button-border-color-hover); } .gform_fileupload_rules { font-size: 90%; color: var(--kn_fileupload_rule_color); margin-bottom: 10px; display: inline-block; position: relative; top: 0; } /* ============================================= = Style For Date Picker for gravity form = ============================================= */ #ui-datepicker-div { border: none; width: 100%; max-width: 480px; background-color: var(--kn_datepicker_bg_color); } .ui-datepicker-header.ui-widget-header.ui-helper-clearfix.ui-corner-all { background-color: var(--kn_datepicker_bg_color); padding: 10px 12px; } .ui-datepicker-title select { width: 49%; margin-bottom: 0; margin-right: 2%; height: 46px; padding: 0 35px 0 18px; background-color: var(--kn_datepicker_select_bgcolor); border: 2px solid var(--kn_datepicker_border_color); } .ui-state-default { color: var(--kn_datepicker_link_color); } .ui-state-default.ui-state-active { color: var(--kn_datepicker_link_active_color); } .ui-state-disabled { color: var(--kn_datepicker_date_color); } a.ui-datepicker-prev.ui-corner-all, a.ui-datepicker-next.ui-corner-all { position: relative; } a.ui-datepicker-next.ui-corner-all { float: right; } .ui-datepicker-header a, .ui-datepicker-header a:visited { font-size: var(--kn_font_size_3); cursor: pointer; margin-bottom: 10px; display: inline-block; } select.ui-datepicker-year { margin-right: 0; } #ui-datepicker-div table { border-collapse: collapse; border-spacing: 0; margin: 0 0 10px; font-size: var(--kn_font_size_3); } .ui-datepicker_calendar a { font-size: var(--kn_font_size_3); color: var(--kn_datepicker_date_color); } .ginput_container_date { position: relative; } .ginput_container_date img.ui-datepicker-trigger { position: absolute; right: 10px; top: 15px; bottom: 0; } .gfield_radio .gchoice { display: inline-block; } table.ui-datepicker_calendar { max-width: 410px; background-color: var(--kn_datepicker_calendar); } /* ===== End of Date Picker Style for Gravity Form ====== */ .validation_error { background-color: var(--kn_valiation_error_bg_color); font-size: 0.875rem; color: var(--kn_valiation_error_color); padding: 2px 10px 6px; margin-bottom: 20px; text-align: center; } .validation_message { font-size: 0.875rem; text-align: center; display: inline-block; color: var(--kn_valiation_message_color); position: absolute; bottom: -20px; } .gform_validation_error_link { font-size: 0.875rem; } .gfield_error input { border-color: var(--kn_error_field_border_color); } .gform_confirmation_message { background-color: var(--kn_confirmation_message_bgcolor); padding: 20px; text-align: center; color: var(--kn_confirmation_message_color); border: 1px solid var(--kn_confirmation_message_border_color); } .gform_validation_errors { background-color: var(--kn_valiation_error_bg_color); margin: 10px 0 30px; padding: 7px 14px; font-weight: 700; font-size: 105%; } .gform_validation_errors h2 { color: var(--kn_valiation_error_color); border: 2px solid var(--kn_confirmation_message_border_color); margin-bottom: 0; font-size: 24px; font-size: 105%; padding: 20px; } .gform_validation_errors ol { margin-top: 20px; } .gfield_required_text { color: var(--kn_required_text_color); position: relative; margin-left: 5px; font-size: 0.875rem; } /** * * Style for hidden field in gravity form * */ .gfield_visibility_hidden { display: none !important; } /** * * Spinner * */ img.gform_ajax_spinner { position: absolute; bottom: 0; left: 0; } .hidden_label label { display: none; } .ginput_container_radio { margin-bottom: 12px; } /* ------------------------------------------------- >> Default styles for Hubspot Forms ------------------------------------------------- */ /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ .hs-form { text-align: left; } .hs-form fieldset { margin: 0; } .hs-form ul { margin: 0; padding: 0; list-style-type: none; } .hs-form ul li { margin: 0; padding-left: 0; } .hs-form ul li label { margin: 0; } .hs-form ul li::before { display: none; } .hs-form ul.hs-error-msgs li { padding-left: 0; color: var(--kn_hubspot_error_label_color); font-size: var(--kn_font_size_3); margin: -18px 0 15px; } .hs-form .error { text-align: left; } .hs-form .hs-fieldtype-checkbox ul.hs-error-msgs li, .hs-form .hs-fieldtype-booleancheckbox ul.hs-error-msgs li, .hs-form .hs-fieldtype-radio ul.hs-error-msgs li { margin: -6px 0 8px; } .hs-form .hs_error_rollup ul li { background-color: var(--kn_valiation_error_bg_color); margin: 10px 0 30px; padding: 7px 14px; font-weight: 700; font-size: 105%; } .hs-form .hs-form-required { color: var(--kn_hubspot_required_color); } .hs-form-field { position: relative; } .form-columns-2 .hs-form-field { display: inline-block; width: 49%; margin-right: calc(2% - 5px); } .form-columns-2 .hs-form-field:nth-child(2n+2) { margin-right: 0; } /* ------------------------------------------------- >> Default styles for Contact Form Forms ------------------------------------------------- */ .wpcf7-list-item { margin: 0 10px 0 0 !important; } .wpcf7-section label { display: block; } .wpcf7-form-control-wrap { display: block; margin-top: 10px; } .wpcf7-not-valid-tip { color: var(--kn_valiation_error_color) !important; position: relative; top: -15px; } .wpcf7-response-output { margin: 0 !important; } /* ------------------------------------------------------------------ > Media ------------------------------------------------------------------ */ /*------------------------------------------------- >> Styles for WordPress captions -------------------------------------------------*/ .wp-caption { max-width: 100%; box-sizing: border-box; margin-bottom: 50px !important; } .wp-caption.alignnone { margin: 15px 0; } .wp-caption.alignleft { margin: 50px 20px 10px 0; } .wp-caption.alignright { margin: 5px 0 10px 20px; } .wp-caption img { border: 0 none; height: auto; margin: 0 0 8px; max-width: 100%; padding: 0; width: auto; } .wp-caption .wp-caption-text { margin: 0; text-align: left; } .wp-caption p.wp-caption-text { font-size: var(--kn_font_size_4); margin: 0; text-transform: uppercase; word-spacing: 2.5px; letter-spacing: 1.5px; } .wp-caption img[class*=wp-image-] { display: block; margin-left: auto; margin-right: auto; } /*------------------------------------------------- >> Styles for default WordPress galleries -------------------------------------------------*/ .gallery { margin-bottom: 24px; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-caption { display: block; } .size-auto, .size-full, .size-large, .size-medium, .size-thumbnail { max-width: 100%; height: auto; } /* ------------------------------------------------------------------ > Core ------------------------------------------------------------------ */ /*------------------------------------------------- >> Accessibility styles for WordPress -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ .screen-reader-text { margin: 0px; overflow: hidden; width: 1px; position: absolute !important; word-wrap: normal !important; color: var(--kn_acc_btn_color); background-color: var(--kn_acc_btn_bgcolor); clip: auto !important; border: unset !important; border-radius: 0; left: 0; opacity: 0; visibility: hidden; font-size: 0.875rem; -webkit-clip-path: none; clip-path: none; font-weight: 700; height: auto; line-height: normal; padding: 8px 12px; text-decoration: none; top: 8px; } .screen-reader-text:hover, .screen-reader-text:active, .screen-reader-text:focus { display: block; width: auto; z-index: 100000; left: 8px; } #page-section[tabindex="-1"]:focus { outline: 0; } a, button, input[type=submit] { outline: 2px dotted transparent; outline-offset: 5px; } a:focus-visible, button:focus-visible, input[type=submit]:focus-visible { outline-color: var(--wp--preset--color--black) !important; } .contact-details a { outline-offset: 0; } .header-logo a:focus-visible, .red-ctn a:focus-visible, .black-ctn a:focus-visible, .hero-ctn a:focus-visible, .topbar a:focus-visible, .header-nav ul li a:focus-visible { outline-color: var(--wp--preset--color--black); } /*------------------------------------------------- >> Default WordPress alignments -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ .alignnone { margin: 15px 0 30px; } .aligncenter { display: block; margin: 15px auto 30px; clear: both; text-align: center; } .alignright { float: right; margin: 15px 0 30px 20px; } .alignleft { float: left; margin: 15px 20px 30px 0; } a img.alignright { float: right; margin: 15px 0 30px 20px; } a img.alignnone { margin: 15px 0 30px; } a img.alignleft { float: left; margin: 15px 20px 30px 0; } a img.aligncenter { display: block; margin: 15px auto 30px; text-align: center; clear: both; } /*------------------------------------------------- >> Styles for posts and pages -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Do not edit these styles ------------------------------------------------- */ .sticky { display: block; } .sticky .post-title { position: relative; padding-left: 30px; } .sticky .post-title::before { content: ""; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMjIiIHZpZXdCb3g9IjAgMCAyMiAyMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMC44NjE2IDYuOTk2MDRMMTUuMDk4NyAxLjI1MTgxQzE0LjYwODggMC43NjM0OTcgMTMuODI5OCAxLjI2NjQ2IDEzLjU5NjMgMS42OTc4MUMxMy41NTcxIDEuNzcxMDYgMTMuNjI3MyAxLjgzNzc5IDEzLjU2MzcgMi4zMzQyNUMxMy40OTQyIDIuOTY0NjcgMTMuMzQ1IDMuNTgzNzggMTMuMTE5NSA0LjE3NjgzTDEwLjU1NTcgNi43MzIzNUM5LjUzMzM5IDcuNzUyOTMgOC4wNzAyMSA3LjI5ODggNi44MjA5NiA2LjY4MDI2QzYuNTU4MDUgNi41NTAwNSA2LjIyMDAxIDYuMjYxOTQgNS45Mjc3IDYuNTUzM0w0Ljg0MTc1IDcuNjM1NzRDNC43NjU0NyA3LjcxMjAxIDQuNzIyNjMgNy44MTUzMyA0LjcyMjYzIDcuOTIzMDNDNC43MjI2MyA4LjAzMDczIDQuNzY1NDcgOC4xMzQwNSA0Ljg0MTc1IDguMjEwMzJMMTMuOTUyMyAxNy4yODk4QzE0LjAyODggMTcuMzY1OCAxNC4xMzI1IDE3LjQwODUgMTQuMjQwNSAxNy40MDg1QzE0LjM0ODYgMTcuNDA4NSAxNC40NTIyIDE3LjM2NTggMTQuNTI4OCAxNy4yODk4TDE1LjYxMzEgMTYuMjA3M0MxNS45MDIxIDE1LjkxOTIgMTUuNTMzMSAxNS41NDY1IDE1LjM4MjggMTUuMjMwN0MxNC44Mjc2IDE0LjA5MTMgMTQuMzI5NSAxMi41NTggMTUuMjU1NSAxMS42MzVMMTcuOTMyIDguOTgwMjRDMTguNTM5MSA4Ljc5NTU0IDE5LjE1ODQgOC42NTMwNSAxOS43ODU0IDguNTUzNzdDMjAuMjkgOC40NzQwMSAyMC4zNTIxIDguNTM3NSAyMC40MjM5IDguNDkwMjlDMjAuODY0OCA4LjIwNTQ0IDIxLjM1NDcgNy40ODc2MSAyMC44NjE2IDYuOTk2MDRaTTkuODAxMiAxNC40MTUyTDcuNzI1NjUgMTIuMzQ4TDEuMDY3ODcgMjAuNzQwNUwxLjM4MTQxIDIxLjA1MTRMOS44MDEyIDE0LjQxNTJaIiBmaWxsPSJibGFjayIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIwLjU3IiBzdHJva2UtbWl0ZXJsaW1pdD0iMjIuOTMiLz4KPC9zdmc+Cg==); background-repeat: no-repeat; position: absolute; top: 5px; left: 0; height: 30px; width: 30px; } .updated:not(.published) { display: none; } .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit following styles or write your own ------------------------------------------------- */ .post-shares { display: flex; } .post-shares a { margin-left: 8px; padding: 5px; border: 1px solid var(--wp--preset--color--black); border-radius: 50%; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; } .post-shares a:hover { border: 1px solid var(--wp--preset--color--lblack); } .about-us { padding: 24px; } .single-post-content { padding: 24px; } .single-post-content img { border-radius: 4px; } .books-category { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 40px; } .books-category a, .books-category a:visited { display: inline-block; padding: 3px 16px; border-radius: 20px; background-color: var(--kn_green); color: var(--kn_white); font-size: var(--kn_font_size_4); } .books-category a:hover, .books-category a:visited:hover { background-color: var(--kn_dgreen); } .book-buttons { margin-top: 12px; line-height: 0.6; display: flex; gap: 10px 16px; align-items: center; flex-wrap: wrap; } .book-buttons a.button, .book-buttons a.button:visited { margin-right: 0; } .download-btn { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBmaWxsPSIjMDAyMzY2IiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgNDgyLjQ1OSA0ODIuNDU5IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHN0cm9rZT0iIzAwMjM2NiIgc3Ryb2tlLXdpZHRoPSI3LjIzNjg4NDk5OTk5OTk5OSI+Cg08ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiIHN0cm9rZS13aWR0aD0iMCIvPgoNPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cg08ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+IDxnPiA8Zz4gPHBvbHlnb24gcG9pbnRzPSIzODIuNjQ1LDI1Ni44OTkgMjUxLjA3MywzODguNDY3IDI1MS4wNzMsMCAyMzEuMzgxLDAgMjMxLjM4MSwzODguNDY2IDk5LjgxNCwyNTYuODk5IDg1Ljg5MSwyNzAuODIyIDI0MS4yMjcsNDI2LjE1OSAzOTYuNTY5LDI3MC44MjIgIi8+IDwvZz4gPC9nPiA8Zz4gPGc+IDxyZWN0IHg9IjM2Ljc1NCIgeT0iNDYyLjc2NyIgd2lkdGg9IjQwOC45NSIgaGVpZ2h0PSIxOS42OTIiLz4gPC9nPiA8L2c+IDwvZz4KDTwvc3ZnPg==); background-size: 17px; } .read-pdf, .download-btn { padding: 2px 22px 2px 0; background-repeat: no-repeat; background-position: right center; } .book-img { line-height: 0.6; } .book-img a, .book-img a:visited { display: inline-block; line-height: 0.6; } .book-img img { aspect-ratio: 1/1.2; border-radius: 8px; } .books-select-form form { display: flex; gap: 20px; } .books-select-form form select { width: 65%; } .books-select-form form input { width: 30%; } .filter-ctn { padding-bottom: 44px; border-bottom: 4px solid var(--kn_border_4); } .filter-area h2, .filter-area h3, .filter-area h4, .filter-area h5, .filter-area h6, .filter-area input, .filter-area select, .filter-area form { margin-bottom: 0; } .search-filter form, .filter-area { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; } .search-filter { width: 25%; } .search-filter select { width: 100%; } .filter-area + .category-area, .search-filter + .category-area { margin-top: 40px; } .category-links, .category-area { display: flex; flex-wrap: wrap; gap: 10px; } .category-area span { margin-top: 2px; } .category-area a, .category-area a:visited { text-decoration: none; padding: 5px 16px; border: 1px solid var(--kn_border1); border-radius: 6px; display: inline-block; } .category-area a:hover, .category-area a.active, .category-area a:visited:hover, .category-area a:visited.active { background-color: var(--kn_color_primary); color: var(--kn_color_secondary); border-color: var(--kn_border_4); } .single-video-ctn { padding-top: clamp(5rem, 4.63vw + 2.778rem, 6.25rem); } .single-video-ctn .category-area { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 2px solid var(--kn_border_4); } .single-video-main video, .single-video-main embed, .single-video-main iframe { width: 100%; -o-object-fit: cover; object-fit: cover; aspect-ratio: 2/1.5; max-height: 540px; } .single-video-main, .video-playlist-head { justify-content: space-between; } .video-playlist-head { margin-bottom: 30px; gap: 12px 40px; } .video-playlist-head h2, .video-playlist-head h3, .video-playlist-head h4, .video-playlist-head h5, .video-playlist-head h6 { margin-bottom: 0; } .single-video-left { width: calc(65% - 20px); } .video-playlist-ctn { width: calc(37% - 20px); } .video-playlist-ctn .single-video { padding: 0 15px; align-items: center; gap: 10px; } .video-playlist-ctn .single-video:nth-child(n+2) { margin-top: 15px; } .video-playlist-ctn .video-image { width: 42%; position: relative; overflow: visible; } .video-playlist-ctn .video-image a, .video-playlist-ctn .video-image a:visited { overflow: hidden; border-radius: 8px; } .video-playlist-ctn .video-content { width: 46%; } .video-playlist-ctn .video-image a::before, .video-playlist-ctn .video-image a:visited::before { width: 40px; height: 26px; } .video-playlist-ctn .video-image a::after, .video-playlist-ctn .video-image a:visited::after { background-size: 40px; } .video-playlist-ctn .video-image img { aspect-ratio: 1/0.5; } .video-playlist-ctn .video-content h2, .video-playlist-ctn .video-content h3, .video-playlist-ctn .video-content h4, .video-playlist-ctn .video-content h5, .video-playlist-ctn .video-content h6 { font-size: 16px; } .video-iframe { border-radius: 8px; background-color: var(--kn_green_2); line-height: 0.6; } .video-playlist-ctn .video-catgory, .video-playlist-number { font-size: 14px; } .video-playlist-number { display: flex; gap: 4px; margin-top: 4px; } .video-playlist-number span { display: inline-block; } .video-playlist { max-height: 475px; overflow: auto; } .video-detail { margin-top: 20px; } .video-detail p { font-size: var(--kn_font_size_3); } .single-video-number { width: 18px; height: 18px; background-color: var(--kn_color_secondary); display: flex; justify-content: center; align-items: center; border-radius: 50%; padding: 5px; color: var(--kn_white); font-size: 13px; position: absolute; top: calc(50% - 14px); left: -14px; z-index: 5; } .video-meta { display: flex; align-items: center; gap: 12px 20px; } .video-meta-box { margin-bottom: 20px; justify-content: space-between; flex-wrap: wrap; gap: 20px; } .share-video { gap: 12px; align-items: center; } .share-video a.bookmark-video, .share-video a:visited.bookmark-video { margin-right: 0; } .share-video a.share-now, .share-video a:visited.share-now { padding-left: 46px; } .bookmark-video { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSItNCAwIDMwIDMwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIiBmaWxsPSIjMjQ1YzM2Ij4KDTxnIGlkPSJTVkdSZXBvX2JnQ2FycmllciIgc3Ryb2tlLXdpZHRoPSIwIi8+Cg08ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KDTxnIGlkPSJTVkdSZXBvX2ljb25DYXJyaWVyIj4gPHRpdGxlPmJvb2ttYXJrPC90aXRsZT4gPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaCBCZXRhLjwvZGVzYz4gPGRlZnM+IDwvZGVmcz4gPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+IDxnIGlkPSJJY29uLVNldC1GaWxsZWQiIHNrZXRjaDp0eXBlPSJNU0xheWVyR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC00MTkuMDAwMDAwLCAtMTUzLjAwMDAwMCkiIGZpbGw9IiMyNDVjMzYiPiA8cGF0aCBkPSJNNDM3LDE1MyBMNDIzLDE1MyBDNDIwLjc5MSwxNTMgNDE5LDE1NC43OTEgNDE5LDE1NyBMNDE5LDE3OSBDNDE5LDE4MS4yMDkgNDIwLjc5MSwxODMgNDIzLDE4MyBMNDMwLDE3NiBMNDM3LDE4MyBDNDM5LjIwOSwxODMgNDQxLDE4MS4yMDkgNDQxLDE3OSBMNDQxLDE1NyBDNDQxLDE1NC43OTEgNDM5LjIwOSwxNTMgNDM3LDE1MyIgaWQ9ImJvb2ttYXJrIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIj4gPC9wYXRoPiA8L2c+IDwvZz4gPC9nPgoNPC9zdmc+); background-repeat: no-repeat; background-position: center; background-size: 20px; width: 44px; height: 44px; } .share-now { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+Cg08ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiIHN0cm9rZS13aWR0aD0iMCIvPgoNPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cg08ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+IDxwYXRoIGQ9Ik0xMSA2QzEyLjY1NjkgNiAxNCA0LjY1Njg1IDE0IDNDMTQgMS4zNDMxNSAxMi42NTY5IDAgMTEgMEM5LjM0MzE1IDAgOCAxLjM0MzE1IDggM0M4IDMuMjIzNzEgOC4wMjQ0OSAzLjQ0MTY5IDguMDcwOTIgMy42NTE0M0w0Ljg2ODYxIDUuNjUyODdDNC4zNTU5OSA1LjI0NDIzIDMuNzA2NTIgNSAzIDVDMS4zNDMxNSA1IDAgNi4zNDMxNSAwIDhDMCA5LjY1Njg1IDEuMzQzMTUgMTEgMyAxMUMzLjcwNjUyIDExIDQuMzU1OTkgMTAuNzU1OCA0Ljg2ODYxIDEwLjM0NzFMOC4wNzA5MiAxMi4zNDg2QzguMDI0NDkgMTIuNTU4MyA4IDEyLjc3NjMgOCAxM0M4IDE0LjY1NjkgOS4zNDMxNSAxNiAxMSAxNkMxMi42NTY5IDE2IDE0IDE0LjY1NjkgMTQgMTNDMTQgMTEuMzQzMSAxMi42NTY5IDEwIDExIDEwQzEwLjI5MzUgMTAgOS42NDQgMTAuMjQ0MiA5LjEzMTM5IDEwLjY1MjlMNS45MjkwOCA4LjY1MTQzQzUuOTc1NTEgOC40NDE2OSA2IDguMjIzNzEgNiA4QzYgNy43NzYyOSA1Ljk3NTUxIDcuNTU4MzEgNS45MjkwOCA3LjM0ODU3TDkuMTMxMzkgNS4zNDcxM0M5LjY0NCA1Ljc1NTc3IDEwLjI5MzUgNiAxMSA2WiIgZmlsbD0iIzI0NWMzNiIvPiA8L2c+Cg08L3N2Zz4=); background-repeat: no-repeat; background-position: left 20px center; background-size: 16px; } .category-link { display: block; margin-bottom: 8px; } .article-item { display: block; box-shadow: 0 2px 8px rgba(51, 51, 51, 0.15), 0 2px 13px rgba(51, 51, 51, 0.2); background-color: var(--kn_white); border-radius: 8px; transition: box-shadow 0.3s ease-in-out; } .article-item .block-image { aspect-ratio: 1/0.7; border-radius: 8px 8px 0 0; } .article-item .block-image a, .article-item .block-image a:visited { aspect-ratio: inherit; } .article-item .block-image img { border-radius: 8px 8px 0 0; } .article-item h2, .article-item h3, .article-item h4, .article-item h5, .article-item h6 { transition: color 0.3s ease-in-out; } .article-item h2 a, .article-item h2 a:visited, .article-item h3 a, .article-item h3 a:visited, .article-item h4 a, .article-item h4 a:visited, .article-item h5 a, .article-item h5 a:visited, .article-item h6 a, .article-item h6 a:visited { color: var(--kn_heading_color); } .article-item h2 a:hover, .article-item h2 a:visited:hover, .article-item h3 a:hover, .article-item h3 a:visited:hover, .article-item h4 a:hover, .article-item h4 a:visited:hover, .article-item h5 a:hover, .article-item h5 a:visited:hover, .article-item h6 a:hover, .article-item h6 a:visited:hover { color: var(--kn_green); } .article-item p + a, .article-item p + a:visited { margin-top: 24px; } .article-item p, .article-item li { color: initial; } .article-item:hover { box-shadow: 0 2px 15px rgba(51, 51, 51, 0.15), 0 2px 18px rgba(51, 51, 51, 0.2); } .article-content-inner { padding: 18px 20px; } .content-area { width: 65%; } .jump-links-ctn, .content-area { padding: var(--kn_space_12) 5%; box-sizing: border-box; } .jump-links-ctn { width: 35%; background-color: var(--kn_green); } .jump-links-ctn ol, .jump-links-ctn ul, .jump-links-ctn li:last-child { margin-bottom: 0; } .jump-links-ctn ol, .jump-links-ctn ul { margin: 0; } .jump-links-ctn a:hover, .jump-links-ctn a:visited:hover { color: var(--kn_color_primary); } .jump-links-ctn ul li::before { background-color: var(--kn_white); } .jump-links-ctn a, .jump-links-ctn a:visited, .jump-links-ctn h2, .jump-links-ctn h3, .jump-links-ctn h4, .jump-links-ctn h5, .jump-links-ctn h6 { color: var(--kn_white); } .jump-links-ctn .category-links a, .jump-links-ctn .category-links a:visited { color: var(--kn_color_secondary); background-color: var(--kn_white); border-color: var(--kn_border_6); } .jump-links-ctn .category-links a:hover, .jump-links-ctn .category-links a:visited:hover { color: var(--kn_color_secondary); background-color: var(--kn_color_primary); border-color: var(--kn_border_4); } .jump-links { position: sticky; top: 200px; width: 90%; max-width: 500px; float: right; overflow-y: auto; height: 470px; padding-right: 20px; } .block-button { line-height: 0.6; margin-top: 20px; } .event-meta { justify-content: space-between; align-items: center; margin-bottom: 10px; } .event-meta span, .course-date, .course-location, .course-address, .course-time { position: relative; display: inline-block; padding-left: 24px; } .event-meta span::before, .course-date::before, .course-location::before, .course-address::before, .course-time::before { content: ""; position: absolute; top: 0; left: 0; width: 21px; height: 21px; background-repeat: no-repeat; background-position: left top 3px; background-size: 18px; } .event-date::before, .course-date::before { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBmaWxsPSIjMDAyMzY2IiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjQgMjQiPgoNPGcgaWQ9IlNWR1JlcG9fYmdDYXJyaWVyIiBzdHJva2Utd2lkdGg9IjAiLz4KDTxnIGlkPSJTVkdSZXBvX3RyYWNlckNhcnJpZXIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgoNPGcgaWQ9IlNWR1JlcG9faWNvbkNhcnJpZXIiPgoNPHBhdGggZD0iTTIsMTljMCwxLjcsMS4zLDMsMywzaDE0YzEuNywwLDMtMS4zLDMtM3YtOEgyVjE5eiBNMTksNGgtMlYzYzAtMC42LTAuNC0xLTEtMXMtMSwwLjQtMSwxdjFIOVYzYzAtMC42LTAuNC0xLTEtMVM3LDIuNCw3LDN2MUg1QzMuMyw0LDIsNS4zLDIsN3YyaDIwVjdDMjIsNS4zLDIwLjcsNCwxOSw0eiIvPgoNPC9nPgoNPC9zdmc+); } .event-location::before, .course-location::before { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB2ZXJzaW9uPSIxLjAiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgNjQgNjQiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDY0IDY0IiB4bWw6c3BhY2U9InByZXNlcnZlIiBmaWxsPSIjMDAyMzY2Ij4KDTxnIGlkPSJTVkdSZXBvX2JnQ2FycmllciIgc3Ryb2tlLXdpZHRoPSIwIi8+Cg08ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KDTxnIGlkPSJTVkdSZXBvX2ljb25DYXJyaWVyIj4gPHBhdGggZmlsbD0iIzAwMjM2NiIgZD0iTTMyLDBDMTguNzQ2LDAsOCwxMC43NDYsOCwyNGMwLDUuMjE5LDEuNzExLDEwLjAwOCw0LjU1NSwxMy45M2MwLjA1MSwwLjA5NCwwLjA1OSwwLjE5OSwwLjExNywwLjI4OWwxNiwyNCBDMjkuNDE0LDYzLjMzMiwzMC42NjQsNjQsMzIsNjRzMi41ODYtMC42NjgsMy4zMjgtMS43ODFsMTYtMjRjMC4wNTktMC4wOSwwLjA2Ni0wLjE5NSwwLjExNy0wLjI4OUM1NC4yODksMzQuMDA4LDU2LDI5LjIxOSw1NiwyNCBDNTYsMTAuNzQ2LDQ1LjI1NCwwLDMyLDB6IE0zMiwzMmMtNC40MTgsMC04LTMuNTgyLTgtOHMzLjU4Mi04LDgtOHM4LDMuNTgyLDgsOFMzNi40MTgsMzIsMzIsMzJ6Ii8+IDwvZz4KDTwvc3ZnPg==); } .course-address::before { background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDQ0IDQ4IiB3aWR0aD0iNDQiIGhlaWdodD0iNDgiPgoJPHRpdGxlPmFkZHJlc3MtaWNvbjwvdGl0bGU+Cgk8c3R5bGU+CgkJLnMwIHsgZmlsbDogIzAwMjM2NiB9IAoJPC9zdHlsZT4KCTxnIGlkPSJTVkdSZXBvX2JnQ2FycmllciI+Cgk8L2c+Cgk8ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIj4KCTwvZz4KCTxnIGlkPSJTVkdSZXBvX2ljb25DYXJyaWVyIj4KCQk8cGF0aCBjbGFzcz0iczAiIGQ9Im0yMiAwbC0yMS4zIDIxLjN2MjYuN2g0Mi42di0yNi43em0wIDcuMWwxNi4zIDE2LjN2MTkuNmgtMzIuNnYtMTkuNnoiLz4KCQk8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsYXNzPSJzMCIgZD0ibTE3LjIgMjguOGg5LjZ2MTkuMmgtOS42eiIvPgoJPC9nPgo8L3N2Zz4=); background-size: 16px; background-position: left top 2px; } .course-time::before { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHJva2U9IiNmZmYiPgoNPGcgaWQ9IlNWR1JlcG9fYmdDYXJyaWVyIiBzdHJva2Utd2lkdGg9IjAiLz4KDTxnIGlkPSJTVkdSZXBvX3RyYWNlckNhcnJpZXIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgoNPGcgaWQ9IlNWR1JlcG9faWNvbkNhcnJpZXIiPiA8cGF0aCBkPSJNMjMgMTJDMjMgMTguMDc1MSAxOC4wNzUxIDIzIDEyIDIzQzUuOTI0ODcgMjMgMSAxOC4wNzUxIDEgMTJDMSA1LjkyNDg3IDUuOTI0ODcgMSAxMiAxQzE4LjA3NTEgMSAyMyA1LjkyNDg3IDIzIDEyWk0zLjAwNjgzIDEyQzMuMDA2ODMgMTYuOTY2OCA3LjAzMzIxIDIwLjk5MzIgMTIgMjAuOTkzMkMxNi45NjY4IDIwLjk5MzIgMjAuOTkzMiAxNi45NjY4IDIwLjk5MzIgMTJDMjAuOTkzMiA3LjAzMzIxIDE2Ljk2NjggMy4wMDY4MyAxMiAzLjAwNjgzQzcuMDMzMjEgMy4wMDY4MyAzLjAwNjgzIDcuMDMzMjEgMy4wMDY4MyAxMloiIGZpbGw9IiNmZmYiLz4gPHBhdGggZD0iTTEyIDVDMTEuNDQ3NyA1IDExIDUuNDQ3NzEgMTEgNlYxMi40NjY3QzExIDEyLjQ2NjcgMTEgMTIuNzI3NCAxMS4xMjY3IDEyLjkyMzVDMTEuMjExNSAxMy4wODk4IDExLjM0MzcgMTMuMjM0MyAxMS41MTc0IDEzLjMzNDZMMTYuMTM3MiAxNi4wMDE5QzE2LjYxNTUgMTYuMjc4IDE3LjIyNzEgMTYuMTE0MSAxNy41MDMyIDE1LjYzNThDMTcuNzc5MyAxNS4xNTc1IDE3LjYxNTUgMTQuNTQ1OSAxNy4xMzcyIDE0LjI2OThMMTMgMTEuODgxMlY2QzEzIDUuNDQ3NzIgMTIuNTUyMyA1IDEyIDVaIiBmaWxsPSIjZmZmIi8+IDwvZz4KDTwvc3ZnPg==); } .hero-single .post-meta { justify-content: flex-start; gap: 10px 30px; } .hero-single .post-meta * { color: var(--kn_white); } .hero-single .post-resources + h2, .hero-single .post-resources + h3, .hero-single .post-resources + h4, .hero-single .post-resources + h5, .hero-single .post-resources + h6, .hero-single .post-resources, .hero-single .post-meta { margin-top: 24px; } .post-resources { justify-content: space-between; align-items: center; gap: 30px 20px; } .scroll-top { position: fixed; bottom: 10%; right: 30px; width: 50px; height: 50px; border-radius: 8px; z-index: 8; cursor: pointer; display: flex; align-items: center; justify-content: center; background-color: var(--kn_color_secondary); } .scroll-top .scrolling-arrow { opacity: 0; position: absolute; top: 60%; left: calc(50% - 6px); transform: translate(-50%, -50%); animation: arrow-reverse 2s ease-in-out infinite; } .scroll-top .scrolling-arrow.arrow-second { animation-delay: 1s; } .scroll-top .scrolling-arrow::before, .scroll-top .scrolling-arrow::after { content: ""; position: absolute; width: 15px; height: 3px; background: #fff; top: 0; left: 0; } .scroll-top .scrolling-arrow::before { transform: rotate(-45deg) translateX(-13%); transform-origin: bottom left; } .scroll-top .scrolling-arrow::after { transform: rotate(45deg) translateX(13%); transform-origin: bottom right; } @keyframes arrow-reverse { 0% { opacity: 0; top: 60%; } 30% { opacity: 1; } 100% { opacity: 0; top: 40%; } } .register-form { background-color: var(--kn_white); padding: 30px; border-radius: 10px; box-shadow: 0 2px 8px rgba(51, 51, 51, 0.15), 0 2px 13px rgba(51, 51, 51, 0.2); margin-inline: auto; } .register-form form, .register-form input[type=submit] { margin-bottom: 0; } /*------------------------------------------------- >> Pagination styles -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ .page-section .pagination, .pagination { text-align: center; margin: var(--kn_space_11) 0 0; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; } .page-section .pagination a, .page-section .pagination a:visited, .page-section .pagination span.current, .pagination a, .pagination a:visited, .pagination span.current { background-color: var(--kn_pagination_bgcolor); color: var(--kn_pagination_color); display: inline-block; display: flex; justify-content: center; align-items: center; width: 44px; height: 44px; line-height: 20px; border-radius: 4px; box-sizing: border-box; transition: all 0.4s ease-in-out; } .page-section .pagination a:hover, .page-section .pagination a:visited:hover, .page-section .pagination span.current:hover, .pagination a:hover, .pagination a:visited:hover, .pagination span.current:hover { background-color: var(--kn_pagination_bgcolor_hover); color: var(--kn_pagination_color_hover); } .page-section .pagination a.previous, .page-section .pagination a.next, .page-section .pagination a:visited.previous, .page-section .pagination a:visited.next, .page-section .pagination span.current.previous, .page-section .pagination span.current.next, .pagination a.previous, .pagination a.next, .pagination a:visited.previous, .pagination a:visited.next, .pagination span.current.previous, .pagination span.current.next { width: auto; height: auto; padding: 8px 18px; } .page-section .pagination a.previous::before, .page-section .pagination a.next::before, .page-section .pagination a:visited.previous::before, .page-section .pagination a:visited.next::before, .page-section .pagination span.current.previous::before, .page-section .pagination span.current.next::before, .pagination a.previous::before, .pagination a.next::before, .pagination a:visited.previous::before, .pagination a:visited.next::before, .pagination span.current.previous::before, .pagination span.current.next::before { content: ""; position: absolute; width: 24px; height: 20px; background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSItMy44IC0zLjggMjcuNjAgMjcuNjAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgZmlsbD0iIzI0NWMzNiIgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIiBzdHJva2U9IiMyNDVjMzYiPgoNPGcgaWQ9IlNWR1JlcG9fYmdDYXJyaWVyIiBzdHJva2Utd2lkdGg9IjAiLz4KDTxnIGlkPSJTVkdSZXBvX3RyYWNlckNhcnJpZXIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgoNPGcgaWQ9IlNWR1JlcG9faWNvbkNhcnJpZXIiPiA8dGl0bGU+YXJyb3dfcmlnaHRfdXAgWyMyNDVjMzZdPC90aXRsZT4gPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+IDxkZWZzPiA8L2RlZnM+IDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPiA8ZyBpZD0iRHJpYmJibGUtTGlnaHQtUHJldmlldyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTM4MC4wMDAwMDAsIC02NTk5LjAwMDAwMCkiIGZpbGw9IiMyNDVjMzYiPiA8ZyBpZD0iaWNvbnMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDU2LjAwMDAwMCwgMTYwLjAwMDAwMCkiPiA8cG9seWdvbiBpZD0iYXJyb3dfcmlnaHRfdXAtWyMyNDVjMzZdIiBwb2ludHM9IjMyNCA2NDU3LjYwMiAzMjUuMzkzIDY0NTguOTk3IDM0MiA2NDQyLjM0OSAzNDIgNjQ1MyAzNDQgNjQ1MyAzNDQgNjQzOSAzMjkuOTA3IDY0MzkgMzI5Ljg3NyA2NDQxIDM0MC42MzQgNjQ0MSI+IDwvcG9seWdvbj4gPC9nPiA8L2c+IDwvZz4gPC9nPgoNPC9zdmc+); background-size: 22px; background-repeat: no-repeat; background-position: center; } .page-section .pagination a.previous, .page-section .pagination a:visited.previous, .page-section .pagination span.current.previous, .pagination a.previous, .pagination a:visited.previous, .pagination span.current.previous { padding-left: 54px; } .page-section .pagination a.previous::before, .page-section .pagination a:visited.previous::before, .page-section .pagination span.current.previous::before, .pagination a.previous::before, .pagination a:visited.previous::before, .pagination span.current.previous::before { left: 18px; transform: rotate(180deg); } .page-section .pagination a.next, .page-section .pagination a:visited.next, .page-section .pagination span.current.next, .pagination a.next, .pagination a:visited.next, .pagination span.current.next { padding-right: 54px; margin-left: 20px; } .page-section .pagination a.next::before, .page-section .pagination a:visited.next::before, .page-section .pagination span.current.next::before, .pagination a.next::before, .pagination a:visited.next::before, .pagination span.current.next::before { right: 18px; } .page-section .pagination span.current, .pagination span.current { background-color: var(--kn_pagination_bgcolor_current); color: var(--kn_pagination_color_current); } .page-section .pagination span.current:hover, .pagination span.current:hover { background-color: var(--kn_pagination_bgcolor_current); color: var(--kn_pagination_color_current); } .page-section .pagination > span.current, .pagination > span.current { border: none; } .page-section .pagination > span.current:hover, .pagination > span.current:hover { background-color: var(--kn_pagination_first_bgcolor); color: var(--kn_pagination_first_color); } /*------------------------------------------------- >> Styles for WordPress comments -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ #commentform label { display: block; } #commentform p.comment-form-author, #commentform p.comment-form-url, #commentform p.comment-form-email { width: calc(33.3% - 10px); display: inline-block; margin-right: 10px; margin-bottom: 0; } #commentform p.comment-form-comment { margin-bottom: 0; } #commentform p.comment-form-comment textarea { margin-bottom: 10px; } #commentform p.comment-form-url, #commentform .url-comments, #commentform li.middle { margin-right: 0 !important; } #commentform .form-submit { margin-bottom: 0; } .comment-meta, .comment-author { margin-bottom: 15px; } .comments-closed { margin: 30px 0; } .comment-meta { margin-bottom: 30px; color: var(--kn_comment_meta_color); } .comment-author.vcard { margin-bottom: 2px; } .comment-author.vcard a { border-bottom: none; } .comment-metadata { font-size: 90%; } .comment-metadata a { color: var(--kn_comment_metadata_color); border-bottom: transparent; } .comment-content p { margin-bottom: 20px; } .comment-body { margin-bottom: 30px; } ol.comment-list { margin-bottom: 60px; } ol.comment-list li.comment { margin-bottom: 30px; padding: 30px 0 0; border-top: 1px solid var(--kn_comments_list_border_color); } ol.comment-list li.comment::before { display: none !important; } ol.comment-list li.comment.pingback { margin: 0 0 30px; } ol.comment-list li.comment div.vcard cite.fn { font-style: normal; } ol.comment-list li.comment div.vcard img.avatar { float: left; margin: 0 10px 0 0; width: 64px; } ol.comment-list li.comment div.commentmetadata { padding: 8px 0 14px; } ol.comment-list li.comment ul.children, ol.comment-list li.comment ol.children { list-style: none; margin: 50px 0 0; } ol.comment-list li.comment ul.children li, ol.comment-list li.comment ol.children li { padding: 30px 0 0; } ol.comment-list li.comment ul.children li.depth-2, ol.comment-list li.comment ul.children li.depth-3, ol.comment-list li.comment ul.children li.depth-4, ol.comment-list li.comment ul.children li.depth-5, ol.comment-list li.comment ol.children li.depth-2, ol.comment-list li.comment ol.children li.depth-3, ol.comment-list li.comment ol.children li.depth-4, ol.comment-list li.comment ol.children li.depth-5 { margin: 0 0 30px 60px; } a.comment-reply-link { background-color: var(--kn_comments_reply_btn_bgcolor); color: var(--kn_comments_reply_btn_color); padding: 6px 11px 5px; font-size: 90%; height: 37px; box-sizing: border-box; display: inline-block; border: 2px solid transparent; } a.comment-reply-link:hover { background-color: var(--kn_comments_reply_btn_bgcolor_hover); color: var(--kn_comments_reply_btn_color_hover); } /*------------------------------------------------- >> Styles for default WordPress widgets -------------------------------------------------*/ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Do not edit these styles ------------------------------------------------- */ .wp-block-archives, .wp-block-categories, .wp-block-latest-comments, .wp-block-latest-posts, .wp-block-page-list, .wp-block-rss, .wp-block-search, .wp-block-social-links, .wp-block-tag-cloud, .wp-block-calendar { margin: 0 0 40px; } /* ------------------------------------------------- >> Project Styles --------------------------------------------------- >> Edit following styles or write your own ------------------------------------------------- */ .video-box, .video-widget { line-height: 0.6; } .video-box video, .video-box iframe, .video-widget video, .video-widget iframe { height: 200px; -o-object-fit: cover; object-fit: cover; } .video-widget h2, .video-widget h3, .video-widget h4, .video-widget h5, .video-widget h6 { margin-bottom: 0; } .video-btns { margin-top: 20px; line-height: 0.6; } .video-speaker { margin-top: 2px; } .widget-box span, .widget-box a, .widget-box a:visited { font-size: 16px; } .widget-box form, .widget-box video, .widget-box iframe, .widget-box audio { margin-bottom: 0; } .widget-links { padding-bottom: 10px; } .widget-links ul, .widget-links ul li { margin-bottom: 0; padding-left: 0; } .widget-links li::before { display: none; } .widget-links li a, .widget-links li a:visited { padding: 10px 50px 10px 20px; background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBmaWxsPSIjNzM3MzczIiBoZWlnaHQ9IjE4NXB4IiB3aWR0aD0iMTg1cHgiIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHZpZXdCb3g9Ii0xMy4yIC0xMy4yIDM1Ni40MCAzNTYuNDAiIHhtbDpzcGFjZT0icHJlc2VydmUiIHN0cm9rZT0iIzczNzM3MyIgc3Ryb2tlLXdpZHRoPSIxMS44Nzk5OTk5OTk5OTk5OTkiPgoNPGcgaWQ9IlNWR1JlcG9fYmdDYXJyaWVyIiBzdHJva2Utd2lkdGg9IjAiLz4KDTxnIGlkPSJTVkdSZXBvX3RyYWNlckNhcnJpZXIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgoNPGcgaWQ9IlNWR1JlcG9faWNvbkNhcnJpZXIiPiA8cGF0aCBpZD0iWE1MSURfMjIyXyIgZD0iTTI1MC42MDYsMTU0LjM4OWwtMTUwLTE0OS45OTZjLTUuODU3LTUuODU4LTE1LjM1NS01Ljg1OC0yMS4yMTMsMC4wMDEgYy01Ljg1Nyw1Ljg1OC01Ljg1NywxNS4zNTUsMC4wMDEsMjEuMjEzbDEzOS4zOTMsMTM5LjM5TDc5LjM5MywzMDQuMzk0Yy01Ljg1Nyw1Ljg1OC01Ljg1NywxNS4zNTUsMC4wMDEsMjEuMjEzIEM4Mi4zMjIsMzI4LjUzNiw4Ni4xNjEsMzMwLDkwLDMzMHM3LjY3OC0xLjQ2NCwxMC42MDctNC4zOTRsMTQ5Ljk5OS0xNTAuMDA0YzIuODE0LTIuODEzLDQuMzk0LTYuNjI4LDQuMzk0LTEwLjYwNiBDMjU1LDE2MS4wMTgsMjUzLjQyLDE1Ny4yMDIsMjUwLjYwNiwxNTQuMzg5eiIvPiA8L2c+Cg08L3N2Zz4=); background-repeat: no-repeat; background-size: 14px; display: block; background-position: center right 20px; border-bottom: 1px solid var(--kn_border); } .widget-links li a:hover, .widget-links li a:visited:hover { background-position: center right 15px; } .widget-links li:last-child a, .widget-links li:last-child a:visited { border-bottom: none; } /* ------------------------------------------------------------------ > Blocks ------------------------------------------------------------------ */ /* ------------------------------------------------- >> Accessibility styles for WordPress Gallery Block ------------------------------------------------- */ .wp-block-gallery .wp-block-image a { border-bottom: none; } .page-section .wp-block-gallery ul li { padding: 0; } .page-section .wp-block-gallery ul li::before { display: none; } /* ------------------------------------------------- >> Accessibility styles for WordPress Cover Block ------------------------------------------------- */ .wp-block-cover-text { color: var(--wp--preset--color--white) !important; } /* ------------------------------------------------- >> Accessibility styles for WordPress Calender Block ------------------------------------------------- */ .wp-block-calendar a { text-decoration: none; } .wp-block-calendar table { margin: 0 0 20px; } .wp-block-calendar table caption, .wp-block-calendar table tbody { color: none; } .wp-block-calendar table tbody td, .wp-block-calendar table th { padding: 10px 15px; border: none; } .wp-block-calendar table th { background-color: transparent; font-weight: 700; } /* ------------------------------------------------- >> Accessibility styles for WordPress Categories Block ------------------------------------------------- */ .wp-block-archives-dropdown.wp-block-archives select, .wp-block-categories-dropdown.wp-block-categories select { margin: 0; } /* ------------------------------------------------- >> Accessibility styles for WordPress Image Block ------------------------------------------------- */ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ /* ------------------------------------------------- >> Accessibility styles for WordPress Latest Comments Block ------------------------------------------------- */ .wp-block-latest-comments .avatar, .wp-block-latest-comments__comment-avatar { border-radius: unset; margin-top: 3px; } .wp-block-latest-comments__comment-date { margin: 5px 0; color: var(--kn_widget_comments_meta_color); } .wp-block-latest-comments__comment-excerpt p { font-size: 100%; line-height: 1.5; margin: 5px 0; } /* ------------------------------------------------- >> Accessibility styles for WordPress Latest Posts Block ------------------------------------------------- */ .wp-block-latest-posts__featured-image a { border-bottom: none; } .wp-block-latest-posts__featured-image.alignleft { margin: 0 20px 10px 0; } .wp-block-latest-posts__featured-image.alignright { margin: 0 0 10px 20px; } .wp-block-latest-posts__featured-image.aligncenter { margin: 0 auto 10px; } .wp-block-latest-posts__post-author, .wp-block-latest-posts__post-date { font-size: 90%; color: var(--kn_widget_latest_post_meta_color); } .wp-block-latest-posts.is-grid li { margin-bottom: 12px; } /* ------------------------------------------------- >> Accessibility styles for WordPress Quote Block ------------------------------------------------- */ blockquote.wp-block-quote.is-style-large { border-left: 0; padding: 0; } /* ------------------------------------------------- >> Accessibility styles for WordPress PullQuote Block ------------------------------------------------- */ /* ------------------------------------------------- >> Base Styles --------------------------------------------------- >> Edit these styles as required ------------------------------------------------- */ /* ------------------------------------------------- >> Accessibility styles for WordPress RSS Feed Block ------------------------------------------------- */ .wp-block-rss__item-author, .wp-block-rss__item-publish-date { font-size: 90%; color: var(--kn_widget_rss_feed_meta_color); } .wp-block-rss__item-excerpt { margin: 10px 0 20px; } /* ------------------------------------------------- >> Accessibility styles for WordPress Search Block ------------------------------------------------- */ input[type=search].wp-block-search__input { background-image: unset; padding: 0 12px; margin-bottom: 0; } .wp-block-search__button { border: none; margin-right: 0; padding: 0 20px; } .wp-block-search__button:hover { border: none; background-color: var(--wp--preset--color--white); } /* ------------------------------------------------- >> Accessibility styles for WordPress Social-links Block ------------------------------------------------- */ .wp-block-social-links li.wp-block-social-link { list-style: none; padding-left: 0; } .wp-block-social-links li.wp-block-social-link::before { display: none; } .wp-block-social-links li.wp-block-social-link svg { margin-bottom: 0; } /* ------------------------------------------------- >> Accessibility styles for WordPress Tag Cloud Block ------------------------------------------------- */ .wp-block-tag-cloud .tag-cloud-link { margin: 0 8px 12px 0; } /* ------------------------------------------------------------------ > Site ------------------------------------------------------------------ */ /*------------------------------------------------- >> Styles for header and footer of website -------------------------------------------------*/ /*------------------------------------------------- >> Styles for header -------------------------------------------------*/ .slide-thumb img, .burger-single, .post-tags, .post-content-des p, .post-meta, .search-button, .single-blog-post, .wpcf7-submit, a, a:visited, button, input[type=submit], .home-hero, header { transition: all 0.3s ease-in-out; } .top-bar { background-color: var(--kn_topbar_bgcolor); color: var(--kn_topbar_color); transition: all 0.4s ease-in-out; } .top-bar .header-wrapper { display: flex; justify-content: space-between; gap: 30px; width: 70%; } .top-bar-text { padding: 10px 0; } .top-bar-text a, .top-bar-text a:visited { font-size: var(--kn_font_size_3); color: var(--wp--preset--color--white); display: inline-block; border-bottom: 1px solid var(--kn_border_2); line-height: 1.3; } .top-bar-text a:hover, .top-bar-text a:visited:hover { border-color: var(--kn_link_border_color_hover); } .top-bar-cross img, .newsletter-form-ctn .close-icon img { width: 18px; } .top-bar-cross img, .newsletter-form-ctn .close-icon img { filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(220deg) brightness(102%) contrast(103%); } .top-bar-cross img { filter: brightness(0) saturate(100%) invert(28%) sepia(19%) saturate(1421%) hue-rotate(87deg) brightness(94%) contrast(87%); } .top-bar-cross, .close-icon { position: absolute; top: 14px; right: 20px; line-height: 0.65; cursor: pointer; } .top-bar-cross span, .close-icon span { line-height: 0.6; display: inline-block; } .hide-topbar header { top: -44px; } .nav-container { display: flex; align-items: center; justify-content: center; } .header-logo { z-index: 10; width: clamp(6.25rem, 2.212vw + 5.216rem, 6.875rem); } .header-logo a { display: inline-block; position: absolute; top: -50px; left: 0; box-shadow: 0 2px 8px rgba(51, 51, 51, 0.15), 0 2px 13px rgba(51, 51, 51, 0.2); } .header-logo a img { width: 100%; } .no-overflow { overflow: hidden; } .logo { position: relative; line-height: 0; top: 0; left: 0; text-align: center; } .logo a, .logo a:visited { transition: all 0.3s ease-in-out; background-color: var(--kn_white); padding: 5px; border-radius: 60px; } .logo a h2, .logo a:visited h2 { color: var(--kn_white); font-size: 24px; line-height: 2; } .logo img { display: inline-block; } .select-language { display: flex; justify-content: flex-end; gap: 14px; align-items: center; } .header-inner { box-sizing: border-box; transition: all 0.3s ease-in-out; position: relative; justify-content: space-between; align-items: center; gap: 40px; } header { position: relative; z-index: 9; width: 100%; background-color: var(--kn_header_bgcolor); position: fixed; top: 0; } header.shrink { box-shadow: 0 4px 6px 0 rgba(36, 92, 54, 0.1); } .header-navigation, .header-cta { display: flex; align-items: center; } .header-cta { gap: 20px; } .right-header { gap: 20px; justify-content: space-between; align-items: center; } .header-wrapper { box-sizing: border-box; width: 90%; max-width: 1300px; margin: 0 auto; } .header-btn { line-height: 0.6; } .header-btn.desktop-hide a, .header-btn.desktop-hide a:visited { padding: 12px 30px; font-size: 18px; } body.logged-in.admin-bar header { top: 32px; } body.logged-in.admin-bar.hide-topbar header { top: -12px; } .desktop-hide { display: none; } .search-bar-form { display: flex; align-items: center; justify-content: center; position: fixed; top: 0; left: 0; z-index: 999; width: 100vw; height: 100vh; opacity: 0; visibility: hidden; transition: all 0.35s ease-in-out; } .search-bar-form .close-icon { top: calc(50% - 35px); right: calc(5% + 20px); } .search-bar-form .close-icon img { filter: brightness(0) saturate(100%) invert(7%) sepia(62%) saturate(5450%) hue-rotate(218deg) brightness(98%) contrast(102%); } .search-bar-form::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--kn_blue_2); } .search-bar-form.active { opacity: 1; visibility: visible; } .search-bar-form form { width: 90%; border-radius: 8px; height: 108px; margin-bottom: 0; position: relative; z-index: 1; display: flex; align-items: flex-end; padding: 30px 50px 35px; } .search-bar-form form, .search-bar-form input { margin-bottom: 0; background-color: var(--kn_white); } .search-bar-form input { border-radius: 0; background-image: none; display: block; margin-inline: auto; padding: 0; border: none; border-bottom: 1px solid var(--kn_border1); font-size: clamp(1.125rem, 3.871vw - 1.352rem, 1.5rem); } .search-bar-form input:focus { border-bottom-color: var(--kn_border_4); } .close-icon, .search-icon { cursor: pointer; line-height: 0.6; } .search-icon { width: 36px; } .search-icon img { filter: invert(0) brightness(2); } .close-icon { line-height: 0.6; position: absolute; width: 18px; height: 18px; z-index: 8; transition: transform 0.3s ease-in-out; } .close-icon:hover { transform: rotate(180deg); } .newsletter-box { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 999; display: flex; justify-content: center; align-items: center; } .newsletter-box::before, .newsletter-box::after { content: ""; position: absolute; left: 0; width: 100%; height: 0; background-color: var(--kn_blue_2); transition: height 0.3s ease-in-out; } .newsletter-box::before { top: 0; } .newsletter-box::after { bottom: 0; } .newsletter-box.show, .newsletter-box.show .newsletter-form-ctn { opacity: 1; visibility: visible; } .newsletter-box.show::before, .newsletter-box.show::after { height: 50%; } .language-converter { position: relative; z-index: 999; } .language-converter #langMenu li { margin-bottom: 0; } .language-converter #langMenu li a, .language-converter #langMenu li a:visited { padding: 10px 18px; } .lang-dropdown-toggle { display: block; } .Islamic-date, .lang-dropdown-toggle { padding: 10px 30px; height: 100%; background-color: var(--kn_white); } #langMenu { display: none; background-color: var(--kn_white); position: absolute; left: 0; border-radius: 0 0 8px 8px; width: 100%; box-shadow: 0 2px 8px rgba(51, 51, 51, 0.15), 0 2px 13px rgba(51, 51, 51, 0.2); } #langMenu li a, #langMenu li a:visited { display: block; } #langMenu li a:hover, #langMenu li a:visited:hover { background-color: var(--kn_brown_2); } #langMenu li:last-child a, #langMenu li:last-child a:visited { border-radius: 0 0 8px 8px; } /*------------------------------------------------- >> Styles for desktop menu -------------------------------------------------*/ @media (min-width: 1024px) { .header-nav ul li:hover > ul, .menu-item-has-children ul.focused, .header-nav ul li a:focus-visible + ul { opacity: 1; visibility: visible; overflow: visible; } .header-nav ul li:hover > ul .mega-menu-ctn, .menu-item-has-children ul.focused .mega-menu-ctn, .header-nav ul li a:focus-visible + ul .mega-menu-ctn { pointer-events: initial; } .menu-btn { display: none; } .header-nav ul ul { animation-delay: 0.6s; opacity: 0; visibility: hidden; overflow: hidden; transition: all 0.3s ease-in-out; } .mega-menu-ctn { width: 100vw; height: calc(100vh - 108px); position: fixed; left: 0; top: 120px; text-align: left; pointer-events: none; } .mega-menu-ctn .mega-menu-col-inner a, .mega-menu-ctn .mega-menu-col-inner a:visited { line-height: 1.3; } .mega-menu-ctn .mega-menu-col-inner .book-img a:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .book-img a:visited:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .book-img a.category-link, .mega-menu-ctn .mega-menu-col-inner .book-img a:visited.category-link, .mega-menu-ctn .mega-menu-col-inner .book-category a:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .book-category a:visited:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .book-category a.category-link, .mega-menu-ctn .mega-menu-col-inner .book-category a:visited.category-link, .mega-menu-ctn .mega-menu-col-inner .mega-menu-col-left-content a:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .mega-menu-col-left-content a:visited:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .mega-menu-col-left-content a.category-link, .mega-menu-ctn .mega-menu-col-inner .mega-menu-col-left-content a:visited.category-link, .mega-menu-ctn .mega-menu-col-inner .article-item h3 a:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .article-item h3 a:visited:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .article-item h3 a.category-link, .mega-menu-ctn .mega-menu-col-inner .article-item h3 a:visited.category-link, .mega-menu-ctn .mega-menu-col-inner .book-title a:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .book-title a:visited:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .book-title a.category-link, .mega-menu-ctn .mega-menu-col-inner .book-title a:visited.category-link, .mega-menu-ctn .mega-menu-col-inner .article-item a:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .article-item a:visited:not(.read-more), .mega-menu-ctn .mega-menu-col-inner .article-item a.category-link, .mega-menu-ctn .mega-menu-col-inner .article-item a:visited.category-link { padding: 0; } .mega-menu-ctn .mega-menu-col-inner .book-img a:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .book-img a:visited:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .book-img a.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .book-img a:visited.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .book-category a:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .book-category a:visited:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .book-category a.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .book-category a:visited.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .mega-menu-col-left-content a:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .mega-menu-col-left-content a:visited:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .mega-menu-col-left-content a.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .mega-menu-col-left-content a:visited.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .article-item h3 a:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .article-item h3 a:visited:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .article-item h3 a.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .article-item h3 a:visited.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .book-title a:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .book-title a:visited:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .book-title a.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .book-title a:visited.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .article-item a:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .article-item a:visited:not(.read-more):hover, .mega-menu-ctn .mega-menu-col-inner .article-item a.category-link:hover, .mega-menu-ctn .mega-menu-col-inner .article-item a:visited.category-link:hover { background-color: transparent; } .mega-menu-ctn .mega-menu-col-inner a.button, .mega-menu-ctn .mega-menu-col-inner a:visited.button { display: inline-block; color: var(--kn_color_secondary); padding: 10px 20px; } .mega-menu-ctn .mega-menu-col-inner a.button:hover, .mega-menu-ctn .mega-menu-col-inner a:visited.button:hover { background-color: var(--kn_theme_btn_bgcolor_hover); color: var(--kn_theme_btn_color_hover); } .mega-menu-ctn .mega-menu-col-inner .article-content-inner a.button, .mega-menu-ctn .mega-menu-col-inner .article-content-inner a:visited.button { padding: 10px 20px; } .mega-menu-ctn .mega-menu-col-inner .article-content-inner a.button:hover, .mega-menu-ctn .mega-menu-col-inner .article-content-inner a:visited.button:hover { background-color: var(--kn_theme_btn_bgcolor_hover); } .mega-menu-ctn .book-category { margin-bottom: 10px; } .mega-menu-ctn .block-button { margin-top: 30px; } .mega-menu-left-col { width: 32%; } .mega-menu-left-col .mega-menu-col-inner { background-repeat: no-repeat; background-size: cover; background-position: center; height: 100%; display: flex; flex-direction: column; align-items: baseline; justify-content: flex-end; box-sizing: border-box; } .mega-menu-left-col .mega-menu-col-inner a, .mega-menu-left-col .mega-menu-col-inner a:visited { color: var(--kn_white); } .mega-menu-left-col .mega-menu-col-inner a:hover, .mega-menu-left-col .mega-menu-col-inner a:visited:hover { color: var(--kn_color_primary); } .mega-menu-col-left-content { padding: 30px; } .mega-menu-col-left-content a, .mega-menu-col-left-content a:visited { color: var(--kn_white); } .mega-menu-col-left-content a.read-more, .mega-menu-col-left-content a:visited.read-more { padding: 2px 24px 2px 0; display: inline-block; background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgMjAuMDAgMjAuMDAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgZmlsbD0iI2ZmZiIgdHJhbnNmb3JtPSJyb3RhdGUoMCkiIHN0cm9rZT0iI2ZmZiI+Cg08ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiIHN0cm9rZS13aWR0aD0iMCIvPgoNPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cg08ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+IDx0aXRsZT5hcnJvd19yaWdodF91cCBbI2ZmZl08L3RpdGxlPiA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gPGRlZnM+IDwvZGVmcz4gPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+IDxnIGlkPSJEcmliYmJsZS1MaWdodC1QcmV2aWV3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzgwLjAwMDAwMCwgLTY1OTkuMDAwMDAwKSIgZmlsbD0iI2ZmZiI+IDxnIGlkPSJpY29ucyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNTYuMDAwMDAwLCAxNjAuMDAwMDAwKSI+IDxwb2x5Z29uIGlkPSJhcnJvd19yaWdodF91cC1bI2ZmZl0iIHBvaW50cz0iMzI0IDY0NTcuNjAyIDMyNS4zOTMgNjQ1OC45OTcgMzQyIDY0NDIuMzQ5IDM0MiA2NDUzIDM0NCA2NDUzIDM0NCA2NDM5IDMyOS45MDcgNjQzOSAzMjkuODc3IDY0NDEgMzQwLjYzNCA2NDQxIj4gPC9wb2x5Z29uPiA8L2c+IDwvZz4gPC9nPiA8L2c+Cg08L3N2Zz4=); background-size: 13px; } .mega-menu-col-left-content a.read-more:hover, .mega-menu-col-left-content a:visited.read-more:hover { background-color: unset; } .mega-menu-tab-content { padding-right: 30px; height: 520px; overflow-y: auto; } .mega-menu-right-col { width: 68%; background-color: var(--kn_white); padding: 30px 30px 40px; } .mega-menu-right-col .mega-menu-tab-nav ul { position: initial; width: auto; opacity: 1; visibility: visible; box-shadow: none; display: flex; gap: 10px; padding: 0; margin-bottom: 30px; } .mega-menu-right-col .mega-menu-tab-nav ul li { margin-bottom: 0; } .mega-menu-right-col .mega-menu-col-inner .book-buttons a.read-more, .mega-menu-right-col .mega-menu-col-inner .book-buttons a:visited.read-more { padding: 2px 16px 2px 0; } .mega-menu-right-col .mega-menu-col-inner .book-buttons a.download-btn, .mega-menu-right-col .mega-menu-col-inner .book-buttons a:visited.download-btn { padding: 2px 22px 2px 0; } .mega-menu-right-col .mega-menu-col-inner .book-buttons a:hover, .mega-menu-right-col .mega-menu-col-inner .book-buttons a:visited:hover { background-color: unset; } .mega-menu-right-col .mega-menu-col-inner h2 a, .mega-menu-right-col .mega-menu-col-inner h2 a:visited, .mega-menu-right-col .mega-menu-col-inner h3 a, .mega-menu-right-col .mega-menu-col-inner h3 a:visited, .mega-menu-right-col .mega-menu-col-inner h4 a, .mega-menu-right-col .mega-menu-col-inner h4 a:visited, .mega-menu-right-col .mega-menu-col-inner h5 a, .mega-menu-right-col .mega-menu-col-inner h5 a:visited, .mega-menu-right-col .mega-menu-col-inner h6 a, .mega-menu-right-col .mega-menu-col-inner h6 a:visited { color: var(--kn_regular); } .mega-menu-right-col .mega-menu-col-inner h2 a:hover, .mega-menu-right-col .mega-menu-col-inner h2 a:visited:hover, .mega-menu-right-col .mega-menu-col-inner h3 a:hover, .mega-menu-right-col .mega-menu-col-inner h3 a:visited:hover, .mega-menu-right-col .mega-menu-col-inner h4 a:hover, .mega-menu-right-col .mega-menu-col-inner h4 a:visited:hover, .mega-menu-right-col .mega-menu-col-inner h5 a:hover, .mega-menu-right-col .mega-menu-col-inner h5 a:visited:hover, .mega-menu-right-col .mega-menu-col-inner h6 a:hover, .mega-menu-right-col .mega-menu-col-inner h6 a:visited:hover { color: var(--kn_color_primary); } .mega-menu-right-col .book-category a, .mega-menu-right-col .book-category a:visited, .mega-menu-right-col .book-buttons a, .mega-menu-right-col .book-buttons a:visited { font-size: 15px; } .mega-menu-right-col .book-category a:hover, .mega-menu-right-col .book-category a:visited:hover, .mega-menu-right-col .book-buttons a:hover, .mega-menu-right-col .book-buttons a:visited:hover { color: var(--kn_color_primary); } .mega-menu-right-col .article-content-inner { line-height: 1.5; } .mega-menu-right-col .slider-article-ctn .owl-stage-outer { padding: 10px 12px 30px 12px; margin-left: -12px; } .mega-menu-tabs-ctn .mega-menu-tab-nav a, .mega-menu-tabs-ctn .mega-menu-tab-nav a:visited { border: 1px solid var(--kn_border1); border-radius: 6px; padding: 10px 20px; } .mega-menu-tabs-ctn .mega-menu-tab-nav a:hover, .mega-menu-tabs-ctn .mega-menu-tab-nav a.current, .mega-menu-tabs-ctn .mega-menu-tab-nav a:visited:hover, .mega-menu-tabs-ctn .mega-menu-tab-nav a:visited.current { color: var(--kn_theme_btn_color_hover); background-color: var(--kn_theme_btn_bgcolor_hover); border: 1px solid var(--kn_border_7); } } .header-nav { text-align: center; line-height: 1; } .header-nav > ul { display: flex; } .header-nav ul { margin: 0; padding: 0; position: relative; } .header-nav ul li { margin: 0; padding: 0; display: inline-block; position: relative; line-height: 1; } .header-nav ul li:last-child { margin-right: 0; } .header-nav ul li a, .header-nav ul li a:visited { padding: 30px 16px; display: inline-block; line-height: 1; border: 0; position: relative; color: var(--kn_white); } .header-nav ul li a::after, .header-nav ul li a:visited::after { content: ""; position: absolute; width: calc(100% - 10px); height: 2px; bottom: 0; left: 5px; background-color: var(--kn_white); transform: scaleX(0); transform-origin: bottom right; transition: transform 0.3s; } .header-nav ul li a:hover::after, .header-nav ul li a:visited:hover::after { transform-origin: bottom left; transform: scaleX(1); } .header-nav ul li.menu-item-has-children > a { padding-right: 35px; } .header-nav ul li.menu-item-has-children > a::before { content: ""; position: absolute; padding-right: 14px; top: 0; bottom: 0; right: 10px; margin-block: auto; background-position: center; background-repeat: no-repeat; background-size: 14px; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAyMiAxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEuNzczOCAxLjc3Njc5TDEwLjk5OCAxMC45OTk4TDIwLjIyMTEgMS43NzY3OSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyLjUiLz4KPC9zdmc+Cg==); transition: all 0.3s ease-in-out; filter: invert(1); } .header-nav ul li.menu-item-has-children > a::after { display: none; } .header-nav ul li.menu-item-has-children ul li a::after, .header-nav ul li.menu-item-has-children ul li a:visited::after { display: block; } .header-nav ul li.menu-item-has-children:hover a::before, .header-nav ul li.menu-item-has-children:hover a:visited::before { transform: rotate(180deg); } .header-nav ul li.menu-item-has-children .mega-menu-ctn a::after, .header-nav ul li.menu-item-has-children .mega-menu-ctn a:visited::after { display: none; } .header-nav ul li.current-menu-item > a, .header-nav ul li.current-menu-parent > a, .header-nav ul li a:hover { border: 0; } .header-nav ul li.current-menu-item > a::after, .header-nav ul li.current-menu-parent > a::after, .header-nav ul li a:hover::after { transform-origin: bottom left; transform: scaleX(1); } .header-nav ul ul { left: 0px; width: 240px; opacity: 0; box-shadow: 0 2px 8px rgba(51, 51, 51, 0.15), 0 2px 13px rgba(51, 51, 51, 0.2); background-color: var(--kn_header_submenu_bgcolor); visibility: hidden; padding: 20px 15px; border-radius: 0; position: absolute; top: 76px; z-index: 9; overflow: hidden; text-align: left; border-radius: 0 0 6px 6px; transition: all 0.4s ease-in-out; text-align: left; } .header-nav ul ul li { display: block; margin: 0 0 10px; } .header-nav ul ul li:last-child { margin: 0; } .header-nav ul ul li a, .header-nav ul ul li a:visited { padding: 5px; line-height: 1; box-sizing: border-box; position: relative; color: var(--kn_header_submenu_color); transition: all 0.3s ease-in-out; } .header-nav ul ul li a::after, .header-nav ul ul li a:visited::after { height: 1px; background-color: var(--kn_blue); } .header-nav ul ul li.current-menu-item > a, .header-nav ul ul li.current-menu-parent > a, .header-nav ul ul li a:hover { border: 0; } .header-nav ul ul li.current-menu-item > a::after, .header-nav ul ul li.current-menu-parent > a::after, .header-nav ul ul li a:hover::after { transform-origin: bottom left; transform: scaleX(1); } .header-nav ul ul ul { top: -10px; left: 230px; } .header-nav ul ul ul::before { display: none; content: ""; width: 1px; height: 1px; position: absolute; top: 12px; left: -5px; margin: auto; } /*------------------------------------------------- >> Styles for mobile menu -------------------------------------------------*/ @media (max-width: 1023px) { .header-inner { padding: 19px 0; } .right-header { width: 100%; float: none; } .nav-overlay .header-nav ul { margin: 0; padding: 0; background: transparent; width: 100%; display: block; } .nav-overlay .header-nav ul li { padding: 0; margin: 0 0 16px; position: relative; display: block; opacity: 1; line-height: 1; } .nav-overlay .header-nav ul li a, .nav-overlay .header-nav ul li a:visited { color: var(--kn_header_mobile_color); line-height: 1; display: inline-block; border-bottom: none; position: relative; padding: 5px 0; font-size: 18px; } .nav-overlay .header-nav ul li a::before, .nav-overlay .header-nav ul li a:visited::before { display: none; } .nav-overlay .header-nav ul li a::after, .nav-overlay .header-nav ul li a:visited::after { display: block; left: 0; width: 100%; background-color: var(--kn_color_primary); } .nav-overlay .header-nav ul li a:hover, .nav-overlay .header-nav ul li a:visited:hover { color: var(--kn_color_primary); background-color: transparent; } .nav-overlay .header-nav ul li.current-menu-item > a, .nav-overlay .header-nav ul li.current-menu-parent > a, .nav-overlay .header-nav ul li a:hover { border-bottom: none; } .nav-overlay .header-nav ul ul { transition: none; display: none; padding: 20px 0 0 20px; position: relative; top: initial; left: initial; opacity: initial; visibility: initial; overflow: visible; box-shadow: none; } .nav-overlay .header-nav ul ul li { margin: 0 0 10px; } .nav-overlay .header-nav ul ul li:last-child { margin-bottom: 0; } .nav-overlay .header-nav ul ul li a, .nav-overlay .header-nav ul ul li a:visited { text-transform: inherit; font-size: 16px; } .nav-overlay .header-nav ul ul li.current-menu-item > a, .nav-overlay .header-nav ul ul li.current-menu-parent > a { color: var(--kn_header_mobile_submenu_color); } .nav-overlay .header-nav ul ul ul { padding: 20px 0 10px 20px; } .header-nav ul li.menu-item-has-children > a { background-image: none; padding-right: 0; } .nav-overlay { position: fixed; background-color: var(--kn_nav_overlay_bgcolor); top: 0; left: 0; width: 100%; height: 100%; height: 100vh; opacity: 0; visibility: hidden; overflow: visible; box-sizing: border-box; z-index: 8; transition: all 0.3s ease-in-out; } .nav-overlay .nav-container { display: block; } .logged-in.admin-bar .nav-overlay { top: 110px; } .nav-overlay.open { opacity: 1; visibility: visible; overflow-y: scroll; } .nav-overlay.open .header-btns { margin-top: 30px; top: 0; opacity: 1; } header .nav-container { opacity: 0; transition: all 0.4s ease-in-out; transition-delay: 0.25s; padding: 40px 0 70px; box-sizing: border-box; width: 90%; margin: 0 auto; } header .nav-container .header-nav { text-align: left; } header .nav-overlay.open .nav-container { opacity: 1; display: block; } header.shrink .nav-overlay.open .nav-container { opacity: 1; } .nav-content { height: 100%; max-height: 100%; overflow-y: scroll; overflow-x: hidden; box-sizing: border-box; } .nav-content::-webkit-scrollbar-track { box-shadow: none; background-color: transparent; } .nav-content::-webkit-scrollbar { width: 3px; background-color: transparent; position: relative; left: 5px; box-shadow: none; } .nav-content::-webkit-scrollbar-thumb { box-shadow: none; border-radius: 2px; } .desktop-hide { display: block !important; } .header-btns { display: none; margin-top: 70px; position: relative; top: 100px; opacity: 0; transition: all 0.5s ease-in-out; } .menu-btn { top: 0; right: 0; height: 23px; width: 30px; cursor: pointer; z-index: 9999; display: inline-flex; flex-direction: column; position: relative; justify-content: space-between; transition: all 0.3s ease-in-out; } .menu-btn span { height: 2px; width: 100%; background-color: var(--kn_mobile_nav_icon_bgcolor); opacity: 1; transition: all 0.3s ease-in-out; } .menu-btn span.middle { width: 70%; margin-inline: auto 0; } .menu-btn.active span:first-child { transform: translateY(10.5px) translateX(0) rotate(-45deg); } .menu-btn.active span:last-child { transform: translateY(-10.5px) translateX(0) rotate(45deg); } .menu-btn.active span.middle { opacity: 0; } li.menu-item-has-children .submenu-icon { position: absolute; z-index: 9999; right: 0; top: 0; display: block; height: 22px; width: 22px; cursor: pointer; background-position: center; background-size: 18px; background-repeat: no-repeat; background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDU2IDMyIiB3aWR0aD0iNTYiIGhlaWdodD0iMzIiPgoJPHRpdGxlPmRvd24tYXJyb3ctYmFja3VwLTItc3ZncmVwby1jb208L3RpdGxlPgoJPHN0eWxlPgoJCS5zMCB7IGZpbGw6ICMwMDIzNjYgfSAKCTwvc3R5bGU+Cgk8ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiPgoJPC9nPgoJPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciI+Cgk8L2c+Cgk8ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+CgkJPHBhdGggY2xhc3M9InMwIiBkPSJtNTIuNSAwbDMuNSAzLjItMjggMjguOC0yOC0yOC44IDMuNS0zLjIgMjQuNSAyNS4yeiIvPgoJPC9nPgo8L3N2Zz4=); transition: transform 0.3s ease-in-out; } li.menu-item-has-children.active > .submenu-icon { transform: rotate(180deg); } } .no-overflow .logged-in.admin-bar .nav-overlay { top: 32px; height: calc(100vh - 32px); } @media (max-width: 782px) { .no-overflow .logged-in.admin-bar .left-header { top: 110px; } .no-overflow .logged-in.admin-bar .nav-overlay { top: 109px; height: calc(100vh - 46px); } #wpadminbar { position: fixed !important; } body.logged-in.admin-bar header { top: 46px; } body.logged-in.admin-bar.hide-topbar header { top: 2px; } } @media (max-width: 604px) { .hide-topbar header { top: -68px; } body.logged-in.admin-bar.hide-topbar header { top: -22px; } } @media (max-width: 315px) { .hide-topbar header { top: -92px; } body.logged-in.admin-bar.hide-topbar header { top: -46px; } } /*------------------------------------------------- >> Styles for Masthead -------------------------------------------------*/ /*------------------------------------------------- >> Styles for Default -------------------------------------------------*/ .hero-section { padding: clamp(5.625rem, 2.315vw + 4.514rem, 6.25rem) 0 clamp(4.375rem, 6.944vw + 1.042rem, 6.25rem); } .hero-section.hero-home { padding: 0; } .hero-section .block-button { margin-top: 30px; } .hero-section .course-meta { margin-top: 20px; justify-content: center; gap: 12px 30px; } .hero-section .course-meta .course-date::before, .hero-section .course-meta .course-location::before, .hero-section .course-meta .course-address::before { filter: invert(1) brightness(2); } .hero-inner { justify-content: space-between; align-items: center; gap: 44px 30px; } .hero-content.center-align * { margin-inline: auto; } .hero-content.center-align .course-meta * { margin-inline: unset; } .hero-content p + h2, .hero-content p + h3, .hero-content p + h4 + h5, .hero-content p + h6 { margin-top: 30px; } .hero-section-default { background-color: var(--kn_color_secondary); } .hero-section-default .hero-image { position: relative; aspect-ratio: 1/1; } .hero-section-default::after { content: ""; position: absolute; top: 2.5%; right: 5%; background-image: url(images/Arabic-Calligraphy.png); background-repeat: no-repeat; background-size: contain; width: 80%; height: 15%; opacity: 0.2; } .hero-section-default .category-area .category-links a, .hero-section-default .category-area .category-links a:visited { color: var(--kn_color_secondary); background-color: var(--kn_white); border: var(--kn_border_6); } .hero-section-default .category-area .category-links a.active, .hero-section-default .category-area .category-links a:hover, .hero-section-default .category-area .category-links a:visited.active, .hero-section-default .category-area .category-links a:visited:hover { background-color: var(--kn_color_primary); color: var(--kn_color_secondary); border: var(--kn_border_4); } .hero-section-default #breadcrumbs li:nth-child(n+2)::before { color: var(--kn_white); } .hero-section-default .share-video a.button, .hero-section-default .share-video a:visited.button { background-color: var(--kn_white); } .hero-section-default .share-video a.button:hover, .hero-section-default .share-video a:visited.button:hover { background-color: var(--kn_color_primary); } /*------------------------------------------------- >> Styles for Home -------------------------------------------------*/ .hero-with-image, .hero-home .image-slider-item, .newsletter-form-ctn { position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; } .hero-with-image::before, .hero-home .image-slider-item::before, .newsletter-form-ctn::before { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: var(--kn_green_2); } .hero-section-default .hero-content *, .image-slider-item .hero-content *, .newsletter-form-ctn .hero-content * { max-width: 700px; position: relative; } .hero-section-default h1, .hero-section-default h2, .hero-section-default h3, .hero-section-default h4, .hero-section-default h5, .hero-section-default h6, .hero-section-default p, .hero-section-default li, .hero-section-default ol, .hero-section-default a:not(.button), .hero-section-default a:visited:not(.button), .hero-section-default .about-author, .hero-section-default span, .hero-section-default b, .hero-section-default strong, .image-slider-item h1, .image-slider-item h2, .image-slider-item h3, .image-slider-item h4, .image-slider-item h5, .image-slider-item h6, .image-slider-item p, .image-slider-item li, .image-slider-item ol, .image-slider-item a:not(.button), .image-slider-item a:visited:not(.button), .image-slider-item .about-author, .image-slider-item span, .image-slider-item b, .image-slider-item strong, .newsletter-form-ctn h1, .newsletter-form-ctn h2, .newsletter-form-ctn h3, .newsletter-form-ctn h4, .newsletter-form-ctn h5, .newsletter-form-ctn h6, .newsletter-form-ctn p, .newsletter-form-ctn li, .newsletter-form-ctn ol, .newsletter-form-ctn a:not(.button), .newsletter-form-ctn a:visited:not(.button), .newsletter-form-ctn .about-author, .newsletter-form-ctn span, .newsletter-form-ctn b, .newsletter-form-ctn strong { color: var(--kn_white); } .newsletter-box, .newsletter-form-ctn { visibility: hidden; opacity: 0; transition: all 0.4s ease-in-out; } .newsletter-form-ctn { padding: clamp(1.5rem, 13.198vw - 6.773rem, 3.125rem) clamp(1.875rem, 5.076vw - 1.307rem, 2.5rem); gap: 40px; max-width: 500px; margin-inline: auto; border-radius: 10px; opacity: 0; visibility: hidden; transition-delay: 0.4s; z-index: 1; } .newsletter-form-ctn h1, .newsletter-form-ctn h2, .newsletter-form-ctn h3, .newsletter-form-ctn h4, .newsletter-form-ctn h5, .newsletter-form-ctn h6 { margin-bottom: 0; } .newsletter-form-ctn::before { border-radius: 10px; } .newletter-logo, .newsletter-content { position: relative; } .newsletter-content { margin-top: 24px; } .newletter-logo { display: flex; align-items: center; gap: 20px; } .newletter-logo h2, .newletter-logo h3, .newletter-logo h4, .newletter-logo h5, .newletter-logo h6 { max-width: 220px; font-size: 18px; } .newletter-logo img { width: clamp(5rem, 10.152vw - 1.364rem, 6.25rem); } .newsletter-form { margin-top: 30px; } .newsletter-form form { position: relative; } .newsletter-form form, .newsletter-form input { margin-bottom: 0; } .newsletter-form input[type=email] { background-color: var(--kn_white); border-color: var(--kn_border_6); } .newsletter-form input[type=submit] { position: absolute; top: 0; right: 0; margin-right: 0; border-radius: 0 4px 4px 0; } .hero-home .image-slider-item { display: flex; flex-direction: column; justify-content: center; padding: 100px 0 130px; box-sizing: border-box; min-height: calc(100vh - 108px); } .hero-home .hero-content * { margin-inline: auto; text-align: center; } /*------------------------------------------------- >> Styles for Contact -------------------------------------------------*/ .contact-us-inner { justify-content: space-between; gap: 44px 30px; } .col-left { width: calc(45% - 20px); } .col-right { width: calc(55% - 20px); } .col-right form, .col-right input[type=submit] { margin: 0; } .contact-tile { gap: 16px; } .contact-tile:nth-child(n+2) { margin-top: 30px; } .contact-tile a:hover, .contact-tile a:active, .contact-tile a:visited:hover, .contact-tile a:visited:active { color: var(--kn_link_color_hover); } .contact-tile iframe, .contact-tile embed { width: 100%; -o-object-fit: cover; object-fit: cover; aspect-ratio: 1/0.8; } .contact-icon { line-height: 0.6; width: clamp(2.75rem, 4.63vw + 0.528rem, 4rem); height: clamp(2.75rem, 4.63vw + 0.528rem, 4rem); background-color: var(--kn_color_secondary); display: flex; justify-content: center; align-items: center; border-radius: 50%; margin-top: 3px; } .contact-icon img { max-width: clamp(1.25rem, 2.315vw + 0.139rem, 1.875rem); max-height: clamp(1.25rem, 2.315vw + 0.139rem, 1.875rem); border-radius: 0; } .contact-content { width: calc(100% - clamp(3.875rem, 4.63vw + 1.653rem, 5.125rem)); } .contact-content h2, .contact-content h3, .contact-content h4, .contact-content h5, .contact-content h6 { margin-bottom: 6px; } .contact-content address { font-style: normal; margin-bottom: 0; } .contact-tiles { margin-top: 30px; } /*------------------------------------------------- >> Styles for Single Book -------------------------------------------------*/ .hero-book-detail { justify-content: space-between; gap: 44px 30px; } .hero-book-detail .book-meta { margin-bottom: 20px; } .hero-book-detail .hero-image { position: sticky; top: 200px; } .hero-book-detail .hero-image img { aspect-ratio: 1/1.2; } .book-detail { margin-top: 30px; } .book-detail p + ul, .book-detail p + ol { margin-top: 30px; } .about-author { font-weight: 700; } .book-about { margin-bottom: 20px; gap: 20px; } .book-meta { flex-wrap: wrap; gap: 10px 30px; } /*------------------------------------------------- >> Styles for footer -------------------------------------------------*/ .footer-section { background-color: var(--kn_footer_bgcolor); position: relative; } .footer-section::before { content: ""; position: absolute; top: 2.5%; left: 20%; background-image: url(images/Arabic-Calligraphy.png); background-repeat: no-repeat; background-size: contain; width: 60%; height: 15%; opacity: 0.2; } .footer-cta { border-bottom: 3px solid var(--kn_border_4); padding: var(--kn_space_12) 0; } .footer-ctn { padding: var(--kn_space_12) 0 0; } .footer-ctn h1, .footer-ctn h2, .footer-ctn h3, .footer-ctn h4, .footer-ctn h5, .footer-ctn h6, .footer-ctn p, .footer-ctn ul, .footer-ctn a { color: var(--kn_footer_color); } .footer-ctn .logo { width: clamp(6.25rem, 10.152vw - 0.114rem, 7.5rem); } .footer-ctn .logo a, .footer-ctn .logo a:visited { display: block; } .footer-bottom { padding: var(--kn_space_12) 0 30px; justify-content: space-between; gap: 20px; } .copyright { width: 45%; color: var(--kn_copyright_color); } .legal-nav { width: 55%; } .legal-nav ul { margin: 0; padding: 0; list-style-type: none; display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; gap: 12px 20px; } .legal-nav ul li { padding: 0; margin-bottom: 0; } .legal-nav ul li a, .legal-nav ul li a:visited { line-height: 1; padding-bottom: 2px; } .legal-nav ul li.current-menu-item a::after { transform-origin: bottom left; transform: scaleX(1); } .legal-nav ul li:first-child { margin-right: 0; } .social-icons { margin-top: 24px; display: flex; gap: 12px 18px; } .social-icons a { background-color: var(--kn_color_primary); width: 40px; height: 40px; border-radius: 50%; } .social-icons a.twitter svg { max-width: 20px; } .social-icons a svg { max-width: 24px; max-height: 24px; } .social-icons a svg path { transition: all 0.3s ease-in-out; fill: var(--kn_color_secondary); } .social-icons a:hover { background-color: var(--kn_brown_2); } .social-icons svg { margin: 0; max-width: 20px; } .organization-address address { color: var(--kn_white); font-style: normal; } .footer-top { justify-content: space-between; gap: 44px 30px; } .footer-widget:nth-child(1) { width: 40%; margin-right: 5%; } .footer-widget:nth-child(2), .footer-widget:nth-child(3) { width: 12%; } .footer-widget:nth-child(4) { width: 24%; } .footer-menu ul { margin: 0; } .footer-menu ul li { padding-left: 0; } .footer-menu ul li:last-child { margin-bottom: 0; } .footer-text { margin-top: 30px; } .site-address { margin-bottom: 20px; } .site-address address { font-style: normal; color: var(--kn_white); } .site-address a, .site-address a:visited { padding-left: 26px; background-size: 18px; background-position: left center; background-repeat: no-repeat; } .organization-email { margin-bottom: 8px; } .organization-email a, .organization-email a:visited { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBmaWxsPSIjZmZmIiB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHJva2U9IiNmZmYiPgoNPGcgaWQ9IlNWR1JlcG9fYmdDYXJyaWVyIiBzdHJva2Utd2lkdGg9IjAiLz4KDTxnIGlkPSJTVkdSZXBvX3RyYWNlckNhcnJpZXIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgoNPGcgaWQ9IlNWR1JlcG9faWNvbkNhcnJpZXIiPgoNPHBhdGggZD0iTTIyLDVWOUwxMiwxMywyLDlWNUExLDEsMCwwLDEsMyw0SDIxQTEsMSwwLDAsMSwyMiw1Wk0yLDExLjE1NFYxOWExLDEsMCwwLDAsMSwxSDIxYTEsMSwwLDAsMCwxLTFWMTEuMTU0bC0xMCw0WiIvPgoNPC9nPgoNPC9zdmc+); } .head-office-contact a, .head-office-contact a:visited { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBmaWxsPSIjZmZmIiBoZWlnaHQ9IjgwMHB4IiB3aWR0aD0iODAwcHgiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUxMiA1MTIiIHN0cm9rZT0iI2ZmZiI+Cg08ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiIHN0cm9rZS13aWR0aD0iMCIvPgoNPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cg08ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+IDxnPiA8Zz4gPHBhdGggZD0ibTQ2MC41LDUybC01OS0zNC45Yy04LjItNi0zOS40LTE0LjktNTksMTUuMWwtNDMuNSw3My4yYy0xNy4xLDI5LjEgNC44LDU0LjQgMTUuMSw1OSAwLDAgNC4zLDEuOSAyLjksMy41LTMyLjcsMzguOS04NS4yLDk2LjMtMTUwLjMsMTQ5LjktMC40LDAtNS4zLTYuOC01LjMtNi44LTguNS0xMy42LTMyLjItMjkuMi01OS42LTEyLjVsLTcxLjMsNDYuNWMtMjcuMywxOC40LTIwLjcsNTAuMy0xMi41LDU5LjZsMzguNiw1OS4xYzQxLjQsNTYuOSA5OC40LDMzLjUgMTExLjEsMjUuOSA3Ni45LTQ1LjUgMjIwLjktMTQ4LjQgMzIyLjQtMzI1LjggMjIuMy0zOC45IDktODktMjkuNi0xMTEuOHoiLz4gPHBhdGggZD0ibTM0LjMsMjUzLjVjMTEuMywwIDIwLjQtOS4xIDIwLjQtMjAuNCAwLTk0LjMgNzYuNy0xNzEgMTcxLTE3MSAxMS4zLDAgMjAuNC05LjEgMjAuNC0yMC40cy05LjEtMjAuNC0yMC40LTIwLjRjLTExNi44LDAtMjExLjgsOTUtMjExLjgsMjExLjggMi4zMDkyNmUtMTQsMTEuMiA5LjIsMjAuNCAyMC40LDIwLjR6Ii8+IDxwYXRoIGQ9Ik0xMTcsMjIyLjhjMCwxMS4zLDkuMSwyMC40LDIwLjQsMjAuNGMxMS4zLDAsMjAuNC05LjEsMjAuNC0yMC40YzAtMzEuOCwyNS45LTU3LjcsNTcuNy01Ny43YzExLjMsMCwyMC40LTkuMSwyMC40LTIwLjQgYzAtMTEuMy05LjEtMjAuNC0yMC40LTIwLjRDMTYxLjIsMTI0LjMsMTE3LDE2OC41LDExNywyMjIuOHoiLz4gPC9nPiA8L2c+IDwvZz4KDTwvc3ZnPg==); } .legal-nav a, .legal-nav a:visited, .footer-menu a, .footer-menu a:visited, .organization-email a, .organization-email a:visited, .head-office-contact a, .head-office-contact a:visited { position: relative; display: inline-block; } .legal-nav a::after, .legal-nav a:visited::after, .footer-menu a::after, .footer-menu a:visited::after, .organization-email a::after, .organization-email a:visited::after, .head-office-contact a::after, .head-office-contact a:visited::after { content: ""; position: absolute; width: 100%; height: 1px; bottom: 0; left: 0; background-color: var(--kn_border_4); transform: scaleX(0); transform-origin: bottom right; transition: transform 0.3s; } .legal-nav a:hover::after, .legal-nav a:visited:hover::after, .footer-menu a:hover::after, .footer-menu a:visited:hover::after, .organization-email a:hover::after, .organization-email a:visited:hover::after, .head-office-contact a:hover::after, .head-office-contact a:visited:hover::after { transform-origin: bottom left; transform: scaleX(1); } /*------------------------------------------------- >> Styles for Containers -------------------------------------------------*/ /**** * * containers * ****/ .ctn-1300 .wrapper { max-width: 1300px; } .wrapper, .hero-home-slider .hero-content { max-width: 1180px; width: 90%; margin: 0 auto; } .ctn-980 .wrapper { max-width: 980px; } .ctn-760 .wrapper, .register-form { max-width: 760px; } .full-width-ctn .wrapper { max-width: 100%; width: 100%; } .green-ctn { background-color: var(--kn_color_secondary); } .green-ctn h1, .green-ctn h2, .green-ctn h3, .green-ctn h4, .green-ctn h5, .green-ctn h6, .green-ctn p, .green-ctn li, .green-ctn a, .green-ctn a:visited, .green-ctn span, .green-ctn .course-address { color: var(--kn_white); } .green-ctn a, .green-ctn a:visited { color: var(--kn_color_primary); } /*------------------------------------------------- >> Styles for Spacers -------------------------------------------------*/ .is-style-gl-s1, .gl-s1 { height: var(--kn_space_1); } .is-style-gl-s2, .gl-s2 { height: var(--kn_space_2); } .is-style-gl-s3, .gl-s3 { height: var(--kn_space_3); } .is-style-gl-s4, .gl-s4 { height: var(--kn_space_4); } .is-style-gl-s5, .gl-s5 { height: var(--kn_space_5); } .is-style-gl-s6, .gl-s6 { height: var(--kn_space_6); } .is-style-gl-s7, .gl-s7 { height: var(--kn_space_7); } .is-style-gl-s8, .gl-s8, .s-44 { height: var(--kn_space_8); } .is-style-gl-s9, .gl-s9, .s-48 { height: var(--kn_space_9); } .is-style-gl-s10, .gl-s10 { height: var(--kn_space_10); } .is-style-gl-s11, .gl-s11 { height: var(--kn_space_11); } .is-style-gl-s12, .gl-s12, .s-96 { height: var(--kn_space_12); } .is-style-gl-s13, .gl-s13 { height: var(--kn_space_13); } .is-style-gl-s14, .gl-s14 { height: var(--kn_space_14); } .is-style-gl-s15, .gl-s15 { height: var(--kn_space_15); } /*------------------------------------------------- >> Styles for Theme Spacers -------------------------------------------------*/ .ts-160 { height: 160px; } .ts-140 { height: 140px; } .ts-120 { height: 120px; } .ts-100 { height: 100px; } .ts-80 { height: 80px; } .ts-60 { height: 60px; } .ts-40 { height: 40px; } /*------------------------------------------------- >> Basic styles for theme -------------------------------------------------*/ /**** * * helper classes * ****/ .large-text { font-size: var(--kn_font_size_6); line-height: 1.3; } .text-24 { font-size: var(--kn_font_size_7); } .small-text { font-size: 0.875rem; line-height: 1; } .black-text { color: var(--wp--preset--color--black); } .white_text { color: var(--wp--preset--color--white); } .float-right { float: right; } .float-left { float: left; } .center-align { text-align: center; } .right-align { text-align: right; } .left-align { text-align: left; } .text-uppercase { text-transform: uppercase; } .text-decuration-none { text-decoration: none; } .d-flex { display: flex; } .d-inline-flex { display: inline-flex; } .flex-row { flex-direction: row; } .flex-column { flex-direction: column; } .flex-row-reverse { flex-direction: row-reverse; } .flex-column-reverse { flex-direction: column-reverse; } .justify-content-start { justify-content: flex-start; } .justify-content-end { justify-content: flex-end; } .justify-content-center { justify-content: center; } .justify-content-between { justify-content: space-between; } .justify-content-around { justify-content: space-around; } .align-items-start { align-items: flex-start; } .align-items-end { align-items: flex-end; } .align-items-center { align-items: center; } .align-items-baseline { align-items: baseline; } .align-items-stretch { align-items: stretch; } .align-content-start { align-content: flex-start; } .align-content-end { align-content: flex-end; } .align-content-center { align-content: center; } .align-content-between { align-content: space-between; } .align-content-around { align-content: space-around; } .align-content-stretch { align-content: stretch; } .align-self-auto { align-self: auto; } .align-self-start { align-self: flex-start; } .align-self-end { align-self: flex-end; } .align-self-center { align-self: center; } .align-self-baseline { align-self: baseline; } .align-self-stretch { align-self: stretch; } .flex-wrap { flex-wrap: wrap; } .flex-no-wrap { flex-wrap: nowrap; } .flex-center { display: flex; align-items: center; justify-content: center; } .bg-cover { background-size: cover; } .bg-contain { background-size: contain; } .bg-position-center { background-position: center; } .bg-norepeat { background-repeat: no-repeat; } .bg-repeat { background-repeat: repeat; } .reset-bg { background-size: cover; background-repeat: no-repeat; background-position: center; } .image-cover { line-height: 0.6; overflow: hidden; border-radius: 8px; } .image-cover a, .image-cover a:visited { display: block; line-height: 0.6; } .image-cover a:hover img, .image-cover a:hover video, .image-cover a:hover iframe, .image-cover a:hover embed, .image-cover a:visited:hover img, .image-cover a:visited:hover video, .image-cover a:visited:hover iframe, .image-cover a:visited:hover embed { transform: scale(1.05); } .image-cover img, .image-cover video, .image-cover iframe, .image-cover embed { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; transition: transform 0.3s ease-in-out; } .white-background { background-color: var(--kn_white); box-shadow: 0 14px 10px 0 var(--kn_green_2), 0 6px 15px 0 var(--kn_green_2); border-radius: 4px; } /**** * * breadcrumbs * ****/ #breadcrumbs { color: var(--kn_breadcrumb_color); text-transform: uppercase; margin-bottom: 22px; font-size: 13px; display: flex; gap: 10px; } #breadcrumbs ul { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; } #breadcrumbs span.breadcrumb_last { margin-left: 10px; } #breadcrumbs li { margin-bottom: 0; padding-left: 0; position: relative; list-style: none; } #breadcrumbs li::before { display: none; } #breadcrumbs li:nth-child(n+2) { padding-left: 16px; } #breadcrumbs li:nth-child(n+2)::before { content: "> "; position: absolute; top: 0; left: 0; display: inline-block; color: var(--kn_blue); background-color: transparent; } #breadcrumbs li a, #breadcrumbs li a:visited { color: var(--kn_breadcrumb_link_color); font-weight: 600; } #breadcrumbs li a:hover, #breadcrumbs li a:visited:hover { color: var(--kn_brown_2); } #breadcrumbs li a.active, #breadcrumbs li a:visited.active { color: var(--kn_color_white); } .single-post #breadcrumbs span span span span span span { color: var(--kn_breadcrumb_span_color); } .single-post #breadcrumbs span span span span span span a { color: var(--kn_breadcrumb_link_color); } /**** * * buttons * ****/ .learn-more { color: var(--wp--preset--color--black); } a.button, a.button:visited, span.button, .is-style-mycustomstyle .wp-element-button { box-sizing: border-box; position: relative; display: inline-block; overflow: hidden; padding: 10px 20px; text-decoration: none; color: var(--kn_theme_btn_color); background-color: var(--kn_theme_btn_bgcolor); border: none; transition: all 0.3s ease-in-out; margin-right: 9px; text-align: center; border-radius: 6px; line-height: 1.5; font-weight: 600; font-size: var(--kn_font_size_3); } a.button:last-child, a.button:visited:last-child, span.button:last-child, .is-style-mycustomstyle .wp-element-button:last-child { margin-right: 0; } a.button:hover, a.button:visited:hover, span.button:hover, .is-style-mycustomstyle .wp-element-button:hover { background-color: var(--kn_theme_btn_bgcolor_hover); color: var(--kn_theme_btn_color_hover); } a.button.outline-btn, a.button:visited.outline-btn, span.button.outline-btn, .is-style-mycustomstyle .wp-element-button.outline-btn { background-color: transparent; color: var(--kn_theme_btn_color_hover); border: 1px solid var(--kn_border1); color: var(--kn_blue); padding: 8px 18px; } a.button.outline-btn:hover, a.button:visited.outline-btn:hover, span.button.outline-btn:hover, .is-style-mycustomstyle .wp-element-button.outline-btn:hover { color: var(--kn_color_secondary); background-color: var(--kn_color_primary); border-color: var(--kn_border); } a.button.green-btn, a.button:visited.green-btn, span.button.green-btn, .is-style-mycustomstyle .wp-element-button.green-btn { background-color: var(--kn_color_secondary); color: var(--kn_white); } a.button.green-btn:hover, a.button:visited.green-btn:hover, span.button.green-btn:hover, .is-style-mycustomstyle .wp-element-button.green-btn:hover { background-color: var(--kn_green_3); } a.wp-block-button__link, a.wp-block-button__link:visited { box-sizing: border-box; position: relative; display: inline-block; overflow: hidden; padding: 11px 30px; text-decoration: none; color: var(--kn_theme_btn_color); background-color: var(--kn_theme_btn_bgcolor); border: 2px solid var(--kn_theme_btn_border_color); transition: all 0.35s ease-in-out; margin-right: 9px; font-size: var(--kn_font_size_3); border-radius: 100px; } a.wp-block-button__link:hover, a.wp-block-button__link:visited:hover { background-color: var(--kn_theme_btn_bgcolor_hover); border: 2px solid var(--kn_theme_btn_border_color_hover); color: var(--kn_theme_btn_color_hover); } a.wp-block-button__link.has-background, a.wp-block-button__link:visited.has-background { border: none; } a.wp-block-button__link.has-background:hover, a.wp-block-button__link:visited.has-background:hover { border: none; color: unset; } a.wp-block-button__link.has-text-color.has-background, a.wp-block-button__link:visited.has-text-color.has-background { border: none; } a.wp-block-button__link.has-text-color.has-background:hover, a.wp-block-button__link:visited.has-text-color.has-background:hover { border: none; } /**** * * WordPress buttons * ****/ /* Styles for the disabled button */ button[disabled] { background-color: #dddddd; /* Background color when disabled */ color: #999999; /* Text color when disabled */ cursor: not-allowed; /* Cursor style when disabled */ border: 1px solid #cccccc; /* Border color when disabled */ opacity: 0.6; /* Opacity when disabled */ /* Add any additional styles as needed */ } /* Optional: Hover styles for disabled button */ button[disabled]:hover { background-color: #dddddd; /* Background color on hover when disabled */ /* Add any additional hover styles as needed */ } .wp-block-button.is-style-outline a.wp-block-button__link, .wp-block-button.is-style-outline a.wp-block-button__link:visited { border: 2px solid var(--kn_wp_outline_btn_border_color); } .wp-block-button.is-style-outline a.wp-block-button__link:hover, .wp-block-button.is-style-outline a.wp-block-button__link:visited:hover { background-color: var(--kn_wp_outline_btn_bgcolor); color: var(--kn_wp_outline_btn_color); } .wp-block-button.is-style-outline a.wp-block-button__link.has-text-color:hover, .wp-block-button.is-style-outline a.wp-block-button__link.has-background:hover, .wp-block-button.is-style-outline a.wp-block-button__link:visited.has-text-color:hover, .wp-block-button.is-style-outline a.wp-block-button__link:visited.has-background:hover { background-color: unset; color: unset; } .wp-block-button.is-style-outline a.wp-block-button__link.has-text-color.has-background, .wp-block-button.is-style-outline a.wp-block-button__link:visited.has-text-color.has-background { border: none; } .wp-block-button.is-style-outline a.wp-block-button__link.has-text-color.has-background:hover, .wp-block-button.is-style-outline a.wp-block-button__link:visited.has-text-color.has-background:hover { border: none; } .no-visible { visibility: hidden; } /**** * * 404 page * ****/ .not-found { text-align: center; } .error { text-align: center; margin: 20px 0; width: 100%; } .error .menu { margin: 0; } .error ul li { display: inline-block; margin: 0 0 0 20px; font-weight: 700; padding: 0; } .error ul li::before { display: none; } .error ul li a { padding: 10px; border-bottom: 0; } .error ul li a:hover { color: var(--kn_error_menu_color); } .error ul li ul { display: none; } .form-404 { margin: 0 auto 0; max-width: 720px; } .form-404 p { margin-bottom: 20px; } /** * Custom Select Styles **/ .select-dropdown ul.select-dropdown__list { display: none; } .select-dropdown ul.select-dropdown__list.is-active-dropdown { display: block; } .select-dropdown ul.select-dropdown__list li.select-dropdown__item { outline: 2px dotted transparent; } .select-dropdown ul.select-dropdown__list li.select-dropdown__item:focus, .select-dropdown ul.select-dropdown__list li.select-dropdown__item:focus-visible { outline-color: black !important; } .select-dropdown .select-dropdown__button:focus, .select-dropdown .select-dropdown__button:focus-visible { outline-color: black !important; } img.main-image { opacity: 0; transition: all 500ms ease-in-out; } picture img.loaded { opacity: 1; } .owl-nav, .owl-dots { position: absolute; } .owl-nav { top: 50%; left: 0; right: 0; margin: auto; display: flex; align-items: center; width: 95%; } .owl-nav span { width: 100%; height: 100%; display: inline-block; background-repeat: no-repeat; background-size: 11px; background-position: center; font-size: 0; position: absolute; top: 0; left: 0; color: transparent; } .owl-nav button { box-shadow: 0 0 5px 0px var(--kn_dgray); } .owl-next { right: 0; } .owl-prev, .owl-next { width: 44px; height: 44px; } .owl-theme .owl-nav { margin-top: 0px; } .owl-theme .owl-nav [class*=owl-] { margin: 0; background: var(--kn_white) !important; padding: 0; border: none; outline: none; border-radius: 4px; position: absolute; box-shadow: 0 2px 8px rgba(51, 51, 51, 0.15), 0 2px 13px rgba(51, 51, 51, 0.2); } .owl-theme .owl-nav [class*=owl-] span { transition: filter 0.3s ease-in-out; } .owl-theme .owl-nav [class*=owl-]:hover { background-color: var(--kn_brown_2) !important; } .owl-theme .owl-nav .owl-prev span { background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDM2IDY0IiB3aWR0aD0iMzYiIGhlaWdodD0iNjQiPgoJPHRpdGxlPmFycm93LWNoZXZyb24tcmlnaHQ8L3RpdGxlPgoJPHN0eWxlPgoJCS5zMCB7IGZpbGw6ICMwMDIzNjYgfSAKCTwvc3R5bGU+Cgk8ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiPgoJPC9nPgoJPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciI+Cgk8L2c+Cgk8ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+CgkJPGcgaWQ9IlBhZ2UtMSI+CgkJCTxnIGlkPSJEcmliYmJsZS1MaWdodC1QcmV2aWV3Ij4KCQkJCTxnIGlkPSJpY29ucyI+CgkJCQkJPHBhdGggaWQ9ImFycm93X3JpZ2h0LVsjMDAyMzY2XSIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGFzcz0iczAiIGQ9Im00LjQgMGwtNC40IDQuNSAyNi40IDI3LjUtMi44IDMtMjMuNSAyNC40IDQuNCA0LjZjNi41LTYuOCAyNC42LTI1LjYgMzAuNy0zMi00LjUtNC42LTAuMS0wLjEtMzAuOC0zMnoiLz4KCQkJCTwvZz4KCQkJPC9nPgoJCTwvZz4KCTwvZz4KPC9zdmc+); transform: rotate(180deg); } .owl-theme .owl-nav .owl-next span { background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDM2IDY0IiB3aWR0aD0iMzYiIGhlaWdodD0iNjQiPgoJPHRpdGxlPmFycm93LWNoZXZyb24tcmlnaHQ8L3RpdGxlPgoJPHN0eWxlPgoJCS5zMCB7IGZpbGw6ICMwMDIzNjYgfSAKCTwvc3R5bGU+Cgk8ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiPgoJPC9nPgoJPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciI+Cgk8L2c+Cgk8ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+CgkJPGcgaWQ9IlBhZ2UtMSI+CgkJCTxnIGlkPSJEcmliYmJsZS1MaWdodC1QcmV2aWV3Ij4KCQkJCTxnIGlkPSJpY29ucyI+CgkJCQkJPHBhdGggaWQ9ImFycm93X3JpZ2h0LVsjMDAyMzY2XSIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGFzcz0iczAiIGQ9Im00LjQgMGwtNC40IDQuNSAyNi40IDI3LjUtMi44IDMtMjMuNSAyNC40IDQuNCA0LjZjNi41LTYuOCAyNC42LTI1LjYgMzAuNy0zMi00LjUtNC42LTAuMS0wLjEtMzAuOC0zMnoiLz4KCQkJCTwvZz4KCQkJPC9nPgoJCTwvZz4KCTwvZz4KPC9zdmc+); } .owl-theme .owl-dots .owl-dot { display: flex; justify-content: center; align-items: center; border: 2px solid var(--kn_border_4); background: var(--kn_white); box-shadow: 0 0 5px 0px var(--kn_dgray); } .owl-theme .owl-dots .owl-dot span { background: transparent; margin: 0; transition: all 0.3s ease-in-out; width: 12px; height: 12px; } .owl-theme .owl-dots .owl-dot:hover span, .owl-theme .owl-dots .owl-dot.active span { background: var(--kn_color_primary); } .owl-dots { display: flex; gap: 12px; justify-content: center; bottom: 60px; width: 100%; } .owl-dots button { margin: 0; border-radius: 50%; display: inline-block; zoom: 1; width: 22px; height: 22px; } .block-button { line-height: 0.6; margin-top: 20px; } .block-button.d-flex { gap: 12px 24px; } .col-50 { width: calc(50% - 15px); } .half-width { width: 50%; } .horizontal-center { margin-inline: auto; text-align: center; } .section-head h2, .section-head h3, .section-head h4, .section-head h5, .section-head h6 { margin-bottom: 0; } .section-head p:first-of-type { margin-top: 10px; } .section-head a.button, .section-head a:visited.button { margin-top: 20px; } .read-more { display: inline-block; background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDM2IDY0IiB3aWR0aD0iMzYiIGhlaWdodD0iNjQiPgoJPHRpdGxlPmFycm93LWNoZXZyb24tcmlnaHQ8L3RpdGxlPgoJPHN0eWxlPgoJCS5zMCB7IGZpbGw6ICMwMDIzNjYgfSAKCTwvc3R5bGU+Cgk8ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiPgoJPC9nPgoJPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciI+Cgk8L2c+Cgk8ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+CgkJPGcgaWQ9IlBhZ2UtMSI+CgkJCTxnIGlkPSJEcmliYmJsZS1MaWdodC1QcmV2aWV3Ij4KCQkJCTxnIGlkPSJpY29ucyI+CgkJCQkJPHBhdGggaWQ9ImFycm93X3JpZ2h0LVsjMDAyMzY2XSIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGFzcz0iczAiIGQ9Im00LjQgMGwtNC40IDQuNSAyNi40IDI3LjUtMi44IDMtMjMuNSAyNC40IDQuNCA0LjZjNi41LTYuOCAyNC42LTI1LjYgMzAuNy0zMi00LjUtNC42LTAuMS0wLjEtMzAuOC0zMnoiLz4KCQkJCTwvZz4KCQkJPC9nPgoJCTwvZz4KCTwvZz4KPC9zdmc+); background-size: 7px; background-position: right; background-repeat: no-repeat; padding: 2px 16px 2px 0; } .kicker { font-weight: 600; } .block-buttons { line-height: 0.6; display: flex; flex-wrap: wrap; gap: 12px; } .block-buttons a, .block-buttons a:visited { margin-right: 0; } /*------------------------------------------------- >> Basic styles for Blog post -------------------------------------------------*/ .posts-ctn { padding: 24px; } .posts-cats { margin-bottom: 20px; display: flex; flex-wrap: wrap; gap: 12px; } .post-lists { display: flex; flex-wrap: wrap; gap: 19px; } .post-box { width: calc(33% - 10px); } .post-box h2, .post-box h3, .post-box h4, .post-box h5, .post-box h6 { margin-bottom: 0; } .post-box h2 a, .post-box h2 a:visited, .post-box h3 a, .post-box h3 a:visited, .post-box h4 a, .post-box h4 a:visited, .post-box h5 a, .post-box h5 a:visited, .post-box h6 a, .post-box h6 a:visited { color: var(--kn_heading_color); } .post-box img { aspect-ratio: 2/1.2; border-radius: 4px; } .post-box .read-more { margin-top: 15px; display: inline-block; } .post-box p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .post-content { margin-top: 20px; } .post-content h2, .post-content h3, .post-content h4, .post-content h5, .post-content h6 { margin-bottom: 0; } .post-content .button { margin-top: 20px; } .post-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; } .post-cat { background-color: var(--kn_green); padding: 4px 14px; border-radius: 30px; } .post-except { margin-top: 10px; } .post-category { margin-bottom: 6px; display: inline-block; } /*------------------------------------------------- >> Basic styles for Blog post -------------------------------------------------*/ .two-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(clamp(300px, 50% - 2%, 100%), 100%), 1fr)); gap: 2%; row-gap: 36px; } .two-columns-ctn { justify-content: space-between; align-items: center; } .three-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(clamp(250px, 33.3333333333% - 2%, 100%), 100%), 1fr)); gap: 2%; } .three-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(clamp(250px, 33.3333333333% - 2%, 100%), 100%), 1fr)); gap: 2%; gap: 36px 24px; } .four-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(clamp(210px, 25% - 2%, 100%), 100%), 1fr)); gap: 2%; row-gap: 36px; } .books-four-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(clamp(210px, 25% - 2%, 100%), 100%), 1fr)); gap: 2%; row-gap: 36px; } .video-four-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(clamp(210px, 25% - 2%, 100%), 100%), 1fr)); gap: 2%; row-gap: 36px; } .audio-four-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(clamp(210px, 25% - 2%, 100%), 100%), 1fr)); gap: 2%; row-gap: 36px; } .five-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(clamp(200px, 20% - 2%, 100%), 100%), 1fr)); gap: 2%; row-gap: 36px; } .col-30 { width: 30%; } .col-40 { width: 40%; } .col-55 { width: 55%; } .col-65 { width: 65%; } .col-30.center-align, .col-40.center-align, .col-55.center-align, .col-65.center-align { margin-inline: auto; } .column .image-block { margin-bottom: 20px; } /*------------------------------------------------- >> Styles for Website Blocks -------------------------------------------------*/ /*------------------------------------------------- >> Basic styles for Defualt Block -------------------------------------------------*/ /*------------------------------------------------- >> Basic styles for FAQ's Block -------------------------------------------------*/ .faq { border-top: 1px solid var(--kn_border); } .faq:last-child { border-bottom: 1px solid var(--kn_border); } .faq-head { display: block; position: relative; } .faq-head h2, .faq-head h3, .faq-head h4, .faq-head h5, .faq-head h6 { margin-bottom: 0; padding: 20px 50px 20px clamp(0.875rem, 3.046vw - 1.034rem, 1.25rem); cursor: pointer; transition: padding-bottom 0.3s ease-in-out; } .faq-head h2::before, .faq-head h2::after, .faq-head h3::before, .faq-head h3::after, .faq-head h4::before, .faq-head h4::after, .faq-head h5::before, .faq-head h5::after, .faq-head h6::before, .faq-head h6::after { content: ""; position: absolute; background-color: var(--kn_color_primary); } .faq-head h2::before, .faq-head h3::before, .faq-head h4::before, .faq-head h5::before, .faq-head h6::before { width: 18px; height: 2px; top: 30px; right: clamp(0.875rem, 3.046vw - 1.034rem, 1.25rem); } .faq-head h2::after, .faq-head h3::after, .faq-head h4::after, .faq-head h5::after, .faq-head h6::after { width: 2px; height: 18px; top: 22px; right: clamp(1.375rem, 3.046vw - 0.534rem, 1.75rem); transition: opacity 0.3s ease-in-out; } .faq-head.active h2, .faq-head.active h3, .faq-head.active h4, .faq-head.active h5, .faq-head.active h6 { padding-bottom: 14px; } .faq-head.active h2::after, .faq-head.active h3::after, .faq-head.active h4::after, .faq-head.active h5::after, .faq-head.active h6::after { opacity: 0; } .faq-content { display: none; padding: 0 clamp(0.875rem, 3.046vw - 1.034rem, 1.25rem) 20px; } /*------------------------------------------------- >> Basic styles for Team Block -------------------------------------------------*/ /*------------------------------------------------- >> Basic styles for Image Alongside Text Block -------------------------------------------------*/ .image-at-right .iat-image { order: 2; } .image-alongside-text { justify-content: space-between; row-gap: 40px; } /*------------------------------------------------- >> Basic styles for Quote Block -------------------------------------------------*/ /*------------------------------------------------- >> Basic styles for Image slider Block -------------------------------------------------*/ /*------------------------------------------------- >> Basic styles for Lead Paragraph Block -------------------------------------------------*/ .lead-paragraph-var { justify-content: space-between; } /*------------------------------------------------- >> Basic styles for Book Slider Block -------------------------------------------------*/ .book-meta { margin-top: 20px; } .book-category { margin-bottom: 6px; } .book-title h2, .book-title h3, .book-title h4, .book-title h5, .book-title h6 { margin-bottom: 0; } /*------------------------------------------------- >> Basic styles for Tab Content Block -------------------------------------------------*/ .tab-content-ctn { width: calc(70% - 15px); } .two-columns-ctn { gap: 44px 30px; } .section-head:has(+ .tab-content-main, + .video-items) { margin-bottom: 30px; } .tab-content-ctn, .latest-events { box-sizing: border-box; } .tab-content-main { display: flex; flex-wrap: wrap; } .tab-content-main a, .tab-content-main a:visited { display: block; } .tab-content-main li::before { display: none; } .tab-content-main ul { margin-bottom: 0; } .tab-content-main ul li { padding-left: 0; margin-bottom: 0; } .tab-content-links { width: 42%; border-right: 2px solid var(--kn_border_4); padding-right: 20px; box-sizing: border-box; } .tab-content-links li:nth-child(n+2) { margin-top: 10px; } .tab-content-links a, .tab-content-links a:visited { padding: 10px 20px; border-radius: 8px; border: 1px solid var(--kn_border1); } .tab-content-links a:hover, .tab-content-links a.current, .tab-content-links a:visited:hover, .tab-content-links a:visited.current { background-color: var(--kn_color_primary); color: var(--kn_color_secondary); border-color: var(--kn_border_4); } .tab-content-area { width: 58%; padding-left: 30px; } .tab-content-area a, .tab-content-area a:visited { padding: 10px 40px 10px 10px; border-bottom: 1px solid var(--kn_border); font-size: 16px; } .tab-content-area a::before, .tab-content-area a::after, .tab-content-area a:visited::before, .tab-content-area a:visited::after { content: ""; position: absolute; transition: all 0.3s ease-in-out; } .tab-content-area a::before, .tab-content-area a:visited::before { top: 0; left: 0px; width: 0; height: 100%; background-color: var(--kn_color_primary); z-index: -1; } .tab-content-area a::after, .tab-content-area a:visited::after { top: 2px; right: 0; width: 36px; height: 36px; background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgZmlsbD0iIzAwMjM2NiI+Cg08ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiIHN0cm9rZS13aWR0aD0iMCIvPgoNPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cg08ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+IDx0aXRsZT5hcnJvd19yaWdodF91cCBbIzAwMjM2Nl08L3RpdGxlPiA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4gPGRlZnM+IDwvZGVmcz4gPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+IDxnIGlkPSJEcmliYmJsZS1MaWdodC1QcmV2aWV3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMzgwLjAwMDAwMCwgLTY1OTkuMDAwMDAwKSIgZmlsbD0iIzAwMjM2NiI+IDxnIGlkPSJpY29ucyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNTYuMDAwMDAwLCAxNjAuMDAwMDAwKSI+IDxwb2x5Z29uIGlkPSJhcnJvd19yaWdodF91cC1bIzAwMjM2Nl0iIHBvaW50cz0iMzI0IDY0NTcuNjAyIDMyNS4zOTMgNjQ1OC45OTcgMzQyIDY0NDIuMzQ5IDM0MiA2NDUzIDM0NCA2NDUzIDM0NCA2NDM5IDMyOS45MDcgNjQzOSAzMjkuODc3IDY0NDEgMzQwLjYzNCA2NDQxIj4gPC9wb2x5Z29uPiA8L2c+IDwvZz4gPC9nPiA8L2c+Cg08L3N2Zz4=); background-repeat: no-repeat; background-size: 14px; background-position: center; } .tab-content-area a:hover, .tab-content-area a:visited:hover { color: var(--kn_color_secondary); } .tab-content-area a:hover::before, .tab-content-area a:visited:hover::before { width: 100%; } .tab-content-area a:hover::after, .tab-content-area a:visited:hover::after { filter: initial; } .tab-content-area li:last-child a, .tab-content-area li:last-child a:visited { border-bottom: none; } .latest-events { width: calc(30% - 15px); } .latest-events h2, .latest-events h3, .latest-events h4, .latest-events h5, .latest-events h6 { margin-bottom: 0; } .box-title { background-color: var(--kn_green); padding: 10px 20px; border-radius: 8px 8px 0 0; } .box-title h2, .box-title h3, .box-title h4, .box-title h5, .box-title h6 { color: var(--kn_white); margin-bottom: 0; } .latest-events-area { max-height: 353px; overflow-y: scroll; box-shadow: 0 2px 8px rgba(51, 51, 51, 0.15), 0 2px 13px rgba(51, 51, 51, 0.2); border-radius: 0 0 8px 8px; } .mega-menu-tab-content, .tab-content, .latest-events-area, .jump-links, .video-playlist { /* Track */ /* Handle */ } .mega-menu-tab-content::-webkit-scrollbar, .tab-content::-webkit-scrollbar, .latest-events-area::-webkit-scrollbar, .jump-links::-webkit-scrollbar, .video-playlist::-webkit-scrollbar { width: 5px; } .mega-menu-tab-content::-webkit-scrollbar-track, .tab-content::-webkit-scrollbar-track, .latest-events-area::-webkit-scrollbar-track, .jump-links::-webkit-scrollbar-track, .video-playlist::-webkit-scrollbar-track { background: var(--kn_gray); } .mega-menu-tab-content::-webkit-scrollbar-thumb, .tab-content::-webkit-scrollbar-thumb, .latest-events-area::-webkit-scrollbar-thumb, .jump-links::-webkit-scrollbar-thumb, .video-playlist::-webkit-scrollbar-thumb { background: var(--kn_color_primary); border-radius: 5px; } .latest-event-icon { width: 36px; line-height: 0.6; } .latest-event { gap: 14px; border-bottom: 1px solid var(--kn_border); padding-block: 10px; } .latest-event:first-child { padding-top: 0; } .latest-event:last-child { border-bottom: none; padding-bottom: 0; } .latest-event-content { width: calc(100% - 50px); } .event-date { margin-top: 5px; font-size: 15px; } .widget-inner { padding: 20px; } .tab-content { height: 250px; overflow-y: auto; padding-right: 15px; } /*------------------------------------------------- >> Basic styles for Videos Block -------------------------------------------------*/ .videos-ctn { padding: 24px; flex-wrap: wrap; gap: 19px; } .videos-ctn:not(.featured-videos-ctn) { margin-top: 24px; } .featured-videos .popup-video { float: right; } .featured-videos .popup-video:nth-child(1) { width: 65%; float: left; } .featured-videos .popup-video:nth-child(1) .popup-video-link { aspect-ratio: 2/1.3; } .featured-videos .popup-video:nth-child(3) { margin-top: 20px; } .mfp-iframe-holder .mfp-close { background-color: var(--kn_white); border-radius: 50%; margin: 0; padding: 0; opacity: 1; width: 36px; height: 36px; opacity: 1; transition: all 0.3s ease-in-out; top: -50px; } .mfp-iframe-holder .mfp-close::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 14px; height: 14px; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+Cgo8ZGVmcz4KPC9kZWZzPgo8ZyBzdHlsZT0ic3Ryb2tlOiBub25lOyBzdHJva2Utd2lkdGg6IDA7IHN0cm9rZS1kYXNoYXJyYXk6IG5vbmU7IHN0cm9rZS1saW5lY2FwOiBidXR0OyBzdHJva2UtbGluZWpvaW46IG1pdGVyOyBzdHJva2UtbWl0ZXJsaW1pdDogMTA7IGZpbGw6IG5vbmU7IGZpbGwtcnVsZTogbm9uemVybzsgb3BhY2l0eTogMTsiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEuNDA2NTkzNDA2NTkzNDAxNiAxLjQwNjU5MzQwNjU5MzQwMTYpIHNjYWxlKDIuODEgMi44MSkiID4KCTxyZWN0IHg9Ii0xMy41OSIgeT0iMzkuOTUiIHJ4PSIwIiByeT0iMCIgd2lkdGg9IjExNy4xNyIgaGVpZ2h0PSIxMC4xIiBzdHlsZT0ic3Ryb2tlOiBub25lOyBzdHJva2Utd2lkdGg6IDE7IHN0cm9rZS1kYXNoYXJyYXk6IG5vbmU7IHN0cm9rZS1saW5lY2FwOiBidXR0OyBzdHJva2UtbGluZWpvaW46IG1pdGVyOyBzdHJva2UtbWl0ZXJsaW1pdDogMTA7IGZpbGw6IHJnYigwLDAsMCk7IGZpbGwtcnVsZTogbm9uemVybzsgb3BhY2l0eTogMTsiIHRyYW5zZm9ybT0iIG1hdHJpeCgwLjcwNzEgLTAuNzA3MiAwLjcwNzIgMC43MDcxIC0xOC42Mzk2IDQ1LjAwNDQpICIvPgoJPHJlY3QgeD0iMzkuOTUiIHk9Ii0xMy41OSIgcng9IjAiIHJ5PSIwIiB3aWR0aD0iMTAuMSIgaGVpZ2h0PSIxMTcuMTciIHN0eWxlPSJzdHJva2U6IG5vbmU7IHN0cm9rZS13aWR0aDogMTsgc3Ryb2tlLWRhc2hhcnJheTogbm9uZTsgc3Ryb2tlLWxpbmVjYXA6IGJ1dHQ7IHN0cm9rZS1saW5lam9pbjogbWl0ZXI7IHN0cm9rZS1taXRlcmxpbWl0OiAxMDsgZmlsbDogcmdiKDAsMCwwKTsgZmlsbC1ydWxlOiBub256ZXJvOyBvcGFjaXR5OiAxOyIgdHJhbnNmb3JtPSIgbWF0cml4KDAuNzA3MSAtMC43MDcxIDAuNzA3MSAwLjcwNzEgLTE4LjYzOTYgNDUuMDAwNCkgIi8+CjwvZz4KPC9zdmc+); background-repeat: no-repeat; background-position: center; background-size: 14px; transition: all 0.3s ease-in-out; } .mfp-iframe-holder .mfp-close:hover { background-color: var(--kn_green); } .mfp-iframe-holder .mfp-close:hover::after { filter: invert(1); } .video-content h2, .video-content h3, .video-content h4, .video-content h5, .video-content h6 { margin-bottom: 0; } .video-content h2 a, .video-content h2 a:visited, .video-content h3 a, .video-content h3 a:visited, .video-content h4 a, .video-content h4 a:visited, .video-content h5 a, .video-content h5 a:visited, .video-content h6 a, .video-content h6 a:visited { color: var(--kn_heading_color); } .video-items .video-content { margin-top: 16px; } .video-image img, .audio-image img { aspect-ratio: 1/0.6; } .video-image a::after, .video-image a:visited::after, .audio-image a::after, .audio-image a:visited::after { content: ""; position: absolute; background-repeat: no-repeat; background-position: center; z-index: 2; } .video-image a::after, .video-image a:visited::after { top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 70px; height: 50px; background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9Ii0yLjQgLTIuNCAyOC44MCAyOC44MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHJva2U9IiMyNDVjMzYiPgoNPGcgaWQ9IlNWR1JlcG9fYmdDYXJyaWVyIiBzdHJva2Utd2lkdGg9IjAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDYuODQsNi44NCksIHNjYWxlKDAuNDMpIj4KDTxyZWN0IHg9Ii0yLjQiIHk9Ii0yLjQiIHdpZHRoPSIyOC44MCIgaGVpZ2h0PSIyOC44MCIgcng9IjAiIGZpbGw9IiNmN2Y3ZjciIHN0cm9rZXdpZHRoPSIwIi8+Cg08L2c+Cg08ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZT0iI0NDQ0NDQyIgc3Ryb2tlLXdpZHRoPSIwLjE0NCIvPgoNPGcgaWQ9IlNWR1JlcG9faWNvbkNhcnJpZXIiPgoNPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMi41NCA2LjQyYTIuNzY1IDIuNzY1IDAgMCAwLTEuOTQ1LTEuOTU3QzE4Ljg4IDQgMTIgNCAxMiA0cy02Ljg4IDAtOC41OTUuNDYzQTIuNzY1IDIuNzY1IDAgMCAwIDEuNDYgNi40MkMxIDguMTQ4IDEgMTEuNzUgMSAxMS43NXMwIDMuNjAyLjQ2IDUuMzNhMi43NjUgMi43NjUgMCAwIDAgMS45NDUgMS45NThDNS4xMjEgMTkuNSAxMiAxOS41IDEyIDE5LjVzNi44OCAwIDguNTk1LS40NjJhMi43NjUgMi43NjUgMCAwIDAgMS45NDUtMS45NThjLjQ2LTEuNzI2LjQ2LTUuMzMuNDYtNS4zM3MwLTMuNjAyLS40Ni01LjMzWk05Ljc1IDguNDc5djYuNTQybDUuNzUtMy4yNzEtNS43NS0zLjI3MVoiIGZpbGw9IiMyNDVjMzYiLz4KDTwvZz4KDTwvc3ZnPg==); background-size: cover; } /*------------------------------------------------- >> Basic styles for Audios Block -------------------------------------------------*/ .audios-ctn { padding: 24px; } div#amplitude-player { box-shadow: 0 2px 12px 8px rgba(0, 0, 0, 0.1); display: flex; border-radius: 4px; } /* Small only */ @media screen and (max-width: 39.9375em) { div#amplitude-player { flex-direction: column; } } /* Medium only */ @media screen and (min-width: 40em) and (max-width: 63.9375em) { div#amplitude-player { max-height: 715px; } } /* Large and up */ @media screen and (min-width: 64em) { div#amplitude-player { max-height: 715px; } } div#amplitude-left { padding: 0px; border-right: 1px solid #cfd8dc; width: 50%; display: flex; flex-direction: column; border-radius: 4px 0 0 4px; } div#amplitude-left img { border-radius: 4px 0 0 0; } div#amplitude-left img.album-art { width: 100%; } div#amplitude-left div#player-left-bottom { flex: 1; background-color: var(--kn_lgray); padding: 20px 10px; border-radius: 0 0 0px 4px; } div#amplitude-left div#player-left-bottom div#volume-container:after { content: ""; display: table; clear: both; } /* Small only */ @media screen and (max-width: 39.9375em) { div#amplitude-player div#amplitude-left { width: 100%; } div#amplitude-player div#amplitude-left img[amplitude-song-info=cover_art_url] { width: auto; height: auto; } } div#amplitude-right { padding: 0px; overflow-y: scroll; width: 50%; display: flex; flex-direction: column; border-radius: 0 4px 4px 0; } div#amplitude-right div.song { cursor: pointer; padding: 10px; } div#amplitude-right div.song div.song-now-playing-icon-container { float: left; width: 20px; height: 20px; margin-right: 10px; } div#amplitude-right div.song div.song-now-playing-icon-container img.now-playing { display: none; margin-top: 15px; } div#amplitude-right div.song div.play-button-container { display: none; background: url("https://521dimensions.com/img/open-source/amplitudejs/blue-player/list-play-light.png") no-repeat; width: 22px; height: 22px; margin-top: 10px; } div#amplitude-right div.song div.play-button-container:hover { background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDIwIDIwIiB3aWR0aD0iMjAiIGhlaWdodD0iMjAiPgoJPHRpdGxlPm5vdy1wbGF5aW5nLXN2ZzwvdGl0bGU+Cgk8c3R5bGU+CgkJLnMwIHsgZmlsbDogIzM5M2MzNiB9IAoJCS5zMSB7IGZpbGw6ICNmZmZmZmYgfSAKCTwvc3R5bGU+Cgk8ZyBpZD0iMDUuMTAwLjAwLU9wZW5Tb3VyY2UtQW1wbGl0dWRlIj4KCQk8ZyBpZD0iSERfMDUuMTAwLjAwLTUyMVdlYnNpdGVfT3BlblNvdXJjZS1BbXBsaXR1ZGUiPgoJCQk8ZyBpZD0iTGVhZC1pbiI+CgkJCQk8ZyBpZD0iUGxheWVyIj4KCQkJCQk8ZyBpZD0iUGxheWxpc3QiPgoJCQkJCQk8ZyBpZD0iU29uZy1JdGVtIj4KCQkJCQkJCTxnIGlkPSJOb3ctUGxheWluZyI+CgkJCQkJCQkJPGcgaWQ9IkxheWVyIj4KCQkJCQkJCQkJPHBhdGggaWQ9Ik92YWwtMSIgY2xhc3M9InMwIiBkPSJtMTAgMjBjLTUuNSAwLTEwLTQuNS0xMC0xMCAwLTUuNSA0LjUtMTAgMTAtMTAgNS41IDAgMTAgNC41IDEwIDEwIDAgNS41LTQuNSAxMC0xMCAxMHoiLz4KCQkJCQkJCQkJPHBhdGggaWQ9IkZpbGwtMTU2IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsYXNzPSJzMSIgZD0ibTguOSAxMi4xcS0wLjIgMC0wLjMtMC4xbC0xLjYtMS4xaC0xLjVjLTAuMyAwLTAuNS0wLjItMC41LTAuNXYtMS41YzAtMC4zIDAuMi0wLjUgMC41LTAuNWgxLjVsMS42LTEuM3EwLjEtMC4xIDAuMy0wLjFjMC4zIDAgMC41IDAuMiAwLjUgMC40djQuM2MwIDAuMi0wLjIgMC40LTAuNSAwLjR6bTEuOS0wLjNsLTAuNS0wLjRjMC40LTAuNSAwLjYtMS4xIDAuNi0xLjggMC0wLjYtMC4yLTEuMi0wLjYtMS43bDAuNS0wLjVjMC41IDAuNiAwLjggMS40IDAuOCAyLjIgMCAwLjktMC4zIDEuNi0wLjggMi4yem0xLjIgMS4zbC0wLjUtMC41YzAuNy0wLjggMS4yLTEuOCAxLjItMyAwLTEuMS0wLjUtMi4xLTEuMi0yLjlsMC41LTAuNWMwLjggMC45IDEuMyAyLjEgMS4zIDMuNCAwIDEuMy0wLjUgMi41LTEuMyAzLjV6bTEuMiAxLjJsLTAuNC0wLjVjMS0xLjEgMS42LTIuNiAxLjYtNC4yIDAtMS42LTAuNi0zLTEuNi00LjJsMC40LTAuNGMxLjEgMS4yIDEuOCAyLjggMS44IDQuNiAwIDEuOC0wLjcgMy40LTEuOCA0Ljd6Ii8+CgkJCQkJCQkJPC9nPgoJCQkJCQkJPC9nPgoJCQkJCQk8L2c+CgkJCQkJPC9nPgoJCQkJPC9nPgoJCQk8L2c+CgkJPC9nPgoJPC9nPgo8L3N2Zz4=); background-repeat: no-repeat; } div#amplitude-right div.song.amplitude-active-song-container div.song-now-playing-icon-container img.now-playing { display: block; } div#amplitude-right div.song.amplitude-active-song-container:hover div.play-button-container { display: none; } div#amplitude-right div.song div.song-meta-data { float: left; width: calc(100% - 110px); } div#amplitude-right div.song div.song-meta-data span.song-title { color: var(--kn_dark_text); font-size: 16px; display: block; font-weight: 300; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } div#amplitude-right div.song div.song-meta-data span.song-artist { color: var(--kn_green); font-size: 14px; font-weight: bold; text-transform: uppercase; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } div#amplitude-right div.song img.bandcamp-grey { float: left; display: block; margin-top: 10px; } div#amplitude-right div.song img.bandcamp-white { float: left; display: none; margin-top: 10px; } div#amplitude-right div.song span.song-duration { float: left; width: 55px; text-align: center; line-height: 45px; color: var(--kn_green); font-size: 16px; font-weight: 500; } div#amplitude-right div.song:after { content: ""; display: table; clear: both; } /* Small only */ @media screen and (max-width: 39.9375em) { div#amplitude-player div#amplitude-right { width: 100%; } } div#progress-container { width: 70%; float: left; position: relative; height: 20px; cursor: pointer; /* IE 11 */ } div#progress-container:hover input[type=range].amplitude-song-slider::-webkit-slider-thumb { display: block; } div#progress-container:hover input[type=range].amplitude-song-slider::-moz-range-thumb { visibility: visible; } div#progress-container progress#song-played-progress { width: 100%; position: absolute; left: 0; top: 8px; right: 0; width: 100%; z-index: 60; -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 4px; border-radius: 5px; background: transparent; border: none; /* Needed for Firefox */ } @media all and (-ms-high-contrast: none) { div#progress-container *::-ms-backdrop, div#progress-container progress#song-played-progress { color: var(--kn_green); border: none; background-color: #cfd8dc; } } @supports (-ms-ime-align: auto) { div#progress-container progress#song-played-progress { color: var(--kn_green); border: none; } } div#progress-container progress#song-played-progress[value]::-webkit-progress-bar { background: none; border-radius: 5px; } div#progress-container progress#song-played-progress[value]::-webkit-progress-value { background-color: var(--kn_green); border-radius: 5px; } div#progress-container progress#song-played-progress::-moz-progress-bar { background: none; border-radius: 5px; background-color: var(--kn_green); height: 5px; margin-top: -2px; } div#progress-container progress#song-buffered-progress { position: absolute; left: 0; top: 8px; right: 0; width: 100%; z-index: 10; -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 4px; border-radius: 5px; background: transparent; border: none; background-color: #d7dee3; } div#progress-container progress#song-buffered-progress[value]::-webkit-progress-bar { background-color: #cfd8dc; border-radius: 5px; } div#progress-container progress#song-buffered-progress[value]::-webkit-progress-value { background-color: #78909c; border-radius: 5px; -webkit-transition: width 0.1s ease; transition: width 0.1s ease; } div#progress-container progress#song-buffered-progress::-moz-progress-bar { background: none; border-radius: 5px; background-color: #78909c; height: 5px; margin-top: -2px; } div#progress-container progress::-ms-fill { border: none; } @-moz-document url-prefix() { div#progress-container progress#song-buffered-progress { top: 9px; border: none; } } @media all and (-ms-high-contrast: none) { div#progress-container *::-ms-backdrop, div#progress-container progress#song-buffered-progress { color: #78909c; border: none; } } @supports (-ms-ime-align: auto) { div#progress-container progress#song-buffered-progress { color: #78909c; border: none; } } div#progress-container input[type=range] { -webkit-appearance: none; width: 100%; margin: 7.5px 0; position: absolute; z-index: 9999; top: -7px; height: 20px; cursor: pointer; background-color: inherit; } div#progress-container input[type=range]:focus { outline: none; } div#progress-container input[type=range]::-webkit-slider-runnable-track { width: 100%; height: 0px; cursor: pointer; box-shadow: 0px 0px 0px rgba(0, 0, 0, 0), 0px 0px 0px rgba(13, 13, 13, 0); background: #0075a9; border-radius: 0px; border: 0px solid #010101; } div#progress-container input[type=range]::-webkit-slider-thumb { box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d; border: 1px solid var(--kn_green); height: 15px; width: 15px; border-radius: 16px; background: var(--kn_green); cursor: pointer; -webkit-appearance: none; margin-top: -7.5px; } div#progress-container input[type=range]:focus::-webkit-slider-runnable-track { background: #00adfb; } div#progress-container input[type=range]::-moz-range-track { width: 100%; height: 0px; cursor: pointer; box-shadow: 0px 0px 0px rgba(0, 0, 0, 0), 0px 0px 0px rgba(13, 13, 13, 0); background: #0075a9; border-radius: 0px; border: 0px solid #010101; } div#progress-container input[type=range]::-moz-range-thumb { box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d; border: 1px solid var(--kn_green); height: 15px; width: 15px; border-radius: 16px; background: var(--kn_green); cursor: pointer; } div#progress-container input[type=range]::-ms-track { width: 100%; height: 0px; cursor: pointer; background: transparent; border-color: transparent; color: transparent; } div#progress-container input[type=range]::-ms-fill-lower { background: #003d57; border: 0px solid #010101; border-radius: 0px; box-shadow: 0px 0px 0px rgba(0, 0, 0, 0), 0px 0px 0px rgba(13, 13, 13, 0); } div#progress-container input[type=range]::-ms-fill-upper { background: #0075a9; border: 0px solid #010101; border-radius: 0px; box-shadow: 0px 0px 0px rgba(0, 0, 0, 0), 0px 0px 0px rgba(13, 13, 13, 0); } div#progress-container input[type=range]::-ms-thumb { box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d; border: 1px solid var(--kn_green); height: 15px; width: 15px; border-radius: 16px; background: var(--kn_green); cursor: pointer; height: 0px; display: block; } @media all and (-ms-high-contrast: none) { div#progress-container *::-ms-backdrop, div#progress-container input[type=range].amplitude-song-slider { padding: 0px; } div#progress-container *::-ms-backdrop, div#progress-container input[type=range].amplitude-song-slider::-ms-thumb { height: 15px; width: 15px; border-radius: 10px; cursor: pointer; margin-top: -8px; } div#progress-container *::-ms-backdrop, div#progress-container input[type=range].amplitude-song-slider::-ms-track { border-width: 15px 0; border-color: transparent; } div#progress-container *::-ms-backdrop, div#progress-container input[type=range].amplitude-song-slider::-ms-fill-lower { background: #cfd8dc; border-radius: 10px; } div#progress-container *::-ms-backdrop, div#progress-container input[type=range].amplitude-song-slider::-ms-fill-upper { background: #cfd8dc; border-radius: 10px; } } @supports (-ms-ime-align: auto) { div#progress-container input[type=range].amplitude-song-slider::-ms-thumb { height: 15px; width: 15px; margin-top: 3px; } } div#progress-container input[type=range]:focus::-ms-fill-lower { background: #0075a9; } div#progress-container input[type=range]:focus::-ms-fill-upper { background: #00adfb; } div#control-container { margin-top: 25px; margin-top: 20px; } div#control-container div#repeat-container { width: 25%; float: left; padding-top: 20px; } div#control-container div#repeat-container div#repeat { width: 24px; height: 19px; cursor: pointer; } div#control-container div#repeat-container div#repeat.amplitude-repeat-off { background: url("https://521dimensions.com/img/open-source/amplitudejs/blue-player/repeat-off.svg"); } div#control-container div#repeat-container div#repeat.amplitude-repeat-on { background: url("https://521dimensions.com/img/open-source/amplitudejs/blue-player/repeat-on.svg"); } div#control-container div#repeat-container div#shuffle { width: 23px; height: 19px; cursor: pointer; float: right; } div#control-container div#repeat-container div#shuffle.amplitude-shuffle-off { background: url("https://521dimensions.com/img/open-source/amplitudejs/blue-player/shuffle-off.svg"); } div#control-container div#repeat-container div#shuffle.amplitude-shuffle-on { background: url("https://521dimensions.com/img/open-source/amplitudejs/blue-player/shuffle-on.svg"); } @media all and (-ms-high-contrast: none) { div#control-container *::-ms-backdrop, div#control-container div#control-container { margin-top: 40px; float: none; } } div#control-container div#central-control-container { width: 50%; float: left; } div#control-container div#central-control-container div#central-controls { width: 130px; margin: auto; } div#control-container div#central-control-container div#central-controls div#previous { display: inline-block; width: 40px; height: 40px; cursor: pointer; background: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDM5IDM5IiB3aWR0aD0iMzkiIGhlaWdodD0iMzkiPgoJPHRpdGxlPnByZXYtc3ZnPC90aXRsZT4KCTxzdHlsZT4KCQkuczAgeyBmaWxsOiAjMzkzYzM2IH0gCgkJLnMxIHsgZmlsbDogI2ZmZmZmZiB9IAoJPC9zdHlsZT4KCTxnIGlkPSIwNS4xMDAuMDAtT3BlblNvdXJjZS1BbXBsaXR1ZGUiPgoJCTxnIGlkPSJIRF8wNS4xMDAuMDAtNTIxV2Vic2l0ZV9PcGVuU291cmNlLUFtcGxpdHVkZSI+CgkJCTxnIGlkPSJMZWFkLWluIj4KCQkJCTxnIGlkPSJQbGF5ZXIiPgoJCQkJCTxnIGlkPSJDb250cm9sbGVycy9TdGF0dXMvSW5mbyI+CgkJCQkJCTxnIGlkPSJDb250cm9scyI+CgkJCQkJCQk8ZyBpZD0iUHJldmlvdXMiPgoJCQkJCQkJCTxwYXRoIGlkPSJPdmFsLTEiIGNsYXNzPSJzMCIgZD0ibTE5LjUgMzljLTEwLjggMC0xOS41LTguNy0xOS41LTE5LjUgMC0xMC44IDguNy0xOS41IDE5LjUtMTkuNSAxMC44IDAgMTkuNSA4LjcgMTkuNSAxOS41IDAgMTAuOC04LjcgMTkuNS0xOS41IDE5LjV6Ii8+CgkJCQkJCQkJPHBhdGggaWQ9IlNoYXBlIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsYXNzPSJzMSIgZD0ibTE2LjEgMTguM3YtNmMwLTAuNy0wLjUtMS4zLTEuMy0xLjNoLTIuNWMtMC43IDAtMS4zIDAuNi0xLjMgMS4zdjEzLjljMCAwLjcgMC42IDEuMyAxLjMgMS4zaDIuNWMwLjggMCAxLjMtMC42IDEuMy0xLjN2LTZsMTEuMyA3YzAuOSAwLjYgMS42IDAuMiAxLjYtMC45di0xNC4xYzAtMS4xLTAuNy0xLjUtMS42LTAuOXoiLz4KCQkJCQkJCTwvZz4KCQkJCQkJPC9nPgoJCQkJCTwvZz4KCQkJCTwvZz4KCQkJPC9nPgoJCTwvZz4KCTwvZz4KPC9zdmc+); background-repeat: no-repeat; float: left; margin-top: 10px; margin-right: -5px; } div#control-container div#central-control-container div#central-controls div#play-pause { display: inline-block; width: 60px; height: 60px; cursor: pointer; float: left; } div#control-container div#central-control-container div#central-controls div#play-pause.amplitude-paused { background: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDYwIDYwIiB3aWR0aD0iNjAiIGhlaWdodD0iNjAiPgoJPHRpdGxlPnBsYXktc3ZnPC90aXRsZT4KCTxzdHlsZT4KCQkuczAgeyBmaWxsOiAjMzkzYzM2IH0gCgkJLnMxIHsgZmlsbDogI2ZmZmZmZiB9IAoJPC9zdHlsZT4KCTxnIGlkPSIwNS4xMDAuMDAtT3BlblNvdXJjZS1BbXBsaXR1ZGUiPgoJCTxnIGlkPSJIRF8wNS4xMDAuMDAtNTIxV2Vic2l0ZV9PcGVuU291cmNlLUFtcGxpdHVkZSI+CgkJCTxnIGlkPSJMZWFkLWluIj4KCQkJCTxnIGlkPSJQbGF5ZXIiPgoJCQkJCTxnIGlkPSJDb250cm9sbGVycy9TdGF0dXMvSW5mbyI+CgkJCQkJCTxnIGlkPSJDb250cm9scyI+CgkJCQkJCQk8ZyBpZD0iUGxheS9QYXVzZSI+CgkJCQkJCQkJPGcgaWQ9Ik92YWwtMSI+CgkJCQkJCQkJCTxwYXRoIGlkPSJMYXllciIgY2xhc3M9InMwIiBkPSJtMzAgNjBjLTE2LjYgMC0zMC0xMy40LTMwLTMwIDAtMTYuNiAxMy40LTMwIDMwLTMwIDE2LjYgMCAzMCAxMy40IDMwIDMwIDAgMTYuNi0xMy40IDMwLTMwIDMweiIvPgoJCQkJCQkJCQk8cGF0aCBpZD0iUGxheSIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGFzcz0iczEiIGQ9Im00My42IDI5LjhsLTIwLTEyLjRjLTEuNC0wLjktMi42LTAuMi0yLjYgMS42djI0YzAgMS44IDEuMiAyLjUgMi42IDEuNmwyMC0xMi40YzAgMCAwLjctMC41IDAuNy0xLjIgMC0wLjctMC43LTEuMi0wLjctMS4yeiIvPgoJCQkJCQkJCTwvZz4KCQkJCQkJCTwvZz4KCQkJCQkJPC9nPgoJCQkJCTwvZz4KCQkJCTwvZz4KCQkJPC9nPgoJCTwvZz4KCTwvZz4KPC9zdmc+); } div#control-container div#central-control-container div#central-controls div#play-pause.amplitude-playing { background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDkyIDkyIiB3aWR0aD0iOTIiIGhlaWdodD0iOTIiPgoJPHRpdGxlPmljb25zOC1wYXVzZS1idXR0b24tMTAwPC90aXRsZT4KCTxkZWZzPgoJCTxpbWFnZSAgd2lkdGg9IjkyIiBoZWlnaHQ9IjkyIiBpZD0iaW1nMSIgaHJlZj0iZGF0YTppbWFnZS9wbmc7YmFzZTY0LGlWQk9SdzBLR2dvQUFBQU5TVWhFVWdBQUFGd0FBQUJjQ0FNQUFBRFVNU0pxQUFBQUFYTlNSMElCMmNrc2Z3QUFBWlZRVEZSRkFBQUFQejgvT3pzMk9EczFPVHMxT1R3Mk9EdzFPVHMxT0R3Mk9EdzFPVHcyT0R3Mk9UdzJPVHcyU0Vna1B6OC9OenczT1R3MU9UdzJPRHMxT1R3Mk9EczFPVHcxT0R3Mk9EdzBBQUFBT1R3MU9UdzFPRHcxT1R3Mk9UMDJORDAwT1R3MU9UczJPVHMxTmo4Mk5qMDJPRHMyT1R3Mk9EczFPam8wT0RzMU56ODNNek16T1RzM09EczFPVHcxT1RzMU9UczJPRHcyT1R3Mk9UdzJLaW9xT0RzMk9EdzJPRHcxT1R3MU9qbzJPRG8xT1R3M09EdzFPVHMyT0R3Mk9UczJOencxT0RzMU9EczFPVHcyT1RzMU9UczJPVHMxT2pvMk9EdzJPVHMxT1RzMU9UazVPVHMyT1R3Mk9EczFPam96T0RnNE9UdzFPVHcxT3pzek9UczJPRHcxTnpzM09EdzFPVHcxT2pvMk9qbzFPRHcyTnp3MU9UdzFPRHMyT0RzMk9UazBPajAzT1R3MU9EdzJPVHMxT1RzMU9UczJPVHMyT0R3Mk56czNPenMyT1RzMk9EdzBPRHcyT0RnNE9UczJPVHcyUER3ME9EdzJPVHMxT1RzMU9EdzFPRHcyT1R3M09EczJPVHcwT0RzMk9EdzJPRHMyT1R3Mk9UczJOejQzT0R3Mk9EczFWVlZWTnp3M09UdzJPRHcxT0Q0NEZnZ2VnQUFBQUlkMFVrNVRBQWd2Vm55bHg5TGQ3dm5HcEZVSEJETjN1L2YvKzh5SVJBSkRvZktnUWgyRzRvVWNJWkg2b2lmOElBVnY4L2FBMmRqOS9nYkZ5a2p0Umx0aGJYU0NhM0phWCt6SWpZbEIxMzE0SC9UMXBpTWtuSmdlaE9CQW5mRTlPWDU3djd6NExGUEQwOUhlNjhSNlBEandQNE1ibTVjaWR0YlZpNGRZWG1wd2YyeFp5U1hobmdNdVZOQXRYSjhCNFFBQUE4UkpSRUZVZUp5MTJWdElWRUVZQU9ENXRZdHUxdEtxc2VxNmE3a1Z0SllXVzdhUjE3S3NMVTJ6VkRLUmdxUmVJaUlpcUllU0lucVFNSW1naHloTXlOSXVrR1pHQ1pZRkJxWGhKZEJNeXhUVUxTMVh6WERiZGQyenQzTS9NLy9UdWN6NURzek1PZlBQRENBZUFWUWdpOFV5QnliOHh3SkcrVHpIVlVCdVIrbmVaK1o2QVRzZVlpVW1HTy82QVV6MWk4VTFBTDlaMzQzUVFvQXVNYmdXVEp4MVpnMEZRSWRRWE51akhlUkJ6eERqNmpZaHVBNkF0VEk5SWhTNmFkdVdGbGNxdnd1Z2JSRSszTXNQbDBmNDBwVmtEODJvL0QwUFhMT2tXekJ0aTJXbVRrNDh0bVdCS052V3ZkNXk0SnVHVENKdHE3WGlEU3UrMlN5OHVwMmhrVFd3NFBFTUhaWjNoRFV6NGdtdEVtMkVvdW9aOEtRUktYVmlENDM4SlMwZSsxTjhXenJESE8zc00wNWNvMjJtS3l3NHhwWlNEVWZoT3BtNGI4YzdZbjQ1dmxVS1QvbUF5VVpvM1hNUFhCbldndzNYQk5XNjRmb2c3OStPK0ZCOUdYWEZkelJodEJIYVVPMkNHK0VkVnR6UTN1bkUweHF4MmdnRmZxYnc5RVlMWmp4NDVTTUhudEhBVVZaNHhGZk40cHBCR1haY3NiclNqa2Y4WVN3elJCMEZjVjUxajhRSE0zaUlIM05lSlI1UGV0MXZ3NVgvR0V0SXdGRnloUTBQbXlTQ2I3bG54ZlVEekhtc0ZIenJwMVpBdVhYTUJhVGdhRnM1b0FPMWhQRFVNa0FIYXdqaE8rOEE1RDhsaEZ1bXdFZkJjbDhTam5hQjcySmkrRzVnYlU5cGVDck1sUlBEQTJFOWEwWWhDVStEdzQrSjRYdGczeXRpZUFaczlKcHNZTU16UWNZNkNrbkNqV1J4b3RWQ3RFR0pkc1hDU21KNEdnVDRFY1BuQTN0K0t3blBJdnZMSlRwWWdJSnRzVWtLSHZxVjRBQTliU0tZV21UZEFIVDBQaUY4LzNWQXVoRXk2VngyMllpMU5jUEhpZUJ4RDIxWmJ1aGZJbmhPS2ZIa244eTBKZmVhZlU0VTJZOS93bVdVbDh4T0ZZL2Z4WTduWFVXeitJa3kzSk5jeFhTbkEwZnNQM1VSNGY4TlVmamVTY3dMQzExdFRoemxQY09LNXhjakYxeWZjQnVqWFZEVDZvb2pkVEMrWlNpMXRnSzU0ZWpVTFd6NG9TdklBNWZuc09ZWUFtSjB1V1BWbHNDaVpUSTFQWFFaUUEzRFdKWmJGdzFReDY2ajgrazZEQXZGS1plZEoyNUQvNW1ia3ZFamwxeE8zUE9LNkQ2SmR1RkYxek9QcE9Wc05ibHRCZXNBMGllK1ZjMG5pOXd2ZUtWYkJwbllIcG41Wk1EakNzMG1WS3E0citsWU9mY21sT2p0czNuZXV5bTBXZWgyRUxyZ1hkQmJRWE1WeTVhbG9WZkFscVUxakowbXZ1TXErUGt3L0s2WmsvTlZVN3kyaWMzaE9lY1pYOHZ5WE9UYXFGSU9Pa2tKSmN4M09iYm00M1R0THhqdlpnOEZWNHJlbXArSkM4VUFxaC9lejFsRHhkV24rRlFyMHFkRFIxT2l1aWltQmEzNWVLNjNQa25sVThXbnMvNEhsQWNwOExUa21NRUFBQUFBU1VWT1JLNUNZSUk9Ii8+Cgk8L2RlZnM+Cgk8c3R5bGU+Cgk8L3N0eWxlPgoJPHVzZSBpZD0iQmFja2dyb3VuZCIgaHJlZj0iI2ltZzEiIHg9IjAiIHk9IjAiLz4KPC9zdmc+); background-size: cover; } div#control-container div#central-control-container div#central-controls div#next { display: inline-block; width: 40px; height: 40px; cursor: pointer; background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDM5IDM5IiB3aWR0aD0iMzkiIGhlaWdodD0iMzkiPgoJPHRpdGxlPm5leHQtc3ZnPC90aXRsZT4KCTxzdHlsZT4KCQkuczAgeyBmaWxsOiAjMzkzYzM2IH0gCgkJLnMxIHsgZmlsbDogI2ZmZmZmZiB9IAoJPC9zdHlsZT4KCTxnIGlkPSIwNS4xMDAuMDAtT3BlblNvdXJjZS1BbXBsaXR1ZGUiPgoJCTxnIGlkPSJIRF8wNS4xMDAuMDAtNTIxV2Vic2l0ZV9PcGVuU291cmNlLUFtcGxpdHVkZSI+CgkJCTxnIGlkPSJMZWFkLWluIj4KCQkJCTxnIGlkPSJQbGF5ZXIiPgoJCQkJCTxnIGlkPSJDb250cm9sbGVycy9TdGF0dXMvSW5mbyI+CgkJCQkJCTxnIGlkPSJDb250cm9scyI+CgkJCQkJCQk8ZyBpZD0iTmV4dCI+CgkJCQkJCQkJPHBhdGggaWQ9Ik92YWwtMS1Db3B5IiBjbGFzcz0iczAiIGQ9Im0xOS41IDM5Yy0xMC44IDAtMTkuNS04LjctMTkuNS0xOS41IDAtMTAuOCA4LjctMTkuNSAxOS41LTE5LjUgMTAuOCAwIDE5LjUgOC43IDE5LjUgMTkuNSAwIDEwLjgtOC43IDE5LjUtMTkuNSAxOS41eiIvPgoJCQkJCQkJCTxwYXRoIGlkPSJTaGFwZSIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGFzcz0iczEiIGQ9Im0yNy43IDExaC0yLjZjLTAuNyAwLTEuMyAwLjYtMS4zIDEuM3Y1LjlsLTExLjItNi45Yy0wLjktMC42LTEuNi0wLjItMS42IDAuOXYxNC4xYzAgMS4xIDAuNyAxLjUgMS42IDAuOWwxMS4yLTd2NmMwIDAuNyAwLjYgMS4zIDEuMyAxLjNoMi42YzAuNyAwIDEuMy0wLjYgMS4zLTEuM3YtMTMuOWMwLTAuNy0wLjYtMS4zLTEuMy0xLjN6Ii8+CgkJCQkJCQk8L2c+CgkJCQkJCTwvZz4KCQkJCQk8L2c+CgkJCQk8L2c+CgkJCTwvZz4KCQk8L2c+Cgk8L2c+Cjwvc3ZnPg==); background-repeat: no-repeat; float: left; margin-top: 10px; margin-left: -5px; } div#control-container div#volume-container { width: 25%; float: left; padding-top: 20px; } div#control-container div#volume-container div#shuffle-right { width: 23px; height: 19px; cursor: pointer; margin: auto; } div#control-container div#volume-container div#shuffle-right.amplitude-shuffle-off { background: url("https://521dimensions.com/img/open-source/amplitudejs/blue-player/shuffle-off.svg"); } div#control-container div#volume-container div#shuffle-right.amplitude-shuffle-on { background: url("https://521dimensions.com/img/open-source/amplitudejs/blue-player/shuffle-on.svg"); } div#control-container div.amplitude-mute { cursor: pointer; width: 25px; height: 19px; float: left; } div#control-container div.amplitude-mute.amplitude-not-muted { background: url("https://521dimensions.com/img/open-source/amplitudejs/blue-players/volume.svg"); background-repeat: no-repeat; } div#control-container div.amplitude-mute.amplitude-muted { background: url("https://521dimensions.com/img/open-source/amplitudejs/blue-player/mute.svg"); background-repeat: no-repeat; } div#control-container:after { content: ""; display: table; clear: both; } /* Small only */ @media screen and (max-width: 39.9375em) { div#amplitude-player div#repeat-container div#repeat { margin-left: auto; margin-right: auto; float: none; } div#amplitude-player div#repeat-container div#shuffle { display: none; } div#amplitude-player div#volume-container div.volume-controls { display: none; } div#amplitude-player div#volume-container div#shuffle-right { display: block; } } /* Medium only */ @media screen and (min-width: 40em) and (max-width: 63.9375em) { div#amplitude-player div#repeat-container div#repeat { margin-left: auto; margin-right: auto; float: none; } div#amplitude-player div#repeat-container div#shuffle { display: none; } div#amplitude-player div#volume-container div.volume-controls { display: none; } div#amplitude-player div#volume-container div#shuffle-right { display: block; } } /* Large and up */ @media screen and (min-width: 64em) { div#amplitude-player div#repeat-container div#repeat { margin-left: 10px; margin-right: 20px; float: left; } div#amplitude-player div#volume-container div#shuffle-right { display: none; } } input[type=range].amplitude-volume-slider { -webkit-appearance: none; width: calc(100% - 33px); float: left; margin-top: 10px; margin-left: 5px; background-color: transparent; } @-moz-document url-prefix() { input[type=range].amplitude-volume-slider { margin-top: 0px; } } @supports (-ms-ime-align: auto) { input[type=range].amplitude-volume-slider { margin-top: 3px; height: 12px; background-color: rgba(255, 255, 255, 0) !important; z-index: 999; position: relative; } div.ms-range-fix { height: 1px; background-color: #a9a9a9; width: 67%; float: right; margin-top: -6px; z-index: 9; position: relative; } } @media all and (-ms-high-contrast: none) { *::-ms-backdrop, input[type=range].amplitude-volume-slider { margin-top: -24px; background-color: rgba(255, 255, 255, 0) !important; } } input[type=range].amplitude-volume-slider:focus { outline: none; } input[type=range].amplitude-volume-slider::-webkit-slider-runnable-track { width: 75%; height: 1px; cursor: pointer; animate: 0.2s; background: #cfd8dc; } input[type=range].amplitude-volume-slider::-webkit-slider-thumb { height: 10px; width: 10px; border-radius: 10px; background: var(--kn_green); cursor: pointer; margin-top: -4px; -webkit-appearance: none; } input[type=range].amplitude-volume-slider:focus::-webkit-slider-runnable-track { background: #cfd8dc; } input[type=range].amplitude-volume-slider::-moz-range-track { width: 100%; height: 1px; cursor: pointer; animate: 0.2s; background: #cfd8dc; } input[type=range].amplitude-volume-slider::-moz-range-thumb { height: 10px; width: 10px; border-radius: 10px; background: var(--kn_green); cursor: pointer; margin-top: -4px; } input[type=range].amplitude-volume-slider::-ms-track { width: 100%; height: 1px; cursor: pointer; animate: 0.2s; background: transparent; /*leave room for the larger thumb to overflow with a transparent border */ border-color: transparent; border-width: 15px 0; /*remove default tick marks*/ color: transparent; } input[type=range].amplitude-volume-slider::-ms-fill-lower { background: #cfd8dc; border-radius: 10px; } input[type=range].amplitude-volume-slider::-ms-fill-upper { background: #cfd8dc; border-radius: 10px; } input[type=range].amplitude-volume-slider::-ms-thumb { height: 10px; width: 10px; border-radius: 10px; background: var(--kn_green); cursor: pointer; margin-top: 2px; } input[type=range].amplitude-volume-slider:focus::-ms-fill-lower { background: #cfd8dc; } input[type=range].amplitude-volume-slider:focus::-ms-fill-upper { background: #cfd8dc; } input[type=range].amplitude-volume-slider::-ms-tooltip { display: none; } div#time-container span.current-time { color: var(--kn_green); font-size: 14px; font-weight: 700; float: left; width: 15%; text-align: center; } div#time-container span.duration { color: var(--kn_green); font-size: 14px; font-weight: 700; float: left; width: 15%; text-align: center; } div#time-container:after { content: ""; display: table; clear: both; } div#meta-container { text-align: center; margin-top: 5px; } div#meta-container span.song-name { display: block; color: var(--kn_dark_text); font-size: 20px; font-family: "Open Sans", sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } div#meta-container div.song-artist-album { color: var(--kn_green); font-size: 14px; font-weight: 700; text-transform: uppercase; font-family: "Open Sans", sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } div#meta-container div.song-artist-album span { display: block; } div.amplitude-wave-form { margin-top: -14px; } div.amplitude-wave-form svg { stroke: var(--kn_green); height: 50px; width: 100%; stroke-width: 0.5px; } div.amplitude-wave-form svg g { stroke: var(--kn_green); height: 50px; width: 100%; } div.amplitude-wave-form svg g path { stroke: var(--kn_green); height: 50px; width: 100%; } div#large-visualization { width: 100%; background-color: black; visibility: hidden; } /* 4. Pages */ /* 5. Themes */ /* 6. Utils */ /* 7. Vendors */ /*# sourceMappingURL=app.css.map */ .audio-content { margin-top: 20px; } .audio-content h2, .audio-content h3, .audio-content h4, .audio-content h5, .audio-content h6 { margin-bottom: 0; } .audio-image a::before, .audio-image a::after, .audio-image a:visited::before, .audio-image a:visited::after { transition: all 0.3s ease-in-out; } .audio-image a::before, .audio-image a:visited::before { content: ""; position: absolute; width: 40px; height: 40px; right: 0; bottom: 0; background-color: var(--kn_color_secondary); z-index: 1; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } .audio-image a::after, .audio-image a:visited::after { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBmaWxsPSIjZmZmZmZmIiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4IiB2aWV3Qm94PSIwIDAgMTkyMCAxOTIwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHN0cm9rZT0iI2ZmZmZmZiI+Cg08ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiIHN0cm9rZS13aWR0aD0iMCIvPgoNPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cg08ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+IDxwYXRoIGQ9Ik0xMTI5LjQzMiAxMTN2MTY5NC4xNDhIOTM2LjYzOGwtNDUxLjc3My00NTEuNzczaC0zMTUuNDVDNzYuMDEgMTM1NS4zNzUgMCAxMjc5LjM2NSAwIDExODUuOTZWNzM0LjE4N2MwLTkzLjQwNCA3Ni4wMS0xNjkuNDE0IDE2OS40MTUtMTY5LjQxNGgzMTUuNDVMOTM2LjYzOCAxMTNoMTkyLjc5NFptLTExMi45NDMgMTEyLjk0M2gtMzMuMDkzbC00MTguNjggNDE4LjY4djYzMC45MDFsNDE4LjY4IDQxOC42OGgzMy4wOTNWMjI1Ljk0NFptNjU1LjQ4OCAxMzUuMTE0QzE4MzEuOTA0IDUyMS4wOTcgMTkyMCA3MzMuNzcgMTkyMCA5NjAuMTA3YzAgMjI2LjIyNi04OC4wOTYgNDM4Ljg5OC0yNDguMDIzIDU5OC45MzhsLTc5Ljg1MS03OS44NWMxMzguNjk0LTEzOC42OTUgMjE0LjkzLTMyMy4wMTggMjE0LjkzLTUxOS4wODcgMC0xOTYuMTgzLTc2LjIzNi0zODAuNTA2LTIxNC45My01MTkuMlptLTIzOS4xMTIgMjM5Ljc0NWM5NS42NjMgOTcuMDE4IDE0OC4yOTQgMjI0LjY0NCAxNDguMjk0IDM1OS4yNzJzLTUyLjYzMSAyNjIuMjU0LTE0OC4yOTQgMzU5LjI3MmwtODAuNTI5LTc5LjI4NmM3NC43NjktNzUuNzg1IDExNS44OC0xNzUuMTc1IDExNS44OC0yNzkuOTg2IDAtMTA0LjgxMS00MS4xMTEtMjA0LjIwMS0xMTUuODgtMjc5Ljk4NlptLTk4MS4wOTIgNzYuOTE0SDE2OS40MTVjLTMxLjA2IDAtNTYuNDcyIDI1LjMtNTYuNDcyIDU2LjQ3MXY0NTEuNzczYzAgMzEuMTcyIDI1LjQxMiA1Ni40NzIgNTYuNDcyIDU2LjQ3MmgyODIuMzU4VjY3Ny43MTZaIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz4gPC9nPgoNPC9zdmc+); width: 24px; height: 24px; right: 8px; bottom: 8px; background-size: 18px; } .audio-image a:hover::before, .audio-image a:visited:hover::before { width: 50px; height: 50px; } .audio-image a:hover::after, .audio-image a:visited:hover::after { transform: translate(-4px, -4px); } /*------------------------------------------------- >> Basic styles for Courses Block -------------------------------------------------*/ .course a.course-inner, .course a:visited.course-inner { display: block; } .course a:hover .button, .course a:visited:hover .button { background-color: var(--kn_theme_btn_bgcolor_hover); } .course a:hover img, .course a:visited:hover img { transform: scale(1.05); } .course .block-button { margin-top: 12px; } .course-image { aspect-ratio: 1/0.7; overflow: hidden; } .course-image img { transition: transform 0.3s ease-in-out; } .course-content { margin-top: 20px; } .course-content h2, .course-content h3, .course-content h4, .course-content h5, .course-content h6 { margin-bottom: 10px; } .course-content .course-address { margin: 8px 0 12px; } .course-filter-area .search-filter { width: 60%; } .course-filter-area form { justify-content: flex-end; gap: 12px; } .course-filter-area select, .course-filter-area input { width: 258px; } .course-meta { justify-content: space-between; } .read-pdf { background-image: url(data:image/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIFRyYW5zZm9ybWVkIGJ5OiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4KPHN2ZyBmaWxsPSIjNDU3NzNkIiB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSI4MDBweCIgaGVpZ2h0PSI4MDBweCIgdmlld0JveD0iMCAwIDU1MC44MDEgNTUwLjgwMSIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgc3Ryb2tlPSIjNDU3NzNkIj4KDTxnIGlkPSJTVkdSZXBvX2JnQ2FycmllciIgc3Ryb2tlLXdpZHRoPSIwIi8+Cg08ZyBpZD0iU1ZHUmVwb190cmFjZXJDYXJyaWVyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KDTxnIGlkPSJTVkdSZXBvX2ljb25DYXJyaWVyIj4gPGc+IDxnPiA8cGF0aCBkPSJNMjY3LjM0Miw0MTQuNjk4Yy02LjYxMywwLTEwLjg4NCwwLjU4NS0xMy40MTMsMS4xNjV2ODUuNzJjMi41MzQsMC41ODYsNi42MTYsMC41ODYsMTAuMzA0LDAuNTg2IGMyNi44MTgsMC4xODksNDQuMzE1LTE0LjU3Niw0NC4zMTUtNDUuODc0QzMwOC43MzgsNDI5LjA3OSwyOTIuODAzLDQxNC42OTgsMjY3LjM0Miw0MTQuNjk4eiIvPiA8cGF0aCBkPSJNMTUyLjgzNyw0MTQuMzEzYy02LjAyMiwwLTEwLjEwNCwwLjU4LTEyLjI0OCwxLjE2djM4LjY4NmMyLjUzMSwwLjU4LDUuNjQzLDAuNzgsOS45MDMsMC43OCBjMTUuNzU3LDAsMjUuNDcxLTcuOTczLDI1LjQ3MS0yMS4zODRDMTc1Ljk2NCw0MjEuNTA2LDE2Ny42MDEsNDE0LjMxMywxNTIuODM3LDQxNC4zMTN6Ii8+IDxwYXRoIGQ9Ik00NzUuMDk1LDEzMS45OTJjLTAuMDMyLTIuNTI2LTAuODMzLTUuMDIxLTIuNTY4LTYuOTkzTDM2Ni4zMjQsMy42OTRjLTAuMDIxLTAuMDM0LTAuMDYyLTAuMDQ1LTAuMDg0LTAuMDc2IGMtMC42MzMtMC43MDctMS4zNi0xLjI5LTIuMTQxLTEuODA0Yy0wLjIzMi0wLjE1LTAuNDc1LTAuMjg1LTAuNzE4LTAuNDIyYy0wLjY3NS0wLjM2Ni0xLjM4Mi0wLjY3LTIuMTMtMC44OTIgYy0wLjE5LTAuMDU4LTAuMzgtMC4xNC0wLjU4LTAuMTkyQzM1OS44NywwLjExNCwzNTkuMDM3LDAsMzU4LjIwMywwSDk3LjJDODUuMjkyLDAsNzUuNiw5LjY5Myw3NS42LDIxLjYwMXY1MDcuNiBjMCwxMS45MTMsOS42OTIsMjEuNjAxLDIxLjYsMjEuNjAxSDQ1My42YzExLjkwOCwwLDIxLjYwMS05LjY4OCwyMS42MDEtMjEuNjAxVjEzMy4yMDIgQzQ3NS4yLDEzMi43OTYsNDc1LjEzNywxMzIuMzk4LDQ3NS4wOTUsMTMxLjk5MnogTTE5My4yNjEsNDYzLjg3M2MtMTAuMTA0LDkuNTIzLTI1LjA3MiwxMy44MDYtNDIuNTY5LDEzLjgwNiBjLTMuODgyLDAtNy4zOTEtMC4yLTEwLjEwMi0wLjU4djQ2LjgzOWgtMjkuMzVWMzk0LjY3NWM5LjEzMS0xLjU1LDIxLjk2Ny0yLjcyMSw0MC4wNDctMi43MjEgYzE4LjI2NywwLDMxLjI5MiwzLjUwMSw0MC4wMzYsMTAuNDk0YzguMzYzLDYuNjEyLDEzLjk4NSwxNy40OTcsMTMuOTg1LDMwLjMyMkMyMDUuMzA4LDQ0NS42MDUsMjAxLjA0Miw0NTYuNDksMTkzLjI2MSw0NjMuODczeiBNMzE4LjI1Miw1MDguMzkyYy0xMy43ODUsMTEuNDY0LTM0Ljc3OCwxNi45MDYtNjAuNDI4LDE2LjkwNmMtMTUuMzU5LDAtMjYuMjM4LTAuOTctMzMuNjM3LTEuOTRWMzk0LjY3NSBjMTAuODg3LTEuNzQsMjUuMDgzLTIuNzIxLDQwLjA0Ni0yLjcyMWMyNC44NjcsMCw0MS4wMDQsNC40NzIsNTMuNjQ1LDEzLjk5NWMxMy42MSwxMC4xMDksMjIuMTY0LDI2LjI0MSwyMi4xNjQsNDkuMzcgQzM0MC4wMzEsNDgwLjQsMzMwLjg5Nyw0OTcuNjk3LDMxOC4yNTIsNTA4LjM5MnogTTQzOS41NzIsNDE3LjIyNWgtNTAuMzUxdjI5LjkzMmg0Ny4wMzl2MjQuMTFoLTQ3LjAzOXY1Mi42NzFIMzU5LjQ5VjM5Mi45MzUgaDgwLjA4MlY0MTcuMjI1eiBNOTcuMiwzNjYuNzUyVjIxLjYwMWgyNTAuMjAzdjExMC41MTVjMCw1Ljk2MSw0LjgzMSwxMC44LDEwLjgsMTAuOEg0NTMuNmwwLjAxMSwyMjMuODM2SDk3LjJ6Ii8+IDxwYXRoIGQ9Ik0zODYuMjA1LDIzMi4xMzVjLTAuNjMzLTAuMDU5LTE1Ljg1Mi0xLjQ0OC0zOS4yMTMtMS40NDhjLTcuMzE5LDAtMTQuNjkxLDAuMTQzLTIxLjk2OSwwLjQxNyBjLTQ2LjEzMy0zNC42Mi04My45MTktNjkuMjY3LTEwNC4xNDgtODguNjg0YzAuMzY5LTIuMTM4LDAuNjIzLTMuODI4LDAuNzQxLTUuMTI2YzIuNjY4LTI4LjE2NS0wLjI5OC00Ny4xNzktOC43ODYtNTYuNTE1IGMtNS41NTgtNi4xMDEtMTMuNzIxLTguMTMxLTIyLjIzMy01LjgwNmMtNS4yODYsMS4zODUtMTUuMDcxLDYuNTEzLTE4LjIwNCwxNi45NTJjLTMuNDU5LDExLjUzNiwyLjEwMSwyNS41MzcsMTYuNzA4LDQxLjc3MyBjMC4yMzIsMC4yNDYsNS4xODksNS40NCwxNC4xOTYsMTQuMjQxYy01Ljg1NCwyNy45MTMtMjEuMTc4LDg4LjE0OC0yOC42MTMsMTE3LjA3M2MtMTcuNDYzLDkuMzMxLTMyLjAxMywyMC41NzEtNDMuMjc3LDMzLjQ2NSBsLTAuNzM4LDAuODQ0bC0wLjQ3NywxLjAxM2MtMS4xNiwyLjQzNy02LjcwNSwxNS4wODctMi41NDIsMjUuMjQ5YzEuOTAxLDQuNjIsNS40NjMsNy45OTUsMTAuMzAyLDkuNzY3bDEuMjk3LDAuMzQ5IGMwLDAsMS4xNywwLjI1MywzLjIyNywwLjI1M2M5LjAxLDAsMzEuMjUtNC43MzUsNDMuMTc5LTQ4LjY5NWwyLjg5LTExLjEzOGM0MS42MzktMjAuMjM5LDkzLjY4OC0yNi43NjgsMTMxLjQxNS0yOC41ODcgYzE5LjQwNiwxNC4zOTEsMzguNzE3LDI3LjYxMSw1Ny40MjgsMzkuMzE4bDAuNjExLDAuMzU0YzAuOTA3LDAuNDY0LDkuMTEyLDQuNTE1LDE4LjcyMSw0LjUyNGwwLDAgYzEzLjczMiwwLDIzLjc2Mi04LjQyNywyNy40OTYtMjMuMTEzbDAuMTg5LTEuMDA0YzEuMDQ0LTguMzkzLTEuMDY1LTE1Ljk1OC02LjA5Ni0yMS44NzIgQzQwNy43MTEsMjMzLjI4MSwzODcuOTc4LDIzMi4xOTUsMzg2LjIwNSwyMzIuMTM1eiBNMTQyLjgxMiwzMTkuNzQ0Yy0wLjA4NC0wLjEtMC4xMjQtMC4xOTQtMC4xNjYtMC4zIGMtMC44OTYtMi4xNTcsMC4xNzktNy4zODksMS43NjEtMTEuMjIyYzYuNzkyLTcuNTk0LDE0Ljk0NS0xNC41NjUsMjQuMzUzLTIwLjg0MSBDMTU5LjU5OCwzMTcuMDM5LDE0Ni4yNzQsMzE5LjYwMywxNDIuODEyLDMxOS43NDR6IE0yMDAuOTg0LDEyMi42OTVMMjAwLjk4NCwxMjIuNjk1Yy0xNC4wNy0xNS42NjItMTMuODU5LTIzLjQyNy0xMy4xMDItMjYuMDQxIGMxLjI0Mi00LjM2OSw2Ljg0OC02LjAyLDYuODk2LTYuMDM1YzIuODI0LTAuNzY4LDQuNTM4LTAuNjE3LDYuMDY0LDEuMDU4YzMuNDUxLDMuNzkxLDYuNDE1LDE1LjIzMiw1LjI0NCwzNi4yMTggQzIwMi43NjQsMTI0LjU1NywyMDAuOTg0LDEyMi42OTUsMjAwLjk4NCwxMjIuNjk1eiBNMTkzLjcxNCwyNTYuMDY4bDAuMjQzLTAuOTI4bC0wLjAzMiwwLjAxMSBjNy4wNDUtMjcuNTkzLDE3LjIwNS02Ny45OTYsMjMuMDQ3LTkzLjk0OWwwLjIxMSwwLjIwMWwwLjAyMS0wLjEyNGMxOC45LDE3Ljc5OCw0Ny44OCw0My44MzEsODIuNTc5LDcwLjkwN2wtMC4zOSwwLjAxNiBsMC41NzQsMC40MzNDMjY3LjI3OSwyMzUuMzk2LDIyOC4yMzcsMjQxLjg0LDE5My43MTQsMjU2LjA2OHogTTQwOC4zODYsMjY1LjEyYy0yLjQ4OSw5LjE0Ni03LjI3NywxMC4zOTYtMTEuNjY1LDEwLjM5NmwwLDAgYy01LjA5NCwwLTkuOTk4LTIuMTItMTEuMTE2LTIuNjMyYy0xMi43NDEtNy45ODYtMjUuNzc2LTE2LjY4OC0zOC45MjktMjUuOTk4YzAuMTA1LDAsMC4yLDAsMC4zMTYsMCBjMjIuNTQ5LDAsMzcuNTY4LDEuMzY5LDM4LjE1OCwxLjQxMWMzLjc2NiwwLjE0LDE1LjY4NCwxLjksMjAuODIsNy45MzhDNDA3Ljk4NCwyNTguNjAyLDQwOC43NTUsMjYxLjQzMSw0MDguMzg2LDI2NS4xMnoiLz4gPC9nPiA8L2c+IDwvZz4KDTwvc3ZnPg==); background-size: contain; } /*------------------------------------------------- >> Basic styles for Mid page cta Block -------------------------------------------------*/ .mid-page-cta { justify-content: space-between; align-items: center; padding: 60px 0; gap: 44px 30px; } .mpc-image { aspect-ratio: 1/1; } /* ------------------------------------------------------------------ > Responsive ------------------------------------------------------------------ */ /* ------------------------------------------------- >> Responsive queries ------------------------------------------------- */ @media only screen and (max-width: 1200px) { .books-template .category-area, .artcles-template .category-area, .news-template .category-area, .hero-section-default .category-area, .single-video-ctn .category-area { position: relative; width: 105.5%; border-bottom: none; padding-bottom: 0; } .books-template .category-area::after, .artcles-template .category-area::after, .news-template .category-area::after, .hero-section-default .category-area::after, .single-video-ctn .category-area::after { content: ""; position: absolute; bottom: 0; right: 0; width: 5.5%; height: 3px; background-color: var(--kn_white); } .books-template .category-links, .artcles-template .category-links, .news-template .category-links, .hero-section-default .category-links, .single-video-ctn .category-links { display: flex; justify-content: flex-start; flex-wrap: nowrap; overflow-x: scroll; gap: 12px; white-space: nowrap; padding: 0px 5% 20px 0; /* Track */ /* Handle */ } .books-template .category-links::-webkit-scrollbar, .artcles-template .category-links::-webkit-scrollbar, .news-template .category-links::-webkit-scrollbar, .hero-section-default .category-links::-webkit-scrollbar, .single-video-ctn .category-links::-webkit-scrollbar { height: 3px; } .books-template .category-links::-webkit-scrollbar-track, .artcles-template .category-links::-webkit-scrollbar-track, .news-template .category-links::-webkit-scrollbar-track, .hero-section-default .category-links::-webkit-scrollbar-track, .single-video-ctn .category-links::-webkit-scrollbar-track { background: var(--kn_gray); } .books-template .category-links::-webkit-scrollbar-thumb, .artcles-template .category-links::-webkit-scrollbar-thumb, .news-template .category-links::-webkit-scrollbar-thumb, .hero-section-default .category-links::-webkit-scrollbar-thumb, .single-video-ctn .category-links::-webkit-scrollbar-thumb { background: var(--kn_color_primary); border-radius: 5px; } .books-template .filter-ctn, .artcles-template .filter-ctn, .news-template .filter-ctn, .hero-section-default .filter-ctn, .single-video-ctn .filter-ctn { padding-bottom: 10px; border-bottom: none; } } @media only screen and (min-width: 1024px) and (max-width: 1200px) { .video-playlist-ctn .video-image img { aspect-ratio: 1/0.7; } .header-nav ul li a, .header-nav ul li a:visited { font-size: clamp(0.875rem, 1.29vw + 0.049rem, 1rem); } .footer-widget:nth-child(1) { width: 36%; } .footer-widget:nth-child(4) { width: 30%; } .footer-widget input[type=submit], .footer-widget button, .footer-widget input[type=button], .footer-widget input[type=reset] { padding: 0 14px; } .course-filter-area .search-filter { width: 57.5%; max-width: 530px; } .hero-section .category-area::after { display: none; } .article-content-inner { padding: 16px; } } @media only screen and (max-width: 1023px) { .top-bar .header-wrapper { width: 90%; } .hero-section-default .hero-content .category-area, .hero-section-default .hero-content .category-area * { max-width: initial; } .hero-section .category-area::after { background-color: var(--kn_green_2); } .mobile-hide { display: none; } .right-header { width: auto; flex-direction: row-reverse; } .top-bar { padding-bottom: 16px; } .header-btn { margin-top: 30px; } .newsletter-form input[type=submit] { padding: 0 16px; } .footer-top, .hero-inner { flex-wrap: wrap; } .footer-widget:nth-child(1) { width: 100%; margin-right: 0; } .copyright, .legal-nav { width: 100%; } .search-bar-form form { height: 90px; padding: 24px; } .footer-cta-content.col-65, .hero-image, .jump-links { width: 100%; } } @media only screen and (min-width: 769px) and (max-width: 1023px) { .footer-widget:nth-child(2), .footer-widget:nth-child(3) { width: 20%; } .footer-widget:nth-child(4) { width: 50%; } .course-filter-area select, .course-filter-area input { width: 200px; } .search-filter { width: 35%; } .hero-section-default .hero-image { aspect-ratio: 1/0.55; } .jump-links { padding-right: 0; height: 380px; } .post-ctn.two-columns { grid-template-columns: repeat(auto-fit, minmax(min(clamp(200px, 48%, 100%), 100%), 1fr)); gap: 4%; } .video-playlist-ctn .single-video { flex-wrap: wrap; } .video-playlist-ctn .video-image, .video-playlist-ctn .video-content { width: 100%; } .video-playlist-ctn .video-image a::after, .video-playlist-ctn .video-image a:visited::after { background-size: 50px; } } @media only screen and (max-width: 768px) { .footer-bottom { flex-direction: column-reverse; } .footer-widget:nth-child(2), .footer-widget:nth-child(3), .footer-widget:nth-child(4) { width: 100%; } .legal-nav ul { justify-content: flex-start; } .artcles-filter-area, .contact-us-inner, .post-meta, .post-resources, .course-meta, .hero-book-detail, .single-video-main { flex-wrap: wrap; } .search-filter { margin-top: 20px; } .jump-links { height: auto; } .search-filter, .course-filter-area .search-filter, .single-video-left, .video-playlist-ctn { width: 100%; } .course-filter-area .search-filter select, .course-filter-area .search-filter input { width: 48%; } .register-form { padding: 24px; } .hero-book-detail { flex-direction: column-reverse; } .single-video-ctn .category-area { padding-bottom: 0; margin-bottom: 40px; border-bottom: none; } .video-playlist { display: none; padding-bottom: 24px; } .video-playlist-ctn { border-bottom: 1px solid var(--kn_border); margin-bottom: 40px; } .video-playlist-head { position: relative; margin-top: 30px; padding: 24px 50px 24px 0; border-top: 1px solid var(--kn_border); margin-bottom: 0; } .video-playlist-head::after { content: ""; position: absolute; top: 28px; right: 0; width: 18px; height: 18px; background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDU2IDMyIiB3aWR0aD0iNTYiIGhlaWdodD0iMzIiPgoJPHRpdGxlPmRvd24tYXJyb3ctYmFja3VwLTItc3ZncmVwby1jb208L3RpdGxlPgoJPHN0eWxlPgoJCS5zMCB7IGZpbGw6ICMwMDIzNjYgfSAKCTwvc3R5bGU+Cgk8ZyBpZD0iU1ZHUmVwb19iZ0NhcnJpZXIiPgoJPC9nPgoJPGcgaWQ9IlNWR1JlcG9fdHJhY2VyQ2FycmllciI+Cgk8L2c+Cgk8ZyBpZD0iU1ZHUmVwb19pY29uQ2FycmllciI+CgkJPHBhdGggY2xhc3M9InMwIiBkPSJtNTIuNSAwbDMuNSAzLjItMjggMjguOC0yOC0yOC44IDMuNS0zLjIgMjQuNSAyNS4yeiIvPgoJPC9nPgo8L3N2Zz4=); background-repeat: no-repeat; background-position: center; background-size: contain; transition: transform 0.3s ease-in-out; } .video-playlist-head.active::after { transform: rotate(180deg); } .filter-area + .category-area, .search-filter + .category-area { margin-top: 30px; } } @media only screen and (max-width: 459px) { .footer-widgets .single-widget { width: 100%; margin-bottom: 30px; } .footer-widgets .single-widget:first-child { margin-bottom: 50px; } } /* ------------------------------------------------- >> Base Responsive queries ------------------------------------------------- */ @media only screen and (max-width: 1023px) { .two-columns-ctn { flex-wrap: wrap; } .tab-content-ctn, .latest-events, .col-55 { width: 100%; } } @media only screen and (max-width: 768px) { .iat-image.column { margin-top: 30px; } ul.children li.depth-2, ul.children li.depth-3, ul.children li.depth-4, ul.children li.depth-5, ol.children li.depth-2, ol.children li.depth-3, ol.children li.depth-4, ol.children li.depth-5 { margin: 0 0 30px 20px !important; } .gfield.half-input-field, .ginput_left, .name_first, .ginput_right, .name_last { width: 100%; margin-right: 0; display: block; } figure { overflow-x: scroll; } figure td, figure th { width: 140px; } .col-50, .col-30, .col-40, .col-65, .half-width, .center-align .button, .tab-content-area, .col-left, .col-right, .jump-links-ctn, .content-area { width: 100%; } .image-alongside-text, .two-columns-ctn, .lead-paragraph-var, .mid-page-cta, .detail-page, .tab-content-ctn { flex-wrap: wrap; } .tab-content-links { border-right: none; padding-right: 0; } .tab-content-links::after { background-color: var(--kn_white); } .tab-content-links { width: 105.5%; position: relative; } .tab-content-links::after { content: ""; position: absolute; bottom: 0; right: 0; width: 5.5%; height: 3px; background-color: var(--kn_white); } .tab-content-links ul { display: flex; justify-content: flex-start; overflow-x: scroll; gap: 12px; white-space: nowrap; padding: 0px 5% 20px 0; /* Track */ /* Handle */ } .tab-content-links ul::-webkit-scrollbar { height: 3px; } .tab-content-links ul::-webkit-scrollbar-track { background: var(--kn_gray); } .tab-content-links ul::-webkit-scrollbar-thumb { background: var(--kn_color_primary); border-radius: 5px; } .tab-content-links li:nth-child(n+2) { margin-top: 0; } .tab-content-area { padding-left: 0; margin-top: 30px; } .category-links { flex-wrap: nowrap; } .three-columns { row-gap: 44px; } } /* ------------------------------------------------------------------ > Import Fonts ------------------------------------------------------------------ */ /* ------------------------------------------------------------------ > Vendors CSS Starts Here ------------------------------------------------------------------ */ /* ------------------------------------------------------------------ > Vendors CSS Example ------------------------------------------------------------------ */ /*# sourceMappingURL=styles.min.css.map*/