/* Eric Meyer's CSS Reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	
	
	vertical-align: baseline;
}
A { color: white; /* Цвет ссылок */ }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* End of Eric Meyer's CSS Reset */
td{
	padding: 3px;
}
html {
	height: 100%;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
	display: block;
}
body {
	font-size: 16px;
	
	color: #ffffff!important;
	text-shadow: 1px 0 1px #000, 
0 1px 1px #000, 
-1px 0 1px #000, 
0 -1px 1px #000;
    font-family: "Verdana", sans-serif;
	width: 100%;
	height: 1130px;
	/*background: #000000;*/
	background-image: url(img/pexels001.jpeg);
	background-repeat: no-repeat;
	background-attachment: fixed;
}

h1{
	font-size: 25px;
  font-family: "Verdana", sans-serif, bold;
	
}
h2{
	font-size: 19px;
  font-family: "Verdana", sans-serif, bold;
	
}
h3{
	font-size: 17px;
  font-family: "Verdana", sans-serif, bold;
	
}
.image {
 overflow:hidden;
 width: 720px;
 height:151px;
 }
 .image img {
 -moz-transition: all 2s ease-out;
 -o-transition: all 2s ease-out;
 -webkit-transition: all 1s ease-out;
 }
 
.image img:hover{
 -webkit-transform: scale(1.1);
 -moz-transform: scale(1.1);
 -o-transform: scale(1.1);
 }
 
 
 
.wrapper {
	width: 1000px;
	margin: 3px auto;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	/*background: #000000;*/
	border-bottom: 3px solid #ffffff;
  border-top: 3px solid #ffffff;
  border-left: 3px solid #ffffff;
  border-right: 3px solid #ffffff;
  border-radius: 10px;
        padding: 0px;
}


/* Header
-----------------------------------------------------------------------------*/
.header {
	height:  458px;
	margin: 2px;
	position: relative;
	background-image: url(img/heder.jpg);
	border-bottom: 2px solid #ffffff;
  border-top: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  border-radius: 10px;
        padding: 2px;
}


/* Middle
-----------------------------------------------------------------------------*/
.middle {
	width: 100%;
	
	position: relative;
	
}
.middle:after {
	display: table;
	clear: both;
	content: '';
}
.container {
	width: 1000px;
	height: 100%;
	float: right;
	overflow: hidden;
	
}
.content {
	padding: 5px;
	/*border-bottom: 1px solid #ffffff;
  border-top: 1px solid #ffffff;
  border-left: 1px solid #ffffff;
  border-right: 1px solid #ffffff;
  border-radius: 10px;*/
     height: 100%;   
}


/* Left Sidebar
-----------------------------------------------------------------------------*/
.left-sidebar {
	float: left;
	width: 250px;
	
	position: relative;
	
	
}

/* Footer
-----------------------------------------------------------------------------*/
.footer {
	width: 1000px;
	margin: 3px auto;
	height: 90px;
	/*background: #000000;*/
	position: relative;
	border-bottom: 3px solid #ffffff;
  border-top: 3px solid #ffffff;
  border-left: 3px solid #ffffff;
  border-right: 3px solid #ffffff;
  border-radius: 10px;
        padding: 0px;
}
.bottom {
	height:  10px;
	margin: 2px;
	position: relative;
	
	background-image: url(img/bottom.jpg);
}
.menu {
  position: absolute;
  top: 102px;
  left: 50%;
  width: 250px;

  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  text-align: center;
  /*background: #000000;*/
	border-bottom: 2px solid #ffffff;
  border-top: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  border-radius: 10px;
        padding: 2px;
}


.menu__link {
  display: inline-block;
  color: #2d6c90;
  text-decoration: none;
  position: relative;
  padding: 14px 0;
  font-family: 'Muli', sans-serif;
  font-weight: 300;
  font-size: 22px;
  line-height: 1;
  letter-spacing: 0.040em;
}

.menu__link svg {
  fill: none;
  stroke: #70aec9;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke-dasharray: 338;
  stroke-dashoffset: 338;
  stroke-linecap: round;
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% + 60px);
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-transition: stroke-dashoffset 0s 0.2s, opacity 0.2s;
  transition: stroke-dashoffset 0s 0.2s, opacity 0.2s;
  z-index: -1;
}

.menu__link--active svg {
  stroke: #ff4c4c;
}

.menu__link--active svg,
.menu__link:hover svg {
  stroke-dashoffset: 0;
  opacity: 1;
  -webkit-transition: opacity 0s, stroke-dashoffset 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: opacity 0s, stroke-dashoffset 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}