@charset "utf-8";
/* CSS Document */
html{
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    padding: 0;
    margin: 0;
    background: #fff;
    font-family: var(--primary-font);
    font-weight: 400;
}
a {
    display: inline-block;
    outline: none;
    text-decoration: none;
}
a:focus,
a:hover {
    outline: none;
    text-decoration: none;
}
ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
::selection {
  color: #fff;
  background-color: var(--primary-color);
}
@media screen and (min-width: 1400px) {
    .container {
        max-width: 1360px;
    }
}

/* ___________________ Header Starts _______________________*/
.navbar-default {
    padding: 0;
    margin: 0;
    background: none;
    border: none;
    display: block;
    border-bottom: 1px solid #ededed;
	z-index: 1000;
}
/* .navbar-default .container{ position:relative; }
.navbar-default .menu-block{ position:absolute; top:30px; right:0; z-index:999; } */
.stellarnav {
    transition: all 0.3s ease-in-out;
}

/*-- Moblie Menu 1 --*/
.stellarnav .menu-toggle span.bars span {
    width: 35px;
    height: 2px;
    background-color: #fff;
    display: block;
    margin: 8px auto;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.stellarnav.active .bars span:nth-child(2) {
    opacity: 0;
}
.stellarnav.active .bars span:nth-child(1) {
    -webkit-transform: translateY(9px) rotate(45deg);
    -ms-transform: translateY(9px) rotate(45deg);
    -o-transform: translateY(9px) rotate(45deg);
    transform: translateY(9px) rotate(45deg);
}
.stellarnav.active .bars span:nth-child(3) {
    -webkit-transform: translateY(-10px) rotate(-45deg);
    -ms-transform: translateY(-10px) rotate(-45deg);
    -o-transform: translateY(-10px) rotate(-45deg);
    transform: translateY(-10px) rotate(-45deg);
}

/* custom css */
.navbar .main-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.navbar .stellarnav.dark {
    background-color: transparent;
}

.navbar .stellarnav.dark li a {
    color: var(--black);
    font-weight: 500;
    text-transform: uppercase;
    padding: 34px 10px;
}

.navbar .stellarnav.dark li .sub-menu li a {
	font-size: 13px;
	color: #fff;
	text-transform: capitalize;
	font-weight: 400;
	padding: 10px; 
	border-bottom: 1px dashed #ffffff30;
}

.navbar .stellarnav.dark li.active a {
    color: var(--primary-color);
}
/* ___________________ Header end _______________________*/

/* ___________________ Banner Start _______________________*/
.banner-section {
    padding: 139px 0 49px 0;
}

.banner-section .content-block h2 {
    --line-height: calc(var(--font-size) + 3px);
    --font-size: 24px;
    color: var(--black);
    font-size: var(--font-size);
    text-transform: uppercase;
    margin-bottom: 31px;
}

.banner-section .content-block h1 {
    --line-height: calc(var(--font-size) + 2px);
    --font-size: 78px;
    color: var(--primary-color);
    font-size: var(--font-size);
    font-family: var(--secondary-font);
    text-transform: capitalize;
    font-weight: 700;
    line-height: var(--line-height);
    margin-bottom: 57px;
}

.banner-section .content-block .button-block {
    margin-bottom: 84px;
}

.banner-section .content-block .border-btn {
    margin-left: 32px;
}

.banner-section .content-block .brand-list {
    width: 100%;
}

.banner-section .content-block .list-item {
    margin-bottom: 40px;
}

.banner-section .container {
    position: relative;
}

.banner-section .img-block {
    position: absolute;
    top: -48px;
    right: -170px;
}
/* ___________________ Banner end_______________________*/

/* ___________________ Who We Are Section Start _______________________*/
.wo-we-are-section {
    background-color: var(--light-blue);
    padding-top: 70px;
	padding-bottom:60px;
}

.wo-we-are-section .main-block {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
}

.wo-we-are-section .main-block .lt-block {
    margin: 0;
    padding: 0;
    width: 50%;
}

.wo-we-are-section .main-block .rt-block {
    margin: 0;
    padding: 0;
    width: 50%;
}

.wo-we-are-section .main-block .rt-block .content-block {
    margin: 0;
    padding: 0;
    max-width: 667px;
    padding-left: 50px;
}

.wo-we-are-section .content-block h3 {
    --font-size: 22px;
    font-size: var(--font-size);
    line-height: 1;
    text-transform: uppercase;
    margin-bottom: 25px;
}

.wo-we-are-section .content-block h4 {
    --font-size: 42px;
    font-size: var(--font-size);
    line-height: var(--font-size);
    font-family: var(--secondary-font);
    color: var(--primary-color);
    font-weight: 500;
    text-transform: uppercase;
    margin-bottom: 34px;
}

.wo-we-are-section .content-block .para {
    --font-size: 16px;
    --line-height: calc(var(--font-size)+8px);
    font-size: var(--font-size);
    line-height: var(--line-height);
    margin-bottom: 25px;
}

.wo-we-are-section .list-block h5 {
    --font-size: 18px;
    --line-height: calc(var(--font-size) + 6px);
    line-height: 1;
    font-size: var(--font-size);
    line-height: var(--line-height);
    font-weight: 700;
    margin-bottom: 16px;
}

.wo-we-are-section .list-block p {
    --font-size: 16px;
    --line-height: calc(var(--font-size)+8px);
    font-size: var(--font-size);
    line-height: var(--line-height);
    position: relative;
    margin-left: 30px;
}

.wo-we-are-section .list-block p::after {
    content: "";
    position: absolute;
    top: 0;
    left: -30px;
    width: 16px;
    height: 17px;
    background-image: url("../images/check-mark.png");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.wo-we-are-section .list-item:last-child {
    margin-bottom: 45px;
}
/* ___________________ Who We Are Section end _______________________*/

/* _____ sophos site in box services section start ____*/
.sophos-site-in-box-services {
    background: #e8faff;
    padding: 90px 0 10px 0;
    margin: 0;
}

.sophos-site-in-box-services .card {
    border: none;
    box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.04);
    overflow: hidden;
	min-height: 443px;
	margin: 0 0 24px 0;
}

.sophos-site-in-box-services .card .card-body h3{
	font-family: var(--secondary-font);
	font-size: 26px;
	color: var(--primary-color);
	line-height: 1.5;
	text-transform: capitalize;
}

.sophos-site-in-box-services .card .card-body p{
	font-family: inherit;
	font-size: 16px;
	color: var(--light-black);;
	line-height: 1.3;
}




/* ____ sophos site in box services section end ______*/

/* ___________________ how its works section start _______________________*/
.how-it-works .main-block {
    width: 100%;
    padding: 76px 0 0 0;
}

.how-it-works .main-block h3 {
    text-align: center;
    color: var(--light-black);
    font-size: 18px;
    text-transform: uppercase;
    line-height: 1;
}

.how-it-works .main-block h4 {
    text-align: center;
    font-size: 52px;
    font-family: var(--secondary-font);
    color: var(--primary-color);
    font-weight: 500;
    margin-bottom: 77px;
    line-height: 1;
}

.how-it-works .img-block {
    position: relative;
    left: -80px;
    bottom: 0;
}

.how-it-works .img-block p {
    position: absolute;
    top: 50%;
    left: 51%;
    transform: translate(-50%, -50%);
    font-size: clamp(0.8125rem, -0.044rem + 4.5679vw, 5.4375rem);
    line-height: 0.75;
    font-family: var(--secondary-font);
    color: var(--white);
    font-weight: 500;
}

.how-it-works .list {
    margin: auto 0;
    margin-top: 50px;
}

.how-it-works .list-item {
    display: flex;
    margin-bottom: 50px;
}

.how-it-works .list-item:last-child {
    margin-bottom: 0;
}

.how-it-works .list .circle {
    background-color: var(--primary-color);
    height: 81px;
    width: 81px;
    margin-right: 30px;
    border-radius: 50%;
}

.how-it-works .list .circle {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    position: relative;
}

.how-it-works .list .circle::after {
    content: "";
    height: 20px;
    width: 86px;
    position: absolute;
    top: 50%;
    left: -78px;
    transform: translate(-50%, -50%);
    background-image: url("../images/design-element.png");
    background-size: contain;
    background-position: left;
    background-repeat: no-repeat;
}

.how-it-works .list .circle-2::after {
    background-image: url("../images/design-elemen-2.png");
    width: 135px;
    left: -132px;
}

.how-it-works .list .circle-3::after {
    background-image: url("../images/design-element-3.png");
    width: 287px;
    left: -262px;
}

.how-it-works .list .text {
    width: calc(100% - 111px);
}

.how-it-works .list .text h5 {
    font-size: 32px;
    font-family: var(--secondary-font);
    line-height: 1;
    color: var(--primary-color);
    font-weight: 500;
    text-transform: capitalize;
    margin-bottom: 12px;
}

.how-it-works .list .text p {
    --font-size: 16px;
    --line-height: calc(var(--font-size)+8px);
    font-size: var(--font-size);
    line-height: var(--line-height);
    color: var(--light-black);
    margin-bottom: 24px;
}

.how-it-works .list .text a {
    font-size: 16px;
    color: var(--light-black);
    border-bottom: 1px solid var(--light-black);
    letter-spacing: 0.12em;
    transition: all 0.3s ease-in-out;
}

.how-it-works .list .text a:hover {
    color: var(--primary-color);
}

.news-page-news-section.blog-section .main-block .box-coontainer .box {
    margin-bottom: 50px;
}

/* ___________________ how it works section end _______________________*/

/* ___________________ Mission section start _______________________*/
.mission-section-start {
    color: var(--white);
    background-image: url("../images/mission-section-img.jpg");
    background-position: center;
    background-size: cover;
    padding: 101px 0;
}

.mission-section-start .main-block {
    width: 100%;
}

.mission-section-start .content-block h3 {
    font-size: 52px;
    text-transform: capitalize;
    font-weight: 500;
    font-family: var(--secondary-font);
    margin-bottom: 37px;
}

.mission-section-start .content-block p {
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 87px;
}

.mission-section-start .list h4 {
    font-size: 52px;
    text-transform: capitalize;
    font-weight: 500;
    font-family: var(--secondary-font);
    margin-bottom: 38px;
}

.mission-section-start .list-item {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 27px;
}

.mission-section-start .list-item:last-child {
    margin-bottom: 0;
}

.mission-section-start .list-item p {
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 0;
}
/* ___________________ Mission section end _______________________*/

/* ___________________ Mission section start _______________________*/
.service-section {
    padding: 79px 0 calc(86px - 29px) 0;
}

.service-section .box {
    border: 1px solid rgb(246, 246, 246);
    border-radius: 3px;
    background-image: -moz-linear-gradient(
        90deg,
        rgb(239, 250, 255) 0%,
        rgb(255, 255, 255) 100%
    );
    background-image: -webkit-linear-gradient(
        90deg,
        rgb(239, 250, 255) 0%,
        rgb(255, 255, 255) 100%
    );
    background-image: -ms-linear-gradient(
        90deg,
        rgb(239, 250, 255) 0%,
        rgb(255, 255, 255) 100%
    );
    box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.04);
    margin-bottom: 23px;
}

.service-section .col-lg-6:nth-child(even) .row {
    flex-direction: row-reverse;
}

.service-section h3 {
    font-family: var(--secondary-font);
    font-size: 52px;
    text-transform: uppercase;
    color: var(--primary-color);
    font-weight: 500;
    margin-bottom: 26px;
}

.service-section p {
    margin-bottom: 65px;
}

.service-section .icon {
    max-width: 60px;
    margin-bottom: 30px;
}

.service-section h4 {
    font-size: 37px;
    font-weight: 500;
    font-family: var(--secondary-font);
    color: var(--primary-color);
    margin-bottom: 85px;
}

.service-section h4 span {
    display: block;
}

.service-section .content-block {
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 100%;
    padding-left: 35px;
}

.service-section .content .main-btn {
    display: inline-block;
}

.service-section .img-block {
    height: 100%;
    height: 340px;
}

.service-section .img-block img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* ___________________ Mission section start _______________________*/

/* ___________________ email section start _______________________*/
.email-section {
    background-image: url("../images/email-section-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding: 50px 0;
    color: var(--white);
}

.email-section h3 {
    font-size: 52px;
    font-weight: 500;
    text-transform: uppercase;
    text-align: center;
    font-family: var(--secondary-font);
    line-height: 1;
    margin-bottom: 14px;
}

.email-section h4 {
    font-size: 18px;
    font-weight: 400;
    text-align: center;
    margin-bottom: 39px;
}

.email-section form {
    max-width: 650px;
    margin: 0 auto;
}

.email-section form .input-group {
    display: flex;
    justify-content: center;
    /* height: 50px; */
    border-radius: 3px;
    margin-bottom: 13px;
}

.email-section form .input-group:last-child {
    background-color: transparent;
}

.email-section .main-block input.form-control,
.email-section .main-block textarea.form-control{
    background: transparent;
    color: #fff;
    border: none;
    border-bottom: 1px solid #ffffff61;
    border-radius: 0;
    padding: 10px 10px;
    margin: 0 0 20px 0;
    transition: 0.3s;
}

.email-section .main-block input.form-control::placeholder,
.email-section .main-block textarea.form-control::placeholder{
    color: #fff;
    font-weight: 300;
}

.email-section .main-block textarea.form-control{
    height: 90px;
    resize: none;
}

.email-section .main-block input.form-control:focus,
.email-section .main-block textarea.form-control:focus{
    background: transparent;
    box-shadow: none;
    border-bottom: 1px solid #ffffff;
}

.email-section form .input-group .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

.email-section form .input-group .wpcf7-form-control-wrap .form-control {
    border-radius: 3px;
    background-color: var(--white);
    padding: 22px 27px 21px 27px;
    box-shadow: inset 0px 5px 13px 0px rgba(0, 0, 0, 0.24);
}

.email-section
    form
    .input-group
    .wpcf7-form-control-wrap
    .form-control::placeholder {
    color: #6d6d6d;
}

.email-section form .input-group .wpcf7-form-control-wrap .wpcf7-not-valid-tip {
    color: #fabe06 !important;
    font-size: 13px !important;
}

.email-section .wpcf7 form.invalid .wpcf7-response-output {
    border-color: #ffb900;
    text-align: center !important;
    font-size: 13px !important;
    margin: 10px 0 !important;
    border-width: 1px !important;
}

.email-section .btn-box {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
}

.email-section .btn-box .wpcf7-spinner {
    visibility: hidden;
    display: inline-block;
    background-color: #e1ab04;
    opacity: 0.75;
    width: 24px;
    height: 24px;
    border: none;
    border-radius: 100%;
    padding: 0;
    margin: 0 24px;
    position: absolute;
    top: 18px;
    right: 27%;
}

.email-section form .yellow-btn {
    border-radius: 3px;
    background-color: #fabe06;
    border: none;
    color: var(--white);
    text-transform: uppercase;
    font-size: 26px;
    font-weight: 500;
    font-family: var(--secondary-font);
    padding: 18px 38px 17px 38px;
    letter-spacing: 0.06em;
    line-height: 1;
    margin-bottom: 9px;
}

.email-section h5 {
    font-size: 14px;
    font-weight: 400;
    text-align: center;
}
/* ___________________ email section end_______________________*/

/* ___________________ blog section start _______________________*/
.blog-section .main-block {
    width: 100%;
    padding-top: 67px;
}

.blog-section h3 {
    font-size: 52px;
    color: var(--primary-color);
    font-family: var(--secondary-font);
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 78px;
}

.blog-section .main-block .box-container .col-lg-6.col-md-12 {
    margin-bottom: 50px;
}

.blog-section .box {
    display: flex;
    justify-content: space-between;
    border: 1px solid #47474710;
    border-radius: 5px;
    padding: 28px 23px;
    background-color: #ffffff21;
    box-shadow: 0px 6px 16px 0px rgba(24, 24, 24, 0.08);
    padding-bottom: 0;
    height: 100%;
}

.blog-section .box .img-block {
    width: 100%;
    height: 100%;
    height: 350px;
    margin-top: -50px;
}

.blog-section .box .img-block img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.blog-section .content-block h5 {
    font-size: 18px;
    color: var(--light-black);
    margin-bottom: 25px;
}

.blog-section .content-block h4 {
    --font-size: clamp(1.875rem, 1.0938rem + 2.5vw, 2.5rem);
    font-size: var(--font-size);
    line-height: calc(var(--font-size) + 5px);
    color: var(--primary-color);
    text-transform: uppercase;
    font-family: var(--secondary-font);
}

.blog-section .content-block .line-shape {
    width: 1px;
    height: 40px;
    background-color: #a8b7be;
    margin: 5px 0;
}

.blog-section .content-block p {
    font-size: 13px;
    margin-bottom: 21px;
}

.blog-section .content-block .border-btn {
    padding: 12px 20px 12px 20px;
    display: inline-block;
    margin-bottom: 50px;
}

.blog-section .btn-box {
    width: 100%;
    display: flex;
    justify-content: center;
}

.blog-section .main-btn {
    margin-top: 23px;
}
/* ___________________ blog section end _______________________*/

/* ___________________ query section start _______________________*/
.query-section .main-block {
    padding: 64px 0;
    width: 100%;
    position: relative;
	padding-bottom:100px;
}

.query-section .img-block {
    height: 700px;
    width: 70%;
}

.query-section .img-block img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.query-section .main-block .form-container {
    width: 48%;
    position: absolute;
    top: 120px;
    right: 0;
    background-color: var(--primary-color);
    background-image: url("../images/query-bg.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 40px;
}

.query-section form {
    border-radius: 5px;
    background-color: transparent;
    /* box-shadow: 0px 8px 16px 0px rgba(24, 24, 24, 0.13); */
    padding: 0;
    position: relative;
    z-index: 1;
    overflow: hidden;

}

.query-section form img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 2;
}

.query-section h3 {
    font-size: 48px;
    color: var(--white);
    font-family: var(--secondary-font);
    font-weight: 400;
    margin-bottom: 50px;
    position: relative;
    z-index: 3;
    text-transform: capitalize;
}

.query-section .input-group {
	display: block;
    
    position: relative;
    z-index: 3;
}

.query-section .form-control {
    background: transparent;
    border: none;
    outline: none;
    border-radius: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    color: var(--white);
	width:100%;
    margin-bottom: 40px;
}

.query-section .input-group .wpcf7-form-control-wrap .wpcf7-not-valid-tip {
    color: #ffcb00 !important;
    font-size: 13px !important;
    text-align: right !important;
}

.query-section .form-control:focus {
    box-shadow: none;
}

.query-section .form-control::placeholder {
    color: var(--white);
}

.query-section textarea.form-control {
    resize: none;
    height: 80px;
}

.query-section .send-btn {
    position: relative;
    z-index: 3;
    width: 100%;
    background-color: var(--white);
    border: none;
    text-transform: uppercase;
    color: var(--primary-color);
    font-weight: 500;
    border-radius: 4px;
    box-shadow: 0px 6px 16px 0px rgba(24, 24, 24, 0.08);
    padding: 16px 0 15px 0;
}

.query-section .wpcf7-spinner {
    position: absolute;
    top: 50%;
    right: 0;
    z-index: 9;
    transform: translateY(-50%);
}

.query-section .wpcf7 form.invalid .wpcf7-response-output {
    border-color: #ffb900;
    text-align: center !important;
    color: #ffb900 !important;
    font-size: 13px !important;
    margin: 10px 0 0 0 !important;
    border-width: 1px !important;
}

/* ___________________ query section start _______________________*/






/* ___________________ footer section start _______________________*/
footer {
    background-color: var(--primary-color);
    color: var(--white);
    padding: 40px 0 0 0;
}

footer .logo-block {
    margin-bottom: 16px;
}

footer .logo-block a {
    display: inline-block;
}

footer h3 {
    font-size: 30px;
    font-weight: 500;
    font-family: var(--secondary-font);
    margin-bottom: 27px;
}

footer .list {
    display: flex;
    justify-content: center;
}

footer .list a {
    color: var(--white);
    display: block;
    margin-bottom: 11px;
    transition: 0.3s;
}

footer .list a:hover {
    color: var(--light-black);
}

footer .icon-box {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

footer .icon-box a {
    transition: 0.3s;
}

footer .icon-box a:hover {
    transform: scale(1.2);
}

footer .fa-brands {
    font-size: 35px;
    color: var(--white);
}

footer .copyright-block {
    display: flex;
    justify-content: space-between;
    padding: 17px 0 16px 0;
    border-top: 1px solid #ffffff2f;
    margin-top: 27px;
}

footer .copyright-block a,
footer .copyright-block p{
    color: var(--white);
    font-size: 14px;
}

/* ___________________ footer section end _______________________*/















.inner-page-banner.single-post:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    left: 0;
    top: 0;
    z-index: 9;
}

.inner-page-banner.single-post .main-block {
    z-index: 99;
}



#ctsp-remote-support-modal .modal-header {
    background-image: linear-gradient(145deg, #00a6ed, #155fad17), url('https://ctsp.com.au/wp-content/uploads/2024/11/2148902262.jpg');
    background-size: cover;
    background-position: top;
    padding: 20px 20px 100px 20px;
    color: #fff;
}


#managedPopup .modal-dialog {
	max-width: calc(var(--bs-modal-width) * 2);
	margin-right: auto;
	margin-left: auto;
}

#managedPopup .modal-content{
    --_size: 300px;
    --_gap: 20px;
    background-image: linear-gradient(#0064B6, #00A7EE);
    color: #fff;
    flex-direction: row;
    gap: var(--_gap);
    align-items: stretch;
}

#managedPopup .modal-content .img-block {
	width: var(--_size);
}

#managedPopup .modal-content .img-block .img-fluid{
	width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;

}

#managedPopup .modal-content .rt-block{
    width: calc(100% - var(--_size) + var(--_gap));
}



#managedPopup .modal-body .form-control{
    margin-bottom: 20px;
}

#managedPopup .modal-body textarea.form-control{
    height: 100px;
    resize: none;
}

#managedPopup .modal-body .main-btn {
	margin-left: auto;
	display: block;
	border: 1px solid #fff;
}

/* ___________________ Inner Page Css start _______________________*/

.ticket-form-section.query-section .main-block {
	padding: 100px 0;
	width: 100%;
	position: relative;
}

.ticket-form-section.query-section .main-block .form-container {
	width: 50%;
	position: absolute;
	top: 50%;
	right: 0;
    background-color: var(--primary-color);
	background-image: url("../images/query-bg.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: 40px;
	transform: translateY(-50%);
}


/* ___________________ banner section start_______________________*/

.single-post-content {
    margin: 0;
    padding: 50px 0;
}

.single-post-content h1 {
    font-family: var(--secondary-font);
    color: var(--primary-color);
}

.inner-page-banner {
    height: 500px;
    position: relative;
}

.inner-page-banner img {
    object-fit: cover;
    object-position: center;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}
.inner-page-banner .main-block {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 500px;
    display: flex;
    align-items: center;
}

.inner-page-banner h1 {
    color: var(--white);
    text-transform: capitalize;
    font-size: clamp(4.0625rem, 3.0469rem + 3.25vw, 4.875rem);
    font-family: var(--secondary-font);
    font-weight: 700;
}
/* ___________________ banner section end_______________________*/

/* ___________________ about Page Css start _______________________*/
.about-page-about-section .box {
    padding: 69px 0;
}

.about-page-about-section .box .img-block {
    position: sticky;
    top: 0;
    background: #155fad;
    height: fit-content;
    box-shadow: -10px 10px 0 0 #00a6ee;
}

/* .about-page-about-section .box-2 .img-block::before {
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    top: 10px;
    left: -10px;
    background-color: var(--medium-blue);
    z-index: -1;
} */

.about-page-about-section .box img {
	max-width: 100%;
	height: auto;
}

.about-page-about-section .box .img-block .img-caption{
	text-align: center;
	color: #fff;
}

.about-page-about-section .box-2 {
    background-color: var(--light-blue);
}

.about-page-about-section .box-2:nth-child(even) .row {
    flex-direction: row-reverse;
}

.about-page-about-section .box-2:nth-child(even) .img-block::before {
    left: 10px;
}

.about-page-about-section .box-2:nth-child(even) {
    background-color: var(--white);
}

.about-page-about-section .box .content-block h3 {
    font-size: clamp(1.875rem, 0.9375rem + 3vw, 2.625rem);
    font-weight: 500;
    color: var(--primary-color);
    font-family: var(--secondary-font);
    line-height: 1;
}

.about-page-about-section .box .content-block p > strong{
  color: var(--primary-color);
}

.about-page-about-section .box .content-block ul{
	margin-bottom: 12px;
}
.about-page-about-section .box .content-block ul li{
    position: relative;
}

.about-page-about-section .box .content-block ul li::before{
    content: '✔';
	color: var(--primary-color);
	margin-right: 10px;

}

.about-page-about-section .box .content-block h4 {
    text-transform: uppercase;
    font-size: clamp(1rem, 0.5313rem + 1.5vw, 1.375rem);
    font-weight: 400;
}
/* ___________________ about Page Css end _______________________*/

/* ___________________ contacts Page Css end _______________________*/
.contact-page-contact-section {
    padding: 62px;
    position: relative;
}

.contact-page-contact-section .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.contact-page-contact-section .box-container {
    /* display: grid;
  grid-template-columns: repeat(3,1fr); */
    position: relative;
    z-index: 2;
}

.contact-page-contact-section .box {
    max-width: 320px;
    text-align: center;
}

.contact-page-contact-section .box .icon {
    height: 81px;
    width: 81px;
    margin: 0 auto;
    margin-bottom: 9px;
}

.contact-page-contact-section .box h3 {
    font-family: var(--secondary-font);
    color: var(--primary-color);
    font-size: 32px;
    text-transform: capitalize;
    margin-bottom: 14px;
}

.contact-page-contact-section .box a {
    font-size: 20px;
    color: var(--light-black);
    font-weight: 400;
}

.contact-page-contact-section .box:last-child a {
    font-size: 16px;
}

/* map section */

.contact-page-map-section .map-block {
    height: 700px;
    width: 70%;
    border: 2px solid var(--primary-color);
	overflow:hidden
}

.contact-page-map-section .map-block iframe{
	width: 100%;
	height: 100%;
}

/* ___________________ contacts Page Css end _______________________*/

/* ___________________ mission Page Css start _______________________*/
.mission-page-mission-section {
    padding: 73px 0;
}

.mission-page-mission-section .main-block {
    width: 100%;
}

.mission-page-mission-section .img-block {
    position: relative;
    z-index: 1;
}

.mission-page-mission-section .img-block::before {
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: var(--medium-blue);
    z-index: -1;
}

.mission-page-mission-section .box img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
}

.mission-page-mission-section .content-block {
    padding-left: 13px;
}

.mission-page-mission-section h3 {
    font-size: 42px;
    font-family: var(--secondary-font);
    color: var(--primary-color);
}

/* values section */
.mission-page-values-section {
    background-color: var(--light-blue);
    padding: 124px 0;
}

.mission-page-values-section .main-block {
    position: relative;
}

.mission-page-values-section .content-block {
    width: 50%;
    color: var(--white);
    background-color: var(--primary-color);
    position: relative;
    z-index: 1;
    padding: 28px 36px;
}

.mission-page-values-section .content-block h3 {
    font-size: 42px;
    font-weight: 500;
    font-family: var(--secondary-font);
    text-transform: capitalize;
    margin-bottom: 21px;
}

.mission-page-values-section .list-item h3 {
    font-size: 22px;
    font-family: 500;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.mission-page-values-section .main-block .img-block {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    width: 60%;
    height: 680px;
}

.mission-page-values-section .img-block img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
}
/* ___________________ mission Page Css end _______________________*/

/* ___________________ service Page Css start _______________________*/
.service-page-service-section {
    padding: 70px 0;
}

.service-page-service-section h3 {
    font-size: 52px;
    font-family: var(--secondary-font);
    color: var(--primary-color);
    font-weight: 500;
    text-transform: uppercase;
    margin-bottom: 27px;
}

.service-page-service-section .main-block p {
    margin-bottom: 58px;
}

.service-page-service-section .box {
    border: 1px solid rgb(246, 246, 246);
    border-radius: 3px;
    background-image: -moz-linear-gradient(
        90deg,
        rgb(239, 250, 255) 0%,
        rgb(255, 255, 255) 100%
    );
    background-image: -webkit-linear-gradient(
        90deg,
        rgb(239, 250, 255) 0%,
        rgb(255, 255, 255) 100%
    );
    background-image: -ms-linear-gradient(
        90deg,
        rgb(239, 250, 255) 0%,
        rgb(255, 255, 255) 100%
    );
    box-shadow: 0px 8px 15px 0px rgba(0, 0, 0, 0.04);
    padding-left: 34px;
    margin-bottom: 38px;
}

.service-page-service-section .box:nth-child(even) .row {
    flex-direction: row-reverse;
}

.service-page-service-section .box:nth-child(even) {
    padding-left: 0;
}

.service-page-service-section .box:last-child {
    margin-bottom: 0;
}

.service-page-service-section .content-block {
    height: 100%;
    padding-top: 51px;
}

.service-page-service-section .content-block .icon-block {
    width: 54px;
    height: 48px;
    margin-bottom: 20px;
}

.service-page-service-section .content-block h4 {
    margin-bottom: 29px;
	margin-bottom: 10px;
    font-size: 37px;
    font-family: var(--secondary-font);
    color: var(--primary-color);
    font-weight: 500;
	line-height: 1;
}

.service-page-service-section .content-block h4 span {
    display: block;
}

.service-page-service-section .content-block p {
    margin-bottom: 0;
	padding-bottom: 10px;
}

.service-page-service-section .box .img-block {
    height: 495px;
}

.service-page-service-section .box .img-block img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
}
/* ___________________ service Page Css end _______________________*/

.service-page-service-section .box {
    scroll-margin-block: 28px;
}

/* ___________________ news Page Css end _______________________*/
.news-page-news-section .feature-section {
    position: sticky;
    top: 20px;
}
.news-page-news-section .search-bar {
    margin-bottom: 25px;
}

.news-page-news-section .search-bar .input-group {
    width: 100%;
    padding: 15px 19px 14px 19px;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 4px 10.92px 1.08px rgba(0, 0, 0, 0.14);
}

.news-page-news-section .search-bar .form-control {
    padding: 11px 0 10px 16px;
    border-radius: 0;
    border: 1px solid var(--primary-color);
}

.news-page-news-section .search-bar .form-control:focus {
    box-shadow: none;
}

.news-page-news-section .search-bar .icon-block {
    background-color: var(--primary-color);
    padding: 0 12px;
    display: flex;
    align-items: center;
}

.news-page-news-section .search-bar .icon-block .fa-magnifying-glass {
    color: var(--white);
    font-size: 26px;
}

.news-page-news-section .recents-post {
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 4px 10.92px 1.08px rgba(0, 0, 0, 0.14);
    padding: 19px 46px 16px 22px;
    margin-bottom: 25px;
}

.news-page-news-section .recents-post h4 {
    font-size: 28px;
    font-weight: 500;
    color: var(--primary-color);
    font-family: var(--secondary-font);
    margin-bottom: 17px;
}

.news-page-news-section .recents-post span {
    position: relative;
}

.news-page-news-section .recents-post span::before {
    content: "";
    width: 100%;
    height: 2px;
    background-color: var(--primary-color);
    position: absolute;
    bottom: 0;
    left: 0;
}

.news-page-news-section .recents-post .list a {
    margin-bottom: 16px;
    display: inline-block;
}

.news-page-news-section .recents-post .list a:last-child {
    margin-bottom: 0;
}

.news-page-news-section .recents-post .list-item {
    display: flex;
    justify-content: space-between;
    color: var(--light-black);
    flex-wrap: wrap;
}

.news-page-news-section .recents-post .list-item p {
    width: calc(100% - 94px);
}

.news-page-news-section .recents-post .list-item p > small{
    display: block;
    font-size: 13px;
    opacity: 0.6;
    font-weight: 400;

}

.news-page-news-section .recents-post .img-block {
    margin-right: 16px;
    width: 78px;
    height: 64px;
}

.news-page-news-section .recents-post .img-block img {
    width: 100%;
    height: 100%;
    line-height: 0;
    object-fit: cover;
}

.news-page-news-section .archives {
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 4px 10.92px 1.08px rgba(0, 0, 0, 0.14);
    padding: 19px 46px 16px 22px;
}

.news-page-news-section .archives h4 {
    font-size: 28px;
    font-weight: 500;
    color: var(--primary-color);
    font-family: var(--secondary-font);
    margin-bottom: 17px;
    position: relative;
    display: inline-block;
}

.news-page-news-section .archives h4::before {
    content: "";
    width: 80%;
    height: 2px;
    background-color: var(--primary-color);
    position: absolute;
    bottom: 0;
    left: 0;
}

.navbar .main-block .logo-block {
    width: 260px;
    margin: 0;
    padding: 0;
}

.navbar .main-block .logo-block a {
    display: block;
	max-width: 100%;
}

.navbar .main-block .logo-block a img{  width:100%; height:auto; }

.news-page-news-section .archives {
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 4px 10.92px 1.08px rgba(0, 0, 0, 0.14);
    padding: 19px 46px 16px 22px;
    margin-bottom: 25px;
}

.news-page-news-section .archives-custom .widget .widgettitle,
.news-page-news-section .archives h4 {
    font-size: 28px;
    font-weight: 500;
    color: var(--primary-color);
    font-family: var(--secondary-font);
    margin-bottom: 17px;
    position: relative;
    display: inline-block;
}

.news-page-news-section .archives-custom .widget .widgettitle::before,
.news-page-news-section .archives h4::before {
    content: "";
    width: 80%;
    height: 2px;
    background-color: var(--primary-color);
    position: absolute;
    bottom: 0;
    left: 0;
}

.news-page-news-section .archives-custom {
    margin: 0;
    padding: 0;
}
.news-page-news-section .archives-custom .widget {
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 4px 10.92px 1.08px rgba(0, 0, 0, 0.14);
    padding: 19px 46px 16px 22px;
    margin-bottom: 25px;
    list-style: none;
}

.news-page-news-section .archives-custom .widget ul li {
    padding-bottom: 15px;
}
.news-page-news-section .archives-custom .widget ul li a {
    font-size: 19px;
    font-weight: 500;
    color: var(--light-black);
    position: relative;
    padding-left: 30px;
}
.news-page-news-section .archives-custom .widget ul li a::before {
    --_s : 20px;
    content: "";
    position: absolute;
    height: var(--_s);
    width: var(--_s);
    background: var(--primary-color);
    left: 0;
    top: 6px;
}

.news-page-news-section .archives .list-item {
    display: flex;
    margin-bottom: 23px;
}

.news-page-news-section .archives .list a:last-child .list-item h5 {
    margin-bottom: 0;
}

.news-page-news-section .archives .squre-box {
    height: 20px;
    width: 20px;
    background-color: var(--primary-color);
    margin-right: 14px;
}

.news-page-news-section .archives h5 {
    font-size: 19px;
    font-weight: 500;
    color: var(--light-black);
}

.news-page-news-section .page-numbers {
    font-size: clamp(1rem, 0.6875rem + 1vw, 1.25rem);
    color: var(--primary-color);
}

.news-page-news-section .page-changer {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
    margin-bottom: 73px;
}

.news-page-news-section .page-changer .current {
    background-color: var(--primary-color);
    padding: 9px 14px 8px;
    color: var(--white);
}


/* Sophos Site in Box Page */
#sophos-site-in-box{
	width: 100%;
	height: 3800px;
}


/*Thank You Page*/
.thank-you-page{
    background-color: #fff;
    text-align: center;
    padding: 80px 0;
    margin: 0;
}

.thank-you-page h2{
    font-size: clamp(2rem, 1.7685rem + 1.2346vw, 3.25rem);
    color: var(--primary-color);
    font-family: var(--secondary-font);
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 30px;
}


/* Security Assessment Section*/
.query-section.security-assessment-section{
	background: #fff;
	padding: 0;
	margin: 0;
}

.query-section.security-assessment-section .main-block {
    padding: 100px 0;
    position: relative;
}

.query-section.security-assessment-section .main-block .form-container {
    width: 100%;
    position: static;
    background-color: var(--primary-color);
    background-image: url("../images/query-bg.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 40px;
    transform: translateY(0);
}


/**
 404 Error Page
*/
.error-page .error-page--content {
    padding: 20px 0 60px 0;
    margin: 0;
}

.error-page .error-page--banner{
    padding: 20px 0;
}

.error-page .error-page--content h1 {
    font-family: var(--secondary-font);
    color: var(--primary-color);
    font-size: clamp(2rem, 1.6759rem + 1.7284vw, 3.75rem);
    line-height: 1;
    padding: 0;
    margin: 0;
}

.error-page .error-page--content h2 {
    font-size: clamp(1rem, 0.8148rem + 0.9877vw, 2rem);
    line-height: 1.1;
    padding: 0;
    margin: 0 0 15px 0;
}



/*____________________________________________
                Media Quaries 
______________________________________________*/

@media only screen and (orientation: landscape) {
    body {
        -webkit-text-size-adjust: none;
    }
}
@media only screen and (orientation: portrait) {
    body {
        -webkit-text-size-adjust: none;
    }
}

@media screen and (max-width: 1699px) {
    .banner-section .img-block {
        right: -50px;
        max-width: 600px;
    }
    /**, ::after, ::before{ outline:1px solid red; }*/
}

@media screen and (max-width: 1399px) {
    .navbar .stellarnav.dark li a {
        font-size: 14px;
        padding: 30px 4px;
    }
    .main-btn {
        padding: 12px 20px 14px 20px;
        display: inline-block;
    }

    /**, after, before{ outline:1px solid red; }*/

    .navbar .main-block .logo-block {
        max-width: 230px;
    }
    .navbar .main-block .logo-block img {
        width: 100%;
        height: auto;
    }
    .banner-section .img-block {
        right: 0;
        max-width: 480px;
    }
    .wo-we-are-section {
        padding-bottom: 50px;
    }
    .how-it-works .list .text h5 {
        margin-bottom: 2px;
    }
    .how-it-works .list-item {
        margin-bottom: 40px;
    }
    .how-it-works .list .text p {
        margin-bottom: 18px;
    }

    .service-section .col-lg-6:nth-child(2n) .row .content-block {
        padding-left: 5px;
    }
    .service-section h4 {
        font-size: 31px;
    }
    .banner-section .content-block h1 {
        --font-size: 62px;
    }
}

@media screen and (max-width: 1199px) {
    .navbar-default {
        padding-top: 8px;
    }
    .stellarnav.dark .menu-toggle span.bars span {
        background: var(--primary-color);
    }
    .navbar .main-block .logo-block {
        order: 1;
    }
    .navbar .main-block .menu-block {
        order: 3;
    }
    .navbar .main-block .main-btn {
        order: 2;
    }

    .navbar .main-block .menu-block .stellarnav.dark .menu-toggle {
        padding: 0;
    }
    .navbar .main-block .menu-block .stellarnav.dark .menu-toggle .bars {
        margin-right: 0;
    }
    .navbar .main-block .menu-block .stellarnav.mobile ul {
        position: absolute;
        width: 100%;
        left: 0;
        z-index: 99;
    }
    .navbar .main-block .menu-block .stellarnav.mobile ul li a {
        color: var(--white);
        padding: 15px 9px;
    }

    .navbar .main-block .menu-block .stellarnav.mobile ul li.active a {
        color: var(--primary-color);
    }
	
	.navbar .main-block .menu-block .stellarnav.mobile ul li .sub-menu li a {
		color: #fff;
	}

    .banner-section .content-block h1 {
        font-size: 45px;
        line-height: 1.2;
    }
    .banner-section .content-block h2 {
        font-size: 18px;
        margin-bottom: 15px;
    }
    .banner-section .img-block {
        max-width: 400px;
    }
    .how-it-works {
        padding-bottom: 40px;
    }
    .how-it-works .main-block h4 {
        font-size: 45px;
    }
    .mission-section-start .list h4,
    .mission-section-start .content-block h3 {
        line-height: 1;
        font-size: 40px;
        margin-bottom: 10px;
    }
    .mission-section-start .content-block p {
        margin-bottom: 50px;
    }
    .mission-section-start {
        padding: 60px 0 20px 0;
    }
}

@media screen and (max-width: 991px) {
    .banner-section .content-block .brand-list .row .col-lg-10 .row .col-lg-3 {
        width: 25%;
    }
    .banner-section .img-block {
        position: initial;
    }
    .service-section .content-block {
        padding: 30px 20px;
    }
    .service-section h4 {
        margin-bottom: 20px;
    }
    .service-section .col-lg-6:nth-child(2n) .row .content-block {
        padding: 30px 20px;
    }
    .service-section h4 span {
        display: inline-block;
    }
    .service-section {
        padding-top: 50px;
    }
    .service-section h3 {
        font-size: 40px;
        margin-bottom: 8px;
    }
    .blog-section h3 {
        font-size: 40px;
        margin-bottom: 10px;
    }
    .blog-section .box .img-block {
        margin: 0;
        padding-bottom: 15px;
    }
    .query-section .img-block {
        width: 100%;
        height: 450px;
    }
    .query-section .main-block .form-container {
        position: initial;
        width: 100%;
    }
    footer .list {
        justify-content: flex-start;
        padding-bottom: 15px;
    }
    footer .icon-box {
        justify-content: flex-start;
        gap: 20px;
    }
    footer h3 {
        margin-bottom: 15px;
    }
	footer .copyright-block {
		display: flex;
		justify-content: center;
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 10px;
	}
}

/*NEW GRID SYSTEM*/
@media screen and (max-width: 768px) {
    .email-section form .yellow-btn {
        width: 100%;
    }
    .email-section .btn-box .wpcf7-spinner {
        right: 0;
    }
    .wo-we-are-section .main-block {
        flex-direction: column;
    }
    .wo-we-are-section .main-block .lt-block,
    .wo-we-are-section .main-block .rt-block {
        width: 100%;
    }
    .wo-we-are-section .main-block .rt-block {
        padding-top: 30px;
    }
    .wo-we-are-section .content-block h4 {
        margin-bottom: 10px;
    }
    .how-it-works .list .circle::after {
        display: none;
    }

    .mission-section-start .content-block p {
        margin-bottom: 20px;
    }
    .query-section form h3 {
        font-size: 40px;
    }
    .banner-section {
        padding-top: 70px;
    }
    .banner-section .content-block h1 {
        font-size: 38px;
        line-height: 1.1;
    }
    .how-it-works .img-block {
        left: 0;
    }
}

@media screen and (max-width: 575px) {
    .banner-section .content-block .button-block .main-btn {
        display: block;
        width: max-content;
    }
    .banner-section .content-block .button-block .border-btn {
        margin-left: 0;
        display: inline-block;
        margin-top: 5px;
    }
    .banner-section .content-block h1 {
        margin-bottom: 20px;
    }
    .banner-section .content-block .button-block {
        margin-bottom: 20px;
    }
    .banner-section .content-block .brand-list .row .col-lg-10 .row .col-lg-3 {
        width: 33%;
    }
    .banner-section .content-block .list-item {
        margin-bottom: 10px;
    }
    .how-it-works .main-block h4 {
        margin-bottom: 25px;
    }

    .wo-we-are-section .main-block .rt-block .content-block {
        padding-left: 12px;
        padding-right: 12px;
    }

    #managedPopup .modal-content {
        --_size: 200px;
        --_gap: 20px;
        color: #fff;
    }
	
	.query-section.security-assessment-section .main-block .form-container {
		padding: 10px;
	}
}

@media screen and (max-width: 500px) {
    .navbar .main-block {
        flex-wrap: wrap;
    }
    .navbar .main-block .logo-block {
        width: 100%;
        max-width: 100%;
        margin-bottom: 17px;
        text-align: center;
    }
    .navbar-default {
        background: #155fad08;
        padding: 10px 0;
    }

    .banner-section {
        padding-bottom: 0;
    }
    .wo-we-are-section {
        margin-top: -40px;
    }
    .how-it-works .list .text h5 {
        font-size: 25px;
    }
    .how-it-works .list .text p {
        --font-size: 15px;
    }
    .email-section h3 {
        font-size: 35px;
    }
    .email-section form .yellow-btn {
        font-size: 20px;
    }

    #managedPopup .modal-content {
        flex-direction: column;
    }

    #managedPopup .modal-content .img-block {
        display: none;
    }

    #managedPopup .modal-content .rt-block {
        width: 100%;
    }
}

@media screen and (max-width: 400px) {
    .banner-section .content-block .brand-list .row .col-lg-10 .row .col-lg-3 {
        width: 50%;
    }
}

@media screen and (max-width: 350px) {
}