/* Desktop CSS based on 1920px max-width */
/* Picoo algemene items*/
@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap");

h2 {
  margin-top: 2%;
  margin-bottom: 2%;
}

.picoo-section {
  margin-top: 8%;
  margin-bottom: 8%;
}

#games,
#customer-support,
#about-us,
#pakketten,
#try {
  display: none;
}

#try {
  margin-top: 5%;
}

.picoo-section-top {
  margin-top: 8%;
  margin-bottom: 0%;
}

.time-line-image img {
  width: 100%;
}

/* sub header */
.sub-header.sub-header-absolute p a {
  margin-right: 1%;
}

.active-sub {
  font-weight: 600;

  background-color: #ffffff !important;
  padding: 2% 1%;
  color: #292d78 !important;
}

.sub-header {
  margin-top: 0;
  width: 100%;
  background-color: #292d78;
  padding-top: 0.5%;
  position: fixed !important;
  z-index: 999;
}

.about-us {
  padding-top: 15%;
}

.sub-header p {
  color: white;
  text-align: right;
  font-size: 9pt;
}

.sub-header p a {
  color: white;
  text-align: right;
}

/* h1-tags */
.h1-blue-left h1 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
  color: #292d78 !important;
  font-size: 48px !important;
}

.h1-blue-center h1 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: center !important;
  color: #292d78 !important;
  font-size: 48px !important;
}

.h1-blue-right h1 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: right !important;
  color: #292d78 !important;
  font-size: 48px !important;
}

.h1-white-left h1 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
  color: #ffffff !important;
  font-size: 48px !important;
}

.h1-white-center h1 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: center !important;
  color: #ffffff !important;
  font-size: 48px !important;
}

.h1-white-right h1 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: right !important;
  color: #ffffff !important;
  font-size: 48px !important;
}

/* h2-tags */
.h2-blue-left h2 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
  color: #292d78 !important;
  font-size: 32px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h2-blue-center h2 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: center !important;
  color: #292d78 !important;
  font-size: 32px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h2-blue-right h2 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: right !important;
  color: #292d78 !important;
  font-size: 32px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h2-white-left h2 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
  color: #ffffff !important;
  font-size: 32px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h2-white-center h2 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: center !important;
  color: #ffffff !important;
  font-size: 32px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h2-white-right h2 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: right !important;
  color: #ffffff !important;
  font-size: 32px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

/* h3-tags */
.h3-blue-left h3 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
  color: #292d78 !important;
  font-size: 20px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h3-blue-center h3 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: center !important;
  color: #292d78 !important;
  font-size: 20px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h3-blue-right h3 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: right !important;
  color: #292d78 !important;
  font-size: 20px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h3-white-left h3 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
  color: #ffffff !important;
  font-size: 20px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h3-white-center h3 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: center !important;
  color: #ffffff !important;
  font-size: 20px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h3-white-right h3 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: right !important;
  color: #ffffff !important;
  font-size: 20px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.h4-blue-left h4 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
  color: #292d78 !important;
}

.h4-blue-center h4 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: center !important;
  color: #292d78 !important;
}

.h5-blue-left h5 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: left !important;
  color: #292d78 !important;
}

.h5-blue-center h5 {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 700 !important;
  text-align: center !important;
  color: #292d78 !important;
}

/* p-tags */
.blue {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400 !important;
  text-align: left !important;
  color: #292d78 !important;
  font-size: 11.5px !important;
}

.p-blue-left p {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400 !important;
  text-align: left !important;
  color: #292d78 !important;
  font-size: 11.5pt !important;
  margin-top: 3%;
  margin-bottom: 2%;
}

.p-blue-center p {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400 !important;
  text-align: center;
  color: #292d78 !important;
  font-size: 11.5pt !important;
  margin-top: 3%;
  margin-bottom: 2%;
}

.p-blue-center p a {
  text-decoration: underline;
}

.p-blue-center p a:hover {
  color: black;
}

.p-different-distance p {
  margin-top: -1% !important;
  margin-bottom: 5% !important;
}

.p-blue-right p {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400 !important;
  text-align: right !important;
  color: #292d78 !important;
  font-size: 11.5pt !important;
  margin-top: 3%;
  margin-bottom: 2%;
}

.p-white-left p {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400 !important;
  text-align: left !important;
  color: #ffffff !important;
  font-size: 14px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.p-white-center p {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400 !important;
  text-align: center !important;
  color: #ffffff !important;
  font-size: 14px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

.p-white-center p span {
  font-style: italic !important;
  font-size: 14px !important;
}

.p-white-right p {
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400 !important;
  text-align: right !important;
  color: #ffffff !important;
  font-size: 14px !important;
  margin-top: 2%;
  margin-bottom: 2%;
}

p {
  font-family: "Quicksand", sans-serif !important;
}

/* planyoo form */

#from_calendar iframe {
  width: 100% !important;
  height: 320px !important;
}

#from_calendar {
  pointer-events: none;
  cursor: default;
  text-decoration: none;
  color: black;
}

/* blue-button CTA CES*/
.picoo-button-CES {
  font-family: "Quicksand", sans-serif !important;
  background-color: #00aeef !important;
  color: white !important;
  border-radius: 5px;
  width: 300px;
  height: 35px;
  text-align: center;
  line-height: 35px;
  font-weight: bold;
  margin: 25px;
  margin-left: 0px;
  margin-top: -10px;
}

.picoo-button-CES a {
  color: white !important;
}

/* orange-button CTA */
.picoo-button-orange {
  font-family: "Quicksand", sans-serif !important;
  background-color: #f1a948 !important;
  color: white !important;
  border-radius: 50px;
  padding: 1% 2%;
  width: 15%;
  text-align: center;
  font-weight: bold;
  font-size: 18px !important;
  float: right;
  margin-bottom: 5%;
  margin-right: 2%;
}

.picoo-button-orange:hover {
  font-family: "Quicksand", sans-serif !important;
  background-color: #f1a848ad !important;
  color: white !important;
  border-radius: 50px;
  padding: 1% 2%;
  width: 15%;
  text-align: center;
  font-weight: bold;
  float: right;
  margin-bottom: 5%;
  margin-right: 2%;
}

.picoo-orange {
  font-family: "Quicksand", sans-serif !important;
  background-color: #df542f !important;
  color: white !important;
  border-radius: 50px;
  padding: 3% 6%;
  text-align: center;
  font-weight: bold;
  font-size: 18px !important;
  margin-left: 15%;
  margin-top: 5% !important;
  width: 70%;
}

.picoo-orange a {
  color: white;
  text-decoration: none;
}

.picoo-orange a:hover {
  color: black;
  text-decoration: none;
}

.picoo-orange:hover {
  font-family: "Quicksand", sans-serif !important;
  background-color: #af4426 !important;
  color: white !important;
  border-radius: 50px;
  padding: 3% 6%;
  text-align: center;
  font-weight: bold;
  font-size: 18px !important;
  margin-left: 15%;
  margin-top: 5% !important;
  width: 70%;
}

.picoo-light {
  font-family: "Quicksand", sans-serif !important;
  background-color: transparent !important;
  color: #292d78 !important;
  border-radius: 50px;
  padding: 3% 6%;
  text-align: center;
  font-weight: bold;
  font-size: 12px !important;
  margin-left: 0%;
  margin-top: 8% !important;
  width: 50%;
  border: #292d78 1px solid;
}

.picoo-light a {
  color: #292d78;
  text-decoration: none;
}

.picoo-light a:hover {
  color: black;
  text-decoration: none !important;
}

.picoo-light:hover {
  font-family: "Quicksand", sans-serif !important;
  background-color: transparent !important;
  color: #444dc9 !important;
  border-radius: 50px;
  padding: 3% 6%;
  text-align: center;
  font-weight: bold;
  font-size: 12px !important;
  text-decoration: none !important;
  margin-top: 8% !important;
  width: 50%;
  border: #444dc9 1px solid;
}

.picoo-dark-blue {
  font-family: "Quicksand", sans-serif !important;
  background-color: #292d78 !important;
  color: white !important;
  border-radius: 50px;
  padding: 3% 5%;
  text-align: center;
  font-weight: bold;
  font-size: 18px !important;
  margin-left: 15%;
  margin-top: 5% !important;
  width: 70%;
}

.picoo-dark-blue a {
  color: white;
  text-decoration: none;
}

.picoo-dark-blue a:hover {
  color: #f2f2f2;
  text-decoration: none;
}

.picoo-dark-blue:hover {
  font-family: "Quicksand", sans-serif !important;
  background-color: #3a3fac !important;
  color: white !important;
  border-radius: 50px;
  padding: 3% 5%;
  text-align: center;
  font-weight: bold;
  font-size: 18px !important;
  margin-left: 15%;
  margin-top: 5% !important;
  width: 70%;
}

.picoo-light-blue {
  font-family: "Quicksand", sans-serif !important;
  background-color: #00aeef !important;
  color: white !important;
  border-radius: 50px;
  padding: 2% 2%;
  text-align: center;
  font-weight: bold;
  font-size: 18px !important;
  margin-left: 60%;
  margin-top: 5% !important;
  width: 40%;
}

.picoo-light-blue a {
  color: white;
  text-decoration: none;
}

.picoo-light-blue a:hover {
  color: black;
  text-decoration: none;
}

.picoo-light-blue:hover {
  font-family: "Quicksand", sans-serif !important;
  background-color: #1796c4 !important;
  color: white !important;
  border-radius: 50px;
  padding: 2% 2%;
  text-align: center;
  font-weight: bold;
  font-size: 18px !important;
  margin-left: 60%;
  margin-top: 5% !important;
  width: 40%;
}

.picoo-light-blue-center {
  font-family: "Quicksand", sans-serif !important;
  background-color: #00aeef !important;
  color: white !important;
  border-radius: 50px;
  padding: 2% 2%;
  text-align: center;
  font-weight: bold;
  font-size: 18px !important;
  margin-left: 30%;
  margin-top: 5% !important;
  width: 40%;
}

.picoo-light-blue-center a {
  color: white;
  text-decoration: none;
}

.picoo-light-blue-center a:hover {
  color: black;
  text-decoration: none;
}

.picoo-light-blue-center:hover {
  font-family: "Quicksand", sans-serif !important;
  background-color: #1796c4 !important;
  color: white !important;
  border-radius: 50px;
  padding: 2% 2%;
  text-align: center;
  font-weight: bold;
  font-size: 18px !important;
  margin-left: 30%;
  margin-top: 5% !important;
  width: 40%;
}

.picoo-light-blue-center-email {
  font-family: "Quicksand", sans-serif !important;
  background-color: #00aeef !important;
  color: white !important;
  border-radius: 50px;
  padding: 1% 1%;
  text-align: center;
  font-weight: bold;
  font-size: 15px !important;
  margin-left: 40%;
  margin-top: 3% !important;
  margin-bottom: 3% !important;
  width: 20%;
}

.picoo-light-blue-center-email a {
  color: white;
  text-decoration: none;
}

.picoo-light-blue-center-email a:hover {
  color: black;
  text-decoration: none;
}

.picoo-light-blue-center-email:hover {
  font-family: "Quicksand", sans-serif !important;
  background-color: #1796c4 !important;
  color: white !important;
  border-radius: 50px;
  padding: 1% 1%;
  text-align: center;
  font-weight: bold;
  font-size: 15px !important;
  margin-left: 40%;
  margin-top: 3% !important;
  margin-bottom: 3% !important;
  width: 20%;
}

/* Picoo CTA */

.picoo-light-blue-center-cta {
  font-family: "Quicksand", sans-serif !important;
  background-color: #00aeef !important;
  color: white !important;
  border-radius: 50px;
  padding: 1% 1%;
  text-align: center;
  font-weight: bold;
  font-size: 15px !important;
  margin-left: 30%;
  margin-top: 3% !important;
  margin-bottom: 3% !important;
  width: 40%;
}

.picoo-light-blue-center-cta a {
  color: white;
  text-decoration: none;
}

.picoo-light-blue-center-cta a:hover {
  color: black;
  text-decoration: none;
}

.picoo-light-blue-center-cta:hover {
  font-family: "Quicksand", sans-serif !important;
  background-color: #0587b6 !important;
  color: white !important;
  border-radius: 50px;
  padding: 1% 1%;
  text-align: center;
  font-weight: bold;
  font-size: 15px !important;
  margin-left: 30%;
  margin-top: 3% !important;
  margin-bottom: 3% !important;
  width: 40%;
}

.picoo-light-blue-center-cta-opportunities {
  font-family: "Quicksand", sans-serif !important;
  background-color: #292d78 !important;
  color: white !important;
  border-radius: 50px;
  padding: 4% 1%;
  text-align: center;
  font-weight: bold;
  font-size: 15px !important;
  margin-left: 5%;
  margin-top: 5% !important;
  margin-bottom: 3% !important;
  width: 90%;
}

.picoo-light-blue-center-cta-opportunities a {
  color: white;
  text-decoration: none;
}

.margin-title img {
  margin-bottom: 8% !important;
}

.picoo-light-blue-center-cta-opportunities a:hover {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.picoo-light-blue-center-cta-opportunities:hover {
  font-family: "Quicksand", sans-serif !important;
  background-color: #3a40ad !important;
  color: white !important;
  border-radius: 50px;
  padding: 4% 1%;
  text-align: center;
  font-weight: bold;
  font-size: 15px !important;
  margin-left: 5%;
  margin-top: 5% !important;
  margin-bottom: 3% !important;
  width: 90%;
}

/* Picoo e-mail link */

.mail-picoo-link a {
  font-family: "Quicksand", sans-serif !important;
  color: #292d78;
  font-size: 17px;
  position: absolute;
  margin-top: 4%;
  margin-left: 40%;
  width: 20%;
}

/* picoo lists */

.picoo-list li img {
  margin-top: 0%;
  float: left;
}

.picoo-list-text {
  margin-left: 5%;
  font-family: "Quicksand", sans-serif !important;
  color: #292d78;
  font-size: 11.5px;
  float: right;
  position: relative;
  margin-top: -3.2%;
  width: 95%;
  margin-bottom: 3%;
}

.picoo-list-starter {
  margin-left: 5%;
  font-family: "Quicksand", sans-serif !important;
  color: #292d78;
  font-size: 11.5px;
  float: right;
  position: relative;
  margin-top: -4.2%;
  width: 95%;
  margin-bottom: 3%;
  text-align: left;
}

.starter-left {
  padding-top: 2% !important;
}

.starter-right {
  padding-top: 11% !important;
}

.first-image-block {
  margin-left: -5%;
  margin-right: 20%;
}

.picoo-list a {
  text-decoration: underline;
  color: #292d78;
  font-weight: 700;
}

/* iFrames for videos */

.picoo-iframe iframe {
  margin-left: 5%;
  width: 90%;
  height: 60vh;
  border-radius: 20px;
}

/* main menu desktop */
.main-menu {
  margin-left: 25% !important;
}

.main-menu ul li a {
  color: rgb(41, 45, 120);
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400;
  font-size: 15px !important;
  text-transform: none;
  margin-right: 3px;
  margin-left: 3px;
}

.main-menu ul li a:hover {
  color: rgb(30, 33, 85);
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400;
  font-size: 15px !important;
  text-transform: none;
  margin-right: 3px;
  margin-left: 3px;
}

.main-menu ul li a span:hover,
.main-menu ul li a span a:hover {
  color: rgb(30, 33, 85);
  font-family: "Quicksand", sans-serif !important;
  border-bottom-color: #00aeef !important;
  border-bottom-style: solid !important;
  border-bottom-width: 2px !important;
  font-weight: 500;
  font-size: 14.85px !important;
  max-width: 99% !important;
}

.p-blue-left ul li {
  list-style: disc;
  margin-left: 9%;
  margin-top: 1%;
  font-family: "Quicksand", sans-serif !important;
  font-weight: 400 !important;
  text-align: left !important;
  color: #292d78 !important;
  font-size: 11.5pt !important;
  list-style-image: url(../images/shapes/bullut-point.svg);
}

/* pre-order CTA button */
.menu-item-pre-order {
  background-color: #00aeef !important;
  border-radius: 50px !important;
  margin-right: 2% !important;
  color: white !important;
}

.main-menu .menu-item-shop,
#main-menu-second .menu-item-probeer {
  background-color: #84bf41 !important;
  border-radius: 50px !important;
  margin-right: 2% !important;
  color: white !important;
  padding-left: 2%;
}

.main-menu .menu-item-shop a span,
#main-menu-second .menu-item-probeer a span {
  color: white !important;
}

.menu-item-pre-order {
  background-color: #00aeef !important;
  border-radius: 50px !important;
  margin-right: 2% !important;
  color: white !important;
}

.menu-item-pre-order a span {
  color: white !important;
}

.menu-item-pre-order:hover>a {
  border-bottom-color: yellow !important;
  border-bottom-style: none !important;
  border-bottom-width: 0px !important;
}

/* fallback pages (succes, error) */
.callbackpage-icon img {
  width: 40%;
  margin-left: 30%;
  margin-bottom: 5%;
}

.callbackpage-icon-failed img {
  width: 30%;
  margin-left: 35%;
  margin-bottom: 5%;
}

/* Share buttons (test) */
.share-buttons {
  margin-top: 5%;
}

.margin-left-shares {
  margin-left: 3%;
}

.share-buttons img {
  width: 90%;
  border: 0;
  box-shadow: 0;
  display: inline;
}

/* Shape classes */
.green-shape-left-first img {
  z-index: -1;
  position: absolute;
  margin-left: -520%;
  margin-top: -200%;
}

.green-shape-right img {
  z-index: -1;
  position: absolute;

  margin-top: -230%;
  margin-left: 200%;
}

.blue-shape-left img {
  z-index: -1;
  position: absolute;
  margin-left: -520%;
  margin-top: -250%;
}

.blue-shape-right img {
  z-index: -1;
  position: absolute;
  margin-left: 250%;
  margin-top: -50%;
}

.purple-shape-left img {
  z-index: -1;
  position: absolute;
  margin-left: -420%;
  margin-top: 380%;
}

.dark-shape-right img {
  z-index: -1;
  position: absolute;
  margin-left: 1550%;
  margin-top: -50%;
}

.green-shape-left img {
  z-index: -1;
  position: absolute;
  margin-left: -420%;
  margin-top: 180%;
}

.orange-shape-right img {
  z-index: -1;
  position: absolute;
  transform: rotate(100deg);
  margin-left: 220%;
}

.pre-order-row {
  margin-top: 8% !important;
  z-index: 1;
  position: relative;
  margin-bottom: -20%;
  padding-bottom: 25% !important;
}

#voor-school-of-bso,
#hoe-boek-ik {
  margin-top: 5%;
}

.hire-blocks {
  background-color: #c8ebfb;
  padding: 2%;
  float: left;
  width: 40%;
  border: solid white 5px;
  border-radius: 20px;
  height: 400px !important;
}

.hire-blocks img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10%;
  margin-top: 10%;
}

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

.hire-form-large input,
.hire-form-large select {
  width: 40%;
  padding: 1%;
  margin-right: 6%;
  border-radius: 20px;
  border: none;
  background-color: #c8ebfb;
  float: left;
}

.hire-form input,
.hire-form select,
.hire-form textarea {
  width: 80%;
  padding: 2% 4%;

  border-radius: 20px;
  border: none;
  background-color: #c8ebfb;
  float: left;
  margin-bottom: 3%;
}

.checkbox-form {
  width: 5% !important;
}

.hire-form label {}

.checkbox-span {
  width: 100%;
  float: left;
  font-family: "Quicksand", sans-serif !important;
}

.checkbox-span a {
  text-decoration: underline;
}

.submit-form {
  width: 40% !important;
  float: right !important;
  margin-right: 20%;
  margin-top: 5%;
  background-color: #00aeef !important;
  color: white;
}

.submit-form:hover {
  opacity: 0.7;
}

.stick-container {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  overflow: visible;
}

.sticky-block {
  background-color: rgba(41, 45, 120, 0.1) !important;
  width: 80% !important;
  margin-left: -40.5%;

  margin-top: 0%;

  display: block;
  padding: 5%;
  border: #292d78 2px solid;
  border-radius: 20px;

  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
}

.sticky-block ul li {
  font-family: "Quicksand" !important;
}

.sticky-block hr {
  border: #292d78 solid 1px;
}

.stick-block-right {
  float: right;
}

.twoThird {
  width: 45% !important;
  float: left;
  margin-right: 5%;
}

.oneThird {
  width: 30% !important;
  float: left;
}

.twoThirdLeft {
  width: 45% !important;
  float: left;
}

.oneThirdLeft {
  width: 30% !important;
  float: left;
  margin-right: 5%;
}

.hire-waring-span p {
  background-color: #f1a948 !important;
  width: 60%;
  padding: 2%;
  margin-left: 20%;
  border-radius: 20px;
  color: #292d78;
  font-weight: 600;
  margin-top: 5%;
}

#b2c {
  display: block;
}

#b2b {
  display: none;
}

.mobile {
  display: none !important;
}

.mobile-align-icon-left img {
  margin-bottom: 20% !important;
}

.mobile-align-icon-center img {
  margin-bottom: 19% !important;
}

.mobile-align-icon-right img {
  margin-bottom: 15% !important;
}

#mobile_country_param {
  display: none !important;
}

#mobile_number_param {
  width: 475% !important;
  margin-left: -123% !important;
}

.getting-ready-images {
  width: 450px;
  height: 300px;
}

.getting-started-align-list ul {
  margin-top: 35px !important;
  margin-left: 50px !important;
}

/* .getting-started-align-list p {
  margin-left: 85px !important;
} */

#videoContainer img {
  width: 100% !important;
  margin-left: 0% !important;
  border-radius: 5px;
  margin-top: 5% !important;
}

#videoContainer iframe {
  width: 100% !important;
  height: 80vh !important;
  border-radius: 5px !important;
  margin-top: 5% !important;
}

#margin-negative-top {
  margin-top: -10% !important;
}

.picoo-tutorial-home-page-images {
  width: 100%;
}

.picoo-tutorial-home-page p {
  color: #292d78;
  margin-top: 3%;
  padding: 2%;
}

.picoo-usp-block-row {}

.picoo-usp-block-new img {
  width: 50% !important;
  min-height: 8em;
  margin-bottom: 10% !important;
}

.picoo-usp-block-great img {
  width: 30% !important;
  min-height: 8em;
}

.picoo-usp-block-new p {
  margin-top: 5%;
}

.picoo-games-block-new,
.picoo-games-block-grea {
  margin-top: 5%;
}

.picoo-games-block-new img {
  width: 30% !important;
  min-height: 8em;
  margin-bottom: 10% !important;
  margin-left: 35%;
}

.picoo-games-block-great img {
  width: 20% !important;
  margin: auto;
  min-height: 8em;
  margin-left: 40%;
}

.mobile {
  display: none;
}

.home-intro-image img {
  width: 100% !important;
  margin-left: 0% !important;
  border-radius: 10px !important;
  margin-top: 10%;
}

.labels {
  margin-top: 8%;
}

.label-blue-standard {
  background-color: #00adee;
  padding: 2% 3%;
  border-radius: 10px;
  color: white;
  float: left;
  margin-right: 1%;
  margin-left: 1%;
}

.label-white-standard {
  background-color: white;
  padding: 2% 3%;
  border-radius: 10px;
  color: #292d78;
  float: left;
  margin-right: 1%;
  margin-left: 1%;
}

.label-green-standard {
  background-color: #8cc63f;
  padding: 2% 3%;
  border-radius: 10px;
  color: white;
  float: left;
  margin-right: 1%;
  margin-left: 1%;
}


.starterset {
  width: 140%;
  margin-left: -18%;
}

.starterkit-text img {
  margin-top: 8%;
}

.starterkit-text h4 {
  color: #2e3092;
  font-weight: normal;
  margin-top: 15%;
  margin-bottom: 4%;
}

.starterkit-text p {
  color: #2e3092;
  font-weight: bold;
}

.contact-image img {
  width: 100%;
}

.contact-text h3 {
  font-size: 15pt;
}

.contact-text p {
  margin-bottom: 5%;
}

.horizontal-timeline {
  position: relative;
  height: 6px;
  background: #29aae3;
  margin: 0;
}

.arrow-up,
.arrow-down {
  position: absolute;
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  vertical-align: baseline;
}

.arrow-up {
  top: -20px;
  border-bottom: 20px solid #29aae3;
}

.arrow-down {
  bottom: -20px;
  border-top: 20px solid #29aae3;
}

.package-block div {
  padding-left: 3% !important;
}

/*  */
.h2-jobs p {
  margin-bottom: 0% !important;
  margin-top: 1% !important;
}

.h2-jobs p a {
  font-weight: 700;
}

.jobs-right {
  text-align: right;
  float: right;
}


.jobs {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100%;

}

.job-wrapper {
  display: flex;
  justify-content: left;
  width: 70%;
  /* background-color: red; */
}

.job-vacancy {
  background-color: #00adee;
  padding: 4%;
  border-radius: 10px;
  width: 300px !important;
  height: 200px !important;
  margin-top: 2% !important;
  margin-bottom: 5% !important;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.job-vacancy h3 {
  margin-bottom: 20px;
}

.jobs-button {
  background-color: #f1a948;
  color: black;
  width: 200px;
  padding: 4%;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.vacature-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
}

.vacature-block {
  width: 80%;
}

/*  */
.ces-images h2 {
  margin-top: 6%;
}

.ces-images img {
  width: 50%;
  border-radius: 15px;
  margin-top: 2%;
  margin-bottom: 2%;
}

.download-button {
  background-color: green;
}

.youtube-video-middle {
  margin-top: 5%;
  margin-bottom: 5%;
}

.youtube-video-middle iframe {
  width: 80%;
  margin-left: 10%;
  height: 35em;
}

.seen-on-image a img {
  width: 100%;
}

.seen-on-image a :hover {
  opacity: 0.7;
}

.news-images img {
  width: 50%;

  margin-top: 8%;
  margin-bottom: 2%;
}

/* games book images  quarter-, half-, full-width*/

.games-book-quarter-width img {
  width: 25%;
  margin-top: 0%;
  margin-left: 37.5%;
}

.games-book-half-width img {
  width: 50%;
  margin-top: 0%;
  margin-left: 25%;
}

.games-book-full-width img {
  width: 100%;
  margin-top: 0%;
}




.about-us-image img {
  margin-top: 0%;
}

.about-us-image img {
  margin-top: 0%;
}

.sub-page-generate-list h3 {
  width: 100%;
  float: left;
}

.sub-page-generate-list ul {}

.sub-page-generate-list ul li {
  width: 47%;
  float: left;
  margin-left: 3% !important;
}

.sub-page-generate-list {
  margin-bottom: 5%;
}


.youtube-video-middle iframe {
  width: 80%;
  margin-left: 10%;
  height: 35em;
}

.seen-on-image a img {
  width: 100%;
}

.seen-on-image a :hover {
  opacity: 0.7;
}

.news-images img {
  width: 50%;

  margin-top: 8%;
  margin-bottom: 2%;

}


/* games book images  quarter-, half-, full-width*/

.games-book-quarter-width img {
  width: 25%;
  margin-top: 0%;
  margin-left: 37.5%;
}

.games-book-half-width img {
  width: 50%;
  margin-top: 0%;
  margin-left: 25%;
}

.games-book-full-width img {
  width: 100%;
  margin-top: 0%;
}

.about-us-image img {
  margin-top: 0%;
}



/* wide screen CSS based on 200px min-width */
@media only screen and (max-width: 1950px) {
  .check-agreement {
    margin-top: -6.5% !important;
    position: absolute;
    width: 100%;
  }
}

/* wide screen CSS based on 200px min-width */
@media only screen and (min-width: 2800px) {
  .hire-row {
    margin-top: 3%;
  }
}

/* wide screen CSS based on 200px min-width */
@media only screen and (min-width: 1950px) {
  .logo {
    margin-top: -5%;
  }

  .check-agreement {
    margin-top: -6.5% !important;
    position: absolute;
    width: 100%;
  }

  #main-menu {
    margin-left: 36% !important;
  }

  .legal-consent-container .hs-form-booleancheckbox-display input[type="checkbox"] {
    margin-left: -50% !important;
    margin-right: 8%;
  }
}

/* Notebook CSS based on 1440px max-width */
@media only screen and (max-width: 1440px) {
  .game-clickable-image img {
    width: 70%;
    margin: auto;
    margin-left: 15%;
    margin-bottom: 5%;
  }

  .label-white-standard {
    background-color: white;
    padding: 2% 3%;
    border-radius: 10 px;
    color: #292d78;
    float: left;
    margin-right: 1%;
    margin-left: 1%;
    margin-bottom: 2%;
  }

  /* orange-button CTA */
  .picoo-button-orange {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a948 !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 2%;
    width: 15%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  .picoo-button-orange:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a848ad !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 2%;
    width: 15%;
    text-align: center;
    font-weight: bold;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  /* iFrames for videos */
  .picoo-iframe iframe {
    margin-left: 5%;
    width: 90%;
    height: 70vh;
    border-radius: 20px;
  }

  #natural-link {
    display: "block";
  }

  /* main menu desktop */
  .main-menu {
    margin-left: 15% !important;
  }

  .main-menu ul li a {
    color: rgb(41, 45, 120);
    font-family: "Quicksand", sans-serif !important;
    font-weight: 400;
    font-size: 15px !important;
    text-transform: none;
    margin-right: 3px;
    margin-left: 3px;
  }

  .main-menu ul li a:hover {
    color: rgb(30, 33, 85);
    font-family: "Quicksand", sans-serif !important;
    font-weight: 400;
    font-size: 15px !important;
    text-transform: none;
    margin-right: 3px;
    margin-left: 3px;
  }

  .main-menu ul li a span:hover,
  .main-menu ul li a span a:hover {
    color: rgb(30, 33, 85);
    font-family: "Quicksand", sans-serif !important;
    border-bottom-color: #00aeef !important;
    border-bottom-style: solid !important;
    border-bottom-width: 2px !important;
    font-weight: 400;
    font-size: 15px !important;
  }

  .picoo-light-blue-center {
    font-family: "Quicksand", sans-serif !important;
    background-color: #00aeef !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    margin-left: 30%;
    margin-top: 5% !important;
    width: 40%;
  }

  .picoo-light-blue-center a {
    color: white;
    text-decoration: none;
  }

  .picoo-light-blue-center a:hover {
    color: black;
    text-decoration: none;
  }

  .picoo-light-blue-center:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #1796c4 !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    margin-left: 30%;
    margin-top: 5% !important;
    width: 40%;
  }

  /* Shape classes */
  .green-shape-left-first img {
    z-index: -1;
    position: absolute;
    margin-left: -520%;
    margin-top: -200%;
  }

  .green-shape-right img {
    z-index: -1;
    position: absolute;
    margin-top: -230%;
    margin-left: 40%;
  }

  .blue-shape-left img {
    z-index: -1;
    position: absolute;
    margin-left: -220%;
    margin-top: -250%;
  }

  .blue-shape-right img {
    z-index: -1;
    position: absolute;
    margin-left: 150%;
    margin-top: -50%;
  }

  .purple-shape-left img {
    z-index: -1;
    position: absolute;
    margin-left: -220%;
    margin-top: 380%;
  }

  .dark-shape-right img {
    z-index: -1;
    position: absolute;
    margin-left: 1250%;
    margin-top: -50%;
  }

  .green-shape-left img {
    z-index: -1;
    position: absolute;
    margin-left: -220%;
    margin-top: 70%;
  }

  .orange-shape-right img {
    z-index: -1;
    position: absolute;
    transform: rotate(100deg);
    margin-left: 220%;
  }

  .pre-order-row {
    margin-top: 8% !important;

    position: relative;
    margin-bottom: -20%;
    padding-bottom: 25% !important;
  }
}

/* Tablet - Landscape CSS based on 1366px max-width */
@media only screen and (max-width: 1366px) {

  /* orange-button CTA */
  .picoo-button-orange {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a948 !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 2%;
    width: 15%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  .picoo-button-orange:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a848ad !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 2%;
    width: 15%;
    text-align: center;
    font-weight: bold;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  /* iFrames for videos */
  .picoo-iframe iframe {
    margin-left: 5%;
    width: 90%;
    height: 50vh;
    border-radius: 20px;
  }

  .main-menu {
    margin-left: 15% !important;
  }
}

/* Macbook pro 13 inch - Landscape CSS based on 1280px max-width */
@media only screen and (max-width: 1280px) {
  .about-us {
    padding-top: 50%;
  }

  .time-line-image img {
    width: 80%;
    margin-left: 10%;
    margin-top: 8%;
  }

  .picoo-light-blue-center-email {
    font-family: "Quicksand", sans-serif !important;
    background-color: #00aeef !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 15px !important;
    margin-left: 37%;
    margin-top: 3% !important;
    margin-bottom: 3% !important;
    width: 30%;
  }

  .picoo-light-blue-center-email a {
    color: white;
    text-decoration: none;
  }

  .picoo-light-blue-center-email a:hover {
    color: black;
    text-decoration: none;
  }

  .picoo-light-blue-center-email:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #1796c4 !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 15px !important;
    margin-left: 37%;
    margin-top: 3% !important;
    margin-bottom: 3% !important;
    width: 30%;
  }

  /* Picoo e-mail link */

  .mail-picoo-link a {
    font-family: "Quicksand", sans-serif !important;
    color: #292d78;
    font-size: 17px;
    position: absolute;
    margin-top: 4%;
    margin-left: 40%;
    width: 20%;
    margin-bottom: 5% !important;
  }

  .mail-picoo-link {
    margin-top: 2%;
    margin-bottom: 20%;
  }

  .first-image-block {
    margin-left: -5%;
    margin-right: 10%;
  }
}

/* Tablet - Portrait CSS based on 1024px max-width */
@media only screen and (max-width: 1024px) {
  .menus {
    margin-left: -5%;
  }
}

/* Tablet - Portrait CSS based on 768px max-width */
@media only screen and (max-width: 768px) {
  .getting-ready-images {
    width: 100%;
    margin-top: 8%;
  }

  .seen-on-image a img {
    width: 100%;
    margin-bottom: -17%;
  }

  .desktop,
  #desktop {
    display: none !important;
  }

  .mobile {
    display: block !important;
  }

  .hire-blocks {
    background-color: #c8ebfb;
    padding: 2%;
    float: left;
    width: 100%;
    border: solid white 5px;
    border-radius: 20px;
  }

  .hire-blocks p {
    padding-bottom: 15%;
  }

  .hire-blocks img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10%;
    margin-top: 10%;
  }

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

  .hire-waring-span p {
    background-color: #f1a948 !important;
    width: 90%;
    padding: 5%;
    margin-left: 5%;
    border-radius: 20px;
    color: #292d78;
    font-weight: 600;
  }

  /* orange-button CTA */
  .picoo-button-orange {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a948 !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 2%;
    width: 20%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  /* 
  .h2-jobs h2 {
    margin-top: 12%;
  }

  .h2-jobs p {
    margin-bottom: 2% !important;
    margin-top: 4% !important;
  }

  .h2-jobs h2 {
    margin-top: 7%;
  }

  .jobs-about-us h2 {
    margin-top: 10%;
  } */

  /* .job-about-us { 
    padding: 10%;
    width: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
   }  */

  .main-menu {
    display: none !important;
  }

  .picoo-button-orange:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a848ad !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 2%;
    width: 20%;
    text-align: center;
    font-weight: bold;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  /* iFrames for videos */
  .picoo-iframe iframe {
    margin-left: 5%;
    width: 90%;
    height: 35vh;
    border-radius: 20px;
  }

  /* main menu desktop */
  .main-menu {
    margin-left: 15% !important;
    width: 100%;
  }

  .main-menu ul li a {
    color: rgb(41, 45, 120);
    font-family: "Quicksand", sans-serif !important;
    font-weight: 400;
    font-size: 15px !important;
    text-transform: none;
    margin-right: 3px;
    margin-left: 3px;
    width: 100%;
  }

  .main-menu ul li a:hover {
    color: rgb(30, 33, 85);
    font-family: "Quicksand", sans-serif !important;
    font-weight: 400;
    font-size: 15px !important;
    text-transform: none;
    margin-right: 3px;
    margin-left: 3px;
  }

  .main-menu ul li a span:hover,
  .main-menu ul li a span a:hover {
    color: rgb(30, 33, 85);
    font-family: "Quicksand", sans-serif !important;
    border-bottom-color: #00aeef !important;
    border-bottom-style: solid !important;
    border-bottom-width: 2px !important;
    font-weight: 400;
    font-size: 15px !important;
  }

  /* Shape classes */
  .green-shape-left-first img {
    display: none;
  }

  .green-shape-right img {
    z-index: -1;
    position: absolute;
    margin-top: -230%;
    margin-left: -40%;
  }

  .blue-shape-left img {
    z-index: -1;
    position: absolute;
    margin-left: -220%;
    margin-top: -250%;
  }

  .blue-shape-right img {
    z-index: -1;
    position: absolute;
    margin-left: 150%;
    margin-top: -50%;
  }

  .purple-shape-left img {
    z-index: -1;
    position: absolute;
    margin-left: -220%;
    margin-top: 380%;
  }

  .dark-shape-right img {
    z-index: -1;
    position: absolute;
    margin-left: 1250%;
    margin-top: -50%;
  }

  .green-shape-left img {
    z-index: -1;
    position: absolute;
    margin-left: -220%;
    margin-top: 70%;
  }

  .orange-shape-right img {
    z-index: -1;
    position: absolute;
    transform: rotate(100deg);
    margin-left: 50%;
  }

  .pre-order-row {
    margin-top: 8% !important;

    position: relative;
    margin-bottom: -20%;
    padding-bottom: 25% !important;
  }

  .picoo-light-blue-center-email {
    font-family: "Quicksand", sans-serif !important;
    background-color: #00aeef !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 1%;
    text-align: center;
    font-weight: bold;
    font-size: 15px !important;
    margin-left: 35%;
    margin-top: 3% !important;
    margin-bottom: 3% !important;
    width: 30%;
  }

  .picoo-light-blue-center-email a {
    color: white;
    text-decoration: none;
  }

  .picoo-light-blue-center-email a:hover {
    color: black;
    text-decoration: none;
  }

  .picoo-light-blue-center-email:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #1796c4 !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 1%;
    text-align: center;
    font-weight: bold;
    font-size: 15px !important;
    margin-left: 35%;
    margin-top: 3% !important;
    margin-bottom: 3% !important;
    width: 30%;
  }

  /* Picoo e-mail link */

  .mail-picoo-link a {
    font-family: "Quicksand", sans-serif !important;
    color: #292d78;
    font-size: 17px;
    position: absolute;
    margin-top: 4%;
    margin-left: 38%;
    width: 30%;
    margin-bottom: 5% !important;
  }

  .mail-picoo-link {
    margin-top: 2%;
    margin-bottom: 20%;
  }

  .picoo-light-blue {
    font-family: "Quicksand", sans-serif !important;
    background-color: #00aeef !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    margin-left: 40%;
    margin-top: 5% !important;
    width: 60%;
  }

  .picoo-light-blue:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #1796c4 !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    margin-left: 40%;
    margin-top: 5% !important;
    width: 60%;
  }

  .picoo-light-blue-center-head:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #00aeef !important;
    color: white !important;
    border-radius: 50px;
    padding: 1.5% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 13px !important;
    margin-left: 35%;
    margin-top: 4% !important;
    width: 30%;
  }

  .picoo-light-blue-center-head:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #1796c4 !important;
    color: white !important;
    border-radius: 50px;
    padding: 1.5% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 13px !important;
    margin-left: 35%;
    margin-top: 4% !important;
    width: 30%;
  }

  .picoo-list-text {
    margin-left: 5%;
    font-family: "Quicksand", sans-serif !important;
    color: #292d78;
    font-size: 18px;
    float: right;
    position: relative;
    margin-top: -4.6%;
    width: 95%;
    margin-bottom: 3%;
  }

  .h3-blue-left h3 {
    font-family: "Quicksand", sans-serif !important;
    font-weight: 700 !important;
    text-align: left !important;
    color: #292d78 !important;
    font-size: 20px !important;
    margin-top: 2%;
    margin-bottom: 7%;
  }

  .svg-pre-order img {
    width: 100%;
    margin-top: 33%;
  }

  .menus {
    margin-left: -27%;
  }

  .picoo-education-align {
    margin-top: 7% !important;
  }

  .picoo-light-blue-center-cta {
    width: 90%;
    padding: 4% 1%;
    margin-left: 5%;
    margin-top: 6% !important;
  }
}

/* Smartphone - Landscape CSS based on 750px max-width */
@media only screen and (max-width: 750px) {
  .menus {
    margin-left: 0%;
  }

  /* orange-button CTA */
  .picoo-button-orange {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a948 !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 2%;
    width: 30%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  .news-images img {
    width: 100%;
    margin-top: 14%;
    margin-bottom: 2%;
  }

  .picoo-button-orange:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a848ad !important;
    color: white !important;
    border-radius: 50px;
    padding: 1% 2%;
    width: 30%;
    text-align: center;
    font-weight: bold;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  /* iFrames for videos */
  .picoo-iframe iframe {
    margin-left: 0%;
    width: 100%;
    height: 80vh;
    border-radius: 20px;
  }

  /* Shape classes */
  .green-shape-left-first img {
    z-index: -1;
    position: absolute;
    margin-left: -820%;
    margin-top: -200%;
  }

  .green-shape-right img {
    z-index: -1;
    position: absolute;
    margin-top: -230%;
    margin-left: 40%;
  }

  .blue-shape-left img {
    z-index: -1;
    position: absolute;
    margin-left: -220%;
    margin-top: -250%;
  }

  .blue-shape-right img {
    z-index: -1;
    position: absolute;
    margin-left: 150%;
    margin-top: -50%;
  }

  .purple-shape-left img {
    z-index: -1;
    position: absolute;
    margin-left: -220%;
    margin-top: 380%;
  }

  .dark-shape-right img {
    z-index: -1;
    position: absolute;
    margin-left: 1250%;
    margin-top: -50%;
  }

  .green-shape-left img {
    z-index: -1;
    position: absolute;
    margin-left: -220%;
    margin-top: 70%;
  }

  .orange-shape-right img {
    z-index: -1;
    position: absolute;
    transform: rotate(100deg);
    margin-left: 220%;
  }

  .pre-order-row {
    margin-top: 8% !important;

    position: relative;
    margin-bottom: -20%;
    padding-bottom: 25% !important;
  }

  .picoo-light-blue-center-email {
    font-family: "Quicksand", sans-serif !important;
    background-color: #00aeef !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 15px !important;
    margin-left: 25%;
    margin-top: 3% !important;
    margin-bottom: 3% !important;
    width: 50%;
  }

  .picoo-light-blue-center-email a {
    color: white;
    text-decoration: none;
  }

  .picoo-light-blue-center-email a:hover {
    color: black;
    text-decoration: none;
  }

  .picoo-light-blue-center-email:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #1796c4 !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 15px !important;
    margin-left: 25%;
    margin-top: 3% !important;
    margin-bottom: 3% !important;
    width: 50%;
  }

  /* Picoo e-mail link */

  .mail-picoo-link a {
    font-family: "Quicksand", sans-serif !important;
    color: #292d78;
    font-size: 17px;
    position: absolute;
    margin-top: 4%;
    margin-left: 29%;
    width: 40%;
    margin-bottom: 5% !important;
  }

  .mail-picoo-link {
    margin-top: 2%;
    margin-bottom: 20%;
  }

  .picoo-list-starter {
    margin-left: 5%;
    font-family: "Quicksand", sans-serif !important;
    color: #292d78;
    font-size: 18px;
    float: right;
    position: relative;
    margin-top: -4.2%;
    width: 95%;
    margin-bottom: 3%;
    text-align: left;
  }

  .starter-left {
    padding-top: 2% !important;
  }

  .starter-right {
    padding-top: 2% !important;
  }

  .first-image-block {
    margin-left: -1%;
    margin-right: 4%;
    margin-top: 3%;
  }

  .second-image-block {
    margin-top: 3%;
  }

  .p-different-distance h3 {
    margin-top: 2% !important;
    margin-bottom: 4% !important;
  }

  .picoo-benefits-icons {
    margin-bottom: 10%;
  }

  .review-block-dark {
    margin-top: 10% !important;
  }

  .lists-number-white ul li {
    margin-left: 6%;
  }

  .lists-number-white p {
    margin-top: 10%;
  }

  /* sub header */
  .sub-header.sub-header-absolute p a {
    margin-right: 1%;
  }

  .sub-header {
    width: 100%;
    background-color: #292d78;
    padding-top: 4%;
    padding-bottom: 3%;
  }

  .sub-header p {
    color: white;
    text-align: center;
    font-size: 10pt;
  }

  .sub-header p a {
    color: white;
    text-align: right;
  }

  /* games book images  quarter-, half-, full-width*/

  .games-book-quarter-width img {
    width: 25%;
    margin-top: 0%;
    margin-left: 37.5%;
  }

  .games-book-half-width img {
    width: 50%;
    margin-top: 0%;
    margin-left: 25%;
  }

  .games-book-full-width img {
    width: 100%;
    margin-top: 0%;
  }
}

/* Smartphone - Portrait CSS based on 414px max-width */
@media only screen and (max-width: 500px) {

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

  .hire-blocks {
    background-color: #c8ebfb;
    padding: 2%;
    float: left;
    width: 40%;
    border: solid white 5px;
    border-radius: 20px;
    height: 250px !important;
  }

  .dropdown-country-mobile {
    margin-top: 25%;
  }

  .youtube-video-middle {
    margin-top: 12%;
  }

  .youtube-video-middle iframe {
    width: 100%;
    margin-left: 0%;
    height: 20em;
  }

  /* orange-button CTA */
  .picoo-button-orange {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a948 !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    width: 60%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  .picoo-button-orange:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #f1a848ad !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    width: 60%;
    text-align: center;
    font-weight: bold;
    float: right;
    margin-bottom: 5%;
    margin-right: 2%;
  }

  /* iFrames for videos */
  .picoo-iframe iframe {
    margin-left: 0%;
    width: 80%;
    height: 40vh;
    border-radius: 20px;
  }

  /* pre-order CTA button */
  .menu-item-pre-order {
    background-color: #00aeef;
    border-radius: 50px;
    margin-right: 2%;
    color: white !important;
    width: 120%;
    padding: 3% 1%;
    margin-left: -10% !important;
    margin-top: 5% !important;
    margin-bottom: 5% !important;
  }

  .shape-left-pre-order,
  .shape-right-pre-order {
    display: none;
  }

  /* blue pre-order button */
  .picoo-light-blue {
    font-family: "Quicksand", sans-serif !important;
    background-color: #00aeef !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    margin-left: 20%;
    margin-top: 5% !important;
    width: 60%;
  }

  .picoo-light-blue:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #1796c4 !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    margin-left: 20%;
    margin-top: 5% !important;
    width: 60%;
  }

  /* Share buttons (test) */
  .share-buttons {
    margin-top: 5%;
  }

  .margin-left-shares {
    margin-left: 2%;
  }

  .share-buttons img {
    width: 600%;

    border: 0;
    box-shadow: 0;
    display: inline;
  }

  .picoo-light-blue-center {
    font-family: "Quicksand", sans-serif !important;
    background-color: #00aeef !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    margin-left: 20%;
    margin-top: 5% !important;
    width: 60%;
  }

  .picoo-light-blue-center a {
    color: white;
    text-decoration: none;
  }

  .picoo-light-blue-center a:hover {
    color: black;
    text-decoration: none;
  }

  .picoo-light-blue-center:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #1796c4 !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 18px !important;
    margin-left: 20%;
    margin-top: 5% !important;
    width: 60%;
  }

  /* Shape classes */
  .green-shape-left-first img {
    display: none;
  }

  .green-shape-right img {
    display: none;
  }

  .blue-shape-left img {
    display: none;
  }

  .blue-shape-right img {
    display: none;
  }

  .purple-shape-left img {
    display: none;
  }

  .dark-shape-right img {
    display: none;
  }

  .green-shape-left img {
    display: none;
  }

  .orange-shape-right img {
    display: none;
  }

  .pre-order-row {
    margin-top: 8% !important;

    position: relative;
    margin-bottom: -20%;
    padding-bottom: 25% !important;
  }

  /* fallback pages (succes, error) */
  .callbackpage-icon img {
    width: 40%;
    margin-left: 30%;
    margin-bottom: 5%;
    margin-top: 15%;
  }

  .callbackpage-icon-failed img {
    width: 30%;
    margin-left: 35%;
    margin-bottom: 5%;
    margin-top: 15%;
  }

  .picoo-light-blue-center-email {
    font-family: "Quicksand", sans-serif !important;
    background-color: #00aeef !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 15px !important;
    margin-left: 25%;
    margin-top: 5% !important;
    width: 50%;
  }

  .picoo-light-blue-center-email a {
    color: white;
    text-decoration: none;
  }

  .picoo-light-blue-center-email a:hover {
    color: black;
    text-decoration: none;
  }

  .picoo-light-blue-center-email:hover {
    font-family: "Quicksand", sans-serif !important;
    background-color: #1796c4 !important;
    color: white !important;
    border-radius: 50px;
    padding: 2% 2%;
    text-align: center;
    font-weight: bold;
    font-size: 15px !important;
    margin-left: 25%;
    margin-top: 5% !important;
    width: 50%;
  }

  /* Picoo e-mail link */

  .mail-picoo-link a {
    font-family: "Quicksand", sans-serif !important;
    color: #292d78;
    font-size: 17px;
    position: absolute;
    margin-top: 4%;
    margin-left: 27%;
    width: 39%;
    margin-bottom: 5% !important;
  }

  .mail-picoo-link {
    margin-top: 5%;
    margin-bottom: 20%;
  }

  .picoo-list-text {
    margin-left: 5%;
    font-family: "Quicksand", sans-serif !important;
    color: #292d78;
    font-size: 18px;
    float: right;
    position: relative;
    margin-top: -4.2%;
    width: 95%;
    margin-bottom: 3%;
  }

  .h3-blue-left h3 {
    font-family: "Quicksand", sans-serif !important;
    font-weight: 700 !important;
    text-align: left !important;
    color: #292d78 !important;
    font-size: 20px !important;
    margin-top: 2%;
    margin-bottom: 8%;
  }

  .svg-pre-order img {
    width: 100%;
    margin-top: -7%;
  }

  .h3-blue-right h3 {
    font-family: "Quicksand", sans-serif !important;
    font-weight: 700 !important;
    text-align: right !important;
    color: #292d78 !important;
    font-size: 20px !important;
    margin-top: 7%;
    margin-bottom: 3%;
  }

  .p-blue-right p {
    font-family: "Quicksand", sans-serif !important;
    font-weight: 400 !important;
    text-align: right !important;
    color: #292d78 !important;
    font-size: 18px !important;
    margin-top: 2%;
    margin-bottom: 5%;
  }

  #reserve_form input[type="tel"] {
    width: 221% !important;
    margin-left: -120%;
  }

  .check-agreement {
    margin-top: -36.5% !important;
    position: absolute;
    width: 100%;
    margin-left: 10%;
  }

  .active-sub {
    font-weight: 600;
    background-color: #ffffff !important;
    padding: 9% 2%;
    color: #292d78 !important;
  }

  .picoo-usp-block-great img {
    width: 45% !important;
    min-height: 8em;
  }

  .slideshow-container {
    width: 100%;
    float: left;
  }

  .mySlides {
    width: 100%;
    float: left;
  }

  .chevron .fa-chevron-left {
    text-align: left;
    padding-top: 25%;
    position: absolute;
    top: 60px;
    left: 20px;
    color: #292d78;
  }

  .chevron .fa-chevron-right {
    text-align: left;
    padding-top: 25%;
    position: absolute;
    top: 60px;
    right: 20px;
    color: #292d78;
  }
}

/* 27-inch screen */
@media only screen and (min-width: 2500px) {
  .check-agreement {
    margin-top: -4.5% !important;
    position: absolute;
    width: 100%;
  }
}