*{
	margin:0;
	padding:0;
	border:0;
	}

#content{
max-width: 1440px;
height: 620px;
background-color:  #87509c;
margin: auto;
}

.header {
    max-width: 1440px;
    height:100px;
    padding-top: 10px;
}

.logo {
	background:url("../img/logo.png") no-repeat;
	width: 117px;
	height: 37px;
	top: 57px;
	left: 212px;
    margin-top: 30px;
    margin-left: 200px;
}

.menu {
	float:right;
height: 13px;
top: 70px;
}

.menu ul {
	list-style-type:none;
	border-radius: 4px;
    display: inline;
    width: 77px;
height: 32px;
    top: 60px;
left: 812px;
}

.menu ul li {
	font-family: TitilliumWeb, sans-serif;
font-size: 20px;/* Приближение из-за подстановки шрифтов */
font-weight: 400;
line-height: 18px;/* Приближение из-за подстановки шрифтов */
text-align: left;
display: inline; /* Отображать как строчный элемент */
 margin-right: 15px; /* Отступ слева */
    padding: 3px; /* Поля вокруг текста */
}
.menu ul li a{
    color:  #ffffff;
    text-decoration:none;
    border-radius: 4px;
    width: 77px;
height: 32px;
}
.menu a:hover {
    color: #ffdd99;;
}
h1 {
	font-family: TitilliumWeb, sans-serif;
color:  #f7f3eb;
font-size: 30px;/* Приближение из-за подстановки шрифтов */
font-weight: 700;
line-height: 39.907px;/* Приближение из-за подстановки шрифтов */
text-align: center;
max-width: 906px;
height: 110px;
top: 239px;
    margin: auto;
    margin-top: 90px;
    text-transform: uppercase;
        
}

.button {
	width: 293px;
height: 70px;
top: 381px;
left: 574px;
border-radius: 4px;
background-color:  #eb7d4b;
margin: auto;
margin-top: 150px;
}
.button .knopka {
     height: 40px;
    margin-left: 0;
    padding-left: 70px;
    text-transform: uppercase;
    font-family: TitilliumWeb;
color:  #ffffff;
text-decoration: none;
font-size: 18px;/* Приближение из-за подстановки шрифтов */
font-weight: 600;
line-height: 69.5px;/* Приближение из-за подстановки шрифтов */
text-align: left;
}
.button:hover { background: #17c2a4; } /* при нажатие изменяет цвет */

#conteiner {
height: 647px;
    max-width: 1440px;
background-color:  #17c2a4;
margin: auto;
    margin-top: 75px;
}
h2{
    font-family: TitilliumWeb, sans-serif;
color:  #ffffff;
font-size: 40px;/* Приближение из-за подстановки шрифтов */
font-weight: 700;
line-height: 39.907px;/* Приближение из-за подстановки шрифтов */
text-align: center;
    font-size: 40px;
     padding-top: 60px;
text-transform: uppercase;
}
.line {
    background-color:  rgba(0, 0, 0, 0.15);
width: 87px;
height: 4px;
    margin: auto;
    margin-top: 20px;
}
.text2 p {
    font-family: TitilliumWeb, sans-serif;
color:  #ffffff;
font-size: 18px;/* Приближение из-за подстановки шрифтов */
font-weight: 400;
line-height: 26px;/* Приближение из-за подстановки шрифтов */
text-align: center;
max-width: 603px;
height: 45px;
    top: 792px;
    margin: auto;
    margin-top: 20px;
}

.box {
    max-width: 230px;
max-height: 295px;
    top: 920px;
left: 204px;
    float: left;
    margin-left: 205px; 
    margin-top: 40px;
    margin-right: 5px;
}
.box2 {
    max-width: 230px;
max-height: 295px;
    top: 920px;
left: 204px;
    float: left;
    margin-top: 40px;
    margin-right: 5px;
}
.box3 {
    max-width: 230px;
max-height: 295px;
    top: 920px;
left: 204px;
     float: left;
    margin-top: 40px;
    margin-right: 5px;
}
.box4 {
    max-width: 230px;
max-height: 295px;
    top: 920px;
left: 204px;
    float: left;
    margin-top: 40px;
    margin-right: 5px;
}
.img {
    background: url("../img/Flag.png") no-repeat;
    background-position: center;
    width: 160px;
height: 134px;
    top: 920px;
left: 246px;
    margin: auto;
}
.img2 {
    background: url("../img/Crayon.png") no-repeat;
    background-position: center;
    width: 160px;
height: 134px;
    top: 920px;
left: 246px;
    margin: auto;
}
.img3 {
    background: url("../img/Gears.png") no-repeat;
    width: 160px;
height: 134px;
    top: 920px;
left: 246px;
    margin: auto;
}
.img4 {
    background: url("../img/Rocket.png") no-repeat;
    background-position: center;
    width: 160px;
height: 134px;
    top: 920px;
left: 246px;
    margin: auto;
}
h3 {
    text-align: center;
    margin-top: 50px;
    text-transform: uppercase;
}

#container2 {
    max-width: 1440px;
height: 765px;
    top: 1343px;
left: 0px;
    background-color:  #e7f1f8;
}

#container2 h4{
    font-family: TitilliumWeb;
color: #3c4661;
font-size: 40px; /* Приближение из-за подстановки шрифтов */
font-weight: 700;
line-height: 29.907px; /* Приближение из-за подстановки шрифтов */
text-align: center;
transform: scaleY(1.0321); /* свойства ширины и высоты были исключены, поскольку было выполнено трансформирование */
    padding-top: 60px;
height: 30px;
    top: 1462px;
left: 430px;
}
.comanda {
    width: 230px;
height: 490px;
    top: 920px;
left: 204px;
    float: left;
    margin-left: 205px; 
    margin-top: 40px;
    margin-right: 5px;
}
.comanda2 {
    width: 230px;
height: 490px;
    top: 920px;
left: 204px;
    float: left;
    margin-top: 40px;
    margin-right: 5px;
}
.comanda3 {
    width: 230px;
height: 490px;
    top: 920px;
left: 204px;
     float: left;
    margin-top: 40px;
    margin-right: 5px;
}
.comanda4 {
    width: 230px;
height: 490px;
    top: 920px;
left: 204px;
    float: left;
    margin-top: 40px;
    margin-right: 5px;
}
.lica {
    background: url("../img/lica.png") no-repeat;
    background-position: center;
    width: 200px;
height: 200px;
    top: 920px;
left: 246px;
    margin: auto;
}
.lica2 {
    background: url("../img/lica.png") no-repeat;
    background-position: center;
    width: 200px;
height: 200px;
    top: 920px;
left: 246px;
    margin: auto;
}
.lica3 {
    background: url("../img/lica.png") no-repeat;
    width: 200px;
height: 200px;
    top: 920px;
left: 246px;
    margin: auto;
}
.lica4 {
    background: url("../img/lica.png") no-repeat;
    background-position: center;
    width: 200px;
height: 200px;
    top: 920px;
left: 246px;
    margin: auto;
}

.contakt {
    width: 163px;
height: 32px;
    top: 2098px;
left: 219px;
    margin: auto;
    margin-top: 20px;
    background: url("../img/Contacts%20(1).png") no-repeat;
}
.contakt2 {
    width: 163px;
height: 32px;
    top: 2098px;
left: 219px;
    margin: auto;
    margin-top: 20px;
    background: url("../img/Contacts%20(1).png") no-repeat;
}

.contakt3 {
    width: 163px;
height: 32px;
    top: 2098px;
left: 219px;
    margin: auto;
    margin-top: 20px;
    background: url("../img/Contacts%20(1).png") no-repeat;
}

.contakt4 {
    width: 163px;
height: 32px;
    top: 2098px;
left: 219px;
    margin: auto;
    margin-top: 20px;
    background: url("../img/Contacts%20(1).png") no-repeat;
}

#container3 {
    max-width: 1440px;
height: 950px;
    top: 1343px;
left: 0px;
    background-color:  #ffdd99;
}

h5 {
    font-family: TitilliumWeb;
color:  #393939;
    font-size: 40px;/* Приближение из-за подстановки шрифтов */
font-weight: 700;
line-height: 29.907px;/* Приближение из-за подстановки шрифтов */
text-align: center;
    padding-top: 30px;
}
.container3-text {
font-family: TitilliumWeb;
color: #393939;
font-size: 18px; /* Приближение из-за подстановки шрифтов */
font-weight: 400;
line-height: 26px; /* Приближение из-за подстановки шрифтов */
text-align: center;
margin: auto;
width: 515px;
height: 45px;
margin-top: 20px;
margin-bottom: 40px;
}
.knopk{
    width: 84px;
    color:  #393939;
    font-weight: 700;
  text-decoration: none;
  user-select: none;
  padding: 0.65em 1.7em;
  outline: none;
  border: 1px solid rgb(250,172,17);
  border-radius: 7px;
}
.knopk:hover { background-color:  #ffffff; } /* при нажатие изменяет цвет */
.vse-knopki {
	width: 378px;
height: 38px;
margin: auto;
}
.works {
    max-width: 1000px;
height: 560px;
    top: 3296px;
left: 170px;
    margin:30px auto auto;
}
.work{
    width: 380px;
height: 250px;
    top: 3296px;
left: 170px;
    float: left;
    background: url("../img/1.png") no-repeat;
    margin-left:40px;
}
.work2 {
    width: 380px;
height: 250px;
    top: 3299px;
left: 731px;
    float: right;
    background: url("../img/2.png") no-repeat;
    margin-right:40px;
}
.work3 {
 width: 380px;
height: 280px;
    top: 3717px;
left: 172px;
    float: left;
    background: url("../img/3.png") no-repeat;
    margin-left:40px;
}
.work4 {
    width: 380px;
height: 311px;
    top: 3718px;
left: 732px;
    background: url("../img/4.png") no-repeat;
    float: right;
    margin-right:40px;
}
.button2 {
   border-radius: 4px;
background-color:  #17c2a4;
width: 293px;
height: 70px;
    top: 4156px;
left: 574px;
    margin: 20px auto auto;
}
.knopka2{
    width: 215px;
 height: 40px;
    margin: auto;
    top: 4184px;
left: 632px;
    font-family: TitilliumWeb;
color:  #ffffff;
font-size: 18px;/* Приближение из-за подстановки шрифтов */
font-weight: 600;
line-height: 67.5px;/* Приближение из-за подстановки шрифтов */
text-align: left;
    margin-left: 42px;
    text-transform: uppercase;
    text-decoration: none;
}
.button2:hover { background: #d74680; } /* при нажатие изменяет цвет */

/* container4 */
#conteiner4 {
    background-color:  #d74680;
 max-width: 1440px;
height: 630px;
    padding-top: 60px;
}
#conteiner4 h6 {
    width: 700px;
height: 29px;
    top: 4454px;
left: 417px;
    font-family: TitilliumWeb;
color:  #ffffff;
font-size: 40px;/* Приближение из-за подстановки шрифтов */
font-weight: 700;
line-height: 29.907px;/* Приближение из-за подстановки шрифтов */
text-align: center;
    margin: auto;
    margin-top: 20px;
}
.klient {
    width: 470px;
height: 166px;
    top: 4617px;
left: 171px;
    float: left;
    margin-left: 190px;
    margin-top: 10px;
}
.foto {
    background: url("../img/Mugshot.png") no-repeat;
    width: 96px;
height: 96px;
    top: 4617px;
left: 171px;
}

.klient2 {
    width: 470px;
height: 166px;
    top: 4617px;
left: 171px;
    float: right;
    margin-right: 190px;
    margin-top: 10px;
}
.foto2 {
    background: url("../img/Mugshot2.png") no-repeat;
    width: 96px;
height: 96px;
    top: 4617px;
left: 171px;
}

.klient3 {
    width: 470px;
height: 166px;
    top: 4617px;
left: 171px;
    float: left;
    margin-left: 190px;
    margin-top: 40px;
}
.foto3 {
    background: url("../img/Mugshot3.png") no-repeat;
    width: 96px;
height: 96px;
    top: 4617px;
left: 171px;
}

.klient4 {
    width: 470px;
height: 166px;
    top: 4617px;
left: 171px;
    float: right;
    margin-right: 190px;
    margin-top: 40px;
}
.foto4 {
    background: url("../img/Mugshot4.png") no-repeat;
    width: 96px;
height: 96px;
    top: 4617px;
left: 171px;
}
.foto-text, .foto-text2, .foto-text3, .foto-text4 {
margin-left: 110px;
width: 326px;
height: 85px;
font-family: TitilliumWeb;
color: #ffffff;
font-size: 21px; /* Приближение из-за подстановки шрифтов */
font-style: italic;
line-height: 26px; /* Приближение из-за подстановки шрифтов */
text-align: left;
}

#container5 {
    background-color: #3c5499;
max-width: 1440px;
height: 740px;
    margin: auto;
    text-align: center;
    padding-top: 50px;
}
h7 {
   width: 286px;
height: 29px;
    font-family: TitilliumWeb;
color:  #ffffff;
font-size: 40px;/* Приближение из-за подстановки шрифтов */
font-weight: 700;
line-height: 29.907px;/* Приближение из-за подстановки шрифтов */
text-align: center;
}
#container5 p{
    width: 815px;
height: 19px;
    font-family: TitilliumWeb;
color:  #ffffff;
font-size: 20px;/* Приближение из-за подстановки шрифтов */
font-weight: 400;
line-height: 26px;/* Приближение из-за подстановки шрифтов */
text-align: center;
    margin: auto;
    margin-top: 20px;
}
#form{
    margin-top: 50px;
}
#fio {
    border-radius: 4px;
background-color: #273a71;
width: 414px;
height: 56px;
    margin-bottom: 40px;
    margin-right: 20px;
}
#email {
    border-radius: 4px;
background-color: #273a71;
width: 414px;
height: 56px;
}
#comment-field {
    border-radius: 4px;
background-color: #273a71;
width: 860px;
height: 200px;
}

#form .button3 {
    border-radius: 4px;
background-color: #30bae7;
width: 293px;
height: 70px;
    margin-top: 40px;
}
#form .button3:hover { background: #ffdd99; } /* при нажатие изменяет цвет */

#footer {
    background-color:  #344b8e;
max-width: 1440px;
height: 112px;
    margin: auto;
    margin-top: 112px;
    padding-top: 50px;
}
.soc{
    width: 938px;
height: 23px;
    font-family: TitilliumWeb;
color: #ffffff;
font-size: 24px; /* Приближение из-за подстановки шрифтов */
font-weight: 600;
line-height: 29.907px; /* Приближение из-за подстановки шрифтов */
text-align: center;
font-family: TitilliumWeb;
color: #30bae7;
text-decoration:none;
}
#footer a{
    margin-right: 40px;
}
#footer a:hover{
    color:white;
}