@font-face
{
  font-family: 'GuacamoleFont';
  src: url('../fonts/Cutting Corners.ttf');
}

#footer{
  position: fixed;
  bottom: 0px;
  margin: 15px;
  color: white;
  text-shadow: #fff 0px 0px 10px;
}

.background
{
  background-color: black;
  background-image: url("../img/Guacamole site Background.jpg");
  background-size: cover;
  background-repeat: repeat-y;
}
.row.main{
  position: relative;
  margin-bottom: 50px;
}

.shadow-bar{
  background-color:rgba(0,0,0,0.7);
  padding: 15px;
}
.glowing-text{
  color:fff050;
  text-shadow:#ff2300 0px 0px 10px, #ff2300 0px 0px 10px, #ff2300 0px 0px 10px, #ff2300 0px 0px 10px, #ff2300 0px 0px 10px;
  font-family:GuacamoleFont;
  font-size:16px;
  line-height:25px;  
}
.green-text{
  padding: 30px;
  color: c2e66b;
  text-shadow:#5aa01e 0px 0px 10px, #5aa01e 0px 0px 10px, #5aa01e 0px 0px 10px, #5aa01e 0px 0px 10px, #5aa01e 0px 0px 10px;
  font-family:arial;
  font-size:16px;
  line-height:28px;
}
.title-text{
  text-align: center;
  font-size:20px;
  line-height:28px;
}
.holder-of-images{
  min-height: 400px; /*Never less than this - give me scrollbars if necessary*/
  height: 400px;
}
.wiiUlogo
{
  position: absolute;
  left: 0px;
  top: 10px;
  cursor: pointer;
}
.facebookLogo
{
  position: absolute;
  left: 0px;
  top: 88px;
  cursor: pointer;
}

.normal.svartKloss
{  
  position: absolute;
  right: 0px;
  top: 10px;
  
  padding: 10px;
  background-color:rgba(0,0,0,0.7);
  text-align: center;
  width: 150px;
}

.index-column{
  margin-top: -200px;
  height: 50%;
}
.media-column{
  margin-top: -200px;
}


.linkText
{
  font-size:19px;
  line-height:27px;
  white-space:nowrap;
  text-align: center;
}

.linkText.credits
{
  color:b4fa3c;
  text-shadow:#4b6e00 0px 0px 4px, #4b6e00 0px 0px 4px, #4b6e00 0px 0px 4px, #4b6e00 0px 0px 4px, #4b6e00 0px 0px 4px, #4b6e00 0px 0px 4px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.linkText.credits:hover
{
  color:e8ff9d;
  text-shadow:#99ff44 0px 0px 10px, #99ff44 0px 0px 10px, #45810b 0px 0px 12px, #45810b 0px 0px 12px, #45810b 0px 0px 12px, #45810b 0px 0px 12px;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
}
.linkText.screenshots
{
  color:ffbe0a;
  text-shadow:#b91900 0px 0px 4px, #b91900 0px 0px 4px, #b91900 0px 0px 4px, #b91900 0px 0px 4px, #b91900 0px 0px 4px, #b91900 0px 0px 4px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.linkText.screenshots:hover
{
  color:fff85b;
  text-shadow:#ffcd1e 0px 0px 8px, #ffcd1e 0px 0px 8px, #b91900 0px 0px 12px, #b91900 0px 0px 12px, #b91900 0px 0px 12px, #b91900 0px 0px 12px;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
}

a:link
{
  color:#f5f5f5;
  background-color:transparent;
  text-decoration:none;
}
a:visited
{
  color:#f5f5f5;
  background-color:transparent;
  text-decoration:none;
}
a:hover
{
  color:#ffff38;
  background-color:transparent;
  text-decoration:none;
}
a:active
{
  color:#f5f5f5;
  background-color:transparent;
  text-decoration:none;
}
p.ex
{
  color: f5f5f5;
}

.mini.svartKloss{
  display: none;
}

/* ..om vi inte specar om dem här! */
@media (max-width: 700px) {
  .background
  {
    background-image: url("img/Mad Skull Image.jpg");
  }
  
  .normal.svartKloss{
    display: none;
  }
  .mini.svartKloss
  {
    display: block;
    position: relative;
    background-color: black;
    width:200px;
    height: 211px;
    margin: 10px;
  }
  .leftBox
  {
    float: left;
  }
  .rightBox
  {
    float: left;
  }
}

#title
{
  position:absolute;
  top:0.5%;
  left:19.7%;
  width: 60%;
}
#aGameBy
{
  position:absolute;
  width:12%;
  left:46.8%;
  top:16.1%;
  font-size:17px;
  text-shadow:#000 0px 0px 5px, #000 0px 0px 5px, #000 0px 0px 5px, #000 0px 0px 5px;
  color: white;
}
#madskullLogo
{
  position:absolute;
  top:18%;
  left:38%;
  width: 24%;
}
.planet
{
  position:absolute;
  top:28%;
  left:41.5%;
  width:19%;
  min-width:120px;
}
.releaseDaysLeft
{
  margin-top:6%;
  margin-left:3.5%;
  font-family:GuacamoleFont;
  font-size:64px;
  color: white;
  text-shadow:#74ff00 0px 0px 18px, #74ff00 0px 0px 18px, #74ff00 0px 0px 18px, #74ff00 0px 0px 18px;
}
#screenshotLink{
  position:absolute;
  left:29%;
  width:42%;
  top:78%;
  color: transparent;
  text-shadow:#74ff00 0px 0px 18px, #74ff00 0px 0px 18px, #74ff00 0px 0px 18px, #74ff00 0px 0px 18px;
  cursor: pointer;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
#screenshotLink:hover{
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
  left:28%;
  width:44%;
  top:77.8%;
}
#screenshotLink img
{
  width: 100%; /* Force image to follow tight*/
}

.greenFrame
{
  width:100%;
}
#infoBox
{
  position:relative;
  top:26%;
  left:20%;
  width:60%;
  height:66%;
  background-color:rgba(0,0,0,0.7);
}
.infoText
{
  position:absolute;
}
.media-box
{
  margin-top: 15px;
  width: 100%;
}
.media-box img{
  width: 100%;
}
.thumb-box
{
  margin-top: 15px;
}
.thumbPic
{
  float: left;
  width:113px;
  cursor: pointer;
  margin: 4px;
}
.thumbPic:hover{
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
  box-shadow: 0px 0px 10px #FFF;
}
.preloader{
  display: none;
}

#oJon
{
  position:absolute;
  top:25.5%;
  left:10%;
  width:23%;
}
#oTim
{
  position:absolute;
  top:36%;
  left:3.5%;
  width:23%;
}
#oJonas
{
  position:absolute;
  top:31%;
  left:67%;
  width:26%
}
#oAdam
{
  position:absolute;
  top:39%;
  left:71%;
  width:27%;
}
#musicBy
{
  position:absolute;
  color:white;
  font-family:arial;
  font-size:17px;
  text-shadow:#000 0px 0px 5px, #000 0px 0px 5px, #000 0px 0px 5px, #000 0px 0px 5px;
  top:26%;
  left:45.6%;
  width:12%;
}
#and{
  position:absolute;
  color:white;
  font-family:arial;
  font-size:17px;
  text-shadow:#000 0px 0px 5px, #000 0px 0px 5px, #000 0px 0px 5px, #000 0px 0px 5px;
  top:24.5%;
  left:48.7%;
  width:12%;
}
#platonistLogo
{
  position:absolute;
  top:28%;
  left:40%;
  width:20%;
}
.creditsAllOther
{
  position:absolute;
  top:53%;
  left:20%;
  width:60%;
  height:42%;
}
.creditsBox
{
  background-color:rgba(0,0,0,0.7);
}
.supportInfoBox
{
  position:absolute;
  top:32%;
  left:20%;
  width:60%;
  height:52%;
}

.platformBar
{
  font-size:19px;
  padding-top:17px;
}
.topInfo
{
  text-align: center;
  color: white;
  text-shadow:#73868c 0px 0px 5px, #73868c 0px 0px 5px, #73868c 0px 0px 5px, #73868c 0px 0px 5px, #73868c 0px 0px 5px, #73868c 0px 0px 5px;
}
.support
{
  top:49px;
  color:64beff;
  text-shadow:#2328d2 0px 0px 4px, #2328d2 0px 0px 4px, #2328d2 0px 0px 4px, #2328d2 0px 0px 4px, #2328d2 0px 0px 4px, #2328d2 0px 0px 4px;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  cursor: pointer;
}
.support:hover
{
  color:beffff;
  text-shadow:#64beff 0px 0px 12px, #64beff 0px 0px 12px, #1f23ff 0px 0px 14px, #1f23ff 0px 0px 14px, #2328d2 0px 0px 14px, #2328d2 0px 0px 14px;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
}

.row, .col
{
  /*border: 1px solid red;*/
}