@import "layout/base.css"; @import "layout/fonts.css"; @import "layout/normolize.css"; @import "components/footer.css"; @import "components/header.css"; /* главная */ .hero_con { padding-top: 100px; } .ava_logo { float: right; width: 350px; height: 350px; background : #000; border-radius: 30px; } .rotateblock_orenge { float: right; width: 350px; height: 350px; background : #f89513; border-radius: 30px; } .content_form { float: left; width: 50%; text-align: center; margin-left: 65px; margin-top: 35px; } .ava { width: 100%; } .h_content { font-family: 'OpenSans'; font-weight: bold; text-transform: uppercase; font-size: 49px; margin-top: 25px; margin-bottom: 45px; } .text_content { font-family: 'OpenSans'; font-size: 26px; margin-top: 25px; margin-bottom: 45px; } .welcome__btn { padding: 15px 20px; display: block; text-align: center; margin-top: 40px; border-radius: 5px; font-size: 12px; color: #f1f1f1; text-transform: uppercase; text-decoration: none; font-weight: bold; transition: .3s; -webkit-transition: .3s; background: #131415; border: 0; cursor: pointer; margin: 0 auto; } .welcome__btn:hover { background: #f89513; } /* анимации */ .animate_text { animation: bounceInDown 1.1s; } @keyframes bounceInDown { from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; transform: translate3d(0, 25px, 0); } 75% { transform: translate3d(0, -10px, 0); } 90% { transform: translate3d(0, 5px, 0); } to { transform: translate3d(0, 0, 0); } } .bounceInDown { animation-name: bounceInDown; } .input { text-decoration: none; } .content_form-text { animation: bounceInRight .7s; } @keyframes bounceInRight { from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; transform: translate3d(-25px, 0, 0); } 75% { transform: translate3d(10px, 0, 0); } 90% { transform: translate3d(-5px, 0, 0); } to { transform: translate3d(0, 0, 0); } } .bounceInRight { animation-name: bounceInRight; } .input-button { animation: bounceInLeft .7s; } @keyframes bounceInLeft { from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; transform: translate3d(25px, 0, 0); } 75% { transform: translate3d(-10px, 0, 0); } 90% { transform: translate3d(5px, 0, 0); } to { transform: translate3d(0, 0, 0); } } .bounceInLeft { animation-name: bounceInLeft; } .rotateblock { animation: rotate 10s linear; animation-iteration-count: infinite; } .rotateblock_orenge { animation: rotateor 10s linear; animation-iteration-count: infinite; } @keyframes rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(-360deg); } } @keyframes rotateor { 0% { transform: rotate(0deg); } 100% { transform: rotate(-360deg); } } .ava_logo { animation: rotatenone 10s linear; animation-iteration-count: infinite; } @keyframes rotatenone { 0% { transform: rotate(0deg); } 100% { transform: rotate(720deg); } } /* * Отзывы */ .form { width: 700px; background: #f5f5f5; border-radius: 3px; padding: 45px 70px; margin: 0 auto; margin-top: 35px; margin-bottom: 35px; } .form__title { color: #221f1f; font-size: 35px; font-weight: bold; margin-bottom: 25px; } .form__cell { display: block; float: left; width: 270px; } .form__log { display: block; width: 560px; } /* только в списках к первому элементу добавить справа 20р */ .form__cell:first-child { margin-right: 20px; } .form__field-title { color: #221f1f; font-size: 14px; margin-bottom: 10px; } .form__input-text { width: 100%; height: 45px; padding: 13px 10px; font-size: 14px; /*размерр текста*/ font-weight: 300px; /*шрифт*/ border: 1px solid transparent; border-radius: 3px; margin-bottom: 20px; } .form__input-text::-webkit-input-placeholder { color:#908f8f; /*цвет текста в input*/ } .form__input-text::-moz-placeholder { color:#908f8f; } .form__input-text:focus, .form__texterea:focus, .form__submit:focus { /*цвет окантовки*/ border-color: #f89513; outline: none; } .form__texterea { height: 90px; width: 100%; border: none; border-radius: 3px; padding: 13px 10px; resize: none; font-size: 14px; border: 1px solid transparent; border-radius: 3px; font-weight: 300px; /*шрифт*/ margin-bottom: 20px; } .form__container-left { display: inline-block; width: 50%; } .form__radio-elem{ display: inline-block; vertical-align: middle; display: none; } .form__radio-elem:checked+.form__radio-fake { border: 1px solid #f89513; } .form__radio-elem:checked + .form__radio-fake:after { display: block; } .form__radio-elem:checked+.form__radio-fake+.form__radio-text { /*color: blue;*/ font-weight: bold; } .form__radio-fake { width: 20px; height: 20px; display: inline-block; border-radius: 50%; border: 1px solid #cbcbcb; position: relative; background: -webkit-linear-gradient(top, #fdfdfd 0%, #efefef 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #fdfdfd 0%, #efefef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ } .form__radio-fake:after { content: ""; display: none; width: 8px; height: 8px; background: #f89513; border-radius: 50%; position: absolute; top: 5px; left: 5px; } .form__radio-text { display: inline-block; vertical-align: middle; padding-bottom: 12px; } .form__controls-left{ float: left; } .form__controls-right{ float: right; } .form__submit { margin-top: 22px; background: #1c1f1d; border-radius: 3px; width: 125px; height: 45px; color: #ffffff; text-align: center; font-size: 12px; text-transform: uppercase; text-decoration: none; font-weight: bold; border: 0; cursor: pointer; /* border: none; */ } .form__submit:hover { background: #f89513; }