* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

td {
padding: 5px !important;
}
.header_popup {
  padding: 0 12%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-bottom: 15px;
}

.header_popup .logo_dell {
  width: 12%;
}
.header_popup .logo_intel {
  width: 18%;
}
.note-intel.popup {
  margin: 10px 0 0 0;
}
.date-col {
   width: 7%;
 }
.name-col {
  width: 25%;
}
.phone-col {
  width: 15%;
}
.price-col {
  width: 53%;
}

.header .header__title h1 {
  margin: 0 auto 1.5em;
}

.main_mb .button span {
  width: 100%;
  text-align: center;
}

.modal__notification.ctkm{
  color: #000 !important;
  font-size: 90% !important;
}

.modal__notification.mvrr{
  color: red !important;
  margin-bottom: 15px;
}

table,
th,
td {
  border: 2px solid #fff;
  padding: 10px 0;
  color: #fff;
  font-size: 20px;
}
img{max-width: 100%;}

body #campaign-endyear-main{
  height: 100vh;
  background: url('/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/bg.jpg') no-repeat;
  background-color: transparent !important;
  background-size: 100% 100%;
  background-position: center center;
}

body div[class*='page'] {
  position: relative;
  /*max-width: 1500px;*/
  margin: 0 auto;
  padding-top: 30px;
  background: url('/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/bg.jpg');
  background-size: 100% 100%;
}
body .page_1{
  padding-top: 0 !important;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
body .page_1{ height: 100vh; }
body .page_1 .header{ height: 30vh; padding: 30px 0; }
body .page_1 .main-app{ height: 70vh; }
body .page_1 .main-app .main__content .main__flower { height: 70vh; margin: auto; }
body .page_1.fix-height{ height: 100%; }
body .page_1 .main-app div:not(.main__note){ height: 100%; }
body .page_1 #ipad_pro_landscape{ height: 100%; }
body .page_1 .main-app .main__content { display: inline-block; }

body .page3 {
  background: none !important;
}
body .page2 {
  background-image: url('/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/bg-new.jpg') !important;
  height: 100vh;
}

.absolute-logo {
  position: absolute;
  width: 33%;
  right: 0;
  bottom: 0;
  text-align: right;
}
.absolute-logo img:first-child {
  width: 60%;
}
.absolute-logo img:last-child {
  width: 100%; margin-top: -5%;
}
.note {
  font-size: 14px;
}
.note--small {
  font-size: 8px;
}
.modal {
  transform: scale(0);
  transition: transform 1s;
}
.modal.in {
  transform: scale(1);
}
.modal-backdrop {
  opacity: 0.5 !important;
}
.modal-dialog {
  margin: 0 auto;
  max-width: 100%;
}
.modal-content {
  background-color: unset;
  border-radius: 15px!important;
}
.modal-body {
  background: url(/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/bg_modal.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top right;
  border: 0;
  text-align: center;
  padding: 40px 0 10px 0;
  border-radius: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
#popup .modal-body> img:first-child {
  position: absolute;
  width: 30%;
  top: 0;
  right: 0;
}
.modal .modal__img {
  width: 20%;
}
.modal .modal__note .note {
  margin-top: 0!important;
}
.modal .modal__note .note,
.modal .modal__note .note--small {
  margin-bottom: 0;
  margin-top: 20px;
}
.modal .modal__notification {
  font-size: 20px;
  text-transform: uppercase;
  color: #0e76bc;
  width: 100%;
}
.modal .modal__notification .name {
  font-size: 24px;
  font-weight: bold;
}

.modal .modal__notification .gift {
  font-size: 16px;
  font-weight: bold;
  padding: 0 7%;
}
.modal__note, #modal_net_service {
  width: 100%;
}
.button {
  text-transform: uppercase;
  position: relative;
  display: inline-block;
}
.button span {
  display: inline-block;
  padding: 5px 15px;
  color: #fff;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: bold;
  border-radius: 30px;
  text-decoration: none;
  position: relative;
  z-index: 2;
  background: linear-gradient(
          359deg,
          rgba(188, 167, 179, 1) 0%,
          rgba(225, 0, 10, 1) 35%,
          rgba(225, 0, 10, 1) 100%
  );
}
.button:hover span {
  background: linear-gradient(
          180deg,
          rgba(188, 167, 179, 1) 0%,
          rgba(225, 0, 10, 1) 35%,
          rgba(225, 0, 10, 1) 100%
  );
}
.button::before {
  content: '';
  position: absolute;
  width: calc(100% + 14px);
  height: calc(100% + 14px);
  top: -7px;
  left: -7px;
  background: #fff;
  border-radius: 30px;
  z-index: 1;
}

.header .header__logos {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header .header__logos img:first-child {
  width: 7%;
  margin-left: 3%;
}
.header .header__logos img:last-child {
  width: 13%;
  margin-right: 2%;
}
.header .header__title {
  text-align: center;
  text-transform: uppercase;
}
.header .header__title p {
  font-size: 20px;
  margin-bottom: 0;
  color: #fff;
}
.header .header__title h1 {
  font-size: 30px;
  font-weight: bold;
  color: #f9ec2c;
}
.header .header__title p:last-child {
  font-size: 16px;
  text-transform: capitalize;
}
.header .header__title p:last-child span {
  font-weight: bold;
  font-size: 22px;
}
.main-app {
  position: relative;
}
.main-app .main__content {
  position: relative;
}
.main-app .main__flower {
  width: 100%;
  margin-left: -5%;
}
.main-app .main__lm {
  width: 40px;
  position: absolute;
  cursor: pointer;
  box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.4);
}
.main-app .main__lm.main__lm--1 {
  left: 13%;
  bottom: 35%;
}
.main-app .main__lm.main__lm--2 {
  left: 30%;
  bottom: 23%;
}
.main-app .main__lm.main__lm--3 {
  left: 44%;
  bottom: 31%;
}
.main-app .main__lm.main__lm--4 {
  left: 57%;
  bottom: 36%;
}
.main-app .main__lm.main__lm--5 {
  left: 70%;
  bottom: 20%;
}
.main-app .main__lm.main__lm--6 {
  left: 17%;
  bottom: 63%;
}
.main-app .main__lm.main__lm--7 {
  bottom: 50%;
  left: 30%;
}
.main-app .main__lm.main__lm--8 {
  bottom: 65%;
  left: 40%;
}
.main-app .main__lm.main__lm--9 {
  left: 51%;
  bottom: 77%;
}
.main-app .main__lm.main__lm--10 {
  left: 62%;
  bottom: 56%;
}
.main-app .main__lm.main__lm--11 {
  left: 72%;
  bottom: 62%;
}
.main-app .main__lm.main__lm--12 {
  left: 74%;
  bottom: 38%;
}
.main-app .main__note {
  text-align: center;
  width: 100%;
  /* margin: 15px auto; */
  color: #fff;
}

body .page_1 .main-app .main__note {
  width: 75%;
}

.main-app .main__note.page3 {
  padding: 20px 0;
}
.main-app .main__note.absolute {
  position: absolute;
  bottom: 0;
  left: 25%;
}
.main__lien {
  position: absolute;
  right: 0;
  top: 0;
  width: 15%;
}
.main-app .main__lm:hover {
  animation: effect1 0.2s linear alternate infinite;
}
/* Css Page Cรณ form */
body .page2{  height: 100%; margin-bottom: 30px }
.page2 header {
  position: relative;
  z-index: 3;
}
.page2 .main-app  {
  display: -webkit-flex;
  display: flex;
  position: static;
  flex-wrap: wrap;
  width: 50%;
  margin: 0px 0 0 43%;
}
.main__left {
  /*
  width: 46.311%;
  position: relative;
  background-image: url(/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/bg-new.jpg);
  background-repeat: no-repeat;
  background-position: center left;
  background-size: auto 100%;
  position: absolute;
  height: 100vh;
  */
  width: 41%;
  left: 0;
  top: 0;
  z-index: 1;
  /*
  display: -webkit-flex;
  display: flex;
  align-items: flex-end;
  */
  padding-bottom: 40px;
  overflow: hidden;
}
.main__left a.button {
  display: block;
  height: 40px;
  position: relative;
  line-height: 30px;
  margin-left: 0;
  max-width: 280px;
  margin: -10% auto 0;
}
.main-app .main__content {
  position: relative;
  z-index: 2;
}
body div.page2 .main-app .main__content{ margin-left: -5%; }
.main-app .form {
  margin: 20px 0;
  color: #fff;
  font-size: 18px;
}
.main-app .form p, .main-app .form form label {
  font-size: 20px;
}
/*.main .form form { width: 55%; }*/
.main-app .form .form__group {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}
.main-app .form .form__group input {
  flex-basis: 55%;
  border: 0;
  height: 40px;
  color: #333;
  padding-left: 10px;
  border-radius: 5px;
}
.main-app.form .form__group label {
  margin-bottom: 0;
}
.main-app .form__note {
  font-size: 18px;
}
.form__note ~ div:last-child{
  margin-top: 25px;
  padding: 7px 0;
}
.main-app .form .g-recaptcha > div {
  margin: 0 auto;
}
.main-app .form .button {
  margin-left: -15%;
  display: inline-block;
}
.main-app .main__guides {
  margin-left: calc(10% - 30px);
  padding-top: 20px;
}
.main-app .main__guides a {
  display: block;
  color: #fff;
  font-size: 18px;
  text-decoration: none;
  padding-left: 30px;
  background: url(/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/i_list.png) no-repeat;
  background-size: 20px 20px;
  background-position: center left;
}
.main-app .main__footer {
  margin-top: 70px;
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  /*margin-left: 30%;*/
  position: static;
  z-index: 3;
}

.page2 .main-app .main__footer {
  width: 75%;
}

.main-app .hasGift-list {
  width: 100%;
  text-align: center;
}
.main-app .hasGift-list thead td {
  font-size: 26px;
  text-transform: uppercase;
  font-weight: bold;
}
body  .page2 .main-app .main__note.absolute {
  bottom: 0px; margin-left: 0; left: 30%; width: 44%;
}

/* Page 2 Vertical */
.page2 .main__note {
  width: 70%;
  margin: 0 0 0 -15%;
}

.main_mb img{ display: none; }

body .page2 .main-app .main_mb a.button {
  position: absolute;
  bottom: 20px;
  left: 8%;
}

/* Page 1 */
#ipad_pro_portrait{
  display: none;
}

/* fix height */
body .page_1.fix-height { height: 100%; }
body .page_1.fix-height .main-app .container{ width: 100%; margin: 0; padding: 0; }
body .page_1.fix-height main.main-app, .page_1.fix-height .main-app .main__content {
  height: auto;
}

body .page_1.fix-height header.header {
  height: auto;
}

body .page_1.fix-height img.main__flower {
  height: auto !important;
  width: auto !important;
}

.modal-dialog.fix-height {
  height: auto !important;
}

#campaign-endyear-main .modal-dialog {
  border-radius: 15px;
  width: 55% !important; 
  margin-left: auto;
  top: 8%;
}
/* End Page 1 */

#modal_net_service select#net_service {
  height: 35px;
  border-radius: 5px;
  border: 1px solid;
  background: #fff;
  padding-left: 5px;
  margin-bottom: 10px;
}

#modal_net_service select#net_service + div {
  margin-bottom: 8px;
}

#modal_net_service select:focus, #modal_net_service button{outline: none;}


@media (max-width: 1199px){
  body .page2{
    background: url('/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/bg_mb.jpg') no-repeat !important;
    height: 100vh;
    overflow: hidden;
    overflow-y: scroll;
  }

  .page2 .main-app {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    margin-top: 30px;
    width: 100%;
    margin: 0;
  }

  .page2 .main-app > div {
    width: 70%;
    margin: 0 15% !important;
  }

  .page2 .main-app > div.main__content {
    order: 1;
  }

  .page2 .main-app > div.main_mb {
    order: 2;
    position: relative;
  }

  .page2 .main-app > div.main_mb img{
    display: block;
    max-width: 100%;
  }

  .page2 .main-app > div.main_mb .button {
    left: 50% !important;
    bottom: 10%;
    position: absolute;
    transform: translateX(-50%);
    width: 279px;
  }

  .page2 .main-app > div.main__guides {
    order: 3;
    width: 40%;
    margin: 0 30% !important;
  }

  .page2 .main-app > div.main__footer {
    order: 4;
    width: 100%;
    margin: 0 !important;
  }

  .page2 .main-app > div.main__content a.button {
    margin-left: 0;
  }


  .page2 .main-app > div.main__footer .absolute-logo {
    position: static;
    width: 100%;
  }

  .page2.main-app > div.main__footer .absolute-logo img {
    float: left;
  }

  .page2 .main-app > div.main__footer .absolute-logo img:first-child {
    width: 35%;
    margin-left: 10%;
    margin-top: 5%;
  }

  .page2 .main-app > div.main__footer .absolute-logo img:last-child {
    width: 55%;
    float: right;
  }

  .page2 .main-app > div.main__footer .main__note {
    position: static;
    width: 70%;
    margin: 0 15% 30px;
  }
}

@media (min-width: 768px){
  .modal-dialog {
    width: 80% !important;
    top: 13%;
    height: 74%;
  }

  .page2 .header .header__title h1 br{ display: none;}
}

@media (max-width: 1194px){
  .modal .modal__notification, 
  .modal .modal__notification.ctkm, 
  .modal .modal__notification.mvrr, 
  .modal .modal__notification .gift, 
  .modal .modal__notification .name {
    font-size: 26px !important;
    margin: 0;
  }
}

@media (max-width: 1024px){
  .modal .modal__notification, .modal .modal__notification.ctkm, .modal .modal__notification.mvrr, .modal .modal__notification .gift, .modal .modal__notification .name{
    font-size: 20px !important;
  }
  body .page_1.fix-height header.header{position: relative; z-index: 2;}
}

@media (max-width: 991px){
  .page2 .main-app > div.main__guides{
    width: 55%;
    margin: 0 auto !important;
  }

  .main__lien{ width: 20%; top: 8%; z-index: 1; }
  body .page_1 .header .header__title h1{ font-size: 25px; }
}

@media (max-width: 767px) {
  .modal-dialog {
    top: 7%;
    height: 85%;
  }
  .modal-content, .modal-body {
    height: 100%;
  }
  .page_1 .main__content #ipad_pro_portrait {
    height: 100%;
    width: 100%;
  }
  .header_popup {
    padding: 0 8%;
    position: relative;
    z-index: 2;
    margin-bottom: 0;
    margin-top: -8px;
  }
  .header_popup .logo_dell {
    width: 18%;
  }
  .header_popup .logo_intel {
    width: 25%;
  }
  .modal__notification.mvrr {
    margin-top: 8px;
  }
  price-col {
    width: 50%;
  }
  .name-col {
    width: 35%;
  }
  .modal__notification.ctkm{
    font-size: 90% !important;
  }

  .modal__notification.mvrr{
    font-size: 93% !important;
  }

  .page2 .main-app {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }

  .page2 .main-app > div {
    width: 100%;
    margin: 0 !important;
    padding: 0 15px;
  }

  .main-app .form p, .main-app .form form label {
    font-size: 14px;
  }

  .page2 .main-app > div.main__content {
    order: 1;
  }

  .page2 .main-app > div.main__left {
    order: 2; overflow: visible; margin-bottom: 25px;
  }

  .page2 .main-app > div.main__guides {
    order: 3;
    width: 100%;
    margin: 0 !important;
  }

  .page2 .main-app > div.main__guides a{ font-size: 14px; }

  body .page2 {
    height: 100%;
  }

  body .page2 .main-app .form .form__group{
    flex-wrap: wrap;
  }

  body .page2 .main-app .form .form__group label,
  body .page2 .main-app .form .form__group input{ flex-basis: 100%; }

  .page2 .main-app > div.main__footer {
    order: 4;
    width: 100%;
    margin: 0;
    padding: 0;
  }

  .page2 .main-app > div.main__content a.button {
    margin-left: 0;
    height: 40px;
    line-height: 30px;
  }

  .page2 .main-app > div.main__footer .absolute-logo {
    position: static;
    width: 100%;
  }

  .page2.main-app > div.main__footer .absolute-logo img {
    float: left;
  }

  .page2 .main-app > div.main__footer .absolute-logo img:first-child {
    width: 35%;
    margin-left: 10%;
    margin-top: 5%;
  }

  .page2 .main-app > div.main__footer .absolute-logo img:last-child {
    width: 55%;
    float: right;
  }

  .page2 .main-app > div.main__footer .main__note {
    position: static;
    width: 100%;
    margin: 0 0 30px;
  }

  /* Page 3 */

  .main-app .hasGift-list thead td{
    border: none;
    border-bottom: 2px solid #fff;
  }
  .main-app .hasGift-list tbody th {
    border: none;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
  }
  .date-col { width: 15%; }
  .name-col { width: 30%; }
  .phone-col { width: 22%; }
  .price-col { width: 33%; }

  /* Page 1 */
  .modal-body{ background-size: 100% 100%; }
  .main__lien{ top: 10%; }
  body .page_1 #ipad_pro_landscape{ display: none !important; }
  body .page_1 #ipad_pro_portrait{ display: block !important; }
  #campaign-endyear-main .modal-dialog{ width: 90% !important; margin: 10px auto; }
  body .page_1 .main-app .container{ margin: 0; padding: 0; }
}

@media (max-width: 320px) {
  .note-intel.popup {
    font-size: 80%;
  }

  .modal-dialog {
    height: 80%;
  }

  /*.header_popup {
  padding: 5% 25% 0 4% !important;
  margin: 0;
  }*/
  
  #popup .modal-body>img:first-child {
    width: 30%;
  }

  .modal .modal__notification.ctkm,
  .modal .modal__notification.mvrr {
    font-size: 14px !important;
    margin: 0;
  }

  #modal_net_service select#net_service {
    height: 25px !important;
  }

}


/* Page 3 */
.page3 .main-app .main__note {
  margin-top: 40px;
}

body .page3 .main-app .main__content {
  position: relative;
  z-index: 2;
  max-height: 60vh;
  overflow: auto;
}

body .page3 .main-app .main__content::-webkit-scrollbar {
  width: 8px; border-raidus: 5px;
}

body .page3 .main-app .main__content::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

body .page3 .main-app .main__content::-webkit-scrollbar-thumb {
  background-color: #cacaca;
  outline: none;
  height: 5px;
  border-radius: 5px
}
/********** ANIMATIONS **********/

@keyframes effect1 {
  0% {
    transform: rotate(20deg) scale(1.1);
  }
  100% {
    transform: rotate(-20deg) scale(1.1);
  }
}
@keyframes effect2 {
  50% {
    transform: translateY(-30%);
  }
  100% {
    transform: translateY(1000px);
  }
}


@media (max-width: 991px){
  body{
    background: url('/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/bg_mb.jpg') no-repeat;
    background-size: 100% 100%;
  }

  header .header__logos img {
    width: auto !important;
    height: calc(100vw * 0.12);
  }
  .wrapper.page_1 .container{ padding: 0; max-width: 100%;}
  .wrapper.page_1 .main__flower{ margin-left: 0; }
}

@media (max-width: 767px){
  body{
    background: url('/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/bg_mb.jpg') no-repeat;
    background-size: cover;
  }
  body.full_height{
    height: 100vh;
  }

  #popup .modal-body> img:first-child{ width: 40%; }

  body .page_1 .main-app .main__note p.note-intel{ margin-bottom: 0; }
  body .page_1{ overflow: hidden; }
}

@media (max-width: 576px) {
  body .page2 {
    background-image: url('/dellgift/frontend/frontend-modules/core/client/img/campaign-endyear/Mobile---giftbox.jpg');
    background-position: 50% 70%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-color: #ea3524;
  }

  .header .header__title h1 {
    font-weight: 600;
    font-size: 18px;
    max-width: 85%;
  }
  .header .header__title p {
    font-size: 14px; margin-bottom: 0;
  }
  .header .header__title p:last-child {
    font-size: 14px;
  }
  .page_1 .main {
    margin-top: 10%;
  }

  .main-app .main__footer {
    flex-direction: column;
    margin-top: 0;
  }
  .main-app .main__note.page2 {
    width: 100%;
    margin-left: 0;
  }
  .main-app .main__note.page2 .note {
    font-size: 12px;
    margin-top: 20px;
  }
  .no-absolute .note--small {
    font-size: 4px;
    margin-top: 25%;
  }
  .absolute-logo {
    display: flex;
    width: 100%;
    align-items: center;
    bottom: 4%;
  }
  .absolute-logo img:first-child {
    width: 45%;
  }
  .absolute-logo img:last-child {
    width: 55%;
  }
  .main__lien {
    position: absolute;
    right: 0;
    top: 10%;
    width: 30%;
  }
  .main-app .main__lm {
    width: 25px !important;
  }
  body .page2 .main-app .main__note.absolute {
    width: 100%;
    left: 0;
  }
  .page_1 .main .main__note.absolute {
    width: 90%;
    left: unset;
    right: 0;
  }
  .absolute .note {
    font-size: 12px;
  }
  .absolute .note {
    font-size: 10px;
    margin-bottom: 5px;
    text-align: center;
    max-width: 90%;
    margin: 0 auto 5px;
  }
  .absolute .note--small {
    font-size: 4.5px;
    max-width: 95%;
    margin: 0 auto 5px;
  }
  .absolute .note--small br{ display: none; }
  .main-app .main__lm.main__lm--9 {
    bottom: 20%;
  }
  .main-app .main__lm.main__lm--10 {
    bottom: 50%;
  }
  .main-app .main__lm.main__lm--8 {
    bottom: 60%;
  }
  .main-app .main__lm.main__lm--11 {
    left: 5%;
    bottom: 50%;
  }
  .modal .modal__notification {
    font-size: 14px;
  }
  .modal .modal__notification .name {
    font-size: 18px;
  }
  .modal .modal__notification .gift {
    font-size: 14px;
    padding: 0 2% !important;
  }
  .modal .modal__img {
    width: 30%;
  }
  .modal .modal__note .note {
    font-size: 12px;
  }
  .modal .modal__note .note--small {
    font-size: 4px; margin: 0 auto; max-width: 80%;
  }

  .main-app .hasGift-list thead td {
    font-size: 14px;
  }
  .hidden-img {
    width: 100%;
    margin: 0 auto;
  }
  table,
  th,
  td {
    font-size: 12px;
    padding: 10px 5px;
  }
  .main-app .main__note.page3 {
    width: 100%;
  }
  .main-app .main__note.page3 .note--small {
    font-size: 4px;
    margin-bottom: 0;
  }

  .modal .modal__notification, .modal .modal__notification.ctkm, .modal .modal__notification.mvrr, .modal .modal__notification .gift, .modal .modal__notification .name{
    font-size: 14px !important;
  }
  body .page_1.fix-height .main__content #ipad_pro_portrait{ height: auto; }
}

@media (max-width: 374px){
  body{ height: 100%; }
  .absolute .note {
    font-size: 8px;
  }
}

@media (max-width: 345px){
  body .page_1{ height: 100%; }
  body .page_1 .header{ height: 30%; }
  body .page_1 .main-app{ height: 70%; }
  body .page_1 .main__content #ipad_pro_portrait{ height: auto; }
  
}

@media (max-width: 1024px) and (min-width: 768px){

  .page_1.fix-height .main-app .main__note.absolute{
    bottom: 0 !important;
  }
}