body 
{
	min-width:420px;
	background-color:#EEEEEE;
	font-family: Monotype Corsiva, Arial;
	color:#EEEEEE;
	margin:0;
	padding:0;
}
header
{
	perspective:1500px;
	width:100%;
	height:100vh;
	background: url("img/pc.jpg") no-repeat center top / cover;
}
h1
{
	margin:0;
	animation:nh1 3s alternate infinite;
	color:white;
	text-align:center;
	font-size:60pt;
	text-shadow:0px 0px 10px  black;
	padding-top:35vh;
}
h2
{
	margin:0;
	animation:sign 3s alternate infinite;
	text-align:center;
	font-size:40pt;
	text-shadow:0px 0px 10px  black;
	padding-top:15px;
}
.containier
{
	padding-left:10%;
	padding-right:10%;
}
nav
{
	position:fixed;
	top:0px;
	text-align:center;
	width:100%;
	background-color:rgba(0,0,0,0.3);
}
nav li
{
	display:inline;
	padding: 11px;
}
nav a:hover
{
	color:#8a2be2;
	transform:scale(1.05);
}
nav a
{
	transition:0.7s;
	color:white;
	font-size:30px;
	text-decoration:none;
	text-transform:uppercase;
}
#cart
{
	text-align:center;
}
.pr
{
	border-radius:13px;
	box-shadow:0px 0px 10px 3px rgba(0,0,0,0.3);
	margin:20px;
	max-width:320px;
	width:100%;
	display:inline-block;
	transition:0.5s;
}
.pr:hover
{
	transform: rotate(-5deg) scale(1.125);
}
.pr img
{
	width:100%;
}
.pr2
{
	background-color: #82c55a;
	border-radius:13px;
	box-shadow:0px 0px 10px 3px rgba(0,0,0,0.3);
	margin:20px;
	max-width:320px;
	width:100%;
	display:inline-block;
	padding:10px;
}
.pr2 img
{
	border-radius:13px;
	width:100%;
}
.price
{
	background-color: #82c55a;
	border-radius:13px;
	font-size:20pt;
}
#contacts{
	background-color: #ff5a3f;
	text-align:center;
}
#tel{
	text-align:left;
	font-size:20pt;
}

#tel, #maps{
	width:35%;
	margin:10px;
	padding:0px;
	display:inline-block;
	height:250px;
	vertical-align:middle;
}
#socseti img{
	margin:10px;
}
#copy{
	text-align:center;
	color:black;
}
@media screen and (max-width: 600px)
{
	h1{
		font-size:50pt;
	}
	h2{
		font-size:35pt;
	}
	nav a{
		display:inline;
		list-style-type:none;
		font-size:20px;
	}
	#tel, #maps{
		width:80%;
	}
}
@media screen and (max-width: 400px)
{
	h1{
		font-size:25pt;
	}
	h2{
		font-size:20pt;
	}
	nav a{
		display:inline;
		list-style-type:none;
		font-size:15pt;
	}
}
@keyframes sign {
	from {color: #F0FFFF;}
	to {color: #F0F8FF;}
}
@keyframes nh1{
	0%{
		transform:translate3d(0,0,0);
		text-shadow:black 10px 10px 3px;
	}
	25%{
		transform:translate3d(0,0,300px);
		text-shadow:black 10px 10px 50px;
	}
	50%{
		transform:translate3d(0,0,0);
		text-shadow:black 10px 10px 3px;
	}
	51%{
		transform:rotateY(0deg);
	}
	100%{
		transform:rotateY(360deg);
	}
	
}
#pal{
	position:fixed;
	right:10px;
	top:-40px;
	background-color:rgba(0,0,0,0.7);
	color:white;
	font-weight:bold;
	width:200px;
	text-align:center;
	border-radius:10px;
	z-index:3;
	transition:1s;
}
#pal:hover{top:0px;}
.s1, .s2, .s3, .s4{
	border:solid black;
	margin:1px;
	cursor:pointer;
}
.s1{background-color:white;}
.s2{background-color:red;}
.s3{background-color:green;}
.s4{background-color:blue;}
#pal #cv div{
	display:inline-table;
	width:30px;
	height:30px;
}