BOUNTY707
7 months ago
commit
493134980b
@ -0,0 +1,39 @@ |
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
<head> |
||||
<meta charset="UTF-8"> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
||||
<link rel="stylesheet" href="font/stylesheet.css"> |
||||
<link rel="stylesheet" href="style/index.css"> |
||||
<title>Title</title> |
||||
</head> |
||||
<body> |
||||
<div class="wrapper"> |
||||
<section class="authors"> |
||||
<div class="container"> |
||||
<div class="authors_block"> |
||||
<h2 class="title">Наши авторы</h2> |
||||
<div class="authors_cards"> |
||||
<div class="authors_card"> |
||||
<img src="img/authors-img1.png" alt=""> |
||||
<h3>Екатерина Волкова</h3> |
||||
<p>Старший менеджер по продажам</p> |
||||
</div> |
||||
<div class="authors_card"> |
||||
<img src="img/authors-img2.png" alt=""> |
||||
<h3>Анастасия Колесникова</h3> |
||||
<p>Менеджер по продажам</p> |
||||
</div> |
||||
<div class="authors_card"> |
||||
<img src="img/authors-img3.png" alt=""> |
||||
<h3>Тимур Абдеев</h3> |
||||
<p>Менеджер по работе с клиентами</p> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</section> |
||||
</div> |
||||
|
||||
</body> |
||||
</html> |
||||
@ -0,0 +1,225 @@ |
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
<head> |
||||
<meta charset="UTF-8"> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
||||
<link rel="stylesheet" href="font/stylesheet.css"> |
||||
<link rel="stylesheet" href="style/index.css"> |
||||
<title>Title</title> |
||||
</head> |
||||
<body> |
||||
<div class="wrapper"> |
||||
<section class="authors"> |
||||
<div class="container"> |
||||
<div class="authors_block"> |
||||
<div class="top_box"> |
||||
<img src="img/box-img.png" alt=""> |
||||
<div class="info"> |
||||
<div class="info_title"> |
||||
<h3>Екатерина Волкова</h3> |
||||
<p>Старший менеджер по продажам</p> |
||||
</div> |
||||
<p>Далеко-далеко за словесными горами в стране гласных и согласных живут рыбные тексты. Вдали от всех живут они в буквенных домах на берегу Семантика большого языкового океана. Маленький ручеек Даль журчит</p> |
||||
</div> |
||||
</div> |
||||
|
||||
<h2 class="title">Екатерина Волкова</h2> |
||||
|
||||
<div class="items_block"> |
||||
<div class="authors_items"> |
||||
<div class="authors_item"> |
||||
<img src="img/item-img1.png" alt="" class="item-img"> |
||||
<div class="info_wrap"> |
||||
<div class="info"> |
||||
<span>22 августа 2024</span> |
||||
|
||||
<div class="info_box"> |
||||
<span> |
||||
<img src="img/clock-circle.svg" alt=""> |
||||
5 минут |
||||
</span> |
||||
<span> |
||||
<img src="img/eye.svg" alt=""> |
||||
1064 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
<h5>Аккредитация и лицензирование учебных заведений </h5> |
||||
</div> |
||||
</div> |
||||
<div class="authors_item"> |
||||
<img src="img/item-img2.png" alt="" class="item-img"> |
||||
<div class="info_wrap"> |
||||
<div class="info"> |
||||
<span>22 августа 2024</span> |
||||
|
||||
<div class="info_box"> |
||||
<span> |
||||
<img src="img/clock-circle.svg" alt=""> |
||||
5 минут |
||||
</span> |
||||
<span> |
||||
<img src="img/eye.svg" alt=""> |
||||
362 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
<h5>Как получить медицинскую лицензию? </h5> |
||||
</div> |
||||
</div> |
||||
<div class="authors_item"> |
||||
<img src="img/item-img3.png" alt="" class="item-img"> |
||||
<div class="info_wrap"> |
||||
<div class="info"> |
||||
<span>22 августа 2024</span> |
||||
|
||||
<div class="info_box"> |
||||
<span> |
||||
<img src="img/clock-circle.svg" alt=""> |
||||
5 минут |
||||
</span> |
||||
<span> |
||||
<img src="img/eye.svg" alt=""> |
||||
1458 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
<h5>Как получить образовательную лицензию? </h5> |
||||
</div> |
||||
</div> |
||||
<div class="authors_item"> |
||||
<img src="img/item-img4.png" alt="" class="item-img"> |
||||
<div class="info_wrap"> |
||||
<div class="info"> |
||||
<span>22 августа 2024</span> |
||||
|
||||
<div class="info_box"> |
||||
<span> |
||||
<img src="img/clock-circle.svg" alt=""> |
||||
5 минут |
||||
</span> |
||||
<span> |
||||
<img src="img/eye.svg" alt=""> |
||||
3221 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
<h5>Как провести оценку ООО перед продажей: советы эксперта</h5> |
||||
</div> |
||||
</div> |
||||
<div class="authors_item"> |
||||
<img src="img/item-img5.png" alt="" class="item-img"> |
||||
<div class="info_wrap"> |
||||
<div class="info"> |
||||
<span>22 августа 2024</span> |
||||
|
||||
<div class="info_box"> |
||||
<span> |
||||
<img src="img/clock-circle.svg" alt=""> |
||||
5 минут |
||||
</span> |
||||
<span> |
||||
<img src="img/eye.svg" alt=""> |
||||
3220 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
<h5>Что лучше: ИП, ПБОЮЛ или ЧП, ЧОП, ЧОО, ООО ИЛИ АО </h5> |
||||
</div> |
||||
</div> |
||||
<div class="authors_item"> |
||||
<img src="img/item-img6.png" alt="" class="item-img"> |
||||
<div class="info_wrap"> |
||||
<div class="info"> |
||||
<span>22 августа 2024</span> |
||||
|
||||
<div class="info_box"> |
||||
<span> |
||||
<img src="img/clock-circle.svg" alt=""> |
||||
5 минут |
||||
</span> |
||||
<span> |
||||
<img src="img/eye.svg" alt=""> |
||||
3075 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
<h5>Нужен ли допуск СРО для выполнения электромонтажных работ</h5> |
||||
</div> |
||||
</div> |
||||
<div class="authors_item"> |
||||
<img src="img/item-img7.png" alt="" class="item-img"> |
||||
<div class="info_wrap"> |
||||
<div class="info"> |
||||
<span>22 августа 2024</span> |
||||
|
||||
<div class="info_box"> |
||||
<span> |
||||
<img src="img/clock-circle.svg" alt=""> |
||||
5 минут |
||||
</span> |
||||
<span> |
||||
<img src="img/eye.svg" alt=""> |
||||
4760 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
<h5>Список работ, при выполнении которых допуск СРО не требуется </h5> |
||||
</div> |
||||
</div> |
||||
<div class="authors_item"> |
||||
<img src="img/item-img8.png" alt="" class="item-img"> |
||||
<div class="info_wrap"> |
||||
<div class="info"> |
||||
<span>22 августа 2024</span> |
||||
|
||||
<div class="info_box"> |
||||
<span> |
||||
<img src="img/clock-circle.svg" alt=""> |
||||
5 минут |
||||
</span> |
||||
<span> |
||||
<img src="img/eye.svg" alt=""> |
||||
3218 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
<h5>Сравнение различных видов сертификатов ISO: какой выбрать для своего бизнеса </h5> |
||||
</div> |
||||
</div> |
||||
<div class="authors_item"> |
||||
<img src="img/item-img9.png" alt="" class="item-img"> |
||||
<div class="info_wrap"> |
||||
<div class="info"> |
||||
<span>22 августа 2024</span> |
||||
|
||||
<div class="info_box"> |
||||
<span> |
||||
<img src="img/clock-circle.svg" alt=""> |
||||
5 минут |
||||
</span> |
||||
<span> |
||||
<img src="img/eye.svg" alt=""> |
||||
1946 |
||||
</span> |
||||
</div> |
||||
</div> |
||||
<h5>Получение лицензии на алкоголь в 2024: часто задаваемые вопросы </h5> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<div class="item_pagination"> |
||||
<button class="pagination_tab active">1</button> |
||||
<button class="pagination_tab">2</button> |
||||
<button class="pagination_tab">3</button> |
||||
<button class="pagination_tab">4</button> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</section> |
||||
</div> |
||||
|
||||
</body> |
||||
</html> |
||||
Binary file not shown.
Binary file not shown.
@ -0,0 +1,192 @@ |
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
<head> |
||||
<meta charset="utf-8"> |
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1"> |
||||
<meta name="robots" content="noindex, noarchive"> |
||||
<meta name="format-detection" content="telephone=no"> |
||||
<title>Transfonter demo</title> |
||||
<link href="stylesheet.css" rel="stylesheet"> |
||||
<style> |
||||
/* |
||||
http://meyerweb.com/eric/tools/css/reset/ |
||||
v2.0 | 20110126 |
||||
License: none (public domain) |
||||
*/ |
||||
html, body, div, span, applet, object, iframe, |
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre, |
||||
a, abbr, acronym, address, big, cite, code, |
||||
del, dfn, em, img, ins, kbd, q, s, samp, |
||||
small, strike, strong, sub, sup, tt, var, |
||||
b, u, i, center, |
||||
dl, dt, dd, ol, ul, li, |
||||
fieldset, form, label, legend, |
||||
table, caption, tbody, tfoot, thead, tr, th, td, |
||||
article, aside, canvas, details, embed, |
||||
figure, figcaption, footer, header, hgroup, |
||||
menu, nav, output, ruby, section, summary, |
||||
time, mark, audio, video { |
||||
margin: 0; |
||||
padding: 0; |
||||
border: 0; |
||||
font-size: 100%; |
||||
font: inherit; |
||||
vertical-align: baseline; |
||||
} |
||||
/* HTML5 display-role reset for older browsers */ |
||||
article, aside, details, figcaption, figure, |
||||
footer, header, hgroup, menu, nav, section { |
||||
display: block; |
||||
} |
||||
body { |
||||
line-height: 1; |
||||
} |
||||
ol, ul { |
||||
list-style: none; |
||||
} |
||||
blockquote, q { |
||||
quotes: none; |
||||
} |
||||
blockquote:before, blockquote:after, |
||||
q:before, q:after { |
||||
content: ''; |
||||
content: none; |
||||
} |
||||
table { |
||||
border-collapse: collapse; |
||||
border-spacing: 0; |
||||
} |
||||
/* demo styles */ |
||||
body { |
||||
background: #f0f0f0; |
||||
color: #000; |
||||
} |
||||
.page { |
||||
background: #fff; |
||||
width: 920px; |
||||
margin: 0 auto; |
||||
padding: 20px 20px 0 20px; |
||||
overflow: hidden; |
||||
} |
||||
.font-container { |
||||
overflow-x: auto; |
||||
overflow-y: hidden; |
||||
margin-bottom: 40px; |
||||
line-height: 1.3; |
||||
white-space: nowrap; |
||||
padding-bottom: 5px; |
||||
} |
||||
h1 { |
||||
position: relative; |
||||
background: #444; |
||||
font-size: 32px; |
||||
color: #fff; |
||||
padding: 10px 20px; |
||||
margin: 0 -20px 12px -20px; |
||||
} |
||||
.letters { |
||||
font-size: 25px; |
||||
margin-bottom: 20px; |
||||
} |
||||
.s10:before { |
||||
content: '10px'; |
||||
} |
||||
.s11:before { |
||||
content: '11px'; |
||||
} |
||||
.s12:before { |
||||
content: '12px'; |
||||
} |
||||
.s14:before { |
||||
content: '14px'; |
||||
} |
||||
.s18:before { |
||||
content: '18px'; |
||||
} |
||||
.s24:before { |
||||
content: '24px'; |
||||
} |
||||
.s30:before { |
||||
content: '30px'; |
||||
} |
||||
.s36:before { |
||||
content: '36px'; |
||||
} |
||||
.s48:before { |
||||
content: '48px'; |
||||
} |
||||
.s60:before { |
||||
content: '60px'; |
||||
} |
||||
.s72:before { |
||||
content: '72px'; |
||||
} |
||||
.s10:before, .s11:before, .s12:before, .s14:before, |
||||
.s18:before, .s24:before, .s30:before, .s36:before, |
||||
.s48:before, .s60:before, .s72:before { |
||||
font-family: Arial, sans-serif; |
||||
font-size: 10px; |
||||
font-weight: normal; |
||||
font-style: normal; |
||||
color: #999; |
||||
padding-right: 6px; |
||||
} |
||||
pre { |
||||
display: block; |
||||
padding: 9px; |
||||
margin: 0 0 12px; |
||||
font-family: Monaco, Menlo, Consolas, "Courier New", monospace; |
||||
font-size: 13px; |
||||
line-height: 1.428571429; |
||||
color: #333; |
||||
font-weight: normal; |
||||
font-style: normal; |
||||
background-color: #f5f5f5; |
||||
border: 1px solid #ccc; |
||||
overflow-x: auto; |
||||
border-radius: 4px; |
||||
} |
||||
/* responsive */ |
||||
@media (max-width: 959px) { |
||||
.page { |
||||
width: auto; |
||||
margin: 0; |
||||
} |
||||
} |
||||
</style> |
||||
</head> |
||||
<body> |
||||
<div class="page"> |
||||
<div class="demo"> |
||||
<h1 style="font-family: 'Museo Sans Cyrl 100'; font-weight: 200; font-style: normal;">Museo Sans Cyrl 100</h1> |
||||
<pre title="Usage">.your-style { |
||||
font-family: 'Museo Sans Cyrl 100'; |
||||
font-weight: 200; |
||||
font-style: normal; |
||||
}</pre> |
||||
<pre title="Preload (optional)"> |
||||
<link rel="preload" href="MuseoSansCyrl-100.woff" as="font" type="font/woff" crossorigin></pre> |
||||
<div class="font-container" style="font-family: 'Museo Sans Cyrl 100'; font-weight: 200; font-style: normal;"> |
||||
<p class="letters"> |
||||
abcdefghijklmnopqrstuvwxyz<br> |
||||
ABCDEFGHIJKLMNOPQRSTUVWXYZ<br> |
||||
0123456789.:,;()*!?'@#<>$%&^+-=~ |
||||
</p> |
||||
<p class="s10" style="font-size: 10px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s11" style="font-size: 11px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s12" style="font-size: 12px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s14" style="font-size: 14px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s18" style="font-size: 18px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s24" style="font-size: 24px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s30" style="font-size: 30px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s36" style="font-size: 36px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s48" style="font-size: 48px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s60" style="font-size: 60px;">The quick brown fox jumps over the lazy dog.</p> |
||||
<p class="s72" style="font-size: 72px;">The quick brown fox jumps over the lazy dog.</p> |
||||
</div> |
||||
</div> |
||||
|
||||
</div> |
||||
</body> |
||||
</html> |
||||
@ -0,0 +1,32 @@ |
||||
@font-face { |
||||
font-family: 'Museo Sans Cyrl'; |
||||
src: url('MuseoSansCyrl-100.woff') format('woff'), |
||||
url('MuseoSansCyrl-100.ttf') format('truetype'); |
||||
font-weight: 200; |
||||
font-style: normal; |
||||
font-display: swap; |
||||
} |
||||
@font-face { |
||||
font-family: 'Museo Sans Cyrl'; |
||||
src: url('MuseoSansCyrl-400.woff') format('woff'), |
||||
url('MuseoSansCyrl-400.ttf') format('truetype'); |
||||
font-weight: 400; |
||||
font-style: normal; |
||||
font-display: swap; |
||||
} |
||||
@font-face { |
||||
font-family: 'Museo Sans Cyrl'; |
||||
src: url('MuseoSansCyrl-500.woff') format('woff'), |
||||
url('MuseoSansCyrl-500.ttf') format('truetype'); |
||||
font-weight: 500; |
||||
font-style: normal; |
||||
font-display: swap; |
||||
} |
||||
@font-face { |
||||
font-family: 'Museo Sans Cyrl'; |
||||
src: url('MuseoSansCyrl-600.woff') format('woff'), |
||||
url('MuseoSansCyrl-600.ttf') format('truetype'); |
||||
font-weight: 600; |
||||
font-style: normal; |
||||
font-display: swap; |
||||
} |
||||
|
After Width: | Height: | Size: 266 KiB |
|
After Width: | Height: | Size: 273 KiB |
|
After Width: | Height: | Size: 189 KiB |
|
After Width: | Height: | Size: 43 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 138 KiB |
|
After Width: | Height: | Size: 134 KiB |
|
After Width: | Height: | Size: 123 KiB |
|
After Width: | Height: | Size: 134 KiB |
|
After Width: | Height: | Size: 153 KiB |
|
After Width: | Height: | Size: 123 KiB |
|
After Width: | Height: | Size: 122 KiB |
|
After Width: | Height: | Size: 110 KiB |
|
After Width: | Height: | Size: 138 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
@ -0,0 +1,30 @@ |
||||
<!DOCTYPE html> |
||||
<html lang="en"> |
||||
<head> |
||||
<meta charset="UTF-8"> |
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
||||
<link rel="stylesheet" href="font/stylesheet.css"> |
||||
<link rel="stylesheet" href="style/index.css"> |
||||
<title>Title</title> |
||||
</head> |
||||
<body> |
||||
<div class="wrapper"> |
||||
<div class="banner"> |
||||
<div class="banner_block"> |
||||
<div class="number"> |
||||
<img src="img/num.svg" alt="" class="number1"> |
||||
<img src="img/num-mob.svg" alt="" class="number-mob"> |
||||
</div> |
||||
<div class="info_block"> |
||||
<div class="info"> |
||||
<h3>Беспроцентная рассрочка на все услуги!</h3> |
||||
<p>Оставьте заявку и получите консультацию!</p> |
||||
</div> |
||||
<a href="#!" class="info_btn">Оставить заявку</a> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
</body> |
||||
</html> |
||||
@ -0,0 +1,355 @@ |
||||
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"); |
||||
|
||||
* { |
||||
margin: 0; |
||||
padding: 0; |
||||
box-sizing: border-box; |
||||
} |
||||
|
||||
body { |
||||
margin: 0; |
||||
padding: 0; |
||||
background: #F9F9F9; |
||||
font-family: "Museo Sans Cyrl", sans-serif; |
||||
} |
||||
.container{ |
||||
max-width: 1256px; |
||||
padding: 0 24px; |
||||
margin: 0 auto; |
||||
} |
||||
|
||||
|
||||
/* Banner strat */ |
||||
.banner { |
||||
padding: 50px 24px; |
||||
} |
||||
.banner .banner_block { |
||||
position: relative; |
||||
max-width: 592px; |
||||
padding: 0px 20px 0 11px; |
||||
border-radius: 8px; |
||||
background-image: url(../img/banner-bg.png); |
||||
background-repeat: no-repeat; |
||||
background-size: cover; |
||||
margin: 0 auto; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 10px; |
||||
} |
||||
.banner .info_block { |
||||
display: flex; |
||||
align-items: end; |
||||
padding: 16px 0px 18px; |
||||
} |
||||
.banner_block .number1 { |
||||
display: block; |
||||
height: 100%; |
||||
} |
||||
.banner_block .number-mob { |
||||
display: none; |
||||
position: absolute; |
||||
top: 24px; |
||||
right: 16px; |
||||
} |
||||
.banner_block .info { |
||||
display: flex; |
||||
flex-direction: column; |
||||
gap: 12px; |
||||
} |
||||
.banner_block .info h3 { |
||||
font-size: 20px; |
||||
font-weight: 600; |
||||
line-height: 20px; |
||||
color: #FFF; |
||||
max-width: 278px; |
||||
} |
||||
.banner_block .info p { |
||||
font-family: Inter; |
||||
font-size: 14px; |
||||
font-weight: 400; |
||||
line-height: 16.8px; |
||||
color: #FFF; |
||||
max-width: 233px; |
||||
} |
||||
.banner_block .info_btn { |
||||
font-family: "Museo Sans Cyrl", sans-serif; |
||||
font-size: 14px; |
||||
font-weight: 600; |
||||
line-height: 16.8px; |
||||
color: #0F1521; |
||||
background: #FFFFFF; |
||||
border-radius: 4px; |
||||
text-decoration: none; |
||||
padding: 10px; |
||||
width: 160px; |
||||
height: 42px; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
white-space: nowrap; |
||||
} |
||||
|
||||
|
||||
/* Authors start */ |
||||
.authors{ |
||||
padding: 40px 0px 100px; |
||||
} |
||||
.authors .authors_block{ |
||||
display: flex; |
||||
flex-direction: column; |
||||
gap: 60px; |
||||
} |
||||
.authors_block .title{ |
||||
font-size: 32px; |
||||
font-weight: 600; |
||||
line-height: 38.4px; |
||||
color: #0F1521; |
||||
} |
||||
.authors_block .authors_cards{ |
||||
display: grid; |
||||
grid-template-columns: 32% 32% 32%; |
||||
gap: 20px; |
||||
} |
||||
.authors_block .authors_card{ |
||||
display: flex; |
||||
flex-direction: column; |
||||
gap: 25px; |
||||
} |
||||
.authors_card img{ |
||||
width: 100%; |
||||
height: 500px; |
||||
border-radius: 8px; |
||||
object-fit: cover; |
||||
} |
||||
.authors_card h3{ |
||||
font-size: 32px; |
||||
font-weight: 600; |
||||
line-height: 38.4px; |
||||
color: #000000; |
||||
} |
||||
.authors_card p{ |
||||
font-size: 16px; |
||||
font-weight: 300; |
||||
line-height: 19.2px; |
||||
color: #000000; |
||||
} |
||||
|
||||
|
||||
.authors_block .top_box{ |
||||
display: flex; |
||||
background: #FFF; |
||||
border-radius: 8px; |
||||
} |
||||
.top_box img{ |
||||
border-radius: 8px; |
||||
object-fit: cover; |
||||
} |
||||
.top_box .info{ |
||||
padding: 40px 40px 58px; |
||||
display: flex; |
||||
flex-direction: column; |
||||
gap: 32px; |
||||
} |
||||
.top_box .info_title{ |
||||
display: flex; |
||||
flex-direction: column; |
||||
gap: 12px; |
||||
} |
||||
.top_box .info_title h3{ |
||||
font-size: 24px; |
||||
font-weight: 600; |
||||
line-height: 28.8px; |
||||
color: #000000; |
||||
} |
||||
.top_box p{ |
||||
font-size: 16px; |
||||
font-weight: 300; |
||||
line-height: 19.2px; |
||||
color: #000000; |
||||
} |
||||
|
||||
.authors_block .authors_items{ |
||||
display: grid; |
||||
grid-template-columns: 31% 31% 31%; |
||||
gap: 20px; |
||||
} |
||||
.authors_items .authors_item{ |
||||
background: #FFFFFF; |
||||
border-radius: 8px; |
||||
} |
||||
.authors_item .item-img{ |
||||
border-radius: 8px; |
||||
object-fit: cover; |
||||
width: 100%; |
||||
height: 200px; |
||||
} |
||||
.authors_item .info_wrap{ |
||||
display: flex; |
||||
flex-direction: column; |
||||
gap: 25px; |
||||
padding: 25px 20px; |
||||
} |
||||
.authors_item .info{ |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
gap: 20px; |
||||
} |
||||
.authors_item .info_box{ |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 12px; |
||||
} |
||||
.authors_item .info span{ |
||||
font-size: 14px; |
||||
font-weight: 300; |
||||
line-height: 16.8px; |
||||
color: #777777; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 8px; |
||||
white-space: nowrap; |
||||
} |
||||
.authors_item h5{ |
||||
font-size: 16px; |
||||
font-weight: 600; |
||||
line-height: 19.2px; |
||||
color: #0F1521; |
||||
} |
||||
|
||||
.authors .items_block{ |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: center; |
||||
gap: 40px; |
||||
} |
||||
.items_block .item_pagination{ |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 24px; |
||||
} |
||||
.item_pagination .pagination_tab{ |
||||
background: #F3F3F3; |
||||
width: 70px; |
||||
height: 71px; |
||||
border-radius: 8px; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
border: none; |
||||
outline: none; |
||||
font-size: 16px; |
||||
font-weight: 400; |
||||
line-height: 19.2px; |
||||
color: #878A90; |
||||
cursor: pointer; |
||||
transition: .3s ease all; |
||||
} |
||||
.item_pagination .pagination_tab:hover, |
||||
.item_pagination .pagination_tab.active{ |
||||
background: linear-gradient(264.09deg, #88B23F 4.91%, #247238 91.1%); |
||||
color: #FFF; |
||||
font-weight: 600; |
||||
} |
||||
|
||||
|
||||
|
||||
/* @Media start */ |
||||
@media (max-width: 1024px) { |
||||
.authors_block .authors_items { |
||||
grid-template-columns: 49% 49%; |
||||
} |
||||
} |
||||
|
||||
@media (max-width: 768px) { |
||||
.banner .banner_block { |
||||
padding: 30px 20px; |
||||
display: block; |
||||
} |
||||
.banner .info_block { |
||||
padding: 0; |
||||
align-items: start; |
||||
flex-direction: column; |
||||
gap: 18px; |
||||
} |
||||
.banner_block .number1 { |
||||
display: none; |
||||
} |
||||
.banner_block .number-mob { |
||||
display: block; |
||||
} |
||||
.banner .info_block .info { |
||||
padding-right: 103px; |
||||
gap: 16px; |
||||
} |
||||
.banner_block .info p, |
||||
.banner_block .info h3 { |
||||
max-width: 100%; |
||||
} |
||||
|
||||
|
||||
.authors_block .authors_cards { |
||||
grid-template-columns: 48.5% 48.5%; |
||||
gap: 40px 20px; |
||||
} |
||||
|
||||
.authors_item .info { |
||||
gap: 15px; |
||||
} |
||||
.authors_item .info_wrap { |
||||
gap: 20px; |
||||
padding: 20px 15px; |
||||
} |
||||
.authors_block .authors_items { |
||||
grid-template-columns: 100%; |
||||
} |
||||
|
||||
} |
||||
|
||||
@media (max-width: 568px) { |
||||
.banner .banner_block { |
||||
border-radius: 4px; |
||||
} |
||||
.banner_block .info_btn { |
||||
width: 100%; |
||||
border-radius: 4px; |
||||
} |
||||
.banner_block .info p, |
||||
.banner_block .info h3 { |
||||
max-width: 250px; |
||||
} |
||||
|
||||
.authors_block .authors_cards { |
||||
grid-template-columns: 100%; |
||||
} |
||||
.authors_block .authors_card { |
||||
gap: 15px; |
||||
} |
||||
.authors_card img { |
||||
height: 400px; |
||||
} |
||||
.authors_card h3 { |
||||
font-size: 26px; |
||||
line-height: 26px; |
||||
} |
||||
|
||||
.authors_block .top_box{ |
||||
flex-direction: column; |
||||
} |
||||
.top_box img{ |
||||
height: 350px; |
||||
} |
||||
.top_box .info { |
||||
padding: 30px 30px 38px; |
||||
gap: 30px; |
||||
} |
||||
|
||||
.items_block .item_pagination { |
||||
gap: 15px; |
||||
} |
||||
.item_pagination .pagination_tab { |
||||
width: 50px; |
||||
height: 51px; |
||||
border-radius: 4px; |
||||
} |
||||
} |
||||
Loading…
Reference in new issue