/******************************************************
## Home Page Style Content Style
******************************************************/
.popover {
-webkit-backdrop-filter: var(--blur-filter);
backdrop-filter: var(--blur-filter);
background: var(--webkit-dropdown-bg) !important;
background: var(--dropdown-bg) !important;
color: #fff;
border: 1px solid #fff;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.popover-body {
font-size: 14px;
padding: 10px;
color: #fff;
}

.switch {
position: relative;
display: inline-block;
width: 50px;
height: 25px;
}
.switch input {
opacity: 0;
width: 0;
height: 0;
}
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
-moz-transition: .4s;
-ms-transition: .4s;
-o-transition: .4s;
transition: .4s;
}
.slider:before {
position: absolute;
content: "";
height: 19px;
width: 19px;
left: 3px;
bottom: 3px;
background-color: white;
-webkit-transition: .4s;
-moz-transition: .4s;
-ms-transition: .4s;
-o-transition: .4s;
transition: .4s;
}
input:checked + .slider {
background-color: var(--green);
}
input:focus + .slider {
box-shadow: 0 0 1px var(--green);
}
input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
-moz-transform: translateX(26px);
-o-transform: translateX(26px);
transform: translateX(26px);
}
.slider.round {
-webkit-border-radius: 34px;
-moz-border-radius: 34px;
-ms-border-radius: 34px;
-o-border-radius: 34px;
border-radius: 34px;
}
.slider.round:before {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
}
/******************************************************
## Offer Style
******************************************************/
.offer_partner,
.survey_partner,
.video_partner {
min-width: 130px;
max-width: 130px;
/*height: 220px;*/
height: 170px;
margin-right: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;
}
.offer {
position: relative;
display: block;
max-width: 380px;
background-color: var(--theme-bg);
margin-right: 10px;
padding: 10px;
border: 3px solid var(--border-color);
}
.featureds-offer{
position: relative;
display: block;
max-width: 130px;
background-color: var(--theme-bg);
margin-right: 10px;
padding: 10px;
}
.offer.lock {
cursor: pointer;
}
.offer.lock .lock_info {
position: absolute;
top: 7px;
right: 7px;
z-index: 999999;
}
.offer.lock .lock_info button {
width: 25px;
height: 25px;
background: #e75dff;
opacity: 1;
cursor: pointer;
}
.offer.lock .lock_info i {
font-size: 15px;
}
.offer:hover {
border: 2px solid #ff007f;
}
#offer_partners .offer,
#survey_partners .offer,
#video_partners .offer {
max-width: 100%;
width: 100%;
height: 100%;
padding: 0 !important;
background-color: transparent;
}
/*.offer_header {*/
/*position: relative;*/
/*}*/
.offer_partner .offer_header,
.survey_partner .offer_header,
.video_partner .offer_header {
height: 100%;
}
.offer_badge {
position: absolute;
top: 7px;
right: 7px;
}
.badge.new {
background: var(--green);
}
.badge.hot {
background: #fa007d;
}
.badge.offer_bonus {
background: rgba(1,214,118,0.2);
color: #01d676;
}
.offer_partner .offer_image,
.survey_partner .offer_image,
.video_partner .offer_image {
display: flex;
align-items: center;
justify-content: center;
max-height: 40px;
position: absolute;
top: 42%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}

.offer_image img {
width: 100%;
aspect-ratio: 2/2;
object-fit: contain;
box-shadow: 0px 0px 1px white;
}
.offer_banner img{
    width: 100%;
    object-fit: contain;
    box-shadow: 0px 0px 1px white;
}
#offer_partners .offer_image img,
#survey_partners .offer_image img,
#video_partners .offer_image img {
width: 80%;
aspect-ratio: 2/3;
box-shadow: none;
}
/*#offer_partners .offer_image .custom{*/
/* height:40;*/
/* width:30;*/
/*}*/

#offer_partners .offer_footer,
#survey_partners .offer_footer,
#video_partners .offer_footer {
z-index: 99999999;
position: absolute;
bottom: 0;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.offer .name {
font-size: 14px;
}
.featureds-offer .name{
    font-size: 14px; 
}
.offer_footer .name p {
font-weight: 500;
}
.offer .details,.featureds-offer .details {
font-size: 10px;
}

.offer .name, .offer .details {
white-space: nowrap;
/*width: 105px;*/
overflow: hidden;
text-overflow: ellipsis;
}
.featureds-offer .name, .featureds-offer .details {
    white-space: nowrap;
    /*width: 105px;*/
    overflow: hidden;
    text-overflow: ellipsis;
    }
.currency {
font-size: 12px;
}
.currency span {
font-size: 10px;
}
.offertype.game {
background: linear-gradient(180deg, #01d676 0, #007e45 100%);
font-size: 9px;
font-weight: 500;
}
.offer_footer .ratings i {
/*color: #ffd000;*/
color: #00ff5c;

margin: 2px;
font-size: 12px;
}
.hasRatings .offer_footer .ratings {
display: block;
}
.ratingsHide .offer_footer .ratings {
display: none;
}
.offer .overlay {
opacity: 0;
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
z-index: 999;
text-align: center;
vertical-align: middle;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-ms-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
-webkit-filter: none !important;
filter: none !important;
}
.offer .overlay i {
background-color: var(--green);
color: #fff;
display: inline-block;
height: 32px;
width: 32px;
font-size: 12px;
display: flex;
align-items: center;
justify-content: center;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
}
.offer.lock .overlay i {
background-color: transparent;
font-size: 30px;
}
.offer .overlay p {
margin-top: 15px;
margin-bottom: 0;
color: #fff;
font-weight: bold;
font-size: 12px;
}
.offer.lock .overlay,
.offer:hover .overlay {
opacity: 1 !important;
}
/*Custom Offer*/
.offer_partner .custom_offer{
display: flex;
align-items: center;
justify-content: center;
max-height: 120px;
position: absolute;
top: 42%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}