/**
 *  developed by Carsten Riedrich
 * 	Germany 11/11/2020
 *  email: CR-dev@outlook.de
 *  
 */

@import url("./background.css");



body {	
	margin: 0;
	padding: 0;
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
	min-height: 100vh;
}

#christmas{
	display:flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 100%;
}

#containerK{
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	flex: 0 1 100%;
	align-self: center;
	max-width: 700px;
	max-height: 614px;
	padding: 30px 18px 0px 18px;
	border-radius: 23px;
	background-image: url("../img/background/a.jpg");	
	background-size: cover;
	justify-content: space-around;
	background-repeat: no-repeat;
	
}

.door{
	flex: 0 0 101px;
	/*border: 2px solid wheat;*/
	min-height: 125px;
	margin-bottom: 26px;
	opacity: 0.95;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 13px;
}

.door:hover{
	 cursor: pointer;
}

.backgroundLight{
	background-color: rgba(0,0,0,0.5);
	display: block;
	width: 100vw;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.viewZone{
	border: 2px solid wheat;
	display: flex;
	overflow: hidden;
	height: max-content;
	border-radius: 25px;
	max-width: 75vw;
	
}

.viewZone * {
	max-width: 100%;
}

a:matches(:link, :visited){
	background-color: red;
	width: 100px;
	height: 100px;
}



footer{	
	display: flex;
	flex: 0 1 700px;
	justify-content: flex-end;
	flex-direction: column;
	align-self: flex-end;
	justify-content: flex-end;
	align-items: flex-end;
	padding-right: 12px;
	transition: all 300ms;
	color: rgb(253, 238, 208);
}

footer p {
	margin: 0
}

#copyright{	font-size: 0.8rem;}

#copyright span{font-size: 1.1rem;}

#note{font-size: 0.6rem;}

footer:hover {
	transition: all 300ms;
	color: wheat;
}



@media screen and (max-height: 1024px){
	body{
		height: 100%;
		min-height: 100vh;
	}
    #containerK {
        max-height: 100% !important;       
        
    }
}
