input:focus{
        outline: none;
    }
h1, h2, h3, h4 { text-align: center; }   

ul {
  list-style: none;
}

.left{
	text-align: left;
}

.subInfo { 
text-align: center;
justify-content: center;
font-size: 0.8em;
 } 
 
 .errorInfo { 
text-align: center;
justify-content: center;
font-size: 1.2em;
color: red;
 } 
 
/* Responsive image gallery rules begin*/

.image-gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-left:5px important!;
}

.image-gallery > li {
  position: relative;
  cursor: pointer;
}

.image-gallery::after {
  content: "";
  flex-basis: 350px;
}

.image-gallery li img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  border-radius: 5px;
}

.overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(57, 57, 57, 0.502);
  top: 0;
  left: 0;
  transform: scale(0);
  transition: all 0.2s 0.1s ease-in-out;
  color: #fff;
  border-radius: 5px;
  /* center overlay text */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* hover */
.image-gallery li:hover .overlay {
  transform: scale(1);
}

.btnImage img {
 border-radius:7px;
 min-height: 100px;
 max-width: 230px;
 margin: 0 auto;
 position: relative;
 display: block;
}

.btnImage span {
    background-color: silver;
    background-color: hsla(0, 0%, 100%, 0.5);
    position: absolute;
    bottom: 0;
    width: 100%;
	font-weight:bold;
    line-height: 2em;
    text-align: center;
}

.btnImage img:hover {
	opacity: 0.5;
	line-height: 3em;
	}
	
.btnEMessage{
	font-size:0.9em;	
}	

.rotate-45 {
transform: rotate(315deg);
}

#facts {
	text-align: left;
	max-width: 600px;
}

        
#facts ul {
  display: block;
  margin-left: -10px;
}

#facts ul li {
  display: block;
  position: relative;
}

#facts ul li:not(:last-child) {
  margin-bottom: 10px;
}

#facts ul li:before {
  content: "";
  position: absolute;
  top: 1.2em;
  left: -30px;
  margin-top: -.9em;
  background: #f69ec4;
  height: 12px;
  width: 12px;
  border-radius: 50%;
}
    
.step{
	margin-top:-60px;
}	

.gallery-block {


	}

.block-width{
	margin-left: auto;
    margin-right: auto;
	width: 90%;
}
	

/* Desktopscreen 992px to ... */
@media screen and (min-width: 992px){
	.mobile {display: none !important;}
	.no-mobile {display: block !important;}
	.image-gallery {
	  gap: 10px;
	  max-width: 1200px;
	  min-width: 1150px;
	}

	.image-gallery > li {
	  flex-basis: 350px; /*width: 350px;*/
	}

}

/* Small screen / tablet / 760px to 991px */

@media only screen  and (min-width: 760px) and (max-width: 991px){

	.mobile {display: block !important;}
	.no-mobile {display: none !important;}

	.image-gallery {
	  gap: 30px;
	  max-width: 760px;

	}	
	.image-gallery > li {
	  flex-basis: 320px; /*width: 350px;*/
	}	
	.desc{
		font-size: 1.2em;
		background-color: silver;
		background-color: hsla(0, 0%, 100%, 0.5);
		position: absolute;
		bottom: 0;
		width: 100%;
		font-weight:bold;
		line-height: 1.7em;
		text-align: center;
		}
	.wide-block-start {
	  background: #fff;
	  margin-left: -10px;
	  padding-left: 2%;
	  padding-right: 3%;
	}	
}

@media only screen and (min-width: 1024px) and (orientation: landscape){

	.mobile {display: block !important;}
	.no-mobile {display: none !important;}

	.image-gallery {
	  gap: 30px;
	  max-width: 760px;

	}	
	.image-gallery > li {
	  flex-basis: 320px; /*width: 350px;*/
	}	
	.desc{
		font-size: 1.2em;
		background-color: silver;
		background-color: hsla(0, 0%, 100%, 0.5);
		position: absolute;
		bottom: 0;
		width: 100%;
		font-weight:bold;
		line-height: 1.7em;
		text-align: center;
		}
	.wide-block-start {
	  background: #fff;
	  margin-left: -10px;
	  padding-left: 2%;
	  padding-right: 3%;
	}	
}

@media only screen  and (min-width: 760px) and (max-width: 991px) and (orientation:landscape) {

	.mobile {display: block !important;}

	.no-mobile {display: none !important;}

	.image-gallery {
	  gap: 50px;
	  max-width: 990px;
	  min-width: 800px;
	}	
	.image-gallery > li {
	  flex-basis: 320px; /*width: 350px;*/
	}	
	.desc{
		font-size: 1.2em;
		background-color: silver;
		background-color: hsla(0, 0%, 100%, 0.5);
		position: absolute;
		bottom: 0;
		width: 100%;
		font-weight:bold;
		line-height: 1.7em;
		text-align: center;
		}
	.wide-block-start {
	  background: #fff;
	  margin-left: -10px;
	  padding-left: 2%;
	  padding-right: 3%;
	}
}

/* Smaller screen / tablet+phone / 480px to 759px */

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

	.mobile {display: block !important;}
	.no-mobile {display: none !important;}
		.image-gallery {
		  gap: 20px;
		  max-width: 480px;
		  min-width: 305px;
		  margin-left: -10px;
		}	
	.image-gallery > li {
		  flex-basis: 140px; /*width: 350px;*/
		}	
	.desc{
		font-size: 1.2em;
		background-color: silver;
		background-color: hsla(0, 0%, 100%, 0.5);
		position: absolute;
		bottom: 0;
		width: 100%;
		font-weight:bold;
		line-height: 1.7em;
		text-align: center;
		}

	.wide-block-start {
	  background: #fff;
	  margin-left: 8px;
	  padding-left: 2%;
	  padding-right: 3%;
	}

	.btnImage img {
	 min-height: 50px;
	 max-width: 125px;
	 margin-top: 10px
	}	
	#facts {
	text-align: left;
	max-width: 480px;
	margin-left: 10px;
}

}

/* Extra small screen / smartphone / 280px to 479px */

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

.mobile {display: block !important;}
.no-mobile {display: none !important;}

.btnRe {
	margin-top: 30px
	}
	.desc{
		font-size: 1.2em;
		background-color: silver;
		background-color: hsla(0, 0%, 100%, 0.5);
		position: absolute;
		bottom: 0;
		width: 100%;
		font-weight:bold;
		line-height: 1.7em;
		text-align: center;
		}

	.wide-block-start {
	  background: #fff;
	  margin-left: 8px;
	  padding-left: 2%;
	  padding-right: 3%;
	}

	.btnImage img {
	 min-height: 50px;
	 max-width: 115px;
	 margin-top: 10px
	}	
	#facts {
	text-align: left;
	max-width: 480px;
	margin-left: 10px;
}	

}