html {
    height: auto;
	width: 96%;
	margin: 0 auto;
	background-color: black;
	background-image: url('fon_.jpg');
	background-size: 100%;
	background-repeat: vertical;
	background-attachment: fixed;
	background-position: center;
	font-family: arial, tahoma, verdana;
	color: white;
}

body {
    height: auto;
	width: 70%;	
	margin: 0 auto;
	text-align: center;
	
}

header {
    height: 120px;
	width: auto;	
	margin: 0 auto;
	margin-top: 45px;
	background: rgb(0,50,100);	
	padding: 0px;
	font-size: 150%;
	color: rgb(255, 255, 255);
	font-family: Arial Black;

	
}


#rightnavy {
	width: 45px;
	height: 135px;
	background: rgba(240,100,50, 1.0);
	position: fixed;
	right: 0px;
	bottom: calc(50% - 80px);
	text-align: center;
	border-left: 1px solid gray;
	border-top: 1px solid gray;
	border-bottom: 1px solid gray;
	border-radius: 20px 0px 0px 20px;
	z-index: 999;

}

#botnavy {
	width: 100%;
	height: 55px;
	background: rgb(240,100,50);
	position: fixed;
	right: 0px;
	bottom: 0px;
	text-align: center;
	padding-top: 5px;
	border-left: 0px solid gray;
	border-top: 0px solid white;
	border-bottom: 0px solid gray;
	border-radius: 0px 0px 0px 0px;
	z-index: 999;
	font-family: arial;
	color: white;
	font-weight: 600;
	

}

#topnavy {
	width: 100%;
	height: 30px;
	background: rgb(240,100,50);
	position: fixed;
	right: 0px;
	top: 0px;
	text-align: center;
	padding-top: 5px;
	border-left: 0px solid gray;
	border-top: 0px solid gray;
	border-bottom: 3px solid white;
	border-radius: 0px 0px 0px 0px;
	z-index: 999;
	font-family: arial;
	color: white;
	font-weight: 600;
	font-size: 24px;

}

@font-face {
	font-family: 'Tahoma'; 
	src: url(/fonts/tahoma.ttf); 
}
 

@font-face {
	font-family: 'Matricha'; 
	src: url(/fonts/Matricha.ttf); 
}

center {

	height: auto;
	width: 100%;	
	margin: 0 auto;
	background: rgb(240,100,50);	
	font-size: 16px;
	text-align: center;
	color: rgb(255,255,255);
	font-family: Arial Black;


	
}

#center1 {
    min-height: 30px;
	width: auto;	
	margin: 0 auto;
	background: rgba(0,50,100, 0.1);	
	padding: 10px;
	font-size: 24px;
	text-align: left;
	color: rgb(50, 50, 50);
	font-family: Tahoma;
	
}

.boxShadow3 {
  width: 300px;
  height: 350px;
  margin: 0 auto;
  color: white;
  border-radius: 15px;
  padding: 5px;
  font-size: 14px;
  text-align: center;
  font-weight: bold;
  box-shadow:
   0 1px 4px rgba(0, 0, 0, .5),
   -23px 0 20px -23px rgba(0, 0, 0, .8),
   23px 0 20px -23px rgba(0, 0, 0, .8),
   0 0 40px rgba(0, 0, 0, .1) inset;
 	display: inline-block;  
}

#center2 {
    height: auto;
	width: 100%;	
	margin: 0 auto;
	background: rgb(240,100,50);	
	padding: 20x;
	font-size: 18px;
	text-align: left;
	color: rgb(255, 255, 255);
	font-family: Arial;
	
}

#left1 {
    float: left;
    width: 50%;
	height: 450px;
	color: #f5f5f5;
    margin: 0;
	text-align: left;
	font-size: 28px;
	padding: 0px;
	border: none;
	background: rgb(0,50,100);

}

#right1 {
    float: left;
    width: 50%;
	height: 450px;
	color: black;
    margin: 0;
	text-align: left;
	font-size: 20px;
	padding: 0px;
	border: none;
	background: rgb(0,50,100);
}

#left_h {
    float: left;
    width: 50%;
	height: 150px;
	color: #f5f5f5;
    margin: 0;
	text-align: left;
	font-size: 28px;
	padding: 0px;
	border: none;
	background: rgb(0,50,100);

}

#right_h {
    float: left;
    width: 50%;
	height: 150px;
	color: black;
    margin: 0;
	text-align: left;
	font-size: 20px;
	padding: 0px;
	border: none;
	background: none;
}

   a{
	color: rgb(0, 50, 100); /* цвет ссылки */
	text-decoration: none; /* убираем подчеркивание */
   }

        @media screen and (min-width:359px) and (max-width:799px) {
             
body {
    
    width: 100%;
    	
}

header {
    height: 130px;

	
}

center {

	font-size: 16px;
	
}

#center1 {
    min-height: 30px;
	width: auto;	
	margin: 0 auto;
	background: rgba(0,50,100, 0.1);	
	padding: 10px;
	font-size: 20px;
	text-align: left;
	color: rgb(50, 50, 50);
	font-family: Tahoma;
	
}

#left1 {
    float: left;
    width: 100%;
	height: auto;
	color: #f5f5f5;
    margin: 0;
	text-align: left;
	font-size: 20px;
	padding: 0px;
	border: none;
	background: rgb(0,50,100);

		}
		
#right1 {
    float: left;
    width: 100%;
	height: auto;
	color: black;
    margin: 0;
	text-align: left;
	font-size: 18px;
	padding: 0px;
	border: none;
	background: rgb(0,50,100);
}

.boxShadow3 {
   color: rgb(240,100,50);
  
}


		
		}
		
        @media screen and (min-width:800px) and (max-width:1200px) {
             
body {
    
    width: 100%;
    	
}

header {
    height: 130px;

}

center {

	font-size: 16px;
}

#center1 {
    min-height: 30px;
	width: auto;	
	margin: 0 auto;
	background: rgba(0,50,100, 0.1);	
	padding: 10px;
	font-size: 20px;
	text-align: left;
	color: rgb(50, 50, 50);
	font-family: Tahoma;
	
}

#left1 {
    float: left;
    width: 100%;
	height: auto;
	color: #f5f5f5;
    margin: 0;
	text-align: left;
	font-size: 28px;
	padding: 0px;
	border: none;
	background: rgbargb(0,50,100);

}

#right1 {
    float: left;
    width: 100%;
	height: auto;
	color: black;
    margin: 0;
	text-align: left;
	font-size: 24px;
	padding: 0px;
	border: none;
	background: rgb(0,50,100);
}

.boxShadow3 {
   color: rgb(240,100,50);
  
}




}