/* portrait ratio */
@media (min-width: 992px) and (orientation:portrait) {
  #home.trailer {
    min-height: 800px;
  }
}

@media (max-height: 780px) and (orientation:landscape) {
  #home.trailer {
    min-height: 780px;
  }
}

@media only screen and (max-aspect-ratio: 546/391) {
  #hero-promo .preview-video {
    min-height: 100%;
    max-height: 100%;
    width: auto;
    max-width: none;
  }
}

/* smaller screens */
@media(max-width: 768px) {

  #fe-header {
    padding-top: 80px;
  }

  .kotfe-subscribe-flow #fe-header {
    padding-top:0;
  }

  #fe-header #logo {
    width:100%;
    max-width: 400px;
  }

  .text-right {
    text-align:left;
  }

  .btn-block-sm {
    display: block !important;
    padding:5px;
    margin-left:15px;
    margin-right: 15px;
  }

  .btn.btn-block-sm {
    font-size:24px;
  }

  .submitBtn,
  .btn-next {
    padding-left:20px;
    padding-right:80px;
    font-size: 24px;
  }

  body.lang_de .btn-next,
  body.lang_de .submitBtn,
  body.lang_fr .btn-next,
  body.lang_fr .submitBtn {
    padding-right: 60px;
    padding-left:10px;
    font-size:20px;
  }

  #get-rewards-container .text-right {
    text-align: left;
  }

  #get-rewards-btn {
    display: block;
    float: none !important;
  }

  #characters .cast-list ul {
    display: none;
  }

  #characters .character-card {
    display: block;
    position: relative;
    padding-left: 0;
  }

  #characters .character-image {
    position: relative;
    width: 100%;
    height: 250px;
  }

  #chapters .chapters {
    padding-left: 0;
  }

  ul.fe-content-list ul {
    padding-left:0;
  }

  #fe-header + #kotfe-subscribe {
    padding-top: 160px;
  }

  #login-cover-bg {
    display:none;
  }

  #secretQuestions,
  #download-client,
  #game-purchase-set-email-form .setEmail {
    width: auto;
    margin: 0;
  }

  .login-interstitial-form #fallen-empire-login {
    float: none;
    margin:0;
    width: auto;
  }

  #footer .left,
  #footer .right {
    float:none;
    display:block;
    width: 100%;
  }

  #footer .legalLinks {
    margin-left: -15px;
    margin-right: -15px;
    font-size: 20px;
  }

  #footer .legalLinks .sep {
    display: none;
  }

  #footer .legalLinks a {
    display: block;
    text-decoration: none;
    padding: 5px;
    border-top: solid 1px #888;
    border-bottom: solid 1px #888;
  }

  #footer .legal {
    padding: 40px 0;
  }

}

@media (max-width: 992px) {
  #home .has-video-preview .background {
    display:block;
    opacity:1;
  }

  #trailer {
    width: auto;
    opacity:1;
  }

  #trailer .preview-controls {
    display:none;
  }

  #trailer .yt-video {
    display:block;
    opacity:1;
  }

  #rewards .reward-screenshot img {
    display:none;
  }

  #rewards .reward-screenshot:before {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height: 100%;
    background-size:cover;
    background-repeat: no-repeat;
    background-position: top;
    content: '';
  }

  #rewards .nico-companion .reward-screenshot:before {
    background-image: url(/sites/all/files/en/fallenempire/bothawui/screens/hero-sm.jpg);
  }

  #rewards .nico-duster .reward-screenshot:before {
    background-image: url(/sites/all/files/en/fallenempire/bothawui/screens/duster-sm.jpg);
  }

  #rewards .nico-blaster .reward-screenshot:before {
    background-image: url(/sites/all/files/en/fallenempire/bothawui/screens/blaster-sm.jpg);
  }

  #rewards .nico-speeder .reward-screenshot:before {
    background-image: url(/sites/all/files/en/fallenempire/bothawui/screens/speeder-sm.jpg);
  }

  #rewards .early-access .reward-screenshot:before {
    background-image: url(/sites/all/files/en/fallenempire/bothawui/screens/early-access-sm.jpg);
  }

  #home .video-background {
    display: none;
  }

  #fe-header + #home.lander-section {
    padding-top: 250px;
  }

  #characters .cast-list ul {
    display: none;
  }

  #characters .character-card {
    display: block;
    position: relative;
    padding-left: 0;
  }

  #characters .character-image {
    position: relative;
    width: 100%;
    height: 250px;
  }

}

/* md screens */
@media (min-width: 769px) {

  .intro-content {
    width:640px;
    background:none;
  }

  #mobile-nav {
    display:none;
  }

  #fe-header #user-data {
    display:block;
  }

  .lander-section .fe-content {
    width: 750px;
  }

  #trailer {
    margin-top: 90px;
  }

  #features:before,
  #prizes:before {
    position: absolute;
    display: block;
    background: url(/sites/all/files/en/fallenempire/bothawui/game-ui-top.png) no-repeat 0 0;
    width: 1477px;
    height: 530px;
    left: 50%;
    top: -60px;
    margin-left: -738px;
    z-index: 10;
    content: '';
  }
}

@media (min-width: 769px) {
  .form-inline input.registration,
  .form-inline select.form-select,
  .form-inline .select,
  .form-inline .form-control,
  .form-inline input.registration,
  .form-inline select.form-select,
  .form-inline .select {
    display: inline-block;
    width: auto;
    vertical-align: middle;
  }
  .form-inline .input-group > input.registration,
  .form-inline .input-group > select.form-select,
  .form-inline .input-group > .select,
  .form-inline .input-group > .form-control,
  .form-inline .input-group > input.registration,
  .form-inline .input-group > select.form-select,
  .form-inline .input-group > .select {
    width: 100%;
  }
}

@media (min-width: 992px) {
  #kotfe-subscribe #login-main-bg {
    background-image: url(/sites/all/files/en/fallenempire/destiny-bg.jpg);
  }

  .lander-section .fe-content {
    width: 970px;
  }

  .fe-content-block {
    width: 840px;
    margin-left: auto;
    margin-right: auto;
  }

  body.lang_de #get-rewards-btn,
  body.lang_fr #get-rewards-btn {
    max-width:50%;
    font-size: 22px;
  }
}
@media (min-width: 1200px) {
  .lander-section .fe-content {
    width: 1170px;
  }

  #key-features .feature-list {
    width:1000px;
  }
}

@media (min-width: 992px) {
  #trailer {
    position: absolute;
    left:50%;
    top:50%;
    -webkit-transform: translate(-50%, -20%);
    -moz-transform: translate(-50%, -20%);
    -ms-transform: translate(-50%, -20%);
    -o-transform: translate(-50%, -20%);
    transform: translate(-50%, -20%);
  }

  .lander-section .video-background {
    display:block;
  }
  .lander-section .video-background video,
  .lander-section .video-background .preview-video {
    display:block;
  }

  #fe-header-mobile {
    display: none;
  }
  #fe-header {
    display: block;
  }
  #subscriber-rewards .reward {
    width: 20%;
  }
  #kotfe #sidebar {
    display: block;
  }
  #kotfe #back-to-swtor {
    display: block;
  }

  #rewards .reward-list {
    display: -ms-flex;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
    -ms-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
  }

  #rewards .reward {
    -ms-flex:1;
    -webkit-flex:1;
    flex:1;
    border-left: solid 1px #2F2E2E;
  }

  #rewards .reward:first-child {
    border-left: none;
  }
  #rewards .reward-screenshot {
    height: 200px;
  }

  .item-table .item-list {
    display: -ms-flex;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
    -ms-justify-content: flex-start;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
  }

  .item-table .item {
    -ms-flex:1;
    -webkit-flex:1;
    flex:1;
    border-left: solid 1px #2F2E2E;
  }

  .item-table .item:first-child {
    border-left: none;
  }
  .item-table .item-screenshot {
    height: 200px;
  }

  #chapter-list-container {
    width:940px;
    margin: 80px auto 40px;
  }

  #chapters ol.chapters {
    padding-left: 50px;
  }

  #media .media-item .type {
    transform: translateY(100%);
  }
  #media .media-item:hover .type {
    transform: translateY(0);
  }

  .lander-section .video-background {
    display:none;
  }

  .lander-section .has-video-preview .video-background {
    display: block;
  }

  #trailer-container #trailer  {
    position: absolute;
    left: 50%;
    top: 0;
    margin-top:0;
    -webkit-transform: translate(-50%, 0%);
    -moz-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    -o-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
  }

  #features:before,
  #prizes:before {
    width:100%;
    left:0;
    margin-left:0;
    background-position: top;
  }

}
@media (min-width: 1280px) {
  .content,
  .container,
  .lander-section .fe-content {
    width: 1280px;
  }
  #rewards .reward-screenshot {
    height: 260px;
  }
}

@media only screen and (max-aspect-ratio: 368/225) {
  #hero-promo .preview-video {
    min-height: 100%;
    max-height: 100%;
    width: auto;
    max-width: none;
  }
}