@font-face {
    font-family: 'Creato Display';
    src: url(/fonts/CreatoDisplay-Light.otf);
    font-weight: 300;
    font-display: swap;
    letter-spacing: 0.5px;
}
@font-face {
    font-family: 'Creato Display';
    src: url(/fonts/CreatoDisplay-Regular.otf);
    font-weight: 400;
    font-display: swap;
    letter-spacing: 0.5px;
}
@font-face {
    font-family: 'Creato Display';
    src: url(/fonts/CreatoDisplay-Medium.otf);  
    font-weight: 500;
    font-display: swap;
    letter-spacing: 0.5px;
}
@font-face {
    font-family: 'Creato Display';
    src: url(/fonts/CreatoDisplay-Bold.otf);
    font-weight: 600;
    font-display: swap;
    letter-spacing: 0.5px;
}
@font-face {
    font-family: 'Creato Display';
    src: url(/fonts/CreatoDisplay-ExtraBold.otf);   
    font-weight: 700;
    font-display: swap;
    letter-spacing: 0.5px;
}
@font-face {
    font-family: 'Creato Display';
    src: url(/fonts/CreatoDisplay-Black.otf);
    font-weight: 900;
    font-display: swap;
    letter-spacing: 0.5px;
}
*{font-family: 'Creato Display' !important; letter-spacing: 0.3px;word-wrap:break-word}
html, body{font-size: 16px;background-color: black;color: #fff;}
:root{
    --bs-danger-rgb: 225, 26, 44;
}
a{color: inherit;text-decoration: none;}
.mt-n4{margin-top: -1.5rem}
.navbar-blur {
    background-color: rgba(0, 0, 0, 0.10);
    backdrop-filter: blur(60px);
    -webkit-backdrop-filter: blur(60px);
}
.navbar-dark .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.85);
    font-size: 1.125rem;
}
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
    color: #fff;
}
.big-title{font-size: 6rem;line-height: 1.2;}
.mobile-chat{margin-bottom: -130px;}
.sec-title{
    font-size: 4rem;line-height: 1.1;
}
.sol{
    background-color: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(34px);
    -webkit-backdrop-filter: blur(34px);
    box-shadow: 0 8px 17px 2px rgba(0, 0, 0, 0.12);
}
.chat-sec{
    background-image: url(/images/app_bg.svg);
    background-size: 25%;
    background-position: 60% 0;
    background-repeat: no-repeat;
}
.dashboard{
    background-image: url(/images/bg1.png);
    background-size: 35%;
    background-position: 100% 0;
    background-repeat: no-repeat;
}
.grad{
    background-image: linear-gradient(45deg, #FF9447, #9747FF, #E11A2C);
    -webkit-filter: blur(300px);
    filter: blur(300px);
}
.cta-section{
    background-color: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(134, 134, 134, 0.25);
    box-shadow: inset 0 21px 82px -30px rgba(255, 241, 243, 0.25);
    -webkit-backdrop-filter: blur(300px);
    backdrop-filter: blur(300px);
    border-radius: 8px;
}
.left-chat {
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}
.right-chat {
    top: 50%;
    right: 0;
    transform: translateY(50%);
}
.sticky {
    position: fixed;
    bottom: 3rem;
    right: 1rem;
    z-index: 9;
}
.sticky.whatsapp{
    bottom: 8rem;
}
.btn-outline-light > img{transition: .2s ease;}
.btn-outline-light:hover > img{filter:brightness(0)}
.blur{backdrop-filter: blur(60px);}
.sticky-title{transition: all .3s ease;}
.homevid{width: 100%; margin: 0 auto; display: block;}
.page-title{ font-size: 8rem; line-height: 1.2;}
.page-sub{font-size: 1.5rem; line-height: 1.7;}
.inner-banner{
    background-size: cover;
    background-position: 50%;
    min-height: calc(100vh - 73px);
}
.inner-banner.contact{
    background-image: url(/images/contact-bg.jpg);
}
.inner-banner.about{
    background-image: url(/images/about-bg.jpg);
}
.inner-banner.product{
    background-image: url(/images/product-bg.jpg);
}
.contact-sec{
    background-image: url(/images/contact-sec.png);
    background-size: auto;
    background-position: 0 100%;
    background-repeat: no-repeat;
}
.contact-form .form-control::placeholder{
    opacity: .5;
    color: #fff;
}
.team-slider .slick-list{
    padding: 3.5rem 0 0 !important;
}
.team-slider .slick-slide{
    transition: all .5s ease;
}
.team-slider .slick-slide:not(.slick-center){
    margin-top: 4rem;
}
.team-slider .slick-dots{
    bottom: -2.5rem;
}
.team-slider .slick-dots li button:before{
    color: #fff;
    font-size: 1rem;
}
.team-slider .slick-dots .slick-active button:before{
    color: #E11A2C;
}
.why-sec{
    background-color: rgba(255, 255, 255, 0.02);
    background-image: url(/images/why-bg.png);
    background-size: auto;
    background-position: 0 100%;
    background-repeat: no-repeat;
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
    box-shadow: 0 8px 57px 0px rgba(149, 0, 255, 0.15);
}
.security-card{
    padding: 2rem;
    -webkit-backdrop-filter: blur(300px);
    backdrop-filter: blur(300px);
    background: linear-gradient(0deg, rgba(153, 153, 153, 0.1), rgba(255, 255, 255, 0.1));
    transform-origin: center;
    position: relative;
}
.ct-patch{
    transition: .5s ease;
}
.laptop-screen{
    position: absolute;
    top: 7.2%;
    left: 50%;
    transform: translateX(-50%);
    width: 75%;
}




/*===============Media Query================*/
/*===============Media Query================*/
@media (min-width: 1200px){
    .homevid {max-width: 80%;}
}
@media (min-width: 768px){
    .left-chat {
        top: 50%;
        left: 0;
        transform: translate(-50%, -30%) rotate(-15deg);
    }
    .right-chat {
        top: 50%;
        right: 0;
        transform: translate(50%, 25%);
    }
    .security-card.soc{transform: rotate(-19deg)}
    .security-card.iry{transform: rotate(7deg)}
    .me-md-n2{margin-right: -.5rem;}
    .ms-md-n2{margin-left: -.5rem;}
}

@media (min-width: 1200px) and (max-width:1399px){
    .page-title{ font-size: 7rem}
}
@media (min-width: 992px) and (max-width: 1199px){
    .page-title{ font-size: 5rem}
}
@media (max-width: 991px) {
    .page-title{ font-size: 4rem}
}
@media (max-width: 767px) {
    .big-title{font-size: 3rem;}
    .sec-title{font-size: 2.5rem;}
    .chat-sec,.dashboard{background-size: 100%;}
    .grad{-webkit-filter: blur(80px);filter: blur(80px);}
    .sticky>img{width: 50px;}
    .sticky.whatsapp{bottom: 6.5rem;}
    .page-title{font-size: 3rem;}
    .page-sub{font-size: 1.25rem;}
}
