html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object, a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span, strong, sub, sup, tt, var, legend, fieldset { margin: 0; padding: 0; } 

:focus::-webkit-input-placeholder { opacity:0; } 
:focus::-moz-placeholder { opacity:0; } 
:focus:-moz-placeholder { opacity:0; } 
:focus:-ms-input-placeholder { opacity:0; } 
::-webkit-input-placeholder { color:#A4A2A0; opacity:1; } 
::-moz-placeholder { color:#A4A2A0; opacity:1; } 
:-moz-placeholder { color:#A4A2A0; opacity:1; } 
:-ms-input-placeholder { color:#A4A2A0; opacity:1; } 

body { background: #fff; color: #46484B; font-family: Open Sans, Tahoma, Arial, Verdana; font-size: 100%; } 
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } 
main { width: 100%; margin: 0 auto; display: block; overflow: hidden;}

.header-contacts { padding: 10px 0; text-align: center; font-size: 90%;}
.header-contacts li {display: inline-block;  margin: 0 2%;}
.header-contacts a {filter: grayscale(100%); text-decoration: none; color: #FA65B1; transition: 0.3s; }
.header-contacts a:hover {filter: grayscale(0); transition: 0.3s; }
.header-contacts .mini-vk { background: url(images/mini-vk.png) no-repeat left; padding: 0 0 0 20px;}
.header-contacts .mini-wa { background: url(images/mini-wa.png) no-repeat left; padding: 0 0 0 20px;}
.header-contacts .mini-tg { background: url(images/mini-tg.png) no-repeat left; padding: 0 0 0 20px;}


nav { background: #fff; box-shadow: 0 3px 40px 0 rgb(0 0 0 / 10%); width: 100%; position: sticky; top: 0; border: 1px 0 solid #E6E6E6;}
.nav { max-width: 1000px; margin: 0 auto; padding: 15px 20px; display: flex; justify-content: space-between; align-items: center; position: relative;}
.nav .logo	 { background: url(images/logo.png) no-repeat; width: 215px; height: 32px;}
.menu { display: flex; list-style: none; font-size: 95%; font-weight: bold; }
.menu li a { text-transform: uppercase; letter-spacing: 1px; color: #514d60; text-decoration: none; padding: 10px 15px; display: block; transition: color 0.3s; }
.menu li a:hover { color: #FA65B1; }
.menu li a.search { opacity: 1; background: url(images/search.png) center center no-repeat; filter: grayscale(100%); height: 42px; width: 42px; padding: 0; display: block; transition: 0.3s; border-radius: 21px; }
.menu li a.search:hover { opacity: 1; filter: grayscale(0); transition: 0.3s; }
.menu li a.ask { color: #fafafa; background: linear-gradient(#B867ED, #8A4AE2); text-decoration: none; padding: 10px 15px; display: block; transition: 0.3s; border-radius: 21px; margin: 0 0 0 10px; }
.menu li a.ask:hover { background: linear-gradient(#FC8DD0, #FA65B1); color: #fff; transition: 0.3s; }
 .menu-toggle { display: none; cursor: pointer; width: 32px; height: 22px; position: relative; z-index: 101; }
 .menu-toggle span { display: block; position: absolute; height: 4px; width: 100%; background: #12344A; border-radius: 3px; opacity: 1; left: 0; transform: rotate(0deg); transition: .25s ease-in-out;}
 .menu-toggle span:nth-child(1) { top: 0; }
 .menu-toggle span:nth-child(2), .menu-toggle span:nth-child(3) { top: 10px; }
 .menu-toggle span:nth-child(4) { top: 20px; }
 .menu-toggle.active span:nth-child(1) { top: 10px; width: 0%; left: 50%; }
 .menu-toggle.active span:nth-child(2) { transform: rotate(45deg); }
 .menu-toggle.active span:nth-child(3) { transform: rotate(-45deg); }
 .menu-toggle.active span:nth-child(4) { top: 10px; width: 0%; left: 50%; }


main a { font-size: 100%; font-weight: bold; text-decoration: none; color: #00B0E6; -webkit-box-shadow: 0px -2px 0px 0px #00B0E6 inset; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s;}
main a:hover { cursor: pointer; color: #301B25; -webkit-box-shadow: 0px -2px 0px 0px #301B25 inset; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; }
main h1 { font-size: 180%; margin: 0; line-height: 1.25; }
main h2 { font-size: 160%; margin: 0 ; line-height: 1.25; }
main h3 { font-size: 140%; margin: 0 ; line-height: 1.25; }

main table { width: 100%; font-size: 100%; border-collapse: collapse; color: #333; background-color: #f8f8f8; overflow: hidden; margin: 2% 0 0 0; cursor: default; }
main th, main td { padding: 12px 15px; text-align: left; }
main th { background-color: #e0e0e0; font-weight: bold; color: #555; }
main table tr:nth-child(even) { background: #f0f0f0; }
main table td { border-bottom: 1px solid #ddd; }
main td img { float: left; border-radius: 5px; padding: 2px; margin: 0 5px 0 0; width: 20px; height: 20px; display: block;}


.white-up { background: url(images/white-down.png) center 100% no-repeat; width: 100%; height: 30px; margin: 0 auto; display: block; overflow: hidden;}
.grey-up { background: url(images/grey-up.png) center 100% no-repeat; width: 100%; height: 30px; margin: 0 auto; display: block; overflow: hidden;}


.header { width: 100%; background: #F7F9F8 url(images/header-bg.png); margin: 0 auto; display: block; overflow: hidden; cursor: default; padding: 2% 0 0 0;}
.header-width { width: 1000px; padding: 2% 0 1% 0; display: block; margin: 0 auto; overflow: hidden;}
.header-img { float: right; text-align: right; margin: 0 0 0 3%; padding: 2% 0; display: block; overflow: hidden; width: 25%; }
.header-img img { margin:  0 auto; display: block; width: 100%; height: 100%;}
.header-info  { float: left; margin: 0 0 0 0; display: block; overflow: hidden; width: 72%; padding: 2% 0 0 0;}
.header-info h1 { margin: 0; line-height: 1.25; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px;}
.header-info p { margin: 1% 0 0 0; font-size: 95%; line-height: 1.5; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px; }


.section-1 { background: #f7f7f7; width: 100%; margin: 0 auto; display: block; overflow: hidden; cursor: default;}
.section-1-width { width: 1000px; padding: 0 0 1% 0; display: block; margin: 0 auto; overflow: hidden;}
.section-1-img { float: left; text-align: right; margin: 0 3% 0 0; padding: 2% 0; display: block; overflow: hidden; width: 25%; }
.section-1-img img { margin:  0 auto; display: block; width: 100%; height: 100%;}
.section-1-info { float: right; margin: 0 0 0 0; display: block; overflow: hidden; width: 72%; padding: 2% 0 0 0;}
.section-1-info h2 { margin: 0; line-height: 1.25; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px;}
.section-1 ul { margin: 1% 0; padding: 0 0 0 5%; font-size: 95%;}
.section-1 ul li { margin: 0;}
.section-1 p { margin: 1% 0 0 0; font-size: 95%; line-height: 1.5; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px; }

.section-2 { background: #fff; width: 100%; margin: 0 auto; display: block; overflow: hidden; cursor: default;}
.section-2-width { width: 1000px; padding: 0 0 1% 0; display: block; margin: 0 auto; overflow: hidden;}
.section-2-img { float: right; text-align: right; margin: 0 0 0 3%; padding: 2% 0; display: block; overflow: hidden; width: 25%; }
.section-2-img img { margin:  0 auto; display: block; width: 100%; height: 100%;}
.section-2-info { float: left; margin: 0 0 0 0; display: block; overflow: hidden; width: 72%; padding: 2% 0 0 0;}
.section-2-info h2 { margin: 0; line-height: 1.25; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px;}
.section-2 ul { margin: 1% 0; padding: 0 0 0 5%; font-size: 95%;}
.section-2 ul li { margin: 0;}
.section-2 p { margin: 1% 0 0 0; font-size: 95%; line-height: 1.5; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px; }


.section-3 { background: #f7f7f7; width: 100%; margin: 0 auto; display: block; overflow: hidden; cursor: default;}
.section-3-width { width: 1000px; padding: 0 0 1% 0; display: block; margin: 0 auto; overflow: hidden;}
.section-3-img { float: left; text-align: right; margin: 0 3% 0 0; padding: 2% 0; display: block; overflow: hidden; width: 25%; }
.section-3-img img { margin:  0 auto; display: block; width: 100%; height: 100%;}
.section-3-info { float: right; margin: 0 0 0 0; display: block; overflow: hidden; width: 72%; padding: 2% 0 0 0;}
.section-3-info h2 { margin: 0; line-height: 1.25; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px;}
.section-3 ul { margin: 1% 0; padding: 0 0 0 5%; font-size: 95%;}
.section-3 ul li { margin: 0;}
.section-3 p { margin: 1% 0 0 0; font-size: 95%; line-height: 1.5; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px; }

.section-4 { background: #fff; width: 100%; margin: 0 auto; display: block; overflow: hidden; cursor: default;}
.section-4-width { width: 1000px; padding: 0 0 1% 0; display: block; margin: 0 auto; overflow: hidden;}
.section-4-img { float: right; text-align: right; margin: 0 0 0 3%; padding: 2% 0; display: block; overflow: hidden; width: 25%; }
.section-4-img img { margin:  0 auto; display: block; width: 100%; height: 100%;}
.section-4-info { float: left; margin: 0 0 0 0; display: block; overflow: hidden; width: 72%; padding: 2% 0 0 0;}
.section-4-info h2 { margin: 0; line-height: 1.25; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px;}
.section-4 ul { margin: 1% 0; padding: 0 0 0 5%; font-size: 95%;}
.section-4 ul li { margin: 0;}
.section-4 p { margin: 1% 0 0 0; font-size: 95%; line-height: 1.5; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px; }

.section-5 { background: #f7f7f7; width: 100%; margin: 0 auto; display: block; overflow: hidden; cursor: default;}
.section-5-width { width: 1000px; padding: 0 0 1% 0; display: block; margin: 0 auto; overflow: hidden;}
.section-5-img { float: left; text-align: right; margin: 0 3% 0 0; padding: 2% 0; display: block; overflow: hidden; width: 25%; }
.section-5-img img { margin:  0 auto; display: block; width: 100%; height: 100%;}
.section-5-info { float: right; margin: 0 0 0 0; display: block; overflow: hidden; width: 72%; padding: 2% 0 0 0;}
.section-5-info h2 { margin: 0; line-height: 1.25; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px;}
.section-5 ul { margin: 1% 0; padding: 0 0 0 5%; font-size: 95%;}
.section-5 ul li { margin: 0;}
.section-5 p { margin: 1% 0 0 0; font-size: 95%; line-height: 1.5; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px; }

.section-6 { background: #fff; width: 100%; margin: 0 auto; display: block; overflow: hidden; cursor: default;}
.section-6-width { width: 1000px; padding: 0 0 1% 0; display: block; margin: 0 auto; overflow: hidden;}
.section-6-img { float: right; text-align: right; margin: 0 0 0 3%; padding: 2% 0; display: block; overflow: hidden; width: 25%; }
.section-6-img img { margin:  0 auto; display: block; width: 100%; height: 100%;}
.section-6-info { float: left; margin: 0 0 0 0; display: block; overflow: hidden; width: 72%; padding: 2% 0 0 0;}
.section-6-info h2 { margin: 0; line-height: 1.25; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px;}
.section-6 ul { margin: 1% 0; padding: 0 0 0 5%; font-size: 95%;}
.section-6 ul li { margin: 0;}
.section-6 p { margin: 1% 0 0 0; font-size: 95%; line-height: 1.5; color: #46484B; text-shadow: rgba(0,0,0,0.1) 0 1px; }




footer { width: 1000px; margin: 0 auto; padding: 0; color: #1D2746; }
footer p { text-align: left; margin: 0 0 1% 0; line-height: 1.5; font-size: 95%;}
footer p.copyrights { font-size: 70%; color: #999; }


 
 
 
 @media (max-width: 1000px)
 { 
main, footer { max-width: 100%; }
.nav { max-width: 100%; }
.header-width { max-width: 96%; padding: 0 2% 1% 2%;}
.section-1-width { max-width: 100%; }
.section-2-width { max-width: 96%; padding: 0 2%;}
.section-3-width { max-width: 96%; padding: 0 2%;}
.section-4-width { max-width: 96%; padding: 0 2%;}

}
 @media (max-width: 768px)
 { 
.nav { padding: 20px;  }
.menu { position: absolute; top: 100%; left: 0; width: 100%; background: #f8f8f8; flex-direction: column; max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; }
.menu.active { max-height: 500px; }
.menu li { text-align: center; border-top: 1px solid #eee; background: #fff; }
 .menu li a { color: #301B25; text-decoration: none; padding: 15px; display: block; font-weight: bold; transition: color 0.3s; }
.menu li a.ask { border-radius: 0; padding: 15px 0; margin: 0; }
.menu li a.search {width: 100%; padding: 5px 0; display: block; }
.menu-toggle { display: block; }

.header-img { float: none; width: 52%; margin: 4% 0 0 0; padding: 0 24%; }
.header-info { float: none; width: 96%; margin: 0; padding: 2%;}
.section-1-img { float: none; width: 52%; margin: 0 0; padding: 0 24% 2% 24%; }
.section-1-info { float: none; width: 92%; margin: 0 4% 0 4%;}

.section-2-h3 { padding: 4%; margin: 2%; width: 94%; border-radius: 15px; display: block;}
.section-2-img {padding: 3% 0 2% 0;}
.section-2-img img { width: 62%;}

.section-3-img { float: none; width: 52%; margin: 0 0; padding: 0 24% 2% 24%; }
.section-3-info { float: none; width: 92%; margin: 0 3%;}

.section-4-img { float: none; width: 52%; margin: 0 0; padding: 0 24% 2% 24%; }
.section-4-info { float: none; width: 92%; margin: 0 3%;}


}