html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0}
article,aside,footer,header,nav,section{display:block}
h1{font-size:2em;margin:0.67em 0}
figcaption,figure,main{display:block}
figure{margin:1em 40px}
hr{box-sizing:content-box;height:0;overflow:visible}
pre{font-family:monospace,monospace;font-size:1em}
a{background-color:transparent;-webkit-text-decoration-skip:objects}
a:active,a:hover{outline-width:0}
abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
b,strong{font-weight:inherit}
b,strong{font-weight:bolder}
code,kbd,samp{font-family:monospace,monospace;font-size:1em}
dfn{font-style:italic}
mark{background-color:#ff0;color:#000}
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}
audio,video{display:inline-block}
audio:not([controls]){display:none;height:0}
img{border-style:none}
svg:not(:root){overflow:hidden}
button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}
button,input{overflow:visible}
button,select{text-transform:none}
button,html [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{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}
legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}
progress{display:inline-block;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-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
details,menu{display:block}
summary{display:list-item}
canvas{display:inline-block}
template{display:none}
[hidden]{display:none}
*{box-sizing:border-box;margin:0;padding:0}
html{text-rendering:optimizeLegibility}
body{background-color:#fafafa;color:#111;font-family:"PT Sans",sans-serif}
main,footer{text-align:center}
main{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-top:2.5rem}
section{padding:2.5rem 1.25rem}
article{padding:1.25rem 0}
p{padding:.5rem 0}
footer{padding:1rem}
.hide{display:none}
.hr{border-bottom:3px double #555;border-top:3px double #555;display:block;height:7px;margin:1rem auto;max-width:35rem;width:100%}
.box{background-color:#fff;border-style:solid;border-width:.5rem 0 0 0}
.button{background-color:#111;border:2px solid #111;border-radius:2px;color:#fff;cursor:pointer;display:inline-block;margin:1rem auto .5rem;max-width:125px;padding:1rem;text-decoration:none;width:100%}
.button:hover,.button:active,.button:focus{background-color:#889}
.button:hover{box-shadow:5rem -5rem 10rem 0 #556}
.button:active{color:#fff}
.button:focus{border-color:#111;box-shadow:5rem -5rem 10rem 0 #000;color:#111;outline:none}
.cta-pretext{font-size:2rem;text-transform:uppercase}
.cta-pretext .insist{color:#889;display:block;margin:1rem 0;text-transform:none}
.cta{display:block;font-size:1.25rem;margin:2rem auto;max-width:300px;padding:1.5rem;text-align:center;text-decoration:none}
.cta:hover,.cta:active,.cta:focus{box-shadow:none}
h1,.nav-page-link,#nav-footer a{font-family:"Raleway",sans-serif}
h2,h3,h4{font-family:"Ruda",sans-serif}
h1{font-size:1.5rem;text-transform:uppercase}
h1::-moz-selection,h2::-moz-selection,h3::-moz-selection,h4::-moz-selection,a::-moz-selection,p::-moz-selection,span::-moz-selection{background-color:#889;color:#fff}
h1::selection,h2::selection,h3::selection,h4::selection,a::selection,p::selection,span::selection{background-color:#889;color:#fff}
#nav-page-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;position:fixed;top:0;bottom:0;left:0;right:0;z-index:-5}
#nav-page-wrapper.visible{z-index:10}
.nav-page-link{-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#889;border:3px double #fff;color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;height:0;position:absolute;text-decoration:none;-webkit-transition:.6s;transition:.6s;visibility:hidden;width:0}
.nav-page-link:hover{background-color:#fff;border:3px double #889;color:#889}
.nav-page-link.visible{height:50vh;visibility:visible;width:50%}
.nav-page-link span{margin:auto}
#nav-page-link-up-left,#nav-page-link-up-right{top:0}
#nav-page-link-bottom-left,#nav-page-link-bottom-right{bottom:0}
#nav-page-link-up-left,#nav-page-link-bottom-left{left:-100%}
#nav-page-link-up-right,#nav-page-link-bottom-right{right:-100%}
#nav-page-link-up-left.visible,#nav-page-link-bottom-left.visible{left:0}
#nav-page-link-up-right.visible,#nav-page-link-bottom-right.visible{right:0}
#nav-page-close{height:0;position:absolute;top:-50%;left:50%;-webkit-transition:.6s;transition:.6s;visibility:hidden;width:0}
#nav-page-close span{display:none}
#nav-page-close.clicked{background-color:#111;border:3px double #111;color:#fff;cursor:pointer;height:4rem;margin:-2rem 0;top:50%;left:-2.5%;right:-2.5%;visibility:visible;width:105%;z-index:15}
#nav-page-close.clicked:hover{background-color:#fff;border-color:#889;color:#889}
#nav-page-close.clicked:focus{outline:none}
#nav-page-close.clicked span{display:inline-block;font-size:2rem;position:relative;top:0;bottom:0;left:0;right:0;width:100%}
#nav-footer{background-color:#556;border-color:#f6f6f6;border-style:double;border-width:1rem 0;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;padding:1rem 1rem 1.5rem}
#nav-footer a{background-color:#fff;border:3px solid #fff;color:#556;font-size:.95rem;margin:.5rem auto;padding:.5rem;text-align:center;font-weight:700;text-decoration:none;-webkit-transition:.3s ease;transition:.3s ease;white-space:nowrap;width:45%}
#nav-footer a:hover{border:3px solid #889;color:#889}
#nav-footer a:active{border:3px solid #111;color:#111}
.navbar{background-color:#fff;border-bottom:3px solid #889;color:#111;height:2.65rem;position:fixed;top:0;bottom:auto;right:0;left:0;text-align:center;z-index:5}
#navbar-button{background-color:#fff;border-color:transparent #889 #889 #889;border-style:solid;border-width:3px;border-radius:50%;color:#889;cursor:pointer;padding:1rem;position:relative}
#navbar-button:focus{outline:none}
.logo{display:-webkit-box;display:-ms-flexbox;display:flex;margin:0 auto;padding:1rem 0 2rem;text-align:center}
.logo-img{-webkit-animation:animateLogo 1s linear infinite 0s alternate;animation:animateLogo 1s linear infinite 0s alternate;margin:auto;height:2rem;width:2rem}
#intro{background-color:#111;background-image:url('/web/20230112234932im_/https://www.jpinteractive.eu/v/media/other/wave_by_dave_whyte.gif');background-repeat:no-repeat;background-position:center center;background-size:cover;position:relative;width:100%;z-index:0}
#intro::after{background-color:#111;background-color:rgba(17,17,17,0.99);content:'';position:absolute;top:0;bottom:0;left:0;right:0;z-index:-5}
#intro-header .logo-img{display:none}
#intro-header .logo-txt{border-top:.25rem solid #889;color:#fff;display:inline-block;font-size:1.5rem;padding:1rem 0 0;text-align:center}
#intro-wrapper{background-color:#fff;border-left:.5rem solid #889;display:inline-block;padding:1rem}
#intro-title{color:#555;font-size:.9rem;letter-spacing:-.5px;margin:.25rem auto;text-transform:uppercase}
#intro-description{font-size:1.1rem;line-height:1.3;margin:.5rem 0 0}
#intro .button{border:.5rem double #889;display:block;margin-top:2rem;height:60px;padding:0;-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg);width:60px}
#intro .button:hover,#intro .button:active,#intro .button:focus{border-color:#111}
#intro .button span{color:#889;display:inline-block;font-size:.7rem;font-weight:700;text-transform:uppercase;-webkit-transform:rotateZ(-45deg);transform:rotateZ(-45deg)}
#intro .button:hover span,#intro .button:active span,#intro .button:focus span{color:#111}
#motto{border-color:#555;margin-top:2rem}
#motto i{color:#889}
#motto p{color:#555;font-size:1.5rem}
#team{background-color:#889;padding:2rem 0}
#team figure{cursor:pointer;margin:2rem auto;max-width:200px;position:relative}
#team figure:hover figcaption{background-color:#fafafa;border-color:#555;bottom:0;height:100%}
#team figure img,#team figcaption{border-radius:1rem}
#team figure img{border:2px solid #555;width:100%}
#team figcaption{background-color:transparent;border:2px solid transparent;height:0;overflow:hidden;position:absolute;top:0;bottom:100%;left:0;right:0;-webkit-transition:all .5s ease;transition:all .5s ease;width:100%}
#team .thumb-details{overflow:hidden;position:absolute;left:50%;text-transform:capitalize;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
.member-name{font-size:1.25rem;top:30%}
.member-role,.member-social{color:#555}
.member-role{font-size:.95rem;top:55%}
.member-social{border:1px dotted #555;font-size:.75rem;padding:5px 7px;text-decoration:none;top:75%}
.fa-external-link{display:inline-block;font-size:.5rem;margin-left:1px;vertical-align:text-top}
#team p{color:#fff;font-size:1.65rem;line-height:1.1;margin:0 2rem}
#team a{display:block;text-decoration:none}
#trusted-by{padding:3rem 0}
#trusted-by img{max-width:150px;padding:.5rem;vertical-align:middle}
#projects{margin-top:1rem;margin-bottom:0;padding-bottom:0}
#projects ul{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:2.5rem 0}
#projects li{border-color:#555;list-style:none;margin:1rem auto;padding:2rem}
#projects li:nth-child(even){border-color:#889}
.project-status{font-size:.9rem;padding-bottom:0;text-transform:lowercase}
#projects a{color:#555;display:inline-block;padding:1rem}
#projects img{max-width:200px;width:100%}
#projects-h4{display:inline-block;padding-bottom:3rem}
#company{border-color:#555;margin-bottom:0;margin-top:5rem;width:100%}
#company p{font-size:.75rem;margin-bottom:.5rem}
#verify-vat{border-left:1px dotted #555;color:#889;padding-left:3px;text-decoration:none}
#legal{text-align:left}
#legal p{font-size:.9rem}
#contact{margin-top:1rem}
.contact{border-color:#889;margin:2rem auto}
.contact-way{list-style:none;padding:2rem 1rem}
.explain{color:#555;display:block;font-size:.9rem;padding:1rem 0}
.explain span{text-decoration:underline;white-space:nowrap}
#footer{color:#555;font-size:.9rem;text-align:center}
#footer-motto,footer p{margin-bottom:.5rem}
#footer-motto{text-transform:lowercase}
#footer-registration{font-size:.8rem}
@-webkit-keyframes animateLogo{from{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}
to{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}
}
@keyframes animateLogo{from{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}
to{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}
}
#intro-description span{display:block;height:2.75rem;position:relative}
#intro-description span span{-webkit-animation:displayWords 15s linear infinite 0s;animation:displayWords 15s linear infinite 0s;color:#889;display:block;height:0;opacity:1;overflow:hidden;position:absolute;top:0;bottom:0;left:0;right:0;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
#intro-description span span:nth-child(2){-webkit-animation-delay:5s;animation-delay:5s}
#intro-description span span:nth-child(3){-webkit-animation-delay:10s;animation-delay:10s}
@-webkit-keyframes displayWords{25%{color:#889;height:100%}
35%{color:#111;opacity:1;-webkit-transform:rotateX(0deg);transform:rotateX(0deg)}
50%{opacity:0;-webkit-transform:rotateX(180deg);transform:rotateX(180deg)}
100%{height:100%;opacity:0}
}
@keyframes displayWords{25%{color:#889;height:100%}
35%{color:#111;opacity:1;-webkit-transform:rotateX(0deg);transform:rotateX(0deg)}
50%{opacity:0;-webkit-transform:rotateX(180deg);transform:rotateX(180deg)}
100%{height:100%;opacity:0}
}
@media only screen and (min-width:400px){.nav-page-link{font-size:1.3rem}
#intro .button{margin:3rem auto 0}
#motto{display:-webkit-box;display:-ms-flexbox;display:flex}
#motto i{padding:.25rem}
#motto p{font-size:1.6rem;margin-left:2rem;text-align:left}
#team header{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}
#team figure{max-width:150px}
.member-name{font-size:1.1rem}
.member-role{font-size:.8rem}
#nav-footer{padding:1.5rem}
#nav-footer a{padding:1rem}
}
@media only screen and (min-width:750px){.nav-page-link{font-size:1.5rem}
main{border-color:#111;border-style:solid;border-width:0 2rem}
section{margin:2.5rem auto;padding:2rem}
#intro::after{bottom:-2.5rem;top:-2.5rem}
#intro-header{margin:1rem auto}
#intro-wrapper{padding-left:2rem;padding-right:2rem}
#about-us,#team{margin-top:4rem;width:50%}
#motto{display:block;margin-top:4rem;padding:2rem 1rem}
#motto p{margin:0;text-align:center}
#trusted-by{background-color:#f0f0f0;border-width:.5rem 0;border-style:double;border-color:#555;width:100%}
#trusted-by-h2{margin-bottom:1rem}
#trusted-by .hr{display:none}
#projects,#contact{margin-top:3rem}
#projects-h2{border:.5rem dashed #889;display:inline-block;padding:1rem}
#projects-h4{padding-bottom:1rem;width:75%}
#projects ul{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}
#company,#legal{margin:auto;width:50%}
#company{height:275px}
#company p{font-size:.85rem;margin-bottom:.75rem}
.contact{width:75%}
#contact ul{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}
.contact-way{margin-top:4rem;width:35%}
#nav-footer{padding:2rem}
#nav-footer a{width:15%}
}
@media only screen and (min-width:1175px){.contact{width:50%}
.contact-way{margin-top:4rem;width:35%}
}
@media print{*{color:#000;box-shadow:none;text-shadow:none;background:transparent}
html{background-color:#fff}
nav{display:none}
a[href]::after{content:" (" attr(href) ") "}
a[href]{font-weight:bold;text-decoration:underline;color:#06c;border:none}
 a[href^="javascript:"]:after,a[href^="#"]:after{content:""}
abbr[title]::after{content:" (" attr(title) ")"}
figure{margin-bottom:1em;overflow:hidden}
figure img{border:1px solid #000}
}