@import url(https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap);a,a:hover,body,html{color:#0b0b0b}.copyright,body,html{font-size:18px;font-weight:400}.copyright,ul.social-media{position:absolute;width:100%}.home-section ul,ul.social-media{margin:0;list-style:none;display:flex}.btn-read,.btn-read:hover,a{text-decoration:none}*,::after,::before{box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;outline:0}body,html{font-family:Inter,sans-serif;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding:0;margin:0;background:#2e4966!important}a{transition:.5s;-webkit-transition:.5s;-moz-transition:.5s;display:inline-block}.pd-5{padding:0 5px}.md-5{margin:0 -5px}.copyright{bottom:10px;text-align:center;z-index:111;color:#fff}.copyright a{color:#fff}ul.social-media{padding:0;justify-content:center;left:0;bottom:50px}ul.social-media li{margin:0 5px}ul.social-media li a{width:38px;text-align:center;height:38px;line-height:37px;border:1px solid #fff;color:#fff;border-radius:50%;font-size:14px;display:block}ul.social-media li a:hover{background:#fff;color:#00bf63}.home-section{width:100%;padding:0;height:100vh;overflow:hidden;position:relative;background:#000}.home-section video{width:100%;height:100%;position:absolute;top:0;left:0;right:0;bottom:0;object-fit:cover;opacity:.2}.home-section .content-area{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;z-index:2;flex-direction:column;padding: 200px 100px 100px 100px;}.home-section .content-area h1{font-family:Inter,sans-serif;color:#fff;font-size:80px;font-weight:900;line-height:80px;margin:40px 0;max-width:850px}.home-section .content-area h1 span{color:#ca1d22}.home-section .logo{width:180px}.black-owned img,.home-section .logo img,.photo img{width:100%}.home-section ul{padding:0;gap:25px}.home-section ul.social-media li img,.home-section ul.social-media li svg{height:38px;width:auto}.black-owned{position:absolute;top:200px;right:100px;width:180px;z-index:6}.photo{position:absolute;bottom:0;right:0;width:40%;z-index:6}.btn-read{display:-webkit-box;display:-ms-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-transform:capitalize;border:1px solid var(--main-color);border:1px solid #fff;border-radius:6px;position:relative;overflow:hidden;-webkit-transition:.3s;transition:.3s}.btn-read .text{position:relative;z-index:2;padding:15px 60px;text-align:center;color:#fff;font-size:24px;font-weight:300;line-height:24px;-webkit-transition:.7s;transition:.7s}.btn-read:hover .text{color:#000;-webkit-transition:.7s;transition:.7s}.btn-read:hover span{width:350px;height:350px}.btn-read span{position:absolute;content:"";width:20px;height:20px;left:0;top:0;background:#fff;z-index:0;border-radius:100%;-webkit-transition:.7s;transition:.7s;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.ai-for-black-commuity{padding:30px 0;color:#fff}@media (max-width:1460px){.home-section .content-area{padding:180px 50px 50px}.home-section .logo{width:160px}.black-owned{top:z0px;right:50px;width:160px}.home-section .content-area h1{font-size:60px;line-height:70px;margin:30px 0}}@media (min-width:768px) and (max-width:1024px){.photo{width:70%}}@media (max-width:767px){.blog-img{width:auto!important;height:28px!important}.home-section .content-area{padding:25px}.home-section .logo{width:100px}.black-owned{width:100px;top:110px;right:25px}.home-section .content-area h1{font-size:36px;line-height:44px}.btn-read .text{padding:10px 40px;font-size:20px}.home-section ul{gap:15px}.home-section ul li svg{height:28px;width:28px}.home-section ul li img{height:25px!important;width:50px important}.photo{width:100%;z-index:2}}
html, body {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 18px;
    color: #000;
    line-height: 1.5;
    padding: 0;
    margin: 0;
}
a {
    text-decoration: none;
    transition: all .5s ease;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    display: inline-block;
}


/*.blog-page{padding: 80px 0}*/
/*.blog-page .blog-block{position: relative; margin: 0 0 50px 0; display: flex; align-items: center;}*/
/*.blog-page .blog-block .blog-photo{position: relative; width: 50%; height: 450px; overflow: hidden; border-radius: 15px}*/
/*.blog-page .blog-block .blog-photo img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover; transform: scale(1); transition: all .5s ease;}*/
/*.blog-page .blog-block .blog-info{background: #fff; width: 60%; margin-left: -10%; position: relative; z-index: 1; padding: 30px; border-radius: 20px; -webkit-box-shadow: 0px 0px 24px 0px rgba(217,217,217,0.5); -moz-box-shadow: 0px 0px 24px 0px rgba(217,217,217,0.5); box-shadow: 0px 0px 24px 0px rgba(217,217,217,0.5);}*/
/*.blog-page .blog-block .blog-info .blog-name{font-size: 24px; color: #044ED7; font-weight: 700; margin: 0 0 20px 0; line-height: 24px}*/
/*.blog-page .blog-block .blog-info p{font-size: 16px; color: #000; opacity: 0.5; line-height: 24px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; margin: 0px 0px 20px 0px}*/
/*.blog-page .blog-block .blog-info ul.info{margin: 0px 0px 20px 0px; padding: 0px; list-style: none; display: flex;}*/
/*.blog-page .blog-block .blog-info ul.info li{font-size: 15px; line-height: 15px; color: #9b9b9b; margin-right: 40px; position: relative;}*/
/*.blog-page .blog-block .blog-info ul.info li i{margin-right: 10px; font-size: 16px; color: #000}*/
/*.blog-page .blog-block .blog-info ul.info li:before{content: ''; position: absolute; top: 5px; right: -21.5px; width: 6px; height: 6px; border-radius: 50%; background: #CEDFFF}*/
/*.blog-page .blog-block .blog-info ul.info li:last-child::before{content: none}*/
/*.blog-page .blog-block .blog-info .btn-read{font-size: 16px; color: #000; text-transform: uppercase; letter-spacing: 1px; display: flex; align-items: center; width: 100%; justify-content: flex-start; line-height: 16px;}*/
/*.blog-page .blog-block .blog-info .btn-read svg{margin-left: 10px; width: 16px; height: 16px; transition: all .5s ease;}*/
/*.blog-page .blog-block .blog-info .btn-read:hover svg{margin-left: 20px; transition: all .5s ease;}*/
/*.blog-page .blog-block:nth-of-type(2n+2){flex-direction: row-reverse;}*/
/*.blog-page .blog-block:nth-of-type(2n+2) .blog-info{margin-left: auto; margin-right: -10%}*/
/*.blog-page .blog-block:hover .blog-photo img{transform: scale(1.1); transition: all .5s ease;}*/

/*.blog-detail-page{padding: 40px 0}*/
/*.blog-detail-page h2{font-size: 36px; color: #044ED7; font-weight: 700; margin: 0 0 30px 0; line-height: 36px; text-align: center;}*/
/*.blog-detail-page ul.info{margin: 0px 0px 40px 0px; padding: 0px; list-style: none; display: flex; align-items: center; justify-content: center;}*/
/*.blog-detail-page ul.info li{font-size: 15px; line-height: 15px; color: #9b9b9b; margin: 0 20px; position: relative;}*/
/*.blog-detail-page ul.info li i{margin-right: 10px; font-size: 16px; color: #000}*/
/*.blog-detail-page ul.info li:before{content: ''; position: absolute; top: 2px; right: -21.5px; width: 2px; height: 15px;  background: #000}*/
/*.blog-detail-page ul.info li:last-child::before{content: none}*/
/*.blog-detail-page .blog-photo{position: relative; width: 100%; height: 450px; overflow: hidden; border-radius: 15px; margin-bottom: 30px}*/
/*.blog-detail-page .blog-photo img{width: 100%; height: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; object-fit: cover; transform: scale(1); transition: all .5s ease;}*/
/*.blog-detail-page p{font-weight: 400; font-size: 18px; line-height: 26px; color: #000000; margin: 0 0 30px 0}*/
/*.blog-detail-page ul{margin: 0px 0px 30px 0px; padding: 0px 0px 0px 15px}*/
/*.blog-detail-page ul li{font-weight: 400; font-size: 18px; line-height: 26px; color: #000000; }*/



.container {
    max-width: 1440px;
}


.header {display: flex; justify-content: space-between; padding: 20px 100px; background: #000; align-items:center; position: fixed; top: 0; width: 100%;     z-index: 111;}
.header .logo a img { width: 90px; height: 100px;}
.header .menu-header .main-menu { display: flex;gap: 15px; margin: 0;list-style: none;}
.header .menu-header .main-menu li a { color: #fff; font-size: 20px; line-height: 22px; margin: 0;    text-decoration: none; }
.header.fixed {
    background-color: #333;
    transition: .6s;
    box-shadow: rgba(0, 0, 0, .1) 0 10px 15px -3px, rgba(0, 0, 0, .05) 0 4px 6px -2px;
    padding: 10px 40px;
}
.header.fixed  .btn-read .text {
    padding: 10px 40px;
    font-size: 20px;
    line-height: 24px;;
}

.header.fixed .logo a img { width: 70px; height: 80px; }
footer {background:#000;    padding: 0px 100px;}
.footer {display: flex; justify-content: space-between; align-items: center; padding: 20px 0px; color: #ffffff; }
.footer .footer-logo img { width: 90px; height: 100px;}
.footer .footer-menu { display: flex; gap: 15px; margin: 0; list-style: none;}
.footer .footer-menu li a {color: #ffffff; font-size: 20px; line-height: 22px; text-decoration: none; transition: color 0.3s ease; }
.footer .footer-menu li a:hover { color: #ff7e5f;}
.footer .social-icons ul { display: flex; gap: 16px; list-style: none; margin: 0; padding: 0;}
footer .copyright {
    bottom: 10px;
    text-align: center;
    position: relative;
    z-index: 111;
    color: #fff;
    padding: 10px 0;
    border-top: 1px solid;
    top: 0;
}
.btn-read .text.new { padding: 10px 40px; font-size: 18px; }

.blog-list.blog-list-page{ padding: 150px 0 80px 0;  background: #000;}
.blog-list-page .blog-heading h1 { font-size: 42px; line-height: 54px; font-weight: 700; color: #fff; margin: 0; padding-bottom: 28px; position: relative; text-align: center; }
.blog-list-page ul.blog-list { padding: 0px; list-style: none; margin:0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; }
.blog-list-page ul.blog-list li {width: 100%;  }
.blog-list-page .blog-block {background: #fff; border-radius: 10px 10px 80px 10px;overflow: hidden;}
.blog-list-page .blog-block .photo-area {    position: relative; width: 100%; height: 350px; overflow: hidden; border-radius: 0 0 0 80px; }
.blog-list-page .blog-block .photo-area img {width: 100%; height: 100%; top: 0px; bottom: 0px; left: 0px; right: 0px; position: absolute; object-fit: cover; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; }
.blog-list-page .blog-block .content { padding: 26px 30px; }
.blog-list-page .blog-block .content h3 { font-size: 22px; line-height: 30px; font-weight: 700; color: #1D5170; margin: 0 0 10px 0; }
.blog-list-page .blog-block .content p {font-size: 16px; line-height: 22px; font-weight: 400; color: #1D5170; margin: 0 0 10px 0; text-align: left; opacity: 0.6; }
.blog-list-page .blog-block .content .btn-read {font-weight: 500; font-size: 16px; line-height: 24px; color: #393738; display: inline-flex; align-items: center; overflow: unset; }
.blog-list-page .blog-block .content .btn-read span {text-decoration: underline; position: unset; width: fit-content; height: fit-content; transform: unset;}
.blog-list-page .blog-block .content .btn-read svg {margin-left: 14px; transition: all .5s ease; }
.blog-list-page .blog-block .content .btn-read:hover { color: var(--main-color); }
.blog-list-page .blog-block .content .btn-read:hover svg { transform: rotate(45deg); transition: all .5s ease; }
.blog-list-page .blog-block:hover .photo-area img { transform: scale(1.1); transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; }
.blog-list-page .blog-block .info { list-style: none; display: flex ; gap: 15px; padding: 0;  }
.blog-list-page .blog-block .info li{width: fit-content; margin-bottom: 8px;}
.blog-list-page .blog-block .info li { width: fit-content; display: flex; gap: 8px; align-items: center; font-size: 16px; line-height: 16px; color: #555; padding: 0; margin-bottom: 10px;}

.blog-details-page {padding: 180px 0 50px 0;}
.blog-details-page .blog-details-heading h1 { font-size: 42px; line-height: 54px; font-weight: 700; color: #fff; margin: 0; padding-bottom: 28px; position: relative;  }
.blog-details-page .photo-area img {    border-radius: 10px; width: 100%; height: 600px; object-fit: cover; margin-bottom: 30px; }
.blog-details-page { background: #000; position: relative; color: #fff; }
.blog-detail-page p { font-size: 16px; line-height: 24px; color:  #1D5170; margin: 0 0 20px 0; font-weight: 400; }
.blog-details-right { background: #304a67; border-radius: 20px; padding: 20px 20px 20px 20px;  position: sticky; top: 116px; }
.blog-details-page .blog-details-right h4 {color: #fff; font-size: 21px; font-weight: 700; line-height: 20px; margin-bottom: 15px; }
.blog-details-right ul { margin: 0; list-style: none; padding: 0; }
.blog-details-right ul li:last-child { margin: 0;}
.blog-details-right ul li { padding: 10px 15px; background: #fff; border-radius: 10px; margin-bottom: 10px; }
.blog-details-right ul li .date a {color: #304a67; font-size: 14px; font-weight: 400;line-height: 18px; text-decoration: none; }
.blog-details-right ul li .title a { color: #304a67;font-size: 18px; font-weight: 700;line-height: 30px; text-decoration: none;}
.blog-details-right ul li .detail a { color: #304a67;font-size: 14px; font-weight: 400; line-height: 18px; text-decoration: none; }

.blog-list { padding: 80px 0 80px 0; background: #000;}
.blog-list .heading { color: #54462f; font-size: 36px; font-weight: 700; line-height: 40px; margin-bottom: 40px; margin-top: 30px; text-align: center; }
.blog-list .blog-cart {display: flex; justify-content: space-between; flex-wrap: wrap; }
.blog-list .blog-cart .blog-design { width: calc(50% - 15px);    background: #fff; border-radius: 10px; overflow: hidden; margin-bottom: 30px; position: relative; }
.blog-list .blog-cart .blog-design .blog-img {width: 100%; height: 400px; position: relative; overflow: hidden; }
.blog-list .blog-cart .blog-design .blog-img::before {  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(); z-index: 1; width: 100%; height: 100%; position: absolute; content: '';}
.blog-list .blog-cart .blog-design .blog-img img { width: 100%; height: 100%; object-fit: cover; transition: all .5s ease;}
.blog-list .blog-cart .blog-design .detail-area { position: absolute; padding: 30px; left: 0; bottom: 0; width: 100%; z-index: 1; }
.blog-list .blog-cart .blog-design .detail-area .detail {  color: #fff; font-size: 16px; font-weight: 400; line-height: 20px; margin-bottom: 15px; }
.blog-list .blog-cart .blog-design .detail-area .title { color: #fff; font-size: 28px;font-weight: 700;line-height: 30px; margin-bottom: 15px;}
.blog-list .blog-cart .blog-design .detail-area .date { color: #fff; font-size: 16px;font-weight: 400; line-height: 20px; margin-bottom: 15px; }
.blog-list .blog-cart .blog-design:hover .blog-img img { transition: all .5s ease; transform: scale(1.1); }
.blog-list .blog-cart .blog-design .detail-area .auth-area { color: #fff; font-weight: 700; text-decoration: none; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #ffffff; padding-top: 10px }
.blog-list .blog-cart .blog-design .detail-area .auth-area h5 {color: #fff; font-size: 18px; font-weight: 400; line-height: 30px; margin: 0 }
.blog-list .blog-cart .blog-design .detail-area .auth-area h5 i {margin-right: 5px }
.blog-detail .blog-right .auth-area .by-jesus {color: #ffffff !important; font-size: 18px; font-weight: 400; line-height: 30px; margin: 0 }
.blog-detail .blog-right .auth-area .jesus-info {margin-right: 5px }
.blog-list .blog-cart .blog-design .detail-area .auth-area a {font-size: 16px; color: #ffffff; font-weight: 700; text-decoration: none; }





.btn-menu {
    width: 22px;
    height: 22px;
    border: none;
    background: transparent;
    position: relative;
    padding: 0px;
    transition: all .5s ease;
    margin-left: 15px;
    display: none
}

.btn-menu span {
    width: 100%;
    height: 2px;
    background: #fff;
    display: block;
    transition: all .5s ease;
}

.btn-menu span:nth-of-type(3n+1) {
    position: absolute;
    top: 0px;
    left: 0px;
    transition: all .5s ease;
}

.btn-menu span:nth-of-type(3n+2) {
    position: absolute;
    top: 10px;
    width: 70%;
    left: 0px;
    transition: all .5s ease;
}

.btn-menu span:nth-of-type(3n+3) {
    position: absolute;
    bottom: 0px;
    left: 0px;
    transition: all .5s ease;
}

.btn-menu.active span:nth-of-type(3n+1) {
    transform: rotate(-45deg);
    left: 0px;
    top: 10px;
    transition: all .5s ease;   
}

.btn-menu.active span:nth-of-type(3n+2) {
    display: none;
}

.btn-menu.active span:nth-of-type(3n+3) {
    transform: rotate(45deg);
    left: 0px;
    transition: all .5s ease;
    bottom: 10px;
}
