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

   .content {
      max-width: 420px;
      min-height: calc(420px + (320px / 2));
   }
   .node {
      width: 204px;
      height: 204px;
      border-radius: 15px;
      -webkit-border-radius: 15px;
      -moz-border-radius: 15px;
   }
   .video-node {
      width: 420px;
      height: 204px;
   }

   .node-text {
   }

   .node-1 {
      margin-right: 12px;
      margin-bottom: 12px;
   }

   .node-2 {
      margin-bottom: 12px;
   }

   .node-3 {
      margin-right: 12px;
   }

   .node-4 p {
      font-size: 21px;
   }
}

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

   .content {
      max-width: 470px;
      /*max-height: 470px;*/
      min-height: calc(470px  + (320px / 2));
   }

   .node {
      width: 228px;
      height: 228px;
      border-radius: 18px;
      -webkit-border-radius: 18px;
      -moz-border-radius: 18px;
   }

   .video-node {
      width: 470px;
      height: 228px;
   }

   .node-text {
   }

   .node-1 {
      margin-right: 14px;
      margin-bottom: 14px;
   }

   .node-2 {
      margin-bottom: 14px;
   }

   .node-3 {
      margin-right: 14px;
   }

   .node-4 p {
      font-size: 22px;
   }
}

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

   .content {
      max-width: 496px;
      max-height: 496px;
      top: max(calc(50% - (496px / 2)), 320px / 2);
   }
   .gallery {
      top: 0;
   }
   .node {
      width: 240px;
      height: 240px;
      border-radius: 20px;
      -webkit-border-radius: 20px;
      -moz-border-radius: 20px;
   }

   .video-node {
      width: 496px;
      height: 240px;
   }

   .node-text {
   }

   .node-1 {
      margin-right: 16px;
      margin-bottom: 16px;
   }

   .node-2 {
      margin-bottom: 16px;
   }

   .node-3 {
      margin-right: 16px;
   }

   .node-4 p {
      font-size: 24px;
   }
}

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


   .content {
      max-width: 530px;
      max-height: 530px;
      top: max(calc(50% - (530px / 2)), 320px / 2);
   }
   .node {
      width: 256px;
      height: 256px;
      border-radius: 22px;
      -webkit-border-radius: 22px;
      -moz-border-radius: 22px;
   }

   .video-node {
      width: 530px;
      height: 256px;
   }

   .node-text {
   }

   .node-1 {
      margin-right: 18px;
      margin-bottom: 18px;
   }

   .node-2 {
      margin-bottom: 18px;
   }

   .node-3 {
      margin-right: 18px;
   }

   .node-4 p {
      font-size: 26px;
   }
}

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

   .content {
      max-width: 564px;
      max-height: 564px;
      top: max(calc(50% - (564px / 2)), 320px / 2);
   }
   .node {
      width: 272px;
      height: 272px;
      border-radius: 25px;
      -webkit-border-radius: 25px;
      -moz-border-radius: 25px;
   }

   .video-node {
      width: 564px;
      height: 272px;
   }

   .node-text {
   }

   .node-1 {
      margin-right: 20px;
      margin-bottom: 20px;
   }

   .node-2 {
      margin-bottom: 20px;
   }

   .node-3 {
      margin-right: 20px;
   }

   .node-4 p {
      font-size: 29px
   }
}

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


   .content {
      max-width: 588px;
      max-height: 588px;
      top: max(calc(50% - (588px / 2)), 320px / 2);
   }

   .node {
      width: 284px;
      height: 284px;
   }

   .video-node {
      width: 588px;
      height: 284px;
   }

   .node-text {
   }
}