@charset "utf-8";
@import url('../fonts/fonts.css');
/* CSS Document */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}ol, ul {list-style: none;}blockquote, q {quotes: none;}blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}.table-responsive {padding: 0 0 20px 0 !important;}table {border-collapse: collapse;border-spacing: 0;}body {position: relative;line-height: 1;color:white;font-family: 'Degular Display' !important;}input{font-weight: 400;position: relative;border-radius: 10px !important;height: 50px;color: black;font-size: 12px;margin: 0 0 15px 0;padding: 0 25px;}input::placeholder,textarea:placeholder {color: #cccccc !important;text-transform: capitalize !important;}textarea{color: black;resize: none;}.form-control:focus {box-shadow: none;}img {object-fit: cover;object-position: center;transition: all .3s ease;} input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button {-webkit-appearance:none;}input[type=number] {-moz-appearance:textfield;} button {background: transparent;border: 0;}video {width: 100%;object-fit: cover;object-position: center;}strong {font-weight: 900;}::selection {color: white;background: var(--py);}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {display: none;}
/*hover end here*/



/* default-css start */


:root {

    --py: #123940;
    --sy: #0096AC;
    --white : #fff;
    --black: #000;

}
.p-300{padding: 247px 0;}
.p-80{padding: 80px 0;}
.p-60{padding: 60px 0;}
.p-70{padding: 70px 0;}


h1 {font-size: 151px;}
h2 {font-size: 115px;line-height: 115px;font-weight: 300;}
h3 {font-size: 60px;}
h4 {font-size: 38px;}
h5 {font-size: 27px;}
h6 {font-size: 24px;line-height: 28px;}
p {font-size: 17px;font-weight: 400;margin-top: 40px;line-height: 25px;color: #666666;}
a {font-size: 21px;line-height: 25px;font-weight: 400;display: inline-block;-webkit-transition: all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition: all .2s ease-in-out;text-decoration: none !important;position: relative;color: var(--white);}
.container-fluid{padding: 0 170px ;}
button{font-size: 24px;-webkit-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;text-decoration: none !important;padding: 0;position: relative;}
a:hover{color: #cfcfcf;}
a span, button span {position: relative;z-index: 1;}

.py:hover {color: var(--white);}
.py{color: var(--py);}
.py-bg{background: var(--py);color: var(--white);}
.sy{color: var(--sy);}

.py-btn {cursor: pointer;border: 1px solid var(--py);background: var(--white);padding: 12px 40px;border-radius: 12px;color: var(--py);margin: 30px 0 0 0;font-weight: 600;text-transform: capitalize;overflow: hidden;font-size: 16px;}
.py-btn:hover,.py-btn:focus {color: var(--white);background: var(--py); border: 1px solid var(--white);}

.danger-bg{color: white;background: #fe502e;padding: 7px 5px 5px 5px !important;border-radius: 5px;line-height: 0 !important;}
.danger-bg p {padding: 0 0 !important;line-height: 13px !important;color: white !important;border: 0px !important;font-size: 10px !important;}
.text-danger {font-size: 12px !important;font-weight: 600 !important;line-height: 18px !important;color: #f63b3b;}

/*default-css end*/



/* header start */
.navbar-brand img,
footer img {
    width: 70px;
}
/* header end */
 

/* home-banner start */

.home-banner {
    position: relative;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* home-banner end */
header {
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
    padding: 32px 50px;
}

header ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

header ul li a {
    font-size: 19px !important;
    text-transform: capitalize;
    margin: 0 0 0 40px;
    color: white !important;
}

header ul li a.nav-bt {
    background: var(--white);
    color: var(--py) !important;
    font-weight: 500;
    border-radius: 12px;
    padding: 12px 30px !important;
}

.home-banner li {
    font-size: 24px;
    margin: 10px 20px;
}

.home-banner video {
    position: absolute;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    top: 0;
    left: 0;
    z-index: -1;
    left: 0;
    right: 0;
}

.home-banner h1 {
    font-weight: 100;
}
.purpose {
}

.purpose h2 {
    color: var(--py);
}

.purpose .container-fluid {
}

.purpose h2 span.sy {
    font-weight: 400;
}

.brand, .purpose, .relationship,.latest {
    background: #E4E9EC;
}

.brand h3 {
    color: var(--py);
    font-weight: 600;
    margin: 0 0 60px 0;
}

.brand .item img {
    width: 100%;
    height: 614px;
    border-radius: 10px;
}

.brand .brand-btn img {
    width: auto;
    height: auto;
    margin: 0 0 0 10px;
}

.brand .brand-btn {
    background: #e4e9ec;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: 500;
}

.brand .brand-btn:hover img {
    filter: contrast(0) brightness(2);
}

.relationship h2 {
    margin: 240px 0 0 170px;
    color: var(--py);
    font-weight: 100;
    position: relative;
    z-index: 9;
}

.relationship .main {
    margin: 0 0 0 180px;
}

.relationship h2 span > span {
    font-weight: 600;
}
.relationship .box {
    padding: 20px;
    border: 3px solid transparent;
    border-radius: 20px;
    position: absolute;
    transition: border .3s ease-in-out;
}

.relationship .img-box img {
    border-radius: 10px;
    width: 100%;
    height: 100%;
}

.relationship .box a img {
}

 
.img-box {}

.box-1 .img-box {width: 100%; /* This will now take effect */}
.inner-box {
    position: relative;
}

.content-box {
    position: absolute;
    background: #0000007d;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    padding: 30px;
    border-radius: 10px;
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s ease-in-out;
}

.content-box a img {
    margin: 0 0 0 5px;
}

.content-box a {
    text-transform: capitalize;
}

.relationship .box-1 {
    top: -230px;
    left: 550px;
    width: 380px;
    height: 245px;
}
.relationship .box:hover .content-box {
    visibility: visible;
    opacity: 1;
}

.relationship .box-1 .inner-box, .relationship .box-1 .img-box {
    width: 334px;
    height: 198px;
}
.relationship .box-2 .inner-box, .relationship .box-2 .img-box {}

.relationship .box-2 {
    right: 290px;
    top: -170px;
    width: 455px;
    height: 300px;
}

.relationship .box-4 {
    width: 495px;
    right: 450px;
    bottom: -250px;
}

.relationship .box-3 .inner-box, .relationship .box-3 .img-box {width: 100%;height: 200px;}

.relationship .box-4 .inner-box, .relationship .box-4 .img-box {
    width: 100%;
    height: 254px;
}

.relationship .box.box-3 {
    width: 380px;
    height: 245px;
    bottom: -190px;
    left: 230px;
}

.relationship .box:hover {
    border-color: var(--sy);
}
.latest h3 {
    text-align: center;
    color: var(--py);
    font-weight: 600;
    margin: 0 0 60px 0;
}

.latest .box {
    background: #dbe0e3;
    border-radius: 20px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.latest .box img {
    width: 100%;
    border-radius: 15px;
}

.latest .box  h5 {
    color: black;
    margin: 30px 0 30px 0;
}

.latest .box h4 {
    color: var(--py);
    margin-bottom: 30px;
}

.latest .box a {
    width: 100%;
    padding: 20px;
    text-align: center;
    font-size: 23px;
    background: transparent;
    margin-top: auto;
}

.latest .box a:hover {
    border-color: black;
    color: black;
}

.latest .text-center a {
    background: #e4e9ec;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: 500;
}

.latest .text-center a:hover {
    background: var(--py);
}

.latest .text-center a img {
    margin: 3px 0 0 10px;
}

.latest .text-center a:hover img {
    filter: contrast(0) brightness(2);
}
footer{background: url('/wp-content/uploads/2025/05/Asset-1@2x.png');background-size: cover;padding: 50px 70px 320px 70px;overflow: hidden;position: relative;}
footer p {
    color: white;
    margin: 0 0 0 60px;
    width: 65%;
}

footer a {margin: 0 0 10px 0;}

footer  h1 {
    font-size: 200px;
    font-weight: 100;
    text-align: center;
    position: absolute;
    bottom: -46px;
    width: 100%;
    left: 0;
    right: 0;
    overflow: hidden;
}
header ul li a.nav-bt:hover {
    background: var(--py);
    color: white !important;
}

button.navbar-toggler {
    color: white !important;
    background: var(--py);
}

span.navbar-toggler-icon {
    --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}


/* hey */
/*======================= responsive start here==============*/
@media (max-width: 1660px) 
{
	.p-300{padding: 150px 0;}  
    .relationship h2 {
        margin: 240px 0 0 90px;
    }
    
    .relationship .box-1 {
        left: 420px;
    }
    
    .relationship .box-2 {
        right: 150px;
    }
    
    .relationship .box.box-3 {
        left: 160px;
    }
    
    .relationship .box-4 {
        right: 300px;
    }
    
    footer {
        padding: 50px 70px 220px 70px;
    }
}
@media (max-width: 1440px) 
{
	.brand img {
    height: 500px;
}
    .latest h3 {
        margin: 60px 0;
    }
    .home-banner h1 {
        font-size: 100px;
    }
    
    .home-banner.p-300 {
        padding: 200px 0;
    }
    
    h3 {
        font-size: 50px;
    }
    
    .relationship h2 {
        margin: 240px 0 0 40px;
        font-size: 90px;
        line-height: 95px;
    }
    
    h2 {
        font-size: 80px;
        line-height: 85px;
    }
    
    .relationship .box-4 {
        right: 200px;
    }
    
    .relationship .box-1 {
        left: 240px;
    }
    
    .latest .box h5 {
        font-size: 20px;
    }
    
    .latest .box h4 {
        font-size: 25px;
        line-height: 30px;
    }
    
    .latest .box a {
        font-size: 20px;
    }
    
    footer h1 {
        font-size: 150px;
        bottom: -36px;
    }
    
    footer a {
        font-size: 18px;
        line-height: 21px;
    }
    .p-300{padding: 120px 0;}  
 
}
@media (max-width: 1280px) {

	.relationship .box.box-3 {
    width: 280px;
    height: 195px;
}

.relationship .box-3 .inner-box, .relationship .box-3 .img-box {
    height: 150px;
}
    .relationship .box.box-3 {
    bottom: -140px;
    left: 150px;
    }
	.relationship .box-1 .inner-box, .relationship .box-1 .img-box {
    width: 284px;
    height: 148px;
}

.relationship .box-1 {
    width: 330px;
    height: 195px;
    top: -170px;
}

.relationship .box:hover .content-box h4 {
    font-size: 26px;
}

.relationship .box:hover .content-box {
    padding: 20px;
}

.content-box a {
    font-size: 16px;
}

.relationship .box-2 {width: 405px;height: 250px;top: -130px;}

.relationship .box-2 .inner-box, .relationship .box-2 .img-box {
    width: 355px;
    height: 200px;
}

.relationship .box-4 {
    width: 390px;
    bottom: -196px;
}

.relationship .box-4 .inner-box, .relationship .box-4 .img-box {
    height: 195px;
}

.relationship h2 {
    margin: 180px 0 30px 0px;
}

footer {
    padding: 50px 70px 150px 70px;
}

.latest .box a {
    font-size: 18px;
    padding: 15px;
}

.latest .box h4 {
    font-size: 20px;
    line-height: 25px;
}

.latest .box h5 {
    margin: 20px 0;
    font-size: 18px;
}
	 .brand img {
    height: 420px;
}

}
@media (max-width:1199px) {

	.latest .text-center a {
    font-size: 18px;
}

.latest .box a {
    font-size: 18px;
}
	.relationship .box-2 {
    top: -160px;
    right: 90px;
}

.relationship .box-1 {
    top: -190px;
}

.brand img {
    height: 320px;
}
	.brand h3 {
    margin: 0 0 30px 0;
}

.relationship h2 {
    font-size: 70px;
    line-height: 75px;
}

	.p-300{padding: 100px 0;}  
}
@media (max-width: 1050px) {

	footer h1 {
    font-size: 100px;
    bottom: -24px;
}

.home-banner h1 {
    font-size: 80px;
    line-height: 85px;
}

.home-banner li {
    font-size: 20px;
    margin: 10px;
}

.relationship h2 {
    font-size: 60px;
    line-height: 65px;
}

footer p {
    margin: 0 0 0 30px;
    width: 90%;
}

 
}
@media (min-width: 768px) and (max-width: 991px) {
	 .brand h3 {
    font-size: 40px;
}

.relationship .box-1 {
    width: 270px;
    height: 175px;
    left: 170px;
    top: -160px;
}

.relationship .box-1 .inner-box, .relationship .box-1 .img-box {
    width: 100%;
    height: 150px;
}

.relationship h2 {
    font-size: 50px;
    line-height: 55px;
}

.relationship .box-2 {
    width: 345px;
    height: 220px;
}

.relationship .box-2 .inner-box, .relationship .box-2 .img-box {
    width: 100%;
    height: 194px;
}

.relationship .box-4 {
    width: 300px;
    height: 196px;
    bottom: -176px;
    right: 210px;
}

.relationship .box-4 .inner-box, .relationship .box-4 .img-box {
    width: 100%;
    height: 170px;
}

.relationship .box.box-3 {
    width: 220px;
    height: 155px;
}

.relationship .box-3 .inner-box, .relationship .box-3 .img-box {
    height: 130px;
}

.relationship .box:hover .content-box {
    padding: 15px;
}

.relationship .box {
    padding: 10px;
}

footer h1 {
}
    .p-300{padding: 80px 0;}  
}

@media (max-width: 767px) {

	.brand img {
    height: 250px;
}
.brand h3 {
    font-size: 30px;
    line-height: 35px;
}

.purpose h2 {
    font-size: 40px;
    line-height: 45px;
}

.latest .box h4 {
    font-size: 18px;
    line-height: 21px;
}


.home-banner h1 {
    font-size: 60px;
    line-height: 65px;
}

.container-fluid {
    padding: 0 50px;
}

.relationship .box {
}

.relationship .box-1 {
}

.relationship .box-2 {
    right: 30px;
}

.relationship .box-3 {
}

.relationship .box.box-3 {
    left: 20px;
}

.relationship .box.box-4 {
    right: 20px;
}

.latest .box {
    margin: 0 0 20px 0;
}

footer p {
    margin: 0 0 40px 30px;
}

footer {
    padding: 50px 70px 100px 70px;
}

footer h1 {
    bottom: -24px;
}
	
    .brand h3 {
    font-size: 40px;
}

.relationship .box-1 {
    width: 270px;
    height: 175px;
    left: 20px;
    top: -160px;
}

.relationship .box-1 .inner-box, .relationship .box-1 .img-box {
    width: 100%;
    height: 150px;
}

.relationship h2 {
    font-size: 50px;
    line-height: 55px;
}

.relationship .box-2 {
    width: 345px;
    height: 220px;
}

.relationship .box-2 .inner-box, .relationship .box-2 .img-box {
    width: 100%;
    height: 194px;
}

.relationship .box-4 {
    width: 300px;
    height: 196px;
    bottom: -176px;
    right: 210px;
}

.relationship .box-4 .inner-box, .relationship .box-4 .img-box {
    width: 100%;
    height: 170px;
}

.relationship .box.box-3 {
    width: 220px;
    height: 155px;
}

.relationship .box-3 .inner-box, .relationship .box-3 .img-box {
    height: 130px;
}

.relationship .box:hover .content-box {
    padding: 15px;
}

.relationship .box {
    padding: 10px;
}

footer h1 {
}
	.p-300{padding: 60px 0;}  
	 
	
}
@media (max-width: 576px) {

	.brand img {
    height: 180px;
}

.relationship .box {
    position: initial;
    width: 100% !important;
    height: 210px !important;
}

.relationship h2 {
    margin: 30px 0 20px 0;
    font-size: 45px;
}

.relationship h2 br {
    display: none;
}

.relationship .main {
    margin: 0;
}

.container-fluid {
    padding: 0 15px;
}

.relationship .box .inner-box, .relationship .box .img-box {
    height: 100% !important;
}

.p-300 {
    padding: 40px 0;
}

.latest h3 {
    margin: 0 0 30px 0;
}

footer {
    padding: 50px 15px 60px 15px;
    text-align: center;
}

footer h1 {
    font-size: 50px;
    bottom: -10px;
}

footer p {
    margin: 20px 0;
    width: 100%;
}
	 
}

 
@media (max-width: 375px) 
{
	 

}
@media (min-width: 0px) and (max-width: 991px) {
	div#navbarNavAltMarkup {
        background: var(--py);
        margin: 10px 0 0 0;
        border-radius: 20px;
        padding: 20px;
    }
     h1 {/* font-size: 40px; *//* line-height: 45px; */}
     h2 {font-size: 50px;line-height: 55px;}
     h4 {font-size: 22px;}
     h5 {font-size: 20px;}
     h6 {font-size: 18px}  
}
/*======================= responsive end here==============*/