:root {

--color-blue-main: #00A0D6;
--color-blue-hover: #0070A4;
--color-green-main: #72AB34;
--color-green-hover: #64982D;
--color-red: #DE6655;
--color-grey-light: #f8f8f8;

--color-biruz:#5EC5B9;
--color-azure:#3fc1d0;
--color-marine:#039be5;


--gradient-blue: linear-gradient(rgba(8, 205, 185, 0.9), rgba(11, 170, 235, 0.9));
--gradient-blue-shield: linear-gradient(360deg, #2196F3, #188BB8);
--gradient-main-header: linear-gradient(261deg, #fff 0%, #529DCB 100%);
}



html {
font-size: clamp(0.97rem, 0.1vw + 0.97rem, 1.125rem); /* from 15 to 18 px */
scroll-padding-top: 70px; 
}

body { 
  margin: 0;
  padding: 0;
  background-color:#fff;
  color: #333;
  line-height: 1.7;
}

ol{margin:0;}

@media (max-width: 575.98px) {
  ul {
    padding-left: 0.5rem;
  }
}


article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
	display: block;
}

/* Headers */

h1{font-size: clamp(1.5rem, 1.2rem + 2vw, 1.8rem); margin-bottom: clamp(1rem, 0.75rem + 2vw, 2rem); line-height:1.5;}


h2 {
  font-size: clamp(1.3rem, 1.3rem + 1.2vw, 1.7rem); margin-bottom: clamp(1rem, 0.75rem + 1.5vw, 1.875rem); line-height: 1.5;}

h3 {
  font-size: clamp(1.22rem, 1.1rem + 1.1vw, 1.55rem); margin-bottom: clamp(1rem, 0.75rem + 1.5vw, 1.875rem); line-height: 1.5;}


h4, h5 {
  font-size: clamp(1.1rem, 1.1rem + 0.25vw, 1.2rem); margin-bottom: clamp(1rem, 0.75rem + 1.5vw, 1.875rem);  line-height: 1.5; }



/* Links */

a {
  color: var(--color-blue-main);
  text-decoration: none;
  transition: color .15s, text-decoration .15s;
}
a:hover, a:focus, a:active {
  color: var(--color-blue-main);
  text-decoration: underline;
}

a.color-f, a.color-f:visited, a.color-f:hover, a.color-f:focus, a.color-f:active {
  color: #fff !important;
}


a.color-black, a.color-black:visited, a.color-black:hover, a.color-black:focus, a.color-black:active {
  color: #000 !important;
}

a.color444:hover, a.color444:focus, a.color444:active, a.color444:visited {color:#333 !important;}


a.no-underline:hover, a.no-underline:focus, a.no-underline:active, a.no-underline:visited{
	text-decoration: none;
}


/* Paragraphs */


.p0{
	margin:0;
}

.clear {
	clear: both;
}


/* Footer */

#footer {
	clear: both;
	background: url(images/footer-texture.png) repeat left top;
	background-color:var(--color-grey-light);
	font-size:0.95rem;
}

#footer a{
	color: #333;
}

#footer p{
	margin:6px 0;
	text-align:left;
}

#footer h3{
	margin-bottom:0.95rem;
	font-size: clamp(1.2rem, 1.2rem + 0.18vw, 1.375rem);
}

#footer h5{
	font-size: clamp(16px, 16px + 0.375vw, 18px); 
	color:#777;
}


/* Pricing */


#pricing2 .nav-pills{
	background-color: var(--color-grey-light);
	border-radius: 1.5rem;
	display: inline-flex;
	vertical-align: middle;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

#pricing2 .nav-link{color:#333; border-radius: 1.5rem;}

#pricing2 .nav-link.active{background-color: var(--color-blue-main); color: #fff; border-radius: 1.5rem; text-decoration:none;}

@media (max-width: 767.98px) {
  #pricing2 .dropdown-toggle {
    border-radius: 1.5rem;
    background-color: var(--color-grey-light);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    padding: 12px 20px;
    text-align: left;
  }
  #pricing2 .dropdown-menu {
    border-radius: 1.25rem;
  }
}

.currency-box{background-color: var(--color-grey-light); color:#333; border-radius: 1.5rem; padding: 8px 16px; min-width: 180px; position: relative;  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);}


#pricing2 .dropdown-menu .dropdown-item.active, #pricing2 .dropdown-menu .dropdown-item:active, #pricing2 .dropdown-menu .dropdown-item:focus, #currencyDropdownMenu .dropdown-item.active, #currencyDropdownMenu .dropdown-item:active, #currencyDropdownMenu .dropdown-item:focus {
    background-color: var(--color-blue-main) !important; 
    color: #fff !important;
    border-radius: 0.5rem; 
}

@media (max-width: 768px) {
    #pricing2 > #busness .nav-pills {
        display: block;
        text-align: center;
    }
}

.pricing-card, .product-card {
	background: #fff;
	border-radius: 12px;
	box-shadow:
	0 0 0 1px rgba(0,0,0,.06),
	0 2px 6px rgba(0,0,0,.08),
	0 10px 24px rgba(0,0,0,.18);
	transition: box-shadow .2s ease, transform .2s ease;
}


.product-card {
  padding: 0.7rem 1.2rem;
}

.product-card h3 a {
  display:inline-block;
  max-width:100%;
  font-size:clamp(1.2rem, 2.4vw + 1.2rem, 1.3rem);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.pricing-card:hover, .pricing-card:focus-within, .product-card:hover, .product-card:focus-within {
	transform: translateY(-4px);
	box-shadow:
	0 0 0 1px rgba(0,0,0,.08),
	0 10px 26px rgba(0,0,0,.22),
	0 40px 80px -16px rgba(0,0,0,.28);
}


@media (max-width: 576px) {
.pricing-back {
    background-image: none !important;
    background-color: #3A4A5C !important;
}

.pricing-card {
box-shadow:
  0 0 0 1px rgba(255,255,255,.18),
  0 6px 18px rgba(0,0,0,.22),
  0 28px 60px -12px rgba(0,0,0,.28);
}

.pricing-card:hover, .pricing-card:focus-within {
box-shadow:
  0 0 0 1px rgba(0,0,0,.08),
  0 8px 20px rgba(0,0,0,.18),
  0 20px 40px -12px rgba(0,0,0,.22);
}
}


/*Images*/

.business-solution-image {
	background: linear-gradient(rgba(105, 92, 109, 0.5), rgba(105, 92, 109, 0.5)), url(images/man-business-solutions.webp);
}

.home-solution-image {
	background: linear-gradient(rgba(105, 92, 109, 0.5), rgba(105, 92, 109, 0.5)), url(images/family-home-solutions.webp);
}

.man-computer-hsa{background: linear-gradient(rgba(105, 92, 109, 0.5), rgba(105, 92, 109, 0.5)), url(images/man-computer-hsa.webp);}

.parental-background{background: linear-gradient(rgba(105, 92, 109, 0.5), rgba(105, 92, 109, 0.5)), url(images/parental-pricing-back.webp);}

.httv-pricing-back{background: linear-gradient(rgba(105, 92, 109, 0.5), rgba(105, 92, 109, 0.5)), url(images/httv-pricing-banner.webp);}

.hem-pricing-back{background: linear-gradient(rgba(105, 92, 109, 0.5), rgba(105, 92, 109, 0.5)), url(images/hem-pricing-back.webp);}


/*Blocks*/

.steps {
	border-radius: 5px;
	border:1px solid #bce8f1;
	background-color: #d9edf7;
	padding: 0.9rem 0.9rem;
	margin: clamp(1.8rem, 1.5rem + 0.60vw, 2.1875rem)  clamp(0.5rem, 0.5rem + 0.30vw, 1.25rem); 
	color:#222;
	line-height:1.6;
}

.steps li {padding:0.32rem 0;}

@media (max-width: 575.98px) {
	.steps ol, .steps ul {padding-left: 1.2rem;}
	.steps {margin-left: 0; margin-right: 0; }
}

main.container{
	padding-bottom:30px;
}

.bottom-links{padding:clamp(1.5625rem, 1.25rem + 0.35vw, 1.875rem) 0;}

.bottom-links a{
	font-size:clamp(1.1rem, 1.1rem + 0.08vw, 1.2rem);
	color:#333;
}

.bottom-links a:hover{
	text-decoration: none;
	transform: scale(1.2);
	 text-shadow: 0 0 2px #fff;
}

.bottom-links a:hover, .bottom-links a:active, .bottom-links a:focus, .bottom-links a:visited{text-decoration: none;}

.bottom-links a:hover span{
	color:var(--color-blue-main);
	background: #f9f9f9;
	transform: scale(1.2);
}

.bottom-links a span{
display: flex;
align-items: center;
justify-content: center; 
	height:clamp(3.644rem, 3.644rem + 0.80vw, 4.375rem);
	width:clamp(3.644rem, 3.644rem + 0.80vw, 4.375rem);
	color:#333;
	border-radius:50%;
	text-align: center;
	vertical-align: middle;
	background-color:var(--color-grey-light);
	border:1px solid #ddd;
	margin:10px auto;
}


.bottom-menu{
	margin:40px 15px;
}

.bottom-menu a{
	display:inline-block;
	padding:5px 8px; 
	margin:5px;
	border-radius:8px; 
	border:2px solid #333;
	color:#333;
}

.bottom-menu a:hover{
	background:#D8D8D8;
	position:relative;
	text-decoration:none;
}

.round-big {
	width: clamp(40px, 18vw, 80px);
	height: clamp(40px, 18vw, 80px);
	border-radius: 50%;
	font-size: clamp(18px, 7vw, 42px);
	font-weight: bold;
	 border-width: 3px;
	border-style: solid;
	border-color: inherit;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	margin:15px;
}

.number-badge {
  align-items: center;
  background: var(--color-blue-main);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  height: 2rem;
  width: 2rem;
	color:#fff;
}

.help-category{
	display:block;
	background: #eee;
	padding: 25px 20px;
	margin-bottom: 20px;
	text-align: center;
	color:#333;
}

.help-category:hover, .help-category:focus, .help-category:active{
	text-decoration: none;
	background: #f9f9f9;
	transform: scale(1.05);
}


.article-sidebar a {
	display: block;
	padding: 8px 12px;
	border-radius: 8px;
	color: #333;
	text-decoration: none;
	transition: background-color 0.3s;
}

.article-sidebar a:hover {
	background-color: #F8F8F8;
}

.article-sidebar a.active {
background-color: #e0e0e0;
color: #000;
}

section[id] {
  scroll-margin-top: 40px;
}


/*Boxes*/

.border-box{box-sizing:border-box;}

.content-box{box-sizing:content-box;}

.box-feature{
	background-color:var(--color-grey-light); 
	border-radius: 5px;
	box-shadow: 0px 2px 2px #D3D3D3;
	padding: clamp(0.8rem, 0.8rem + 0.25vw, 0.9375rem) clamp(1.3rem, 1.3rem + 0.35vw, 1.5625rem); 
	position:relative;
	color:#222;
}

.link-box{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px;
	cursor: pointer;
	border-radius: 20px;
	background-color:rgba(42,171,203,0.15);
	color:#333;
	font-weight:500;
	height: 100%;
}

.link-box:hover, .link-box:active, .link-box:visited{background-color:rgba(35,140,166,0.15); text-decoration:none; color:#333; transform: scale(1.04);}

.row-flex [class*="col-"] {
 margin-bottom: 30px;
}

.row-flex .box-feature{ height: 100%; margin:0;}

.box-faq{
	display: block;
	background-color: var(--color-grey-light);
	padding: 10px  clamp(1rem, 1rem + 0.60vw, 3.125rem);
	margin-top:0;
	margin-bottom: 2px;
}

.box-faq > a:hover, .box-faq > a:active, .box-faq > a:focus{text-decoration:none; font-weight:500; }


.heading_highlighter{
	display: block;
	height: 1px;
	width: 100%;
	background-color: var(--color-blue-main);
	margin-top:5px;
}



/*Fonts Styles*/

.bold{font-weight:bold;}

.font-w600{font-weight:600;}

.ital {font-style:italic;}

.normal{font-weight:400;}

.semi-bold{font-weight:500;}


/*Lines*/


.line2{
	clear:both; border-top:1px solid #eee; margin: clamp(1.25rem, 1.25rem + 1vw, 3rem) 0 clamp(1.5rem, 1.5rem + 1.5vw, 3.5rem) 0;
}


/*Slider Main*/

.parental-banner-clip, .hem-banner-clip, .hsa-banner-clip, .fb-banner-clip, .parental-banner-clip-less, .shield-banner-clip {
	background: linear-gradient(rgba(8, 205, 185, 0.9), rgba(11, 170, 235, 0.9));
	min-height: 600px;
	-webkit-clip-path: polygon(0 0, 52% 0, 47% 100%, 0 100%);
   clip-path: polygon(0 0, 52% 0, 47% 100%, 0 100%);
	}

	.parental-banner-clip-less{
	-webkit-clip-path: polygon(0 0, 48% 0, 43% 100%, 0 100%);
   clip-path: polygon(0 0, 48% 0, 43% 100%, 0 100%);
	}

.hsa-banner-clip{background: linear-gradient(rgba(11, 170, 235, 0.8), rgba(2, 191, 166, 0.8));}

.hem-banner-clip{background: linear-gradient(rgba(0, 131, 176, 0.8), rgba(0, 180, 219, 0.8));}

.fb-banner-clip{background: linear-gradient(rgba(0, 191, 166, 0.8), rgba(0, 191, 166, 0.8));}

.shield-banner-clip{background: linear-gradient(rgba(0, 151, 201, 0.8), rgba(0, 180, 219, 0.8));}




@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.parental-banner-clip, .hem-banner-clip, .hsa-banner-clip, .fb-banner-clip, .parental-banner-clip-less, .shield-banner-clip{
		background-size:53% 100%; background-repeat:no-repeat;
	}
}

@media (max-width: 1240px){.parental-banner-clip, .hem-banner-clip, .hsa-banner-clip, .fb-banner-clip, .parental-banner-clip-less, .shield-banner-clip {clip-path:none; -webkit-clip-path:none; background-size:100% 100%;}}

@media (min-width: 768px) {
    .back-hem7{
        background-image: url('images/back-hem7.webp');
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }
}

/*Buttons*/


.button-css, 
.button-css-green,
.btn-my,
.btn-my-big,
.btn-my-blue,
.btn-my-green,
.btn-green,
.btn-blue,
.btn-blue-trans,
.btn-trans-white,
.btn-white,
.learn-more,
.help-button {
	display: inline-block;
	color: #fff;
	border-radius: 8px;
	cursor: pointer;
	font-size: clamp(1rem, 1rem + 0.30vw, 1.2rem);
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	transition: transform .14s, box-shadow .14s;
	border: none;
	outline: none;
	 margin: clamp(0.5rem, 0.5rem + 0.25vw, 0.625rem) clamp(0.4rem, 0.4rem + 0.35vw, 0.9375rem); 
	padding: clamp(0.781rem, 0.781rem + 0.30vw, 0.9375rem) clamp(1rem, 1rem + 0.40vw, 1.25rem);
  /* ── min-width: 150 px → 180 px ── */
	min-width: clamp(9.375rem, 9.375rem + 2.5vw, 11.25rem);
	line-height: 1;
}


.button-css, .btn-my-blue, .btn-blue {
	background: var(--color-blue-main);
}
.button-css-green, .btn-my-green, .btn-green {
	background: var(--color-green-main);
}
.btn-blue-trans, .learn-more {
	background: transparent;
	color: var(--color-blue-main);
	border: 2px solid var(--color-blue-main);
}

.btn-trans-white {
	background: transparent;
	color: #fff;
	border: 2px solid #fff;
}

.btn-trans-white:hover, .btn-trans-white:focus, .btn-trans-white:active{color: #fff; transform: scale(1.04); text-decoration: none; box-shadow: 0 0 0 4px rgba(255, 255, 255, .3);}

.btn-white {color:#0097C1; background: #fff; border: 2px solid #fff; box-shadow: 0 0 0 4px rgba(255,255,255,.3);}
.btn-white:hover, .btn-white:focus, .btn-white:active{color: #0097C1; transform: scale(1.04); text-decoration: none; box-shadow: 0 0 0 4px rgba(255,255,255,.2);}

/* Hover/active */
.button-css:hover, .button-css:focus, .button-css:active,
.btn-my:hover, .btn-my:focus, .btn-my:active,
.btn-my-blue:hover, .btn-my-blue:focus, .btn-my-blue:active,
.btn-blue:hover, .btn-blue:focus, .btn-blue:active
{
	background: var(--color-blue-hover);
	box-shadow: 0 0 0 4px rgba(65,165,193,0.5);
	transform: scale(1.04);
	filter: brightness(0.96);
	color: #FFF;
	text-decoration: none;
}

.button-css-green:hover, .button-css-green:focus, .button-css-green:active,
.btn-my-green:hover, .btn-my-green:focus, .btn-my-green:active,
.btn-green:hover, .btn-green:focus, .btn-green:active,
.help-button:hover, .help-button:focus,.help-button:active{
	background: var(--color-green-hover);
	box-shadow: 0 0 0 4px rgba(165,219,108,0.7);
	transform: scale(1.04);
	filter: brightness(0.96);
	text-decoration: none;
	color: #FFF;
}

.btn-blue-trans:hover, .btn-blue-trans:active, .btn-blue-trans:focus,
.learn-more:hover, .learn-more:active, .learn-more:focus{
	color: var(--color-blue-main); 
	box-shadow: 0 0 0 4px rgba(65,165,193,0.5);
	text-decoration: none;
	transform: scale(1.04);
}

.btn-my-big {
	font-size: clamp(1.2rem, 1.2rem + 0.18vw, 1.375rem);
	min-width: clamp(16rem, 12rem + 5vw, 20rem);
	padding: clamp(1.093rem, 1.093rem + 0.20vw, 1.3125rem) clamp(0.26rem, 0.26rem + 0.10vw, 0.3125rem);
}
 
.help-button{
	background:var(--color-green-main);
	color:#fff;
	font-weight:700;
	border-radius:999px;
	vertical-align: middle;
	padding:13px 25px;
	position: fixed;
	right: 25px;
	bottom: 20px;
	z-index: 1000;
	white-space: nowrap;
	letter-spacing: 1px;
	min-width: 0 !important;
}

.btn-block {
	width: 100%;
	margin-left: 0;
	margin-right:0;
}

/*Headers*/

.blue-header{
	background: linear-gradient(261deg, #fff 0%, #529DCB 100%);
	padding:3px 10px;
	color:#fff;
	text-shadow:1px 1px 1px #156391;
	margin:20px 0;
	font-size:clamp(1.25rem, 1.25rem + 0.18vw, 1.375rem);
}

.blue-header a{text-decoration:none; color:#fff;}

.header-dark-gray{background-color: #666; border-radius:5px; font-size:1.2em;}

.one-line {
	display: flex;
	align-items: baseline;
	white-space: nowrap;}


	@media (max-width: 575.98px) {
	.one-line {
	white-space: normal;
	flex-wrap:wrap
}
}
.one-line-center {
	display: flex;
	align-items: center;
}


/*Text Aligns*/

.cntr{text-align: center;}

.t-right{text-align:right;}

.t-left{text-align:left;}

.v-middle{vertical-align: middle !important}

@media (max-width: 575.98px) {
  .text-mobile-center {
    text-align: center !important;
  }
}

/*Aligns*/

.vertical-align {
  display: flex;
  align-items: center;
}


/*Asides*/

.quot {margin-bottom:0px;}

.quot:before{
	content: url('images/quot.png'); 
	padding-right:5px;
}


/*Line Heights*/

.line-h12{line-height:1.2;}

.line-h15{line-height:1.5;}

.line-h18{line-height:1.8;}

.line-h2{line-height:2;}

.line-h26{line-height:2.6;}

/*Heights*/


.row-equal .height-equal{ height: 100%; margin:0;}

.force-to-bottom {
  position:absolute;
  bottom: 5%;
}

/*Lists-images*/


.check1{list-style-image:url('images/check.png');}

.list-style-none{list-style-type:none;}

.list-space-li18 li{margin-bottom:18px;}

.feature-list li{
	display: flex;
	align-items: center;
	font-size:clamp(1.1rem, 1.1rem + 0.08vw, 1.2rem);
	font-weight:600;
	margin:12px 0;
	padding:10px 0px 10px 15px;
	border:1px solid #e3e5e9;
	box-sizing: border-box;
	color: #475056;
	border-radius: 0.9rem;
	background-color:#fff;
}

.feature-list li a{
	display: flex;
	align-items: center;
	color: #475056;
}

.feature-list li a:hover{color:var(--color-blue-main); text-decoration:none;}

.feature-list li:hover{box-shadow: 0 0 0.75rem rgb(0 0 0 / 12%);}



/*Opasity*/

.opacity8{opacity:0.8;}


/*Overlays*/


.overlay {
  position: relative;
}
.overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgb(var(--overlay-color, 0 0 0) / var(--overlay-alpha, .4));
  pointer-events: none;
  z-index: 1;
}
.overlay > * {
  position: relative;
  z-index: 2;
}


.overlay-10 { --overlay-alpha: .10; }
.overlay-20 { --overlay-alpha: .20; }
.overlay-30 { --overlay-alpha: .30; }
.overlay-40 { --overlay-alpha: .40; } 
.overlay-50 { --overlay-alpha: .50; }
.overlay-60 { --overlay-alpha: .60; }
.overlay-70 { --overlay-alpha: .70; }
.overlay-80 { --overlay-alpha: .80; }
.overlay-90 { --overlay-alpha: .90; }


.overlay-black  { --overlay-color: 0 0 0; } 
.overlay-white  { --overlay-color: 255 255 255; } 
.overlay-blue{ --overlay-color: 13 110 253; }

.oa-10 { --overlay-alpha: .10; }
.oa-20 { --overlay-alpha: .20; }
.oa-30 { --overlay-alpha: .30; }
.oa-40 { --overlay-alpha: .40; } 
.oa-50 { --overlay-alpha: .50; }
.oa-60 { --overlay-alpha: .60; }
.oa-70 { --overlay-alpha: .70; }
.oa-80 { --overlay-alpha: .80; }
.oa-90 { --overlay-alpha: .90; }


/*Background-colors*/

.back-cover{background-position: center; background-size: cover;}

.back-col-f-trans{background-color: rgba(255,255,255,0.92);}
.back-col-l-blue{background-color:#F6F9FC;}

.back-col-dark{ background: linear-gradient(180deg,#333c43,#262c30);}

.back-col-biruz { background-color: var(--color-biruz); }
.back-col-azure { background-color: var(--color-azure); }
.back-col-marine { background-color: var(--color-marine); }

a.back-col-biruz:hover,a.back-col-biruz:active, a.back-col-biruz:focus {background-color: #49988F; font-weight:600;}

a.back-col-azure:hover, a.back-col-azure:active, a.back-col-azure:focus {background-color: #008F9F; font-weight:600;}

a.back-col-marine:hover, a.back-col-marine:active, a.back-col-marine:focus {background-color: #0284C5; font-weight:600;}

a.back-navy-blue:hover, a.back-navy-blue:active, a.back-navy-blue:focus {background-color: #204d74; font-weight:600;}



.back-col-dark-grey { background-color: #EBEBEE; }
.back-col-l-grey { background-color: var(--color-grey-light); }

.back-col-f { background-color: #fff; }
.back-navy-blue { background-color: var(--color-blue-main); }
.back-green-blue-gradient { background: var(--gradient-blue); }
.back-blue-blue-shield-grad { background: var(--gradient-blue-shield); }
.back-blue-blue-grad{background-color: #0097C9; background: linear-gradient(rgba(0, 151, 201, 0.9), rgba(0, 180, 219, 0.9));}


/*Texts colors*/

.text-shadow-grey{text-shadow:#000 0 0 2px;}

.color-black{color:#000;}

.color99{color:#999;}

.color-f{color:#fff;}

.color-fe{color:#fefefe;}

.color444{color:#333;}

.color-a{color: var(--color-blue-main);}

.color-green{color:#24B47E;}

.color-blue{color:var(--color-blue-main);} a.color-blue:hover, a.color-blue:active, a.color-blue:focus, a.color-blue:visited{color:var(--color-blue-main);} 

button.color-blue:hover, button.color-blue:active, button.color-blue:focus, button.color-blue:visited{color: var(--color-blue-main);} 

.color-blue, .color-blue-basic, .color-navy-blue { color: var(--color-blue-main); }
.color-azure { color: var(--color-azure); }
.color-biruz { color: var(--color-biruz); }
.color-marine { color: var(--color-marine); }

.red {
	color: var(--color-red); font-weight: 700;
}
.color-red2 { color: var(--color-red); }

/*Texts Decorations*/

.line-through {
  position: relative;
  display: inline-block;
  font-size: 18px;
  color: #777; 
}

.line-through:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  border-top: 1px solid #777;
  transform: rotate(-12deg);
  transform-origin: center;
}

.underline{text-decoration:underline;}


/*Navbars*/

/*Main Navbar*/

#main-navbar{
	background-color: #fff;
	padding:0;
	margin-bottom:40px;
}

#main-navbar .nav-link, #product-navbar .nav-link {
	line-height:60px;
	color:#333;
	font-weight:400;
	padding: 5px 30px; 
	font-size:16px;
	text-decoration: none;
	box-sizing:border-box;
	border-bottom: 5px solid transparent;
	border-top: 5px solid transparent;
	}


#product-navbar .nav-link:hover, #product-navbar .nav-link:focus, #product-navbar .nav-link:active {
	border-bottom: 5px solid var(--color-grey-light); color:#222; font-weight:600;}

#product-navbar .nav-link {line-height:50px; color:#333;}

#main-navbar .dropdown-menu {z-index:2000;}

#main-navbar .dropdown-item {line-height: 1.7;}

#main-navbar .dropdown-item:hover,
#main-navbar .dropdown-item:focus,
#main-navbar .dropdown-item:active,
#main-navbar .dropdown-item:focus-visible {
  background-color: #D9EDF7;
  color: #333;
  text-decoration: none;
}

#main-navbar .nav-link:hover, #main-navbar .nav-link:focus, #main-navbar .nav-link:active {
	border-bottom: 5px solid var(--color-blue-main); color:#222; font-weight:600;}

#main-navbar .login-button{
	margin-top:15px;
	line-height:1.7;
	background-color:var(--color-blue-main);
	color:#fff;
	font-weight:700;
	border-radius:999px;
	vertical-align: middle;
	white-space: nowrap;
	letter-spacing: 1px;
}

#main-navbar .login-button:hover, .login-button:focus, .login-button:active{
	color: #FFF;
	background:var(--color-blue-hover);
	border-bottom: 5px solid transparent;
}

#main-navbar .login-button.show {color: #FFF; border-bottom: 5px solid transparent;}


@media (max-width: 575.98px){
#main-navbar .nav-link, #product-navbar .nav-link{
	line-height: 1.4; 
	font-size: 15px;
	padding: 12px 20px;
	margin-bottom:10px;
	border:0;}
#main-navbar .nav-link:hover, #main-navbar .nav-link:focus, #main-navbar .nav-link:active{
	border-bottom: none;
	background-color: #D9EDF7;}
  #main-navbar .login-button{
	margin-top:0;
	background-color:inherit;
	color:#333;
	border-radius:0px;
	white-space: nowrap;
	letter-spacing: 1px;}
	#main-navbar .login-button.show {color: #333; border-bottom: none;}
}


/*Product Navbar*/

#product-navbar {
	box-sizing:border-box;
	margin-top:-40px;
	padding:0;
	box-shadow: 0 0 3px rgb(60 72 88 / 20%);
	margin-bottom:40px;
	color:#333;
	background-color:var(--color-grey-light);
	}

.navbar-brand
{color:#333; font-weight:400; font-size:20px; }

#product-navbar .btn-blue, #product-navbar .btn-blue-trans {margin-top:-10px; margin-bottom:-10px; }

/*Bootstrap correction*/

@media (max-width: 576px) {
  .container, .container-fluid {
    padding-left: 1.3rem;
    padding-right: 1.3rem;
  }
}


@media (max-width: 767px) {
 .col-xs-12, .col-md-12 {
  margin-bottom: 15px;
 }
}

.badge{white-space: normal;}

button:disabled {background:#A0A6AB;}

button:disabled:hover {background:#A0A6AB; box-shadow:0 0 0 0;}

.row-flex {
 display: flex;
 flex-wrap: wrap;
}

.label{white-space: pre-wrap;}


.bd-callout {
  padding: 1.25rem;
  margin-top: 1.4rem;
  margin-bottom: 1.4rem;
  border: 1px solid #e9ecef;
  border-left-width: 0.25rem;
  border-radius: 0.25rem;
}

.bd-callout-info { border-left-color: #5bc0de;}

.bd-callout-yellow {  border-left-color: #F0AD4E;}

.bd-callout-warning {border-left-color: #f0ad4e;}

.how-to-use-hem-accordion > .accordion-item > h2 > button.accordion-button{color:#555; background-color:#f8f8f8; margin-bottom:6px; font-weight:500; font-size:clamp(1.06rem, 1.06rem + 0.08vw, 1.2rem); padding: 1rem 1.25rem;} 

.accordion-body{padding: 1rem 1.25rem;}

.how-to-use-hem-accordion > .accordion-item > h2 > button.accordion-button:hover,
.how-to-use-hem-accordion > .accordion-item > h2 > button.accordion-button:focus,
.how-to-use-hem-accordion > .accordion-item > h2 > button.accordion-button:active{background-color:#E2E2E2;} 

.how-to-use-hem-accordion > .accordion-item{border:none;}

.how-to-use-hem-accordion .accordion-button:focus {box-shadow: 0 0 0.25rem var(--color-grey-light);}

.how-to-use-hem-accordion > .accordion-item > h3 > button.accordion-button{color:#555; background-color:#f8f8f8; margin-bottom:6px; font-weight:500; font-size:clamp(1.06rem, 1.06rem + 0.08vw, 1.2rem); padding: 1rem 1.25rem;} 

.how-to-use-hem-accordion > .accordion-item > h3 > button.accordion-button:hover,
.how-to-use-hem-accordion > .accordion-item > h3 > button.accordion-button:focus,
.how-to-use-hem-accordion > .accordion-item > h3 > button.accordion-button:active{background-color:#E2E2E2;} 

@media (max-width: 575.98px) {
  .accordion-body {
    padding-left: 0;
    padding-right: 0;
  }
}

#carousel-screenshots .carousel-item img, 
#carousel-screenshots2 .carousel-item img, 
#carousel-screenshots3 .carousel-item img {
  width: 100%;
  max-width: calc(100vw - 2 * var(--bs-gutter-x, 12px));
  object-fit: contain;
  margin: 0 auto;
  box-sizing: border-box;
}

/* XS:  */
@media (max-width: 575.98px) {
  #carousel-screenshots .carousel-item,  #carousel-screenshots2 .carousel-item, #carousel-screenshots3 .carousel-item {
    height: 33dvh;}}

/* SM (≥576)*/
@media (min-width: 576px) and (max-width: 767.98px) {
  #carousel-screenshots .carousel-item, #carousel-screenshots2 .carousel-item, #carousel-screenshots3 .carousel-item {
    height: 45vh;}}

/* MD (≥768)*/
@media (min-width: 768px) and (max-width: 991.98px) {
  #carousel-screenshots .carousel-item, #carousel-screenshots2 .carousel-item, #carousel-screenshots3 .carousel-item {
    height: min(55vh, calc((100vw - 2 * var(--bs-gutter-x, 12px)) * 0.58));
  }
  #carousel-screenshots .carousel-item img, #carousel-screenshots2 .carousel-item img, #carousel-screenshots3 .carousel-item img {
    max-height: calc(min(55vh, (100vw - 2 * var(--bs-gutter-x, 12px)) * 0.58) - 3rem);
  }
}

/* LG (≥992) */
@media (min-width: 992px) and (max-width: 1199.98px) {
  #carousel-screenshots .carousel-item, #carousel-screenshots2 .carousel-item, #carousel-screenshots3 .carousel-item {
    height: min(60vh, calc((100vw - 2 * var(--bs-gutter-x, 12px)) * 0.56));
  }
  #carousel-screenshots .carousel-item img, #carousel-screenshots2 .carousel-item img, #carousel-screenshots3 .carousel-item img {
    max-height: calc(min(60vh, (100vw - 2 * var(--bs-gutter-x, 12px)) * 0.56) - 3rem);
  }
}

/* XL (≥1200)*/
@media (min-width: 1200px) and (max-width: 1399.98px) {
  #carousel-screenshots .carousel-item, #carousel-screenshots2 .carousel-item, #carousel-screenshots3 .carousel-item {
    height: min(65vh, calc((100vw - 2 * var(--bs-gutter-x, 12px)) * 0.56));
  }
  #carousel-screenshots .carousel-item img, #carousel-screenshots2 .carousel-item img, #carousel-screenshots3 .carousel-item img {
    max-height: calc(min(65vh, (100vw - 2 * var(--bs-gutter-x, 12px)) * 0.56) - 3rem);
  }
}

/* XXL (≥1400) */
@media (min-width: 1400px) {
  #carousel-screenshots .carousel-item, #carousel-screenshots2 .carousel-item, #carousel-screenshots3 .carousel-item {
    height: min(85vh, calc((100vw - 2 * var(--bs-gutter-x, 12px)) * 0.54));
  }
  #carousel-screenshots .carousel-item img, #carousel-screenshots2 .carousel-item img, #carousel-screenshots3 .carousel-item img {
    max-height: calc(min(85vh, (100vw - 2 * var(--bs-gutter-x, 12px)) * 0.54) - 3rem);
  }
}

#carousel-screenshots .carousel-item img,
#carousel-screenshots2 .carousel-item img,
#carousel-screenshots3 .carousel-item img{
  display: block;
  margin: 0 auto;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  box-sizing: border-box;
}

@media (min-width: 768px){
  #carousel-screenshots .carousel-item,
  #carousel-screenshots2 .carousel-item,
  #carousel-screenshots3 .carousel-item{ padding-bottom: 3rem; }
  #carousel-screenshots .carousel-item img,
  #carousel-screenshots2 .carousel-item img,
  #carousel-screenshots3 .carousel-item img{ max-height: calc(100% - 3rem); }
}


#carousel-screenshots .carousel-item.active, #carousel-screenshots .carousel-item-next, #carousel-screenshots .carousel-item-prev, #carousel-screenshots .carousel-item-start, #carousel-screenshots .carousel-item-end,
#carousel-screenshots2 .carousel-item.active, #carousel-screenshots2 .carousel-item-next, #carousel-screenshots2 .carousel-item-prev, #carousel-screenshots2 .carousel-item-start, #carousel-screenshots2 .carousel-item-end,
#carousel-screenshots3 .carousel-item.active, #carousel-screenshots3 .carousel-item-next, #carousel-screenshots3 .carousel-item-prev, #carousel-screenshots3 .carousel-item-start, #carousel-screenshots3 .carousel-item-end{
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}


#carousel-screenshots .carousel-indicators, 
#carousel-screenshots2 .carousel-indicators, 
#carousel-screenshots3 .carousel-indicators {
  position: static !important;
  margin: 0 auto;
}

#carousel-screenshots .carousel-caption, 
#carousel-screenshots2 .carousel-caption, 
#carousel-screenshots3 .carousel-caption {
  padding: 0;
  position: static !important; 
  text-align: center;
}


#carousel-feedbacks {padding-top:20px; margin-left:20px; margin-right:20px;}

#feedback-tabs button {
	border: 1px solid #333;
	border-radius: 50%;
	cursor: pointer;
	display: inline-block;
	font-size: 0;
	height: 15px;
	margin-right: 10px;
	transition: background .2s;
	width: 15px;
	overflow: hidden;
	padding:0;
}


#feedback-tabs button.active{background-color: #333; border: 1px solid #333;}

#ordertabs .nav-link.active {background-color:#F6F9FC;}
#ordertabs .nav-link{padding:10px 40px;}


/*Main Banner Carousel*/

#main-banner-slider  .carousel-indicators button {width: 1rem ; height: 1rem; border-radius:1rem; margin:10px; background: transparent; border: 2px solid #fff; opacity:1;}


#main-banner-slider  .carousel-indicators button:hover, #main-banner-slider > .carousel-indicators button:active, #main-banner-slider > .carousel-indicators button:focus {
	transform: scale(1.25);}

#main-banner-slider > .carousel-indicators .active{
	transform: scale(1.25);
	background: #fff;
	border:none;}


#main-banner-slider .carousel-inner {
  height: var(--hero-h, 600px);
  transition: height .3s ease;
}

#main-banner-slider .carousel-item,
#main-banner-slider .shield-banner-clip,
#main-banner-slider .hem-banner-clip,
#main-banner-slider .hsa-banner-clip {
  min-height: var(--hero-h, 600px);
}

.hover-transform:hover, .hover-transform:active, .hover-transform:focus{
	transform: scale(1.3);
}

.best-value{
	background: var(--color-red);
	border-bottom-left-radius: 10px;
	border-top-left-radius: 10px;
	color: #fff;
	font-size: 16px;
	padding: 3px 15px;
	position: absolute;
	right: 0;
	top: -5px;;
	text-transform: uppercase;
}

.best-value2 {color: #fff; background: var(--color-red); border-radius: 10px; padding:5px 10px; font-size:17px; display:inline-block;}

.top1{border-top:4px solid var(--color-biruz);}

.top2{border-top:4px solid var(--color-azure);}

.top3{border-top:4px solid var(--color-blue-main);}

.top4{border-top:4px solid var(--color-blue-main);}


.list-group-item.active{z-index:0;}

.list-group-item.disabled, .list-group-item.disabled:focus, .list-group-item.disabled:hover, .list-group-item.disabled:active{cursor:default;}

/*Floats*/

.float-l{float:left;}

.float-r{float:right;}

.z99{z-index:99;}


/*Widths*/


.width100{width:100%;}

.min-width-135{min-width:135px;}

@media (min-width: 992px) { /* lg and more */
    .w80 {
        width: 80% !important;
    }
}

@media (max-width: 575.98px) {.max-w-70 {max-width:70px;}}

/*Positions*/

.pos-abs{position:absolute;}

.pos-rel{position:relative;}

.pos-fixed{position:fixed;}

.pos-abs-0{position:absolute; top:0; left:0;}

.pos-bottom-center{position:absolute; bottom:0; width:100%; text-align:center;}

/*Borders*/

.noborder{border:none;}

.border-r5{border-radius:5px;}

.border-bottom-grey{border-bottom: 1px solid #edeef0;}

.border-shadow-for-screenshots{
	border-radius:12px;
	box-shadow: 0 16px 32px 0 rgba(21,25,52,.25);
	border:2px solid var(--color-blue-main);
}
@media (max-width: 575.98px){
  .border-shadow-for-screenshots{
    box-shadow: 0 4px 12px rgba(21,25,52,.15);
  }
}

table.noborder td{
	border:0;
	padding:5px 10px;
	vertical-align: top;
}

.border-feature-6{
	border: 1px solid #e4e4e4;
	padding: clamp(1.4rem, 1.4rem + 0.50vw, 2.5rem) clamp(0.5rem, 0.5rem + 0.45vw, 2.1875rem); 
}

.border-feature-6 p{text-align: left;}

.border-feature-6 h3 i{width:70px; font-size:clamp(2.344rem, 2.344rem + 0.55vw, 2.8125rem); align-self:flex-start;}

.border-feature-6 h3, h3.for-features {font-size:clamp(1.1rem, 1.1rem + 0.12vw, 1.25rem); font-weight:bold; display: flex; align-items:center;}

h3.for-features i{width:70px; font-size:clamp(2.344rem, 2.344rem + 0.55vw, 2.8125rem); align-self:flex-start;}

.row-flex .border-feature-6 {
	margin-bottom: 0px;
}

@media (min-width: 992px) {
.border-feature-6:nth-of-type(1), .border-feature-6:nth-of-type(2) {
	border-top: 0;
	border-left: 0;
}}

@media (min-width: 992px) {
.border-feature-6:nth-of-type(4), .border-feature-6:nth-of-type(5) {
	border-left: 0;
	border-top: 0;
	border-bottom:0;
}}

@media (min-width: 992px) {
.border-feature-6:nth-of-type(3) { 
	border-left: 0;
	border-right: 0;
	border-top: 0;
}}

.border-feature-6:nth-of-type(6) { 
	border: 0;
}

@media (max-width: 991px) and (min-width: 768px) {
	.border-feature-6:nth-of-type(1), .border-feature-6:nth-of-type(3) {
	border-top: 0;
	border-left: 0;
	}}

@media (max-width: 991px) and (min-width: 768px) {
	.border-feature-6:nth-of-type(2), .border-feature-6:nth-of-type(4) {
	border-top: 0;
	border-left: 0;
	border-right:0;
	}}

@media (max-width: 991px) and (min-width: 768px) {
	.border-feature-6:nth-of-type(5) {
	border-top: 0;
	border-left: 0;
	border-bottom:0;
	}}

@media (max-width: 767px){.border-feature-6 {border-top: 0; border-left: 0; border-right:0;}}

@media (min-width: 751px) {
	.boder-right-bottom-grey {
		border-right: 2px solid #e4e4e4;
	}
}

@media (max-width: 750px) {
	.boder-right-bottom-grey {
		border-bottom: 2px solid #e4e4e4;
	}
}

/*Font-Sizes*/

.f11 { font-size: 11px; }

/*  f14 : 11.7 → 14 px  */
.f14{font-size: clamp(0.73rem, 0.73rem + 0.15vw, 0.875rem);}

/*  f16 : 15 → 18 px */
.f16{font-size: clamp(0.9rem, 0.9rem + 0.15vw,0.95rem);}

/*  f17 : 16 → 17.6 px   (-16 ⅔ %) */
.f17{font-size: clamp(1rem, 1rem + 0.08vw, 1.1rem);}

/*  f18 : 17.6 → 19.2 px  (-16 ⅔ %) */
.f18, .big{font-size: clamp(1.1rem, 1.1rem + 0.08vw, 1.2rem);}

/*  f20 : 17.6 → 20 px   (-16 ⅔ %) */
.f20{ font-size: clamp(1.1rem, 1.1rem + 0.12vw, 1.25rem);}

/*  f22 : 19.2 → 22 px   (-16 ⅔ %) */
.f22{  font-size: clamp(1.2rem, 1.2rem + 0.18vw, 1.375rem);}

/*  f24 : 20 → 24 px */
.f24{font-size: clamp(1.25rem, 1.25rem + 0.20vw, 1.5rem);}

.f27{ /* 22.4 → 27.2 px */
  font-size: clamp(1.4rem, 1.4rem + 0.24vw, 1.7rem);}

.f28{ /* 22.4 → 28 px */
  font-size: clamp(1.4rem, 1.4rem + 0.26vw, 1.75rem);}

.f30{ /* 24 → 30 px */
  font-size: clamp(1.5rem, 1.5rem + 0.30vw, 1.875rem);}

.f35{ /* 29.2 → 35 px */
  font-size: clamp(1.825rem, 1.825rem + 0.40vw, 2.1875rem);}

.f45{ /* 37.5 → 45 px */
  font-size: clamp(2.344rem, 2.344rem + 0.55vw, 2.8125rem);}

.f50{ /* 41.7 → 50 px */
  font-size: clamp(2.606rem, 2.606rem + 0.60vw, 3.125rem);}

.f60{ /* 50 → 60 px */
  font-size: clamp(3.1rem, 3.1rem + 0.70vw, 3.75rem);}

.f70{ /* 58.3 → 70 px */
  font-size: clamp(3.5rem, 3.5rem + 0.80vw, 4.375rem);}

.f100{ /* 77.6 → 100 px */
font-size: clamp(4.25rem, 4.25rem + 1.20vw, 6.25rem);}

@media screen and (max-width: 956px) {
	.f-adapt{
		font-size:1rem! important;
 }
}

@media screen and (max-width: 956px) {
	.h-adapt{
		font-size:17px! important;
 }
}



/*Disaplys*/

.dis-block{display:block;}

.dis-line{display:inline;}

.dis-in-block{display:inline-block;}

ul.dis-in-block li{display:inline-block;}

.over-hidden{overflow:hidden;}

.dis-table{display:table;}

/*Paddings*/

.mrgn0{margin: 0px;}

.m-g-0{margin-left:0! important; margin-right:0! important;}

.mrgn-auto{margin:0 auto !important;}

.mrg-t-40{margin-top:-40px;}

.mrgn-r-0{margin-right:0;}

.mrgn-b-0{margin-bottom:0;}

.pad-v-70{padding-top:clamp(3rem, 3rem + 0.80vw, 4.375rem); padding-bottom:clamp(3rem, 3rem + 0.80vw, 4.375rem);}

.p-l-0{padding-left:0;}

.pad-l-60{padding-left:60px;}

.pad-l-80{padding-left:80px;}

.form-group {
  margin-bottom: 15px;
}

.fas, .fab, .fa, .far {
vertical-align: -.125em;
margin-right: .5rem;
}

.fa-fw {
text-align: center;
width: 1.25em;
}