@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,700&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css");

body{ font-family:Montserrat !important; background:#fff; font-size:15px; cursor:default;}
::selection{ color:#fff; background:#254b97;} ::-moz-selection{ color:#fff; background:#254b97;} ::-webkit-selection{ color:#fff; background:#254b97;}
*{ outline:none !important; text-decoration:none !important; list-style:none;} ul, li{ padding:0; margin:0; list-style:none;}
h1,h2,h3,h4,h5,h6{ font-family:Montserrat !important;}
.title-div{ display:inline-block; width:100%; margin-bottom:60px; position:relative;}
.title-div h1, .title-div h2{ color:#130f49; font-weight:600; margin-bottom: 15px; font-size: 36px;}
.title-div.large h1, .title-div.large h2{ font-size:60px;}
.title-div.medium h1, .title-div.medium h2{ font-size:48px;}
.title-div.small h1, .title-div.small h2{ font-size:30px;}
.title-div.center{ text-align:center;}
.title-div small{ font-size:18px; color:#848994; font-weight:500;}
.title-div.bold h1, .title-div.bold h2{ font-weight:700;}
.title-div h1 span, .title-div h2 span{ color:#296ac0;}
.uc{ text-transform: uppercase !important;}
.mt50{ margin-top: 50px !important;}
.mt20{ margin-top: 20px;}
.btn-primary{ border-radius: 50px; padding: 20px 50px; background: linear-gradient(63deg, rgba(255,96,26,1) 0%, rgba(255,141,26,1) 100%); color: #fff; font-size: 18px; font-weight: 700; border: none; box-shadow: 0 5px 15px -3px rgba(0,0,0,.15) !important;}
.btn-primary i{ position: relative; top: 1px;}

.banner-section{ float: left; width: 100%; padding: 40px 0; background: linear-gradient(0deg, rgba(187,232,255,1) 0%, rgba(240,250,255,1) 100%); min-height: 720px; text-align: center;}
.logo{ max-width: 150px; margin: auto;}
.logo img{ width: 100%;}
.banner-section h1{ margin: 40px 0 30px; font-size: 48px; font-weight: 700; color: #254b97;}
.banner-section p{ font-size: 24px; font-weight: 500; color: #4d5b77;}
.banner-section .caption{ max-width: 900px; margin: auto;}

.content-section{ float: left; width: 100%; padding-bottom: 60px;}
.content-section .card{ max-width: 900px; margin: auto; border: none; text-align: left; padding: 50px; background: #fff; border-radius: 10px; box-shadow: 0 3px 15px -3px rgba(0,0,0,.15); position: relative; margin-top: -60px;}
.content-section .card p{ font-size: 19px; line-height: 30px; color: #2a3246;}

.content-section ol.numberic.icon li{ padding: 10px 20px 10px 55px; position: relative; font-size: 17px; margin-bottom: 10px; counter-increment: my-sec-counter; box-shadow: 0 5px 15px -3px rgba(0,0,0,.1);  border-radius: 50px; display: inline-block; font-weight: 400;}
.content-section ol.numberic.icon li:before{ position: absolute; content: ''; width: 42px; height: 42px; border-radius: 100%; background: rgba(12,172,255,.15); left: 0px; top: 0; bottom: 0; margin: auto; content: "0" counter(my-sec-counter) ""; color: #0050db; text-align: center; font-size: 18px; font-weight: 600; line-height: 42px;}
.sec-2 .title-div{ margin-bottom: 70px;}
.graphics-box{ width: 100%; max-width: 450px; margin: auto;}
.graphics-box img{ width: 100%;}
.numberic.icon{ padding-left: 0;}

.content-wrap{ max-width: 900px; margin: auto; padding: 60px; background: #e8f6fd; border: solid 4px #fff; box-shadow: 0 0px 0px 3px #296ac0; border-radius: 15px; position: relative; margin-top: -50px;}
.content-wrap p{ line-height: 24px; margin-bottom: 0; font-weight: 500; color: #495764; margin-bottom: 20px; font-size: 17px;}
.content-wrap p strong{ color: #254b97;}

.rounded{ border-radius: 100% !important; overflow: hidden; position: relative; z-index: 1;}
.graphics-box.med{ max-width: 350px; border: solid 4px #fff; box-shadow: 0 0px 0px 3px #296ac0;}

.feedback-section{ float: left; width: 100%; padding: 70px 0; background: #f5f8f9;}
.feedback-section .graphics-box{ min-height: 370px; background: #fff; border-radius: 10px !important; overflow: hidden !important; box-shadow: 0 8px 15px -3px rgba(0,0,0,.1); display: block; transition: all 0.2s ease-out;}
.feedback-section .graphics-box:hover{ box-shadow: 0 0px 0px 3px rgba(37,75,151,.7);}

.pd-top-60{ padding-top: 60px;}
.bgLight{ /*background: linear-gradient(180deg, rgba(226,245,255,1) 0%, rgba(255,255,255,1) 100%);*/ border-top: solid 1px #eee; }
.bgLight .title-div{ margin-bottom: 40px;}

.comp-section{ float: left; width: 100%; padding: 70px 0; background: #f2fbff;}
.comp-section .card{ border-radius: 15px; overflow: hidden; border: none;}
.comp-section .card-header{ padding: 25px 35px; font-size: 20px; font-weight: 700; border-bottom: none; background: #ccebfb; color: #254b97;}
.comp-section .card-body{ padding: 35px;}
.icon-bullet li{ margin-bottom: 15px; position: relative; padding-left: 40px; font-size: 17px;}
.icon-bullet li:before{ position: absolute; content: '\F622'; font-family: bootstrap-icons !important; left: 0; color: #ee5b5b; font-size: 24px; top: -5px; bottom: 0; margin: auto;}
.icon-bullet.green li:before{ content: '\F26A' !important; color: #4dbd48;}
.icon-bullet.green li:last-child{ margin-bottom: 0;}
.comp-section .card-group{ border-radius: 15px; box-shadow: 0 5px 15px 1px rgba(0,0,0,.1);}
.btn-primary.sm{ padding: 12px 45px;}
.title-div.mb40{ margin-bottom: 40px !important;}
.bg{ background: url(../images/email-bg.png) no-repeat right bottom;}
.comp-section .card:last-child .card-body{ display: flex; align-items: end;}
.icon-bullet.green{ margin-bottom: 10px;}
.w550{ max-width: 550px;}

footer{ float: left; width: 100%; margin-top: 50px;}
footer .nav-link{ color: #111 !important; padding: 5px 15px !important;}
footer .nav-link:hover{ color: #296ac0 !important;}
footer .logo{ width: 200px !important;}
footer a{ color: #254b97; font-weight: 600;}

.cookie-popup{ position: fixed; left: 15px; bottom: 15px; max-width: 360px;}
.cookie-popup .btn{ padding: 10px 25px; font-size: 15px; border-radius: 5px; font-weight: 500;}
.cookie-popup p{ font-size: 13px;}
.cookie-popup .card{ border-radius: 10px; border: none; box-shadow: 0 5px 15px 1px rgba(0,0,0,.15); padding: 5px;}
.cookie-popup .btn-primary{ background: #296ac0; border: solid 1px #296ac0 !important;}

.content-section .card{ padding: 30px;}
.banner-section.sml{ min-height: auto;}
.content-section .card ol, .content-section .card ul{ margin-left: 0 !important; padding-left: 0 !important;}
.content-section .card strong{ white-space: none !important;}
.content-section .card ol li strong span, .content-section .card p strong span, .content-section .card h4{ font-size: 1.3rem !important; font-weight: 700 !important;}
.content-section .card p, .content-section .card p span{ line-height: 27px !important; margin-bottom: 10px !important; font-size: 15px !important; font-family: Montserrat !important;}
.content-section .card h4{ margin-top: 20px;}
.modal .btn-primary{ padding: 10px 30px; font-size: 16px;}
.modal-content{ border: none; border-radius: 10px;}
.modal-header{ padding: 0.8rem 1rem; border-bottom: none;}
.modal-header h1{ font-size: 1.1rem !important; font-weight: 600;}
.modal .form-control{ box-shadow: none !important; border-radius: 8px;}
.modal-footer{ border-top: 0; padding-top: 0;}
.modal-body{ padding-bottom: 0;}


@media (max-width: 1199px) {
    .icon-bullet li{ font-size: 15px;}
    .comp-section .card-header{ font-size: 16px;}

}

@media (max-width: 991px) {
    .banner-section h1{ font-size: 36px;}
    .banner-section p{ font-size: 18px;}
    .banner-section{ min-height: auto; padding-bottom: 130px;}
    .content-wrap{ padding: 70px 30px 30px;}
    .feedback-section .graphics-box{ min-height: auto;}
    .card-group{ display: inline-block; width: 100%; box-shadow: none !important; background: none !important;}
    .comp-section .card{ border-radius: 15px !important; box-shadow: 0 5px 15px 1px rgba(0,0,0,.1) !important;}
    .card-group .card:last-child{ margin-top: 15px !important;}
    .title-div.mb40{ margin-top: 50px;}

}

@media (max-width: 640px) {
    .title-div h1, .title-div h2{ font-size: 26px !important;}
    .btn-primary{ padding: 12px 40px; font-size: 15px;}
    .content-section .card{ padding: 20px;}
    .sec-2 .title-div{ margin-bottom: 20px;}
    .graphics-box{ margin-bottom: 30px;}
    .content-section ol.numberic.icon li{ box-shadow: none;}
    .content-section, .feedback-section, .comp-section{ padding: 30px 0 !important;}
    .title-div{ margin-bottom: 20px;}
    .comp-section .card-body, .comp-section .card-header{ padding: 15px;}
    .title-div.mb40{ margin-top: 0px !important;}
    .banner-section.sml{ padding-bottom: 30px;}
    .content-section .card .card-body{ padding: 0;}
    .banner-section h1{ font-size: 24px; margin-bottom: 20px;}
    .banner-section p{ font-size: 16px;}
    .logo{ max-width: 110px;}
    .banner-section{ padding-bottom: 70px;}
    .content-section{ padding: 15px 0 !important;}
    .content-section ol.numberic.icon li{ font-size: 15px;}
    .content-wrap{ padding: 40px 15px 15px;}
    .content-wrap p{ font-size: 15px; font-weight: 400;}
    .banner-section.sml h1{ margin-bottom: 35px;}
    .content-section .card ol li strong span, .content-section .card p strong span, .content-section .card h4{ font-size: 1rem !important;}
    .content-section .card p, .content-section .card p span{ font-size: 14px !important; line-height: 24px !important;}

}