/* FONT FACE 
-------------------------------------------------- */
/* Define fonts to use here */
@font-face {
  font-family: 'Aileron Regular';
       src: url('fonts/aileron_regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/aileron_regular.woff') format('woff'), /* Pretty Modern Browsers */
       url('fonts/aileron_regular.ttf')  format('truetype'); /* Safari, Android, iOS */
}

@font-face {
  font-family: 'Aileron Light';
       src: url('fonts/aileron_light.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/aileron_light.woff') format('woff'), /* Pretty Modern Browsers */
       url('fonts/aileron_light.ttf')  format('truetype'); /* Safari, Android, iOS */
}

@font-face {
  font-family: 'Aileron Thin';
       src: url('fonts/aileron_thin.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/aileron_thin.woff') format('woff'), /* Pretty Modern Browsers */
       url('fonts/aileron_thin.ttf')  format('truetype'); /* Safari, Android, iOS */
}

@font-face {
  font-family: 'Helsinki';
       src: url('fonts/helsinki-webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('fonts/helsinki-webfont.ttf')  format('truetype'); /* Safari, Android, iOS */
}

@font-face {
  font-family: 'Roboto Regular';
  	   src: url('fonts/roboto-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-regular.woff') format('woff'), /* Pretty Modern Browsers */
       url('fonts/roboto-regular.ttf')  format('truetype'); /* Safari, Android, iOS */
}


/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  color: #012431;
  
  background: transparent url("../img/Footer_Image_1920.jpg") no-repeat center bottom scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: 2560px auto;
  
  overflow-x: hidden;
  overflow-y: auto !important;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
}

body {
  background: transparent url("../img/Footer_Image_1920.jpg") no-repeat center bottom scroll;
}

@media (min-width: 2000px) {
	body {
		background: transparent url("../img/Footer_Image_2560.jpg") no-repeat center bottom scroll;
	}
}
@media (max-width: 767px) {
	body {
		background: transparent url("../img/Footer_Image_1200.jpg") no-repeat center bottom scroll;
	}
}

html {
	min-width: 974px;
}


/* FIRST VIEWPORT (STORE)
-------------------------------------------------- */

.container {
     padding-right: 0; /*15px in bootstrap.css*/
     padding-left: 0;  /*idem*/
     margin-right: auto;
     margin-left: auto;
}

.logo {
	margin-top: 35px;
	padding-top: 0;
	text-align: center;
}

.subcaption {
	bottom: 50px;
	position: absolute;
	text-align: center;
}
	
.storeinfo {
	font-family: 'Roboto Regular', arial, sans-serif;
	font-size: 26px;
	line-height: normal;
}

.storeview .title, .storeview .subtitle {
	
	font-size: 50px;
	line-height: normal;
	padding: 0;
	margin: 0;
}

.storeinfo {
	margin-top: 20px;
	margin-bottom: 0;
}

.container-small {
	width: 984px;
}

.volumebuttons {
	margin-top: 35px;
	margin-left: 30px;
}

.sociallinks {
	margin-top: 35px;
	margin-bottom: 140px;
}

.twitterimg {
	margin-right: 15px;
}

.touchimg {
	margin-right: 15px;
	margin-top: -60px;
}

.about, .mediaimgbox {
	font-family: 'Helsinki', arial, sans-serif;
	color: #012431;
	padding: 0;
	margin: 0;
	text-align: center;
}

.img-responsive {
    margin: 0 auto;
}

.maincontent {
	width: 100%;
  	margin-bottom: 0;
  	padding-bottom: 0;
  	background: transparent url("../img/Sky_Media_Image.jpg") no-repeat top center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 690px !important;
 	max-width: 2560px;
 	
 	text-align: center;
 	margin-left: auto;
 	margin-right: auto;
}

.abouttitle {
	font-family: 'Helsinki', arial, sans-serif;
	font-size: 32px;
}

.mediatitle {
	font-size: 36px;
	margin-bottom: 40px;
}


.abouttext {
	font-family: 'Roboto Regular', arial, sans-serif;
	font-size: 26px;
	margin-bottom: 40px;
}

.aboutvisual {
	 
	text-align: center;
	margin-top: 40px;
	margin-bottom: 100px;
	padding: 0 !important;
}

.mediacontent {
	
}

.mediaimgbox {
	margin-top: 60px;
}

.screenshot-thumb {
	margin-bottom: 20px;
}

.img-thumbnail {
	border: 0;
}

.leftimg {
	padding-left: 15px;
	padding-right: 10px;
	text-align: right;
}

.rightimg {
	padding-right: 15px;
	padding-left: 10px;
	text-align: left;
}

.sitefooter {
	margin-top: 60px;
	margin-left: auto;
	margin-right: auto;
	bottom: 0;
}

.footertext, .footertext a {
	text-align: center;
	font-family: 'Roboto Regular', arial, sans-serif;
	color: #fff;
	font-size: 12px;
}

.footertext a {
	text-decoration: underline;
}

.deko1 {
	margin-left: 50px;
	padding-right: 50px;
}

.deko2 {
	margin-top: 600px;
	margin-right: 0;
	padding-right: 0;
}

.deko3 {
	margin-top: 600px;
	margin-left: -200px;
}

.social-bottom {
	margin-top: 40px;
}

.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.test {
	text-align: center;
}

.content {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.contentfooter {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    
    height: 100%;
    position: absolute;
   	bottom: 80px;

}

.footercontent {
	min-height: 480px !important;
	margin-top: 100px;
	margin-bottom: 50px;
	
	position: relative;
}


grow { transition: all .2s ease-in-out; }
.grow:hover { transform: scale(1.1); }

/*
.social-bottom img{
	display: inline-block;
}
*/

#volumebtn {
	background: transparent url("../img/Icon_Music_Off.png") no-repeat center center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100%;
	width: 48px;
	height: 48px;
	border: none;
	margin-bottom: 10px;
	margin-right: 10px;
}

.twitterbtn {
	background: transparent url("../img/Icon_Twitter.png") no-repeat center center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100%;
	width: 48px;
	height: 48px;
	border: none;
	margin-bottom: 10px;
	margin-right: 10px;
}

.instagrambtn {
	background: transparent url("../img/Icon_Instagram.png") no-repeat center center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100%;
	width: 48px;
	height: 48px;
	border: none;
	margin-bottom: 10px;
	margin-right: 10px;
}

.psstorebtn {
	background: transparent url("../img/Icon_PSStore.png") no-repeat center center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100%;
	width: 48px;
	height: 48px;
	border: none;
	margin-bottom: 10px;
	margin-right: 10px;
}

.steamstorebtn {
	background: transparent url("../img/Icon_SteamStore.png") no-repeat center center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100%;
	width: 48px;
	height: 48px;
	border: none;
	margin-bottom: 10px;
	margin-right: 10px;
}

.facebookbtn {
	background: transparent url("../img/Icon_Facebook.png") no-repeat center center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100%;
	width: 48px;
	height: 48px;
	border: none;
	margin-bottom: 10px;
	margin-right: 10px;
}

.youtubebtn {
	background: transparent url("../img/Icon_Youtube.png") no-repeat center center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100%;
	width: 48px;
	height: 48px;
	border: none;
	margin-bottom: 10px;
	margin-right: 10px;
}

.bottom-column
{
    margin-top: 140px;
    margin-bottom: 120px;
}

.imprint {
	text-align: right !important;
	  
}

.nopadding {
   padding: 0;
   margin: 0;
}


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

.sitewrapper {
	width: 100%;
}

/* Carousel base class */
.carousel {
	width: 100%;
  	margin-bottom: 0;
  	padding-bottom: 0;
  	background: transparent url("../img/Header_Image.jpg") no-repeat top center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 980px !important;
 	max-width: 2560px;
 	text-align: center;
 	margin-left: auto;
 	margin-right: auto;
 	padding-left: 0;
 	padding-right: 0;
}

.red {
	background-color: red;
	
}

.blue {
	background-color: blue;
}

.yellow {
	background-color: yellow;
	
}

/* ADDED TO BOOTSTRAP CSS BILAL
-------------------------------------------------- */

/*
@media screen and (orientation:portrait) {
    /* MOBILE Portrait styles 
	
}
*/

.text-left-not-xs, .text-left-not-sm, .text-left-not-md, .text-left-not-lg {
    text-align: left;
}
.text-center-not-xs, .text-center-not-sm, .text-center-not-md, .text-center-not-lg {
    text-align: center;
}
.text-right-not-xs, .text-right-not-sm, .text-right-not-md, .text-right-not-lg {
    text-align: right;
}
.text-justify-not-xs, .text-justify-not-sm, .text-justify-not-md, .text-justify-not-lg {
    text-align: justify;
}

@media (max-width: 767px) {
    .text-left-not-xs, .text-center-not-xs, .text-right-not-xs, .text-justify-not-xs {
        text-align: inherit;
    }
    .text-left-xs {
        text-align: left;
    }
    .text-center-xs {
        text-align: center;
    }
    .text-right-xs {
        text-align: right;
    }
    .text-justify-xs {
        text-align: justify;
    }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .text-left-not-sm, .text-center-not-sm, .text-right-not-sm, .text-justify-not-sm {
        text-align: inherit;
    }
    .text-left-sm {
        text-align: left;
    }
    .text-center-sm {
        text-align: center;
    }
    .text-right-sm {
        text-align: right;
    }
    .text-justify-sm {
        text-align: justify;
    }
}
@media (min-width: 1025px) and (max-width: 1199px) {
    .text-left-not-md, .text-center-not-md, .text-right-not-md, .text-justify-not-md {
        text-align: inherit;
    }
    .text-left-md {
        text-align: left;
    }
    .text-center-md {
        text-align: center;
    }
    .text-right-md {
        text-align: right;
    }
    .text-justify-md {
        text-align: justify;
    }
}
@media (min-width: 1200px) {
    .text-left-not-lg, .text-center-not-lg, .text-right-not-lg, .text-justify-not-lg {
        text-align: inherit;
    }
    .text-left-lg {
        text-align: left;
    }
    .text-center-lg {
        text-align: center;
    }
    .text-right-lg {
        text-align: right;
    }
    .text-justify-lg {
        text-align: justify;
    }
}