:root{
    --green: #2abbaf;
    --yellow: #FDB84A;
    --grey: #707070;
    --blue: #1B5E76;
    --dark-grey: #505050;
    --heading : #3E3E3E;
    --section-2: #F8F8F8;
    --icon-bg: #F8F8F8;
    --font-body: 16px;
    --sec-border: #C3C3C3;
    --inputBorder: #1B5E76;
}


*{
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif;
}

section{
    padding-top: 90px;
    padding-bottom: 90px;
}

a{
    text-decoration: none !important;
    color: initial;
}

/* Button CSS Start */
.sid1btn{
    border-radius: 10px;
    padding: 14px 51px;
}

.slider .sid1btn:hover {
    background: transparent !important;
    border: 1px solid var(--green);
}

.slider .sid1btn:hover a{
    color: var(--green);
}

.slider .sid1btn a{
    color: white;
    text-decoration: none;
}

.single-platform .sid1btn:hover {
    background: var(--green) !important;
    border: 1px solid var(--green);
}

.single-platform .sid1btn:hover a{
    color: var(--white);
}

.single-platform .sid1btn a{
    color: var(--green);
    text-decoration: none;
}

.btn:focus{
    box-shadow: none;
}

/* Button CSS End */

/* Navbar CSS Start */

/* hamburger custom */

.navbar-toggler{
    width: 20px;
    height: 20px;
    margin: 5px;
    position: relative;
    transition: 0.5s ease-in-out;
}

.navbar-toggler,
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus{
    outline: none;
    box-shadow: none;
    border: 0;
}

.navbar-toggler span{
    margin: 0;
    padding: 0;
}

.toggler-icon{
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: var(--heading);
    border-radius: 1px;
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: .25s ease-in-out;
}

.middle-bar {
    margin-top: 0px;
}

    /* when Clicked */

.navbar-toggler .top-bar {
    margin-top: 0px;
    transform: rotate(135deg);
}

.navbar-toggler .middle-bar{
    opacity: 0;
    filter: alpha(opacity=0);
}

.navbar-toggler .bottom-bar{
    margin-top: 0px;
    transform: rotate(-135deg);
}

/* State where the navbar is collapsed */

.navbar-toggler.collapsed .top-bar{
    margin-top: -20px;
    transform: rotate(0deg);
}

.navbar-toggler.collapsed .middle-bar{
    opacity: 1;
    filter: alpha(opacity=100);
}

.navbar-toggler.collapsed .bottom-bar{
    margin-top: 20px;
    transform: rotate(0deg);
}

/* hamburger custom */

.navbar{
    background-color: white;
    padding: 12px 0;
}

.navbar-brand {
    margin-left: 50px;
    margin-right: 70px;
}

.navbar-brand img{
    height: 85px;
}

.nav-link{
    color: var(--grey);
}

.navbar .nav-item{
    height: 85px;
}

.navbar .active a{
    color: var(--blue);
    font-weight: 700;
}

.navbar .nav-item:hover a{
    color: var(--blue);
    font-weight: 700;
}

.navbar .nav-item:hover .active{
    color: var(--heading);
}

.navbar .nav-item a:focus{
    color: var(--heading);
}

.nav-link:hover{
    color: var(--dark-grey);
}

nav .trial{
    color: var(--blue);
    border-color: var(--blue);
    margin-left: 30px;
    margin-right: 40px;
    letter-spacing: 0.5px;
    font-size: 15px;
    font-weight: bold;
    padding: 9px 30px;
    border-radius: 10px;
}

nav .trial:hover{
    background-color: var(--blue);
    border-color: var(--blue);
}

nav .trial:hover a{
    color: white;
}

nav .trial a{
    text-decoration: none;
    color: var(--blue);
}

nav .login{
    color: white;
    font-size: 15px;
    font-weight: bold;
    letter-spacing: 0.5px;
    margin-right: 15px;
    background-color: var(--yellow);
    border-color: var(--yellow);
    padding: 9px 37px;
    border-radius: 10px;
}

nav .login:hover{
    color: var(--yellow);
    border-color: var(--yellow);
    background-color: transparent;
}

.navBg.scrolled {
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.10);
    background-color: white;
}

.navBg.togBg{
    background-color: white;
}

nav .social-group{
    margin: 0px;
}

nav .social-group .social-list{
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 1px solid var(--blue);
    color: var(--blue);
}

nav .social-group .social-list a, nav .social-group .social-list a:visited{
    color: var(--blue);
}

nav .social-group .social-list:hover a{
    color: white;
}

nav .social-group .social-list:hover{
    background: var(--blue);
    color: white;
}

.navbar .btn.active{
    background: var(--blue);
    border: 1px solid var(--blue);
    color: white;
}

.navbar .btn.active:hover{
    background: transparent;
    color: var(--blue);
}


/* nav .dropnav{
    position: relative;
}

nav .dropdown-toggle{
    position: absolute;
    left: 90px;
    top: 0px;
} */

.dropdown-menu{
    padding: 6px 11px;
    border-top: 3px solid var(--green);
    border-radius: 0 0 8px 8px;
}

.dropdown-menu li {
    border-bottom: 1px dashed;
    padding-bottom: 8px;
    padding-top: 8px;
}

.dropdown-menu li:last-child {
    border-bottom: none;
}

nav .dropdown-menu .head{
    font-size: 17px;
    display: inline;
    color: var(--heading);
    font-weight: 600;
    margin-left: 1rem;
    padding: 3.5px 0px;
    background: transparent;
}

nav .dropdown-menu .head:after {
    display:block;
    content: '';
    border-bottom: solid 1.8px var(--heading);  
    transform: scaleX(0);  
    transition: transform 250ms ease-in-out;
}

nav .submenu a, nav .submenu a:visited{
    color: var(--grey);
    text-decoration: none;
}

nav .dropdown-item{
    font-weight: 400 !important;
}

nav .dropdown-item:hover{
    color: var(--green) !important;
    font-weight: 700 !important;
}

nav .dropdown-item.active{
    color: var(--green) !important;
    background: transparent;
    font-weight: 700 !important;
}

nav .submenu.active a{
    color: var(--heading);
    font-weight: 700;
}

.submenu.btn:focus, .dropdown-toggle.btn:focus {
    box-shadow: none !important;
}

nav .btn-group .dropdown-toggle{
    padding: 0px 2px;
}

.dropdown-item:hover{
    background: transparent;
    color: var(--green);
}

.dropdown-item:active{
    background: transparent;
    color: var(--green);
}

nav .dropdown-menu .head:hover:after { transform: scaleX(1); }
nav .dropdown-menu .head:after{  transform-origin:  0% 50%; }

.navbar .dropdown-toggle::after{
    display: none;
}

.navbar .dropdown-toggle .arrow{
    color: var(--grey);
}

.navbar .dropdown-toggle .arrowR{
    transform: rotate(180deg) !important;
}

.navbar .btn-group:hover a, .nav-link:hover{
    color: var(--heading);
    font-weight: 700;
}

.navbar .btn-group:hover .dropdown-toggle .arrow{
    color: var(--heading);
    transform: rotate(180deg);
}

.navbar-toggler:focus{
    box-shadow: none;
}

/* Navbar Responsive */
@media (max-width: 1253px) {
    .navbar-brand{
        margin-right: 20px;
    }
}

@media (max-width: 992px) {

    .btn-group {
        display: block;
        padding: 0px;
    }

    .navbar .btn-group:hover .dropdown-toggle .arrow{
        color: var(--heading);
        transform: rotate(0deg);
    }

    .btn-group button {
        padding-left: 0px;
        padding-right: 3px;
    }

    .btn-group .dropdown-menu{
        width: 40%;
    }

    .navbar .navbar-collapse {
        padding-bottom: 15px;
    }

    .navbar .nav-item {
        height: auto;
    }

    .navbar-brand {
        margin-left: 0px;
    }

    nav .trial{
        margin-left: 0px;
    }

    nav .social-group {
        margin-bottom: 15px;
    }
}

@media all and (min-width: 992px) {
	.navbar .btn-group .submenu ~ .dropdown-menu{ display: none; }
	/* .navbar .btn-group:hover .nav-link{   } */
	.navbar .btn-group:hover .submenu ~ .dropdown-menu{ display: block; position: absolute; top: 100%; left: 0; margin-top: 0.125rem;}
	.navbar .btn-group ~ .dropdown-menu{ margin-top: 0.125rem; }
}	

@media (min-width: 1200px) {
    .navbar-expand-lg .navbar-nav .nav-link {
        padding-right: 25px;
        padding-left: 25px;
    }

    nav .btn-group .submenu{
        padding-left: 25px;
    }
    
    nav .btn-group .dropdown-toggle{
        padding-right: 25px;
    }
}

@media (max-width: 320px) {
    .nav .login{
        margin-top: 15px;
    }
}

/* Navbar CSS End */

/* Record CSS Start */

.sec-common{
    background: var(--section-2);
}

.sec-common .card{
    background: transparent;
}

.sec-common .logo{
    margin-bottom: 70px;
}

.sec-common .heading.record-title{
    margin-bottom: 20px;
    letter-spacing: normal;
    line-height: 33px;
}

.sec-common .heading{
    font-size: 25px;
    letter-spacing: 0.2px;
    font-weight: 700;
    color: var(--blue);
    margin-bottom: 32px;
}

.sec-common .card-body{
    padding: 0px;
}

.sec-common .testimonial-desc{
    font-size: 18px;
    padding-top: 20px;
    /* margin-bottom: 29px; */
    /* margin-bottom: 113px; */
    font-weight: 400;
    color:  var(--heading);
}

.sec-common .image-area{
    padding: 0px 32px;
}

.sec-common .image{
    filter: drop-shadow(0px 0px 6px #0000001A);
    border-radius: 15px;
}

.sec-common ul{
    font-weight: 200;
    color:  var(--heading);
    font-size: 18px;
    line-height: 32px;
    padding: 0px;
    list-style: none;
    margin-bottom: 0px;
}

.sec-common ul li {
    padding-bottom: 3px;
    color: var(--heading);
    font-weight: 400;
}

.sec-common ul li span{
    padding-left: 19px;
    display: block;
}

.sec-common button{
    font-weight: 700;
    padding: 14px 25px 14px 50px;
    border: 1px solid var(--blue);
    background: transparent;
    /* margin-top: 85px; */
    font-size: 16px;
    border-radius: 10px;
}

.sec-common button a, .sec-common button a:active, .sec-common button a:visited{
    color: var(--blue);
}

.sec-common button svg {
    margin-left: 27px;
}

.sec-common button:hover {
    background: var(--blue);
}

.sec-common button:hover a, .sec-common button:hover a svg path{
    color: white;
    fill: white;
}

.sec-common ul li .arrow{
    padding-left: 0px;
    padding-right: 7px;
}

.sec-common ul .arrow::before{
    content: '➔';
    padding-right: 7px;
}


.sec-common .content{
    background-color: white;
    margin-bottom: 60px;
}

.sec-common .content .content-c{
    padding: 44px 0px;
}

/* Record Responsive */

@media (min-width:1392px) {

}

@media (max-width: 992px) {
    
    .sec-common .text-area{
        padding: 0 32px;
    }

    .sec-common .card-body{
        padding: 0px;
    }

    .sec-common .image{
        border-radius: 5px;
    }
}

@media (max-width: 426px) {
    .sec-common .heading{
        font-size: 27px;
    }

    .sec-common .testimonial-desc{
        font-size: 18px;
    }
}

@media (max-width: 320px) {
    .sec-common .card-title {
        font-size: 26px;
    }

    .sec-common .testimonial-desc {
        font-size: 16px;
    }
}

/* Record CSS End */

/* termCondition CSS Start */

section.termCondition{
    padding: 90px 0px;
}

.termCondition .heading{
    font-size: 18px;
    color: var(--blue);
    font-weight: 700;
    margin: 0 0 15px;
    text-transform: uppercase;
}

.termCondition p, .termCondition .subheading{
    font-size: 14px;
    color: var(--termConditionPara);
    font-weight: 400;
    margin: 0 0 25px;
    line-height: 1.6;
}

.termCondition .subheading {
    font-weight: 700;
    color: var(--subHeading);
}

.termCondition .list-item {
    list-style: disc;
    padding-left: 15px;
    margin: 0 0 25px;
}

.termCondition .list-item>li {
    color: var(--legalPara);
    margin: 0 0 20px;
}


.tab-tp{
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 50px;
}

.termCondition .trial{
    color: var(--blue);
    border-color: var(--blue);
    margin-right: 20px;
    letter-spacing: 0.5px;
    font-size: 15px;
    font-weight: bold;
    padding: 12px 45px;
    border-radius: 10px;
}

.termCondition .trial.active {
    background-color: var(--blue);
    color: white;
}

.termCondition .trial.active:hover {
    background-color: transparent;
    color: var(--blue);
}

.termCondition .trial:hover{
    background-color: var(--blue);
    border-color: var(--blue);
}

.termCondition .trial:hover{
    color: white;
}

.termCondition .trial a{
    text-decoration: none;
    color: var(--blue);
}

/* Responsive termCondition Css */
@media (max-width:768px) {
    section.termCondition{
        padding: 120px 20px;
    }
}

@media (max-width: 550px) {
    .tab-tp{
        padding-bottom: 30px;
        flex-direction: column;
    }
}

@media (max-width: 426px) {
    section.termCondition{
        padding: 50px 20px;
    }
}

@media (max-width: 320px) {
    section.termCondition{
        padding: 50px 20px;
    }
}
/* termCondition CSS End */



/* Get In touch Start */
.any-details{
    padding: 0 32px;
}
.upgrade{
    /* padding-top: 114px; */
    padding: 58px 0px;
    background: var(--blue);
}

.upgrade h4{
    font-size: 32px;
    font-weight: 700;
    color: white;
}

.upgrade p{
    font-size: 20px;
    color: var(--grey);
}

.upgrade .buying{
    padding: 18px 32px 0 32px;
    /* border-top: 1px solid var(--sec-border); */
}

.upgrade .buying h4{
    font-size: 24px;
}

.upgrade .buying h4 span{
    color: var(--green);
}

.upgrade .buy{
    color: white;
    border-color: white;
    font-size: 18px;
    font-weight: 700;
    border-radius: 10px;
    padding: 9px 30px;
}

.buy a{
    color: white;
    text-decoration: none;
}

.buy:hover a{
    text-decoration: none;
    color: var(--blue);
}

.upgrade .buy:hover{
    background-color: white;
    border-color: white;
    color: var(--blue);
}

/* Get In touch Responsive CSS */
@media (max-width: 768px) {
    .upgrade p br{
        display: none;
    }
    .upgrade .buying{
        padding: 45px 32px 0 32px;
    }

    .upgrade .trial {
        margin-right: 25px;
    }
}

@media (max-width: 424px) {
    .upgrade h4{
        font-size: 27px;
    }

    .upgrade .buying h4{
        font-size: 27px;
    }

    .upgrade .trial {
        margin-right: 0px;
    }
}

/* Get In touch End */

/* Footer CSS */

footer{
    background: linear-gradient(#FFFFFF, #29B9AD 350%);
}


footer .footer{
    margin: 70px 80px 20px 80px;
    border-bottom: 1px solid var(--blue);
}

.footer-logo{
    padding: 60px 80px 0px 80px;
}

.footer-logo img{
    width: 230px;
}

.footer .plt{
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer .plt li{
    padding-right: 40px;
    color: var(--blue);
}

.footer .plt li a:hover, .footer .plt li a, .footer .plt li a:visited{
    color: var(--blue);
}

footer .social-group .social-list{
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 1px solid var(--blue);
    color: var(--blue);
}

footer .social-group .social-list a, footer .social-group .social-list a:visited{
    color: var(--blue);
}

footer .social-group .social-list:hover a{
    color: white;
}

footer .social-group .social-list:hover{
    background: var(--blue);
    color: white;
}

footer h4 a{
    color: var(--heading);
    text-decoration: none;
}

footer .list-title{
    /* position: relative;
    font-style: italic; */
    font-size: 21px;
    font-weight: 700;
    line-height: 24px;
    color: var(--heading);
}

/* footer .list-title::after{
    content: '';
    position: absolute;
    background: var(--grey);
    height: 1px;
    width: 60px;
    bottom: -12px;
    left: 0;
} */

footer .list-group .list-item{
    color: var(--heading);
    font-size: 14px;
    font-weight: 500;
}

footer .list-title-sub{
    color: var(--heading);
    font-weight: 400;
    font-size: 18px;
}

.footer .list-group .list-item-sub{
    color: var(--heading);
    font-size: 14px;
    font-weight: 500;
    padding-left: 15px;
    position: relative;
}

.footer .list-group .list-item-sub::before{
    content: '-';
    font-size: 14px;
    font-weight: 500;
    left: 3px;
    position: absolute;
}

.footer .contact-list a, .footer .contact-list a:visited{
    color: var(--heading);
    font-weight: 500;
    text-decoration: none;
}

.footer .contact-list a:hover{
    color: var(--green);
}

.footer_bottom{
    padding-bottom: 15px;
    color: var(--blue);
    font-size: 18px;
    font-weight: 200;
}

.footer_bottom p, .footer_bottom p a, .footer_bottom ul>li>a { 
    margin: 0; 
    font-size: 18px; 
    color: var(--blue);
    font-weight: 500;
    text-decoration: none;
}

.footer_bottom ul {
    margin-bottom: 0px;
    padding: 0px;
}

.footer_bottom ul>li {
    display: inline-block;
}
.footer_bottom ul>li>a { 
    padding: 0 0 0 10px; 
    display: block;
}
.footer_bottom ul>li>a::after {
    content: "|";  
    padding-left: 10px;
}
.footer_bottom ul>li:last-child a::after {
    content: none;
}

.footer_bottom .copyright{
    padding: 0px 20px;
}

/* Footer Responsive */

@media (max-width: 992px) {
    footer .footer{
        margin: 40px 0px 0px 32px;
        padding: 0px 0px 20px 0px;
    }
    
    .footer-logo{
        padding: 60px 32px 0 32px;
    }
}

@media (max-width: 720px) {

    .footer .plt li {
        padding-right: 30px;
    }
}

@media (max-width: 424px) {

    .footer_bottom p {
        font-size: 16px;
    }

    .footer .plt{
        flex-direction: column;
    }

    .footer .plt li{
        padding-bottom: 5px;
    }
    
    .footer_bottom ul>li a::after {
        content: none;
    }

    .footer_bottom ul{
        padding: 0px;
    }
}

/* Footer CSS End */


/* ----
Responsive CSS 
----*/

@media (min-width: 1320px) {
    .text-area{
        padding: 0 44px;
        line-height: 25px;
    }
}

@media (max-width:768px) {
    section {
        padding-top: 90px;
        padding-bottom: 90px;
    }
}

@media (max-width: 426px) {
    section {
        padding-top: 50px;
        padding-bottom: 50px;
    }
}

@media (max-width: 320px) {
    section {
        padding-top: 50px;
        padding-bottom: 50px;
    }
}