@CHARSET "UTF-8";

/* Add @import here - don't forget to start the address with //: to ensure HTTPS compatibility */
@import url(//fonts.googleapis.com/css?family=Lato:900|Nunito:300);

/* Selected text */
*::selection, input::selection {
  background: #82d5ff;
  color: #fff;
}

*::-moz-selection {
  background: #82d5ff;
  color: #fff;
}

body {
  margin: 0;
  padding: 0;
  font-size: 11pt;
  padding: 0;
  margin: 0;
  color: #fff;
  font-weight: 300;
  background:#4c2566;
  width:100%;
  min-height:100%;
  overflow:hidden;
  overflow-y:scroll;
  font-family: Nunito, sans-serif;  
}

/* "back to top" arrow */
#up-arrow {
  position: fixed;
  top: 5px;
  right: -100px;
  background: #754191;
  color: #fff;
  padding: 15px 24px 20px;
  opacity: 0;
  cursor: pointer;
  transition: right 0.4s, opacity 0.3s, background 0.3s, top 0.3s;
  z-index: 10000;
}

@media (max-width: 1159px) {
  #up-arrow {
    top: 72px;
  }
}

body.menu-scrolled #up-arrow:hover {
  background: #81549B;
}

body.menu-scrolled #up-arrow {
  right: 5px;
  opacity: 1;
}

.lang-selector {
  position: fixed;
  top: 10px;
  left: 10px;
  background: #754191;
  font-weight: bold;
  padding: 15px 20px 13px;;
  cursor: pointer;
  z-index: 10000;
}

@media (max-width: 1262px) {
  .lang-selector {
    position: absolute; 
    top: 110px;
    right: 0;
    left: auto;
  }  
} 

.lang-selector .current:after {
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 9px 7px 0 7px;
  border-color: #fff transparent transparent transparent;
  content: '';
  margin-left: 10px;
}

.lang-selector .selector {
  transform-origin: top left;
  transform: scaleY(0);
  transition: transform 0.3s;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
}

.lang-selector:hover .selector {
  transform: scaleY(1);
}

.lang-selector .selector a {
  background: #754191 none repeat scroll 0 0;
  color: #ffffff;
  display: block;
  padding: 8px 20px;
  text-decoration: none;
  transition: background 0.3s;
}

.lang-selector .selector a:hover {
  background: #9977AF;
}

/** Cookie warning */
.flexi-cookie {
  
}

.flexi-cookie-buttons {
  text-align: right;
}

.flexi-cookie-inner {
  padding-bottom: 10px;
}

/** Main page canvas wrapper - defines page width */
.flexi-cookie-inner, .content.brokenout .pb-block-outer>div, .wrapper {
  width: 1000px;
  margin: 0 auto;
}

/** Header */

.mobile-header {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
}

.header .mobile-header img {
  max-width: 100% !important;
  height: auto;
}

.header {
  background: #66ccff;
  background: -moz-linear-gradient(top,  #66ccff 0%, #6dceff 12%, #82d5ff 31%, #a4e1ff 53%, #d3f0ff 79%, #ffffff 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#66ccff), color-stop(12%,#6dceff), color-stop(31%,#82d5ff), color-stop(53%,#a4e1ff), color-stop(79%,#d3f0ff), color-stop(100%,#ffffff));
  background: -webkit-linear-gradient(top,  #66ccff 0%,#6dceff 12%,#82d5ff 31%,#a4e1ff 53%,#d3f0ff 79%,#ffffff 100%);
  background: -o-linear-gradient(top,  #66ccff 0%,#6dceff 12%,#82d5ff 31%,#a4e1ff 53%,#d3f0ff 79%,#ffffff 100%);
  background: -ms-linear-gradient(top,  #66ccff 0%,#6dceff 12%,#82d5ff 31%,#a4e1ff 53%,#d3f0ff 79%,#ffffff 100%);
  background: linear-gradient(to bottom,  #66ccff 0%,#6dceff 12%,#82d5ff 31%,#a4e1ff 53%,#d3f0ff 79%,#ffffff 100%);
}

.header .wrapper {
  height:435px;
  padding-top:20px;
  background:url(img/header-brick-wall.png) center bottom no-repeat;
  position:relative;  
}

div.admin-button {
  position:absolute;
  top:110px;
  right:20px;
  z-index:10;
  text-shadow:0 0 2px #7FD4FF,0 0 2px #7FD4FF,0 0 2px #7FD4FF,0 0 2px #7FD4FF,0 0 2px #7FD4FF,0 0 2px #7FD4FF;
}

div.admin-button a {
  color:#fff;
  text-decoration:none;
  font-size:15pt;
  font-family:lato;
  font-weight:bold;
  transition:color 0.3s;
}

div.admin-button a:hover {
  color:#4c2566;
}

.header img {
  max-width: none !important;
}

.header .wrapper .header-logo {
  margin-left:40px;
  width:250px;
  padding-top:25px;
  z-index:1;
  position:relative;
}

.header .wrapper .header-logo img {
  margin-bottom:-5px;
}

.header .wrapper .header-logo span {
  display:block;
  font-size:12pt;
  color:#754191;
  font-weight:900;
  font-family:lato;
  text-align:center;
  letter-spacing:1px;
  line-height:1.3em;
}

.header .wrapper .header-details {
  position:absolute;
  top:25px;
  right:0;
  z-index:1;
}

.header .wrapper .header-details span span {
  font-size:1.15em;
  vertical-align:baseline;
  margin-left:3px;
}

.header .wrapper .header-details div {
  margin-left:20px;
}

.header .wrapper .header-details * {
  display:inline-block;
  vertical-align:middle;
}

.header .wrapper .header-details a {
  text-decoration:none;
  font-size:0;
  position:relative;
}

.header .wrapper .header-details a.lang {
  font-size: 12pt;
  background: #754191;
  border-radius: 50%;
  padding: 7px;
  color: #fff;
  font-weight: bold;
}

.header .wrapper .header-details a.lang.selected {
  background: #9977af;
}
.header .wrapper .header-details a:after {
  position:absolute;
  left:0;
  top:0;
  height:100%;
  width:100%;
  border-radius:17px;
  content:'';
  background:#fff;
  opacity:0;
  transition:opacity 0.3s;
  -o-transition:opacity 0.3s;
  -ms-transition:opacity 0.3s;
  -moz-transition:opacity 0.3s;
  -webkit-transition:opacity 0.3s;
}

.header .wrapper .header-details a:hover:after {
  opacity:0.2;
}

.header .wrapper .header-details > span {
  font-size:14pt;
  color:#754191;
}

.header .wrapper .animation-container {
  width:1380px;
  left:-200px;
  position:absolute;
  bottom:0;
  z-index:0;
  height:100%;
}

.header .wrapper .animation-container > div {
  position:relative;
  height:100%;
}

.header .wrapper .animation-container .cloud-container {
  position:absolute;
  z-index:0;
  height:200px;
  top:80px;
  left:0;
  width:100%;
}

.header .wrapper .animation-container .cloud-container .cloud {
  position:absolute;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
  animation-timing-function:linear;
  -o-animation-timing-function:linear;
  -ms-animation-timing-function:linear;
  -moz-animation-timing-function:linear;
  -webkit-animation-timing-function:linear;
}

.header .wrapper .animation-container .cloud-container .cloud1 {
  left:310px;
  bottom:25px;
  animation-name:cloud1move;
  -o-animation-name:cloud1move;
  -ms-animation-name:cloud1move;
  -moz-animation-name:cloud1move;
  -webkit-animation-name:cloud1move;
  animation-duration:40s;
  -o-animation-duration:40s;
  -ms-animation-duration:40s;
  -moz-animation-duration:40s;
  -webkit-animation-duration:40s;
}

.header .wrapper .animation-container .cloud-container .cloud2 {
  left:490px;
  bottom:50px;
  animation-name:cloud2move;
  -o-animation-name:cloud2move;
  -ms-animation-name:cloud2move;
  -moz-animation-name:cloud2move;
  -webkit-animation-name:cloud2move;
  animation-duration:65s;
  -o-animation-duration:65s;
  -ms-animation-duration:65s;
  -moz-animation-duration:65s;
  -webkit-animation-duration:65s;
}

.header .wrapper .animation-container .cloud-container .cloud3 {
  top:0;
  left:560px;
  animation-name:cloud3move;
  -o-animation-name:cloud3move;
  -ms-animation-name:cloud3move;
  -moz-animation-name:cloud3move;
  -webkit-animation-name:cloud3move;
  animation-duration:140s;
  -o-animation-duration:140s;
  -ms-animation-duration:140s;
  -moz-animation-duration:140s;
  -webkit-animation-duration:140s;
}

.header .wrapper .animation-container .cloud-container .cloud4 {
  bottom:0;
  left:890px;
  animation-name:cloud4move;
  -o-animation-name:cloud4move;
  -ms-animation-name:cloud4move;
  -moz-animation-name:cloud4move;
  -webkit-animation-name:cloud4move;
  animation-duration:100s;
  -o-animation-duration:100s;
  -ms-animation-duration:100s;
  -moz-animation-duration:100s;
  -webkit-animation-duration:100s;
}

.header .wrapper .animation-container .cloud-container .cloud5 {
  top:20px;
  left:980px;
  animation-name:cloud5move;
  -o-animation-name:cloud5move;
  -ms-animation-name:cloud5move;
  -moz-animation-name:cloud5move;
  -webkit-animation-name:cloud5move;
  animation-duration:170s;
  -o-animation-duration:170s;
  -ms-animation-duration:170s;
  -moz-animation-duration:170s;
  -webkit-animation-duration:170s;
}

@keyframes cloud1move {
  0% {left:310px;}
  22% {left:0; opacity:1;}
  24% {left:-25px;opacity:0;}
  25% {left:1300px;opacity:0;}
  27% {left:1280px;opacity:1;}
  100% {left:310px;}
}

@keyframes cloud2move {
  0% {left:490px;}
  35% {left:0; opacity:1;}
  37% {left:-25px;opacity:0;}
  38% {left:1300px;opacity:0;}
  40% {left:1280px;opacity:1;}
  100% {left:490px;}
}

@keyframes cloud3move {
  0% {left:560px;}
  40% {left:0; opacity:1;}
  42% {left:-25px;opacity:0;}
  43% {left:1350px;opacity:0;}
  45% {left:1325px;opacity:1;}
  100% {left:560px;}
}

@keyframes cloud4move {
  0% {left:890px;}
  63% {left:0; opacity:1;}
  65% {left:-25px;opacity:0;}
  66% {left:1350px;opacity:0;}
  68% {left:1325px;opacity:1;}
  100% {left:890px;}
}

@keyframes cloud5move {
  0% {left:980px;}
  70% {left:0; opacity:1;}
  72% {left:-25px;opacity:0;}
  73% {left:1350px;opacity:0;}
  75% {left:1325px;opacity:1;}
  100% {left:980px;}
}

@-webkit-keyframes cloud1move {
  0% {left:310px;}
  22% {left:0; opacity:1;}
  24% {left:-25px;opacity:0;}
  25% {left:1300px;opacity:0;}
  27% {left:1280px;opacity:1;}
  100% {left:310px;}
}

@-webkit-keyframes cloud2move {
  0% {left:490px;}
  35% {left:0; opacity:1;}
  37% {left:-25px;opacity:0;}
  38% {left:1300px;opacity:0;}
  40% {left:1280px;opacity:1;}
  100% {left:490px;}
}

@-webkit-keyframes cloud3move {
  0% {left:560px;}
  40% {left:0; opacity:1;}
  42% {left:-25px;opacity:0;}
  43% {left:1350px;opacity:0;}
  45% {left:1325px;opacity:1;}
  100% {left:560px;}
}

@-webkit-keyframes cloud4move {
  0% {left:890px;}
  63% {left:0; opacity:1;}
  65% {left:-25px;opacity:0;}
  66% {left:1350px;opacity:0;}
  68% {left:1325px;opacity:1;}
  100% {left:890px;}
}

@-webkit-keyframes cloud5move {
  0% {left:980px;}
  70% {left:0; opacity:1;}
  72% {left:-25px;opacity:0;}
  73% {left:1350px;opacity:0;}
  75% {left:1325px;opacity:1;}
  100% {left:980px;}
}

.header .wrapper .animation-container .inspiring-text {
  position:absolute;
  top:110px;
  left:630px;
  color:#fff;
  text-decoration:none;
  font-size:15pt;
  font-family:lato;
  font-weight:bold;
  transition:color 0.3s;
  -o-transition:color 0.3s;
  -ms-transition:color 0.3s;
  -moz-transition:color 0.3s;
  -webkit-transition:color 0.3s;
  text-shadow:0 0 2px #7FD4FF,0 0 2px #7FD4FF,0 0 2px #7FD4FF,0 0 2px #7FD4FF,0 0 2px #7FD4FF,0 0 2px #7FD4FF;
}

.header .wrapper .animation-container .inspiring-text div {
  padding-left:100px;
}

.header .wrapper .animation-container .character-wrapper {
  position:absolute;
  bottom:0;
  left:0;
  height:145px;
  width:100%;
}

.header .wrapper .animation-container .character-wrapper > div .rel-container {
  position:relative;
  height:100%;
}

.header .wrapper .animation-container .character-wrapper > div {
  margin:0 auto;
  width:980px;
  position:relative;
  height:100%;
}

.header .wrapper .animation-container .character-wrapper div .character {
  position:absolute;
  bottom:0;
}

.header .wrapper .animation-container .character-wrapper div .char1 .char1-mirror-sprite {
  height:188px;
  width:79px;
  overflow:hidden;
  position:absolute;
  left:50px;
  bottom:7px;
}

.header .wrapper .animation-container .character-wrapper div .char1 .char1-mirror-sprite img {
  position:absolute;
  top:-188px;
}

.header .wrapper .animation-container .character-wrapper div .char1 .char1-main .char1-body {
  position:absolute;
  left:130px;
  bottom:5px;
}

.header .wrapper .animation-container .character-wrapper div .char1 .char1-main .char1-head {
  height:109px;
  width:103px;
  overflow:hidden;
  position:absolute;
  bottom:80px;
  left:140px;
  animation-duration:10s;
  -o-animation-duration:10s;
  -ms-animation-duration:10s;
  -moz-animation-duration:10s;
  -webkit-animation-duration:10s;
  animation-name:idle-sway;
  -o-animation-name:idle-sway;
  -ms-animation-name:idle-sway;
  -moz-animation-name:idle-sway;
  -webkit-animation-name:idle-sway;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
  transform-origin:50px bottom;
  -o-transform-origin:50px bottom;
  -ms-transform-origin:50px bottom;
  -moz-transform-origin:50px bottom;
  -webkit-transform-origin:50px bottom;
}

.header .wrapper .animation-container .character-wrapper div .char1 .char1-main .char1-head img {
  position:absolute;
  top:-109px;
  animation-duration:15s;
  -o-animation-duration:15s;
  -ms-animation-duration:15s;
  -moz-animation-duration:15s;
  -webkit-animation-duration:15s;
  animation-name:blink-1;
  -o-animation-name:blink-1;
  -ms-animation-name:blink-1;
  -moz-animation-name:blink-1;
  -webkit-animation-name:blink-1;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
  left:0;
}

.header .wrapper .animation-container .character-wrapper div .char1:hover .char1-main .char1-head img {
  top:-218px !important;
  left:-1px;
  animation-name:none;
  -o-animation-name:none;
  -ms-animation-name:none;
  -moz-animation-name:none;
  -webkit-animation-name:none;
}

.header .wrapper .animation-container .character-wrapper div .char1:hover .char1-mirror-sprite img {
  top:0px;
  left:-0;
}

.header .wrapper .animation-container .character-wrapper div .char2 .char2-body {
  position:absolute;
  left:290px;
  bottom:5px;
  width:104px;
  height:96px;
}

.header .wrapper .animation-container .character-wrapper div .char2 .char2-arm {
  position:absolute;
  left:378px;
  bottom:66px;
  z-index:5;
  animation-duration:2s;
  -o-animation-duration:2s;
  -ms-animation-duration:2s;
  -moz-animation-duration:2s;
  -webkit-animation-duration:2s;
  transform-origin:left 50px;
  -o-transform-origin:left 50px;
  -ms-transform-origin:left 50px;
  -moz-transform-origin:left 50px;
  -webkit-transform-origin:left 50px;
  animation-delay:0.5s;
  -o-animation-delay:0.5s;
  -ms-animation-delay:0.5s;
  -moz-animation-delay:0.5s;
  -webkit-animation-delay:0.5s;
}

.header .wrapper .animation-container .character-wrapper div .char2:hover .char2-arm {
  animation-name:hair-plump;
  -o-animation-name:hair-plump;
  -ms-animation-name:hair-plump;
  -moz-animation-name:hair-plump;
  -webkit-animation-name:hair-plump;
}

.header .wrapper .animation-container .character-wrapper div .char2 .char2-head {
  bottom:88px;
  left:310px;
  height:126px;
  width:109px;
  overflow:hidden;
  position:absolute;
  animation-duration:10s;
  -o-animation-duration:10s;
  -ms-animation-duration:10s;
  -moz-animation-duration:10s;
  -webkit-animation-duration:10s;
  animation-name:idle-sway;
  -o-animation-name:idle-sway;
  -ms-animation-name:idle-sway;
  -moz-animation-name:idle-sway;
  -webkit-animation-name:idle-sway;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
  transform-origin:50px bottom;
  -o-transform-origin:50px bottom;
  -ms-transform-origin:50px bottom;
  -moz-transform-origin:50px bottom;
  -webkit-transform-origin:50px bottom;
  animation-direction:reverse;
  -o-animation-direction:reverse;
  -ms-animation-direction:reverse;
  -moz-animation-direction:reverse;
  -webkit-animation-direction:reverse;
}

.header .wrapper .animation-container .character-wrapper div .char2 .char2-head img {
  position:absolute;
  top:-126px;
  animation-duration:10s;
  -o-animation-duration:10s;
  -ms-animation-duration:10s;
  -moz-animation-duration:10s;
  -webkit-animation-duration:10s;
  animation-name:blink-2a;
  -o-animation-name:blink-2a;
  -ms-animation-name:blink-2a;
  -moz-animation-name:blink-2a;
  -webkit-animation-name:blink-2a;
  animation-delay:3s;
  -o-animation-delay:3s;
  -ms-animation-delay:3s;
  -moz-animation-delay:3s;
  -webkit-animation-delay:3s;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
  left:0;
}

.header .wrapper .animation-container .character-wrapper div .char2:hover .char2-head img {
  animation-name:blink-2b;
  -o-animation-name:blink-2b;
  -ms-animation-name:blink-2b;
  -moz-animation-name:blink-2b;
  -webkit-animation-name:blink-2b;
  top:-252px;
}

.header .wrapper .animation-container .character-wrapper div .char3 .char3-body {
  width:84px;
  height:106px;
  position:absolute;
  bottom:5px;
  left:444px;
}

.header .wrapper .animation-container .character-wrapper div .char3 .char3-arm {
  position:absolute;
  bottom:75px;
  left:415px;
  animation-duration:2s;
  -o-animation-duration:2s;
  -ms-animation-duration:2s;
  -moz-animation-duration:2s;
  -webkit-animation-duration:2s;
  transform-origin:right 22px;
  -o-transform-origin:right 22px;
  -ms-transform-origin:right 22px;
  -moz-transform-origin:right 22px;
  -webkit-transform-origin:right 22px;
}

.header .wrapper .animation-container .character-wrapper div .char3:hover .char3-arm {
  animation-name:fonz-arm;
  -o-animation-name:fonz-arm;
  -ms-animation-name:fonz-arm;
  -moz-animation-name:fonz-arm;
  -webkit-animation-name:fonz-arm;
}

.header .wrapper .animation-container .character-wrapper div .char3 .char3-head {
  height:108px;
  width:103px;
  position:absolute;
  bottom:100px;
  left:420px;
  overflow:hidden;
  transform-origin:66px bottom;
  -o-transform-origin:66px bottom;
  -ms-transform-origin:66px bottom;
  -moz-transform-origin:66px bottom;
  -webkit-transform-origin:66px bottom;
  animation-name:idle-sway;
  -o-animation-name:idle-sway;
  -ms-animation-name:idle-sway;
  -moz-animation-name:idle-sway;
  -webkit-animation-name:idle-sway;
  animation-duration:15s;
  -o-animation-duration:15s;
  -ms-animation-duration:15s;
  -moz-animation-duration:15s;
  -webkit-animation-duration:15s;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
}

.header .wrapper .animation-container .character-wrapper div .char3 .char3-head img {
  position:absolute;
  top:-108px;
  animation-duration:8s;
  -o-animation-duration:8s;
  -ms-animation-duration:8s;
  -moz-animation-duration:8s;
  -webkit-animation-duration:8s;
  animation-name:blink-3a;
  -o-animation-name:blink-3a;
  -ms-animation-name:blink-3a;
  -moz-animation-name:blink-3a;
  -webkit-animation-name:blink-3a;
  animation-delay:2s;
  -o-animation-delay:2s;
  -ms-animation-delay:2s;
  -moz-animation-delay:2s;
  -webkit-animation-delay:2s;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
  left:0;
}

.header .wrapper .animation-container .character-wrapper div .char3:hover .char3-head img {
  top:-216px;
  animation-name:none;
  -o-animation-name:none;
  -ms-animation-name:none;
  -moz-animation-name:none;
  -webkit-animation-name:none;
}

.header .wrapper .animation-container .character-wrapper div .char4 .char4-body {
  width:100px;
  height:102px;
  position:absolute;
  bottom:8px;
  left:610px;
  overflow:hidden;
  z-index:19;
}

.header .wrapper .animation-container .character-wrapper div .char4 .char4-body.char4-body-glow img {
  top:-103px;
  opacity:0;
  z-index:100;
  transition:opacity 1s;
  -o-transition:opacity 1s;
  -ms-transition:opacity 1s;
  -moz-transition:opacity 1s;
  -webkit-transition:opacity 1s;
  position:absolute;
}

.header .wrapper .animation-container .character-wrapper div .char4:hover .char4-body.char4-body-glow img {
  opacity:1;
}

.header .wrapper .animation-container .character-wrapper div .char4 .char4-head {
  height:134px;
  width:120px;
  position:absolute;
  bottom:64px;
  left:605px;
  overflow:hidden;
  transform-origin:55px 92px;
  -o-transform-origin:55px 92px;
  -ms-transform-origin:55px 92px;
  -moz-transform-origin:55px 92px;
  -webkit-transform-origin:55px 92px;
  animation-name:idle-sway;
  -o-animation-name:idle-sway;
  -ms-animation-name:idle-sway;
  -moz-animation-name:idle-sway;
  -webkit-animation-name:idle-sway;
  animation-duration:8s;
  -o-animation-duration:8s;
  -ms-animation-duration:8s;
  -moz-animation-duration:8s;
  -webkit-animation-duration:8s;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
}

.header .wrapper .animation-container .character-wrapper div .char5 {
  animation-duration:5s;
  -o-animation-duration:5s;
  -ms-animation-duration:5s;
  -moz-animation-duration:5s;
  -webkit-animation-duration:5s;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
  transform-origin:48px bottom;
  -o-transform-origin:48px bottom;
  -ms-transform-origin:48px bottom;
  -moz-transform-origin:48px bottom;
  -webkit-transform-origin:48px bottom;
  transition:transform 0.3s;
  -o-transition:-o-transform 0.3s;
  -ms-transition:-ms-transform 0.3s;
  -moz-transition:-moz-transform 0.3s;
  -webkit-transition:-webkit-transform 0.3s;
  height:324px;
  left:750px;
  bottom:8px;
  position:absolute;
}

.header .wrapper .animation-container .character-wrapper div .char5:hover {
  animation-name:rock-ladder;
  -o-animation-name:rock-ladder;
  -ms-animation-name:rock-ladder;
  -moz-animation-name:rock-ladder;
  -webkit-animation-name:rock-ladder;
}

.header .wrapper .animation-container .character-wrapper div .char5 .char5-body {
  left:0px;
  bottom:8px;
  position:absolute;
}

.header .wrapper .animation-container .character-wrapper div .char5 .char5-arm {
  animation-duration:6s;
  -o-animation-duration:6s;
  -ms-animation-duration:6s;
  -moz-animation-duration:6s;
  -webkit-animation-duration:6s;
  animation-direction:alternate;
  -o-animation-direction:alternate;
  -ms-animation-direction:alternate;
  -moz-animation-direction:alternate;
  -webkit-animation-direction:alternate;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
  position:absolute;
  left:133px;
  bottom:87px;
  transform-origin:15px 10px;
  -o-transform-origin:15px 10px;
  -ms-transform-origin:15px 10px;
  -moz-transform-origin:15px 10px;
  -webkit-transform-origin:15px 10px;
  transition:transform 0.4s;
  -o-transition:transform 0.4s;
  -ms-transition:transform 0.4s;
  -moz-transition:transform 0.4s;
  -webkit-transition:transform 0.4s;
}

.header .wrapper .animation-container .character-wrapper div .char5:hover .char5-arm {
  animation-name:arm-wave;
  -o-animation-name:arm-wave;
  -ms-animation-name:arm-wave;
  -moz-animation-name:arm-wave;
  -webkit-animation-name:arm-wave;
}

.header .wrapper .animation-container .character-wrapper div .char5 .char5-head {
  bottom:143px;
  left:97px;
  position:absolute;
  height:98px;
  width:122px;
  overflow:hidden;
  transform-origin:32px bottom;
  -o-transform-origin:32px bottom;
  -ms-transform-origin:32px bottom;
  -moz-transform-origin:32px bottom;
  -webkit-transform-origin:32px bottom;
  animation-name:idle-sway;
  -o-animation-name:idle-sway;
  -ms-animation-name:idle-sway;
  -moz-animation-name:idle-sway;
  -webkit-animation-name:idle-sway;
  animation-duration:12s;
  -o-animation-duration:12s;
  -ms-animation-duration:12s;
  -moz-animation-duration:12s;
  -webkit-animation-duration:12s;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
}

.header .wrapper .animation-container .character-wrapper div .char5 .char5-head img {
  position:absolute;
  top:-98px;
  left:0;
  animation-duration:11s;
  -o-animation-duration:11s;
  -ms-animation-duration:11s;
  -moz-animation-duration:11s;
  -webkit-animation-duration:11s;
  animation-name:blink-5;
  -o-animation-name:blink-5;
  -ms-animation-name:blink-5;
  -moz-animation-name:blink-5;
  -webkit-animation-name:blink-5;
  animation-delay:1s;
  -o-animation-delay:1s;
  -ms-animation-delay:1s;
  -moz-animation-delay:1s;
  -webkit-animation-delay:1s;
  animation-iteration-count:infinite;
  -o-animation-iteration-count:infinite;
  -ms-animation-iteration-count:infinite;
  -moz-animation-iteration-count:infinite;
  -webkit-animation-iteration-count:infinite;
}

.header .wrapper .animation-container .character-wrapper div .char5:hover .char5-head img {
  top:-196px;
  animation-name:none;
  -o-animation-name:none;
  -ms-animation-name:none;
  -moz-animation-name:none;
  -webkit-animation-name:none;
}


@keyframes idle-sway {
  0% {transform: rotate(0deg);-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);}
  20% {transform: rotate(-5deg);-moz-transform: rotate(-5deg);-ms-transform: rotate(-5deg);}
  70% {transform: rotate(7deg);-moz-transform: rotate(7deg);-ms-transform: rotate(7deg);}
  100% {transform: rotate(0deg);-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);}
}

@keyframes blink-1 {
  19% {top:-109px;}
  19.001% {top:1px;}
  20% {top:1px;}
  20.001% {top:-109px;}
}

@keyframes blink-2a {
  49% {top:-126px;}
  49.001% {top:0px;}
  50% {top:0px;}
  50.001% {top:-126px;}
}

@keyframes blink-2b {
  49% {top:-252px;}
  49.001% {top:0px;}
  50% {top:0px;}
  50.001% {top:-252px;}
  51% {top:-252px;}
  51.001% {top:0px;}
  52% {top:0px;}
  52.001% {top:-252px;}
}

@keyframes blink-3a {
  18% {top:-108px;}
  18.001% {top:1px;}
  20% {top:1px;}
  20.001% {top:-108px;}
}

@keyframes blink-5 {
  80% {top:-98px;}
  80.001% {top:0px;}
  81.5% {top:0px;}
  81.501% {top:-98px;}
}

@keyframes hair-plump {
  0% {transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);}
  35% {transform:rotate(-6deg);-ms-transform:rotate(-6deg);-moz-transform:rotate(-6deg);}
  50% {transform:rotate(-3deg);-ms-transform:rotate(-3deg);-moz-transform:rotate(-3deg);}
  65% {transform:rotate(-6deg);-ms-transform:rotate(-6deg);-moz-transform:rotate(-6deg);}
  100% {transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);}
}

@keyframes fonz-arm {
  0% {transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);}
  40% {transform:rotate(-6deg);-ms-transform:rotate(-6deg);-moz-transform:rotate(-6deg);}
  60% {transform:rotate(-6deg);-ms-transform:rotate(-6deg);-moz-transform:rotate(-6deg);}
  100% {transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);}
}

@keyframes rock-ladder {
  0% {transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);}
  20% {transform:rotate(2deg);-ms-transform:rotate(2deg);-moz-transform:rotate(2deg);}
  50% {transform:rotate(-4deg);-ms-transform:rotate(-4deg);-moz-transform:rotate(-4deg);}
  70% {transform:rotate(4deg);-ms-transform:rotate(4deg);-moz-transform:rotate(4deg);}
  100% {transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);}
}

@keyframes arm-wave {
  0% {transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);}
  12.5% {transform:rotate(-40deg);-ms-transform:rotate(-40deg);-moz-transform:rotate(-40deg);}
  25% {transform:rotate(-80deg);-ms-transform:rotate(-80deg);-moz-transform:rotate(-80deg);}
  37.5% {transform:rotate(-20deg);-ms-transform:rotate(-20deg);-moz-transform:rotate(-20deg);}
  12.5% {transform:rotate(-90deg);-ms-transform:rotate(-90deg);-moz-transform:rotate(-90deg);}
  50% {transform:rotate(-65deg);-ms-transform:rotate(-65deg);-moz-transform:rotate(-65deg);}
  62.5% {transform:rotate(-80deg);-ms-transform:rotate(-80deg);-moz-transform:rotate(-80deg);}
  75% {transform:rotate(-35deg);-ms-transform:rotate(-35deg);-moz-transform:rotate(-35deg);}
  87.5% {transform:rotate(-50deg);-ms-transform:rotate(-50deg);-moz-transform:rotate(-50deg);}
  100% {transform:rotate(0deg);-ms-transform:rotate(0deg);-moz-transform:rotate(0deg);}
}


@-webkit-keyframes idle-sway {
  0% {-webkit-transform: rotate(0deg);}
  20% {-webkit-transform: rotate(-5deg);}
  70% {-webkit-transform: rotate(7deg);}
  100% {-webkit-transform: rotate(0deg);}
}

@-webkit-keyframes blink-1 {
  19% {top:-109px;}
  19.001% {top:1px;}
  20% {top:1px;}
  20.001% {top:-109px;}
}

@-webkit-keyframes blink-2a {
  49% {top:-126px;}
  49.001% {top:0px;}
  50% {top:0px;}
  50.001% {top:-126px;}
}

@-webkit-keyframes blink-2b {
  49% {top:-252px;}
  49.001% {top:0px;}
  50% {top:0px;}
  50.001% {top:-252px;}
  51% {top:-252px;}
  51.001% {top:0px;}
  52% {top:0px;}
  52.001% {top:-252px;}
}

@-webkit-keyframes blink-3a {
  18% {top:-108px;}
  18.001% {top:1px;}
  20% {top:1px;}
  20.001% {top:-108px;}
}

@-webkit-keyframes blink-5 {
  80% {top:-98px;}
  80.001% {top:0px;}
  81.5% {top:0px;}
  81.501% {top:-98px;}
}

@-webkit-keyframes hair-plump {
  0% {-webkit-transform:rotate(0deg)}
  35% {-webkit-transform:rotate(-6deg)}
  50% {-webkit-transform:rotate(-3deg)}
  65% {-webkit-transform:rotate(-6deg)}
  100% {-webkit-transform:rotate(0deg)}
}

@-webkit-keyframes fonz-arm {
  0% {-webkit-transform:rotate(0deg)}
  40% {-webkit-transform:rotate(-6deg)}
  60% {-webkit-transform:rotate(-6deg)}
  100% {-webkit-transform:rotate(0deg)}
}

@-webkit-keyframes rock-ladder {
  0% {-webkit-transform:rotate(0deg)}
  20% {-webkit-transform:rotate(2deg)}
  50% {-webkit-transform:rotate(-4deg)}
  70% {-webkit-transform:rotate(4deg)}
  100% {-webkit-transform:rotate(0deg)}
}

@-webkit-keyframes arm-wave {
  0% {transform:rotate(0deg);}
  12.5% {transform:rotate(-40deg);}
  25% {transform:rotate(-80deg);}
  37.5% {transform:rotate(-20deg);}
  12.5% {transform:rotate(-90deg);}
  50% {transform:rotate(-65deg);}
  62.5% {transform:rotate(-80deg);}
  75% {transform:rotate(-35deg);}
  87.5% {transform:rotate(-50deg);}
  100% {transform:rotate(0deg);}
}

/** Menu */

.menubar {  
  padding: 10px 0;
  font-family: Lato, sans-serif;
  font-weight: bold;
  text-transform: uppercase;
  background: #4c2566;
  text-align: center;
}

nav.menu span.item span.submenu {
  text-align: center;
  background: #4C2566;
}

nav.menu span.toplevel-sep {
  display: none;
}

nav.menu>span.item {
  padding: 0 1px;
}

nav.menu span.item a {
  background: #754191;
  color: #fff;
  transition: background 0.3s, color 0.3s;
  padding: 15px 21px;
  margin-bottom: 4px;
}

nav.menu span.item a:hover {
  background: #9977af;
}

nav.menu span.item.has-submenu>a:after {
  content: ' ▾';
}

nav.menu span.item span.submenu a, 
nav.menu span.item.subitem {
  display: block;
}

body.lang-w nav.menu>span.item>a {
  padding: 15px 4px;
}

/** Flyout show button */
.flyo-show {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  text-align: center;
  z-index: 10000;  
}

.flyo-hide {
  color: #fff;
  padding: 6px;
}

.flyo-header {
  text-align: center;
  padding-top: 5px;
}

/** Menu when page is scrolled down */

body.menu-scrolled div.menubar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
}

body.menu-scrolled div.content {
  padding-top: 48px;
}

body.menu-scrolled div.content.breakoutresume {
  padding-top: 12px;
}

/** General content styles */

/** Remove top margin from the first element */
.content *:first-child {
  margin-top: 0;
}

.content {
  
}

.content ul li {
  list-style-type: '⏵ ';  
}

.formandu-section,
.content h1, 
.content h2, 
.content h3, 
.content h4 {
  font-family: Lato, sans-serif;
  font-weight: bold;
}

.formandu-section {
  display: block;
  font-size: 18pt;
  padding: 10px 0;
}

.checkradiolist {
  padding: 10px;
}

/** Important for breakout/breakins */
.content:empty {
  display: none;
}

.content a {
  color: #90daff;
  transition: color 0.3s;  
}

.content a:hover {
  color: #fff;
}

.footer {
  color: #fff;
  font-size: 9pt;
  padding: 20px 0 10px;
}

.footer-sticky .footer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}

.footer a {
  color: #fff;
  transition: color 0.3s;
  text-decoration: none;
}

.footer a:hover {
  color: #eee;
}

.footer .col3 {
  text-align: right;
} 


/** Buttons and button-type things */
button, input[type="submit"], .button, .formandu-button, input[type="button"], a.button, .eshop_userauth_buttonbox a {
  background: #754191;
  color: #fff;
  transition: background 0.3s;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  padding: 15px 22px;
  display: inline-block;
  text-decoration: none;
  border: none;
  cursor: pointer;
  font-family: Lato, sans-serif;
  text-transform: uppercase;  
}

button:hover, input[type="submit"]:hover, .button:hover, .formandu-button:hover, input[type="button"]:hover, a.button:hover, .eshop_userauth_buttonbox a:hover {
  background: #9977af;  
}

/** Text controls */
.formandu-text, .formandu-dropdown, .formandu-textarea, select {
  background: #fff;
  border: 1px solid #fff;
  transition: border 0.3s;  
  font-size: 12pt;
  font-family: Lato, sans-serif;
  margin: 10px;
  padding: 8px;
  width: calc(100% - 20px);
  box-sizing: border-box;
  color: #444;
  outline: 1px solid #fff;
}

.formandu-text:hover, .formandu-text:focus, .formandu-dropdown:hover, .formandu-dropdown:focus, .formandu-textarea:hover, .formandu-textarea:focus, select:hover, select:focus {
  border: 1px solid #9977af; 
}

span[style="color: red"] {
  font-size: 0;
}

span[style="color: red"]:after {
  font-size: 14pt;
  content: '☀';
  color: #fff;
  background: #9977af;
  padding: 2px 5px;
  display: inline-block;
}

/*******************************************************************************
 ** Responsive */

/** Phone/tablet */

@media (max-width: 1000px) {
  body.menu-scrolled div.content {
    padding-top: 0;
  }
  body.menu-scrolled div.menubar {
    position: fixed; top: 0;
  }
  .content.brokenout .pb-block-outer>div, .wrapper, .flexi-cookie-inner {
    width: 100%;
  }  
  #up-arrow, .search .form {
    display: none;
  }
  
}

/** Menus */

@media (max-width: 975px) {
  .mobile-header {
    display: block;
  }
  .menubar {
    height: 0;
    padding: 0;
  }
  nav.menu {
    padding: 0;
    border-right: 2px solid #fff;
    background: #4C2566;
  }
  nav.menu span.item a {
    font-weight: bold;
    color: #fff !important;
    background: none;
  }
  nav.menu.flyout span.item {
    text-align: left;
  }
  nav.menu.flyout span.item span.submenu {
    padding: 0 0 5px 20px;
  }
  .header .wrapper {
    min-height: 435px;
    height: auto;
    text-align: center;
    padding: 30px 0 0;
  }
  nav.menu span.item.has-submenu>a:after {
    content: ' ▸';
  }
  .header {
    margin-bottom: 20px;
  }
  .header .wrapper .header-logo {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    margin: 0;
    padding: 0;
    width: auto;
  }  
  .header .wrapper .header-logo span {
    display: none;
  }
  .header .wrapper .animation-container {
    display: none;
    height: 0;
    width: 0;
    overflow: hidden;
  }
  .header .wrapper .animation-container * {
    display: none;
  }
  .header .wrapper .header-details {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
  }
  .header .wrapper .header-details>* {
    display: block !important;
  }
  .lang-selector {
    position: relative;
    margin: 10px 0;
    display: inline-block;
    top: auto;
    left: auto;
    right: auto;
  }
  .content.unbroken, .content.brokenout .pb-block-outer > div {
    padding: 0 5px;
    width: calc(100% - 10px);
  }
  .content.brokenout .pb-block-outer.pb-block-11>div {
    padding: 0;
  }
  body {
    padding-top: 30px;
  }
  body.lang-w .flyo-show .flyo-caption, body.lang-w .flyo-hide .flyo-caption {
    font-size: 0;
  }
  body.lang-w .flyo-show .flyo-caption:after {
    content: 'Dewislen';
    font-size: 11pt;
  }
  body.lang-w .flyo-hide .flyo-caption:after {
    content: 'Celu';
    font-size: 11pt;
  }
}

/** Big phone */

@media (max-width: 750px) {
  .formandu-text, .formandu-textarea, .formandu-dropdown, .formandu-static-text, .formandu-listbox {
    width: 95%;
  }
  .footer {
    padding: 0 5px;
  }
  .flexi-cookie-msg {    
    float: none;
    text-align: center;
    padding: 30px 0 0;
    width: auto; 
  }
  .flexi-cookie-buttons {
    width: auto;    
    float: none;
    text-align: center;
    padding: 5px 0;
  }
}

/** Small phone */

@media (max-width: 600px) {
  .content {
    padding: 0 3px;
  }
  .footer .col3, .footer {
    text-align: center;
  }  
}

