body { 
	height: 100vh;
/*	max-width: 1920px;*/
	margin: 0 auto !important; 
	float: none !important;

}

video {
  width: 100%;
  height: auto;
}


input.w3-input {
border-radius:0px;
}

select.w3-select {
border-radius:0px;
} 



.bg {
	
	background: linear-gradient(-45deg, #007F98, #013333, #007F98, #013333);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;

}

.bgLeft {
	height: 100vh;
	background: url('1920x1080_-02.png');
	background-repeat: no-repeat;
	background-size: auto;
	background-position: bottom left;
	position: relative;
	background-attachment: fixed;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}



.bg01 {
	height: 80vh;
background: url('bg01.webp');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top right;
	position: relative;
	background-attachment: fixed;

}

.bg02 {
	height: 80vh;
	background: url('bg02.webp');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: bottom center;
	background-attachment: fixed ;
}
.bg03 {
	height: 80vh;
	background: url('bg03.webp');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: bottom center;
	background-attachment: fixed;
}

.bg04 {
	height: 100vh;
	background: url('bg04.webp');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: bottom right;
	background-attachment: fixed;
}

.bg05 {
height: 80vh;
background-image: url('bg05.webp');
background-position:center; 
background-attachment: fixed; 
background-size: cover; 
background-repeat:no-repeat;
}

.bgContact {
	background-image: url('bgContact.png');
	background-repeat: no-repeat;
	background-position:  center  bottom;
	background-attachment: fixed;
	background-size:cover;
	}
	
	

.pointer{cursor:pointer;}
a:link {text-decoration:none;}





#myBtn {
display: none;
position: fixed;
bottom: 30px;
right: 20px;
z-index: 30;
font-size: 18px;
border: none;
outline: none;
background-color: red;
color: white;
cursor: pointer;
padding: 10px;
border-radius: 4px;
/*opacity: 0.5;*/
min-height:50px;
min-width:50px;

}

#myBtn:hover {
background-color: #5555;
}

/* [1] The container */
.w3-hover-zoom {
/* height: 300px; /* [1.1] Set it as per your need */
overflow: hidden; /* [1.2] Hide the overflowing of child elements */
}
/* [2] Transition property for smooth transformation of images */
.w3-hover-zoom img {
/* transform-origin: 0 0; */
transition: transform .5s ease;
}
/* [3] Finally, transforming the image when container gets hovered */
.w3-hover-zoom:hover img {
transform: scale(1.2);
}
.w3-hover-zoom-small {
overflow: hidden;
}
.w3-hover-zoom-small img {
transition: transform .5s ease;
}
.w3-hover-zoom-small:hover img {
transform: scale(1.075);
}
.w3-animate-move {
overflow: hidden;
}
.w3-animate-move {
transition: transform 0.5s ease;
}
.w3-animate-move:hover {
transform: translate(10px, 0);
}




.xTab {
background-color: #f1f1f1;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 5px 12px;
transition: 0.3s;
border-radius: 0px 0px 15px 15px;
}

/* Style the tab */
.tab {
overflow: hidden;
/*border: 1px solid #ccc;
background-color: #f1f1f1;*/
}

/* Style the buttons that are used to open the tab content */
.tab button {
background-color: #f1f1f1;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 5px 10px;
transition: 0.3s;
border-radius: 8px 8px 0px 0px;
}

/* Change background color of buttons on hover */
.tab button:hover {
background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
display: none;
padding: 12px 12px;
border: 1px solid #ccc;
/* border-top: none;*/
}






@media screen and (max-width: 800px) {
	
.bgLeft {
	height: 100vh;
	background: url('1920x1080_-02.png');
	background-repeat: no-repeat;
	background-size: auto;
	background-position: bottom left;
	position: relative;
	background-attachment: fixed;
}



	.bg00 {
/*    height: 100vh;*/
	background: url('bg00.webp');
	background-repeat: no-repeat;
	background-size: cover;
	background-position:  bottom left;
	position: relative;
	background-attachment: scroll;

}


.bg01 {
	height: 50vh;
background: url('bg01.webp');
	background-repeat: no-repeat;
	background-size:100%;
	background-position: top right;
	position: relative;
	background-attachment: scroll;

}

.bg02 {
	height: 50vh;
	background: url('bg02.webp');
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: bottom center;
	
	background-attachment: scroll ;
}
.bg03 {
	height: 50vh;
	background: url('bg03.webp');
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: bottom center;
	background-attachment: scroll;
}

.bg04 {
	height: 50vh;
	background: url('bg04.webp');
	background-repeat: no-repeat;
	background-size:100%;
	background-position: bottom right;
	background-attachment: scroll;
}

.bg05 {
height: 50vh;
background-image: url('bg05.webp');
background-position:center; 
background-attachment: scroll; 
	background-size:100%;
background-repeat:no-repeat;
}


}




