/* Pre-loader stylings */
.preloader-img {
    width: 18rem;
    position: absolute;
    top:0;
    bottom:0;
    left:0;
    right: 0;
    margin: auto;
}
/* Style the video: 100% width and height to cover the entire window */
#myVideo {
    width: 100vw;
    position: absolute;
    top:0;
    bottom:0;
    left:0;
    right: 0;
    margin: auto;
}
/*.spinner{*/
/*    width: 60px;*/
/*    height: 60px;*/
    
/*    border: 2px solid #f3f3f3;*/
/*    border-top:3px solid #00a3e5;*/
/*    border-radius: 100%;*/
    
/*    position: absolute;*/
/*    top:10rem;*/
/*    bottom:0;*/
/*    left:0;*/
/*    right: 0;*/
/*    margin: auto;*/
    
/*    animation: spin 1s infinite linear;*/
/*}*/

/*@keyframes spin {*/
/*    from{*/
/*        transform: rotate(0deg);*/
/*    }to{*/
/*        transform: rotate(360deg);*/
/*    }*/
/*}*/
#overlay{
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 99999;
	background-color: #fff;
}
/*.loader{*/
/*    border: 0 soild transparent;*/
/*    border-radius: 50%;*/
/*    width: 150px;*/
/*    height: 150px;*/
/*    position: absolute;*/
/*    top: calc(65vh - 75px);*/
/*    left: calc(50vw - 75px);*/
/*}*/
/*.loader:before, .loader:after{*/
/*    content: '';*/
/*    border: 1em solid #00A3E5;*/
/*    border-radius: 50%;*/
/*    width: inherit;*/
/*    height: inherit;*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    animation: loader 2s linear infinite;*/
/*    opacity: 0;*/
/*}*/
/*.loader:before{*/
/*    animation-delay: .5s;*/
/*}*/
/*@keyframes loader{*/
/*    0%{*/
/*        transform: scale(0);*/
/*        opacity: 0;*/
/*    }*/
/*    50%{*/
/*        opacity: 1;*/
/*    }*/
/*    100%{*/
/*        transform: scale(1);*/
/*        opacity: 0;*/
/*    }*/
/*}*/


/* Quote icon stylings starts here */
.quote-icon-main-div {
    position: fixed;
    right: 50px;
    bottom: 50px;
    cursor: pointer;
}

/* Quote icon stylings ends here */

/* Popup stylings starts here */
.popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
}
.contentBox {
    width: 600px;
    height: 400px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    border: 1px solid rgb(170, 170, 170, 0.5);
    padding: 20px;
}
.quote-heading {
    color: #363636;
}
/* Popup stylings ends here */

/* Carousel stylings starts here */
.carousel-indicators {
    position: absolute;
    right: 0;
    bottom: -60px;
    left: 0;
    z-index: 2;
    display: flex;
    justify-content: center;
    padding: 0;
    margin-right: 15%;
    margin-bottom: 1rem;
    margin-left: 15%;
    list-style: none;
}
.carousel-indicators [data-bs-target] {
    width: 18px;
    height: 0px;
    border-radius: 20px;
}
.carousel-indicators button {
    background: #00a3e5 !important;
    width: 9px;
    height: 9px;
}
.carousel-caption {
    left: 10%;
    bottom: 7.25rem;
    right: 53%;
    text-align: left;
}
.banner-heading {
    color: #363636;
    font-weight: 500;
    font-size: 60px;
}
.banner-heading2 {
    color: #363636;
    font-weight: 500;
    font-size: 43px;
}
.yellow-btn {
    background: #FFCC00;
    border-radius: 20px;
    font-size: 16px;
    padding: 8px 32px;
    color: #363636;
    cursor: pointer;
}
/* Carousel stylings ends here */

/* Mobile stylings starts here */
.banner-heading-mobile {
    color: #363636;
    font-weight: 500;
    font-size: 30px;
}
/* Mobile stylings ends here */

/* Our valued services starts here */
.valued-services-main-div {
    margin-top: 70px;
    background: url('../images/our_values_services.png');
    padding-top: 160px;
    padding-bottom: 40px;
    background-size: cover;
    max-width: 100vw;
    height: 100%;
}
.valued-services-heading {
    font-weight: 500;
    font-size: 32px;
    line-height: 70px;
    display: flex;
    align-items: center;
    color: #FFCC00;
}
.valued-services-subheading {
    margin-top: 24px;
    margin-bottom: 40px;
    max-width: 707px;
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #FFFFFF;
}
.service-main-div {
    background: #FFFFFF;
    box-shadow: 20px 20px 30px rgba(0, 101, 142, 0.5);
    border-radius: 0px 30px;
    padding: 79px 48px 36px 47px;
    margin-bottom: 40px;
    min-height: 360px;
}
.service-main-div:hover {
    border: 4px solid #FFCC00;
}
.services-icon {
    width: 50px;
}
.services-heading {
    font-weight: 500;
    font-size: 20px;
    line-height: 20px;
    display: flex;
    align-items: center;
    color: #363636;
}
.services-text-div {
    width: 261px;
}
.services-text {
    font-weight: 300;
    font-size: 14px;
    line-height: 20px;
    color: #6D6E71;
}
.services-readmore {
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    display: flex;
    align-items: center;
    color: #00A3E5;
}
/* Our valued services ends here */

/* Why securus starts here */
.why-securus-main-div {
    background-color: #003760;
    padding-top: 160px;
    padding-bottom: 40px;
    background-size: cover;
    max-width: 100vw;
    height: 100%;
}

/* swiper-js styles starts here */
.swiper {
    width: 309px;
    height: 436px;
  }

  .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0px 20px;
    font-size: 22px;
    font-weight: bold;
    color: #fff;
  }

  .swiper-slide {
    background-color: rgb(255, 255, 255);
  }

  .swiper-slide-content {
    padding: 24px;
    display: flex;
    flex-direction: column;
  }
  .swiper-slide-content-heading {
    font-weight: 500;
    font-size: 30px;
    line-height: 30px;
    display: flex;
    align-items: center;
    color: #003760;
    margin: 15px 0;
  }
  .swiper-slider-content-text {
    font-style: normal;
    font-weight: 300;
    font-size: 14px;
    color: #6D6E71;
  }
/* swiper-js styles ends here */

.why-securus-mobile-main-div {
    background: #fff;
    border-radius: 0px 20px;
    padding: 24px;
}
.why-securus-mobile-img {
    width: 100%;
}
.why-securus-img {
    border-radius: 0px 10px 0px 10px;
}
/* Why securus ends here */


/* statistics stylings starts here */
.stat-main-div {
    background: url('../images/statistic_bg.png');
    padding-top: 40px;
    padding-bottom: 40px;
    background-size: cover;
    max-width: 100vw;
    height: 100%;
}
.stat-heading {
    font-size: 32px;
    line-height: 70px;
    display: flex;
    align-items: center;
    text-align: center;
    color: #FFFFFF;
}
.stat-content-main-div {
    border-left: 5px solid yellow;
    padding-left: 19px;
}
.stat-number {
    font-weight: 500;
    font-size: 64px;
    line-height: 70px;
    color: #FFFFFF;
}
.stat-text {
    font-weight: 300;
    font-size: 22px;
    color: #FFFFFF;
}

/* statistics stylings ends here */

/* Testimonials starts here */
.testimonials-main-div {
    background: #F3F4F6;
    padding: 160px 222px;
}
.testimonials-heading {
    font-weight: 500;
    font-size: 32px;
    line-height: 70px;
    color: #00A3E5;
}
.testimonials-subheading {
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    color: #6D6E71;
}
.testimonial-card {
    background: #FFFFFF;
    border-radius: 0px 30px;
    padding: 44px 48px;
}
.testimonial-card-heading {
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    color: #363636;
}
.testimonial-card-star {
    color: #FFCC00;
}
.testimonial-card-text {
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #6D6E71;
}
.customer-name {
    font-weight: 500;
    font-size: 18px;
    line-height: 20px;
    text-align: center;
    color: #363636;
}
/* Testimonials ends here */

/* Contact-form stylings starts here */
.contact-form-main-div {
    background: url('../images/contact-form-bg.png');
    padding-top: 80px;
    padding-bottom: 40px;
    background-size: cover;
    max-width: 100vw;
    height: 100%;
}
.left-heading {
    font-weight: 500;
    font-size: 42px;
    line-height: 46px;
    display: flex;
    align-items: center;
    color: #FFCC00;
}
.left-text {
    font-weight: 300;
    font-size: 16px;
    color: #FFFFFF;
    margin-top: 24px;
}
/* Contact-form stylings ends here */

/* Addresses starts here */
.address-main-div {
    background: #F3F4F6;
    padding: 80px 0px;
}
.address-heading {
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: #00A3E5;
}
.address-details {
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    color: #363636;
}
/* Addresses ends here */

/* Footer starts here */
.social-icon {
    width: 35px;
    margin-bottom: 15px;
    transition: transform .5s;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.social-icon:hover {
    transform: scale(1.2);
}
.footer-main-div {
    padding: 80px 0px;
}
.footer-heading {
    font-weight: 500;
    font-size: 24px;
    line-height: 32px;
    color: #00A3E5;
}
.footer-points {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #363636;
}
.footer-points a {
    color: #363636;
}
.footer-base a {
    color: #363636;;
}
.footer-securus-details {
    color: #989898;
    font-weight: 200;
    font-size: 12px;
}
/* Footer ends here */

/* Inner pages banner styles starts here */
.carousel-caption-about {
    left: 10%;
    bottom: 7.25rem;
    right: 53%;
    text-align: left;
}
@media screen and (min-width: 768px) {
    .carousel-caption-about {
        bottom: 0rem !important;
    }
}
/* Inner pages banner styles ends here */

/* Join our team starts here */
.join-us-main-div {
    background: url('../images/join-team-bg.png');
    padding-top: 160px;
    padding-bottom: 160px;
    background-size: cover;
    max-width: 100vw;
    height: 100%;
}
.join-our-team-heading {
    font-weight: 500;
    font-size: 32px;
    color: #FFFFFF;
    text-align: center;
}
/* Join our team ends here */

/* Media queries starts here */
@media screen and (max-width: 576px) {
    .why-securus-main-div {
        padding-top: 80px;
    }
    .swipe-text-arrow {
        display: none;
    }
    .testimonials-main-div {
        padding: 80px 20px;
    }
    .testimonial-carousel-pc {
        display: none;
    }
    .stat-number{
        font-size: 40px;
    }
}
@media screen and (min-width: 576px) {
    .testimonial-carousel-mobile {
        display: none;
    }
}
@media screen and (min-width: 576px) and (max-width: 768px) {
    .why-securus-main-div {
        padding-top: 80px;
    }
    .swipe-text-arrow {
        display: none;
    }
    .testimonials-main-div {
        padding: 80px 20px;
    }
}
@media screen and (min-width: 768px) {
    .carousel-caption {
        bottom: 1.75rem;
    }
    .banner-heading {
        font-size: 30px;
    }
    .banner-heading2 {
        font-size: 24px;
    }
    .banner-subheading {
        font-size: 15px;
    }
    .swiper {
        width: 309px;
        height: 436px;
    }
    .testimonials-main-div {
        padding: 90px 40px;
    }
}
@media screen and (max-width: 992px) {
    .stat-text {
        font-size: 15px;
    }
}
@media screen and (min-width: 992px) {
    .carousel-caption {
        bottom: 2.75rem;
    }
    .banner-heading {
        font-size: 34px;
    }
    .banner-heading2 {
        font-size: 28px;
    }
    .banner-subheading {
        font-size: 19px;
    }
    .why-securus-main-div {
        background: url('../images/why-securus-bg-sm.png');
        padding-top: 160px;
        padding-bottom: 40px;
        background-size: cover;
        max-width: 100vw;
        height: 100%;
    }
    .testimonials-main-div {
        padding: 90px 40px;
    }
}

@media screen and (min-width: 1200px) {
    .carousel-caption {
        bottom: 2.75rem;
    }
    .banner-heading {
        font-size: 60px;
    }
    .banner-heading2 {
        font-size: 43px;
    }
    .banner-subheading {
        font-size: 19px;
    }
    .testimonials-main-div {
        padding: 160px 222px;
    }
}
/* Media queries ends here */