/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/
html{ overflow-x: hidden; -webkit-font-smoothing: subpixel-antialiased; }
body{ overflow-y: hidden; overflow-x: hidden; }
body, select, input, textarea{ font: 22px 'Helvetica Neue','Myriad Pro', Arial; color: #fff; }
a{ color: #0098eb; transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -webkit-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; text-decoration: none; }
a:hover{ color: #db342b; }
a:link{ -webkit-tap-highlight-color: rgba(0,0,0,.3); }
a:active{ position: relative; top: 1px; }
::-moz-selection{ background: #db342b; color: #fff; text-shadow: none; }
::selection{ background: #db342b; color: #fff; text-shadow: none; }
ins{ background-color: #fcd700; color: #000; text-decoration: none; }
mark{ background-color: #fcd700; color: #000; font-style: italic; font-weight: bold; }
::-webkit-input-placeholder{ color:#bfbfbf; }
input:-moz-placeholder{ color:#bfbfbf; }
input:-ms-placeholder{ color:#bfbfbf; }
::-ms-input-placeholder{ color:#bfbfbf; }
:-ms-input-placeholder{ color:#bfbfbf; }
input:focus { background-color: none; }
input{ outline: none; }

/* Body styles!
-------------------------------------------------------------------------------*/
body{ background: #000; font-family: 'Helvetica Neue','Myriad Pro'; }
.background{ position: relative; margin: 0 auto; width: 1680px; height: 1012px; background: url('../images/acbitir.jpg') no-repeat top center; }
.container{ position: relative; width: 1000px; margin: 0 auto; }
.container .paket-paket{ position: absolute; right: -60px; top: 50px; width: 510px; height: 170px; background: url('../images/paket-paket-alinir.png') no-repeat; }
.container .text{ position: absolute; right: -60px; top: 230px; width: 510px; font-size: 15px; line-height: 22px; color: #fff; text-shadow: 0 1px 5px rgba(0,0,0,.5); text-align: center; }
.container .text h1{ font-size: 20px; font-weight: normal; line-height: 28px; }
.container .tek-seferlik{ width: 230px; height: 75px; position: absolute; left: -30px; top: 420px; background: url('../images/tek-seferlik.png') no-repeat; }
.container .cok-pratik{ width: 149px; height: 49px; position: absolute; left: 0px; top: 570px; background: url('../images/cok-pratik.png') no-repeat; }
.container .taze-dilimlenmis{ width: 163px; height: 67px; position: absolute; left: 410px; top: 570px; background: url('../images/taze-dilimlenmis.png') no-repeat; }
.container .reklam-filmi-izle{ width: 200px; height: 96px; position: absolute; left: 450px; top: 450px; background: url('../images/reklam-filmini-izle.png') no-repeat; }
.container .reklam-filmi-izle-button{ position: absolute; top: 880px; left: 50%; margin: 0 0 0 -310px; background: url('../images/reklam-filmini-izle-button.png') no-repeat; width: 620px; height: 140px; visibility: hidden; }
.container .play-button{ display: block; width: 300px; height: 230px; position: absolute; top: 500px; right: 80px; background: url('../images/play-button.png') no-repeat center; }
.container .play-button:hover{ background: url('../images/play-button-hover.png') no-repeat center; }
.container .blink{ display: none; }
.container ul.links{ position: absolute; left: -40px; top: 810px; font-size: 14px; color: #fff; list-style-type: none; }
.container ul.links li{ border-left: 1px #fff solid; padding: 0 10px; float: left; text-shadow: 0 1px 5px rgba(0,0,0,.3); }
.container ul.links li:first-child{ border-left: 0; }
.container ul.links li:last-child{ border-right: 0; }
.container ul.links a{ color: #fff; }
.container ul.links a:hover{ text-decoration: underline; }

.container ul.social{ position: absolute; right: 0px; top: 830px; font-size: 14px; color: #fff; list-style-type: none; }
.container ul.social li{ float: left; width: 90px; height: 72px; background: url('../images/social.png') no-repeat; cursor: pointer; }
.container ul.social li.facebook{ background-position: -126px 0; }
.container ul.social li.twitter{ background-position: -46px 0; }


.lightbox{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; display: none; background: url('../images/lightbox.png') repeat; }
.lightbox video{ width: 960px; height: 540px; position: absolute; left: 50%; top: 50%; margin: -270px 0 0 -480px; }
.mejs-container{ width: 960px; height: 540px; position: absolute; left: 50%; top: 50%; margin: -270px 0 0 -480px; }
.mejs-time-total{ width: calc(100% - 50px) !important; }

@media all and (max-width: 1024px) and (min-width: 768px) {
  .background{ width: 1024px; height: 768px; background: url('../images/acbitir-ipad-landscape.jpg') no-repeat top center; }
  .container{ width: auto; }
  .container .paket-paket{ top: 30px; right: 10px; }
  .container .text{ right: 10px; top: 200px; font-size: 13px; line-height: 20px; width: 480px; }
  .container .tek-seferlik{ left: 20px; top: 380px; }
  .container .cok-pratik{ left: 20px; top: 510px; }
  .container .taze-dilimlenmis{ left: 380px; top: 500px; }
  .container .reklam-filmi-izle{ left: 410px; top: 390px; }
  .container .play-button{ top: 440px; right: 130px; }
  .container ul.links{ top: 710px; left: -20px; }
}

@media all and (max-width: 768px) and (min-width: 320px) {
  .background{ width: 768px; height: 1400px; background: #847669 url('../images/acbitir-ipad-portrait.jpg') no-repeat top center;}
  .container{ width: auto; }
  .container .paket-paket{ display: none; visibility: hidden; }
  .container .tek-seferlik{ left: 100px; top: 490px; }
  .container .cok-pratik{ left: 120px; top: 630px; }
  .container .taze-dilimlenmis{ left: 520px; top: 590px; }
  .container .reklam-filmi-izle{ visibility: hidden; display: none; }
  .container .reklam-filmi-izle-button{ visibility: visible; }
  .container .play-button{ display: none; }
  .container .text{ text-shadow: 0 0 0; visibility: visible; top: 1070px; font-size: 18px; line-height: 24px; width: 90%; right: 0; left: 20px; text-align: left; }
  .container .text h1{ font-size: 28px; line-height: 36px; text-align: center; }
  .container ul.links{ visibility: visible; top: 1310px; left: -30px; }
  .container ul.social{ top: 1300px; right: 30px; }
}

@media all and (max-width: 320px) {
  .background{ width: 320px; height: 1130px; background: #847669 url('../images/acbitir-iphone.jpg') no-repeat top center;}
  .container{ width: auto; }
  .container .paket-paket{ visibility: hidden; }
  .container .tek-seferlik, .container .cok-pratik, .container .taze-dilimlenmis, .container .reklam-filmi-izle{ visibility: hidden; }
  .container .reklam-filmi-izle-button{ width: 300px; height: 80px; margin: 0 0 0 -150px; top: 460px; background-size: 100%; }
  .container .text{ top: 600px; font-size: 16px; line-height: 22px; }
  .container .text h1{ font-size: 21px; line-height: 26px; }
  .container ul.links{ text-align: center; font-size: 16px; padding: 0; left: 0; width: 100%; top: 940px; }
  .container ul.links li{ float: none; border-left: 0; padding: 0 10px; display: block; }
  .container ul.social{ top: 1040px; right: auto; left: 50%; width: 260px; margin: 0 0 0 -130px; }
}
@media all and (max-width: 320px) and (-webkit-min-device-pixel-ratio: 2) {
    .background{ width: 320px; height: 1110px; background: #847669 url('../images/acbitir-iphone@2x.jpg') no-repeat top center; background-size: 100%; }
}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) {
  .background{ height: 1500px; }
  .container .tek-seferlik{ left: 40px; top: 490px; }
  .container .cok-pratik{ left: 40px; top: 610px; }
  .container .taze-dilimlenmis{ left: 405px; top: 520px; }
  .container ul.links{ top: 1400px; }
  .container ul.social{ top: 1380px; }
}
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) {
  .background{ height: 1500px; }
  .container .tek-seferlik{ left: 40px; top: 490px; }
  .container .cok-pratik{ left: 40px; top: 610px; }
  .container .taze-dilimlenmis{ left: 405px; top: 520px; }
  .container ul.links{ top: 1400px; }
  .container ul.social{ top: 1380px; }
}