.header-bg {
  background-image: url("./../img/bg/bg.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom;
}

@font-face {
  font-family: "perryGothic";
  src: url("./../fonts/PERRYGOT.TTF");
}

@font-face {
  font-family: "MedievalSharp";
  src: url("./../fonts/MedievalSharp-Regular.ttf");
}

.blogpost ul li {
  font-size: 1.2rem;
}

.features-items p {
  font-size:1.25rem;
}


@media only screen and (max-width: 750px) {
   .features-items p {
    font-size:1rem !important;
  }
}

.presskit a, .alert a, .blogpost a, .articlelist p a {
    text-decoration: underline;
    color: #ffc107 !important;
}


.yellowlink a {
    text-decoration: underline;
    color: #ffffff !important;
}

.yellowlink a:hover {
    text-decoration: underline;
    color: #ffc107 !important;
}


.alert p {
    font-size: 1.2rem;
}

.blogpost p {
    font-size: 1.1rem;
}

.timeline a {
  text-decoration: underline;
}

.newyear::before {
  font-weight: bold;
}


.social-links {  
  height: 64px;  
  display: inline-block;    
  text-align: center;
  width: 100%;
}

.social-links img {  
  margin-right: 15px;
  height: 100%;    
}

.presskit {
    padding-top: 3rem !important; 
    font-size: 0.8rem;
}

.presskit h2 {
    font-size: 1.4rem;
}

.presskit h3 {
    font-size: 1.2rem;
}

.presskit h4 {
    font-size: 1rem;
}

.signup {
    margin: 0 auto !important; 
    width: 280px !important; 
    height: 40px !important; 
    font-size: 1.3rem !important; 
    background-color: #6c0404 !important;
    border: 2px !important;
    border-style: solid !important;
    border-color: black !important;
    transition: background-color 0.10s ease-in-out;
}

.signup:hover {
    background-color: #880c0c !important;
}

.mainbg {
    background-image: url(../img/bg/bg_main.png);
    background-repeat: repeat;    
}

.wishlistButton {
    width: 260px;
    background: #081631;
    border-radius: 43px;
    text-align: left;    
    display: inline-block;    
    height: 89px;    
}

.wishlistButton img {
    max-width: 100%;
    width: 89px;
    vertical-align: top;    
}

.wishlistText {    
    font-weight: bold;
    padding-top: 12px;
    padding-left: 20px;        
    display: inline-block;
    line-height: 2rem;                
}

.patronButton {
    width: 260px;
    background: #002c49;        
    text-align: left;    
    display: inline-block;    
    height: 89px;    
}

.patronButton img {
    max-width: 100%;
    width: 89px;
    vertical-align: top;    
}

.patronText {    
    font-weight: bold;
    padding-top: 12px;
    padding-left: 20px;        
    display: inline-block;
    line-height: 2rem;                
}

.socialmedia-bottom {
    background-image: url(../img/bg/bg_scroll_bottom.png);
    background-repeat: repeat-x;    
    height: 32px;
}

.socialmedia {
    padding-top: 0;
    background-image: url(../img/bg/bg_scroll.png);
    background-repeat: repeat-x;
    background-color: #b3966b;                
    border-bottom: 3px solid #8a402e;
    border-top: 3px solid #8a402e;                
}

.socialmedia h2, .socialmedia p {
    color: #0e0e16 !important;
    font-weight: bold;
}


.wishlist {
    padding-top: 0;
    background-image: url(../img/bg/bg_sky.jpg);
    background-size: cover;
    background-position: bottom;                
}

.wishlist h2 {
    color: #0e0e16 !important;
}

.wishlist p {
    color: #0e0e16 !important;
}

.subscribe {
    padding-top: 0;
    background-image: url(../img/bg/bg_grass.jpg);
    background-repeat: repeat;            
}

.roadTopLine {
    height: 32px;
    background-image: url(../img/bg/bg_roadLine.png);
    background-repeat: repeat-x;
}
    
.forestTopLine {
    height: 36px;
    background-image: url(../img/bg/bg_border.jpg);
    background-repeat: repeat-x;    
}

#myCookieConsent {
    z-index: 999;
    min-height: 20px;
    font-family: OpenSans, arial, "sans-serif";
    padding: 10px 20px;
    background: rgba(0,0,0,0.6);
    overflow: hidden;
    position: fixed;
    color: #FFF;
    bottom: 0px;
    right: 10px;
    display: none;
    left: 0;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
}
#myCookieConsent div {
    padding: 5px 0 0;
}
#myCookieConsent a {
    color: #ffba55;
    display: inline-block;
    padding: 0 10px;
}
#myCookieConsent a:hover {
	color: #fda016;
}
#myCookieConsent a#cookieButton {
    display: inline-block;
    color: #000000;
    font-size: 1.1em;
	background: #ffba55;
    text-decoration: none;
    cursor: pointer;
    padding: 2px 20px;
    float: right;
    border-radius: 20px;
}
#myCookieConsent a#cookieButton:hover {
    background: #fda016;
	color: #000;
}

.joboffer p {
    font-size: 18px;
}

.joboffer li {
    font-size: 18px;
}

.joboffer a {
    color: #ffc107;
}

.container-t {
  width: 100%;  
  height: 100%;
  margin-right: auto;
  margin-left: auto; 
  }
  
   @media (min-width: 300px) {
    .container-t {
      max-width: 290px;
      max-height: 290px;}      
      }
  @media (min-width: 400px) {
    .container-t {
      max-width: 380px;
      max-height: 380px;} }
  
  @media (min-width: 576px) {
    .container-t {
      max-width: 560px;
      max-height: 560px;}
      .progress-bar25 { height: 15px;}
      .progress-bar50 { height: 15px;}
      .progress-bar75 { height: 15px;}
      .progress-bar100 { height: 15px;}
      .factsheettext { font-size: 0.6em;}
      .progresssbartext { margin-top: -17px; }              
      }
      
  @media (min-width: 768px) {
    .container-t {
      max-width: 750px; 
      max-height: 750px;} }
  @media (min-width: 992px) {
    .container-t {
      max-width: 940px;
      max-height: 940px; }
      
      .progress-bar25 { height: 20px;}
      .progress-bar50 { height: 20px;}
      .progress-bar75 { height: 20px;}
      .progress-bar100 { height: 20px;}            
      .factsheettext { font-size: 1em;}
      .progresssbartext { margin-top: -25px; }
      }  


/* Animated Progress Bar*/
.progresscontainer {
  width: 100%;  
  border-radius: 30px;
  background-color: #888;   
}

.progresssbartext {    
   color: #0d0d0d; 
   text-align: center;
   font-weight: 600;
}

/* 100% */
.progress100 {
  width: 100%
}

.progress-bar100 {
  margin: 2px 0px;  
  border-radius: 30px;
  transition: 0.4s linear;
  transition-property: width, background-color, box-shadow;
}


.progress-moved .progress-bar100 {
  background-color:  #64f323;
  animation: progress100 3s;
}

@keyframes progress100 {
  0% {
    width: 0%;
    background: #f9bcca;
  }

  100% {
    width: 100%;
    background:  #64f323;    
  }
}

/* 75% */
.progress75 {
  width: 75%
}

.progress-bar75 {
  margin: 2px 0px;  
  border-radius: 30px;
  transition: 0.4s linear;
  transition-property: width, background-color, box-shadow;
}

.progress-moved .progress-bar75 {
  background-color:  #c7ff00;
  animation: progress75 3s;
}

@keyframes progress75 {
  0% {
    width: 0%;
    background: #f9bcca;
  }

  100% {
    width: 100%;
    background:  #c7ff00;    
  }
}


/* 50% */
.progress50 {
  width: 50%
}


.progress-bar50 {
  margin: 2px 0px;  
  border-radius: 30px;
  transition: 0.4s linear;
  transition-property: width, background-color, box-shadow;
}

.progress-moved .progress-bar50 {
  background-color: #f3c623;
  animation: progress50 3s;
}

@keyframes progress50 {
  0% {
    width: 0%;
    background: #f9bcca;
  }

  100% {
    width: 100%;
    background: #f3c623;    
  }
}

/* 25% */
.progress25 {
  width: 25%
}


.progress-bar25 {
  margin: 2px 0px;  
  border-radius: 30px;
  transition: 0.4s linear;
  transition-property: width, background-color, box-shadow;
}

.progress-moved .progress-bar25 {
  background-color:  #ff6c00;
  animation: progress25 3s;
}

@keyframes progress25 {
  0% {
    width: 0%;
    background: #f9bcca;
  }

  100% {
    width: 100%;
    background:  #ff6c00;    
  }
}


 * {
  box-sizing: border-box;
}

/* Flickity */

.gallery-cell {
  width: 95%;  
  margin-right: 10px;
  background: #1C1C1C;
  counter-increment: gallery-cell;
  padding: 10px;
}

.gallery-cell-headerimg {
  margin: 10px -10px;
     
}

.gallery-cell-gameprojects {
  height: 960px;
}

.gallery-cell-previouswork {
  height: 530px;
}