@font-face { font-family: 'Open Sans'; src: url('./../fonts/opensans/OpenSans-Regular.eot'); src: url('./../fonts/opensans/OpenSans-Regular.eot?#iefix') format('embedded-opentype'), url('./../fonts/opensans/OpenSans-Regular.woff') format('woff'), url('./../fonts/opensans/OpenSans-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; } * { box-sizing: border-box; } html { font-size: 10px; } body { margin: 0; font-family: Open Sans; /*подключение шрифта*/ font-size: 1.6rem; color: #333332; background: #e5e5e5; } img { max-width: 100%; } .container { width: 1170px; margin: 80px auto; background: #fff; -webkit-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.4); box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.4); } .nav { margin: 0; list-style: none; } .nav.horizontal { display: flex; } .content { max-width: 780px; margin: auto; } /*-----------------------------header------------------------------------------------*/ .header { display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; padding: 30px 0; } .logo h1 a { color: rgba(0, 0, 0, 0.8); text-decoration: none; font-size: 1.8rem; font-weight: 600; line-height: 24px; padding-bottom: 3px; } .logo h1 a:hover { color: #000; text-transform: color 0.2s; } .logo h2 { font-family: Helvetica, sans-serif; font-size: 1.2rem; font-weight: 300; line-height: 18px; padding-bottom: 3px; } .header .mainmenu ul a { text-transform: uppercase; padding: 7px 8px; font-size: 1.4rem; font-weight: 600; text-decoration: none; color: rgba(69, 69, 69, 0.8); } .header .mainmenu ul a:hover { color: #000; } .header .mainmenu ul .active a { color: #000; } /*-----------------------------slider------------------------------------------------*/ .slider { background: url(../img/slider.jpeg) no-repeat top -250px center / cover; /*-первый слой*/ background-color: rgba(0,0,0,0.5); /*-второй слой*/ background-blend-mode: multiply; /*- наложение слоев со свойством*/ height: 400px; width: 100%; display: flex; flex-flow: column; justify-content: center; align-items: center; } .slider h1 { font-size: 4rem; font-family: Domine, sans-serif; text-shadow: 0px 2px 25px rgba(0, 0, 0, 0.3); color: #fff; } .slider h2 { font-family: Helvetica, sans-serif; font-size: 2.4rem; text-shadow: 0px 2px 20px rgba(0, 0, 0, 0.15); color: rgba(255, 255, 255, 0.8); } .slider h2:hover { color: #fff; } /*-----------------------------main-cont------------------------------------------------*/ main p, img { padding: 15px 0; } .main-cont { padding: 60px 0; background: #fff; line-height: 38px; } main p:first-child { font-weight: bold; } main .caption { color: #ababab; font-family: Arial, sans-serif; font-size: 1.4rem; line-height: 26px; text-align: center; } /*-----------------------------footer------------------------------------------------*/ .fcontent { width: 1170px; margin: auto; } footer .copyright { background: rgba(0, 0, 0, 0.85); color: #a6a6a6; padding: 25px 0; text-align: center; } p span { color: rgb(194, 205, 205); } footer .social { padding: 30px 0; background: rgba(0, 0, 0, 0.9); display: flex; flex-flow: row nowrap; justify-content: center; } footer .social a { text-decoration: none; margin: 3px; width: 40px; height: 40px; text-align: center; line-height: 2.4; border-radius: 3px; color: #fff; } footer .social a.tw { background: #00b0ef; } footer .social a.bh { background: #0066ff; } footer .social a.dr { background: #0083d1; } footer .social a.fb { background: #265999; } footer .social a.rs { background: #ff7600; } footer .social a:hover { background: rgba(0, 0, 0, 1); }