You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
triumf-landing/assets/css/index.css

157 lines
2.4 KiB

html {
font-size: 16px;
font-family: "Montserrat", sans-serif;
font-weight: 400;
font-style: normal;
scroll-behavior: smooth;
}
body {
position: relative;
margin: 0;
overflow-y: scroll;
color: #2d2d2d;
background-color: #ededed;
}
a,
button,
input,
textarea {
font-family: "Montserrat", sans-serif;
text-decoration: none;
}
a {
transition: all ease-in-out 0.1s;
}
a:hover {
color: #609eff;
}
a:active {
color: #3081ff;
}
figure {
margin: 0;
}
img {
max-width: 100%;
height: auto;
}
.container {
max-width: 1236px;
width: 100%;
margin: 0 auto;
padding: 0 15px;
box-sizing: border-box;
}
.logo__link {
display: flex;
align-items: center;
gap: 22px;
}
.logo__figure {
display: flex;
align-items: center;
justify-content: center;
}
.logo__figure-image {
display: block;
max-width: 100%;
width: 35px;
height: auto;
}
.logo__text {
display: flex;
flex-direction: column;
gap: 5px;
}
.logo__text-name {
font-weight: 600;
font-size: 26px;
letter-spacing: 0.04em;
text-transform: uppercase;
color: #2d2d2d;
}
.logo__text-slogan {
font-weight: 400;
font-size: 9px;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #878787;
}
.social-link {
display: inline-block;
height: 29px;
width: 29px;
border-radius: 32px;
background-position: center;
background-repeat: no-repeat;
}
.social-link--whatsapp {
background-image: url(../img/icons/whatsapp.svg);
background-color: #2aa81a;
}
.social-link--whatsapp:active {
background-color: #42d030;
}
.social-link--tg {
background-image: url(../img/icons/telegram.svg);
background-color: #178ec9;
}
.social-link--tg:active {
background-color: #45b3ea;
}
.social-link--phone {
width: auto;
height: auto;
margin-left: 17px;
font-weight: 600;
font-size: 24px;
color: #2d2d2d;
}
.button {
border-radius: 100px;
background-color: #ffffff;
transition: all ease-in-out 0.1s;
cursor: pointer;
}
.button--order {
display: inline-block;
padding: 14px 29px;
font-weight: 500;
font-size: 14px;
letter-spacing: 0.01em;
border: 1px solid #cacaca;
}
.header {
padding: 26px 0 29px;
}
.header .container {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
}
.header__nav {
display: flex;
align-items: center;
gap: 36px;
padding: 0 30px 0 35px;
}
.header__nav-link {
font-weight: 400;
font-size: 15px;
}
.header__social {
display: flex;
align-items: center;
gap: 17px;
}