/*
Theme Name: S4STech
Theme URI: https://s4stechnologies.com
Author: CreativFish
Author URI: 
Description: This theme is specially created for client and created in Twitter Bootstrap 5. Thank you.
Version: 1.0.0
Tags: responsive-layout, featured-images, flexible-header, theme-options, sticky-post
License: GNU General Public License version 3
License URI: http://www.opensource.org/licenses/gpl-license.php GPL v3.0 (or later)
*/

/********************************************************************************************************************/
/******************************************** MAIN HTML STYLES ******************************************************/
/********************************************************************************************************************/
@import url('css/bootstrap.min.css');
@import url('css/font-awesome.min.css');
@import url('css/slick.css');
@import url('css/fonts.css');
@import url('css/animate.min.css');

:root {
  --primary: #01886E;
  --secondary: #D1EA53;
  --main: #8eca5c;
  --tint: #EFF5F0;
}

body { font-family: 'Poppins', Helvetica, Arial, sans-serif; margin: 0; padding: 0; font-weight: 400; color: #444446; font-variant-ligatures: common-ligatures; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }

a, a:hover, a:focus, a:active, .btn, .btn:hover { color: inherit; text-decoration: none; -webkit-transition: all 500ms; -moz-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; }

.btn { border-radius: 0px; }
.btn.btn-main { background-image: linear-gradient(to right, var(--primary), var(--secondary)); color: #FFF; border: 0px; font-weight: 600; padding: 8px 20px; }

.btn.btn-clear { border: 0px; background-color: transparent; }
.btn.btn-primary { background-color: var(--primary); color: #FFF; padding: 8px 20px; }
.btn.btn-primary:hover { padding: 8px 24px; }
.btn.btn-linear { border: 1px solid #6E6E6E; color: #6E6E6E; background-color: transparent; }
.btn.btn-linear.active { border: 1px solid var(--primary); color: var(--primary); }
.btn.btn-linear:hover { color: var(--main); border: 1px solid var(--main); }

.btn.btn-icon { border: 0px; color: #6E6E6E; background-color: transparent; }
.btn.btn-icon img { max-height: 36px; margin-right: 5px; }
.btn.btn-icon.active { color: var(--primary); }
.btn.btn-icon:hover { color: var(--main); }


.relative { position: relative; }

h1 { font-weight: 700; color: #444446; }
h2 { font-weight: 700; color: var(--primary); }
h3 { font-weight: 700; color: var(--primary); }

.nav-link { color: #6E6E6E; padding: 6px 13px!important; }
.nav-link:hover,
.current_page_item a, .current_menu_item a { color: var(--main); }

header .special { margin-left: 30px; }
header.scrolled { position: fixed; top: 0; left: 0; right: 0; background-image: linear-gradient(to right, var(--primary), var(--secondary)); z-index: 999; }
header.scrolled .btn.btn-main { background-image: none; background-color: var(--primary); }
header.scrolled .navbar { padding: 0px; }
header.scrolled .navbar-brand img { max-height: 60px; mix-blend-mode: multiply; }
header.scrolled .nav-link { color: #FFF; }
header.scrolled .nav-link:hover { color: var(--secondary); }

.upshape { position: relative; display: inline-block; }
.upshape:before { content: ""; position: absolute; top: -20px; left: 0px; background-image: url(./img/upper-shape.svg); background-position: tp left; width: 60px; height: 7px; background-repeat: no-repeat; background-size: 100%; }

.navbar-collapse { font-size: 15px; }

.hero h2 { color: #333; }
.banner { position: relative; }

.inner-banner { position: relative; min-height: 90vh; background-position: center; background-repeat: no-repeat; background-size:cover; }
.inner-banner .banner-caption { display: flex; justify-content: flex-start; align-items: center; min-height: 90vh; }
.inner-banner .banner-caption.rite { justify-content: flex-end; }
.inner-banner .banner-caption.rite:before { content: ""; position: absolute; top: 0; right: 0; width: 100%; height: 100%; background-image: linear-gradient(to left, rgba(0,0,0,0.5), rgba(0,0,0,0.2)); }
.inner-banner .banner-body { width: 50%; color: #FFF; position: relative; }
.inner-banner .banner-body h2 { color: #FFF; }

.textured { background-image: url(./img/texture.jpg); background-size: 50%; background-position: center; background-repeat: repeat; position: relative; }

.img-rounder { text-align: center; position: relative; }
.img-rounder .layer { background-color: #e3f2ef; padding: 30px; border-radius: 500px; display:  inline-block; }
.img-rounder .layer .round { border: 6px solid #FFF; background-color: var(--primary); padding: 15px; position: relative; display: inline-block; border-radius: 500px; }
.img-rounder .layer .round img { border-radius: 500px; border: 10px solid #FFF; }

.process { padding: 25px; position: relative; }
.process .icon { width: 150px; height: 150px; display: flex; justify-content: center; align-items: center; background-color: var(--primary); border-radius: 150px; margin: 20px auto; }
.process .icon img { max-height: 100px; max-width: 90px; }
.process h4 { color: var(--primary); font-weight: 600; margin: 30px; }
.process p { width: 85%; margin: 0 auto; }

.pills-holder { text-align: center; margin-bottom: 25px; }
.pills-holder ul { display: inline-block; }
.pills-holder ul li { display: inline-block; }

.category-btn { display: block; width: 200px; height: 200px; background-size: cover; background-repeat: no-repeat; background-position:center; position: relative; overflow: hidden; border-radius: 200px; margin: 0 auto; }
.category-btn .info { width: 200px; height: 200px; border-radius: 200px; background-image: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0)); color: #FFF; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 30px;  -webkit-transition: all 500ms; -moz-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; }
.category-btn .info h4 { color: #FFF; text-align: center; font-size: 17px; }

.category-btn:hover .info { padding-bottom: 35px; background-image: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.3)); }

.features-anim { display: flex; justify-content: space-between; align-items: center; width: 560px; }
.features-panel { position: relative; }
.features-panel .feature { position: relative; height: 100px; padding: 5px 5px 5px 120px; text-align: left; display: flex; justify-content: flex-start; align-items: center; }
.features-panel .feature .icon { background-color: var(--primary); width: 75px; height: 75px; border-radius: 75px; display: flex; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; bottom: 0; margin-top: auto; margin-bottom: auto; }
.features-panel .feature .icon img { max-width: 55px; height: auto; }
.features-panel .feature h5 { font-weight: 600; color: #333; }

.features-panel .feature:before { content: ""; position: absolute; width: 50px; height: 2px; top: 0; bottom: 0; left: -80px; margin: auto 0; background-image: linear-gradient(90deg, var(--primary) 50%, transparent 50%); background-repeat: repeat-x; background-size: 15px 2px; background-position: left top, right top; animation: border-dance 1s infinite linear; }
.features-panel .feature:after { content: ""; position: absolute; top: 0; bottom: 0; margin: auto 0; width: 15px; height: 15px; left: -35px; background-image: url(./img/icon-arrow.svg); background-size: contain; background-repeat: no-repeat; }

.features-panel:before { content: ""; position: absolute; height: 40%; top: 50px; left: -80px; width: 2px; background-image: linear-gradient(0deg, var(--primary) 50%, transparent 50%); background-repeat: repeat-y; background-size: 2px 15px; background-position: left bottom; animation: border-bounce 1s infinite linear; }
.features-panel:after { content: ""; position: absolute; height: 40%; top: 50%; left: -80px; width: 2px; background-image: linear-gradient(0deg, var(--primary) 50%, transparent 50%); background-repeat: repeat-y; background-size: 2px 15px; background-position: right top; animation: border-bouncedown 1s infinite linear; }

.features { width: 140px; height: 140px; border-radius: 100px; background-color: var(--primary); color: #FFF; font-weight: 600; display: flex; justify-content: center; align-items: center; font-size: 20px; box-shadow: 2px 6px 14px rgba(1,136,110,0.5); }

@keyframes border-dance {
  0% { background-position: left top; }
  100% { background-position: left 15px top; }
}

@keyframes border-bounce {
  0% { background-position: left bottom, right   top; }
  100% { background-position: left bottom 15px , right   top 15px; }
}

@keyframes border-bouncedown {
  0% { background-position: right   top; }
  100% { background-position: right   top 15px; }
}

.vdo-container { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; }
.vdo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }\
.vdo-slide { padding: 20px!important; }

.applications { text-align: left }
.applications h4 { color: var(--primary); font-weight: 600; margin-bottom: 30px; }
.applications ul li { margin-bottom: 10px; }

.stats { background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; color: #FFF; }
.stats:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); }
.stats .container { position: relative; padding-top: 6em; padding-bottom: 6em; }
.stats h2 { color: #FFF; font-weight: 600; margin-bottom: 20px; }

.lime { color: #BEDA33; font-weight: 600; }

.logo { display: flex; justify-content: center; align-items: center; height: 100px; }
.logo img { max-height: 85px; width: auto; max-width: 150px; height: auto; }

#partnerLogos .logo img, .logo.gr img { filter: grayscale(1); opacity: 0.7; }

.watermark { position: absolute; max-width: 50%; }
.watermark.br { bottom: 0; right: 0; z-index: 0; }
.watermark.brx { bottom: -20%; right: 0; z-index: 0; }
.watermark.bg { z-index: -1; }


.procure-process { display: flex; justify-content: center; align-items: center; min-height: 400px; position: relative; width: 240px; margin: 0 auto; }
.procure-process .icon { width: 200px; height: 200px; border: 3px solid var(--primary); display: flex; justify-content: center; align-items: center; margin: 25px auto; border-radius: 150px; }
.procure-process h5 { color: var(--primary); font-weight: 600; }
.procure-process p:last-child { margin-bottom: 0px; }

.process-note { margin-top: 30px; border: 1px solid var(--primary); color: var(--primary); padding: 20px; width: 70%!important; margin: 30px auto; }
.process-note p { margin: 0px; }

.problems { margin-bottom: 5em; background-color: #FFF; border-radius: 10px; padding: 30px; box-shadow: 2px 10px 50px rgba(0,0,0,0.1); }
.problem-card { padding-left: 25px; padding-right: 25px; font-size: 14px; }
.problem-card .icon { background-color: var(--tint); display: flex; justify-content: center; align-items: center; width: 100px; height: 100px; margin: 15px auto; }
.problem-card .icon img { max-width: 75px; }

.btn.btn-clear { position: relative; }
.btn.btn-clear.active { color: var(--primary); }
.btn.btn-clear.active:before { content: ""; position: absolute; bottom: 0px; width: 100%; height: 2px; background-image: linear-gradient(to right, var(--primary), var(--secondary)); left: 0px; }

.cta { color: #FFF; background-image: url(./img/texture-gradient.jpg); background-position: center; background-repeat: repeat-y; padding: 50px; }
.cta h2 { color: #FFF; }
.cta p { color: rgba(255,255,255,0.6); }

.has-overlap { padding-bottom: 16em!important; }
.overlap-buffer { margin-top: -16em; }

.why-us { position: relative; padding: 10px; }
.why-us img { margin-bottom: 30px; }
.why-us h4 { font-weight: 600; color: var(--primary); margin-bottom: 30px; }
.why-us ul, ul.bullets { list-style: none; margin: 0; padding: 0; padding-left: 25px; width: 80%; margin: 0 auto; text-align: left; }
ul.bullets { margin: inherit; }
.why-us ul li, ul.bullets li { position: relative; padding-left: 30px; margin-bottom: 10px; }
.why-us ul li:before, ul.bullets li:before { content: ""; position: absolute; left: 0; top: 5px; width: 14px; height: 14px; border-radius: 14px; background-color: var(--primary); }

ul.social { display: inline-block; list-style: none; margin: 0; padding: 0; }
ul.social li { display: inline; }
ul.social li a { display: inline-block; background-image: linear-gradient(to right, var(--primary), var(--secondary)); border-radius: 3px; text-align: center; font-size: 14px; color: #FFF; padding: 5px 10px; }
ul.social li a:hover { color: var(--gold); }

.nomg { margin: 0px; }

.testi-slide { padding: 15px; min-height: 380px!important; }
.testi { background-color: #FFF; padding: 50px; position: relative; border-radius: 10px; }
.testi .testi-by .pic { border: 2px solid #FFF; width: 72px; height: 72px; position: absolute; bottom: -36px; left: 0; right: 0; margin: 0 auto; z-index: 2; border-radius: 72px; background-size:cover; background-position: center; background-repeat: no-repeat; }
.testi .testi-by .pic:before { content: ""; position: absolute; width: 80px; height: 80px; border-radius: 72px; border: 4px solid var(--primary); left: -6px; top: -6px; }
.testi h4 { font-weight: 600; color: var(--primary); margin-bottom: 0px; font-size: 20px; }

.img-white { filter: brightness(0) invert(1); }

footer { background-color: #171717; color: #929292; position: relative; padding-top: 4em; padding-bottom: 2em; }
footer:before { content: ""; position: absolute; top: 0; left: 0; height: 10px; width: 100%; background-image: linear-gradient(to right, var(--primary), var(--secondary)); }

footer .footer-nav { list-style: none; margin: 0; padding: 0; }
footer a { color: #FFF; }

footer h3 { color: #FFF; font-weight: 600; margin-bottom: 30px; }

footer .input-group { border-bottom: 1px solid #CCC; }
footer .form-control { background-color: transparent; color: #FFF; border: 0px; }
footer .input-group .btn { color: #FFF; }
footer .input-group .btn:hover { color: var(--secondary); }

footer a.nav-link { color: #FFF; }
footer .current-page-item a.nav-link,
footer .current-menu-item a.nav-link { color: var(--main); }

#mainSlider .slick-dots { position: absolute; right: 28px; top: 50%; transform: translateY(-50%); list-style: none; text-align: center; margin: 0px 3px; padding: 5% 0% 5% 0%; height: 100px; display: flex; flex-direction: column; justify-content: space-between; width: 8px; left: auto; }
#mainSlider .slick-dots li button { width: 10px; height: 10px; background-color: rgba(0,0,0,0.1); color: transparent; border: 1px solid #CCC; border-radius: 10px; padding: 0px; margin: 0px; }
#mainSlider .slick-dots li.slick-active button { background-color: var(--primary); border: 1px solid var(--primary); }

.product-card { position: reative; margin-bottom: 80px; clear: both; }
.product-card img { border-radius: 6px; }
.product-card p { margin-bottom: 30px; }
.product-card h2 { font-size: 36px; margin-bottom: 25px; }

p.title { color: var(--primary); font-weight: 600; margin-top: 25px; }

.product-details ul.options { list-style: none; margin: 0; padding: 0; margin-bottom: 30px; }
.product-details ul.options li { display: inline-block; margin-right: 5px; }

.usage-card { min-height: 330px; background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; margin-bottom: 25px; }
.usage-card .info { position: absolute; width: 100%; height: 100%; background-image: linear-gradient(to top, rgba(0,0,0,0.7), transparent); padding: 25px; color: #FFF; display: flex; justify-content: center; align-items: flex-end; }
.usage-card .info h4 { font-weight: 600; }

.blog-posts {  }
.blog-post { background-color: #F7F7F7; padding: 20px; margin-bottom: 30px; }
.blog-post .pic { min-height: 220px; background-size: cover; background-repeat: no-repeat; background-position: center; margin-bottom: 20px; }
.blog-post h3 { font-size: 18px; color:var(--primary); margin-bottom: 20px; }

.contact-details { color: #FFF; position: relative; }
.contact-details h2 { color: #FFF; }
.contact-details .contact-info .btn { float: right; margin-bottom: 10px; }
.contact-details p { margin-bottom: 0px; clear: both; }
.contact-info h4 { font-weight: 600; }

.impact-card { text-align: center; }
.impact-card img { margin-bottom: 25px; }
.impact-card h4 { font-weight: 600; color: var(--primary); margin-bottom: 25px; }
.impact-card p { text-align: left; }

.contact-form { background-color: #F7F7F7; position: relative; padding: 50px; }
.contact-form .form-control { background-color: transparent; border: 0px; border-radius: 0px; padding: 10px; }
.contact-form .form-group { border: 2px solid #DDD; margin-bottom: 20px; }

.team-slide { padding: 30px; }
.team-card .pic-holder { border: 5px solid var(--primary); width: 180px; padding: 5px; border-radius: 180px; height: 180px; }
.team-card .pic-holder .pic { width: 160px; height: 160px; border-radius: 180px; background-size: cover; background-repeat: no-repeat; background-position: center; }
.team-card .team-info { width: 100%; padding: 20px; }
.team-card .team-info h4 { font-weight: 700; color: #333; }
.team-card .team-info h5 { font-size: 18px; font-weight: 600; }

.have-watermark { position: relative; }
.have-watermark:before { background: url(./img/heromark.png); width: 550px; height: 460px; right: 0; content: ""; position: absolute; bottom: -20%; }

.problems ul li img { display: block; margin: 15px auto; max-height: 90px; width: auto; padding: 15px; background-color: var(--tint); max-width: 90px; height: 100px; }
.problems ul { font-size: 14px; }

@media (max-width: 768px) {

  .breathe { padding-top: 5em; padding-bottom: 5em; }
  .low-breathe { padding-top: 3em; padding-bottom: 3em; }
  .clearfix { clear: both; }
  .spacer { height: 5em; clear:both; }
  .low-spacer { height: 3em; clear:both; }

  .buffer { padding: 0em; }
  .navbar-toggler { color: var(--primary); font-size: 24px; }

  h1 { font-size: 38px; }
  h2 { font-size: 32px; }
  h3 { font-size: 24px; }

  .process { margin-bottom: 50px; }
  .process.plus:before { content: ""; position: absolute; left: 0; right: 0; bottom: -40px; margin: 0 auto; width: 40px; height: 40px; z-index: 1; background-image: url(./img/icon-plus.svg); background-size: contain; background-repeat: no-repeat; }
  .process.arrow:before { content: ""; position: absolute; left: 0; right: 0; bottom: -40px; margin: 0 auto; width: 40px; height: 40px; z-index: 1; background-image: url(./img/icon-arrow.svg); background-size: contain; background-repeat: no-repeat; }

  .procure-process.side:before { content: ""; position: absolute; width: 3px; height: 100px; left: 0; bottom: -50px; right: 0; margin: 0 auto; background-image: linear-gradient(0deg, var(--primary) 50%, transparent 50%); background-repeat: repeat-y; background-size: 2px 15px; background-position: right top; animation: border-bouncedown 1s infinite linear; }
  .procure-process.arrow:after { content: ""; position: absolute; left: 0; bottom: -60px; margin: 0 auto; width: 15px; height: 15px; right: 0; transform: rotateZ(90deg); background-image: url(./img/icon-arrow.svg); background-size: contain; background-repeat: no-repeat; }

  .category-btn { margin-bottom: 25px; }

  .inner-banner img, .banner img { margin-bottom: 4em; }

  .img-rounder { margin-bottom: 5em; }
  .product-photos { margin-bottom: 4em; }

  .features-anim { flex-direction: column; align-items: flex-start; justify-content: flex-start; width: 100%; margin-bottom: 25px; }
  .features { display:none; }

  .product-card img { border-radius: 6px; margin-bottom: 50px; }

  .team-card { display: flex; justify-content: space-between; align-items: center; flex-direction: column; margin-bottom: 30px; }
  .team-card .pic-holder { margin: 25px auto; }
  .team-card .team-info { text-align: center; }

  .testi-slide { padding: 15px; min-height: 480px; }

  .impact-card { margin-bottom: 25px; }

  .slick-arrow { left: -10px; right: auto; outline: 0!important; cursor: pointer; }
  .slick-arrow.slick-next { left: auto; right: -20px; }

  .contact-area .contact-details { background-image: url(./img/contactBG.jpg); background-position: center; background-repeat: no-repeat; padding: 30px; }

  .cta { text-align: center; }

  footer { text-align: center; }
  footer .footer-logo { margin-bottom: 25px; }
  footer ul.social { margin-bottom: 20px; }

}

@media (min-width: 769px) {

  .breathe { padding-top: 7em; padding-bottom: 7em; }
  .low-breathe { padding-top: 3em; padding-bottom: 3em; }
  .clearfix { clear: both; }
  .spacer { height: 7em; clear:both; }
  .low-spacer { height: 4em; clear:both; }

  .menu-main-menu-container { margin-left: auto; }

  .row-flex { display: flex; flex-wrap: wrap; }
  .vcenter { display: flex; justify-content: flex-start; align-items: center;  -webkit-transition: all 500ms; -moz-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; }
  .hvcenter { display: flex; justify-content: center; align-items: center;  -webkit-transition: all 500ms; -moz-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; }
  .rvcenter { display: flex; justify-content: flex-end; align-items: center;  -webkit-transition: all 500ms; -moz-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; }
  .vcenter p { padding-right: 100px; }

  h1 { font-weight: 700; color: #444446; font-size: 44px; }
  h2 { font-weight: 700; color: var(--primary); font-size: 40px; }
  h3 { font-weight: 700; color: var(--primary); font-size: 32px; }

  .process.plus:before { content: ""; position: absolute; top: 0; bottom: 0; margin: auto 0; width: 40px; height: 40px; z-index: 1; right: -40px; background-image: url(./img/icon-plus.svg); background-size: contain; background-repeat: no-repeat; }
  .process.arrow:before { content: ""; position: absolute; top: 0; bottom: 20px; margin: auto 0; width: 40px; height: 40px; z-index: 1; right: -30px; background-image: url(./img/icon-arrow.svg); background-size: contain; background-repeat: no-repeat; }

  .procure-process.side:before { content: ""; position: absolute; width: 130px; height: 3px; top: 0; bottom: 0; right: -150px; margin: auto 0; background-image: linear-gradient(90deg, var(--primary) 50%, transparent 50%); background-repeat: repeat-x; background-size: 15px 3px; background-position: left top, right top; animation: border-dance 1s infinite linear; }
  .procure-process.arrow:after { content: ""; position: absolute; top: 0; bottom: 0; margin: auto 0; width: 15px; height: 15px; right: -160px; background-image: url(./img/icon-arrow.svg); background-size: contain; background-repeat: no-repeat; }

  .product-card .product-info { padding: 0px 50px; }
  .impact-card { text-align: center; padding-left: 30px; padding-right: 30px; }
  .impact-card img { max-height: 100px; width: auto; margin: 15px auto; }

  footer .footer-nav li { width: 50%; float: left; }

  .team-card { display: flex; justify-content: space-between; align-items: center; flex-direction: row; margin-bottom: 30px; }

  .buffer { padding: 3em; }
  .slick-arrow { left: -40px; right: auto; outline: 0!important; cursor: pointer; }
  .slick-arrow.slick-next { left: auto; right: -40px; }

  .problems ul { list-style: none; margin: 0; padding: 0; display: flex; justify-content: space-between; flex-wrap: wrap; }
  .problems ul li { flex: 1 0 0%; padding: 15px 25px; }

  .contact-area { position: relative; padding: 40px; }
  .contact-area:before { content: ""; position: absolute; left: 0; top: 0; background-image: url(./img/contactBG.jpg); background-position: center; background-repeat: no-repeat; height: 100%; width: 50%; }

}

.row .elementor-widget-container { display: flex; flex-shrink: 0; max-width: 100%; }
.impactstat h2 { font-size: 32px; }

.popup-overlay { background-color: rgba(0,0,0,0.8); position: fixed; display: none; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 5011; justify-content: center; align-items: center; }
.popup-overlay .closer { display: block; position: fixed; top: 40px; right: 40px; z-index: 5012; color: #FFF; }
.popup-content { /*background-color: #FFF; padding: 20px;*/ border-radius: 20px; width: 100%; max-width: 800px; /*box-shadow: 5px 5px 25px rgb(0 0 0 / 50%);*/ }
.popup-content .form-group { margin-bottom: 15px; }
.popup-overlay.show { display: flex; }

.popup-content .contactForm { box-shadow: 5px 5px 25px rgb(0 0 0 / 50%); padding: 3em; background-color: #FFF; }
.popup-content .contactForm .form-control,
.popup-content .contactForm .input-group-text,
.popup-content .contactForm select { border: 1px solid #CCC; border-radius: 0px; resize: none; }

.popup-overlay .input-group-text { background-color: transparent; width: 50px; text-align: center; }
.popup-content .input-group-text img { margin: 0 auto; max-width: 24px; filter: grayscale(1) opacity(0.5); }

.popup.overlay .form-control:focus, .popup.overlay .form-control:active { border: 1px solid var(--primary); }

@media (min-width: 1200px) {
  .elementor-section.elementor-section-boxed > .elementor-container {
      max-width: 1140px!important;
  }
}

@media (min-width: 1400px) {
  .elementor-section.elementor-section-boxed > .elementor-container {
      max-width: 1320px!important;
  }
}

.contact-form .input-group-prepand { width: 50px; background-color: var(--main); color: #FFF; display: flex; justify-content: center; align-items: center; }

#testiSlider .slick-arrow { left: 0px; right: auto; outline: 0!important; }
#testiSlider .slick-arrow.slick-next { left: auto; right: 0px; }
#testiSlider .slick-arrow { position: absolute; top: 50%; z-index: 5; transform: translateY(-50%); font-size: 30px; color: #FFF; width: 40px; height: 40px; background-color: var(--crimson); display: flex; justify-content: center; align-items: center; border-radius: 5px; }

.slick-arrow { position: absolute; top: 50%; z-index: 5; transform: translateY(-50%); font-size: 30px; color: #FFF; width: 20px; height: 35px; background-color: var(--crimson); display: flex; justify-content: center; align-items: center; border-radius: 5px; }

.freeze { position: fixed; top: 58px; left: 0; right: 0; margin: 0 auto; z-index: 5; }

.stickey { position: -webkit-sticky; position: -moz-sticky; position: -ms-sticky; position: -o-sticky; position: sticky; top: 0px; z-index: 5; }

ul.slick-dots { width: 100%; list-style: none; margin: 0; padding: 0; text-align: center; }
ul.slick-dots li { display: inline; }
ul.slick-dots li button { width: 10px; height: 10px; content-visibility: auto; margin-right: 5px; border-radius: 15px; border: 0px; padding: 0px; background-color: #CCC; color: #CCC; outline: none!important; }
ul.slick-dots li.slick-active button { background-color: var(--primary); color: var(--primary); }