:root {
  --color-default: #162e44;
  /* --color-primary: #ce1212; */
  --color-primary: #d3a213;
  /* --color-primary:  #A483D0; */
  --color-secondary: #37373f;
  --color-red: #4e1870;
  --color-gray: gray;
--color-sharp-blue: #21558c;
}

.truncated{
  display: -webkit-box;
  max-width: 100%;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
    
/* ===== New Disclaimer Start  */

#cookieAcceptBar .cookieAcceptBar {
  display:none;
  position: fixed;
  bottom: 0;
  left:0;
  right: 0;
  text-align: center;
  background-color: rgba(0,0,0,0.85);
  color: #fff;
  padding: 40px;

  z-index: 99999;
    /* height: 300px; */
    width: 100%;
}



#modalOverlay {
  position: fixed;
  top: 0;
  left: 0;
  /* background: rgba(0, 0, 0, 0.5); */ 
  background: rgb(0 0 0 / 80%);
  z-index: 99999;
  height: 100%;
  width: 100%;
}
.modalPopup {
  position: absolute;
  top: 50%; 
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  width: 50%;
  padding: 40px;
  -webkit-box-shadow: 0 2px 10px 3px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 2px 10px 3px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 10px 3px rgba(0, 0, 0, 0.2);
  border-radius: 15px;
}
.modalPopup .modalContent {
  padding: 0 2em;
}

.modalPopup .modalContent h1 {
  padding-bottom: 15px;
  font-size: 26px;
  text-transform: capitalize;
}

.modalPopup .modalContent p {
  margin: 0.75em 0 1.5em;
  font-size: 16px!important;
  text-align: justify;
  color: var(--color-secondary);

 
}

 .btn-agree {
  background-color: var(--color-primary);
  color:  #fff;
}

 .btn-agree {
  background-color: var(--color-primary);
  color:  #fff;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}


 .btn-disagree {
  background-color: var(--color-sharp-blue);
  color: #fff;
}



@media (max-width: 768px) {
  .modalPopup{
      width: 80%;
    height: 450px;
    overflow: scroll;
    overflow-x: hidden;
    padding: 20px 10px;
    
    
  }
   .modalContent{
      padding:10px!important;
  }
}


@media (min-width: 768px) and (max-width: 1024px){

  .modalPopup{
      width: 80%;
  }
  .modalContent{
      padding:10px!important;
  }
}

@media (min-width: 1100px) and (max-width: 1280px){
  .modalPopup{
      width: 60%;
  }
}


@media (min-width: 1280px) and (max-width: 1600px){

   .modalPopup{
       width: 60%;
   }
}
