#2694. Установить верстку шапки по калькуляторам

frontend/web/css/style_30.11.2018.css

@@ -1914,3 +1914,181 @@
 	}
 
 }
+
+
+.keys_automation_top {
+	width: 100%;
+	min-height: 535px;
+	background: #f1f1f1 url(../images_automation/keys_automation_top.jpg) no-repeat bottom center;
+	background-size: cover;
+	-moz-background-size: cover;
+	-webkit-background-size: cover;
+	-o-background-size: cover;
+	padding-top: 53px;
+	position: relative;
+}
+
+.automation_title_wrap {
+	color: #2d323a;
+}
+.automation_title_wrap h1{
+	font-size: 36px;
+	line-height: 50px;
+	font-family: "RobotoBold";
+	color: #2d323a;
+	margin-bottom: 25px;
+}
+.automation_title_wrap span{
+	font-size: 20px;
+	line-height: 24px;
+	margin-bottom: 35px;
+}
+
+
+.automation_mock_wrap{
+	position: relative;
+	z-index: 3;
+	margin-top: 30px;
+}
+.automation_mock_wrap > div{
+	float: left;
+	width: 33%;
+	position: relative;
+}
+.automation_mock1{
+	width: 428px;
+	height: 295px;
+	position: relative;
+	top: 0px;
+	left: 0;
+	z-index: 3;
+}
+.automation_mock2{
+	width: 428px;
+	height: 276px;
+	position: relative;
+	top: 55px;
+	left: -50px;
+	z-index: 2;
+}
+.automation_mock3{
+	width: 542px;
+	height: 340px;
+	position: relative;
+	top: 80px;
+	left: -160px;
+	z-index: 4;
+}
+
+.automation_p1{
+	background: url(../images_automation/automation_p1.png) no-repeat center center;
+	width: 204px;
+	height: 203px;
+	position: absolute;
+	top: 80px;
+	left: 130px;
+}
+.automation_p2{
+	background: url(../images_automation/automation_p2.png) no-repeat center center;
+	width: 252px;
+	height: 106px;
+	position: absolute;
+	top: 340px;
+	left: 80px;
+	z-index: 4;
+}
+.automation_p3{
+	background: url(../images_automation/automation_p3.png) no-repeat center center;
+	width: 117px;
+	height: 108px;
+	position: absolute;
+	top: 60px;
+	right: 80px;
+	z-index: 4;
+}
+.automation_p4{
+	background: url(../images_automation/automation_p4.png) no-repeat center center;
+	width: 282px;
+	height: 222px;
+	position: absolute;
+	top: 367px;
+	right: 180px;
+	z-index: 4;
+}
+
+
+
+.dek_list{
+	margin-top: 23px;
+}
+.dek_list li{
+	padding-left: 27px;
+	font-size: 21px;
+	line-height: 24px;
+	position: relative;
+}
+.dek_list li::before{
+	content: '';
+	position: absolute;
+	top: 8px;
+	left: 0;
+	width: 15px;
+	height: 10px;
+	background: url(../images/appl_list.png) no-repeat center;
+}
+.dek_list li:not(:last-child){
+	margin-bottom: 14px;
+}
+
+
+
+@media only screen and (max-width: 1600px) and (min-width: 1301px){
+	.automation_p1{
+		top: 50px;
+		left: -10px;
+	}
+	.automation_p2{
+		top: 350px;
+		left: -120px;
+	}
+	.automation_p3{
+		top: 70px;
+		right: 30px;
+	}
+	.automation_p4{
+		top: 280px;
+		right: -90px;
+	}
+}
+@media only screen and (max-width: 1301px){
+	.automation_p{
+		display: none;
+	}
+}
+@media only screen and (max-width: 991px){
+
+
+	.automation_mock_wrap{
+		margin-left: 0;
+	}
+
+	.automation_mock_wrap > div{
+		width: 33.33%;
+	}
+	.automation_mock {
+		position: static;
+		width: 100%;
+		height: auto;
+	}
+	.automation_mock img {
+		width: 100%;
+		height: auto;
+	}
+}
+@media only screen and (max-width: 767px){
+
+	.automation_mock_wrap > div{
+		width: 100%;
+		float: none;
+	}
+}