/*
Theme Name: Twenty Twenty-Two Child
Theme URI: https://wordpress.org/themes/twentytwentytwo/
Template: twentytwentytwo
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Built on a solidly designed foundation, Twenty Twenty-Two embraces the idea that everyone deserves a truly unique website. The theme’s subtle styles are inspired by the diversity and versatility of birds: its typography is lightweight yet strong, its color palette is drawn from nature, and its layout elements sit gently on the page. The true richness of Twenty Twenty-Two lies in its opportunity for customization. The theme is built to take advantage of the Site Editor features introduced in WordPress 5.9, which means that colors, typography, and the layout of every single page on your site can be customized to suit your vision. It also includes dozens of block patterns, opening the door to a wide range of professionally designed layouts in just a few clicks. Whether you’re building a single-page website, a blog, a business website, or a portfolio, Twenty Twenty-Two will help you create a site that is uniquely yours.
Tags: one-column,custom-colors,custom-menu,custom-logo,editor-style,featured-images,full-site-editing,block-patterns,rtl-language-support,sticky-post,threaded-comments,accessibility-ready
Version: 1.4.1693476507
Updated: 2023-08-31 10:08:27

*/
body {
	position: relative;
}
body .jquery-spinner-wrap,
body .jquery-spinner-wrap .jquery-spinner-circle {
	height: 100vh;
}

/*  Map Start  */ 
.map-wrapper .map .hotspots-container {
	position: relative;
}
.map-wrapper .map .hotspots-container .hotspot-info {
	display: none;
}
.map-wrapper .map .hotspots-container .hotspots-interaction .hotspots-image-container img {
	height: 100%;
}
.map-wrapper .map .hotspots-container map {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.map-wrapper .map .hotspots-container map area {
	position: absolute;
	width: 1rem;
	height: 1rem;
	border-radius: 100%;
	transform: translate(-50%, -50%);
	background-color: #53EAE0;
	display: inline-block;
	transition: all 0.3s linear;
}
.map-wrapper .map .hotspots-container map area::before,
.map-wrapper .map .hotspots-container map area::after {
	content: "";
    position: absolute;
    z-index: 0;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #53EAE0;
    border-radius: 50%;
    z-index: -1;
	transition: all 0.3s linear;
    -webkit-animation: pulse-border 1500ms ease-out infinite;
    animation: pulse-border 1500ms ease-out infinite;
}
.map-wrapper .map .hotspots-container map area::after {
	transition: all 0.3s linear 0.1s;
	-webkit-animation: pulse-border2 2000ms ease-out infinite;
    animation: pulse-border2 2000ms ease-out infinite;
}
.map-wrapper .map .hotspots-container map area span {
	position: absolute;
	bottom: calc(100% + 3.6rem);
	left: 50%;
	transform: translateX(-50%);
	background-color: #FF9921;
	font: 500 1.85rem/1.12 "aktivgrotesk-medium";
	color: #090C1A;
	white-space: nowrap;
	padding: 1.4rem 1.85rem;
	border-radius: 9px;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s linear;
}
.map-wrapper .map .hotspots-container map area:hover {
	z-index: 1;
}
.map-wrapper .map .hotspots-container map area:hover span {
	opacity: 1;
	visibility: visible;
}
.map-wrapper .map .hotspots-container map area span::after {
	content: "";
	position: absolute;
	top: 95%;
	left: 50%;
	width: 2rem;
    height: 1.2rem;
	transform: translateX(-50%);
	background-image: url('./images/tooltip.svg');
	background-repeat: no-repeat;
	background-size: 100%;
}
.map-wrapper .map .hotspots-container map area:hover,
.map-wrapper .map .hotspots-container map area:hover::before,
.map-wrapper .map .hotspots-container map area:hover::after {
	background-color: #FF9921;
}

@keyframes pulse-border {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(2.5);
        opacity: 0;
    }
}
@keyframes pulse-border2 {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(4);
        opacity: 0;
    }
}

/*  Map End  */

/*  Search Results Start  */
input[type="search"]::-webkit-search-cancel-button {
	-webkit-appearance:none;
}
#search-results {
	position: absolute;
    top: calc(100% + 1.2rem);
    width: 100%;
    background-color: rgba(249, 249, 249, 0.25);
    border-radius: 2rem;
	z-index: 2;
	line-height: 2.4;
    padding: 0 2rem;
	backdrop-filter: blur(30px);
}
#search-results a {
	margin: 0.3rem 0;
	line-height: 1.5;
	display: inline-block;
}
#search-results a:first-child {
	margin-top: 1.4rem;
}
#search-results a:nth-last-child(2) {
	margin-bottom: 1.4rem;
}
#search-results a:hover {
	color: #53EAE0;
}
.cloud-benefit-wrapper.documentation-services .cloud-benefit > p {
	font-size: 2.4rem;
	color: #F52536;
	width: 100%;
	text-align: center;
	font-family: 'aktivgrotesk-bold';
}
/*  Search Results End  */

/*  Tool detail page video start  */
.tutorial-dtl-wrapper .tutorial-dtl .tutorial-content .tutorial-desc .wp-video {
	margin-top: 2.4rem;
	position: relative;
	cursor: pointer;
}
.tutorial-dtl-wrapper .tutorial-dtl .tutorial-content .tutorial-desc .wp-video,
.tutorial-dtl-wrapper .tutorial-dtl .tutorial-content .tutorial-desc .wp-video video {
	width: 100% !important;
	height: auto;
}
.tutorial-dtl-wrapper .tutorial-dtl .tutorial-content .tutorial-desc .wp-video::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('./images/video.svg');
	background-size: 9.4rem;
	background-repeat: no-repeat;
	background-position: center;
	z-index: 1;
	transition: all 0.3s linear;
}
.tutorial-dtl-wrapper .tutorial-dtl .tutorial-content .tutorial-desc .wp-video.play::before {
	opacity: 0;
	visibility: hidden;
}
/*  Tool detail page video end  */

/*  404 page start  */
.wrong-wrapper {
	min-height: 100vh;
}
.wrong-wrapper .wrong-contain .wrong-ttl h2 {
	background-image: linear-gradient(#EC2B4B 0%, #7B00FF 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	font-size: 9rem;
}
.wrong-wrapper::after,
.wrong-wrapper::before {
	content: "";
    position: absolute;
    top: 10rem;
    left: 50%;
    width: 91rem;
    height: 17rem;
    -webkit-transform: translateX(-135%);
    transform: translateX(-135%);
    border-radius: 91rem;
    background: var(--blue, #7B00FF);
    -webkit-filter: blur(200px);
    filter: blur(200px);
    z-index: -1;
}
.wrong-wrapper::after {
	top: auto;
	bottom: 10rem;
	-webkit-transform: translateX(40%);
    transform: translateX(40%);
}
/*  404 page end  */

/*  Form start  */
form.wpcf7-form .row {
	margin: 0 -1.2rem;
}
form.wpcf7-form .row > * {
	padding: 0 1.2rem;
}
form.wpcf7-form p .wpcf7-form-control-wrap label {
	position: absolute;
    top: 1.8rem;
    left: 2.4rem;
    color: #fff;
    z-index: -1;
    transition: all 0.2s linear;
}
form.wpcf7-form p .wpcf7-form-control-wrap label.active, 
form.wpcf7-form p .wpcf7-form-control-wrap .form-control.wpcf7-select ~ label {
	transform: translateY(-1rem);
    font-size: 1.2rem;
}
form.wpcf7-form p .wpcf7-form-control-wrap {
	padding-bottom: 3.2rem;
	display: block;
	position: relative;
}
form.wpcf7-form p .wpcf7-form-control-wrap .wpcf7-not-valid-tip {
	display: none;
}
form.wpcf7-form p .wpcf7-form-control-wrap .form-control {
	font-size: 1.6rem;
	border-radius: 8px;
	border: 1px solid var(--f-5, #474C5E);
	background-color: rgba(255, 255, 255, 0.16);
	color: #EFE9F5;
	padding: 3.2rem 2.4rem 0.8rem;
	border: none;
	color: #fff;
}
form.wpcf7-form p .wpcf7-form-control-wrap textarea {
	height: 14.6rem;
}
form.wpcf7-form p .wpcf7-form-control-wrap .form-control::placeholder {
	color: #B4BCD0;
}
form.wpcf7-form p .wpcf7-form-control-wrap .validation-error,
form.wpcf7-form p .wpcf7-form-control-wrap .wpcf7-not-valid-tip {
	position: absolute;
	bottom: 1.2rem;
	left: 2px;
	font-size: 1.4rem;
	line-height: 1.2;
	color: #ff3f50;
	font-family: "aktivgrotesk-medium";
}
form.wpcf7-form p .form-label {
	font: 500 1.6rem/1.19 "aktivgrotesk-medium";
	margin-bottom: 1.6rem;
}
form.wpcf7-form .checkboxes p .form-label {
	margin-bottom: 2.4rem;
}
form.wpcf7-form .checkboxes {
	padding-top: 0.8rem;
	padding-bottom: 0.8rem;
}
form.wpcf7-form .checkboxes p .wpcf7-form-control-wrap .wpcf7-checkbox {
	display: flex;
	flex-wrap: wrap;
	gap: 2.4rem;
}
form.wpcf7-form .checkboxes p .wpcf7-form-control-wrap .wpcf7-checkbox .wpcf7-list-item {
	width: calc(50% - 1.2rem);
	line-height: 0;
	margin: 0;
}
form.wpcf7-form .checkboxes p .wpcf7-form-control-wrap .wpcf7-checkbox .wpcf7-list-item label {
	font: 500 1.6rem/1.19 "aktivgrotesk-medium";
	color: #B4BCD0;
	color: #fff;
    position: initial;
}
form.wpcf7-form select {
	background-image: url('images/down.svg');
    background-repeat: no-repeat;
    background-size: 2.5rem;
    background-position: 97.5% 52%;
}
form.wpcf7-form select option {
	color: #000;
}
form.wpcf7-form .wpcf7-checkbox input,
.tutorial-dtl-wrapper .tutorial-dtl .tutorial-content #comments form p.comment-form-cookies-consent input {
	appearance: none;
    width: 1.6rem;
    height: 1.6rem;
	border-radius: 2px;
	border: 1px solid #B4BCD0;
	vertical-align: -2px;
    margin-right: 1rem;
	padding: 0;
    flex-shrink: 0;
}
form.wpcf7-form .wpcf7-checkbox input:checked,
.tutorial-dtl-wrapper .tutorial-dtl .tutorial-content #comments form p.comment-form-cookies-consent input:checked {
	background-color: #7B00FF;
	background-image: url('images/check.png');
	background-size: 100%;
	border-color: #7B00FF;
}
form.wpcf7-form .policy {
	padding-top: 0.8rem;
	padding-bottom: 4rem;
}
form.wpcf7-form .policy p .wpcf7-form-control-wrap {
	padding-bottom: 0;
}
form.wpcf7-form .policy p .wpcf7-form-control-wrap .wpcf7-list-item {
	margin: 0;
}
form.wpcf7-form .policy p .wpcf7-form-control-wrap label {
	position: initial;
    padding-left: 2.6rem;
    margin-top: -2.7rem;
    display: block;
	cursor: pointer;
}
form.wpcf7-form .policy p {
	color: #B4BCD0; 
}
form.wpcf7-form .policy p a {
	color: #EFE9F5;
	font-family: "aktivgrotesk-medium";
	text-decoration: underline;
}
form.wpcf7-form .wpcf7-submit {
	font: 500 1.6rem/1.19 "aktivgrotesk-medium";
	color: #000000;
	background-color: #FF9921;
	border-radius: 8px;
	border: none;
	text-transform: capitalize;
	padding: 1.4rem 5rem;
	border: 1px solid #FF9921;
	transition: all 0.3s linear;
}
form.wpcf7-form .wpcf7-submit:hover {
	background-color: transparent;
	color: #FF9921;
}
form.wpcf7-form p .wpcf7-form-control-wrap .form-control:focus,
form.wpcf7-form p .wpcf7-form-control-wrap input[type="checkbox"]:focus {
	outline: 1px solid #FF9921;
}
@media (max-width: 575px) {
	form.wpcf7-form p .wpcf7-form-control-wrap {
		padding-bottom: 2.4rem;
	}
	form.wpcf7-form p .wpcf7-form-control-wrap .form-control {
		font-size: 2.2rem;
		padding: 3.6rem 2rem 1rem;
	}
	form.wpcf7-form p .form-label,
	form.wpcf7-form .checkboxes p .wpcf7-form-control-wrap .wpcf7-checkbox .wpcf7-list-item label {
		font-size: 1.8rem;
	}
	form.wpcf7-form p .wpcf7-form-control-wrap label {
		top: 2rem;
		left: 2rem;
		font-size: 2.2rem;
	}
	form.wpcf7-form p .wpcf7-form-control-wrap label.active,
	form.wpcf7-form p .wpcf7-form-control-wrap .form-control.wpcf7-select ~ label {
		font-size: 1.6rem;
	}
	form.wpcf7-form .wpcf7-checkbox input,
	.tutorial-dtl-wrapper .tutorial-dtl .tutorial-content #comments form p.comment-form-cookies-consent input {
		width: 1.8rem;
    	height: 1.8rem;
		vertical-align: -1px;
	}
	form.wpcf7-form select {
		background-position: 96% 50%;
	}
	form.wpcf7-form .wpcf7-submit {
		font-size: 1.8rem;
		padding: 1.6rem 5rem;
		display: block;
    	margin: auto;
	}
	form.wpcf7-form .policy p .wpcf7-form-control-wrap label {
		padding-left: 3rem;
		margin-top: -3.4rem;
	}
}
/*  Form end  */

/* Final Changes */