html, body {height: 100%;}
body {display: flex; flex-direction: column; /* font-family: 'Lato'; */}

/* typography */

h1, h2, h3, h4, h5 {text-transform: uppercase;}

/* links, btns */
a {color: #000; transition: all .25s ease-out;}
a:hover {color: #24a659;}

.btn {border-radius: 3rem; padding: 0.375rem 3rem; transition: all .25s ease-out;}
.btn-sm {padding: .25rem .5rem;}

.btn-green {background-color: #24a659; color: #fff;}

/* forms */
.form-control {border-radius: 2rem; background-color: #fff !important;}
.form-control::placeholder {color: #000; font-size: .875rem}

/* main */

header {padding: 1rem 0; background-color: #fff;}
header .moskvin-flex {justify-content: end;}
header .moskvin-social {margin-left: 2rem;}

.moskvin-flex {display: flex; align-items: center;}

.moskvin-menu {display: flex;}
.moskvin-menu-link {color: #000; text-decoration: none; text-transform: uppercase; font-weight: 600;}
.moskvin-menu-link.active {color: #24a659;}
.moskvin-menu-link + .moskvin-menu-link {margin-left: 1.75rem;}

.moskvin-social {}
.moskvin-social-link {color: #000; font-size: 1.125rem;}
.moskvin-social-link + .moskvin-social-link {margin-left: .5rem;}

.moskva-video {min-height: 450px; height: 70vh; position: relative; overflow: hidden; background: linear-gradient(45deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%); display: flex; flex-direction: column;}

.moskva-thematic-video {position: absolute; right: 0; left: 0; top: 0; width: 100%; z-index: -100;}

.moskvin-benefits-marquee {overflow: hidden;  position: absolute; bottom: 1rem;}
.moskvin-benefits-marquee img {max-width: 100%; height: 90px;}

.moskvin-marquee-inner {display: flex; align-items: center; width: 100%;}

.moskvin-marquee-item {flex: 0 0 16.66666667%; padding: 0 2rem; text-align: center;}

.moskva-titles {margin: 5rem 0;}
.moskva-titles h1 {font-weight: 800;}

.moskva-titles-descriptor {color: #54645a;}

.moskva-cases {margin-bottom: 5rem;}
.moskva-cases h2 {margin-bottom: 0;}

.moskva-cases-descriptor {color: #54645a; margin-bottom: 3rem;}

.moskvin-projects-list {margin-bottom: 2rem;}

.moskvin-projects-item {margin-bottom: 3rem;}

.moskvin-project-media {border-radius: 1.25rem; overflow: hidden; margin-bottom: 1.25rem; position: relative;}
.moskvin-project-media > * {display: flex; justify-content: center; align-items: center;}
.moskvin-project-media > .btn-play {position: absolute; bottom: 1rem; left: 1rem; color: #24a659; font-size: 3rem; box-shadow: 0 0 1rem #000; border-radius: 3rem; background-color: #fff; border: 1px solid #fff; opacity: .7;}
.moskvin-project-media > .btn-play:hover {opacity: .9;}
.moskvin-project-media img {max-width: 100%; width: 100%; border-radius: 1.5rem;}
.moskvin-project-media:before {content: ''; display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: rgb(0 0 0 / 30%);}
.moskvin-project-media:before {
    background: rgb(1,0,22);
    background: linear-gradient(0deg, rgba(1,0,22,0.8) 0%, rgba(1,0,22,0) 100%);
}

.moskvin-case-video {max-width: 100%;}

.moskvin-project-title {text-transform: uppercase; font-weight: 600; margin-bottom: 0.25rem;}
.moskvin-project-brand {text-transform: uppercase; font-size: .875rem; color: #acacac; font-weight: 400;}

.moskvin-project-panel a {text-decoration: none; color: #000;}
.moskvin-project-panel a:hover {color: #24a659;}

.moskvin-link-more {text-transform: uppercase;}

.moskva-services {margin-bottom: 5rem;}
.moskva-services h2 {margin-bottom: 0;}

.moskva-services-link {text-transform: uppercase;}
.moskva-services-link + .moskva-services-link {margin-left: 2rem;}

.moskva-benefits {padding-bottom: 3rem; margin-bottom: 3rem; border-bottom: 1px solid #2e2e2e;}

.moskva-benefits-flex {display: flex;}

.moskva-benefits-item {color: #fff;}
.moskva-benefits-item + .moskva-benefits-item {margin-left: 3rem;}

.moskva-benefits-count {font-size: 3em; line-height: 3rem; font-weight: 800;}

.moskva-benefits-name {font-size: 1.125rem; text-transform: uppercase;}

.moskva-order {margin-bottom: 6rem;}

.moskva-order-link {font-size: 2rem; font-weight: 700; line-height: 2.5rem; color: #24a659; text-transform: uppercase; text-decoration: none;}
.moskva-order-link:hover {color: #fff;}

.moskva-page-panel {margin-top: 4rem; margin-bottom: 4rem;}

.moskva-page-contacts a {font-size: 1.5rem; font-weight: 700; text-decoration: none;}
.moskva-page-contacts a + a {margin-left: 1rem;}

.moskva-page-descriptor {color: #54645a; margin-top: 4rem;}

.moskva-page-media {margin-bottom: 4rem;}

.moskva-services-services {margin-bottom: 4rem;}
.moskva-services-services .moskva-services-link {font-size: 2rem; text-decoration: none; line-height: 3.25rem;}

.moskva-contacts-page {margin-bottom: 4rem;}

.moskva-contacts-contact {font-size: 2.5rem; font-weight: 900;}
.moskva-contacts-contact a {text-decoration: none;}

.moskva-contacts-social {margin-top: 5rem;}

.moskva-page-text {margin-bottom: 4rem; font-size: 1.125rem;}

.moskva-page-service {margin-bottom: 6rem;}
.moskva-page-service h2 {margin-bottom: 4rem;}

.moskva-footer img {max-width: 100%;}

.moskva-footer-menu {display: flex; margin-bottom: 1rem;}
.moskva-footer-menu .moskvin-menu-link {color: #fff; text-decoration: none; text-transform: uppercase; font-weight: 600;}
.moskva-footer-menu .moskvin-menu-link:hover {color: #24a659;}
.moskva-footer-menu .moskvin-menu-link + .moskvin-menu-link {margin-left: 1.75rem;}

.moskva-footer-social {}
.moskva-footer-social .moskvin-social-link {color: #fff; font-size: 1.75rem;}
.moskva-footer-social .moskvin-social-link:hover {color: #24a659;}
.moskva-footer-social .moskvin-social-link + .moskvin-social-link {margin-left: 1rem;}

.moskva-copyright {color: #fff; margin-top: 3rem; font-weight: 300;}

footer {padding-top: 5rem; padding-bottom: 1rem; background-color: #000;}

/* modals */

.moskva-modal-dialog {margin: 0; height: 100%; min-height: 100%; max-height: 100%; position: absolute; right: 0; width: 100%;}

.moskva-modal .modal-header {padding: 1.5rem 3rem; background-color: #000; color: #fff; border-radius: 0;}
.moskva-modal .modal-title {font-size: 1.5rem;}
.moskva-modal .modal-title > span {color: #8a8a8a; font-size: 0.875rem; margin-left: 1rem;}
.moskva-modal .modal-content {height: 100%; border-radius: 0; border: none; background-color: #fff;}
.moskva-modal .modal-body {padding: 2rem 3rem;}
.moskva-modal .modal-footer {padding: 2rem 3rem; display: block;}
.moskva-modal .form-check {margin-bottom: 1rem;}
.moskva-modal .form-check-label {text-transform: uppercase; font-size: .75rem; font-weight: 800; margin-top: 2rem; margin-bottom: 1rem;}

.moskva-modal-header {background-color: #0078ff; color: #fff; border: 1px solid #0078ff;}

.moskva-modal-title {text-transform: inherit;}

.modal-order-phone {margin-top: 2rem}

.modal-phone-phone {text-decoration: none; color: #333; font-weight: 700; font-size: 1.5rem; display: block; margin-top: 1rem;}

.moskvin-contacts-tags {display: flex; flex-wrap: wrap;}

.moskvin-contacts-tag {margin-right: 1rem; margin-bottom: .5rem;}

/* fly social */

.moskvin-fly-social {position: fixed; bottom: 2rem; z-index: 2000;}

@media (min-width: 576px)
{
    .moskvin-fly-social {right: calc((100% - 540px) / 2);}
}
@media (min-width: 768px) 
{
    .moskvin-fly-social {right: calc((100% - 720px) / 2);}
}
@media (min-width: 992px) 
{
    .moskvin-fly-social {right: calc((100% - 960px) / 2);}
}
@media (min-width: 1200px)
{
    .moskvin-fly-social {right: calc((100% - 1140px) / 2);}
}
@media (min-width: 1400px)
{
    .moskvin-fly-social {right: calc((100% - 1320px) / 2);}
}

.moskvin-fly-list {display: none;}
.moskvin-fly-list > a {width: 50px; height: 50px; border-radius: 50px; font-size: 1.5rem; display: flex; align-items: center; justify-content: center; text-decoration: none; color: #fff; margin-bottom: 1rem;}

.fly-fa-instagram {
    background: -webkit-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -webkit-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
	background: -moz-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -moz-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
	background: -ms-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -ms-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
	background: -o-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -o-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
	background: radial-gradient(circle farthest-corner at 32% 106%, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), linear-gradient(135deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
}

.fly-fa-whatsapp {background: #00e676;}
.fly-fa-vk {background: rgb(39, 135, 245);}
.fly-fa-telegram-plane {background: #24a3e0;}
.fly-fa-odnoklassniki {background: #FF9800;}

.moskvin-fly-toggler {display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; font-size: 1.5rem; border-radius: 50px; background-color: #24a659; color: #fff; text-decoration: none; animation: pulse 2s infinite;}
.moskvin-fly-toggler:hover {color: #000;}

@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 195, 0, 0.8);
  }
  70% {
      -webkit-box-shadow: 0 0 0 .75rem rgba(255, 195, 0, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(255, 195, 0, 0);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(255, 195, 0, 0.8);
    box-shadow: 0 0 0 0 rgba(255, 195, 0, 0.8);
  }
  70% {
      -moz-box-shadow: 0 0 0 .75rem rgba(255, 195, 0, 0);
      box-shadow: 0 0 0 .75rem rgba(255, 195, 0, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(255, 195, 0, 0);
      box-shadow: 0 0 0 0 rgba(255, 195, 0, 0);
  }
}