/*---------------------------------------------- Platforms Section ----------------------------------------------*/
.platform-container {
    display: inline-block;
    height: 100%;
    width: 100%;
    top: 0px;
    left: 0px;
}

.platform-row {
    display: inline-flex;
    float: left;
    width: 100%;
    height: 33.333vh;
    align-items: center;
    overflow:visible;
}

#platform-top {
    background-image: url(../img/platforms/platform-top.png);
    background-size: cover;
    background-repeat: no-repeat;
    content: ' ';
    background-position: center bottom;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: -1;
}

#platform-bottom {
    background-image: url(../img/platforms/platform-bottom.png);
    background-size: cover;
    background-repeat: no-repeat;
    content:' ';
    background-position: center top;
    position: absolute;
    bottom: 0px;
    left: 0px;
    z-index: -1;
}

.platform-left {
    width: 30vh;
    height: 20vh;
    position: absolute;
    z-index: -1;
    left: -5vh;
    top: 41vh;
    background-image: url(../img/platforms/platform-left.png);
    background-size: cover;
    background-repeat: no-repeat;
    content: ' ';
    background-position: right top;
}

.platform-right {
    width: 30vh;
    height: 20vh;
    position: absolute;
    z-index: -1;
    right: -5vh;
    top: 41vh;
    background-image: url(../img/platforms/platform-right.png);
    background-size: cover;
    background-repeat: no-repeat;
    content: ' ';
    background-position: left top;
}

.platform-wrapper {
    width: 100%;
}

.platform-square {
    position: relative;
    width: 55vh;
    margin: 0px auto 0px auto;
}

.platform-center h1, .platform-center p {
    text-shadow: 0px 30px 50px rgba(0,0,0,1);
}

/*---
.platform-square:after {
    content: "";
    display: block;
    padding-bottom: 100%;
    background-image: url(../img/brand/4k_Airxon_navigation_bg.jpg);
    background-size: cover;
    background-color: rgb(175,0,0);
    border-radius: 100%;
    overflow: hidden;
}
---*/

.platform-content {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}

h1.platform-headline {
    font-size: calc(9.70vh + 1.25vw);
    margin-bottom: 1vh;
	font-weight: 500;
}

.middle-content.float-center.platform-background {
    background-image: url(../img/patterns/100x100_Airxon_noise.png);
    background-repeat: repeat;
    background-color: #09060e;
}



/*---------------------------------------------- Section Responsive ----------------------------------------------*/

@media screen and (min-width: 1501px) {
/*---------- Insert Style -----------*/
}

@media screen and (max-width: 1500px) {
/*---------- Insert Style -----------*/
}
@media screen and (min-width: 1200px) {
  .platform-square {
      width: 60vh;
  }
}
@media screen and (max-width: 1120px) and (min-width: 769px){
/*---------- Insert Style -----------*/
}

@media screen and (min-width: 1170px) {
/*---------- Insert Style -----------*/
}

@media screen and (min-width: 769px) {

}

@media screen and (max-width: 768px) {
  #platform-top {
      background-image: url(../img/platforms/platform-phone-top.png)!important;
      background-size: cover!important;
  }

  #platform-bottom {
      background-image: url(../img/platforms/platform-phone-bottom.png)!important;
      background-size: cover!important;
  }
}

@media screen and (max-width: 540px) {
  .platform-square {
      width: 48vh;
  }
}

@media screen and (max-width: 498px) {
/*---------- Insert Style -----------*/
}