/*
Theme Name: adwaa
Theme URI: https://adwaa.busswork.com
Author: Brahim Lachgar
Author URI: https://adwaa.busswork.com
Description: Bloging - Built on a solid foundation and professional design using the Bootstrap 5th Edition style for content intended for affiliate marketing. Languages: HTML5, PHP, JavaScript, jQuery, CSS, Bootstrap. The home page is a landing page for the official product, then a page displaying the rest of the products with referral links and affiliate links for MLM company members, then a blog page in the hub that the company operates, then some additions attached to the theme. The design was based 98% on the Bootstrap library, and the rest are additions necessary for the styling - landing pages, portfolio, and articles.
Version: 25.07.2025
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: adwaa
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, style-variations, wide-blocks, block-styles, accessibility-ready, blog, portfolio, news
*/



@import url('css/bootstrap.min.css');
@import url('css/bootstrap-icons.min.css');



 * { box-sizing: border-box; margin: 0; padding: 0; }
body, html{
margin-top: 0;
color: #555;
text-transform: capitalize;
}



.calibri {
  font-family: 'calibri';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/Calibri-Light.ttf) format('truetype');
}


@import url('https://fonts.googleapis.com/css2?family=Zain:wght@200&display=swap');
.zain-extralight {
  font-family: "zain", sans-serif;
  font-weight: 400;
  font-style: normal;
}


@import url('https://fonts.googleapis.com/css2?family=Carlito&display=swap');
.carlito {
  font-family: "carlito", sans-serif;
  font-weight: 400;
  font-style: normal;
}

@import url('https://fonts.googleapis.com/css2?family=Amiri&display=swap');
.amiri {
  font-family: "amiri", sans-serif;
  font-weight: 400;
  font-style: normal;
}




/* start Masonry Post*/
   .masonry-grid {
      width: 100%;
      margin: 20px auto 0; 
      overflow: hidden;
    }

    .masonry-grid-sizer,
    .masonry-grid-item {
      width: calc(25% - 10px); /* 4 columns minus gutter */
    }

    .masonry-grid-item--width2 {
      width: calc(50% - 10px); /* double width item */
    }

    .masonry-grid-item {
      position: relative;
      margin-bottom: 10px;
      float: left;
      overflow: hidden;
      border-radius: 6px;
    }

    .masonry-grid-item img {
      display: block;
      width: 100%;
      height: auto;
      border-radius: 6px;
      transition: transform 0.3s ease;
    }

    .masonry-grid-item:hover img {
      transform: scale(1.05);
    }

    .masonry-cover {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      background: rgba(255, 255, 255, 0.8);
      color: #000;
      font-size: 18px;
      font-weight: bold;
      text-align: center;
      padding: 12px 20px;
      border-radius: 4px;
      opacity: 0;
      transition: opacity 0.3s ease;
    }

    .masonry-grid-item:hover .masonry-cover {
      opacity: 1;
    }

/*End Masonry Post*/















.carousel-item {
  height: 600px; /* Set a fixed height for all carousel items */
  overflow: hidden; /* Hide any overflow content */
}

.carousel-item img {
  width: 100%; /* Make the image fill the entire width of the carousel item */
  height: 100%; /* Make the image fill the entire height of the carousel item */
  object-fit: cover; /* Maintain aspect ratio and cover the entire container */
}

a {
text-decoration: none;
transition: all .3s;
}

img{
  max-width: 100%;
	height: auto;
}

.iconsbi{
  font-size: 24px;
  font-weight: bold;
  text-transform: capitalize;
}


ul {
list-style-type: none; 
}

ul li {
margin-left: 20px; 
}

p{
margin-left: 10px;
margin-right: 10px;
}


.btn{margin:1px;}
.btn-round{border-radius:40px;}
.circular-image {
object-fit: cover;
object-position: center;
width: 100%;
height: 100%;
border-radius: 50%;
}

.btn-nav-item{margin-left: 5px; margin-right: 5px; }

.box-shadow{
margin: 10px 0px 10px 0px;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.3), 
0 0 10px rgba(0, 0, 0, 0.2), 
0 0 20px rgba(0, 0, 0, 0.1);
}





  
.btn-instagram {
background: linear-gradient(135deg, #e84393, #4e54c8);
color:#f9f9f9;
}

.text-instagram {
color: #e84393;
}

.btn-linkedin{
  background: #2980b9;
  color:#f9f9f9;
}
  
.text-linkedin{
  color:#2980b9;
 
}

.btn-pinterest{
  background: #d63031;
  color:#f9f9f9;
}

.text-pinterest{
  color: #d63031;
}

.btn-tiktok,.btn-github ,.bg-black{
  background: #000;
  color:#f9f9f9;
}

.text-tiktok,.text-github{
  color: #000;
}

.btn-bluesky ,.bg-bluesky{
  background: #2980b9;
  color:#f9f9f9;
}

.text-bluesky{
  color: #2980b9;
}

.btn-gris,.bg-gris{
  background: #747d8c;
  color:antiquewhite;
}

.text-gris{
  color: #747d8c;
}



.icons{margin-left: 20px; margin-right: 20px;
font-weight: bold; font-size:30px ;}


img{
display: flex;
flex-wrap: wrap;
margin-top:5px;
margin-bottom:15px;  
border-radius: 8px;
}



.banner-blog-img {
width:100%; 
height:350px;
max-width: 1080px; 
max-height: 1920px; 
object-fit: cover;
object-position: center;
border:none;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
display: block;
transition: .5s ease;
backface-visibility: hidden;

}





.archives li a ,
.dropdown-menu li a,
.dropdown-menu li a span
{
color:#04063e;
}





.navbarall{margin-bottom:100px;}

.margin{margin-top: 10px; margin-bottom: 10px;}
.margin-icon {margin-right: 5px; margin-left: 5px;}

.wauto{width: 100%;}
.w1000{width: 1000px;}
.w950{width: 950px;}
.w900{width: 900px;}
.w850{width: 850px;}
.w800{width: 800px;}
.w750{width: 750px;}
.w700{width: 700px;}
.w650{width: 650px;}
.w600{width: 600px;}
.w550{width: 550px;}
.w500{width: 500px;}
.w450{width: 450px;}
.w400{width: 400px;}
.w350{width: 350px;}
.w300{width: 300px;}
.w250{width: 250px;}
.w200{width: 200px;}
.w190{width: 190px;}
.w180{width: 180px;}
.w170{width: 170px;}
.w160{width: 160px;}
.w150{width: 150px;}
.w144{width: 144px;}
.w140{width: 140px;}
.w130{width: 130px;}
.w120{width: 120px;}
.w110{width: 110px;}
.w100{width: 100px;}
.w92{width: 92px;}
.w90{width: 90px;}
.w80{width: 80px;}
.w70{width: 70px;}
.w60{width: 60px;}
.w50{width: 50px;}
.w40{width: 40px;}
.w32{width: 32px;}
.w30{width: 30px;}
.w20{width: 20px;}
.w16{width: 16px;}
.w10{width: 10px;}
.w9{width: 9px;}
.w8{width: 8px;}
.w7{width: 7px;}
.w6{width: 6px;}
.w5{width: 5px;}
.w4{width: 4px;}
.w3{width: 3px;}
.w2{width: 2px;}
.w1{width: 1px;}















/* video-container */



.video-container {
  position: relative;
  width: 100%;
  overflow: hidden;
  /* نسبة العرض إلى الارتفاع 16:9 */
  padding-bottom: 56.25%; /* 9/16 = 0.5625 */
  height: 0;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: cover;
}

.video-container i {
  font-size: 3rem;
  color: #6c757d;
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


.video-container::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(to bottom, 
      rgba(0,0,0,0.5) 0%,
      rgba(0,0,0,0.3) 50%,
      rgba(0,0,0,0.5) 100%
  );
  z-index: 1;
}





footer{
  position:relative;
  margin-bottom:0;
  margin-top:100%;
  width:100%;
  height:auto;
  line-height:auto;
}







/* Media Queries for responsiveness */
@media (max-width: 1600px) {
  .video-container {
      padding-bottom: 56.25%; 
  }
}

@media (max-width: 1200px) {
  .video-container i {
      font-size: 2.5rem;
  }
}

@media (max-width: 992px) {
  .video-container {
      padding-bottom: 62.5%; 
  }
  .video-container i {
      font-size: 2rem;
  }
}

@media (max-width: 768px) {
  .video-container {
      padding-bottom: 75%; 
  }
  .video-container i {
      font-size: 1.5rem;
  }
}

@media (max-width: 576px) {
  .video-container {
      padding-bottom: 100%; 
  }
  .video-container iframe {
      object-position: center 25%;
  }
}