*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');
body{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
}



.centar{
    text-align: center;
    position: absolute;
  	top: 39%;
  	left: 50%;
  	transform: translate(-50%, -50%);
  	background-color: #fff;
  	/*border-radius: 15px;
  	box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
  	
  	*/ 
 	  padding: 3% 3%;
 	  margin-bottom: 1%;
      margin-top: 1%;
 	

	/*background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
	border: 1px solid rgba(255, 255, 255, 0.18);*/
	  border-radius: 15px;
	  box-shadow:
  		1px 3px 10.5px -6px rgba(0, 0, 0, 0.329),
  		2.5px 9.8px 20.1px -6px rgba(0, 0, 0, 0.398),
  		8px 23.1px 34.4px -6px rgba(0, 0, 0, 0.426),
  		15px 50.9px 58.2px -6px rgba(0, 0, 0, 0.435),
  		36px 134px 108px -6px rgba(0, 0, 0, 0.45);

}

.soon {
    font-family: 'Montserrat', sans-serif;
    font-size: 3rem;
    line-height: 1.1;
	padding: 15px 15px 20px 15px;
    margin-top: 25px;
    color: black;
}

.mejl {
    margin-top: 15px;
    font-family: 'Montserrat', sans-serif;
    font-size: 1.3rem;
    line-height: 1.2;
    color: #000000;
}

.mejl a {
    text-decoration: none;
    color: #000000;
    
}

.mejl a:hover {
    text-decoration: none;
    color: #e8041d;
}


img {
    max-width: 325px;
    max-height: auto;
}

section {
    display: inline-block;
    padding: 1%;
    
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
.centar{
    padding: 5% 3%;
    margin-bottom: 1%;
    margin-top: 1%;
    }
.soon {
    font-size: 1rem;
    line-height: 0.7;
    padding: 7px 7px 10px 7px;
    margin-top: 10px;
    width: 250px;
    
}

.mejl {
    margin-top: 10px;
    font-size: 0.7rem;
    line-height: 0.7;
} 
img{
      max-width: 155px;
      max-height: auto;
  } 
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
.centar{
    padding: 3% 3%;
    margin-bottom: 1%;
    margin-top: 1%;
    }
.soon {
    font-size: 1rem;
    line-height: 0.7;
    padding: 7px 7px 10px 7px;
    margin-top: 10px;
    width: 250px;
    
}

.mejl {
    margin-top: 10px;
    font-size: 0.7rem;
    line-height: 0.7;
} 
img{
    max-width: 167px;
    max-height: auto;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
.centar{
    padding: 3% 3%;
    margin-bottom: 1%;
    margin-top: 1%;
    }
.soon {
    font-size: 2rem;
    line-height: 1.1;
    padding: 10px 10px 15px 10px;
    margin-top: 20px;
    width: 400px;
    
}

.mejl {
    margin-top: 15px;
    font-size: 1rem;
    line-height: 1;
}
img {
    max-width: 325px;
    max-height: auto;
} 
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
.centar{
    padding: 3% 3%;
    margin-bottom: 1%;
    margin-top: 1%;
    }
.soon {
    font-size: 3rem;
    line-height: 1.1;
    padding: 15px 15px 20px 15px;
    margin-top: 25px;
    width: 570px;
    
}

.mejl {
    margin-top: 15px;
    font-size: 1.3rem;
    line-height: 1.2;
}
img {
    max-width: 325px;
    max-height: auto;
}
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px){
.centar{
    padding: 3% 3%;
    margin-bottom: 1%;
    margin-top: 1%;
    }
.soon {
    font-size: 3rem;
    line-height: 1.1;
    padding: 15px 15px 20px 15px;
    margin-top: 25px;
    width: 570px;
    
}

.mejl {
    margin-top: 15px;
    font-size: 1.3rem;
    line-height: 1.2;
}
img {
    max-width: 325px;
    max-height: auto;
} 
}