/*----------------------------------------
------------------------------------------
	## BREAKPOINTS
------------------------------------------
----------------------------------------*/

// 420px
$mq-xs-min: "only screen and (min-width: 420px)";

// 767px
$mq-sm-min: "only screen and (min-width: 767px)";

// 992px
$mq-md-min: "only screen and (min-width: 992px)";

// 1200px 
$mq-lg-min: "only screen and (min-width: 1200px)";

// 1360px
$mq-xl-min: "only screen and (min-width: 1360px)";

// 1600px
$mq-xxl-min: "only screen and (min-width: 1600px)";

// MOBILE FIRST

// 1660px
$mq-xxl-max: "only screen and (max-width: 1660px)";

// 1366px
$mq-xl-max: "only screen and (max-width: 1360px)";

// 1200px
$mq-lg-max: "only screen and (max-width: 1200px)";

// 992px 
$mq-md-max: "only screen and (max-width: 992px)";

// 767px
$mq-sm-max: "only screen and (max-width: 767px)";

// 575px
$mq-xs-max: "only screen and (max-width: 575px)";

// 420px
$mq-xxs-max: "only screen and (max-width: 420px)";

// 375px
$mq-xxxs-max: "only screen and (max-width: 375px)";

// 330px
$mq-old-max: "only screen and (max-width: 330px)";

/*
body {
	&::before {
		content: 'f.hd';
		display: block;
		position: fixed;
		font-family: sans-serif;
		bottom: 0;
		left: 0;
		margin: 25px;
		opacity: .9;
		pointer-events: none;
		padding: 10px;
		font-size: 14px;
		color: white;
		background: black;
		z-index: 99999999999;

		@media #{$mq-xxl-max} { content: 'xxl'; }
		@media #{$mq-xl-max} { content: 'xl'; }
		@media #{$mq-lg-max} { content: 'lg'; }
		@media #{$mq-md-max} { content: 'md'; }
		@media #{$mq-sm-max} { content: 'sm'; }
		@media #{$mq-xs-max} { content: 'xs'; }
		@media #{$mq-xxs-max} { content: 'xxs'; }
		@media #{$mq-xxxs-max} { content: 'xxxs'; }
		@media #{$mq-old-max} { content: 'old'; }
	}
}*/

/*----------------------------------------
------------------------------------------
	## FONT FAMILIES / WEIGHTS
------------------------------------------
----------------------------------------*/

$gotham: 'Gotham', sans-serif;

$light: 300;
$regular: normal;
$bold: bold;

.slide-01{
  background-color: #c07949 !important; 
}

.slide-02{
  background-color: #c07949 !important; 
}

body.home #banner-top.slide-01 .logo img path, body.home #banner-top.slide-01 .logo svg path{
  fill: #a86e45 !important;
}

body.home #banner-top{
  padding-bottom: 0 !important;
}

/*
.custom-banner{
  
  margin-bottom: -5px !important;
  
  .desktop{
    max-width:100%;
    width: 100%;
   	@media #{$mq-md-max} {
      display:none;
    } 
  }
  
  .tablet{
    display: none;
    max-width:100%;
    width: 100%;
    
    @media #{$mq-md-max} {
      display:block;
      width: 100%;
    }
    
    @media #{$mq-xs-max} {
      display:none;
    }
  }
  
  .mobile{
    display: none;
    
    @media #{$mq-xs-max} {
      display:block;
      margin-top: 40px;
    }
  }
}*/

.custom-banner-internal {
  position: relative;
}

.custom-banner-internal .countdown-wrapper {
  position: absolute;
  right: 22%;
  top: 0%;
  font-size: 35px;
  text-align: center;
  letter-spacing: 4px;
  line-height: 1;
  left: 54.5%;
  bottom: 0%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 1398px) {
  .custom-banner-internal .countdown-wrapper {
    font-size: 25px;
  }
}

@media screen and (max-width: 1057px) {
  .custom-banner-internal .countdown-wrapper {
      font-size: 21px;
  }
}

@media screen and (max-width: 991px) {
  .custom-banner-internal .countdown-wrapper {
    top: 57%;
    bottom: 9%;
    right: 32%;
    left: 34%;
    font-size: 30px;
  }
}

@media screen and (max-width: 769px) {
  .custom-banner-internal .countdown-wrapper {
    font-size: 22px;
  }
}

@media screen and (max-width: 767px) {
  .custom-banner-internal .countdown-wrapper {
    top: 53%;
    bottom: 14%;
    right: 32%;
    left: 33%;
  }
}

@media screen and (max-width: 575px) {
  .custom-banner-internal .countdown-wrapper {
    font-size: 14px;
  }
}

@media screen and (max-width: 400px) {
  .custom-banner-internal .countdown-wrapper {
    font-size: 11px;
  }
}


.custom-banner-internal .countdown__block {
  margin-right: 40px;
}

@media screen and (max-width: 1057px) {
  .custom-banner-internal .countdown__block {
    margin-right: 20px;
  }
}

.custom-banner-internal .countdown__unit {
  font-size: 2em;
  text-align: center;
  letter-spacing: -7px;
}

@media screen and (max-width: 1057px) {
  .custom-banner-internal .countdown__unit {
    letter-spacing: -4px;
  }
}

.custom-banner-internal .countdown__text {
  font-size: 0.5em;
  letter-spacing: 2px;
}