edit blocks (gendir 4 + photos FINAL)
@@ -258,8 +258,10 @@ img {
|
|||||||
.hero__content {
|
.hero__content {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
max-width: 1000px;
|
/*max-width: 1000px;*/
|
||||||
margin-left: 528px;
|
max-width: 1200px;
|
||||||
|
/*margin-left: 528px;*/
|
||||||
|
margin-left: auto;
|
||||||
padding-top: 104px;
|
padding-top: 104px;
|
||||||
padding-bottom: 100px;
|
padding-bottom: 100px;
|
||||||
}
|
}
|
||||||
@@ -283,9 +285,10 @@ img {
|
|||||||
max-width: 1000px;
|
max-width: 1000px;
|
||||||
/*margin-bottom: 24px;*/
|
/*margin-bottom: 24px;*/
|
||||||
margin-bottom: 45px;
|
margin-bottom: 45px;
|
||||||
font-size: 72px;
|
font-size: 82px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
line-height: 90px;
|
line-height: 90px;
|
||||||
|
text-shadow: 0 15px 30px rgba(255, 255, 255, 0.1);
|
||||||
}
|
}
|
||||||
.hero h1 span {
|
.hero h1 span {
|
||||||
color: #cf1717;
|
color: #cf1717;
|
||||||
@@ -307,7 +310,7 @@ img {
|
|||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
}
|
}
|
||||||
.hero__tags li {
|
.hero__tags li {
|
||||||
padding: 20px 20px;
|
padding: 16px 20px;
|
||||||
border: 1px solid rgba(207, 23, 23, 0.3);
|
border: 1px solid rgba(207, 23, 23, 0.3);
|
||||||
/*background: rgba(41, 49, 51, 0.6);*/
|
/*background: rgba(41, 49, 51, 0.6);*/
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
@@ -315,16 +318,23 @@ img {
|
|||||||
line-height: 20px;
|
line-height: 20px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
transition: border-color 0.25s ease, background-color 0.25s ease, transform 0.25s ease;
|
transition: border-color 0.25s ease, background-color 0.25s ease, transform 0.25s ease;
|
||||||
background-color: rgba(255, 255, 255, 0.2);
|
background-color: rgba(255, 255, 255, 0.09);
|
||||||
backdrop-filter: blur(53px);
|
backdrop-filter: blur(53px);
|
||||||
-webkit-backdrop-filter: blur(10px);
|
-webkit-backdrop-filter: blur(10px);
|
||||||
border: 0px solid rgba(255, 255, 255, 0.3);
|
border: 1px solid rgba(255, 255, 255, 0.13);
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
|
width: 240px;
|
||||||
|
text-align: center;
|
||||||
|
white-space: normal;
|
||||||
}
|
}
|
||||||
.hero__tags li:hover {
|
.hero__tags li:hover {
|
||||||
transform: translateY(-1px);
|
transform: translateY(-1px);
|
||||||
border-color: rgba(207, 23, 23, 0.55);
|
/*border-color: rgba(207, 23, 23, 0.55);*/
|
||||||
background: rgba(41, 49, 51, 0.9);
|
/*background: rgba(41, 49, 51, 0.9);*/
|
||||||
|
}
|
||||||
|
.hero__tags li img {
|
||||||
|
width: 100px;
|
||||||
|
margin: 0 auto 5px;
|
||||||
}
|
}
|
||||||
.hero__actions {
|
.hero__actions {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -342,7 +352,7 @@ img {
|
|||||||
}
|
}
|
||||||
.highlights__grid {
|
.highlights__grid {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
gap: 24px;
|
gap: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -362,7 +372,7 @@ img {
|
|||||||
}
|
}
|
||||||
.info-card h3 {
|
.info-card h3 {
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
font-size: 20px;
|
font-size: 18px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
line-height: 28px;
|
line-height: 28px;
|
||||||
}
|
}
|
||||||
@@ -1605,7 +1615,7 @@ img {
|
|||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
}
|
}
|
||||||
.hero h1 {
|
.hero h1 {
|
||||||
font-size: 64px;
|
font-size: 80px;
|
||||||
line-height: 1.15;
|
line-height: 1.15;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -1618,7 +1628,8 @@ img {
|
|||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
}
|
}
|
||||||
.hero__content {
|
.hero__content {
|
||||||
margin-left: 280px;
|
/*margin-left: 280px;*/
|
||||||
|
margin-left: auto;
|
||||||
max-width: 700px;
|
max-width: 700px;
|
||||||
}
|
}
|
||||||
.hero h1 {
|
.hero h1 {
|
||||||
@@ -1796,7 +1807,7 @@ img {
|
|||||||
padding: 0 16px;
|
padding: 0 16px;
|
||||||
}
|
}
|
||||||
.btn {
|
.btn {
|
||||||
width: 100%;
|
width: 97%;
|
||||||
}
|
}
|
||||||
.btn--small {
|
.btn--small {
|
||||||
width: auto;
|
width: auto;
|
||||||
@@ -1816,6 +1827,11 @@ img {
|
|||||||
.hero__tags li {
|
.hero__tags li {
|
||||||
white-space: normal;
|
white-space: normal;
|
||||||
padding: 14px 20px;
|
padding: 14px 20px;
|
||||||
|
width: 47%;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
.hero__tags li img {
|
||||||
|
width: 73px;
|
||||||
}
|
}
|
||||||
.hero__actions .btn--ghost {
|
.hero__actions .btn--ghost {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
2
assets/css/main.min.css
vendored
BIN
assets/images/olimp_icon1.png
Normal file
|
After Width: | Height: | Size: 6.4 KiB |
BIN
assets/images/olimp_icon2.png
Normal file
|
After Width: | Height: | Size: 69 KiB |
BIN
assets/images/olimp_icon3.png
Normal file
|
After Width: | Height: | Size: 61 KiB |
BIN
assets/images/olimp_icon4.png
Normal file
|
After Width: | Height: | Size: 61 KiB |
BIN
assets/images/renders/arena_horeo.jpg
Normal file
|
After Width: | Height: | Size: 124 KiB |
BIN
assets/images/renders/arena_hotel2.jpg
Normal file
|
After Width: | Height: | Size: 122 KiB |
BIN
assets/images/renders/arena_parking2.jpg
Normal file
|
After Width: | Height: | Size: 88 KiB |
@@ -217,8 +217,10 @@ img {
|
|||||||
&__content {
|
&__content {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
max-width: 1000px;
|
/*max-width: 1000px;*/
|
||||||
margin-left: 528px;
|
max-width: 1200px;
|
||||||
|
/*margin-left: 528px;*/
|
||||||
|
margin-left:auto;
|
||||||
padding-top: 104px;
|
padding-top: 104px;
|
||||||
padding-bottom: 100px;
|
padding-bottom: 100px;
|
||||||
|
|
||||||
@@ -248,9 +250,10 @@ img {
|
|||||||
max-width: 1000px;
|
max-width: 1000px;
|
||||||
/*margin-bottom: 24px;*/
|
/*margin-bottom: 24px;*/
|
||||||
margin-bottom:45px;
|
margin-bottom:45px;
|
||||||
font-size: 72px;
|
font-size: 82px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
line-height: 90px;
|
line-height: 90px;
|
||||||
|
text-shadow: 0 15px 30px rgb(255 255 255 / 10%);
|
||||||
|
|
||||||
span {
|
span {
|
||||||
color: $color-accent;
|
color: $color-accent;
|
||||||
@@ -275,7 +278,7 @@ img {
|
|||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
|
|
||||||
li {
|
li {
|
||||||
padding: 20px 20px;
|
padding: 16px 20px;
|
||||||
border: 1px solid $color-border-strong;
|
border: 1px solid $color-border-strong;
|
||||||
/*background: rgba(41, 49, 51, 0.6);*/
|
/*background: rgba(41, 49, 51, 0.6);*/
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
@@ -284,17 +287,25 @@ img {
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
transition: border-color 0.25s ease, background-color 0.25s ease, transform 0.25s ease;
|
transition: border-color 0.25s ease, background-color 0.25s ease, transform 0.25s ease;
|
||||||
|
|
||||||
background-color: rgba(255, 255, 255, 0.2);
|
background-color: rgba(255, 255, 255, 0.09);
|
||||||
backdrop-filter: blur(53px);
|
backdrop-filter: blur(53px);
|
||||||
-webkit-backdrop-filter: blur(10px);
|
-webkit-backdrop-filter: blur(10px);
|
||||||
border: 0px solid rgba(255, 255, 255, 0.3);
|
border: 1px solid rgba(255, 255, 255, 0.13);
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
|
width:240px;
|
||||||
|
text-align:center;
|
||||||
|
white-space: normal;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
transform: translateY(-1px);
|
transform: translateY(-1px);
|
||||||
border-color: rgba(207, 23, 23, 0.55);
|
/*border-color: rgba(207, 23, 23, 0.55);*/
|
||||||
background: rgba(41, 49, 51, 0.9);
|
/*background: rgba(41, 49, 51, 0.9);*/
|
||||||
}
|
}
|
||||||
|
|
||||||
|
img{
|
||||||
|
width:100px;
|
||||||
|
margin: 0 auto 5px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -316,7 +327,7 @@ img {
|
|||||||
|
|
||||||
&__grid {
|
&__grid {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||||
gap: 24px;
|
gap: 24px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -335,7 +346,7 @@ img {
|
|||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
font-size: 20px;
|
font-size: 18px;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
line-height: 28px;
|
line-height: 28px;
|
||||||
}
|
}
|
||||||
@@ -1748,7 +1759,7 @@ img {
|
|||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 64px;
|
font-size: 80px;
|
||||||
line-height: 1.15;
|
line-height: 1.15;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -1768,7 +1779,8 @@ img {
|
|||||||
|
|
||||||
.hero {
|
.hero {
|
||||||
&__content {
|
&__content {
|
||||||
margin-left: 280px;
|
/*margin-left: 280px;*/
|
||||||
|
margin-left: auto;
|
||||||
max-width: 700px;
|
max-width: 700px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -2026,7 +2038,7 @@ img {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
width: 100%;
|
width: 97%;
|
||||||
|
|
||||||
&--small {
|
&--small {
|
||||||
width: auto;
|
width: auto;
|
||||||
@@ -2051,6 +2063,12 @@ img {
|
|||||||
li {
|
li {
|
||||||
white-space: normal;
|
white-space: normal;
|
||||||
padding: 14px 20px;
|
padding: 14px 20px;
|
||||||
|
width: 47%;
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
img{
|
||||||
|
width: 73px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
42
index.html
@@ -32,16 +32,16 @@
|
|||||||
Спорткомплекс полного цикла в <span>Москве:</span><br>
|
Спорткомплекс полного цикла в <span>Москве:</span><br>
|
||||||
лёд, залы, проживание и питание на одной территории
|
лёд, залы, проживание и питание на одной территории
|
||||||
</h1>-->
|
</h1>-->
|
||||||
<h1>Многофункциональный ледовый комплекс</h1>
|
<h1>Ледовый<br> спорткомплекс</h1>
|
||||||
<!--<p>
|
<!--<p>
|
||||||
Два ледовых поля 58×26 м, универсальный зал, фитнес-центр и
|
Два ледовых поля 58×26 м, универсальный зал, фитнес-центр и
|
||||||
апарт-отель на 70+ номеров. В пределах ТТК.
|
апарт-отель на 70+ номеров. В пределах ТТК.
|
||||||
</p>-->
|
</p>-->
|
||||||
<ul class="hero__tags">
|
<ul class="hero__tags">
|
||||||
<li>2 ледовых поля 58×26 м</li>
|
<li><img src="assets/images/olimp_icon1.png" /> 2 ледовых поля 58×26 м</li>
|
||||||
<li>Универсальный зал, фитнес центр, и зал хореографии</li>
|
<li><img src="assets/images/olimp_icon2.png" />Универсальный зал, фитнес центр, и зал хореографии</li>
|
||||||
<li>Проживание и питание на территории</li>
|
<li><img src="assets/images/olimp_icon3.png" />Проживание и питание на территории</li>
|
||||||
<li>Собственный паркинг</li>
|
<li><img src="assets/images/olimp_icon4.png" />Собственный паркинг</li>
|
||||||
</ul>
|
</ul>
|
||||||
<div class="hero__actions">
|
<div class="hero__actions">
|
||||||
<a style="padding-left: 75px; padding-right: 75px;" class="btn" href="#booking">Оставить заявку</a>
|
<a style="padding-left: 75px; padding-right: 75px;" class="btn" href="#booking">Оставить заявку</a>
|
||||||
@@ -69,16 +69,20 @@
|
|||||||
<p>Стандартные размеры площадок, профессиональное оборудование, опыт проведения турниров.</p>
|
<p>Стандартные размеры площадок, профессиональное оборудование, опыт проведения турниров.</p>
|
||||||
</article>-->
|
</article>-->
|
||||||
<article class="info-card">
|
<article class="info-card">
|
||||||
<h3>Арена премиум-класса</h3>
|
<h3>ПРЕМИУМ УРОВЕНЬ</h3>
|
||||||
<p>Два ледовых поля, профессиональные залы и зоны отдыха — премиальный уровень чувствуется в каждой детали. Пространство, где созданы лучшие условия для ваших побед.</p>
|
<p>Олимп Арена – это лёд высокого качества, универсальный зал по международным стандартам, бросковая зона, функциональные и просторные раздевалки, судейские и тренерские, тренажеры и оборудование премиум-уровня, строгий и дорогой интерьер, собственный паркинг – продумана каждая деталь для Вашего комфорта и достижения целей.</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="info-card">
|
<article class="info-card">
|
||||||
<h3>Удобная логистика</h3>
|
<h3>МНОГОФУНКЦИОНАЛЬНОСТЬ</h3>
|
||||||
<p>В пределах ТТК, 10 минут пешком от метро «Волгоградский проспект». Удобный заезд и собственная парковка для гостей.</p>
|
<p>Олимп Арена – пространство, объединяющее инфраструктуру для спорта высших достижений, командного и индивидуального спорта: хоккей, фигурное катание, футзал, волейбол, баскетбол, зал единоборств и тренажерный зал. Гибкая и функциональная инфраструктуры подходит для проведения корпоративных и развлекательных мероприятий.</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="info-card">
|
<article class="info-card">
|
||||||
<h3>Соревнования. Сборы. Тренировочный процесс</h3>
|
<h3>ВСЕ ВКЛЮЧЕНО</h3>
|
||||||
<p>Раздевалки, судейские и тренерские помещения, медицинский кабинет, ресторан и апарт-отель — всё в одном комплексе. Профессиональная инфраструктура для проведения мероприятий любого масштаба.</p>
|
<p>Олимп Арена – это непросто спортивный объект, это спортивная база в центре Москвы, которая подходит для проведения учебно-тренировочных занятий, спортивных сборов, соревнований и турниров. Лед, спортивные залы, апарт-отель – все одном месте.</p>
|
||||||
|
</article>
|
||||||
|
<article class="info-card">
|
||||||
|
<h3>ЛОКАЦИЯ </h3>
|
||||||
|
<p>Олимп Арена – это идеальное место для спорта с превосходной транспортной доступностью. Арена удобно расположена относительно станции метро, МЦК, Третьего и Садового кольца.</p>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@@ -117,8 +121,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="object-card object-card--reverse" style="display:none;">
|
<article class="object-card object-card--reverse" style="">
|
||||||
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('./assets/images/other/1231.png');"></div>
|
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('./assets/images/renders/arena_horeo.jpg');"></div>
|
||||||
<div class="object-card__content">
|
<div class="object-card__content">
|
||||||
<h3>Зал хореографии</h3>
|
<h3>Зал хореографии</h3>
|
||||||
<p>Оборудован зеркалами и станками для занятий хореографией</p>
|
<p>Оборудован зеркалами и станками для занятий хореографией</p>
|
||||||
@@ -126,8 +130,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="object-card object-card--reverse">
|
<article class="object-card">
|
||||||
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('./assets/images/renders/arena_hotel.jpg');"></div>
|
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('./assets/images/renders/arena_hotel2.jpg');"></div>
|
||||||
<div class="object-card__content">
|
<div class="object-card__content">
|
||||||
<h3>Апарт-отель</h3>
|
<h3>Апарт-отель</h3>
|
||||||
<p>70+ номеров для команд и гостей. Прямо на территории</p>
|
<p>70+ номеров для команд и гостей. Прямо на территории</p>
|
||||||
@@ -135,7 +139,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="object-card">
|
<article class="object-card object-card--reverse">
|
||||||
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('./assets/images/renders/photo_olimp_rest7.jpg');"></div>
|
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('./assets/images/renders/photo_olimp_rest7.jpg');"></div>
|
||||||
<div class="object-card__content">
|
<div class="object-card__content">
|
||||||
<h3>Ресторан</h3>
|
<h3>Ресторан</h3>
|
||||||
@@ -144,10 +148,10 @@
|
|||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="object-card object-card--reverse">
|
<article class="object-card">
|
||||||
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('./assets/images/renders/arena_parking.jpg');"></div>
|
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('./assets/images/renders/arena_parking2.jpg');"></div>
|
||||||
<div class="object-card__content">
|
<div class="object-card__content">
|
||||||
<h3>Парковка и подъезд</h3>
|
<h3>Парковка</h3>
|
||||||
<p>Своя парковка для гостей и автобусов команд</p>
|
<p>Своя парковка для гостей и автобусов команд</p>
|
||||||
<a class="btn btn--small" href="#booking">Подробнее</a>
|
<a class="btn btn--small" href="#booking">Подробнее</a>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||