@tailwind base;
@tailwind components;
@tailwind utilities;


body {
  background-color: #fff;
  /* font-family: "Poppins", sans-serif; */
}

html {
  overflow-x: hidden;
  scroll-padding-top: 9rem;
  /* scroll-behavior: smooth; */
}

html::-webkit-scrollbar {
  width: .6rem;
}

html::-webkit-scrollbar-track {
  background: #fff;
}

html::-webkit-scrollbar-thumb {
  border-radius: 6px;
  background: #000;
}



body {
  color: rgb(var(--foreground-rgb));
  background: linear-gradient(to bottom,
      transparent,
      rgb(var(--background-end-rgb))) rgb(var(--background-start-rgb));
  /* font-family: "Poppins", sans-serif; */

}

.placeholder-custom::placeholder {
  color: #494949;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.placeholder-search::placeholder {
  color: #808080;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.placeholder-Title::placeholder {
  color: #525252;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.placeholder-category::placeholder {
  color: #525252;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}




:root {
  --f12: 12px;
  --f14: 14px;
  --f16: 16px;
  --f18: 18px;
  --f20: 20px;
  --f22: 22px;
  --f24: 24px;
  --f26: 26px;
  --f28: 28px;
  --f30: 30px;
  --f32: 32px;
  --f35: 35px;
  --f44: 44px;
  --f50: 50px;
  --f60: 60px;
  --f55: 55px;
  --f66: 66px;
  --f80: 80px;
  --c-primary: #000;
  --c-secondary: #C30000;
  --c-secondary2: rgb(255, 0, 0);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

p {
  margin: 0;
}

/* /// Global classes starts */
.dflexCenter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.dflexCenterButton {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.f14 {
  font-size: var(--f14);
}

.f16 {
  font-size: var(--f16) !important;
}

.f18 {
  font-size: var(--f18);
}

.f20 {
  font-size: var(--f20);
}

.f22 {
  font-size: var(--f22);
}

.f26 {
  font-size: var(--f26);
}

.f28 {
  font-size: var(--f28);
}

.f30 {
  font-size: var(--f30);
}

.f32 {
  font-size: var(--f32);
}

.f35 {
  font-size: var(--f35);
}

.f44 {
  font-size: var(--f44);
}

.f50 {
  font-size: var(--f50);
}

.f55 {
  font-size: var(--f55);
}

.f60 {
  font-size: var(--f60);
}

.f66 {
  font-size: var(--f66);
}

.f80 {
  font-size: var(--f80);
}

.c-primary {
  color: var(--c-primary);
}

.c-secondary {
  color: var(--c-secondary);
}


.c-secondary-hover:hover {
  color: var(--c-secondary);
}

.c-secondary2 {
  color: var(--c-secondary2);
}

.f-bold {
  font-weight: 700;
}

.f-medium {
  font-weight: 500;
}

.f-semiBold {
  font-weight: 600;
}

.section {
  padding: 50px 0;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
  padding-left: 0;
}

p {
  margin-bottom: 0 !important;
}

.mtb-30 {
  margin: 30px 0;
}

.seperator {
  width: 3px;
  height: 25px;
  background-color: #525252;
}

.sectiion-separator {
  width: 315px;
  max-width: 50%;
  height: 2px;
  background: #000;
  margin: 50px 0;
}

.section-separator-edit {
  width: 100rem;
  max-width: 100%;
  height: 1px;
  background: #000;
}

.section-separator-layout {
  width: 121px;
  max-width: 100%;
  height: 1px;
  background: #808080;
}

.roundImgMain {
  border-radius: 50%;
  overflow: hidden;
}

.roundImgMain img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.roundImgSmall {
  width: 100px;
  height: 100px;
}

/* /// Global classes ends */

/* ///News Css  */

.newsDateAndTime .roundCircle {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #000;
}

.roundCircleSpecial {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #fff;
}


/* ///  Buttons CSS Starts */
.cursor-pointer {
  cursor: pointer;
}

.button-secondary {
  background: rgb(195, 0, 0);
  color: #fff;
  font-size: var(--f20);
  padding: 15px 30px;
  cursor: pointer;
}

.button-secondary-lg {
  min-width: 250px;
  max-width: 100%;
}

.button-secondary:hover {
  background: #000;
  transition: all .5s ease-in-out;
}

.button-outlined {
  background-color: #fff;
  border: 2px solid #000;
  padding: 10px 20px;
  border-radius: 10px;
  min-width: 140px;
}

.button-outlined:hover {
  background-color: var(--c-secondary);
  color: #fff;
  border-color: var(--c-secondary);
  transition: all .5s ease-in-out;
}

.button-round {
  border-radius: 50px;
}


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



/* ///  Buttons CSS Ends */



/* ?? Card List Css  */
.newsCardsList_main>div {
  padding: 80px 0 60px;
}

.newsCardsList_main>div:not(:last-child) {
  border-bottom: 1px solid #6F6F6F;
}


/* /// Inputs css / */
.textarea-field,
.input-field {
  background: rgb(243, 243, 243);
  border-radius: 10px;
  color: rgb(0, 0, 0);
  display: block;
  width: 100%;
  padding: 15px;
  outline: none;
}

.textarea-field {
  height: 100px;
  resize: none;
}

.input-field-2 {
  color: #525252;
  border: 1px solid #8E8E8E;
  background: transparent;
}

.borderlessInp {
  border: none;
}

/* // */
.headingWithLine {
  position: relative;
  margin: 70px 0;
}

.headingWithLine span {
  display: inline-block;
  width: 100%;
  height: 2px;
  background: #000;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.headingWithLine h3 {
  display: inline-block;
  position: relative;
  background-color: #FFE;
  z-index: 999;
  padding-right: 40px;
}


.threeline-text {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}


.quillEditor-main .ql-editor {
  min-height: 40vh;
}

.quillEditor-main .ql-editor p {
  font-size: var(--f18);
}

.quillEditor-main .ql-editor.ql-blank::before {
  font-size: var(--f16);
}


/* //table css  */
.table-qa,
.table-qa th,
.table-qa td {
  width: 100%;
  border: 1px solid #000;
}

.table-qa td {
  padding: 10px;
}


/* /// PAGINATION CSS  */
.pagination-main li {
  width: 72px;
  height: 63px;
  border-radius: 12px;
  border: 1px solid rgb(0, 0, 0);
  justify-content: center;
  font-size: var(--f32);
  font-weight: 600;
}

.pagination-main .active {
  background: #C30000;
  color: #fff;
  border: #C30000;
}

.pagination-main .pagination-dots span {
  position: relative;
  bottom: 10%;
}

.filterSelect {
  border: 1px solid #000;
  outline: none;
  height: 40px;
  padding: 5px 10px;
}


.SearchHeaderMain {
  position: relative;
}

.SearchHeaderMain .SearchHeader_postsList {
  background-color: #fff;
  width: 300px;
  position: fixed;
  top: 290px;
  right: 30px;
  z-index: 999;
  box-shadow: 0px 0px 10px 0px #00000082;
  padding: 20px;
  border-radius: 10px;
}

.SearchHeaderMain .SearchHeader_postsList li {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.SearchHeaderMain .SearchHeader_postsList li:hover {
  color: #C30000;
}

/* /// pdf viewer css  */
.pdf-viewer {
  border: 3px solid #000;
  /* padding-bottom: 200px;
  position: relative; */
}

.pdf-viewer canvas {
  width: 100% !important;
}

/* .pdf-viewer-btns{
  position: absolute;
  bottom: 0;
} */
/* #epaper-iframe::content {
  display: none;
}
#epaper-iframe{
  background-color: red;
}

#epaper-iframe *::-webkit-scrollbar,
#epaper-iframe html::-webkit-scrollbar,
#epaper-iframe body::-webkit-scrollbar,
#epaper-iframe::-webkit-scrollbar{
  display: none;
  background-color: red;
}
.epaper-iframe::content::-webkit-scrollbar{
  display: none;
} */

.newsUrl_text {
  display: block;
  width: 170px;
  display: block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.newsUrl_icon {
  cursor: pointer;
}

.newsUrl_icon:hover {
  color: var(--c-secondary);
}

.media-modal-body {
  max-height: 400px;
  overflow: auto;
  max-width: 100%;
}

.media-modal-main .modal-dialog {
  width: 640px;
  max-width: 640px;
}

.Header_inner {
  border-bottom: 3px solid #000;
}

.one-line-text {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.two-line-text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* /// Media Queries  */
@media screen and (max-width: 1400px) {
  :root {
    --f12: 10px;
    --f14: 12px;
    --f16: 14px;
    --f18: 16px;
    --f20: 18px;
    --f22: 18px;
    --f24: 20px;
    --f26: 22px;
    --f28: 24px;
    --f30: 26px;
    --f32: 28px;
    --f35: 31px;
    --f44: 40px;
    --f50: 42px;
    --f60: 52px;
    --f55: 47px;
    --f66: 58px;
    --f80: 72px;
  }
}

@media screen and (max-width: 1200px) {
  :root {
    --f12: 9px;
    --f14: 11px;
    --f16: 13px;
    --f18: 15px;
    --f20: 16px;
    --f22: 16px;
    --f24: 18px;
    --f26: 19px;
    --f28: 21px;
    --f30: 23px;
    --f32: 25px;
    --f35: 28px;
    --f44: 37px;
    --f50: 36px;
    --f60: 46px;
    --f55: 41px;
    --f66: 52px;
    --f80: 66px;
  }

  .button-outlined {
    min-width: 120px;
  }

  .newsCardsList_main>div {
    padding: 60px 0 30px;
  }

}



@media screen and (max-width: 991px) {
  :root {
    --f12: 8px;
    --f14: 10px;
    --f16: 11px;
    --f18: 11px;
    --f20: 12px;
    --f22: 13px;
    --f24: 14px;
    --f26: 14px;
    --f28: 15px;
    --f30: 16px;
    --f32: 21px;
    --f35: 24px;
    --f44: 31px;
    --f50: 30px;
    --f60: 40px;
    --f55: 32px;
    --f66: 46px;
    --f80: 60px;
  }



  .newsDateAndTime .roundCircle {
    width: 6px;
    height: 6px;
  }

  .button-secondary {
    padding: 10px 15px;
  }

  .roundImgSmall {
    width: 90px;
    height: 90px;
  }

  .button-outlined {
    min-width: 100px;
  }

  .textarea-field,
  .input-field {
    padding: 10px;
  }


  .pagination-main li {
    width: 55px;
    height: 55px;
  }

  .newsCardsList_main>div {
    padding: 40px 0 30px;
  }
}



@media screen and (max-width: 767px) {
  :root {
    --f12: 8px;
    --f14: 9px;
    --f16: 10px;
    --f18: 10px;
    --f20: 11px;
    --f22: 12px;
    --f24: 13px;
    --f26: 13px;
    --f28: 14px;
    --f30: 14px;
    --f32: 17px;
    --f35: 19px;
    --f44: 24px;
    --f50: 22px;
    --f60: 35px;
    --f55: 24px;
    --f66: 32px;
    --f80: 45px;
  }

  .roundImgSmall {
    width: 80px;
    height: 80px;
  }

  .button-outlined {
    min-width: 90px;
    border-radius: 5px;
  }

  .section {
    padding: 50px 30px;
  }

  .pagination-main li {
    width: 50px;
    height: 50px;
    border-radius: 8px;
  }

  .newsCardsList_main>div {
    padding: 25px 0px;
  }


}

@media screen and (max-width: 467px) {
  .pagination-main li {
    width: 40px;
    height: 40px;
  }

  .pagination-main li img {
    max-width: 70%;
  }

  .roundImgSmall {
    width: 60px;
    height: 60px;
  }

  .newsCardsList_main>div {
    padding: 20px 0px;
  }

}