/*------------------------------------------------------------------
Project:		KNAUF 2022
Version:		2.0
Assigned to:	RECO s.r.o. 
Author: 		Lukáš Knotek
-------------------------------------------------------------------*/
:root {
    --white: #ffffff;
    --main-red: #f15b40;
    --main-blue: #0072bc;
    --light-blue:  #44c8f5;
    --main-green: #5a9e62;
    --main-yellow: #FDB813;
    --main-dark: #2f3032;
    --light-gray:  #F0F0F0;
}

/* Reset */
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

/* Slick */
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:after,.slick-track:before{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}

@font-face {
    font-family: 'Manufaktur';
    src: url('../fonts/Manufaktur-Bold.woff2') format('woff2'),
        url('../fonts/Manufaktur-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PP Gosha Sans';
    src: url('../fonts/PPGoshaSans-Regular.woff2') format('woff2'),
        url('../fonts/PPGoshaSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PP Gosha Sans';
    src: url('../fonts/PPGoshaSans-Bold.woff2') format('woff2'),
        url('../fonts/PPGoshaSans-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


* {
	box-sizing: border-box;
}

.text-left {
	text-align: left !important;
}

.text-center {
	text-align: center !important;
}

.text-right {
	text-align: right !important;
}

/* Grid */
.container {
	max-width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-right: auto;
    margin-left: auto;
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -8px;
    margin-left: -8px;
}

.row.no-gutters {
	margin-left: 0px;
	margin-right: 0px;
}

.column {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
	padding-left: 8px;
	padding-right: 8px;
}

.row.no-gutters .column {
	padding-left: 0px;
	padding-right: 0px;
}

.column DIV {
	/*height: 100px;
	background: blue;
	margin-bottom: 16px;*/
}

.offset-small-12 {
	margin-left: 100%;
}

.offset-small-11 {
	margin-left: 91.6666666667%;
}

.offset-small-10 {
	margin-left: 83.3333333333%;
}

.offset-small-9 {
	margin-left: 75%;
}

.offset-small-8 {
	margin-left: 66.6666666667%;
}

.offset-small-7 {
	margin-left: 58.3333333333%;
}

.offset-small-6 {
	margin-left: 50%;
}

.offset-small-5 {
	margin-left: 41.6666666667%;
}

.offset-small-4 {
	margin-left: 33.33333333%;
}

.offset-small-3 {
	margin-left: 25%;
}

.offset-small-2 {
	margin-left: 16.6666666667%;
}

.offset-small-1 {
	margin-left: 8.3333333333%;
}

.small-1, .medium-1, .large-1, .small-2, .medium-2, .large-2, .small-3, .medium-3, .large-3, .small-4, .medium-4, .large-4, .small-5, .medium-5, .large-5, .small-6, .medium-6, .large-6,
.small-8, .medium-8, .large-8, .small-9, .medium-9, .large-9, .small-10, .medium-10, .large-10, .small-11, .medium-11, .large-11, .small-12, .medium-12, .large-12 {
	flex: 0 0 100%;
	width: 100%;
}

.small-12 {
	flex: 0 0 100%;
	width: 100%;
}

.small-11 {
	flex: 0 0 91.6666666667%;
	width: 91.6666666667%;
}

.small-10 {
	flex: 0 0 83.3333333333%;
	width: 83.3333333333%;
}

.small-9 {
	flex: 0 0 75%;
	width: 75%;
}

.small-8 {
	flex: 0 0 66.6666666667%;
	width: 66.6666666667%;
}

.small-7 {
	flex: 0 0 58.3333333333%;
	width: 58.3333333333%;
}

.small-6 {
	flex: 0 0 50%;
	width: 50%;
}

.small-5 {
	flex: 0 0 41.6666666667%;
	width: 41.6666666667%;
}

.small-4 {
	flex: 0 0 33.33333333%;
	width: 33.33333333%;
}

.small-3 {
	flex: 0 0 25%;
	width: 25%;
}

.small-2 {
	flex: 0 0 16.6666666667%;
	width: 16.6666666667%;
}

.small-1 {
	flex: 0 0 8.3333333333%;
	width: 8.3333333333%;
}

.position-relative {
	position: relative !important;
}

.position-absolute {
	position: absolute !important;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

HTML {
    font-size: 16px;
	padding: 0px;
	margin: 0px !important;
}
	
BODY {
	font-family: "PP Gosha Sans";
	font-size: 16px;
	padding: 0px;
	padding-top: 122px;
	margin: 0px;
	background: #000;
}

IFRAME {
	display: block;
	padding: 0px;
	margin: 0px;
}

A {
	color: #fff;
	text-decoration: none;
}

A, .button, BUTTON {
	text-decoration: none !important;
	outline: none !important;
    -webkit-transition: all 0.3s cubic-bezier(.29,.48,.72,.99);
    -moz-transition: all 0.3s cubic-bezier(.29,.48,.72,.99);
    -ms-transition: all 0.3s cubic-bezier(.29,.48,.72,.99);
    -o-transition: all 0.3s cubic-bezier(.29,.48,.72,.99);	
}

A:hover, A.active {
	color: #171cff;
}

HEADER {
	position: fixed;
	left: 0px;
	top: 0px;
	display: block;
	width: 100%;
	height: auto;
	padding-top: 35px;
	padding-bottom: 35px;
	background: #000;
	z-index: 1000;
}

HEADER NAV {
	
}

HEADER NAV UL {
	text-align: right;
	padding: 0px;
	margin: 0px;
	list-style-type: none;
}

HEADER NAV UL LI {
	display: inline-block;
	margin-left: 77px;
}

HEADER NAV UL LI A {
	font-family: "PP Gosha Sans";
	font-size: 20px;
	font-weight: 700;
	font-style: normal;
	letter-spacing: normal;
	line-height: 50px;
	text-align: center;
	/* Text style for "c, ontact" */
	font-style: normal;
	letter-spacing: 2.02px;
	color: #fff;
}

.hamburger {
	display: none;
}

ARTICLE {

}

H1, H2, H3, H4, H5, H6, P {
	margin: 0px;
}

H2 {
	position: relative;
	font-family: "PP Gosha Sans";
	font-size: 57px;
	font-weight: 700;
	font-style: normal;
	letter-spacing: normal;
	line-height: 61.42px;
	letter-spacing: 1.24px;
	color: #fff;
	text-align: center;
	padding-top: 31px;
	padding-bottom: 65px;
}

P {
	font-family: "PP Gosha Sans";
	font-size: 27px;
	font-weight: 400;
	font-style: normal;
	letter-spacing: normal;
	line-height: 40px;
	letter-spacing: 1.74px;
	color: #fff;
	text-align: center;
	padding-bottom: 52px;
}

SECTION.main-slider-section {
	position: relative;
	width: 100%;
	height: calc(100vh - 122px);
	text-align: center;
	/*-webkit-animation: zoomin 10s ease-in;
	animation: zoomin 10s ease-in;
	transition: all .5s ease-in-out;*/
	-webkit-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -moz-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -ms-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -o-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
	overflow: hidden;
}

SECTION.main-slider-section.scrolled {
	opacity: 0;
}

SECTION.main-slider-section .bg {
	position: absolute;
	left: 0px;
	top: 0px;
	display: block;
	width: 100%;
	height: 100%;
	background-image: url('../images/mannschaft-team3.jpg');
	background-repeat: no-repeat;
	background-size: 125% auto;
	background-position: center center;
	background-attachment: fixed;
	opacity: 0;
	-webkit-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -moz-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -ms-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -o-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
}

SECTION.main-slider-section .bg.loaded {
	background-size: 135% auto;
	opacity: 1;
}

/*
@-webkit-keyframes zoomin {
  0% {transform: scale(1);}
  50% {transform: scale(1.5);}
  100% {transform: scale(1);}
}
@keyframes zoomin {
  0% {transform: scale(1);}
  50% {transform: scale(1.5);}
  100% {transform: scale(1);}
}


@-webkit-keyframes zoomout {
  0% {transform: scale(1);}
  50% {transform: scale(0.67);}
  100% {transform: scale(1);}
}
@keyframes zoomout {
    0% {transform: scale(1);}
  50% {transform: scale(0.67);}
  100% {transform: scale(1);}
}
*/

SECTION.main-slider-section .social {
	position: absolute;
	right: -230px;
	top: 50%;
	-webkit-transform: rotate(-270deg);
}

SECTION.main-slider-section .social LI {
	display: inline-block;
	margin-left: 0px;
	margin-right: 73px;
}

SECTION.main-slider-section .social LI A {
	font-family: "PP Gosha Sans";
	font-size: 20px;
	font-weight: 700;
	font-style: normal;
	letter-spacing: normal;
	line-height: 69.65px;
	letter-spacing: 2.02px;
	color: #fff;
	text-align: center;
}

SECTION.main-slider-section .social LI A:hover {
	color: #171cff;
}

.slider-maintext-textil {
	position: absolute;
	left: 50%;
	bottom: 270px;
	transform: translateX(-50%);
	max-width: 1009px;
	font-family: "PP Gosha Sans";
	font-size: 50px;
	font-weight: 700;
	font-style: normal;
	letter-spacing: normal;
	line-height: 1.1;
	/*letter-spacing: 1.24px;*/
	color: #fff;
	text-align: center;
	text-transform: uppercase;
	margin: 0 auto;
	opacity: 0;
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-ms-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	z-index: 100;
}

SECTION.main-slider-section H1 {
	font-family: "PP Gosha Sans";
	font-size: 50px;
	font-weight: 700;
	font-style: normal;
	letter-spacing: normal;
	line-height: 1.1;
	letter-spacing: 0px;
	color: #fff;
	text-align: center;
	text-transform: uppercase;

}

SECTION.main-slider-section .slider-maintext-textil.loaded {
	opacity: 1;
}

SECTION.main-slider-section .get-in-touch {
	position: absolute;
	left: 50%;
	bottom: 70px;
	transform: translateX(-50%);
	z-index: 100;
}

SECTION.about-section H2 {
	position: relative;
}

SECTION.about-section H2 SPAN {
	position: relative;
	z-index: 11;
}

SECTION.about-section H2 #hello_wrapper {
	position: absolute;
	left: calc(50% + 35px);
	top: -35px;
	display: block;
	z-index: 10;
}

SECTION.main-slider-section H3 {
	font-family: "PP Gosha Sans";
	font-size: 20px;
	font-weight: 700;
	font-style: normal;
	letter-spacing: normal;
	line-height: 37px;
	letter-spacing: 1.24px;
	color: #fff;
	text-align: center;
	padding: 0px;
	margin: 0px;
}

SECTION.about-section H3 {
	position: relative;
	font-family: "PP Gosha Sans";
	font-size: 40px;
	font-weight: 400;
	font-style: normal;
	letter-spacing: normal;
	line-height: 71.87px;
	letter-spacing: 1.61px;
	color: #fff;
	text-align: center;
	padding-top: 36px;
	cursor: pointer;
}

SECTION.about-section H3 IMG {
	display: inline-block;
	margin-right: 15px;
	filter: brightness(0) invert(1);
}

SECTION.about-section P {
	max-width: 800px;
	margin: 0 auto;
}

SECTION.about-section .images {
	padding-bottom: 117px;
}

SECTION.about-section .images IMG {
	display: inline-block;
	margin-left: 10px;
	margin-right: 10px;
}

SECTION.work-section {
	padding-top: 0px;
	padding-bottom: 100px;
}

SECTION.work-section .image {
	position: relative;
	display: block;
	height: 535px;
	height: 49.537vh;
	overflow: hidden;
}

SECTION.work-section .image IMG {
    position: absolute;
    left: 0px;
    top: 0px;
    display: block;
    width: 100%;
	height: 100%;
	opacity: 0;
    object-fit: cover;
    -webkit-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -moz-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -ms-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -o-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
}

SECTION.work-section .image IMG.loaded {
	opacity: 1;
}

.work-content {
	position: absolute;
	left: 0px;
	top: 0px;
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.3);
	opacity: 0;
	-webkit-transition: all 0.3s cubic-bezier(.29,.48,.72,.99);
    -moz-transition: all 0.3s cubic-bezier(.29,.48,.72,.99);
    -ms-transition: all 0.3s cubic-bezier(.29,.48,.72,.99);
    -o-transition: all 0.3s cubic-bezier(.29,.48,.72,.99);
	z-index: 10;
}

.work-text {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
    font-family: "PP Gosha Sans";
    font-size: 20px;
    font-weight: 400;
    font-style: normal;
    letter-spacing: normal;
    line-height: 1.2;
    letter-spacing: 1.24px;
    color: #fff;
    text-align: center;
    padding: 0px;
    margin: 0px;
}

.work-text .year {
	display: inline-block;
	width: auto;
	font-family: "PP Gosha Sans";
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: normal;
    line-height: 1;
    letter-spacing: 1.24px;
    color: #fff;
    text-align: center;
	padding: 5px;
	margin: 0 auto;
	margin-top: 10px;
	background: #171cff;
}

@media screen and (min-width: 1025px) {
	SECTION.work-section .image:hover .work-content {
		opacity: 1;
	}
	
	SECTION.work-section .image:hover IMG {
		transform: scale(1.1);
	}
}

SECTION.clients-section {
	position: relative;
	text-align: center;
	padding-top: 100px;
	padding-bottom: 214px;
}

SECTION.clients-section:after {
	position: absolute;
	left: 0px;
	top: 0px;
	display: block;
	width: 100%;
	height: 100%;
	content: "";
}

SECTION.clients-section H2 {
	position: relative;
}

SECTION.clients-section H2 SPAN {
	position: relative;
	z-index: 11;
}

SECTION.clients-section H2 #srdce_wrapper {
	position: absolute;
	left: 50%;
	top: -10px;
	transform: translateX(-80%);
	z-index: 10;
}

ARTICLE {
	
}

.work-header {
	padding-top: 30px;
	padding-bottom: 42px;
}

.work-header H1 {
	font-family: "PP Gosha Sans";
	font-size: 40px;
	font-weight: 700;
	font-style: normal;
	letter-spacing: normal;
	line-height: 1.2;
	color: #fff;
	text-align: left;
	padding: 0px;
	padding-bottom: 15px;
	margin: 0px;
}

.work-header H1 SPAN {
	font-weight: 400;
}

.work-header H2 {
	font-family: "PP Gosha Sans";
	font-size: 27px;
	font-weight: 700;
	font-style: normal;
	letter-spacing: normal;
	line-height: 40px;
	letter-spacing: 1.74px;
	color: #161cff;
	text-align: left;
	padding: 0px;
	margin: 0px;
}

.work-video {
	position: relative;
}

.work-video IFRAME {
	width: 100%;
	height: 1080px;
}

.work-video .video-overlay {
	position: absolute;
	left: 0px;
	top: 0px;
	display: block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	cursor: pointer;
	z-index: 10;
}

//lazy load images
.lazy {
	-webkit-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -moz-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -ms-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
    -o-transition: all 0.7s cubic-bezier(.29,.48,.72,.99);
	opacity: 0;
}

.lazy.loaded {
	opacity: 1;
}

.work-video .video-overlay SPAN {
	position: absolute;
	left: 50%;
	top: 50%;
	display: block;
	transform: translate(-50%, -50%);
	width: 190px;
	height: 190px;
	background-image: url('../images/play.svg');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	z-index: 11;
}

.work-parameters {
	padding-top: 100px;
	padding-bottom: 293px;
}

.work-parameters P {
	font-family: "PP Gosha Sans";
	font-size: 23px;
	font-weight: 400;
	font-style: normal;
	letter-spacing: normal;
	line-height: 1.4;
	letter-spacing: 1.74px;
	color: #fff;
	text-align: left;
	padding: 0px;
	margin: 0px;
}

.work-parameters STRONG {
	font-weight: 400;
	color: #161cff;
}

.social {
	text-align: right;
	padding: 0px;
	margin: 0px;
	margin-top: 5px;
	list-style-type: none;
}

.social LI {
	display: inline-block;
	margin-left: 35px;
}

.social LI IMG {
	filter: brightness(0) invert(1);
}

FOOTER {
	color: #fff;
	padding-top: 100px;
	padding-bottom: 207px;
	background: #171cff;
}

FOOTER .logo {
	display: block;
	margin-bottom: 78px;
}

FOOTER P {
	font-family: "PP Gosha Sans";
	font-size: 23px;
	line-height: 1.2;
	font-weight: 400;
	font-style: normal;
	letter-spacing: 1.74px;
	color: #fff;
	text-align: left;
	padding-bottom: 20px
}

FOOTER A {
	color: #fff !important;
}



/*
 * SVG
 */
SECTION.main-slider-section .get-in-touch {
	
}

SECTION.main-slider-section .get-in-touch H3 {
	position: relative;
	padding: 0px;
	margin-bottom: 30px;
	cursor: pointer;
}

SECTION.main-slider-section .get-in-touch #obluk_wrapper {
	position: absolute;
	left: 50%;
	top: 50%;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

SECTION.main-slider-section .get-in-touch #sipka_wrapper {
	position: absolute;
	left: 50%;
	top: 50px;
	-ms-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
}

#sipka_wrapper2 {
	width: 70px;
	height: 78px;
	transform: rotate(450deg);
	margin-bottom: 50px;
	cursor: pointer;
}

#instagram_wrapper {
	position: absolute;
	left: 50%;
	top: 20px;
	transform: translateX(-50%);
	margin-left: -35px;
}

.instagram-images {
	position: relative;
}

.instagram-images #pivo {
	position: absolute;
	left: 84px;
	top: -350px;
}

#klinec_wrapper {
	position: absolute;
	left: 65%;
	top: -75px;
}

#stroke-elipsa{
    fill: none;
    stroke: none;
  stroke-dasharray: 2050;
  stroke-dashoffset: 2050;
}
#stroke-elipsa .linka-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 15;
  stroke-miterlimit: 10;
}
#stroke-elipsa.animuj {
  stroke-dasharray: 2050 2050;
  stroke-dashoffset: 2050;
  animation: draw-elipsa 1.2s linear forwards;
}

@keyframes draw-elipsa {
  0% { stroke-dashoffset: 2050; }
  100% { stroke-dashoffset: 0; }
}

#stroke-sipka-d{
    fill: none;
    stroke: none;
  stroke-dasharray: 900;
  stroke-dashoffset: 900;
}
#stroke-sipka-d .linka-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 15;
  stroke-miterlimit: 10;
}
#stroke-sipka-d.animuj {
  stroke-dasharray: 900 900;
  stroke-dashoffset: 900;
  animation: write-the-text-sipka-d .5s linear forwards;
}

@keyframes write-the-text-sipka-d {
  0% { stroke-dashoffset: 900; }
  100% { stroke-dashoffset: 0; }
}

#stroke-hello {
    fill: none;
    stroke: none;
  stroke-dasharray: 4646;
  stroke-dashoffset: 4646;
}
#stroke-hello .linka-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 15;
  stroke-miterlimit: 10;
}
#stroke-hello.animuj {
  stroke-dasharray:4646 4646;
  stroke-dashoffset: 1646;
  animation: write-the-text-hello 4s linear forwards;
}

@keyframes write-the-text-hello {
  0% { stroke-dashoffset:4646; }
  100% { stroke-dashoffset:0; }
}

.instagram-images #pivo {
        width: 227px;
      height: 304px;
      overflow: hidden;
}
.textpodpohar,.pohar {fill:#171cff;}
.linkapodpohar{
    fill:none;
    stroke:none;
}
.linkapodpohar.animuj {
      fill:none;
    stroke:#171cff;
    stroke-width:5;
    stroke-linecap:round;
    stroke-miterlimit:10;
      stroke-dasharray: 500;
  stroke-dashoffset: 500;
  animation: dash 1.2s linear forwards;
    animation-delay: 2s;
    display: inline-block;
}
@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}

.instagram-images .fill {
  transform: translate(0, 150px);
}
    .instagram-images .fill.animuj {
      animation-name: fillAction;
      animation-iteration-count: 1;
      animation-timing-function: cubic-bezier(.2, .6, .8, .4);
      animation-duration: 4s;
      animation-fill-mode: forwards;
    }
    .instagram-images #waveShape {
      animation-name: waveAction;
      animation-iteration-count: infinite;
      animation-timing-function: linear;
      animation-duration: 0.5s;
      width: 300px;
      height: 300px;
      fill: #171cff;
    }
    @keyframes fillAction {
      0% {
        transform: translate(0, 150px);
      }
      100% {
        transform: translate(0, -5px);
      }
    }
    @keyframes waveAction {
      0% {
        transform: translate(-150px, 0);
      }
      100% {
        transform: translate(0, 0);
      }
    }
	
#stroke-sipka-r{
    fill: none;
    stroke: none;
  stroke-dasharray: 1170;
  stroke-dashoffset: 1170;
}
#stroke-sipka-r .linka-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 15;
  stroke-miterlimit: 10;
}
#stroke-sipka-r.animuj {
  stroke-dasharray: 1170 1170;
  stroke-dashoffset: 1170;
  animation: write-the-text-sipka-r .5s linear forwards;
}

@keyframes write-the-text-sipka-r {
  0% { stroke-dashoffset: 1170; }
  100% { stroke-dashoffset: 0; }
}


#stroke-sipka-l{
    fill: none;
    stroke: none;
  stroke-dasharray: 1370;
  stroke-dashoffset: 1370;
}
#stroke-sipka-l .linka-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 15;
  stroke-miterlimit: 10;
}
#stroke-sipka-l.animuj {
  stroke-dasharray: 1370 1370;
  stroke-dashoffset: 1370;
  animation: write-the-text-sipka-l .5s linear forwards;
}

@keyframes write-the-text-sipka-l {
  0% { stroke-dashoffset: 1370; }
  100% { stroke-dashoffset: 0; }
}

#stroke-klinec{
    fill: none;
    stroke: none;
  stroke-dasharray: 1200;
  stroke-dashoffset: 1200;
}
#stroke-klinec .linka-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 18;
  stroke-miterlimit: 10;
}
#stroke-klinec.animuj {
  stroke-dasharray: 1200 1200;
  stroke-dashoffset: 1200;
  animation: write-the-text-stroke-klinec .4s linear forwards;
}

@keyframes write-the-text-stroke-klinec {
  0% { stroke-dashoffset: 1200; }
  100% { stroke-dashoffset: 0; }
}

#stroke-klinec--{
    fill: none;
    stroke: none;
  stroke-dasharray: 200;
  stroke-dashoffset: 200;
}
#stroke-klinec-- .linky-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 14;
  stroke-miterlimit: 10;
}
#stroke-klinec--.animuj {
  stroke-dasharray: 350 200;
  stroke-dashoffset: 350;
  animation: write-the-text-stroke-klinec-- .3s linear 2;
  animation-delay: .5s;
}

@keyframes write-the-text-stroke-klinec-- {
  0% { stroke-dashoffset: 350; }
  50% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 350; }
}

#stroke-srdce{
    fill: none;
    stroke: none;
  stroke-dasharray: 1290;
  stroke-dashoffset: 1290;
}
#stroke-srdce .linka-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 18;
  stroke-miterlimit: 10;
}
#stroke-srdce.animuj {
  stroke-dasharray: 1290 1290;
  stroke-dashoffset: 1290;
  animation: write-the-text-stroke-srdce .4s linear forwards;
}
@keyframes write-the-text-stroke-srdce {
  0% { stroke-dashoffset: 1290; }
  100% { stroke-dashoffset: 0; }
}

#stroke-srdce--{
    fill: none;
    stroke: none;
  stroke-dasharray: 200;
  stroke-dashoffset: 200;
}
#stroke-srdce-- .linky-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 14;
  stroke-miterlimit: 10;
}
#stroke-srdce--.animuj {
  stroke-dasharray: 350 200;
  stroke-dashoffset: 350;
  animation: write-the-text-stroke-srdce-- .2s ease 2;
  animation-delay: .7s;
}
@keyframes write-the-text-stroke-srdce-- {
  0% { stroke-dashoffset: 350; }
  50% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 350; }
}



#stroke-sip--{
    fill: none;
    stroke: none;
  stroke-dasharray: 500;
  stroke-dashoffset: 500;
}
#stroke-sip-- .linky-anime {
   fill: none;
   stroke-linecap: round;
  stroke: #171cff;
  stroke-width: 14;
  stroke-miterlimit: 10;
}
#stroke-sip--.animuj {
  stroke-dasharray: 500 500;
  stroke-dashoffset: 500;
  animation: write-the-text-stroke-sip-- .5s ease forwards;
  animation-delay: 1.2s;
}
@keyframes write-the-text-stroke-sip-- {
  0% { stroke-dashoffset: 500; }
  100% { stroke-dashoffset: 0; }
}