@font-face {
  font-family: 'Futura Next Book';
  src: url('../fonts/uturaNext-Book.woff2') format('woff2'),
      url('../fonts/FuturaNext-Book.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Futura Next';
  src: url('../fonts/FuturaNext-Bold.woff2') format('woff2'),
      url('../fonts/FuturaNext-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Futura Next Cn';
  src: url('../fonts/FuturaNextCn-Light.woff2') format('woff2'),
      url('../fonts/FuturaNextCn-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Futura Next';
  src: url('../fonts/FuturaNext-DemiBold.woff2') format('woff2'),
      url('../fonts/FuturaNext-DemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Futura Next';
  src: url('../fonts/FuturaNext-DemiBold.woff2') format('woff2'),
      url('../fonts/FuturaNext-DemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Futura Next';
  src: url('../fonts/FuturaNext-Light.woff2') format('woff2'),
      url('../fonts/FuturaNext-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Futura Next';
  src: url('../fonts/FuturaNext-Medium.woff2') format('woff2'),
      url('../fonts/FuturaNext-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}



body {
  font-family:Futura Next !important;
}

.head-section {
    color: #0D4266;
      display: flex;
      justify-content: center;
   }
  .head-section{
  color: #0D4266;
  }
  
  .head-section h1{
    font-size: 30px;
      font-weight: 600;
      margin: 10px 0px;
  }

  .num-show-listing{
    display: none;
  }
  #extra-detail{
    background-color: white;
    width: 500px;
    height: 480px;
    overflow: scroll;
    scrollbar-color: #0D4266 #D9D9D9;
  }
  #extra-detail::-webkit-scrollbar-thumb {
    background-color: var(--thumbBG) ;
    border-radius: 6px;
    border: 3px solid var(--scrollbarBG);
  }

  #extra-detail .container{
    box-shadow: none !important;
  }

  
  #extra-detail .close-popup a{
   padding: 0 !important;
  }
  #heading{
    font-size: 24px !important;
    font-weight: bold;
    color: #0D4266;
  }
  .extra-listing li {
    border-bottom: 1px solid gainsboro;
    padding: 10px 0px;
  }

  .cross-btn-div{
    border-bottom: 1px solid gainsboro;
    padding: 14px 0px;
    margin: 0;
  }
  .extra-listing li{
    font-size: 16px !important;
  }
  .user-profile .user-profile-menu{
    z-index: 999 !important;
  }
  .list-group{
    z-index: 1 !important;
  }
  .sub-heading p{
    font-weight: 600;
    font-size: 14px;
    color: black;
  }
  .popup-content .p-2{
    padding: 0 !important;
  }
   #dealership-dd_checklist{
      overflow-y: scroll;
    }
  #dealership-dd{
    border: none;
    height: 120px;
  }
  div.checklist li.even:hover, div.checklist li.odd:hover, div.checklist li.focused, div.checklist li:hover label {
    background: #0D4266 !important;
    color: #FFFFFF;
  }
  #dealership-dd_checklist .checklist li input{
    height: 15px;
    width: 15px;
    margin: 5px;
  }
  div.checklist li.checked{
    background: #0D4266 !important;
  }
  div.checklist li.even:hover, div.checklist li.odd:hover, div.checklist li.focused, div.checklist li:hover label {
    background-color: none !important;
  }
  div.checklist li {
    padding: 8px !important;
  }
  #dealership-dd_checklist{
    border-color: #BCBCBC !important; 
  }
  #dealership-dd{
    background: none !important;
  }
  div.checklist li.odd {
    background-color: white !important;
    color: unset !important;
  }

  .checklist input[type="checkbox"]::after {
    left: 4px !important;
    top: -1px !important;
  }
    #extra-detail .container{
      box-shadow: none !important;
    }
  #editCampaign .row {
    padding: 10px 0;
  }
  .sub-heading input{
    margin-bottom: 25px;
   width:400px;
   width: 400px;
      padding: 10px 20px;
      border: 1px solid #FAFAFA;
      margin-top: 10px;
      border-color: #BCBCBC;
  }
  
  .wrapper{
      display: flex;
      justify-content: center;
      align-items: center;
  }

   .wraper i{
      position: absolute;
      margin: 20px -30px;
      color: #868686CC;
    }
     .head-section span i{
      font-size: 15px !important;
      color: #A7A7A7 !important;
      margin: 45px 0px;
      margin-left: 5px;
    }
    .btn-button{
      display: grid;
      padding:30px 0px;
      justify-content: center;
      align-items: center;
    }
    .btn-button .theme-btn{
      background-color:#0D4266;
      color:white;
      padding:10px 50px;
      border-radius: 5px;
      cursor: pointer;
    }

    #new-creative .btn-button .theme-btn,
    .uploading-file .btn-button .theme-btn {
      background-color: #0D4266;
      color: white;
      padding: 8px 40px;
      width: 157.79px;
      height: 42.08px;
      font-size: 15px;
      opacity: 1;
    }
    #editCampaign .update_campaign{
      padding: 10px 10px !important;
    }

    @media screen and (max-width: 1300px) {
    .left-menu > li {
      padding: 20px 0 20px 8px;
      margin-right: 0px;
    }
  }

    @media screen and (max-width: 999px) {
    .preview-side-panal{
        width: auto !important;
    }

    .block-div {
      top: 55px !important;
    }

    .right-content .camp-steps ul li {
      font-size: 18px;
    }
    .list-group {
      right: 44px;
      top: 5px;
  }

  .inner-panel-2

  .type-girl {
    position: absolute;
    right: 33px;
    bottom: 113px;
    height: 242px;
  }
  .dt-search {
    margin-top: 20px !important;
    margin-left: 20px !important;

  }
  .dataTables_filter{
    text-align: right !important;
  }
}

.days-table{
  overflow: auto;
}

.days-table tr td {
  display: inline-flex;
}


.days-table tr td input{
  display: inline;
}

.sorting {
  font-weight: 600 !important;
}

.user-profile {
  position: relative;
  height: 44px;
}

.user-profile>span {
  display: block;
  height: 100px;
}

.user-profile .user-profile-menu:before {
  content: "";
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 15px solid #fff;
  position: absolute;
  right: 20px;
  bottom: 100%;
}

.user-profile .user-profile-menu {
  position: absolute;
  right: -9px;
  font-size: 13px;
  background: #fff;
  z-index: 111;
  background: #FFFFFF;
  box-shadow: 0px 4px 30px rgba(0, 0, 0, 0.12);
  border-radius: 5px;
  width: 192px;
  top: 38px;
  opacity: 0;
  transition: all .5s ease-in-out;
  transform: translateX(-10);
  margin-top: 0px;
  visibility: hidden;
  z-index: 999;
}

.user-profile:hover .user-profile-menu {
  transform: translateX(0);
  opacity: 1;
  margin-top: 20px;
  visibility: visible;
}

.user-profile .user-profile-menu ul {
  padding: 5px 15px;
  margin: 0;
}

.user-profile .user-profile-menu li {
  list-style: none;
  padding: 8px 0;
}

.user-profile .user-profile-menu li a {
  font-family: 'Futura Next';
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
  line-height: 23px;
  color: #000000;
}

.user-profile .user-profile-menu li+li {
  border-top: 1px solid rgba(0, 0, 0, .5);
}

.custom-audiance .agent-form input {
  padding: 5px;
  font-size: 14px !important;
  border: #ccc solid 1px;
}

.custom-audiance .agent-form .error input {
  border-color: red !important;
}

#ajax-error {
  font-size: 12px;
  color: red;
  text-align: center;
  position: absolute;
  bottom: 12px;
  left: 0;
  right: 0;
}

.custom-audiance .agent-form .error div {
  font-size: 11px;
  color: red;
}


.page-template-agents .block-div .block {
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  color: white;
  background-color: #0d4266 !important;
  border-radius: 5px;
}
.wpcf7 textarea, .wpcf7 input{
  width: 100% !important;
  height: 43px !important;
  background: #FAFAFA;
  border: 1px solid #BCBCBC;
  border-radius: 5px;
}


  @media screen and (max-width: 544px) {
    .right-content .camp-steps ul li {
      font-size: 14px;
    }

    .days-table tr{
      display: inline-flex;
     }
    .preview-side-panal{
      width: auto !important;

  }
  .dataTables_wrapper .dataTables_filter input{
    margin: 18px 10px !important;
  }
  #all-campaigns_filter.dataTables_filter {
    width: 160px !important;
    height: 32px !important;
    padding: 30px 0 !important; 
  }

  #all-campaigns{
    padding: 20px 0px;
  }
  .type-girl{
    position: absolute;
    right: 25px;
    bottom: 130px;
    height: 183px;

  }
  #all-campaigns_previous{
    left: 150px !important;
  }
  #all-campaigns_next{
    left: 140px !important;
  }
  .page-template-agents .block-div, .creatives-layout .block-div {
    top: 35px !important;
    right: 88px !important;
  }

  }

  .dataTables_wrapper .dataTables_paginate .paginate_button{
    display: inline !important;
  }

    .sub-heading .wraper{
      margin: 20px 0;
    }
    .btn-button .theme-btn:hover{
      color:white;
    }
  
    .btn-button .back-btn{
      border:none;
      background:none;
      padding-top:30px;
      color:#9D9D9D;
      text-align: center;
      cursor: pointer;
    }
    .d-flex .sub-heading{
      display: block ruby;
    }
    .CPM .wraper label{
      font-weight:700;
    }
    .CPM .new-wraper .wraper input,
    .location .new-wraper .wraper input{
      width:400px;
      padding:3px 10px;
      border:1px solid #d6d0d0;
      color: #000;
      font-size: 14px;
      border-radius: 5px;
    }

    .inner-panel-8 .new-wraper input, .inner-panel-8 .new-wrapercheck .new-wraper input{
      height: 49px;
    }

    .inner-panel-8 .new-wraper, .inner-panel-8 .new-wrapercheck, .inner-panel-8 .new-wrapercheck .new-wraper{

    width: auto !important;
    height: auto !important;
    }
    


    .white-icon {
      display:none;
    }

    .active .white-icon{
      display: inline;
    }
    .arrow-img{
      padding-left: 20px;
    }
    .active .blue-icon{
      display: none;
    }
    .CPM .new-wraper ,
    .location .new-wraper{
      margin: 20px 0px;
    }
  
    .location .new-wraper .colmn input{
      width: 100%;
      padding: 3px 30px;
      border: 1px solid #d6d0d0;
      color: #000;
      border-radius: 5px;
    }
  
  
    .location .new-wraper i {
      position: absolute  ;
      color: #868686CC;
    }
    .location .new-wraper .colmn .fa-globe  {
      position: absolute  ;
      color: #868686CC;
      top: 44px;
      left: 10px;
    }

    .dates .wrapper .sub-heading .wraper p{
      text-align: left;
    }
    .sub-heading .wraper > p{
      padding: 5px 0 !important;
    }

    .dates .wrapper .sub-heading .wraper .mandatory{
      background-color: #FAFAFA;
      font-size: 14px;
      border-radius: 5px;
      opacity: 0.5;
    }
  
    .location .new-wraper .colmn .fa-angle-down{
      top: 55px;
      right: 40px;
    }
  
    .location .new-wraper .wraper .fa-angle-down{
      position: absolute;
      top: 30px;
      right: 60px;
    }
    .location .new-wraper .fa-location-crosshairs {
      position: absolute;
      top: 55px;
      left: 30px;
    }
    .Daypart .days-table{
      margin: auto;
      width: 50%;
      padding: 10px;
      font-size: 15px;
    }
  
  .Daypart .days-table td{
    border:none;
  }
  .Daypart .days-table input{
    border: 1px solid #d6d0d0;
      padding: 3px 10px;
      color: black;
      background: #FAFAFA;
      border-radius: 2px;
      opacity: 0.7;
  }
  *:focus {
      outline: 0 !important;
  }
  .new-wrapercheck .wraper{
    margin-top:40px;
  }
  .new-wrapercheck .wraper input{
      width: 20px;
      height: 20px;
      border: 1px solid;
  }
  
  
    .new-wraper p{
      font-weight: 600;
      font-size: 16px;
      color: black;
    }
    .map-location img{
      width: 100%;
      padding: 50px 0px;
    }
  
     


    @media screen and (max-width: 800px) {
    .location .new-wraper .wraper input {
      width: 100vw;
    }
    .Daypart .days-table {
     width:auto;
     }
     .camp-steps li{
      width: 50%;
     }
    }


     /*Added by Musab*/

    .ur-form-grid p {
      font-size: 14px;
      color: #464646;
    }

    .forming {
      width: 50%;
    }
    .left-menu li {
      font-size: 15px;
    }

    .left-menu .active{
      height:54px;
    }

    @media screen and (max-width: 600px){
      .forming {
        width: 100%;
      }
    }

   img{
    outline: none !important;
   }

   .user-registration-error{
    height: auto;
    display: flex;
   }
   .user-registration-error::before{
    margin: 5px 5px;
   }
   .user-registration-error li{
    margin-top: 10px;
   
   }
   .Login-Form .logo-img img{
    top: 40px !important; 
    width: 70px !important;
   }
 
   .form-login h1 {
    width: 68.96px;
    height: 26.75px;
    font-size: 28px !important;
   }
   .form-login{
    margin-top: 30px;
    margin-left: 10px;
   }
   .desgin-login > img{
    margin: -15px;
   }

   #editCampaign .wraper input{
    background-color: #FAFAFA;
    font-size: 14px;
    border-radius: 5px;
    opacity: 0.5;
    width: 200px;
    font-weight: 400;
    border: 1px solid #c4bdbd;
   } 

   .wrapper .sub-heading .wraper p,
   .half-custom .wraper  p,
   #editCampaign .wraper p{
    font-weight: 600 !important;
    font-size: 14px !important;
    color: black;
   }

   .custom_data_name,
   .custom_data_type{
      width: 100%;
      padding: 10px 20px;
      border: 1px solid #FAFAFA;
      border-top-color: rgb(250, 250, 250);
      border-right-color: rgb(250, 250, 250);
      border-bottom-color: rgb(250, 250, 250);
      border-left-color: rgb(250, 250, 250);
      margin-top: 20px;
      border-color: #BCBCBC;
      font-size: 14px;
   }
   
   #editCampaign .update{
    background-color: #0d4266;
    color: white;
    padding: 8px 40px;
    width: 157.79px;
    height: 42.08px;
   }
   #editCampaign .theme-btn{
      padding: 8px 40px;
      color: white;
      outline: none;
      border: 1px solid #0d4266 ;
      background-color: #0d4266;
      
      font-size: 16px;
   }
   .theme-btn{
    background: #0D4266 !important;
    color: white !important;
    opacity: 1 !important;
    font-size: 15px !important;
    border-color: unset !important;
   }
   #editCampaign .theme-btn:hover{
    background-color: #0d4266;
   }
   .days-table .start-time , .days-table .end-time{
    width: 125px;
   }
   .Daypart .days-table{
    width: 100% !important;
    text-align: center;
   }
 
   .Daypart .days-table input[type="checkbox"]::after{
      left: 8px !important;
      top: 4px !important;
   }
   .device-types .cards-wrapper {
    padding: 0 !important;
  }
  .popup-form label {
    font-weight: 400 !important;
    font-size: 15px !important;
  }
  .popup-form input{
      font-size: 14px;
      font-weight: 400;
      opacity: 0.7;
  } 

  .main-conten{
    overflow: hidden;
  }
  .upload-data .handlePopup{
    font-size: 15px;
  }

  .camp-steps .num-text .number-system{
    display: none;
    padding: 5px 11px;
    margin-bottom: 8px;
    color: #0D4266;
  }

  .custom-audiance .uploading-file .fa-cloud-upload{
    padding-top: 10px;
    margin-top: 80px !important;

  }
  .custom-audiance .uploading-file{
    height: 256px !important;
  }
  .uploading-file p {
    margin: 152px !important;
    opacity: 0.5;
  }

  .custom-audiance .sub-heading select, 
  .custom-audiance .sub-heading input{
    width: 305px;
    height: 40px;
    margin-top: 5px !important;
    font-size: 15px !important;
    background: #FAFAFA;
    border: 1px solid #BCBCBC;
    border-radius: 5px;
  }
  .custom-audiance .btn-button .theme-btn{
    width: 157px !important;
    height: 42px !important;
  }

  .custom-audiance .btn-button .upload_custom_data{
    padding: 0 !important;
  }
  .custom-audiance .btn-button{
    justify-content: left !important;
  }
  .half-custom .wraper{
    margin: 0 !important;
  }
  .agent-form .wraper input,
  .wraper #name,
  .wraper .url_outer,
  .inner-panel-8 .new-wraper input, 
  .inner-panel-8 .new-wrapercheck .new-wraper input,
  .wraper .state,
  .wraper .lifetime
  .wraper .daily,
  .wraper select,
  .sub-heading input{
    width: 305px !important;
    height: 43px !important;
    background: #FAFAFA;
    border: 1px solid #BCBCBC;
    border-radius: 5px;

  }
  .agent-form label,
  .agent-form p{
    margin:0 !important;
    padding-top:10px ;
  }

  .agent-form .theme-btn{
    padding: 0 !important;
  }
  .wpcf7 textarea {
    height: 220px !important;
  }
  .block-div .block{ 
    font-size: 12px;
    font-weight: 400;
  }
  .popup-form a,
  .action-buttons input{
    padding: 8px 40px !important;
    width: 157.79px !important;
    height: 42.08px !important;
   
}
.wpcf7 .wpcf7-submit{
  font-size: 15px !important;
}
.block-div {
  position: absolute;
  right: 265px;
  top: 40px;
}
@media screen and (max-width: 786px){
  .block-div {
  right: 270px !important;
  top: 60px !important;
}
}


  .uploading-file .btn-button{
    justify-content: left;
  }
  .upload input{
    width: 157px !important;
    height: 42px !important;
  }

  #new-creative .btn-button{
    justify-content: end !important;
  }
#preview{
  width: 305px !important;
  height: 256px !important;
  background: #FAFAFA !important;
  border: 1px solid #E2DBDB !important;
  border-radius: 5px;
}
.popup-form .wraper{
  display: grid !important;
}

  .new-wraper{
    padding: 0 !important;
  }
  .right-content{
    overflow: hidden;
  }

  .custom-audiance .uploading-file i{
    margin: 0 !important;
  }
  input[type="checkbox"] + label, input[type="radio"] + label{
    display: inline !important;
  }
  
  
  @media only screen and (max-width: 1200px) and (min-width: 768px) {
  .wraper #name,
  .wraper .url_outer,
  .inner-panel-8 .new-wraper input, 
  .inner-panel-8 .new-wrapercheck .new-wraper input,
  .wraper .state,
  .wraper .lifetime
  .wraper .daily,
  .wraper select,
  .sub-heading input{
    width: 185px !important;
    height: 43px !important;
  }
  #all-campaigns_wrapper {
    overflow: scroll !important;
  }
}

.agent-form .wraper label,
.agent-form .wraper p{
  font-weight: 400 !important;
  font-size: 14px !important;
}

  @media screen and (max-width: 1450px){
    .camp-steps .num-text .number-system{
      display: inline-block;
    }
    .camp-steps .num-text p{
      display: none;
    }
    .camp-steps li{
      padding: 4px 20px !important;
    }
  }

   @media screen and (max-width: 770px){
    .my-tooltip{
      display: none;
      }
    .layout-popup .popup-content {
    position: absolute;
    left: 50%;
    top: 50%;
    width: auto;
    transform: translate(-50%, -50%);
    box-shadow: 8px 8px 0px rgb(0 0 0 / 5%) !important;
    overflow: auto;
   }
   .right-content{
    padding: 0 !important;
   }
  }

  /* 18-oct-2022*/
  .dt-heading{
    font-size: 19px !important;
  }
  .right-header h4 {
    font-size: 14px !important;
  }
  body h2{
    font-size: 22px !important;
  }



  /*Added by Naveed*/

  .creatives-layout .block-div .open-popup{
    color: #fff !important;
  }
  .page-template-agents .block-div,
  .creatives-layout .block-div{
    position: absolute;
    right: 270;
    top: 68;
    z-index: 11111;

  }

  .layout-popup {
    position: fixed;
    left: 16.5%;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(203, 203, 203, 0.7) !important;
    z-index: 11111111111111111;
}

.popup-content {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 700px;
    transform: translate(-50%, -50%);

}

.popup-content .container{
  /* box-shadow: 0px 4px 25px rgba(255, 255, 255, 0.25); */
  box-shadow: 8px 8px 0px rgb(0 0 0 / 5%) !important;
}


.custom-audiance-cross-icon i {
  background-color: #0D4266;
  border-radius: 50%;
  border: 1px solid #0D4266;
  padding: 3px;
  color: white;
  height: 28px;
  width: 28px;
  font-size: 18px;
  font-weight: normal !important;
  text-align: center;
  line-height: 19px;
}
.popup-form label{
  font-weight: bold;
  font-size: 20px;
}
.popup-form .wraper input{
  background: #FAFAFA;
  border: 0.5px solid #BCBCBC;
  border-radius: 5px;
  margin: 0 !important;
  font-style: normal;
  font-size: 16px;
  color:rgba(0,0,0,.5);

}
.popup-form .wraper{
  margin-top: 0 !important;
}
.popup-form .custom-audiance-main{
  margin-bottom: 30px;
}
.popup-content{
font-family: Futura Next;
}
/* #all-campaigns_length label,
div#all-campaigns_info{
  display: none;
} */

#all-campaigns_paginate span{
  display: none;
}
div#all-campaigns_paginate a {
  background: none !important;
  border: none !important;
}
html #all-campaigns_length label {
  right: unset;
}
.camp-steps li.done{
  position: relative;
}

/*.camp-steps li.done::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  background: #F9F6C0 url('../images/arrow-green.svg');
  width: 18px;
  background-repeat: no-repeat;
  background-position: left top;
}*/

.camp-steps li + li::before {
  content: "";
  position: absolute;
  left: -17px;
  top: 0px;
  bottom: 0px;
  height: 100%;
  background: url('../images/arrow-white.png');
  width: 18px;
  background-repeat: no-repeat;
  background-position: left top;
  background-size: auto 50px;
}
.camp-steps .done:first-child:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  background: #F9F6C0 url('../images/arrow-green.svg');
  width: 18px;
  background-repeat: no-repeat;
  background-position: left top;
  display: none;
}

.camp-steps .done:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  background: #ADF0D1 url('../images/arrow-green.svg');
  width: 18px;
  background-repeat: no-repeat;
  background-position: left top;
}


.camp-steps .done + 
.active:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  background: #F9F6C0 url('../images/arrow-green.svg');
  width: 18px;
  background-repeat: no-repeat;
  background-position: left top;
}

.camp-steps li.active::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  background: #fff url('../images/arrow-yellow.svg');
  width: 18px;
  background-repeat: no-repeat;
  background-position: left top;
}

.preview-side-panal .head-section{
  color: #0D4266;
  margin:10px 0;
  }
  
  .preview-side-panal .head-section h1{
    font-size: 20px;
      font-weight: 600;
      margin: 10px 0px;
  }
   .preview-side-panal{
      width:0;
      /* position:absolute; */
      right:0;
      height:100%;
      z-index: 111;
  }
  
  .preview-side-panal .side-panal-bg{
      background-color:white;
  }
  
  
  
  .preview-side-panal .campaign{
      border: 1px solid #DFE0EB;
      display:flex;
  }
  
  .preview-side-panal .preview-campaign{
      background-color:white;
  }
  .preview-side-panal .over-head-sects ,
  .preview-side-panal .over-head-section{
      padding: 10px 0;
  }
  
  .preview-side-panal .over-head-sects .h-heading{
      padding:10px;
  }
  .preview-side-panal .over-head-section .h-heading{
      background-color:#D4EBE7;
      padding:10px;
  }
  
  .preview-side-panal .over-head-sects .h-heading h2,
  .preview-side-panal .over-head-section .h-heading h2{
      font-weight:bold;
      font-size:15px !important;
  }
  
  
  .preview-side-panal .over-head-section .p-paragraph{
      padding:10px;
  }
  .preview-side-panal .over-head-section .p-paragraph h2{
      font-weight:600;
      font-size: 15px !important;
      padding-right: 10px;
  }
  .preview-side-panal .over-head-section .p-paragraph p{
      font-weight:500;
      font-size:15px !important;
      color:#636363;
  }
  
  .preview-side-panal .over-head-section .p-para h2{
      font-weight:600;
      font-size: 15px !important;
      padding-right: 10px;
  }
  
  .preview-side-panal .over-head-sects .p-para p,
  .preview-side-panal .over-head-section .p-para p{
      font-weight:500;
      font-size:15px !important;
      color:#636363;
  }
  
  .preview-side-panal .over-head-sects .dates p{
      font-weight:500;
      font-size:15px !important;
      color:#636363;
  }
  
  .preview-side-panal .over-head-sects .dates p span{
      padding: 4px;
      margin: 0px 10px;
  }
  
  .preview-side-panal .over-head-sects .p-para p span{
      border:1px solid gray;
      border-radius:15px;
      padding: 4px;
      margin: 7px;
      background-color:#E4E4E4;
      color:#0D4266;
      border:none;
  }
  
  
  
  .preview-side-panal .btn-button .theme-btn:hover{
      color:white;
    }
    @media screen and (max-width: 1080px){
      .my-tooltip{
        right: 20px !important;
        top: 50px !important;
      }
    }

    @media screen and (max-width: 500px){

      .camp-steps li {
          padding: 10px 0px !important;
          font-size: 10px !important;
      }

      .camp-steps .num-text .number-systemn{
        padding: 10px 0px;
      }
    }