body{
	padding:50px;
	background-image: linear-gradient(45deg,#8e9eab,
#eef2f3);
    
 	 animation:gradient 10s ease infinite;
}
@keyframes gradient{
    0%{
	 background-position:0% 50%;
	}
	50%{
	background-position:100% 50%;	
	}
	100%{
	background-position:0% 50%;
	}
	}	

	.yellow-box{
	background-image:url("чайки.jpg");
	border:solid 1px black;
	border-radius:20px;
	margin-bottom:60px;
	padding:50px;
	position:relative;
	box-shadow: 
	            -3px 3px white,
				10px 10px 5px #BE9559,
				15px 15px 5px #BE9961,
				20px 20px 5px #BE9C6A,
				25px 25px 5px #BEA175,
				30px 30px 5px #BEA47E,
				35px 35px 5px #BEAA8B,
				40px 40px 5px #BEAD94;
				animation-name:shadow-color;
                animation-duration: 3s;
                animation-iteration-count: infinite;
	}			

@keyframes shadow-color{
	0%{box-shadow:
	           -3px 3px white,
	           10px 10px 5px #BE9559,
			   15px 15px 5px #BE9961,
				20px 20px 5px #BE9C6A,
				25px 25px 5px #BEA175,
				30px 30px 5px #BEA47E,
				35px 35px 5px #BEAA8B,
				40px 40px 5px #BEAD94;
}
1%{box-shadow: 
	          -3px 3px white,
	           10px 10px 5px #BE9559,
			   15px 15px 5px #BE9961,
				20px 20px 5px #BE9C6A,
				25px 25px 5px #BEA175,
				30px 30px 5px #BEA47E,
				35px 35px 5px #BEAA8B,
				40px 40px 5px #BEAD94;
}
  14%{ box-shadow: 
		      -3px 3px white,
	           10px 10px 5px #BEAD94,
			   15px 15px 5px #BE9559,
				20px 20px 5px #BE9961,
				25px 25px 5px #BE9C6A,
				30px 30px 5px #BEA175,
				35px 35px 5px #BEA47E,
				40px 40px 5px #BEAA8B;
		 
	     }
  28%{box-shadow:
                -3px 3px white,		
	            10px 10px 5px #BEAA8B,
				15px 15px 5px #BEAD94,
				20px 20px 5px #BE9559,
				25px 25px 5px #BE9961,
				30px 30px 5px #BE9C6A,
				35px 35px 5px #BEA175,
				40px 40px 5px #BEA47E;
        }
  42%{
		box-shadow:
		        -3px 3px white,       
			   	10px 10px 5px #BEA47E,
				15px 15px 5px #BEAA8B,
				20px 20px 5px #BEAD94,
				25px 25px 5px #BE9559,
				30px 30px 5px #BE9961,
				35px 35px 5px #BE9C6A,
				40px 40px 5px #BEA175;
		}
 56%{
		box-shadow:
		        -3px 3px white,
			  	10px 10px 5px #BEA175,
				15px 15px 5px #BEA47E,
				20px 20px 5px #BEAA8B,
				25px 25px 5px #BEAD94,
				30px 30px 5px #BE9559,
				35px 35px 5px #BE9961,
				40px 40px 5px #BE9C6A;
		} 
70%{
		box-shadow:
		        -3px 3px white,
			    10px 10px 5px #BE9C6A,
				15px 15px 5px #BEA175,
				20px 20px 5px #BEA47E,
				25px 25px 5px #BEAA8B,
				30px 30px 5px #BEAD94,
				35px 35px 5px #BE9559,
				40px 40px 5px #BE9961;
		} 
 84%{
		box-shadow:
	            -3px 3px white,
		        10px 10px 5px #BE9961,
				15px 15px 5px #BE9C6A,
				20px 20px 5px #BEA175,
				25px 25px 5px #BEA47E,
				30px 30px 5px #BEAA8B,
				35px 35px 5px #BEAD94,
				40px 40px 5px #BE9559;
				
 }		     
100%{
		box-shadow:
		        -3px 3px white,
		        10px 10px 5px #BE9559,
				15px 15px 5px #BE9961,
				20px 20px 5px #BE9C6A,
				25px 25px 5px #BEA175,
				30px 30px 5px #BEA47E,
				35px 35px 5px #BEAA8B,
				40px 40px 5px #BEAD94;
			 			 
}
}

				
				
	.silver-box{
	border-radius:20px;
	background-color:rgba(100,100,100,0.7);
	padding:20px;
	position:relative;
	
				
}
	p
	{color:white ;
	font-size: 46pt;
	font-family: Brush Script MT;
	text-align:center;
    
	margin-bottom:-110px;
	position:relative 50%;
	 
	
}
.Link-main{
	
	text-align:right;
	
    color:#FFDB00;
	font-size: 20pt;
	font-family: Brush Script MT;
	text-decoration:none;
	
}
.main{
	display:inline-block;
position: relative;	
margin-bottom:5px;
margin-left:80%; 

}
.rightpic{
   
	
	
	position:relative;
	top:2px;
	left:2px;
	
	
}
.card1{
	border:solid 1px black;
	border-radius: 10px; 
	margin:50px;
	padding:10px;
	width: 300px;
	box-shadow: inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
				10px 10px 5px red,
				15px 15px 5px orange,
				20px 20px 5px yellow,
				25px 25px 5px green,
				30px 30px 5px cyan,
				35px 35px 5px blue,
				40px 40px 5px violet;
				display:inline-block;
				position: relative;
				left:30px;
				top:30px;
				animation-name:box-shadow;
                animation-duration: 3s;
                animation-iteration-count: infinite;
				
}
@keyframes box-shadow{
	0%{box-shadow: inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
	           10px 10px 5px red,
			   15px 15px 5px orange,
				20px 20px 5px yellow,
				25px 25px 5px green,
				30px 30px 5px cyan,
				35px 35px 5px blue,
				40px 40px 5px violet;
}
1%{box-shadow: inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
	           10px 10px 5px red,
			   15px 15px 5px orange,
				20px 20px 5px yellow,
				25px 25px 5px green,
				30px 30px 5px cyan,
				35px 35px 5px blue,
				40px 40px 5px violet;
}
   14%{
		box-shadow: 
		 inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
	             10px 10px 5px orange, 
				15px 15px 5px yellow,
				20px 20px 5px green,
				25px 25px 5px cyan,
				30px 30px 5px  blue,
				35px 35px 5px violet,
				40px 40px 5px red;
        }
  28%{
		box-shadow:
 inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,		
	            10px 10px 5px yellow, 
				15px 15px 5px green,
				20px 20px 5px cyan,
				25px 25px 5px blue,
				30px 30px 5px  viole,
				35px 35px 5px red,
				40px 40px 5px orange;
        }
  42%{
		box-shadow:
		 inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,       
			   	10px 10px 5px green, 
				15px 15px 5px cyan,
				20px 20px 5px blue,
				25px 25px 5px viole,
				30px 30px 5px  red,
				35px 35px 5px orange,
				40px 40px 5px yellow;
		}
 56%{
		box-shadow:
		 inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
			  	10px 10px 5px cyan, 
				15px 15px 5px blue,
				20px 20px 5px viole,
				25px 25px 5px red,
				30px 30px 5px  orange,
				35px 35px 5px yellow,
				40px 40px 5px green;
		} 
705%{
		box-shadow:
		 inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
			    10px 10px 5px blue, 
				15px 15px 5px viole,
				20px 20px 5px red,
				25px 25px 5px orange,
				30px 30px 5px yellow,
				35px 35px 5px green,
				40px 40px 5px cyan;
		} 
 84%{
		box-shadow:
		 inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
		        10px 10px 5px viole, 
				15px 15px 5px red,
				20px 20px 5px orange,
				25px 25px 5px yellow,
				30px 30px 5px green,
				35px 35px 5px cyan,
				40px 40px 5px blue;
				
 }		     
100%{
		box-shadow:
		 inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
		        10px 10px 5px red, 
				15px 15px 5px orange,
				20px 20px 5px yellow,
				25px 25px 5px green,
				30px 30px 5px cyan,
				35px 35px 5px blue,
				40px 40px 5px viole;
			 			 
			 
			
		
}
				
}


.card2{
	border:solid 1px black;
	border-radius: 10px; 
	margin:50px;
	padding:10px;
	width: 200px;
	box-shadow: inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
				10px 10px 5px red,
				15px 15px 5px orange,
				20px 20px 5px yellow,
				25px 25px 5px green,
				30px 30px 5px cyan,
				35px 35px 5px blue,
				40px 40px 5px violet;
				display:inline-block;
				position: relative;
				left:30px;
				top:30px;
				animation-name:box-shadow;
                animation-duration: 3s;
                animation-iteration-count: infinite;
}
.card3{
	border:solid 1px black;
	border-radius: 10px; 
	margin:50px;
	padding:10px;
	width: 200px;
	box-shadow: inset 3px 3px 20px 10px #C8AA78, 
	            -3px 3px black,
				10px 10px 5px red,
				15px 15px 5px orange,
				20px 20px 5px yellow,
				25px 25px 5px green,
				30px 30px 5px cyan,
				35px 35px 5px blue,
				40px 40px 5px violet;
				display:inline-block;
				position: relative;
				left:30px;
				top:30px;
				animation-name:box-shadow;
                animation-duration: 3s;
                animation-iteration-count: infinite;
}
.name{
	text-align: center;
}
h1{
color:black;	
}

h2{
color:black;	
}
text{
color:black;	
}
.Link-contacts{
	text-align:right;
	
    color:#FFDB00;
	font-size: 20pt;
	font-family: Brush Script MT;
	text-decoration:none;
	}
.contacts{
	
position: relative;	
margin-bottom:auto;
margin-left:85%; 
}
a:hover{
	color:white;
}