@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Handlee&display=swap");
@font-face {
font-family: 'Gilroy-SemiBold';
font-display: block;
src: url(//sivututka.fi/wp-content/themes/sivututka/fonts/gilroy-semibold.woff2) format('woff2'), url(//sivututka.fi/wp-content/themes/sivututka/fonts/gilroy-semibold.woff) format('woff');
}
@font-face{
font-family:"Avenir-Next-Medium";
font-display: block;
src: url(//sivututka.fi/wp-content/themes/sivututka/fonts/avenir-next-medium.woff2) format("woff2"), url(//sivututka.fi/wp-content/themes/sivututka/fonts/avenir-next-medium.woff) format("woff");
}
@font-face{
font-family:"Avenir-Next-Bold";
font-display: block;
src: url(//sivututka.fi/wp-content/themes/sivututka/fonts/avenir-next-bold.woff2) format("woff2"), url(//sivututka.fi/wp-content/themes/sivututka/fonts/avenir-next-bold.woff) format("woff");
}  html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
}
h1 {
font-size: 3.75em;
margin: 0.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-family: 'Avenir-Next-Bold', sans-serif;
font-weight: normal;
color: #333;
}
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: -0.25em;
}
sup {
top: -0.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;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
fieldset {
padding: 0.35em 0.75em 0.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;
} body,
optgroup {
color: #444;
font-family: 'Avenir-Next-Medium', sans-serif;
font-size: 16px;
font-size: 1rem;
line-height: 1.55;
letter-spacing: -0.015em;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5 {
clear: both;
color: #2e294e;
margin: 1em 0;
font-family: 'Gilroy-SemiBold', sans-serif; 
font-weight: normal; 
font-style: normal; 
}
h1,
.h1 {
font-size: 3.75em;
line-height: 1.125;
margin: 0 0 1em 0;
letter-spacing: -0.03em;
}
h2,
.h2 {
font-size: 2.5em;
line-height: 1.333333;
letter-spacing: -0.02em;
}
h3,
.h3 {
font-size: 1.875em;
line-height: 1.5;
letter-spacing: -0.02em;
}
h4,
.h4 {
font-size: 1.125em;
line-height: 1.5;
letter-spacing: -0.02em;
}
h5,
.h5,
h6,
.h6 { 
font-size: 1em;
line-height: 1.75;
letter-spacing: -0.02em;
}
p {
font-size: 1.125em;
margin:0 0 1.25em 0;
line-height: 1.55;
}
dfn, cite, em, i {
font-style: italic;
}
blockquote {
border-left: 0.25em solid #2e294e;
margin: 0 0 1.25em 0;
padding: 1em 0 1em 1em;
font-style: italic;
background: #f1f1f1;
}
blockquote p:last-child {
margin: 0;
}
address {
margin: 0 0 1.5em;
}
pre {
font-size: 1.125em;
background: #eee;
font-family: "Courier 10 Pitch", Courier, monospace;
font-size: 15px;
font-size: 0.9375rem;
line-height: 1.6;
margin-bottom: 1.6em;
max-width: 100%;
overflow: auto;
padding: 1.6em;
}
code, kbd, tt, var {
font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
font-size: 15px;
font-size: 0.9375rem;
}
abbr, acronym {
border-bottom: 1px dotted #666;
cursor: help;
}
mark, ins {
background: #fff9c0;
text-decoration: none;
}
big {
font-size: 125%;
} html {
box-sizing: border-box;
}
*,
*:before,
*:after {
box-sizing: inherit;
}
body {
background: #fff;
}
hr {
background-color: #ccc;
border: 0;
height: 1px;
margin-bottom: 1.5em;
}
ul, ol {
margin: 0 0 1.25em 0;
font-size: 1.125em;
}
ul li ul,
ol li ol {
font-size: 0.875em;
margin: 0.75em 0 1.25em 0;
}
ul {
list-style: disc;
}
ol {
list-style: decimal;
}
li > ul,
li > ol {
margin-bottom: 0;
margin-left: 1.5em;
}
dt {
font-weight: normal;
}
dd {
margin: 0 1.5em 1.5em;
}
img {
height: auto;
max-width: 100%;
}
figure {
margin: 0 0 2em 0;
}
figure img {
display: block;
}
figcaption, article .entry-content figure.alignwide figcaption {
padding: 0.75em 1em 1em 1em;
background: #f1f1f1;
text-align: center;
margin-top: 0;
}
table {
margin: 0 0 1.5em;
width: 100%;
}
th, td {
text-align: left;
} .menu-toggle,
.button,
.draw-controls button,
.site-nav a span,
.draw-controls div div,
.draw-controls .tooltip,
.menu-modal111 h3 a,
.blogposts1 h3 a,
.modal12 a,
.modal12 svg path,
.arrow-link:after,
.footer21 svg,
.footer22 a,
.footer3 a,
.footer3 img,
.topscroll span,
.entry-header121,
.content21 p,
.content211,
.content21 h3,
.content211 h3 span:after,
.content211 h3 span:before,
input[type="submit"],
.site-nav a,
#gallery1 img,
.customers11 img,
.entry-footer12 span:after,
.form-hidden,
.send-drawing,
.send-drawing-close,
.menu-ylavalikko-container,
.blogpost-img img,
.nav-links a,
.site-title svg circle,
.site-title svg path,
.footer21 svg path,
.footer21 svg circle,
.footer23 path {
transition: all 0.2s ease;
} @-webkit-keyframes nav-appear {
from { opacity:0; transform:translateY(-1em); }
to { opacity:1; transform:translateY(0); }
}
@-moz-keyframes nav-appear {
from { opacity:0; transform:translateY(-1em); }
to { opacity:1; transform:translateY(0); }
}
@-o-keyframes nav-appear {
from { opacity:0; transform:translateY(-1em); }
to { opacity:1; transform:translateY(0); }
}
@keyframes nav-appear {
from { opacity:0; transform:translateY(-1em); }
to { opacity:1; transform:translateY(0); }
} @-webkit-keyframes cta-appear {
from { opacity:0; transform:translate(-50%,-1em); }
to { opacity:1; transform:translate(-50%,0); }
}
@-moz-keyframes cta-appear {
from { opacity:0; transform:translate(-50%,-1em); }
to { opacity:1; transform:translate(-50%,0); }
}
@-o-keyframes cta-appear {
from { opacity:0; transform:translate(-50%,-1em); }
to { opacity:1; transform:translate(-50%,0); }
}
@keyframes cta-appear {
from { opacity:0; transform:translate(-50%,-1em); }
to { opacity:1; transform:translate(-50%,0); }
}
.load-animation {
opacity: 0;
-webkit-animation: nav-appear 0.5s ease-in-out 1 normal forwards; -moz-animation:    nav-appear 0.5s ease-in-out 1 normal forwards; -o-animation:      nav-appear 0.5s ease-in-out 1 normal forwards; animation:         nav-appear 0.5s ease-in-out 1 normal forwards; animation-delay: 0s;
} .button,
a.button,
a.button:visited,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.nav-links a {
font-family: 'Gilroy-SemiBold', sans-serif;
display: inline-block;
background: transparent;
color: #f4325f;
font-size: 1.125em;
line-height: 1;
padding: 0.9em 2.5em;
text-decoration: none;
cursor:pointer;
border: 2px solid #f4325f;
border-radius: 2em;
text-align: center;
}
.button:hover,
a.button:hover,
a.button:focus,
button:focus,
.nav-links a:focus,
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.nav-links a:hover {
background: #f4325f;
color: #fff;
}
.button2,
a.button2,
a.button2:visited {
color: #2e294e;
border: 2px solid #2e294e;
}
.button2:hover,
a.button2:hover,
a.button2:hover,
.button2:focus,
a.button2:focus,
a.button2:focus {
color: #fff;
background: #2e294e;
}
.button3,
a.button3,
a.button3:visited {
color: #fff;
background: #2e294e;
border: none;
}
.button3:hover,
a.button3:hover,
a.button3:hover,
.button3:focus,
a.button3:focus,
a.button3:focus {
background: #f4325f;
}
.button4,
a.button4,
a.button4:visited {
color: #fff;
background: #f4325f;
border: none;
}
.button4:hover,
a.button4:hover,
a.button4:hover,
.button4:focus,
a.button4:focus,
a.button4:focus {
background: #2e294e;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea,
select,
.select-selected {
font-size: 1.125em;
line-height: 1.5;
border: none;
border-bottom: 2px solid #2e294d;
padding: 0.6em 1.3em;
border-radius: 0;
width: 100%;
max-width: 100%;
display: block;
margin: 0;
background: #f1f1f1;
color: #2e294d;
box-sizing: border-box;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
border-bottom: 2px solid #f4325f;
color: #2e294d; 
outline: 0;
}
input[type="submit"]:focus {
background: #f4325f;
color: #fff;
outline: none;
}
::placeholder { color: #6c6983;
}
:-ms-input-placeholder { color: #6c6983;
}
::-ms-input-placeholder { color: #6c6983;
}
textarea {
width: 100%;
}
.floating-label {
display: none;
position: absolute;
top:0;
z-index: 9;
left: 0.75em;
font-size: 0.67em;
transform: translate(0,-50%);
padding: 0 0.75em;
background: #fff;
line-height: 110%;
} .custom-select1 {
position: relative;
} #crisp-chatbox > div > a > span.cc-7doi.cc-1ada > span > span > span.cc-12u5.cc-151q {
background-color: #f4325f!important;
color: #fff!important;
}
.crisp-client #crisp-chatbox .floating-label {
transform: none;
margin: 4px 0 0 21px!important;
}
.custom-select1:after {
content: '';
position: absolute;
top: 50%;
right: 0.75em;
transform: translateY(-75%) rotateZ(45deg);
padding: 0.1875em;
border-right: 0.125em solid #555;
border-bottom: 0.125em solid #555;
}
.custom-select {
position: relative;
}
.custom-select select {
display: none;
}
.custom-select select {
position: relative;
-webkit-appearance: none;
-moz-appearance: none;
}
.custom-select select::-ms-expand {
display: none;
}
.select-selected {
background-color: transparent;
cursor: pointer;
color: #444;
}
.select-arrow-active {
border: 2px solid #555;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.select-selected:after {
position: absolute;
content: "";
background-image: url(//sivututka.fi/wp-content/themes/sivututka/images/selectnuoli.svg);
top: 0;
right: 0;
width: 40px;
height: 100%;
background-position: center center;
background-repeat: no-repeat;
transition: all .25s ease;
}
.select-selected.select-arrow-active:after {
transform: rotate(180deg);
}
.select-items div {
color: #ffffff;
padding: 0.5em 1.1em;
border: 1px solid transparent;
border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
cursor: pointer;
}
.select-items {
position: absolute;
background-color: #555;
top: 100%;
left: 0;
right: 0;
z-index: 99;
}
.select-hide {
display: none;
}
.select-items div:hover,
.same-as-selected {
background-color: rgba(0, 0, 0, 0.1);
} .gform_body ul {
margin: 0;
padding: 0;
list-style: none;
}
.gfield {
margin: 0 0 1em 0;
}
.ginput_container {
position: relative;
}
.hidden_label label.gfield_label {
display: none;
}
.validation_error,
.gform_confirmation_message {
color: #790000;
padding: 0.5em 0;
border-bottom: 2px solid #790000;
border-top: 2px solid #790000;
margin: 1em 0;
text-align: center;
}
.gform_confirmation_message {
border-bottom: 2px solid #56a700;
border-top: 2px solid #56a700;
color: #56a700;
}
.validation_message {
color: #790000;
}
.gfield_error {
padding: 0.5em 0;
border-top: 1px solid #790000;
border-bottom: 1px solid #790000;
background: rgba(0,0,0,0.03);
}
.gfield_error .gfield_label {
color: #790000;
}
.gfield_required {
color: #790000;
padding: 0 0 0 0.25em;
} .gfield_checkbox li,
.ginput_container_consent,
.gfield_radio li {
cursor: pointer;
position: relative;
padding: 0;
display: inline-block;
margin: 0 2em 0.75em 0;
}
.ginput_container_consent {
display: block;
}
.gfield_checkbox li input,
.ginput_container_consent input,
.gfield_radio li input {
position: absolute;
margin-left: 6px;
right: 0;
width: auto;
opacity: 0;
}
.gfield_checkbox label,
.ginput_container_consent label,
.gfield_radio label {
margin: 0.5em 0;
cursor: pointer;
position: relative;
padding: 0 0 0 40px;
z-index: 1;
display: inline-block;
}
.gfield_checkbox li:hover label:before,
.gfield_checkbox li input:focus + label::before,
.ginput_container_consent:hover label:before,
.ginput_container_consent input:focus + label::before,
.gfield_radio li:hover label:before,
.gfield_radio li input[type="radio"]:focus + label::before {
border: 2px solid #2e294e;
outline: none;
}
.gfield_checkbox li label:before,
.gfield_checkbox li label:after,
.ginput_container_consent label:before,
.ginput_container_consent label:after,
.gfield_radio li label:before,
.gfield_radio li label:after {
transition: all .1s ease;
}
.gfield_checkbox li label:before,
.ginput_container_consent label:before,
.gfield_radio li label:before {
content: '';
background: transparent;
border-radius: 3px;
border: 2px solid #aaa;
cursor: pointer;
display: inline-block;
height: 30px;
position: absolute;
top: 50%;
left: 0;
margin: 0;
width: 30px;
box-sizing: border-box;
transform: translate(0,-50%);
background-repeat: no-repeat;
background-size: 14px 12px;
background-position: center center;
}
.gfield_checkbox input:checked,
.ginput_container_consent input:checked,
.gfield_radio input:checked {
background: #aaa;
}
.gfield_checkbox input:checked+label:before,
.ginput_container_consent input:checked+label:before,
.gfield_radio input:checked+label:before {
border: 2px solid #2e294e;
background-color: #2e294e;
}
.gfield_checkbox input:checked+label,
.ginput_container_consent input:checked+label,
.gfield_radio input:checked+label {
color: #2e294e;
}
.gfield_checkbox li:after,
.ginput_container_consent:after,
.gfield_radio li:after {
content: "";
position: absolute;
height: 30px;
width: 30px;
top: 50%;
left: 0;
background-image: none;
background-position: center center;
background-repeat: no-repeat;
background-size: 14px 12px;
transform: translate(0,-50%);
}
.gfield_checkbox input:checked+label:before,
.ginput_container_consent input:checked+label:before,
.gfield_radio input:checked+label:before {
background-image: url(//sivututka.fi/wp-content/themes/sivututka/images/check.svg);
}
.gfield_radio li label:before {
border-radius: 50%;
}  a {
color: #f4325f;
}
a:visited {
color: #f4325f;
}
a:hover, a:focus, a:active {
color: #f4325f;
}
a:focus {
outline: thin dotted;
}
a:hover, a:active {
outline: 0;
text-decoration: none;
}
.site-content p a,
.site-content figure a,
.site-content .entry-content li a,
.site-content h4 a {
color: #444;
text-decoration: none;
background-image: linear-gradient(to top,#f4325f,#f4325f);
background-size: 100% 2px;
background-position: left bottom;
background-repeat: no-repeat;
transition: .2s all;
}
.site-content p a:hover,
.site-content p a:focus,
.site-content figure a:hover,
.site-content figure a:focus,
.site-content .entry-content li a:hover,
.site-content .entry-content li a:focus,
.site-content h4 a:hover,
.site-content h4 a:focus {
background-size: 100% 2.8rem;
color: #fff;
}
.site-content p a.button {
background-image: none;
}
.site-content .entry-header p.header-links a {
color: #2e294e;
}
.site-content .entry-header p.header-links a:hover {
color: #f4325f;
} .main-navigation {
clear: both;
display: block;
width: auto;
z-index: 9;
position: relative;
margin: 0 3.8125em 0 auto;
animation-delay: .2s;
}
.main-navigation ul {
display: flex;
list-style: none;
margin: 0;
padding-left: 0;
font-family: 'Gilroy-SemiBold', sans-serif;
}
.main-navigation ul ul {
position: absolute;
top: -999px;
left: 50%;
transform: translate(-50%,0);
z-index: 999;
background: #444;
opacity: 0;
visibility: hidden;
transition: opacity 0.2s ease 0.2s;
flex-direction:column;
}
.main-navigation ul ul:before {
content: "";
border-style: solid;
border-width: 0 .5em .5em;
border-color: transparent transparent #3b3b3b;
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%,-95%);
}
.main-navigation ul ul ul {
left: -999em;
top: 0;
}
.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
left: 100%;
}
.main-navigation ul ul a {
width: 200px;
padding: 0.5em 1em;
font-size: 0.875em;
color:#fff;
}
.main-navigation ul ul a:hover {
background-color: #555;
}
.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul,
.main-navigation ul ul.submenu-toggled {
top: 100%;
opacity: 1;
visibility: visible;
transition-delay: 0s;
}
.main-navigation li {
position: relative;
}
.main-navigation a {
display: block;
text-decoration: none;
padding: 1em;
color: #2e294e;
transition: all 0.2s ease;
}
.main-navigation a:hover,
.main-navigation.toggled a:hover {
color: #f4325f;
}
.main-navigation li.menu-item-has-children {
margin: 0 0.8em 0 0;
}
.main-navigation li.current_page_item > a {
position: relative;
}
.main-navigation li.current_page_item > a:after,
.main-navigation li.current_page_parent > a:after {
content: "";
position: absolute;
bottom: 1em;
right: 1em;
background: #f4325f;
height: 5px;
width: 5px;
border-radius: 50%;
transform: translate(150%,-125%);
}
.dropdown-toggle {
position: absolute;
top: 50%;
right: 0;
height: 13px;
width: 13px;
background-color: transparent;
color: transparent;
line-height: 0;
padding: 0;
transform: translate(0,-50%);
transition: all 0.2s ease;
outline-style: none;
}
.dropdown-toggle path {
fill: #111;
}
.dropdown-toggle:hover,
.dropdown-toggle:focus {
background-color: transparent;
}
.dropdown-toggle:hover path,
.dropdown-toggle-toggled path {
fill: #f4325f;
}
.dropdown-toggle-toggled {
transform: rotate(180deg) translate(0,50%);
}
.main-navigation li.main-pink a {
color: #f4325f;
}
.main-navigation li.main-pink a:hover {
color: #2e294e;
} .menu-toggle {
display: block;
padding: 0;
position: fixed;
outline: none;
top: 1.25em;
right: 1.56em;
width: 2.5em;
height: 2.5em;
background: #2e294e;
font-size: 1em;
border-radius: 50%;
z-index: 999999;
border: none;
animation-delay: 0.4s;
}
.menu-toggle:hover,
.menu-toggle:focus {
background: #f4325f;
}
.hamburger-inner {
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {
position: absolute;
width: 1em;
height: 2px;
transition-timing-function: cubic-bezier(.55,.055,.675,.19);
transition-duration: .22s;
transition-property: transform;
border-radius: 4px;
background-color: #fff;
display: block;
}
.hamburger-inner:after,
.hamburger-inner:before {
display: block;
content: "";
left: 50%;
transform: translate(-50%,0);
}
.hamburger-inner:after {
width: 0.75em;
bottom: -5px;
transition: bottom .1s ease-in .25s,transform .22s cubic-bezier(.55,.055,.675,.19);
}
.hamburger-inner:before {
width: 1.25em;
top: -5px;
transition: top .1s ease-in .25s,opacity .1s ease-in;
}
.toggled-menu .hamburger-inner {
transition-delay: .12s;
transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
transform: translate(-50%,-50%) rotate(225deg);
background: #fff;
left: 50%;
}
.toggled-menu .hamburger-inner:before {
top: 0;
transition: top .1s ease-out,opacity .1s ease-out .12s;
opacity: 0;
}
.toggled-menu .hamburger-inner:after {
bottom: 50%;
transition: bottom .1s ease-out,transform .22s cubic-bezier(.215,.61,.355,1) .12s;
transform: translate(-50%,50%) rotate(-90deg);
background: #fff;
width: 1em;
left: 50%;
}
.site-main .comment-navigation, .site-main
.posts-navigation, .site-main
.post-navigation {
margin: 2.5em 0;
overflow: hidden;
}
.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
float: left;
width: 50%;
}
.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
float: right;
text-align: right;
width: 50%;
} .site-nav {
position: fixed;
top: 5.94em;
right: 2.4em;
display: flex;
flex-direction: column;
z-index: 9;
animation-delay: .6s;
}
.site-nav a,
.owl-carousel button.owl-dot {
width: 0.75em;
height: 0.75em;
padding: 0;
border: 2px solid #2e294e;
box-sizing: border-box;
border-radius: 50%;
margin: 0 0 0.7em 0;
position: relative;
outline: none;
}
.site-nav a.active,
.owl-carousel button.owl-dot.active {
background: #2e294e;
}
.site-nav a:hover,
.owl-carousel button.owl-dot:hover,
.site-nav a:focus,
.owl-carousel button.owl-dot:focus {
border: 2px solid #f4325f;
}
.site-nav a span {
opacity: 0;
visibility: hidden;
font-size: 0.875em;
position: absolute;
top: 50%;
left: -0.5em;
transform: translate(-100%,-50%);
white-space: nowrap;
line-height: 1;
color: #2e294e;
}
.site-nav a:hover span,
.site-nav a:focus span {
opacity: 1;
visibility: visible;
}
.site-nav-alt a {
border: 2px solid #fff;
}
.site-nav-alt a.active {
background: #fff;
}
.site-nav-alt a span {
color: #fff;
}  .screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
width: 1px;
word-wrap: normal !important;
}
.screen-reader-text:focus {
background-color: #f1f1f1;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip: auto !important;
clip-path: none;
color: #21759b;
display: block;
font-size: 14px;
font-size: 0.875rem;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000;
}
#content[tabindex="-1"]:focus {
outline: 0;
} .alignleft {
display: inline;
float: left;
margin-right: 1.5em;
}
.alignright {
display: inline;
float: right;
margin-left: 1.5em;
}
.aligncenter {
clear: both;
display: block;
margin-left: auto;
margin-right: auto;
}
.aligncenter img {
margin: 0 auto;
} .clear:before,
.clear:after {
content: "";
display: table;
table-layout: fixed;
}
.clear:after {
clear: both;
}  .sticky {
display: block;
}
.hentry {
margin: 0 0 1.5em;
}
.updated:not(.published) {
display: none;
}
.page-content,
.entry-content,
.entry-summary {
margin: 5em 0 0;
max-width: 37.5em;
}
.page-links {
clear: both;
margin: 0 0 1.5em;
}
.post {
margin: 5em 0;
} .error-404 .page-content,
.page-search,
.no-results {
text-align: center;
}
.search-form {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.search-form input[type="search"] {
margin: 0;
}
.search-form input[type="submit"] {
padding: 0.5em 2em;
margin: 0 0 0 1em;
border-radius: 3px;
}
.page-search .entry-summary {
margin: 0;
}
.entry-content.page-search {
text-align: left;
}
.page-search h2 {
margin: 0.5em 0;
}
.page-search .posts-navigation {
margin: 3em 0 0 0;
}
.page-search article {
margin: 5em 0;
}
.page-search article:first-of-type {
margin-top: 0;
} .infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
display: none;
}
.infinity-end.neverending .site-footer {
display: block;
} .page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
border: none;
margin-bottom: 0;
margin-top: 0;
padding: 0;
}
embed,
iframe,
object {
max-width: 100%;
} .custom-logo-link {
display: inline-block;
} #sivututka-svg-logokuva {
display: block;
transition: all 0.2s ease;
}
#sivututka-svg-logokuva path,
#sivututka-svg-logokuva ellipse {
fill: #111;
}
#sivututka-svg-logo path,
#sivututka-svg-logo ellipse {
fill: #999;
}
#sivututka-svg-logo:hover path {
fill: #111;
}
#sivututka-svg-logo:hover ellipse,
#sivututka-svg-logokuva:hover ellipse {
fill: #f4325f;
}
.fa-chevron-down {
fill: #111;
} .wp-caption {
margin-bottom: 1.5em;
max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
display: block;
margin-left: auto;
margin-right: auto;
}
.wp-caption .wp-caption-text {
margin: 0 0 1em 0;
}
.wp-caption-text {
text-align: center;
font-style: normal;
} .gallery {
margin-bottom: 1.5em;
}
.gallery-item {
display: inline-block;
text-align: center;
vertical-align: top;
width: 100%;
}
.gallery-columns-2 .gallery-item {
max-width: 50%;
}
.gallery-columns-3 .gallery-item {
max-width: 33.33%;
}
.gallery-columns-4 .gallery-item {
max-width: 25%;
}
.gallery-columns-5 .gallery-item {
max-width: 20%;
}
.gallery-columns-6 .gallery-item {
max-width: 16.66%;
}
.gallery-columns-7 .gallery-item {
max-width: 14.28%;
}
.gallery-columns-8 .gallery-item {
max-width: 12.5%;
}
.gallery-columns-9 .gallery-item {
max-width: 11.11%;
}
.gallery-caption {
display: block;
} .container {
position: relative;
max-width: 79em; margin: 0 auto;
padding: 0 2em;
box-sizing:border-box;
}
.container-narrow {
max-width: 41.5em;
margin: 0 auto;
}  .site-header {
z-index: 99999;
position: absolute;
top: 0;
left: 0;
width: 100%;
}
.site-header-wrapper { 
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.56em 1.56em;
transition: all 0.2s ease;
}
.site-branding {
padding: 0 2em 0 0;
box-sizing:border-box;
z-index: 99;
opacity: 0;
}
.site-title {
margin:0;
}
.site-title a {
display:block;
}
.site-title svg {
display: block;
} .entry-header {
padding: 10em 0 5em 0;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
box-sizing: border-box;
position: relative;
}
.entry-header:before {
content: "";
position: absolute;
top: 0;
left: 0;
background: #f9f9f9;
width: 100%;
height: 100vh;
z-index: -1;
}
.paged .entry-header:before,
.category .entry-header:before {
content: none;
}
.frontpage-header:before {
content: none;
}
.entry-header-fullheight {
height: 100vh;
}
.entry-header h1 {
margin: 0;
max-width: 13.79em;
animation-delay: 0.2s;
}
.entry-copy {
animation-delay: .5s;
}
.entry-copy p {
margin: 2em 0 6em;
max-width: 600px;
}
.entry-image-full-width {
display: block;
width: 100%;
animation-delay: .6s;
}
.entry-image-full-width img {
width: 100%;
height: auto;
display: block;
} .site-footer {
padding: 7em 0 1em 0;
margin: 8em 0 0 0;
background: #2e294e;
position: relative;
max-width: 100%;
}
.home .site-footer,
.page-template-tyot .site-footer,
.page-template-idealabra .site-footer,
.page-template-meista .site-footer,
.blog .site-footer,
.archive .site-footer,
.single-post .site-footer,
.page-template-hall-of-fame .site-footer,
.single-tyot .site-footer,
.page-template-rekry .site-footer,
.single-tyopaikat .site-footer {
padding-top: 20em;
margin-top: 25em;
}
.footer1 {
width: 56.25em;
height: 30em;
max-width: 100%;
margin: 0 auto;
padding: 0 2em;
background-color: #f4325f;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
box-sizing: border-box;
position: absolute;
top: 0;
right: 50%;
transform: translate(50%,-50%);
overflow: hidden;
}
.footer111 {
display: flex;
flex-wrap: wrap;
}
.footer-cta3 .footer111 {
justify-content: center;
}
.footer1111 {
margin: 0.65em;
position: relative;
}
.footer1 h3 {
color: #fff;
margin: 0 0 0.65em 0;
}
.footer1 p {
color: #fff;
}
.footer1111 .tooltip {
color: #fff;
transform: translate(-40%,0) rotate(5deg);
top: auto;
left: 0;
bottom: -2em;
}
.footer1111 .tooltip:before {
transform: translate(100%,0%);
left: auto;
right: -0.25em;
bottom: 50%;
background-image: url(//sivututka.fi/wp-content/themes/sivututka/images/curved-arrow-white.svg);
}
.footer1111:nth-child(even) .tooltip {
transform: translate(40%,0) rotate(-5deg);
bottom: -2em;
left: auto;
right: 0;
}
.footer1111:nth-child(even) .tooltip:before {
transform: translate(-100%,0%);
bottom: 50%;
background-image: url(//sivututka.fi/wp-content/themes/sivututka/images/curved-arrow-white-alt.svg);
right: auto;
left: -0.25em;
}
.footervideo {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
z-index: -1;
width: 100%;
height: auto;
}
.footer1 form .mc4wp-form-fields {
display: flex;
background: #fff;
border-radius: 3em;
padding: 0 0 0 1.65em;
position: relative;
max-width: 29em;
margin: 0 auto;
}
.footer1 input[type="email"] {
background: transparent;
border: none;
}
.footer1 input[type="submit"] {
background: #2e294e;
border: none;
color: #fff;
margin: 0 -1px 0 0;
}
.footer1 input[type="submit"]:hover {
background: #f4325f;
}
.footer2 {
display: flex;
flex-wrap: wrap;
width: 100%;
}
.footer21 {
width: 15%;
}
.footer21 svg {
display: block;
opacity: 0.7;
width: 9.375em;
height: 1.375em;
max-width: 100%;
}
.footer21 a:hover svg {
opacity: 1;
}
.footer22 {
width: 70%;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.footer22 p {
margin: 0;
}
.footer22 a {
position: relative;
padding: 0.25em 1.61em 0 1.61em;
color: rgba(255,255,255,0.7);
text-decoration: none;
}
.footer22 a:after {
content: "";
position: absolute;
top: 50%;
right: 0;
width: 1em;
height: 2px;
background: #f4325f;
transform: translate(50%,50%);
}
.footer22 a:last-child:after {
content: none;
}
.footer22 a:hover {
color: #f4325f;
}
.footer23 {
display: flex;
flex-wrap: wrap;
width: 15%;
justify-content: flex-end;
align-items: center;
}
.footer23 a {
text-decoration: none;
margin: 0 0 0 1.25em;
}
.footer23 a:hover path {
fill: #fff;
}
.footer23 svg {
display: block;
}
.footer3 {
display: flex;
flex-wrap: wrap;
border-top: 2px solid rgba(255,255,255,0.3);
padding: 2em 0 0 0;
margin: 2em 0 0 0;
}
.footer31 {
width: 50%;
}
.footer32 {
width: 50%;
text-align: right;
display: flex;
justify-content: flex-end;
align-items: center;
}
.footer3 p {
margin: 0;
display: flex;
flex-wrap: wrap;
line-height: 1.25;
}
.footer3 a {
color: rgba(255,255,255,0.7);
text-decoration: none;
}
.footer3 p a {
padding: 0 0.75em;
position: relative;
border-left: 2px solid rgba(255,255,255,0.3);
}
.footer3 p a:first-child {
padding-left: 0;
border-left: 0;
}
.footer3 a:hover {
color: #f4325f;
}
.footer32 a {
margin: 0 0 1em 2em;
text-align: center;
line-height: 1.15;
}
.footer32 p a {
padding: 0;
}
.footer3 img {
opacity: 0.7;
}
.footer3 svg {
opacity: 0.7;
}
svg.awwwards {
width: 100px;
height: 16px;
}
.footer3 path,
.footer3 polygon {
fill: #fff;
}
.footer3 a:hover img,
.footer3 a:hover svg {
opacity: 1;
}
.topscroll {
position: absolute;
top: 1.5em;
right: 1.5em;
cursor: pointer;
padding: 0;
transition: all 0.2s ease;
z-index: 9999;
border: none;
opacity: 0.7;
outline: none;
}
.topscroll span {
position: absolute;
font-size: 0.778em;
display: block;
white-space: nowrap;
color: #fff;
transform: translate(-50%,100%) rotate(270deg);
left: 50%;
bottom: -100%;
opacity: 0;
pointer-events: none;
transition: opacity .2s ease;
}
.topscroll svg {
width: 26px;
height: 43px;
}
.topscroll svg g,
.topscroll svg path {
fill: #fff;
}
.topscroll:hover,
.topscroll:focus {
opacity: 1;
background: transparent;
}
.topscroll:hover span,
.topscroll:focus span {
opacity: 1;
}
.topscroll-activate {
-webkit-animation: topscroll-activate 1.2s; -moz-animation:    topscroll-activate 1.2s; -o-animation:      topscroll-activate 1.2s; animation:         topscroll-activate 1.2s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
animation-timing-function: ease;
}
.topscroll-activate span {
opacity: 0!important;
}
@keyframes topscroll-activate {
0% { top: 1.5em; }
40% { top: 2.5em; }
100% { top: -1500px; }
}
@keyframes topscroll-activate-mobile {
0% { bottom: 7.5em; }
40% { bottom: 6.5em; }
100% { bottom: 1500px; }
}
@keyframes topscroll-activate-mobile2 {
0% { bottom: 5.5em; }
40% { bottom: 4.5em; }
100% { bottom: 1500px; }
}
.topscroll:hover .flame1,
.topscroll:hover .flame3,
.topscroll:focus .flame1,
.topscroll:focus .flame3 {
-webkit-animation: topscroll-hover1 0.2s infinite; -moz-animation:    topscroll-hover1 0.2s infinite; -o-animation:      topscroll-hover1 0.2s infinite; animation:         topscroll-hover1 0.2s infinite; animation-timing-function: ease;
}
@keyframes topscroll-hover1 {
0% { fill: #f4325f; }
50% { fill: #c40a35; }
100% { fill: #f4325f; }
}
.topscroll:hover .flame2,
.topscroll:focus .flame2 {
-webkit-animation: topscroll-hover2 0.2s infinite; -moz-animation:    topscroll-hover2 0.2s infinite; -o-animation:      topscroll-hover2 0.2s infinite; animation:         topscroll-hover2 0.2s infinite; animation-timing-function: ease;
}
@keyframes topscroll-hover2 {
0% { fill: #f4325f; }
50% { fill: #f587a0; }
100% { fill: #f4325f; }
} .post-list {
margin: 5em 0;	
}
.post-list-header {
margin:0 0 1em 0;	
}
.post-list-title {
margin: 0.3em 0 0 0;
}
.post-list-thumb img {
display: block;
}  .wp-block-columns {
display: flex;
margin-bottom: 28px;
flex-wrap: wrap;
}
.wp-block-column {
flex-basis: calc(50% - 16px);
flex-grow: 0;
}
.wp-block-column:not(:first-child) {
margin-left: 32px;
}  @media only screen and (min-width: 125em) {
body {
font-size: 115%;
}
} @media only screen and (min-width: 150em) {
body {
font-size: 130%;
}
} @media only screen and (min-width: 87.5625em) {
} @media only screen and (max-width: 87.5em) {
} @media only screen and (max-width: 75em) {	
body {
font-size:95%;
}
} @media only screen and (max-width: 62em) {
body {
font-size:90%;
}
} @media only screen and (max-width: 48em) {
body {
font-size: 85%;
}
a.social-whatsapp {
display: inline-block;
}
.social-social {
padding: 0;
}
.social-social:before {
left: -20px;
}
.wp-block-column {
flex-basis: 100%;
}
.wp-block-column:not(:first-child) {
margin-left: 0;
}
} @media only screen and (max-width: 30em) {
body {
font-size: 80%;
}
.container {
padding: 0 1em;
}
.search-form label {
width: 100%;
}
.search-form input[type="search"] {
width: 100%;
margin:0 0 0.5em 0;
}
.search-form input[type="submit"] {
padding: 1em 2em;
margin: 0;
width: 100%;
box-sizing: border-box;
}
} @media only screen and (max-width: 20em) {
body {
font-size: 70%;
}
}  .form-ghost {
display: none!important;
}
.change-screen img {
display: none;
width: 100%;
}
.change-screen img.screen-visible {
display: block;
}
.pink-text {
color: #f4325f;
}
.text-caps-opacity {
text-transform: uppercase;
opacity: 0.5;
margin: 0 0 0.5em 0;
}
.text-caps-opacity-white {
color: #fff;
text-transform: uppercase;
opacity: 0.3;
margin: 0 0 0.5em 0;
}
.no-scroll { 
overflow: hidden;
}
a.arrow-link,
a.arrow-link:visited {
position: relative;
font-size: 1.125em;
text-decoration: none;
}
.arrow-link:after {
content: "";
position: absolute;
top: 50%;
right: -0.75em;
background: url(//sivututka.fi/wp-content/themes/sivututka/images/arrow-pink-right.svg) no-repeat center center;
background-size: 1.25em 1.25em;
width: 1.25em;
height: 1.25em;
transform: translate(100%,-45%);
}
.arrow-link:hover:after,
.arrow-link:focus:after {
right: -1.25em;
}
.tooltip {
font-size: 1.25em;
position: absolute;
line-height: 1.125;
transform: translate(25%,-275%) rotate(-5deg);
top: 0;
left: 0;
}
.tooltip:before {
content: "";
width: 1.25em;
height: 1.25em;
position: absolute;
left: -0.25em;
bottom: 0;
background: url(https://sivututka.fi/wp-content/themes/sivututka/images/curved-arrow-purple-down.svg) no-repeat center center;
background-size: 1.25em 1.25em;
transform: translate(-100%,50%);
}
.micro-margin {
margin: 0 0 0.15em 0;
}
.narrow-heading {
max-width: 13.79em;
}
::selection {
background: #f4325f;
color: #fff;
}
::-moz-selection {
background: #f4325f;
color: #fff;
}
a, button, input, label {
-webkit-tap-highlight-color: transparent;
}
.small-font {
font-size: 1em;
} .site-nav a span,
.text-caps-opacity,
.text-caps-opacity-white,
.menu-modal21 li,
.arrow-link,
.header-links,
.history12121 p,
.blog-meta,
.post-categories a,
.publish-date,
.super-list li,
.category-list li {
font-family: 'Gilroy-SemiBold', sans-serif;
}
.content112 li a,
.price-amount:after {
font-family: 'Avenir-Next-Medium', sans-serif;
}
.tooltip {
font-family: 'Handlee', cursive;
} .site-title a:hover svg path,
.site-title a:focus svg path,
.footer21 a:hover svg path,
.footer21 a:focus svg path {
fill: #f4325f!important;
}
.site-title a:focus,
a.button:focus,
button:focus {
outline: 0;
} .menu-modal1,
.menu-modal2 {
width: 50%;
background-color: #fff;
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
padding: 5em 0 0 0;
box-sizing: border-box;
left: -50%;
height: 100vh;
position: fixed;
top: 0;
z-index: 10;
scrollbar-width: none;
-ms-overflow-style: none;
overflow-y: scroll;
}
.menu-modal1::-webkit-scrollbar,
.menu-modal2::-webkit-scrollbar {
display: none;
}
.menu-modal11 {
max-width: 33.56em;
padding: 4.125em;
box-sizing: border-box;
}
.menu-modal111 {
max-width: 26.25em;
}
.menu-modal111 img {
display: block;
}
.menu-modal111 h3 a,
.blogposts1 h3 a {
text-decoration: none;
color: #2e294e;
}
.menu-modal111 h3 a:hover,
.menu-modal111 h3 a:active,
.blogposts1 h3 a:hover, 
.blogposts1 h3 a:active {
color: #f4325f;
}
.menu-modal111 .excerpt {
font-size: 1em;
}
.modal12 {
display: flex;
width: 50%;
border-top: 1px solid rgba(0,0,0,0.1);
bottom: 0;
justify-content: space-between;
position: fixed;
left: -50%;
}
.menu-modal1 .modal12 {
background: #fff;
}
.menu-modal2 .modal12 {
background: #2e294e;
right: 0;
left: initial
}
.modal12 a {
border-right: 1px solid rgba(0,0,0,0.1);
text-align: center;
width: 100%;
padding: 1.375em 0;
box-sizing: border-box;
color: #fff;
text-decoration: none;
font-size: 1.125em;
}
.modal12 a:last-child {
border-right: none;
}
.modal12 svg {
display: block;
margin: 0 auto;
}
.modal12 a:hover,
.modal12 a:focus {
background: #f4325f;
color: #2e294e;
}
.modal12 a:hover svg path,
.modal12 a:focus svg path {
fill: #2e294e;
}
.modal12 a span {
line-height: 1;
height: 20px;
display: block;
position: relative;
}
.menu-modal2,
.menu-modal2 .modal12 {
left: auto;
right: -50%;
}
.menu-modal2 .modal12 a span {
display: flex;
justify-content: center;
align-items: center;
}
.menu-modal2 .modal12 a svg {
display: inline-block;
margin: 0 0.5em 0 0;
}
.menu-modal2 {
background: #2e294e;
}
.menu-modal21 {
padding: 4.125em;
box-sizing: border-box;
width: 100%;
}
.menu-modal21 ul {
margin: 0 0 2em 0;
padding: 0;
display: flex;
flex-wrap: wrap;
}
.menu-modal21 li {
padding: 0 0.5em 0.5em 0;
margin: 0;
font-size: 1.67em;
width: 50%;
box-sizing: border-box;
list-style-type: none;
line-height: 1.15;
}
.menu-modal21 li a {
color: #fff;
text-decoration: none;
}
.menu-modal21 li a:hover {
color: #f4325f;
}
.menu-modal21 h3 {
color: #fff;
margin: 0.5em 0 1.5em;
}
.menu-modal21 p {
max-width: 36em;
color: #fff;
}
.menu-modal21 p a {
color: #fff;
}
.menu-modal-show {
visibility: visible;
}
.menu-modal1.animation-left,
.menu-modal1 .modal12.animation-left {
-webkit-animation: modal-left-appear 0.5s; -moz-animation:    modal-left-appear 0.5s; -o-animation:      modal-left-appear 0.5s; animation:         modal-left-appear 0.5s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
animation-timing-function: ease-in;
}
.menu-modal1.reverse-animation-left,
.menu-modal1 .modal12.reverse-animation-left {
-webkit-animation: modal-left-remove 0.5s; -moz-animation:    modal-left-remove 0.5s; -o-animation:      modal-left-remove 0.5s; animation:         modal-left-remove 0.5s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
animation-timing-function: ease-in;
}
.menu-modal2.animation-right,
.menu-modal2 .modal12.animation-right {
-webkit-animation: modal-right-appear 0.5s; -moz-animation:    modal-right-appear 0.5s; -o-animation:      modal-right-appear 0.5s; animation:         modal-right-appear 0.5s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
animation-timing-function: ease-in;
}
.menu-modal2.reverse-animation-right,
.menu-modal2 .modal12.reverse-animation-right {
-webkit-animation: modal-right-remove 0.5s; -moz-animation:    modal-right-remove 0.5s; -o-animation:      modal-right-remove 0.5s; animation:         modal-right-remove 0.5s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
animation-timing-function: ease-in;
}
@keyframes modal-left-appear {
0% { left: -50%; }
60% { left: 0; }
80% { left: -3%; }
100% { left: 0; }
}
@keyframes modal-left-remove {
0% { left: 0; }
100% { left: -50%; }
}
@keyframes modal-right-appear {
0% { right: -50%; }
60% { right: 0; }
80% { right: -3%; }
100% { right: 0; }
}
@keyframes modal-right-remove {
0% { right: 0; }
100% { right: -50%; }
}
@keyframes modal-right-appear-mobile {
0% { right: -80%; }
60% { right: 0; }
80% { right: -3%; }
100% { right: 0; }
}
@keyframes modal-right-remove-mobile {
0% { right: 0; }
100% { right: -80%; }
} .work {
margin: 6.25em 0 0 0;
overflow: hidden;
}
.work h3 {
margin: 0;
}
.work p {
margin: 2.5em 0;
}
.work1 {
width: 63%;
position: relative;
box-sizing: border-box;
z-index: 10;
}
.floating-area {
margin-top: 3em;
position: relative;
display: flex;
}
.floating-area:after {
content: "";
display: block;
clear: both;
}
.floating-work {
padding: 6.25em 0 0 0;
position: relative;
max-width: 100%; }
.work2 {
width: 37%;
padding: 0 0 0 4.375em;
box-sizing: border-box;
}
.work21 {
padding: 11em 0;
position: relative;
z-index: 1;
}
.work21:nth-child(even):before {
content: "";
width: 5000px;
height: 100%;
background: #f9f9f9;
position: absolute;
top: 0;
z-index: -1;
left: 0;
transform: translate(-50%,0);
}
.work21:last-child {
padding-bottom: 20em;
}
.browser {
box-shadow: 0px 0px 50px rgba(0,0,0,0.2);
width: 87%;
position: relative;
}
.browser svg {
display: block;
width: 100%;
height: auto;
position: relative;
}
.browser-screen {
height: 23em;
overflow: auto;
scrollbar-width: none;
-ms-overflow-style: none;
}
.browser-screen::-webkit-scrollbar,
.mobile-screen::-webkit-scrollbar {
display: none;
}
.mobile {
width: 9.75em;
height: 20.44em;
position: absolute;
right: 0;
bottom: -4em;
z-index: 1;
box-shadow: 0px 0px 50px rgba(0,0,0,0.3);
border-radius: 1.5em;
}
.mobile svg {
width: 100%;
height: auto;
position: relative;
z-index: 2;
}
.mobile-screen {
position: absolute;
width: 95%;
height: 16.5em;
overflow: auto;
z-index: 3;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
scrollbar-width: none;
-ms-overflow-style: none;
}  .content1 {
padding: 11.25em 0 0 0;
overflow: hidden;
}
.content11 {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
position: relative;
}
.content111 {
width: 50%;
padding: 8.5em 0;
position: relative;
box-sizing: border-box;
z-index: 2;
margin: -6.25em 0 0 0;
}
.content111:before,
.content112:before {
content: "";
position: absolute;
top: 0;
right: -6.25em;
width: 200em;
height: 100%;
background: #fff;
box-shadow: 0 0 3.125em rgba(0,0,0,0.15);
z-index: -1;
}
.content111 p {
max-width: 28.67em;
}
.content111 .button {
margin: 2em 0 0 0;
}
.content112 {
position: relative;
padding: 6em 0 6em 20%;
background: #2e294e;
z-index: 1;
width: 50%;
box-sizing: border-box;
}
.content112 h4 {
color: #fff;
text-transform: uppercase;
margin: 0 0 1.5em 0;
}
.content112 ul {
margin: 0 0 3em 0;
padding: 0;
}
.super-list {
margin: 4em 0 0 0;
padding: 0;
}
.content112 ul:last-child {
margin-bottom: 0;
}
.content112 li,
.super-list li {
color: #fff;
margin: 0 0 0.5em 0;
position: relative;
list-style-type: none;
padding: 0 0 0 1.65em;
}
.content112 li:before,
.super-list li:before {
content: "";
position: absolute;
top: 50%;
left: 0;
width: 0.78em;
height: 2px;
background: #f4325f;
transform: translate(0,-50%);
}
.content112:before {
right: auto;
left: 0;
background: #2e294e;
box-shadow: none;
}
.content112 li a,
.content112 li a:visited,
.super-list li a,
.super-list li a:visited {
text-decoration: none;
color: #fff;
position: relative;
font-size: 1em;
}
.super-list li a,
.super-list li a:visited {
color: #2E294E;
}
.content112 li a:hover,
.content112 li a:focus,
.super-list li a:hover,
.super-list li a:focus {
color: #f4325f;
}
.content112-pink {
background: #f4325f;
}
.content112-pink:before {
background: #f4325f;
}
.content12 h2 {
max-width: 17.5em;
margin: 2.875em auto 1em auto;
text-align: center;
}
.content121 {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.content1211 {
width: 50%;
padding: 0 2em;
box-sizing: border-box;
align-self: flex-end;
}
.content1211 img {
max-width: 25em;
display: block;
}
.content1212 {
width: 50%;
padding: 2em 0 4em 0;
}
.content1212 h4 {
margin-bottom: 2.5em;
} .content2 {
background: #2e294e;
}
.content2 h2 {
color: #fff;
padding: 2.5em 0;
text-align: center;
margin: 0 auto;
max-width: 15em;
}
.content21 {
display: flex;
flex-wrap: wrap;
}
.content211 {
width: 33.333333%;
text-align: center;
padding: 0 1em 2em 1em;
box-sizing: border-box;
margin: 0;
cursor: pointer;
position: relative;
top: 0;
}
.content211:hover,
.content211-active {
top: -1em;
}
.content21 svg,
.content21 img {
display: block;
margin: 0 auto;
}
.content21 h3 {
color: #fff;
margin: 0.5em 0;
}
.content211:hover h3,
.content211-active h3 {
font-size: 2.25em;
}
.content21 h3 span {
position: relative;
}
.content21 h3 span:after,
.content21 h3 span:before {
content: "";
position: absolute;
top: 50%;
right: -0.55em;
width: 0.4em;
height: 2px;
background: #f4325f;
transform: translate(100%,50%);
}
.content21 h3 span:before {
transform: translate(100%,50%) rotate(90deg);
}
.content211:hover h3 span:before,
.content211-active h3 span:before {
opacity: 0;
}
.content211:hover h3 span:after,
.content211-active h3 span:after {
transform: translate(100%,50%) rotate(180deg);
}
.content21 p {
color: #fff;
transform: rotate(10deg) scale(0.5) translate(-50%,100%);
transform-origin: top left;
opacity: 0;
position: absolute;
bottom: 0.5em;
left: 50%;
width: 100%;
padding: 0 1em;
box-sizing: border-box;
}
.content211:hover p,
.content211-active p {
transform: rotate(0deg) translate(-50%,100%);
opacity: 1;
}
.content22 {
position: relative;
bottom: -9.375em;
margin: 4em 0 20em 0;
}
.content22 img {
display: block;
}
.content221 {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.content2211 {
width: 45%;
padding: 0 6.25em 0 0;
box-sizing: border-box;
}
.content2212 {
width: 55%;
}
.content23 {
max-width: 41.25em;
margin: 6.25em auto 0 auto;
} .text-comparison .entry-content {
margin-top: 0;
}
.comparison-flex {
display: flex;
max-width: 600px;
margin: 0 auto;
flex-direction: column;
align-content: flex-start;
color: #F9D7DF
}
article .entry-content .comparison-flex p {
margin-left:0;
}
p.meh {
font-size: 10px;
line-height: 1.1;
letter-spacing: 0.2em;
margin-bottom: 6px;
text-transform: uppercase;
font-family: 'Gilroy-SemiBold', sans-serif;
display: none;
}
p.comparison-alku, p.comparison-loppu {
font-family: 'Gilroy-SemiBold', sans-serif;
font-size: 24px;
line-height: 1.2;
letter-spacing: -0.02em;
margin: 0;
}
.comparison-svg {
margin: 30px 0;
}
.text-comparison {
width: 100%;
display: block;
padding: 4em 0;
margin: 5em 0;
background: #f4325f;
}
.hyvaquote {
margin: 7em 0;
text-align: center;
}
.hyvaquote p {
font-family: 'Gilroy-SemiBold', sans-serif;
font-size: 1.875em;
line-height: 1.5;
letter-spacing: -0.02em;
color: #f4325f;
margin: 0;
}
.leveasisalto {
margin: 3em -10em;
}
.blogposts {
margin: 11.25em 0;
}
.blogposts1 {
display: flex;
flex-wrap: wrap;
padding: 3.125em 0 0 0;
}
.blogposts11 {
width: 50%;
box-sizing: border-box;
}
.blogposts11:nth-child(odd) {
padding: 3.125em 6.25em 0 0;
}
.blogposts11:nth-child(even) {
padding: 3.125em 3.125em 0 3.125em;
}
.blogposts111 {
padding: 2em 3.125em;
background: #fff;
box-shadow: 0 0 3.125em rgba(0,0,0,0.15);
position: relative;
top: -3.125em;
right: -3.125em;
}
.blogpost-img {
display: block;
overflow: hidden;
}
.blogpost-img:hover img {
transform: scale(1.05);
}
.blogposts1 img {
display: block;
width: 100%;
}
.blogposts1 h3 {
margin: 0 0 1.77em 0;
}
.blogposts1 p {
margin: 0;
}
.img-shadow img {
box-shadow: 0 0 3.125em rgba(0,0,0,0.15);
} .page-template-default .entry-content {
margin: 5em auto 10em;
}
.page-template-default .entry-header h1 {
text-align: center;
margin: 0 auto;
position: relative;
} .entry-header1 {
display: flex;
flex-wrap: wrap;
margin: 3.125em 0;
}
.entry-header11 {
width: 50%;
padding: 6.25em 3.125em 3.125em 0;
box-sizing: border-box;
animation-delay: 0.8s;
}
.entry-header11 img {
width: 100%;
}
.entry-header12 {
width: 50%;
padding: 0 0 0 3.125em;
box-sizing: border-box;
animation-delay: 1s;
}
.entry-header12 img {
margin: 6.25em 0 0 0;
width: 100%;
}
.entry-header121 {
padding: 0 3.125em 0 0;
box-sizing: border-box;
max-width: 37.5em;
}
.entry-header121-lyhennetty {
max-height: 12.5em;
overflow: hidden;
position: relative;
}
.entry-header121-lyhennetty:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
height: 3em;
width: 100%;
background: -moz-linear-gradient(top, rgba(249,249,249,0) 0%, rgba(249,249,249,1) 100%); background: -webkit-linear-gradient(top, rgba(249,249,249,0) 0%,rgba(249,249,249,1) 100%); background: linear-gradient(to bottom, rgba(249,249,249,0) 0%,rgba(249,249,249,1) 100%); }
.entry-header121-full {
max-height: 100em;
}
.entry-header121-full:after {
content: none;
}
.entry-header12 button {
color: #2e294e;
padding: 0;
position: relative;
border: none;
border-radius: 0;
margin: 1em 0 0 0;
}
.entry-header12 button:after {
content: "";
width: 1.25em;
height: 1.25em;
position: absolute;
right: -0.25em;
bottom: 0;
background: url(https://sivututka.fi/wp-content/themes/sivututka/images/curved-arrow-purple-down-alt.svg) no-repeat center center;
background-size: 1.25em 1.25em;
transform: translate(100%,50%);	
}
.entry-header12 button:hover,
.entry-header12 button:focus {
background: transparent;
color: #f4325f;
}
.hide-button {
opacity: 0;
visibility: hidden;
}
.category-list {
margin: 1.25em 0 0 0;
padding: 0 0 2em 0;
display: flex;
flex-wrap: wrap;
animation-delay: 0.2s;
}
.category-list li {
margin: 0 1em 0.5em 0;
padding: 0;
list-style-type: none;
}
.category-list a {
color: #2e294e;
text-decoration: none;
}
.category-list a:hover {
color: #f4325f;
}
.inner-page-links {
display: flex;
animation-delay: initial;
margin: 2em 0 0 0;
align-items: flex-start;
}
.inner-page-links .category-list {
animation: none;
animation-delay: 0;
margin: 0;
}
.inner-page-links p {
position: relative;
margin: 0 1em 0 0;
padding: 0 1em 0 0;
text-transform: uppercase;
color: rgba(49,42,83,0.5);
}
.inner-page-links p:after {
content: "";
position: absolute;
top: 50%;
right: 0;
height: 1.75em;
width: 4px;
background: #f4325f;
transform: translate(50%,-50%);
} .prices {
margin: 9.375em 0;
}
.prices1 {
display: flex;
flex-wrap: wrap;
}
.prices11 {
width: 50%;
}
input.field-error {
border-bottom:2px solid red;
}
.price-form {
margin: 4em 0 0 0;
padding: 0 0 4em 0;
position: relative;
}
.price-form ul {
padding: 0;
}
.price-form li {
margin: 0;
}
.price-form .gfield_checkbox li,
.price-form .gfield_radio li {
display: block;
}
.prices h2 {
margin: 2em 0 0 0;
}
.prices .h1 {
margin: 0;
}
.prices p {
margin: 1.5em 0;
}
.price-form1 {
display: flex;
flex-wrap: wrap;
position: relative;
}
.price-form11,
.form11 {
width: 50%;
box-sizing: border-box;
padding: 0 1.6em 1em 0;
position: relative;
}
.price-form12,
.form12 {
padding: 0 1.6em 0 0;
position: relative;
width: 100%;
box-sizing: border-box;
}
.price-form input[type="submit"],
.form1 input[type="submit"] {
margin: 2em 0 0 0;
}
.message {
margin: 1em 0 0 0;
}
.form-loading:after {
content: "";
position: absolute;
bottom: 5px;
left: 50%;
background: url(//sivututka.fi/wp-content/themes/sivututka/images/loading.gif) no-repeat center center;
background-size: 30px 30px;
width: 30px;
height: 30px;
transform: translate(-50%,0);
}
.prices .form-loading:after {
left: 0;
transform: none
}
.help-block {
width: 100%;
margin: 1em 0;
}
.help-block p {
background: #eee;
padding: 0.5em 1em;
border-left: 2px solid #f4325f;
margin: 0;
}
.prices12 {
width: 50%;
padding: 5em 0 0 3.125em;
box-sizing: border-box;
text-align: center;
}
.prices121 {
width: 26em;
height: 26em;
margin: 0 auto;
border-radius: 50%;
box-shadow: 0 0 3.125em rgba(0,0,0,0.15);
display: flex;
justify-content: center;
align-items: center;
position: -webkit-sticky;
position: sticky;
top: 5em;
z-index: 1;
}
.prices121-bg {
position: absolute;
top: 50%;
left: 50%;
background: #fff;
border-radius: 50%;
transform: translate(-50%,-50%);
z-index: -1;
width: 100%;
height: 100%;
}
.prices121-pulse {
content: "";
position: absolute;
top: 50%;
left: 50%;
border: 0.75em solid rgba(0,0,0,0.05);
border-radius: 50%;
transform: translate(-50%,-50%);
width: 95%;
height: 95%;
box-sizing: border-box;
animation: pulse 8s infinite;
animation-timing-function: linear;
z-index: -2;
}
.pulse2 {
animation-delay: 2s;
}
.pulse3 {
animation-delay: 4s;
}
.pulse4 {
animation-delay: 6s;
}
.pulse5 {
animation-delay: 8s;
}
.prices12 p {
margin: 0;
color: #999;
}
.price-amount {
font-size: 2.22em;
position: relative;
}
.price-amount:after {
content: "+alv";
position: absolute;
bottom: 0;
right: -0.5em;
transform: translate(100%,-25%);
color: #999;
font-size: 1.125rem;
}
@keyframes pulse {
0% {
width: 95%;
height: 95%;
opacity: 1;
}
100% {
width: 140%;
height: 140%;
opacity: 0;
}
}
.hover-explainer {
position: absolute;
top: -0.5em;
transform: translate(0,-100%);
background: #2e294e;
visibility: hidden;
opacity: 0;
cursor: auto;
z-index: 99;
}
.hover-explainer:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: #2e294e transparent transparent transparent;
transform: translate(30%,100%);
}
.hover-explainer p {
margin: 0;
font-size: 0.889em;
color: #fff;
padding: 1em;
}
.price-form .gfield_checkbox li:hover .hover-explainer,
.price-form .gfield_radio li:hover .hover-explainer {
visibility: visible;
opacity: 1;
} #gallery1 {
display: flex;
flex-wrap: wrap;
margin: 4em 0 0 0;
}
#gallery1 a {
width: 50%;
overflow: hidden;
}
#gallery1 a:nth-child(3n) {
width: 100%;
}
#gallery1 img {
display: block;
width: 100%;
}
#gallery1 a:hover img,
#gallery1 a:focus img {
transform: scale(1.05);
} .hero3-content {
margin: 3.125em 0 0 0;
max-width: 34.375em;
animation-delay: 0.6s;
}
.customers {
padding: 0 0 5em 0;
overflow: hidden;
text-align: center;
}
.customers1 {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.customers11 {
width: 25%;
padding: 1em;
display: flex;
align-items: center;
justify-content: center;
position: relative;
margin: 4em 0;
}
.customers11 img {
max-width: 14em;
display: block;
margin: 0 auto;
}
.small-logo img {
max-width: 12em;
}
.smaller-logo img {
max-width: 9em;
}
img.customer-background {
position: absolute;
width: auto;
max-width: 20em;
top: 50%;
left: 50%;
transform: translate(-50%,-50%) rotateY(90deg);
z-index: -1;
border-radius: 50%;
opacity: 0;
visibility: hidden;
}
.customers11:hover img.customer-background {
transform: translate(-50%,-50%) rotateY(0);
opacity: 1;
visibility: visible;
}
.customers11:hover img.customer-logo {
filter: brightness(0) invert(1) drop-shadow(0 0 6px rgba(0,0,0,0.5));
}
.page-template-tyot .customers {
padding-top: 8em;
} .hero4-header .entry-header11 {
padding: 0;
}
.hero4-header .entry-header1 {
margin-bottom: 0;
}
.header-links {
margin: 0 0 1em 0;
animation-delay: 0.2s;
}
.site-content .header-links a {
background-image: none;
}
.site-content .header-links a:hover {
color: #f4325f;
} .henkilosto {
background: #f9f9f9;
padding: 3.125em 0;
margin: 5em 0 0 0;
}
.henkilot {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.henkilo1 {
width: 50%;
box-sizing: border-box;
padding: 3.125em;
}
.henkilo1:nth-child(even) {
padding: 3.125em 0 3.125em 6.25em;	
}
.henkilo11 {
position: relative;
background-size: cover;
background-repeat: no-repeat;
background-position: center top;
}
.henkilo-animation {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(//sivututka.fi/wp-content/themes/sivututka/images/glitch.gif) no-repeat center center;
background-size: cover;
display: none;
}
.change-screen .henkilo-animation {
background: url(//sivututka.fi/wp-content/themes/sivututka/images/glitch.gif) no-repeat center center;
background-size: initial;
background-repeat: repeat;
}
.change-screen.glitch .henkilo-animation {
display: block;
}
.henkilo111 {
position: absolute;
left: -3.125em;
bottom: 3.125em;
background: #fff;
padding: 2.5em 3.125em;
box-shadow: 0 0 3.125em rgba(0,0,0,0.15);
}
.henkilo1 img {
display: block;
width: 100%;
}
.henkilo1 h3 {
margin: 0 0 0.5em 0;
line-height: 1;
}
.henkilo111 p {
margin: 1em 0 0.75em 0;
}
.henkilo111 p:last-child {
margin: 0;
}
.henkilo1 button {
position: absolute;
top: 0.625em;
right: 0.625em;
padding: 0;
width: 2.25em;
height: 2.25em;
border-radius: 50%;
box-sizing: border-box;
border-color: #f4325f;
}
.henkilo1 button:before,
.henkilo1 button:after {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 1.125em;
height: 2px;
background: #f4325f;
transform: translate(-50%,-50%);
}
.henkilo1 button:after {
transform: translate(-50%,-50%) rotate(90deg);
}
.henkilo1 button:hover:before,
.henkilo1 button:hover:after,
.henkilo1 button:focus:before,
.henkilo1 button:focus:after {
background: #fff;
}
.henkilo11:hover img {
opacity: 0;
}
.henkilo11:hover .henkilo-animation {
display: block;
-webkit-animation: glitch-animation 0.5s; -moz-animation:    glitch-animation 0.5s; -o-animation:      glitch-animation 0.5s; animation:         glitch-animation 0.5s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
}
@keyframes glitch-animation {
0% { opacity: 1; }
70% { opacity: 1; }
100% { opacity: 0; }
}
.henkilosto-modals .menu-modal1,
.henkilosto-modals .menu-modal2 {
z-index: 99999;
background-size: cover;
background-repeat: no-repeat;
background-position: center top;
}
.henkilo-modal-close {
border: none;
background: #fff;
padding: 0;
width: 2.5em;
height: 2.5em;
border-radius: 50%;
box-sizing: border-box;
position: absolute;
top: 1.2em;
right: 1.56em;
font-size: 1em;
z-index: 100;
}
.henkilo-modal-close:hover {
background: #f4325f;
}
.henkilo-modal-close:before,
.henkilo-modal-close:after {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 1.125em;
height: 2px;
background: #2e294e;
transform: translate(-50%,-50%) rotate(45deg);
}
.henkilo-modal-close:after {
transform: translate(-50%,-50%) rotate(135deg);
}
.mobile-some {
display: none;
} .content-client {
display: none;
}
.content-client.is-active {
display: flex;
}
.content-client .content1211 img {
border-radius: 50%;
}
.content12logos {
display: flex;
width: 100%;
flex-wrap: wrap;
justify-content: center;
align-items: center;
margin: 3em auto 8em;
}
.logo-accordion {
opacity: .5;
transition: .2s all ease;
}
.logo-accordion:hover {
opacity: 1;
cursor: pointer;
}
.logo-accordion.is-active {
opacity: 1;
}
.content12logos img {
padding: 1em 2em;
}
.content-how-we-do-things {
padding: 0 0 4em 0;
} .new-logos {
position: fixed;
top: 50%;
right: 0;
z-index: 99;
display: flex;
transform: rotate(-90deg) translate(50%, 0);
transform-origin: right bottom;
}
.new-logos__link {
display: flex;
background: #2e294e;
padding: 0.5rem 1rem;
border-top-left-radius: 0.25rem;
border-top-right-radius: 0.25rem;
transition: all 0.2s ease;
align-items: center;
justify-content: center;
margin: 0 0.5rem;
order: calc(1000 * random());
}
.new-logos__link:hover,
.new-logos__link:focus {
background: #f4325f;
}
.new-logos svg {
display: block;
max-width: 8rem;
max-height: 2.25rem;
height: auto;
width: auto;
}
.new-logos__link--arcode svg {
max-width: 7rem;
} .new-modal {
position: fixed;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.3);
display: flex;
align-items: center;
justify-content: center;
top: 0;
left: 0;
z-index: 999999;
overflow: auto;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
}
.new-modal--open {
opacity: 1;
visibility: visible;
}
.new-modal__content {
margin: 1rem;
width: 100%;
max-width: 50rem;
padding: 6rem 2rem 3rem 2rem;
background: #fff;
border-radius: 1rem;
position: relative;
box-shadow: 0px 0px 26px rgba(0, 0, 0, 0.05);
}
.new-modal__content-inner {
max-width: 40rem;
margin: 0 auto;
}
.new-modal h2 {
margin-top: 0;
}
.new-modal__signs {
display: flex;
flex-wrap: wrap;
margin: 2rem 0 0 0;
}
.new-modal__signs a {
display: block;
margin: 0 2rem 0.5rem 0;
}
.new-modal__signs svg {
display: block;
}
.new-modal__close {
border: none;
padding: 0 2rem 0 0;
position: absolute;
top: 2rem;
right: 2rem;
font-family: 'Avenir-Next-Medium', sans-serif;
font-size: 16px;
font-size: 1rem;
line-height: 1.55;
letter-spacing: -0.015em;
color: #2F2A4F;
font-weight: 400;
transition: all 0.2s ease;
}
.new-modal__close::after,
.new-modal__close::before {
content: "";
position: absolute;
top: 45%;
right: 0;
width: 1rem;
height: 2px;
background: #2F2A4F;
transform: translate(-50%, 0) rotate(45deg);
transition: all 0.2s ease;
}
.new-modal__close::before {
transform: translate(-50%, 0) rotate(-45deg);
}
.new-modal__close:hover,
.new-modal__close:focus {
background: transparent;
color: #F43864;
}
.new-modal__close:hover::after,
.new-modal__close:focus::after,
.new-modal__close:hover::before,
.new-modal__close:focus::before {
background: #F43864;
} @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.browser svg {
display: none;
}
.prices121 {
position: relative;
}
.site {
overflow: hidden;
}
} @supports (-ms-ime-align:auto) {
.prices121-pulse {
animation: none;
display: none;
}
.prices121-bg,
.topscroll {
display: none;
}
.content2 {
overflow: hidden;
}
}  @media only screen and (min-width: 87.5625em) {
} @media only screen and (max-width: 87.5em) {
.menu-modal1, .menu-modal2 {
padding: 0;
}
} @media only screen and (max-width: 75em) {
.blogposts111 {
padding: 1.5em 2em;
top: -2em;
right: -2em;
}
.blogposts11:nth-child(odd) {
padding: 2em 4em 0 0;
}
.blogposts11:nth-child(even) {
padding: 2em 2em 0 2em;
}
.blogposts1 h3 {
margin: 0 0 1.2em 0;
}
.footer23 a {
margin: 0 0 0 0.75em;
}
.prices121 {
width: 22em;
height: 22em;
}
.customers11 {
width: 33%;
}
} @media only screen and (max-width: 68.75em) {
.content111 {
padding: 5em 0;
}
.main-navigation a {
padding: 1em .6em;
}
} @media only screen and (max-width: 62em) {
.new-logos {
top: auto;
bottom: 0;
right: 50%;
transform: translate(50%, 0);
transform-origin: initial;
}
.hyvaquote {
margin: 6em 0;
}
.main-navigation,
.site-nav,
.prices121-pulse,
.mobilehide {
display: none;
}
.footer21,
.footer22,
.footer23,
.footer31,
.footer32,
.content211,
.price-form11,
.form11 {
width: 100%;
}
.site-header-wrapper {
padding: 1.5em;
}
.menu-modal21 li {
width: 100%;
padding-right: 0;
}
.modal12 a {
padding: 0.75em 0;
}
.work2 {
padding-left: 2.5em;
}
.browser-screen {
height: 18em;
}
.mobile {
width: 8em;
height: 16.77em;
border-radius: 1em;
overflow: hidden;
}
.mobile-screen {
height: 13.5em;
}
.footer21 {
text-align: center;
}
.footer21 a {
display: inline-block;
}
.footer21 svg {
margin: 0 auto;
}
.footer22 {
margin: 2em 0;
}
.footer23 {
width: 100%;
justify-content: center;
}
.footer23 a {
margin: 0 0.75em;
}
.footer31,
.footer32 {
text-align: center;
}
.footer32 {
justify-content: center;
}
.footer3 p {
justify-content: center;
margin: 0 0 2em 0;
}
.topscroll {
top: initial;
bottom: 7.5em;
}
.topscroll-activate {
-webkit-animation: topscroll-activate-mobile 1.2s; -moz-animation:    topscroll-activate-mobile 1.2s; -o-animation:      topscroll-activate-mobile 1.2s; animation:         topscroll-activate-mobile 1.2s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
animation-timing-function: ease;
}
.entry-header11 {
padding: 6.25em 1.5em 3.125em 0;
}
.entry-header12 {
padding: 0 0 0 1.5em;
}
.content112 {
padding-left: 18%;
}
.content121 {
align-items: flex-end;
}
.content1211 img {
max-width: 100%;
}
.content1212 {
padding: 3em 0;
}
.content21 p {
position: relative;
bottom: initial;
left: initial;
transform: rotate(10deg) scale(0.5) translate(0,0);
max-width: 45em;
margin: 0 auto;
}
.content211:hover p, .content211-active p {
transform: rotate(0deg) translate(0,0);
}
.content22 {
margin: -6em 0 20em 0;
}
.content2211 {
padding: 0 3.125em 0 0;
}
.content23 {
margin: 3.125em auto 0 auto;
}
.price-form11,
.form11,
.price-form12,
.form12 {
padding-right: 0;
}
.site-header-wrapper {
padding: 1.5em 1em;
}
.menu-toggle {
right: 1em;
}
.henkilo1 {
padding: 3em 0 3em 3em;
}
.henkilo1:nth-child(even) {
padding: 3em 0 3em 3em;
}
.henkilo111 {
left: -1.5em;
bottom: 1.5em;
width: 100%;
padding: 2em 1.5em;
}
.henkilosto-modals .menu-modal2 .modal12 {
flex-wrap: wrap;
}
.leveasisalto {
margin: 3em 0;
}
} @media only screen and (max-width: 48em) {
.hyvaquote {
margin: 6em 0em;
}
.browser,
.hover-explainer {
display: none;
}
.entry-header:before {
content: none;
}
.entry-header11 {
padding: 3.125em 1.5em 3.125em 0;
}
.entry-header121 {
padding: 0 1.5em 0 0;
}
.entry-header121-lyhennetty:after {
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
}
.mobile {
position: relative;
right: auto;
bottom: auto;
width: 9.75em;
height: 20.44em;
border-radius: 1.5em;
}
.mobile-screen {
height: 16.5em;
}
.floating-area {
margin-top: 0;
}
.work21:last-child {
padding-bottom: 11em;
}
.menu-modal11,
.menu-modal21 {
padding: 4.125em 2.5em;
}
.blogposts11:nth-child(even),
.blogposts11:nth-child(odd) {
padding: 2em 2em 0 0;
}
.footer1 {
height: 24em;
}
.footer22 a {
width: 100%;
display: block;
text-align: center;
padding: 0.5em 0;
}
.footer22 a:after {
top: initial;
bottom: 0;
right: 50%;
}
.home .site-footer, .page-template-tyot .site-footer, .page-template-idealabra .site-footer, .page-template-meista .site-footer, .blog .site-footer, .archive .site-footer, .single-post .site-footer, .page-template-hall-of-fame .site-footer, .single-tyot .site-footer {
padding-top: 16em;
margin-top: 20em;
}
.content112 {
padding-left: 6em;
}
.prices11 {
order: 2;
width: 100%;
}
.prices12 {
width: 100%;
order: 1;
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 10;
padding: 0;
background: #fff;
border-bottom: 2px solid #f1f1f1;
margin: 0 0 4em 0;
}
.prices121 {
width: auto;
height: auto;
box-shadow: none;
border-radius: 0;
position: relative;
top: 0;
justify-content: flex-start;
text-align: left;
}
.footer3 p a {
margin: 0.35em 0;
}
.inner-page-links {
flex-wrap: wrap;
}
.inner-page-links p {
width: 100%;
margin: 0 0 0.75em 0;
padding: 0 0 0.75em 0;
}
.inner-page-links p:after {
width: 1.75em;
height: 4px;
top: auto;
bottom: 0;
right: auto;
left: 0;
transform: translate(0,50%);
}
.content111,
.content112,
.blogposts11,
.entry-header11,
.entry-header12 {
width: 100%;
}
.work2 {
width: 75%;
}
.customers11 {
width: 50%;
}
.work1 {
width: 25%;
}
.price-amount:after {
font-size: 1rem;
}
p, ul, ol, h4, .h4, input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea, select, .select-selected {
font-size: 1.25em;
}
.menu-modal111 .excerpt {
font-size: 1.125em;
}
} @media only screen and (max-width: 37.5em) {
.menu-modal1,
.footer1111 .tooltip {
display: none;
}
.henkilo1 {
width: 100%;
}
.work2 {
width: 65%;
}
.work1 {
width: 35%;
}
.menu-modal2,
.menu-modal2 .modal12 {
width: 80%;
max-width: 335px;
right: -80%;
z-index: 100;
}
.menu-modal21 {
padding: 2.5em 2.5em 7em 2.5em;
}
.menu-modal2.animation-right,
.menu-modal2 .modal12.animation-right {
-webkit-animation: modal-right-appear-mobile 0.5s; -moz-animation:    modal-right-appear-mobile 0.5s; -o-animation:      modal-right-appear-mobile 0.5s; animation:         modal-right-appear-mobile 0.5s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
animation-timing-function: ease-in;
}
.menu-modal2.reverse-animation-right,
.menu-modal2 .modal12.reverse-animation-right {
-webkit-animation: modal-right-remove-mobile 0.5s; -moz-animation:    modal-right-remove-mobile 0.5s; -o-animation:      modal-right-remove-mobile 0.5s; animation:         modal-right-remove-mobile 0.5s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
animation-timing-function: ease-in;
}
.footer1 {
height: 19em;
}
.home .site-footer, .page-template-tyot .site-footer, .page-template-idealabra .site-footer, .page-template-meista .site-footer, .blog .site-footer, .archive .site-footer, .single-post .site-footer, .page-template-hall-of-fame .site-footer, .single-tyot .site-footer {
padding-top: 14em;
margin-top: 16em;
}
.footer1111 {
text-align: center;
width: 100%;
}
.content1211 {
width: 100%;
order: 2;
}
.content1212 {
width: 100%;
orphans: 1;
}
.content2211 {
padding: 0 1.5625em 0 0;
width: 50%;
box-sizing: border-box;
}
.content2212 {
padding: 0 0 0 1.5625em;
width: 50%;
box-sizing: border-box;
}
.henkilo111 {
left: -3em;
bottom: 3em;
width: 100%;
padding: 2em 3em;
}
.mobile-some {
display: flex;
flex-wrap: wrap;
margin: 0 0 0.5em 0;
}
.mobile-some a {
margin: 0 1em 0.5em 0;
}
.mobile-some a svg path {
fill: #f4325f;
}
.mobile-some a:hover svg path,
.mobile-some a:focus svg path {
fill: #fff;
}
.menu-modal21 h3 {
margin: 0.5em 0 1em 0;
}
h1, .h1 {
font-size: 3em;
}
h2,	.h2 {
font-size: 2.25em;	
}
} @media only screen and (max-width: 30em) {
.footer1 {
height: 17em;
}
.topscroll svg {
width: 18px;
height: 30px;
}
.content112 {
padding-left: 2em;
}
.content2211 {
padding: 0 1em 0 0;
}
.content2212 {
padding: 0 0 0 1em;
}
.content23 {
margin: 2em auto 0 auto;
}
.single-post .entry-header12 {
padding: 0 0 0 0.88em;
}
.customers11 {
width: 100%;
}
h1, .h1 {
font-size: 2.75em;
}
h2,	.h2 {
font-size: 2em;	
}
h3,	.h3 {
font-size: 1.75em;
}
} @media only screen and (max-width: 25em) {
.footervideo,
.menu-modal2 .modal12 a svg {
display: none;
}
.work1 {
width: 30%;
}
.work2 {
width: 70%;
padding-left: 1.5em;
}
.mobile {
width: 7.25em;
height: 15.2em;
border-radius: 0.9em;
}
.mobile-screen {
height: 12em;
}
.footer1 {
padding: 5em 0;
height: auto;
background-image: url(//sivututka.fi/wp-content/themes/sivututka/videos/footer-video1-bg.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.topscroll {
bottom: 5.5em;
}
.topscroll-activate {
-webkit-animation: topscroll-activate-mobile2 1.2s; -moz-animation:    topscroll-activate-mobile2 1.2s; -o-animation:      topscroll-activate-mobile2 1.2s; animation:         topscroll-activate-mobile2 1.2s; animation-iteration-count: 1;
animation-fill-mode: forwards;
-webkit-animation-fill-mode: forwards;
animation-timing-function: ease;
}
h1, .h1 {
font-size: 2.25em;
}
h2,	.h2 {
font-size: 1.75em;	
}
h3,	.h3 {
font-size: 1.5em;
}
} @media only screen and (max-width: 20em) {
}
.blueimp-gallery,.blueimp-gallery>.slides>.slide>.slide-content{position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:opacity .2s linear;-moz-transition:opacity .2s linear;-ms-transition:opacity .2s linear;-o-transition:opacity .2s linear;transition:opacity .2s linear;backface-visibility:hidden;-moz-backface-visibility:hidden}.blueimp-gallery>.slides>.slide>.slide-content{margin:auto;width:auto;height:auto;max-width:100%;max-height:100%;opacity:1}.blueimp-gallery{position:fixed;z-index:999999;overflow:hidden;background:#000;background:rgba(0,0,0,.9);opacity:0;display:none;direction:ltr;-ms-touch-action:none;touch-action:none}.blueimp-gallery-carousel{position:relative;z-index:auto;margin:1em auto;padding-bottom:56.25%;box-shadow:0 0 10px #000;-ms-touch-action:pan-y;touch-action:pan-y}.blueimp-gallery-display{display:block;opacity:1}.blueimp-gallery>.slides{position:relative;height:100%;overflow:hidden}.blueimp-gallery-carousel>.slides{position:absolute}.blueimp-gallery>.slides>.slide{position:relative;float:left;height:100%;text-align:center;-webkit-transition-timing-function:cubic-bezier(.645,.045,.355,1);-moz-transition-timing-function:cubic-bezier(.645,.045,.355,1);-ms-transition-timing-function:cubic-bezier(.645,.045,.355,1);-o-transition-timing-function:cubic-bezier(.645,.045,.355,1);transition-timing-function:cubic-bezier(.645,.045,.355,1)}.blueimp-gallery>.slides>.slide-loading{background:url(//sivututka.fi/wp-content/themes/sivututka/img/loading.gif) center no-repeat;background-size:64px 64px}.blueimp-gallery>.slides>.slide-loading>.slide-content{opacity:0}.blueimp-gallery>.slides>.slide-error{background:url(//sivututka.fi/wp-content/themes/sivututka/img/error.png) center no-repeat}.blueimp-gallery>.slides>.slide-error>.slide-content{display:none}.blueimp-gallery>.next,.blueimp-gallery>.prev{position:absolute;top:50%;left:15px;width:40px;height:40px;margin-top:-23px;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:60px;font-weight:100;line-height:30px;color:#fff;text-decoration:none;text-shadow:0 0 2px #000;text-align:center;background:#222;background:rgba(0,0,0,.5);-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;border:3px solid #fff;-webkit-border-radius:23px;-moz-border-radius:23px;border-radius:23px;opacity:.5;cursor:pointer;display:none}.blueimp-gallery>.next{left:auto;right:15px}.blueimp-gallery>.close,.blueimp-gallery>.title{position:absolute;top:15px;left:15px;margin:0 40px 0 0;font-size:20px;line-height:30px;color:#fff;text-shadow:0 0 2px #000;opacity:.8;display:none}.blueimp-gallery>.close{padding:15px;right:15px;left:auto;margin:-15px;font-size:30px;text-decoration:none;cursor:pointer}.blueimp-gallery>.play-pause{position:absolute;right:15px;bottom:15px;width:15px;height:15px;background:url(//sivututka.fi/wp-content/themes/sivututka/img/play-pause.png) 0 0 no-repeat;cursor:pointer;opacity:.5;display:none}.blueimp-gallery-playing>.play-pause{background-position:-15px 0}.blueimp-gallery-controls>.close,.blueimp-gallery-controls>.next,.blueimp-gallery-controls>.play-pause,.blueimp-gallery-controls>.prev,.blueimp-gallery-controls>.title{display:block;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.blueimp-gallery-left>.prev,.blueimp-gallery-right>.next,.blueimp-gallery-single>.next,.blueimp-gallery-single>.play-pause,.blueimp-gallery-single>.prev{display:none}.blueimp-gallery>.close,.blueimp-gallery>.next,.blueimp-gallery>.play-pause,.blueimp-gallery>.prev,.blueimp-gallery>.slides>.slide>.slide-content{-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.blueimp-gallery>.close:hover,.blueimp-gallery>.next:hover,.blueimp-gallery>.play-pause:hover,.blueimp-gallery>.prev:hover,.blueimp-gallery>.title:hover{color:#fff;opacity:1}body:last-child .blueimp-gallery>.slides>.slide-error{background-image:url(//sivututka.fi/wp-content/themes/sivututka/img/error.svg)}body:last-child .blueimp-gallery>.play-pause{width:20px;height:20px;background-size:40px 20px;background-image:url(//sivututka.fi/wp-content/themes/sivututka/img/play-pause.svg)}body:last-child .blueimp-gallery-playing>.play-pause{background-position:-20px 0}*+html .blueimp-gallery>.slides>.slide{min-height:300px}*+html .blueimp-gallery>.slides>.slide>.slide-content{position:relative}.blueimp-gallery>.indicator{position:absolute;top:auto;right:15px;bottom:15px;left:15px;margin:0 40px;padding:0;list-style:none;text-align:center;line-height:10px;display:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.blueimp-gallery>.indicator>li{display:inline-block;width:9px;height:9px;margin:6px 3px 0 3px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;border:1px solid transparent;background:#ccc;background:rgba(255,255,255,.25) center no-repeat;border-radius:5px;box-shadow:0 0 2px #000;opacity:.5;cursor:pointer}*+html .blueimp-gallery>.indicator>li{display:inline}.blueimp-gallery>.indicator>.active,.blueimp-gallery>.indicator>li:hover{background-color:#fff;border-color:#fff;opacity:1}.blueimp-gallery>.indicator>li:after{opacity:0;display:block;position:absolute;content:'';top:-5em;width:75px;height:75px;transition:transform .6s ease-out,opacity .4s ease-out;transform:translateX(-50%) translateY(0) translateZ(0);pointer-events:none}.blueimp-gallery>.indicator>li:hover:after{opacity:1;border-radius:50%;background:inherit;transform:translateX(-50%) translateY(-5px) translateZ(0)}.blueimp-gallery>.indicator>.active:after{display:none}.blueimp-gallery-controls>.indicator{display:block;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.blueimp-gallery-single>.indicator{display:none}.blueimp-gallery>.slides>.slide>.video-content>img{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:auto;height:auto;max-width:100%;max-height:100%;backface-visibility:hidden;-moz-backface-visibility:hidden}.blueimp-gallery>.slides>.slide>.video-content>video{position:absolute;top:0;left:0;width:100%;height:100%;display:none}.blueimp-gallery>.slides>.slide>.video-content>iframe{position:absolute;top:100%;left:0;width:100%;height:100%;border:none}.blueimp-gallery>.slides>.slide>.video-playing>iframe{top:0}.blueimp-gallery>.slides>.slide>.video-content>a{position:absolute;top:50%;right:0;left:0;margin:-64px auto 0;width:128px;height:128px;background:url(//sivututka.fi/wp-content/themes/sivututka/img/video-play.png) center no-repeat;opacity:.8;cursor:pointer}.blueimp-gallery>.slides>.slide>.video-playing>a,.blueimp-gallery>.slides>.slide>.video-playing>img{display:none}.blueimp-gallery>.slides>.slide>.video-playing>video{display:block}.blueimp-gallery>.slides>.slide>.video-loading>a{background:url(//sivututka.fi/wp-content/themes/sivututka/img/loading.gif) center no-repeat;background-size:64px 64px}*+html .blueimp-gallery>.slides>.slide>.video-content{height:100%}*+html .blueimp-gallery>.slides>.slide>.video-content>a{left:50%;margin-left:-64px}.blueimp-gallery>.slides>.slide>.video-content>a:hover{opacity:1}body:last-child .blueimp-gallery>.slides>.slide>.video-content:not(.video-loading)>a{background-image:url(//sivututka.fi/wp-content/themes/sivututka/img/video-play.svg)}