/** xmas css **/

.black-banner{
  background:#2a4b3b url('https://res.cloudinary.com/powtoon-dev/image/upload/f_auto,q_auto/v1574002516/site/promotions/xmas-ban.jpg') no-repeat 50% 50%;
  height:90px;
  width:100%;
  display:flex;
  justify-content: center;
  position:fixed;
  top:0;
  font-family: Fieldwork, Arial, san-serif;
  z-index:999;
}

.banner__close{
width:22px;
padding:10px 0 12px;
background-color:rgba(0,0,0,0.55);
top:0;
right:0;
cursor: pointer;
position: absolute;
}

.banner-container{
  display:flex;
}

.linkban{
text-decoration: none;
}

.black-banner *{
  font-family: Muller, Arial, san-serif;
}

#wrapper .banner-case, .black-case .headerpt, .header.banner-case{
  top:90px;
  transition:none;
}

.font-image{
align-self:center;
display:flex;
align-items: center;
justify-content: center;
background-color:rgba(255,255,255,0.18);
height:64px;
width:290px;
font-size: 24px;
letter-spacing: 1.1px;
text-align: center;
color: #fefefe;
text-transform:uppercase;
}

.banner-text{
  margin: 0 45px;
  color:#fff;
  display:flex;
  align-items:center;
  font-family:muller-extrabold;
  text-align: center;
  font-size: 30px;
  padding-top:4px;
  line-height: 1.2;
  letter-spacing: 1.2px;
  color: #ffffff;
}

.black-banner span, .bann-btn{
  display:block;
  padding:11px 56px 9px;
  line-height:1;
  border-radius: 30px;
  background-color: #ba0101;;
  font-family:muller-extrabold;
  font-size: 31px;
  letter-spacing: 1.4px;
  text-align: center;
  color: #fff;
  align-self: center;
  text-decoration:none;
}

.bann-btn:hover{
  color: #fff;
  text-decoration: none;
}

.banner__close:after,
.banner__close:before {
 background-color: #fff;
 content: '';
 height: 3px;
 width: 20px;
 position: absolute;
}

.banner__close:after {
  transform: rotate(45deg);
}

.banner__close:before {
  transform: rotate(-45deg)
}

.dashboard.black-case .cover-container.uximprove{
top:90px;
}

.dashboard.black-case .after-nav, .player-page.black-case .message-box, .player-page.black-case{
  margin-top:90px;
}

.promo-cta{
  margin-bottom:26px;
}

#root{
  height:calc(100% - 90px);
}

.blackspa{
position:relative;
z-index:9;
}

.es-off{
margin-left:40px;
}

.es-off span{
font-family: 'Share Tech Mono', monospace;
line-height:0.85;
font-size:30px;
padding-left:20px;
}

.black-banner .es-btn{
font-size:20px;
padding:14px 44px 12px;
}

.black-case .pt-toggle{
    margin-top: 160px;
}

/** counter **/
#friday-count *{
color:#02e8c7;
font-family:muller-regular;
}

#friday-count div {
align-self: center;
font-size: 24px;
line-height:1;
}

.dashboard #friday-count div{
line-height:0.75;
}

.blackspa #friday-count div{
line-height:0.5;
}

#friday-count{
letter-spacing:2px;
display: flex;
margin-left:40px;
padding-top:25px;
}

.dashboard #friday-count{
padding-top:32px;
}

.blackspa #friday-count{
padding-top:30px;
}

#friday-count::before{
font-size:15px;
font-family:muller-thin;
letter-spacing:8.7px;
content:"SALE ENDS";
color:#02e8c7;
position:absolute;
top:15px;
}

.blackspa #friday-count::before{
top:18px;
}

#friday-count span{
margin:10px;
}

#friday-count p {
font-size:10px;
font-family:muller-regular;
letter-spacing:1.6px;
padding-left:1px;
}

#friday-hour p{
margin-left:-5px;
}


@media screen and (min-width:1920px){
.black-banner {
  background-size:cover;
}
}

@media screen and (max-width:1120px){
.black-banner span, .bann-btn{
  padding:10px 40px 8px;
  font-size:22px;
}

.banner-text {
 font-size:26px;
 margin:0 35px;
}

.font-image{
  font-size:18px;
  width:230px;
}
}

@media screen and (max-width:900px){
.banner-container{
  display:block;
  max-width:578px;
}

.font-image{
  float:left;
  margin:13px 48px 0 0;
}

.black-banner span, .bann-btn{
  display:table;
  float:right;
  font-size:20px;
  padding: 8px 60px 6px;
  margin:3px 40px 0 0;
}

.banner-text{
  line-height:1.1;
  font-size:18px;
  margin:2px 20px;
}

.black-banner{
  background-image: url('https://res.cloudinary.com/powtoon-dev/image/upload/f_auto,q_auto/v1576491155/site/promotions/mob-xmas-ban.jpg');
  background-size:cover;
}
}

@media screen and (max-width:600px){
.font-image{
  width:120px;
  padding:15px;  
  margin-right:40px;
}

.banner__close{
  top:14px;
  right:22px;
}

.banner__close:after, .banner__close:before{
  width:15px;
}

}

@media screen and (max-width:480px){
.font-image{
  width:84px;
  padding:6px;  
  font-size:14px;
  height:56px;
  margin:17px 18px 0 0;
  font-family: muller-light;
}

.banner-text{
  font-size:13px;
  margin: 12px 0 0 0
}

.black-banner span, .bann-btn{
  font-size:13px;
  margin: 5px 22px 0 0;
  padding: 8px 42px 6px;
}
}

@media screen and (max-height:670px){
.cover-container.uximprove h3{
padding-bottom:22px;
font-size:22px;
}

.cover-container.uximprove{
  padding-top:26px;
}

.cover-container .templates-board .btn-more-templates{
  margin-top:25px;
}

.dashboard.black-case .cover-container.uximprove{
  top:60px;
}

.dashboard.black-case .header.banner-case{
top:80px;
height:65px;
}

.dashboard.black-case .header.two_col_navbar .container{
margin-top:-6px;
}

.dashboard .black-banner{
height:85px;
margin-top:-5px;
padding-top:3px;
}

.dashboard.black-case .banner__close{
  top:5px;
}

.dashboard.black-case header .badge-pt{
  top:4px;
}

.dashboard.black-case .after-nav{
  margin-top:40px;
}

.dashboard.black-case .alpha-tabs{
  margin-top:-5px;
}

.dashboard.black-case .cover-container .templates-board .templates-preview{
  padding-top:25px;
}

.dashboard.black-case .container-wrap .two_col_navbar .navigation ul li .bf-optin{
  padding-top:5px;
  padding-bottom:5px;
  margin-top:22px;
}

.dashboard.black-case .container-wrap .two_col_navbar.fix .navigation ul li .bf-optin{
    margin-top:19px;
}

.dashboard #friday-count div {
line-height:0.6;
}
}