@media (max-width: 1199px){
.carousel .carousel-inner {height: auto;}
}

@media (max-width: 767px) {
  .links .navbar-toggler,  .block-contact .block-contact-title, .block-contact .navbar-toggler .material-icons {
    display: inline-block; padding: 0; color: #000;}}




/* Home Section Top & Bottom */

#wrapper-topcat {background:#e1e1e1;}

.catbox {margin-top:50px}
.catbox img {max-width:100%;}

.greylayer h2 {margin-top:20%; border-bottom:1px solid #fff; padding-bottom:11px; color: #279acd;font-weight: normal;
  font-size: 19px}
.greylayer h2::before {content: '';width: 40px;height: 2px;background: #279acd;position: absolute;margin-top: 31px;}
.greylayer p {color:#279acd;}
.greylayer .material-icons {font-size:16px; color:#279acd}
.greylayer {color:#fff;left:10%;border-radius:5px;padding:15px;z-index:10}
.greylayer-btn {text-align:center;color:#279acd;left:14%;bottom:10%;border-radius:5px;border:1px solid #279acd;padding:6px;transition: background 2s; margin-top:40px}
.greylayer-btn .btn {color:#279acd}
.greylayer-btn .btn:hover {color:#fff}
.greylayer-btn:hover{background:#279acd;color:#fff;}


/*
.greylayer-right h2 {margin-top:40%; border-bottom:1px solid #f1f1f1; padding-bottom:11px;color: #279acd}
.greylayer-right h2::before {content: '';width: 40px;height: 2px;background: #279acd;position: absolute;margin-top: 35px;}
.greylayer-right p {color:#00c975;}
.greylayer-right .material-icons {font-size:16px; color:#00c975}
.greylayer-right {color:#fff;left:10%;border-radius:5px;padding:15px; z-index:10}
.greylayer-right-btn {text-align:center;color:#fff;right:14%;bottom:10%;border-radius:5px;border:1px solid #279acd;padding:6px; transition: background 2s;}
.greylayer-right-btn .btn {color:#279acd}
.greylayer-right-btn:hover{background:#279acd;color:#fff}
*/

@media (max-width:767px){
.catbox {margin: 10px}
.catbox img {margin: 0 auto; display:block}
.greylayer h2, .greylayer-right h2 {border-bottom:none;margin-top:0px}
.greylayer-right, .greylayer {text-align:center;right:0;left:0}}



/* Stop Home Section Top & Bottom */


/* kommentare */

.btn-comment {margin: 0 auto;}
/* stop kommentare */







/*-------------------------- Start Home page Service CMS Block -------------------------------*/

#czservicecmsblock .service_container {
	padding-top: 0px;
	padding-bottom: 0px;
	margin: 0px auto;
}

#czservicecmsblock .service_container .service-area {
	padding: 45px 0 85px 0;
	border-bottom: 1px solid #ededed;
	float: left;
	width: 100%;
	text-align: center;
}

#czservicecmsblock .service_container .service-area .service-third {
	float: left;
	width: 33.33%;
	padding: 0 30px;
}

#czservicecmsblock .service_container .service-area .service-third .service-icon {
	display: inline-block;
	height: 45px;
	width: 60px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	background-color: #111111;
	-webkit-mask-size: 40px;
	mask-size: 40px;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-position: center;
}

#czservicecmsblock .service_container .service-area .service-third.service1 .icon1 {
	-webkit-mask-image: url(https://pomade.ch/img/content/codezeel/service_icon1.svg);
	mask-image: url(https://pomade.ch/img/content/codezeel/service_icon1.svg);
}

#czservicecmsblock .service_container .service-area .service-third.service2 .icon2 {
	-webkit-mask-image: url(https://pomade.ch/img/content/codezeel/service_icon2.svg);
	mask-image: url(https://pomade.ch/img/content/codezeel/service_icon2.svg);
}

#czservicecmsblock .service_container .service-area .service-third.service3 .icon3 {
	-webkit-mask-image: url(https://pomade.ch/img/content/codezeel/service_icon3.svg);
	mask-image: url(https://pomade.ch/img/content/codezeel/service_icon3.svg);
	-webkit-mask-size: 55px;
	mask-size: 55px;
}

#czservicecmsblock .service_container .service-area .service-third:hover .service-icon {
	background-color: #777;
}

#czservicecmsblock .service_container .service-area .service-third .service-icon,
#czservicecmsblock .service_container .service-area .service-third:hover .service-icon {
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#czservicecmsblock .service_container .service-area .service-third .service-content .service-heading {
	text-transform: capitalize;
	color: #111111;
	margin-bottom: 5px;
	font-size: 18px;
	font-weight: 700;
	line-height: 35px;
}

@media (max-width: 1199px) {
	#czservicecmsblock .service_container .service-area {
		padding: 30px 0 50px 0;
	}
	#czservicecmsblock .service_container .service-area .service-third {
		padding: 0 10px;
	}
}

@media (max-width: 991px) {
	#czservicecmsblock .service_container .service-area .service-third .service-content .service-heading {
		font-size: 18px;
	}
}

@media (max-width: 767px) {
	#czservicecmsblock .service_container .service-area {
		padding: 30px 0;
	}
	#czservicecmsblock .service_container .service-area .service-third {
		width: 100%;
		margin-bottom: 35px;
	}
}



/*--------------------------

Start Home page Service CMS Block

-------------------------------*/

#custom-text{
  background-image: url(https://pomade-international.com/img/barber_image.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-blend-mode: darken;
  padding: 15px;
}

#custom-text h2 {color:#fff; text-transform: normal;}
#custom-text p {color: #fff; text-align: center;}




/*********************  CMS Banner homepage    ********************/

#czbannercmsblock {
    width: 100%;
    margin-top: 10px;
    margin-bottom: 40px;
	position: relative;
	clear: both;
}
#czbannercmsblock .cmsbanners {
    margin: 0 -15px;
}
#czbannercmsblock .image-banner {
  position: relative;
  width: 100%;
  display: block;
  overflow: none;
}
#czbannercmsblock .cmsbanners .one-half {
    width: 50%;
	padding: 0 15px;
	float:left;
}
#czbannercmsblock .cmsbanners .cmsbanner {
    position: relative;
	overflow:hidden;
	vertical-align: middle;
	display: inline-block;
}
#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text {
    position: absolute;
    text-align: left;
    left: 40px;
    top: 65px;
	z-index: 1;
	color: #1e1e1e;
	letter-spacing: 0;
	text-transform: capitalize;
}
#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .offer-title {
    font-size: 17px;
}
#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .main-title {
	font-size: 32px;
    line-height: 34px;
    font-weight: 700;
    margin-top: 10px;
    letter-spacing: -0.5px;
}
#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .main-title span {
    display: block;
}
#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .shopnow {
	margin-top: 15px;
}
#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .shopnow .btn-link {
	font-size: 12px;
    font-weight: 600;
    text-decoration: underline;
    text-transform: uppercase;
}
#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .shopnow .btn-link:hover {
	text-decoration: none;
}
#czbannercmsblock .cmsbanners .cmsbanner img {
	max-width: 100%;
	-webkit-transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -o-transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
#czbannercmsblock .cmsbanners .cmsbanner:hover img {
	-webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
}
#czbannercmsblock .cmsbanners .cmsbanner .banner-anchor {
	display: inline-block;
	position: relative;
}

@media (max-width: 1199px) and (min-width: 992px) {
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text {
		top: 30px;
    	left: 30px;
	}
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .main-title {
		font-size: 26px;
	}
}
@media (max-width: 991px){
	#czbannercmsblock .cmsbanners {
		margin: 0 -10px;
	}
	#czbannercmsblock .cmsbanners .one-half {
		padding: 0 10px;
	}
}
@media (max-width: 991px) and (min-width: 576px) {
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text {
		left: 25px;
 		top: 10px;
	}
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .offer-title {
		font-size: 14px;
	}
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .main-title {
		font-size: 18px;
		line-height: 26px;
		margin-top: 5px;
	}
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .shopnow {
		margin-top: 5px;
	}
}
@media (max-width: 575px) {
	#czbannercmsblock .cmsbanners .one-half{
		width: 100%;
		float: none;
		margin: 0 auto;
	}
	#czbannercmsblock .cmsbanners .cmsbanner-part2 {
		margin-top: 20px;
	}
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text{
		left: 25px;
    	top: 40px;
	}
}
@media (max-width: 480px) {
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text {
		top: 25px;
    	left: 20px;
	}
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .offer-title {
		font-size: 15px;
	}
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .main-title {
		font-size: 21px;
		line-height: 26px;
	}
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .shopnow {
		margin-top: 10px;
	}
}
@media (max-width: 420px) {
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .offer-title {
		font-size: 14px;
		line-height: 20px;
	}

	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .main-title {
		font-size: 16px;
		line-height: 20px;
		margin-top: 5px;
	}
	#czbannercmsblock .cmsbanners .cmsbanner .cmsbanner-text .shopnow {
		margin-top: 5px;
	}
}

@media (min-width: 1300px) {
  #czbannercmsblock .overlay-content {
    width: 125%;
    transform: translateX(-10%);
  }
}
#czbannercmsblock .overlay-content {
  top: 0;
  left: 0;
  height: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: rgba(0,0,0,.65);
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-image: none;
    background-size: auto;
  color: #fff;
  padding: 15px;
  box-sizing: border-box;
  background-image: url(https://pomade-international.com/img/barber_image.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-blend-mode: darken;
}

#czbannercmsblock .banner-text {
  margin-bottom: 20px;
  text-align: center;
  font-size: 16px;
  line-height: 28px;
  width: 70%;
}

#czbannercmsblock .banner-text p, #czbannercmsblock .banner-text h1 {color:#fff;}