body{

}


img {
border-radius: 5px; 
}


header {
margin-bottom: 35px; 

padding-top: calc(25px + 1vw); 

}



header > #mainLogo { 
width:35%;
min-width: 55px;
max-width: 150px; 
float: left;
border-radius: 20px;

margin-right: calc(35px + 0.5vw);  
margin-bottom: 35px;
box-shadow: 3px 5px 6px rgba(0, 0, 0, 0.25);   
}

h1 {

padding-left: 25px;

display: block;


font-size:calc(28px + 0.8vw);

font-weight: bold;
margin-bottom:  calc(2px + 0.1vw);   
}

header > #subtitle {

display: block;
font-size:calc(12px + 0.1vw);
margin-bottom:  calc(8px + 0.5vw);  
}


.buttonsTop{ 	
display: block;		
width: auto;
height:auto;
overflow:auto; 
}

.buttonStoreGoogle {
display: block;	
width:190px;
margin-left: -12px; 

margin-right: 26px; 
float: left; 	 
}


.buttonStoreApple {
display: block;	
width:190px;
margin-left: -12px; 


float: left;   
}

img { 

max-width: 100%;
height: auto;
} 












article {
display: block;
border-radius: 5px;
margin-bottom: 40px;
padding: 20px;
padding-left: 30px;
padding-right: 30px;
background-color: #E8E8E8;
width: auto;
box-shadow: 1px 3px 2px rgba(0, 0, 0, 0.25);
}

article >#text {
font-size:14px;
margin-bottom:10px;	
}


h2 {
font-size:20px;
margin-bottom:10px;
} 

h3 {
font-size:16px;
margin-bottom:10px;
} 



iframe {
margin-top:10px;  
border-radius: 5px;  
margin-bottom:10px;  
height:360px;     
}


.gallery {
margin-top:30px;  
}


.FullWidth >img {
width:100%;  
margin-top:10px; 
margin-bottom:calc(10px + 3vw);  
transition: all 1s ease-in-out 0s; 
cursor: -moz-zoom-in; 
cursor: -webkit-zoom-in; 
cursor: zoom-in;	
}

.FullWidth >img :last-of-type {		
margin-bottom:calc(10px + 1vw);
}


.grid-container {
display: grid;
grid-template-columns: auto auto auto auto;
grid-gap: 16px;  
padding: 0px;
margin-top:10px;
}

.grid-containerButtons {
display: grid;
grid-template-columns: auto auto;
grid-gap: 16px;  
background-color: #2196F3; 
padding: 0px; 
}


.myButton {
background-color: #F2F2F2;
border: none;
color: black; 
padding: 16px 5px;
text-align: center;
text-decoration: none;
display: block;
font-size: 18px;

margin: 0px 0px;
cursor: pointer;
border-radius: 5px;
box-shadow: 1px 3px 2px rgba(0, 0, 0, 0.25);

}

.myButton:hover {
background-color: #808080;
color: white;
}



.grid-container > but {
background-color: rgba(255, 255, 255, 0.8);
border: 1px solid black;
text-align: center;
font-size: 30px;
}




.FullWidth >img:active {
-ms-transform: scale(2,2); 
-webkit-transform: scale(2,2); 
transform: scale(2,2); 
border-radius: 15px;
}  

.container {
width: auto;
background-color: #00FFFF;
}

.topnav {
background-color: #333;
width: inherit;

position: absolute;
position: relative;
top: 0%;

left: 50%;
right: 50%;
}

.topnav a {
float: left;
background-color: #008000;

color: #f2f2f2;
padding-top:30px;
padding-bottom:30px;
padding-left:30px;
padding-right:30px;
text-align: center; 
text-decoration: none;
font-size: 17px;
border-radius: 5px; 
}

.topnav a:hover {
background-color: #ddd;
color: black;
}