:root {
 --project-theme: #d92c0e; /* Define a root variable for primary color */
}
.reset-button-styles {
 border: none;
 background: none;
 outline: none;
}

.header {
 background: linear-gradient(0deg, rgba(40, 40, 40, 0.1), rgba(40, 40, 40, 0.8)),
  url("/assets/header.jpg") no-repeat;
 background-size: cover;
 min-height: 40vh;
 height: 55vh;
 width: 100%;
}
.header-image {
 width: 20%;
 /* height: 80px; */
}
.header-image a {
 /* background: url("/assets/logo-black.svg") no-repeat; */
 background-size: auto;
 background-position: center;
 height: 100%;
 width: 100%;
 display: block;
}
.headerChild {
 height: 70%;
 padding: 1rem 0rem;
}
.header-form,
.header_nav,
.didntFindInput {
 display: none !important;
}
.header-form-input {
 border: 5px solid rgba(139, 139, 139, 0.683);
 border-radius: 2.5rem;
}
.header-form-label {
 text-align: center;
 font-size: 1.8rem;
 text-align: center;
 display: block;
 margin-bottom: 1.9rem;
 color: white;
 font-weight: 500;
}
.header-form input {
 border: none;
 background: none;
 border: 1px solid gray;
 padding: 1rem;
 width: 500px;
 background-color: white;
 border-bottom-left-radius: 2rem;
 border-top-left-radius: 2rem;
 display: block;
 border-right: none;
 outline: none;
 color: rgb(71, 71, 71);
}
.header-form button {
 background: none;
 border: none;
 border: 1px solid gray;
 display: block;
 padding: 0 1.8rem;
 border-bottom-right-radius: 2rem;
 border-top-right-radius: 2rem;
 background-color: #d92c0e;
 color: white;
}

/* article pages header */
.header_other {
 padding: 1rem 0rem;
 border-bottom: 1px solid rgba(128, 128, 128, 0.251);
}

.headerSearchBar {
 border: none;
 outline: none;
 padding: 0.5rem 0.5rem;
 width: 97%;
}
.searchBarIcon {
 background: none;
 border: none;
}
/* after header and hero */

.article-sec {
 margin-top: 2rem;
}
.article-sec a {
 display: block;
}
.article-image {
 height: 28vh;
 position: relative;
 transition: all 0.2s ease-in-out;
}
.article-image-first {
 background: linear-gradient(rgba(0, 0, 0, 0.259), rgba(0, 0, 0, 0.773)),
  url("/assets/articles/article1.png") no-repeat;
 background-position: center;
 background-size: cover;
}

.article-image-second {
 background: linear-gradient(rgba(0, 0, 0, 0.259), rgba(0, 0, 0, 0.773)),
  url("/assets/articles/article2.png") no-repeat;
 background-position: center;
 background-size: cover;
}

.article-image-third {
 background: linear-gradient(rgba(0, 0, 0, 0.259), rgba(0, 0, 0, 0.773)),
  url("/assets/articles/article3.png") no-repeat;
 background-position: center;
 background-size: cover;
}

.article-image-four {
 background: linear-gradient(rgba(0, 0, 0, 0.259), rgba(0, 0, 0, 0.773)),
  url("/assets/articles/article4.png") no-repeat;
 background-position: center;
 background-size: cover;
}

.article-image-five {
 background: linear-gradient(rgba(0, 0, 0, 0.259), rgba(0, 0, 0, 0.773)),
  url("/assets/articles/article5.png") no-repeat;
 background-position: center;
 background-size: cover;
}
.article-heading {
 font-size: 1.1rem;
 color: white;
 padding: 1rem;
 font-weight: 600;
 display: flex;
 height: 90%;
 align-items: end;
 line-height: 1.3;
}
.article-image:hover {
 transform: scale(1.1, 1.1);
 z-index: 1000;
}

/* Other Article */
.other {
 margin: 5rem 0;
}
.other-span {
 font-size: 0.8rem;
 color: var(--project-theme);
}
.other-title {
 font-size: 2rem;
 font-weight: 500;
 text-transform: capitalize;
 line-height: 1.2;
 margin: 0.5rem 0;
 width: 90%;
}
.other-content {
 font-size: 0.9rem;
 line-height: 1.5;
 width: 90%;
}

.other-btn {
 border: 1px solid var(--project-theme);
 padding: 0.7rem 1rem;
 color: white;
 background-color: var(--project-theme);
 margin-top: 1rem;
 border-radius: 0.3rem;
}

/* LatestArticle */

.Heading-Latest {
 font-size: 2rem;
 font-weight: 500;
 margin-bottom: 2rem;
}
.latest-article-left {
 width: 100%;
 border-radius: 0.5rem;
 display: block;
}

.latest-article-right {
 display: block;
 margin-left: 1rem;
}
.latest-article-heading {
 font-size: 1.2rem;
 font-weight: 500;
 line-height: 1.3;
}
.latest-article-content {
 font-size: 0.9rem;
 line-height: 1.3;
 margin-top: 0.5rem;
}
.latest-each-article {
 margin: 0.5rem 0;
}
.latest-btn {
 margin: auto;
 margin-top: 2rem;
 background: none;
 color: var(--project-theme);
 transition: all 0.5s ease-in-out;
}
.latest-btn:hover {
 color: white;
 background-color: var(--project-theme);
}
.search__icon {
 background-color: var(--project-theme);
}
.individualArticleLatest img {
 height: 70px;
 width: 100%;
}

.latest-each-article img {
 height: 160px;
 width: 180px;
}

/* Footer */
.Footer nav {
 border-top: 1px solid rgba(128, 128, 128, 0.549);
 margin-top: 4rem;
 padding-top: 4rem;
}
.footer-logo {
 width: 5rem;
 height: 3rem;
 background: url("/assets/logo.png") no-repeat;
 background-size: cover;
 background-position: center;
}

/* About us */
.about__bg {
 width: 100%;
 background: url("/assets/about.png") no-repeat;
 background-size: cover;
 background-position: center;
 height: 50vh;
 object-fit: cover;
}
.termsUl__style {
 list-style: disc;
}

/* All ARticles */
.all-article-logo {
 width: 5rem;
 height: 5rem;
 background: url("/assets/logo.png") no-repeat;
 background-size: cover;
 background-position: center;
}
.inside-latest-article-img {
 display: block;
 width: 100%;
 height: 100%;
 object-fit: contain;
}
.discoverMoreArticle .flex25 {
 height: 4rem;
 overflow: hidden;
}

.inside-latest-article-img2 {
 width: 23.5rem;
 height: 5rem;
 background: url("/assets/articles/article2.png") no-repeat;
 background-size: cover;
 background-position: center;
 display: block;
}

.inside-latest-article-img3 {
 width: 20rem;
 height: 5rem;
 background: url("/assets/articles/article3.png") no-repeat;
 background-size: cover;
 background-position: center;
 display: block;
}
.minDevices {
 display: none;
}
.paginationSec2 .pageSecNex {
 opacity: 40%;
 cursor: not-allowed;
}

.loopPopularArticles {
 width: 75%;
}
.eachPopularArticle {
 height: 300px;
}
/* Media-queries */
@media screen and (max-width: 1300px) {
 html {
  font-size: 14px;
 }
 .c__container {
  width: 90%;
 }
 .header {
  height: 25vh;
 }
 .flex20 {
  flex: 0 1 40%;
 }
 .article-sec a {
  margin: 2rem;
 }
 .columnSpaceBet {
  justify-content: space-between;
 }
 .loopPopularArticles {
  width: 85%;
 }
}

@media screen and (max-width: 1200px) {
 .loopPopularArticles {
  width: 90%;
 }
}
@media screen and (max-width: 1100px) {
 .loopPopularArticles {
  width: 95%;
 }
 .eachPopularArticle {
  height: 250px;
 }
 .eachPopularArticle img {
  /* height: 130px; */
 }
}
@media screen and (max-width: 1010px) {
 html {
  font-size: 12px;
 }
 .columnFlex {
  flex-direction: column;
 }
 .latest-each-article {
  margin-bottom: 1rem;
 }
 .Footer .flex40 {
  flex: 0 1 60%;
  margin-top: 2rem;
 }
 .Footer .flex40 li {
  margin-left: 1rem;
  margin-bottom: 1rem;
 }
}

@media screen and (max-width: 920px) {
 .flex20 {
  flex: 0 1 100%;
 }
 .article-sec a {
  margin-top: 1rem 0rem;
 }
}

@media screen and (max-width: 720px) {
 .header-form input {
  width: 300px;
 }
 .flex25 {
  flex: 0 1 15% !important;
 }
}

@media screen and (max-width: 420px) {
 .header-form input {
  width: 200px;
 }
 .smallColumnFlex {
  flex-direction: column;
 }
 .latest-each-article img {
  width: 100%;
  object-fit: fill;
 }
 .latest-article-right {
  margin-left: 0.5rem;
 }
}

@media screen and (max-width: 520px) {
 .header-image {
  width: 100%;
  display: inline-block;
  height: 100%;
  /* border: 1px solid red; */
 }
 .headerChild {
  height: 23vh;
 }
 .article-sec {
  width: 100% !important;
 }
 .header_other .flex15 {
  flex: 0 1 30%;
 }
}

/*  */
/* Media Queries */

@media screen and (max-width: 980px) {
 html {
  font-size: 14px;
 }
 .columnFlex {
  flex-direction: column;
 }
 .eachARticleRight {
  margin-top: 1rem;
 }
 .popularArticles .articleParent {
  overflow-x: scroll;
 }
 .popularArticles .articleParent .images {
  width: 40%;
 }
 .smallDevicesLatestArticles,
 .individualArticleLatest {
  width: 100%;
  border: 1px soid red;
  margin-top: 5rem;
 }

 .inside-latest-article-img {
  flex: 0 1 35%;
 }
 .article-sec .flex20 {
  flex: 0 1 48%;
  margin: 0.5rem;
 }
 .discoverMore {
  margin-top: 4rem;
 }
 .discoverMoreArticle {
  display: flex !important;
 }
 .discoverMoreArticle img {
  display: block;
  object-fit: fill;
  height: 200px;
  width: 100%;
 }
 .discoverMoreArticle .flex25 {
  flex: 0 1 25%;
  height: 8rem !important;
 }
 .latestARticleHeading {
  margin-top: 1.7rem !important;
 }

 .latestARticleHeading {
  margin-left: 1rem !important;
 }
 .loopPopularArticles {
  width: 95% !important;
 }
 .eachPopularArticle {
  height: 310px;
 }
}

@media screen and (max-width: 810px) {
 .article-sec .flex20 {
  flex: 0 1 46%;
 }
 .discoverMoreArticle .flex25 {
  flex: 0 1 40%;
  height: 8rem !important;
 }
 .discoverMore .spaceBetween {
  justify-content: unset;
 }
 .discoverMore .flex70 {
  margin-left: 1rem;
 }
 .eachPopularArticle {
  height: 280px;
 }
}

@media screen and (max-width: 720px) {
 .about__Small__div,
 .about__Small__div {
  width: 95%;
 }
 .headerSearchBar {
  width: 95%;
 }
 .article-sec .flex20 {
  flex: 0 1 47%;
 }
}

@media screen and (max-width: 590px) {
 html {
  font-size: 10px;
 }
 .c__container {
  width: 90%;
 }
 .tabelPrivacy {
  display: none;
 }
 .termsAdnConditionsPrivacyCoockies {
  width: 90%;
 }
 .popularArticles .articleParent .images {
  width: 70%;
 }
 .popularArticles {
  margin-top: -0.5rem;
 }
 .header-image .nrmlDevices {
  display: none;
 }

 .header-image .minDevices {
  display: block;
  width: 10% !important;
  height: 40px !important;
  margin: auto;
 }
 .article-sec a {
  margin: 0.5rem;
 }
 .article-sec .flex20 {
  flex: 0 1 90%;
  margin: auto;
  margin-top: 0.5rem;
 }
 .discoverMoreArticle img {
  width: 100% !important;
 }
 .discoverMoreArticle .flex25 {
  flex: 0 1 40% !important;
  margin-right: 1rem;
  border: 1px solid rgba(128, 128, 128, 0.213) !important;
 }
 .latestARticleHeading {
  margin-top: 1.7rem !important;
  margin-left: 1rem;
 }
 .popularArticlesSmallDevices img {
  height: 250px !important;
 }
 .loopPopularArticles article {
  height: 30rem;
 }
}