Скрыть SVG рисунок при анимации
Пытаюсь создать анимацию в которой одно изображение скрываю, а второе показываю.
Получается так, что при скрытии, рисунок не отображается, но пространство, которое оно занимает остается.
Может кто подскажет, как скрыть изображение так, чтобы от него следов не оставалось, но без удаления, т.к анимация циклическая.
@font-face {
font-family: "SemiBold";
src: url("../../project/fonts/VictorMono-SemiBold.ttf") format("truetype");
}
@font-face {
font-family: "ExtraLightItalic";
src: url("../../project/fonts/VictorMono-ExtraLightItalic.ttf") format("truetype");
}
@font-face {
font-family: "architect";
src: url("../../project/font/architect.ttf") format("truetype");
}
.header {
display: flex;
flex-direction: row;
}
.header {
justify-content: space-between;
font-family: SemiBold;
align-items: center;
font-size: 20pt;
border-bottom: white 2px solid;
padding-bottom: 1%;
}
body {
background-color: black;
}
a {
text-decoration: none;
color: white;
}
.forMainText {
display: none;
text-align: center;
font-family: ExtraLightItalic;
margin-top: 5%;
color: white;
font-size: 20pt;
margin-bottom: -10%;
}
.forMainText2 {
display: none;
text-align: center;
font-family: ExtraLightItalic;
margin-top: 5%;
color: white;
font-size: 20pt;
margin-bottom: -41%;
}
.secBlock {
border-top: black 2px solid;
background-color: white;
}
.js-hidden {
display: none;
}
/*# sourceMappingURL=css.css.map */<html>
<head>
<title>Mint Fox</title>
<link rel="shortcut icon" href="../project/img/logo.png" type="image/x-icon">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="Keywords" content="HTML, META, метатег, тег, поисковая система">
<link rel="stylesheet" href = "../project/sass/css.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script type="text/javascript" src="../project/anime-master/lib/anime.min.js"></script>
<style type="text/css">
.str0 {stroke:#9D9E9E;stroke-width:12.13;stroke-miterlimit:22.9256}
.str1 {stroke:#B8161B;stroke-width:12.13;stroke-miterlimit:22.9256}
.fil0 {fill:none;}
.str8 {stroke:#6244B3;stroke-width:8.84;stroke-miterlimit:22.9256}
.str4 {stroke:#A293DD;stroke-width:8.84;stroke-miterlimit:22.9256}
.str5 {stroke:#A293DD;stroke-width:6.63;stroke-miterlimit:22.9256}
.str3 {stroke:#AEB1EE;stroke-width:6.63;stroke-miterlimit:22.9256}
.str6 {stroke:#2B2A29;stroke-width:14.36;stroke-miterlimit:22.9256}
.str2 {stroke:#2B2A29;stroke-width:12.15;stroke-miterlimit:22.9256}
.str7 {stroke:#403383;stroke-width:12.15;stroke-miterlimit:22.9256}
.fil1 {fill:none;}
</style>
</head>
<body>
<div class="container">
<div class="forheader">
<div class="header">
<a class="elemInHeader" href="../">
КОНТАКТЫ
</a>
<a class="elemInHeader" href="../">
О НАС
</a>
<div href="../">
<img src="../project/imgs/logo2.png" width="200" height="100">
</div>
<a class="elemInHeader" href="../">
СПЕКТАКЛИ
</a>
<a class="elemInHeader" href="../">
ТРУППА
</a>
</div>
<div class="partBeforeHeader">
<div class="forMainText" id="forMainText">
Особые форматы концертов классической<br> музыки для погружения <br> в незабываемые впечатления!
</div>
<div class="forMainText2">
Живой звук, известные шедевры классической музыки,<br> игра света и тени и мастерство музыкантов перенесут Вас в иное измерение,<br> где не существует привычных правил восприятия!
</div>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 6062.34 2321"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
<g id="Слой_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil0 str0" d="M278.34 2316.12c68.88,-51.02 88.58,-123.26 164.31,-224.09 72.27,-96.21 142.54,-195.63 217.26,-287.6 41.27,-50.79 193.55,-256.25 250.8,-260.13 27.67,-25.54 392.46,54 420.25,58.7 172.52,29.15 174.11,19.81 342.72,-8.67l33.65 -3.72c244.97,-25.69 145.86,-22.11 288.29,-105.79 44.62,-26.22 220.48,-119.65 224.67,-154.66 -48.28,-78.58 -244.05,63.69 -277.64,85.11 -121.89,77.75 -209.9,84.4 -368.19,58.67 -6.16,-21.57 -1.92,-1.93 5.11,-10.62 51.17,-34.86 102.7,-68.09 159.41,-102.64 107.34,-65.39 330.58,-396.89 273.79,-473.56 -80.86,-24.17 -171.76,145.36 -199.98,211.15 -43.39,101.15 -100.15,171.69 -225.51,201.77 -59.25,52.15 77.25,-100.18 98.58,-129.77 37.57,-52.12 73.58,-79.36 75.71,-149.04 1.53,-49.8 21.59,-387.11 3.94,-399.3 -81.43,-53.99 -115.13,236.09 -117.87,283.37 -7.36,127.25 -37.38,176.5 -142.3,278.8 -31.29,38.91 13.61,-120.56 -1.68,-162.28 -9.41,-25.68 -57.6,-80.48 -77.38,-105.63 -30.28,-38.49 -123.32,-200.13 -168.56,-199.9 -39.3,38.64 36.77,180.49 60.11,215.24 67.22,100.05 71.84,98.24 66.35,222.45l-13.84 37.11 -16.72 37.63c-289.94,14.52 -514.08,-173.65 -176.25,-136.17 59.33,6.59 190.88,0.36 143.61,-61.05 -30.56,-30.63 -205.9,-42 -271.48,-44.07 -98.6,-3.11 -168.81,51.75 -222.61,85.2 -88.22,54.85 -164.23,239.52 -239.01,328.93 -84.5,101.02 -176.28,207.89 -269.35,300.78 -45.76,45.67 -272.56,247.73 -315.67,270.86"/>
<path class="fil0 str0" d="M6050.46 4.97c-66.59,46.61 -835.93,572.72 -912.59,669.89 -83.47,105.8 -353.01,472.13 -443.45,511.7l-61.77 -21.01c-62.6,-21.58 -75.19,-34.99 -156.87,-20.62l-307.58 144.71c36.94,83.16 211.7,-7.54 280.11,-41.54l137.52 19.69c27.28,9.26 64.51,25.03 72.75,49.71 -148.46,40.83 -159.77,112.5 -230.67,219.13 -34.04,51.19 -215.93,202.98 -205.12,241.95 87.46,36.51 203.53,-100.26 242.31,-141.11 117.84,-124.09 77.77,-189.77 195.06,-200.57 20.03,-10.07 14.72,-7.26 33.74,-5.58 -17.66,37.16 -90.74,95.35 -120.05,156.21 -63.73,132.34 -94.12,247.64 -170.72,384.21 -25.54,45.54 -84.35,97.1 -42.04,134.61 114.79,20.01 210.55,-246.37 236.92,-312.55 26.92,-70.87 51.59,-140.9 77.52,-212.1 13.86,-38.05 135.33,-126.88 190.94,-136.19 -5.57,51.59 -141.23,199.06 -158.88,360.59 -2.16,20.32 -76.15,249.66 -120,299.88 -9.4,21.2 -16.71,30.98 8.37,43.84 61.04,34.16 158.2,-195.05 175.38,-273.25 8.96,-40.78 28.58,-172.54 47.44,-199.94 34.28,-49.81 225.71,-263.83 270.15,-266.98l-10.31 104.84 -4.83 160.3c-5.07,36.39 -3.5,82.95 43.11,87.04 51.46,-23.53 26.63,-253.48 40.73,-318.74 9.43,-43.64 48.07,-82.33 65.99,-122.93 40.14,-90.92 14.97,-288.93 136.35,-422.03 30.71,-33.68 674.08,-356.38 699.75,-368.53"/>
<path class="fil0 str1" d="M1675.81 1598.79c-3.92,72.72 -79.6,256.66 -48.45,330.31 26.51,62.71 67.03,-24.56 69.14,-27.33 12.27,-16.11 14.67,-326.79 -20.68,-302.98z"/>
<path class="fil0 str1" d="M1687.83 1605.24c-0.22,4.07 14.84,248.78 15,249.16 26.51,62.71 86.47,5.57 87.35,-22.26 0.34,-10.68 -67,-250.71 -102.35,-226.9z"/>
<path class="fil0 str1" d="M1699.89 1487.31c-20.64,12.05 -26.39,98.52 -20.51,105.71l-5.69 1.32"/>
<path class="fil0 str1" d="M1679.37 1593.02c44.95,76.34 789.88,167.1 1031.46,154.83 557.87,-28.35 1508.91,-209.61 1743.74,-400.24 12.29,-9.97 74.27,-48.67 111.29,-82.66 0.97,-0.89 30.55,-24.2 41.95,-50.11 8.65,-19.67 10.98,-55.89 10.81,-60.39"/>
<path class="fil0 str1" d="M4584.75 1145.27c-48.69,-18.96 -55.27,-253.6 -6.63,-248.22 22.14,2.45 33.79,42.67 41.24,113.57 11.14,106.06 -11.45,153.07 -2.6,141.24 8.82,-11.79 -8.5,2.56 -32.01,-6.59z"/>
<path class="fil0 str1" d="M4618.62 1154.45c-5.37,0.36 61.53,-176.82 71.58,-189.15 7.67,-9.42 41.94,-55 50.37,-23.74 18.31,67.87 -47.55,158.57 -110.16,203.64 -4.52,3.26 -9.57,9.1 -11.79,9.25z"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 4313.62 1359.61"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
<g id="Слой_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil1 str7" d="M7.96 806.14c233.56,82.58 481.58,46.83 663.48,114.62 57.26,21.34 85.22,-20.57 213.68,58.22 8.76,5.37 817.01,115.49 916.2,162.3 17.89,8.44 117.09,21.35 139.12,27.45"/>
<path class="fil1 str8" d="M1142.83 988.41c137.89,-23.4 102.38,-19.86 241.68,-30.69 407.54,-31.69 624.9,-123.75 1067.98,-134.4 54.56,-1.31 346.35,-28.36 380.38,-42.69 74.83,-31.51 284.66,-17.98 382.77,-24.29 111.27,-7.16 412.25,-43.18 483.77,-84.79 111.48,-64.86 302.3,-83.98 461.54,-49.61 3.59,0.77 84.53,3.72 97.37,-4.29l52.96 -33.05"/>
<path class="fil1 str2" d="M1577.12 1296.55c111.26,-91.52 151.93,13.89 246.42,-65.76 136.54,0 145.06,-49.02 175.14,-43.57 5.63,14.24 50.34,-12.65 104.24,-7.95 38.53,3.36 87.59,-53.7 137.86,-33.71 0.54,0.21 148.2,-23.8 162.48,-23.19 19.44,0.84 111.95,-30.95 112.82,-25.76 3.87,23.26 118.79,-25.47 138.28,-31.36 62.06,18.73 137.01,-40.14 182.17,-43.13 9.22,-0.61 342.03,-82.76 369.26,-92.3 5.35,-1.87 117.25,-17.29 191.59,-42.77 53.13,-18.21 174.89,-16.56 237.17,-22.08 33.61,-2.98 49.97,-20.39 57.82,-20.39 0,29.84 110.76,-35.21 144.05,-28.34 6.99,-2.39 235.07,-88.33 221.14,-64.85 30.66,12.52 69.62,-37.03 134.62,-26.2 24.86,4.14 66.75,-29.7 83.28,-13.1 14.94,14.99 24.31,-6.15 33.2,3.24"/>
<path class="fil1 str3" d="M4311.28 297.99c-68.05,57.49 -12.96,-237.49 -152.78,-195.28 -29.85,-6.46 17.25,-36.86 -89.89,-3.68 -44.73,13.85 -79.67,-126.03 -128.43,-87.15 -1.27,-0.18 -66.12,-31.66 -223.81,27.11 -78,29.07 -93.69,122.1 -220.74,169.45 -0.59,0.22 -84.4,-2.93 -164.87,35.04 -89.54,42.25 -64.25,27.07 -157.55,51.3 -2.18,0.57 -69.39,57.74 -173.59,53.44 8.21,54.35 -294.88,94.97 -310.38,55.18 -8.57,-22 -83.14,48.4 -172.74,64.63 -66.28,12 -233.71,56.02 -274.03,80.75 -24.85,15.24 -171.73,17.36 -247.87,38.64 -116.28,32.51 -147.62,-7.07 -280.64,21.64 -21.49,4.64 -253.36,-32.69 -266.48,-35.21 -106.45,-20.45 -226.09,95.36 -300.99,67.45 -25.35,-9.45 -123.24,24.05 -111.98,7.07"/>
<path class="fil1 str4" d="M21.5 743.67c33.74,-21.75 67.39,-35.62 116.92,-46.65 38.67,-8.61 84.64,3.63 172.34,28.4 34.74,9.81 -5.26,23.98 147.7,20.83 78.89,-1.63 176.38,120.42 280.64,115.93 7.14,-0.31 25.6,3.82 24.62,10.3"/>
<path class="fil1 str5" d="M236.9 681.84c196.91,-33.2 190.23,24.62 408.65,-22.52 66.48,-14.35 100.48,29.08 178.51,0 0.17,-0.07 54,0.51 52.89,1.91"/>
<path class="fil1 str6" d="M2885.75 1284.25c128.07,-129.25 601.79,-184.48 861.62,-228.2 57.3,-9.64 171.21,1.16 257.29,-30.91 3,-1.12 132.76,7.3 161.21,-39.3 44.86,-73.5 36.6,-47.65 68.14,-14.29 8.4,8.88 46.7,11.22 62.5,19.44"/>
<path class="fil1 str3" d="M0.65 416.49c90.06,17.86 110.4,5.89 211.64,-7.73 80.48,-10.83 76.25,-19.36 172.32,-25.54 32.77,-2.11 180.8,-99.12 354.49,-95.54 62.66,1.29 -17.72,41.51 83.7,21.27 14.7,-2.93 5.8,34.15 132.51,-9.28 28.59,-9.8 200.9,-32.66 231.83,19.14 16.63,27.86 147.65,39.21 228.17,81.33 53.94,28.23 46.98,-28.79 165.29,20.83 11.46,4.81 219.95,-32.83 305.68,-32.83 53.17,0 242.46,-40.95 300.34,-53.44 11.97,-2.58 200.37,-11.19 256.02,-21.27 90.31,-16.36 -28.18,54.06 98.47,56.68 73.84,1.52 -2.51,-6.19 42.62,21.49 0.35,0.22 37.4,11.51 41.08,9.42"/>
</g>
</svg>
</div>
<div class="secBlock">
ujdyfhkl;
</div>
</div>
</div>
<script>
anim();
setInterval(anim, 30000);
function sayHi() {
$('.fil0').fadeOut(10);
$('.fil1').fadeIn(10);
$('.forMainText2').fadeIn(10000);
anime({
targets: '.fil1',
strokeDashoffset: [anime.setDashoffset, 0],
easing: 'easeInOutSine',
duration: 4500,
delay: function(el, i) { return i * 250 },
direction: 'alternate',
});
$('.forMainText2').fadeOut(3000);
}
function anim(){
$('.fil1').fadeOut(10);
$('.forMainText').fadeIn(10000);
$('.fil0').fadeIn(10);
anime({
targets: '.fil0',
strokeDashoffset: [anime.setDashoffset, 0],
easing: 'easeInOutSine',
duration: 4500,
delay: function(el, i) { return i * 250 },
direction: 'alternate',
});
$('.forMainText').fadeOut(3000);
setTimeout(sayHi, 15000);
}
</script>
</body>
</html>Ответы (1 шт):
Автор решения: Vasily
→ Ссылка
Что бы скрыть любой элемент, в том числе SVG графику или какую либо его часть, Вам достаточно указать это напрямую через атрибут style, внутри тега style, или же в Вашем CSS файле:
// скрыть полностью
svg {
display: none;
}
Если Вы испытываете сложности с тем как применить вышеописанное в Вашем скрипте, то:
$("svg").hide() // jQuery
document.querySelector("svg").style.display = "none" // JS
предварительно убедившись в том что Вы обращаетесь к правильному элементу.
TLTR: Лишнее место внизу страницы появляется из за того что второй SVG элемент не скрыт целиком со страницы. Общее решение см. выше, решени в контексте Вашего кода см. ниже.
У Вас использована сторонняя библиотека по относительному пути, я ее временно отключил что бы мой пример работал корректно.
Поскольку это ваша анимация и Вам виднее что и когда должно происходить я реализовал только грубый набросок.
Механика:
Тот SVG который Вам пока не нужен Вы скрываете заранее (например прямо в стилях) и далее, перед тем он понадобиться (перед fadeIn) вы делаете его видимым. После того как цикл смениться и он опять становится ненужным снова делаете его невидимым (после fadeOut).
function sayHi() {
$(".svg2").show()
$(".fil0").fadeOut(10)
$(".fil1").fadeIn(10)
$(".forMainText2").fadeIn(10000)
$(".forMainText2").fadeOut(3000, function() {
$(".svg2").hide()
})
}
function anim() {
$(".fil1").fadeOut(10)
$(".forMainText").fadeIn(10000)
$(".fil0").fadeIn(10)
$(".forMainText").fadeOut(3000)
setTimeout(sayHi, 15000)
}
anim()
setInterval(anim, 30000).str0 {
stroke: #9D9E9E;
stroke-width: 12.13;
stroke-miterlimit: 22.9256
}
.str1 {
stroke: #B8161B;
stroke-width: 12.13;
stroke-miterlimit: 22.9256
}
.svg2 {
display: none;
}
.fil0 {
fill: none;
}
.str8 {
stroke: #6244B3;
stroke-width: 8.84;
stroke-miterlimit: 22.9256
}
.str4 {
stroke: #A293DD;
stroke-width: 8.84;
stroke-miterlimit: 22.9256
}
.str5 {
stroke: #A293DD;
stroke-width: 6.63;
stroke-miterlimit: 22.9256
}
.str3 {
stroke: #AEB1EE;
stroke-width: 6.63;
stroke-miterlimit: 22.9256
}
.str6 {
stroke: #2B2A29;
stroke-width: 14.36;
stroke-miterlimit: 22.9256
}
.str2 {
stroke: #2B2A29;
stroke-width: 12.15;
stroke-miterlimit: 22.9256
}
.str7 {
stroke: #403383;
stroke-width: 12.15;
stroke-miterlimit: 22.9256
}
.fil1 {
fill: none;
}
@font-face {
font-family: "SemiBold";
src: url("../../project/fonts/VictorMono-SemiBold.ttf") format("truetype");
}
@font-face {
font-family: "ExtraLightItalic";
src: url("../../project/fonts/VictorMono-ExtraLightItalic.ttf") format("truetype");
}
@font-face {
font-family: "architect";
src: url("../../project/font/architect.ttf") format("truetype");
}
.header {
display: flex;
flex-direction: row;
}
.header {
justify-content: space-between;
font-family: SemiBold;
align-items: center;
font-size: 20pt;
border-bottom: white 2px solid;
padding-bottom: 1%;
}
body {
background-color: black;
}
a {
text-decoration: none;
color: white;
}
.forMainText {
display: none;
text-align: center;
font-family: ExtraLightItalic;
margin-top: 5%;
color: white;
font-size: 20pt;
margin-bottom: -10%;
}
.forMainText2 {
display: none;
text-align: center;
font-family: ExtraLightItalic;
margin-top: 5%;
color: white;
font-size: 20pt;
margin-bottom: -41%;
}
.secBlock {
border-top: black 2px solid;
background-color: white;
}
.js-hidden {
display: none;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
<div class="forheader">
<div class="header">
<a class="elemInHeader" href="../">
КОНТАКТЫ
</a>
<a class="elemInHeader" href="../">
О НАС
</a>
<div href="../">
<img src="../project/imgs/logo2.png" width="200" height="100">
</div>
<a class="elemInHeader" href="../">
СПЕКТАКЛИ
</a>
<a class="elemInHeader" href="../">
ТРУППА
</a>
</div>
<div class="partBeforeHeader">
<div class="forMainText" id="forMainText">
Особые форматы концертов классической<br> музыки для погружения <br> в незабываемые впечатления!
</div>
<div class="forMainText2">
Живой звук, известные шедевры классической музыки,<br> игра света и тени и мастерство музыкантов перенесут Вас в иное измерение,<br> где не существует привычных правил восприятия!
</div>
<svg class="svg1" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" viewBox="0 0 6062.34 2321"
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
<g id="Слой_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil0 str0" d="M278.34 2316.12c68.88,-51.02 88.58,-123.26 164.31,-224.09 72.27,-96.21 142.54,-195.63 217.26,-287.6 41.27,-50.79 193.55,-256.25 250.8,-260.13 27.67,-25.54 392.46,54 420.25,58.7 172.52,29.15 174.11,19.81 342.72,-8.67l33.65 -3.72c244.97,-25.69 145.86,-22.11 288.29,-105.79 44.62,-26.22 220.48,-119.65 224.67,-154.66 -48.28,-78.58 -244.05,63.69 -277.64,85.11 -121.89,77.75 -209.9,84.4 -368.19,58.67 -6.16,-21.57 -1.92,-1.93 5.11,-10.62 51.17,-34.86 102.7,-68.09 159.41,-102.64 107.34,-65.39 330.58,-396.89 273.79,-473.56 -80.86,-24.17 -171.76,145.36 -199.98,211.15 -43.39,101.15 -100.15,171.69 -225.51,201.77 -59.25,52.15 77.25,-100.18 98.58,-129.77 37.57,-52.12 73.58,-79.36 75.71,-149.04 1.53,-49.8 21.59,-387.11 3.94,-399.3 -81.43,-53.99 -115.13,236.09 -117.87,283.37 -7.36,127.25 -37.38,176.5 -142.3,278.8 -31.29,38.91 13.61,-120.56 -1.68,-162.28 -9.41,-25.68 -57.6,-80.48 -77.38,-105.63 -30.28,-38.49 -123.32,-200.13 -168.56,-199.9 -39.3,38.64 36.77,180.49 60.11,215.24 67.22,100.05 71.84,98.24 66.35,222.45l-13.84 37.11 -16.72 37.63c-289.94,14.52 -514.08,-173.65 -176.25,-136.17 59.33,6.59 190.88,0.36 143.61,-61.05 -30.56,-30.63 -205.9,-42 -271.48,-44.07 -98.6,-3.11 -168.81,51.75 -222.61,85.2 -88.22,54.85 -164.23,239.52 -239.01,328.93 -84.5,101.02 -176.28,207.89 -269.35,300.78 -45.76,45.67 -272.56,247.73 -315.67,270.86"/>
<path class="fil0 str0" d="M6050.46 4.97c-66.59,46.61 -835.93,572.72 -912.59,669.89 -83.47,105.8 -353.01,472.13 -443.45,511.7l-61.77 -21.01c-62.6,-21.58 -75.19,-34.99 -156.87,-20.62l-307.58 144.71c36.94,83.16 211.7,-7.54 280.11,-41.54l137.52 19.69c27.28,9.26 64.51,25.03 72.75,49.71 -148.46,40.83 -159.77,112.5 -230.67,219.13 -34.04,51.19 -215.93,202.98 -205.12,241.95 87.46,36.51 203.53,-100.26 242.31,-141.11 117.84,-124.09 77.77,-189.77 195.06,-200.57 20.03,-10.07 14.72,-7.26 33.74,-5.58 -17.66,37.16 -90.74,95.35 -120.05,156.21 -63.73,132.34 -94.12,247.64 -170.72,384.21 -25.54,45.54 -84.35,97.1 -42.04,134.61 114.79,20.01 210.55,-246.37 236.92,-312.55 26.92,-70.87 51.59,-140.9 77.52,-212.1 13.86,-38.05 135.33,-126.88 190.94,-136.19 -5.57,51.59 -141.23,199.06 -158.88,360.59 -2.16,20.32 -76.15,249.66 -120,299.88 -9.4,21.2 -16.71,30.98 8.37,43.84 61.04,34.16 158.2,-195.05 175.38,-273.25 8.96,-40.78 28.58,-172.54 47.44,-199.94 34.28,-49.81 225.71,-263.83 270.15,-266.98l-10.31 104.84 -4.83 160.3c-5.07,36.39 -3.5,82.95 43.11,87.04 51.46,-23.53 26.63,-253.48 40.73,-318.74 9.43,-43.64 48.07,-82.33 65.99,-122.93 40.14,-90.92 14.97,-288.93 136.35,-422.03 30.71,-33.68 674.08,-356.38 699.75,-368.53"/>
<path class="fil0 str1" d="M1675.81 1598.79c-3.92,72.72 -79.6,256.66 -48.45,330.31 26.51,62.71 67.03,-24.56 69.14,-27.33 12.27,-16.11 14.67,-326.79 -20.68,-302.98z"/>
<path class="fil0 str1" d="M1687.83 1605.24c-0.22,4.07 14.84,248.78 15,249.16 26.51,62.71 86.47,5.57 87.35,-22.26 0.34,-10.68 -67,-250.71 -102.35,-226.9z"/>
<path class="fil0 str1" d="M1699.89 1487.31c-20.64,12.05 -26.39,98.52 -20.51,105.71l-5.69 1.32"/>
<path class="fil0 str1" d="M1679.37 1593.02c44.95,76.34 789.88,167.1 1031.46,154.83 557.87,-28.35 1508.91,-209.61 1743.74,-400.24 12.29,-9.97 74.27,-48.67 111.29,-82.66 0.97,-0.89 30.55,-24.2 41.95,-50.11 8.65,-19.67 10.98,-55.89 10.81,-60.39"/>
<path class="fil0 str1" d="M4584.75 1145.27c-48.69,-18.96 -55.27,-253.6 -6.63,-248.22 22.14,2.45 33.79,42.67 41.24,113.57 11.14,106.06 -11.45,153.07 -2.6,141.24 8.82,-11.79 -8.5,2.56 -32.01,-6.59z"/>
<path class="fil0 str1" d="M4618.62 1154.45c-5.37,0.36 61.53,-176.82 71.58,-189.15 7.67,-9.42 41.94,-55 50.37,-23.74 18.31,67.87 -47.55,158.57 -110.16,203.64 -4.52,3.26 -9.57,9.1 -11.79,9.25z"/>
</g>
</svg>
<svg class="svg2" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" viewBox="0 0 4313.62 1359.61"
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
<g id="Слой_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="fil1 str7" d="M7.96 806.14c233.56,82.58 481.58,46.83 663.48,114.62 57.26,21.34 85.22,-20.57 213.68,58.22 8.76,5.37 817.01,115.49 916.2,162.3 17.89,8.44 117.09,21.35 139.12,27.45"/>
<path class="fil1 str8" d="M1142.83 988.41c137.89,-23.4 102.38,-19.86 241.68,-30.69 407.54,-31.69 624.9,-123.75 1067.98,-134.4 54.56,-1.31 346.35,-28.36 380.38,-42.69 74.83,-31.51 284.66,-17.98 382.77,-24.29 111.27,-7.16 412.25,-43.18 483.77,-84.79 111.48,-64.86 302.3,-83.98 461.54,-49.61 3.59,0.77 84.53,3.72 97.37,-4.29l52.96 -33.05"/>
<path class="fil1 str2" d="M1577.12 1296.55c111.26,-91.52 151.93,13.89 246.42,-65.76 136.54,0 145.06,-49.02 175.14,-43.57 5.63,14.24 50.34,-12.65 104.24,-7.95 38.53,3.36 87.59,-53.7 137.86,-33.71 0.54,0.21 148.2,-23.8 162.48,-23.19 19.44,0.84 111.95,-30.95 112.82,-25.76 3.87,23.26 118.79,-25.47 138.28,-31.36 62.06,18.73 137.01,-40.14 182.17,-43.13 9.22,-0.61 342.03,-82.76 369.26,-92.3 5.35,-1.87 117.25,-17.29 191.59,-42.77 53.13,-18.21 174.89,-16.56 237.17,-22.08 33.61,-2.98 49.97,-20.39 57.82,-20.39 0,29.84 110.76,-35.21 144.05,-28.34 6.99,-2.39 235.07,-88.33 221.14,-64.85 30.66,12.52 69.62,-37.03 134.62,-26.2 24.86,4.14 66.75,-29.7 83.28,-13.1 14.94,14.99 24.31,-6.15 33.2,3.24"/>
<path class="fil1 str3" d="M4311.28 297.99c-68.05,57.49 -12.96,-237.49 -152.78,-195.28 -29.85,-6.46 17.25,-36.86 -89.89,-3.68 -44.73,13.85 -79.67,-126.03 -128.43,-87.15 -1.27,-0.18 -66.12,-31.66 -223.81,27.11 -78,29.07 -93.69,122.1 -220.74,169.45 -0.59,0.22 -84.4,-2.93 -164.87,35.04 -89.54,42.25 -64.25,27.07 -157.55,51.3 -2.18,0.57 -69.39,57.74 -173.59,53.44 8.21,54.35 -294.88,94.97 -310.38,55.18 -8.57,-22 -83.14,48.4 -172.74,64.63 -66.28,12 -233.71,56.02 -274.03,80.75 -24.85,15.24 -171.73,17.36 -247.87,38.64 -116.28,32.51 -147.62,-7.07 -280.64,21.64 -21.49,4.64 -253.36,-32.69 -266.48,-35.21 -106.45,-20.45 -226.09,95.36 -300.99,67.45 -25.35,-9.45 -123.24,24.05 -111.98,7.07"/>
<path class="fil1 str4" d="M21.5 743.67c33.74,-21.75 67.39,-35.62 116.92,-46.65 38.67,-8.61 84.64,3.63 172.34,28.4 34.74,9.81 -5.26,23.98 147.7,20.83 78.89,-1.63 176.38,120.42 280.64,115.93 7.14,-0.31 25.6,3.82 24.62,10.3"/>
<path class="fil1 str5" d="M236.9 681.84c196.91,-33.2 190.23,24.62 408.65,-22.52 66.48,-14.35 100.48,29.08 178.51,0 0.17,-0.07 54,0.51 52.89,1.91"/>
<path class="fil1 str6" d="M2885.75 1284.25c128.07,-129.25 601.79,-184.48 861.62,-228.2 57.3,-9.64 171.21,1.16 257.29,-30.91 3,-1.12 132.76,7.3 161.21,-39.3 44.86,-73.5 36.6,-47.65 68.14,-14.29 8.4,8.88 46.7,11.22 62.5,19.44"/>
<path class="fil1 str3" d="M0.65 416.49c90.06,17.86 110.4,5.89 211.64,-7.73 80.48,-10.83 76.25,-19.36 172.32,-25.54 32.77,-2.11 180.8,-99.12 354.49,-95.54 62.66,1.29 -17.72,41.51 83.7,21.27 14.7,-2.93 5.8,34.15 132.51,-9.28 28.59,-9.8 200.9,-32.66 231.83,19.14 16.63,27.86 147.65,39.21 228.17,81.33 53.94,28.23 46.98,-28.79 165.29,20.83 11.46,4.81 219.95,-32.83 305.68,-32.83 53.17,0 242.46,-40.95 300.34,-53.44 11.97,-2.58 200.37,-11.19 256.02,-21.27 90.31,-16.36 -28.18,54.06 98.47,56.68 73.84,1.52 -2.51,-6.19 42.62,21.49 0.35,0.22 37.4,11.51 41.08,9.42"/>
</g>
</svg>
</div>
<div class="secBlock">
</div>
</div>
</div>