/*(1680px)*/
@media screen and (min-width: 1445px) and (max-width: 1680px) {

.parent {
display: grid;
height: 100%;
grid-template-columns: repeat(4, 1fr) 214px 214px;
grid-template-rows: 240px 220px 250px 226px;
}

.block7_circle {
left: 42%;
}

.block11_1 {
    grid-row: 1;
grid-column: 1;  
    background: url(images/pic_40.svg) no-repeat 100%;
    background-size: 100% auto;
    position: relative;
    top: 20px;
}
.block11_4 {
    background: url(images/pic_29.svg) no-repeat 50% 25px;
    background-size: 100% auto;
}
    
.orange1, .orange2, .orange3 {
    top: 40px;
}


   @keyframes block7_img{
  0% {
    transform: translateX(-10%);
  }
 50% {
    transform: translateX(25%);

  }

   75% {
    transform: translateX(80%);

  }
  100% {
    transform: translateX(-10%);

  }
}

@keyframes block7_circle{
  0% {
    opacity: 0;
  }
70% {
    opacity: 0;

  }
  80% {
    opacity: 1;

  }
  100% {
    opacity: 1;

  }
}

@keyframes orangeAnimation {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    /* roll */
    35% {
        transform: translate(680px, 0) rotate(720deg);
    }
    /* fall*/
    65% {
        transform: translate(760px, 300px) rotate(1000deg);
    }
    /* пауза */
    93.33% {
        transform: translate(760px, 300px) rotate(1000deg);
    }
    /* falldown */
    100% {
        transform: translate(790px, 400px) rotate(1000deg);
    }
}

}

/*(1440px)*/
@media screen and (min-width: 1368px) and (max-width: 1444px) {
  .block11_4 {
    background: url(images/pic_29.svg) no-repeat 50% 45px;
    background-size: 100% auto;
}
    
}

/*(1366px)*/
@media screen and (min-width: 1281px) and (max-width: 1366px) {
  .block11_4 {
    background: url(images/pic_29.svg) no-repeat 50% 48px;
    background-size: 100% auto;
}

  .block11_1 {
    grid-row: 1;
grid-column: 1;  
    background: url(images/pic_40.svg) no-repeat 100%;
    background-size: 100% auto;
    position: relative;
    top: 35px;
}
.block7_img {
    position: absolute;
    left: -130%;
    top: 93px;
    animation: block7_img 5s linear 5s infinite;
    z-index: 5;
}

}

/*(1280px)*/
@media screen and (min-width: 1025px) and (max-width: 1280px) {

  .block7_img {
    position: absolute;
    left: -140%;
    top: 93px;
    animation: block7_img 5s linear 5s infinite;
    z-index: 5;
}
.block11_1 {
  top: 30px;
}

.block11_4 {
    background: url(images/pic_29.svg) no-repeat 50% 54px;
    background-size: 100% auto;
    position: relative;
}

@keyframes orangeAnimation {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    /* roll */
    35% {
        transform: translate(450px, 0) rotate(720deg);
    }
    /* fall*/
    65% {
        transform: translate(600px, 400px) rotate(1000deg);
    }
    /* пауза    */
    93.33% {
        transform: translate(650px, 300px) rotate(1000deg);
    }
    /* falldown */
    100% {
        transform: translate(650px, 400px) rotate(1000deg);
    }
}
}

/*(1024px) */
@media screen and (max-width: 1024px) {
  .parent {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: 240px 220px 205px 226px 240px 240px;
}

.block5 {
  order: 9;
}
.block6 {
  order: 10;
}
.block7 {
  order: 5;
}
.block8 {
  order: 6;
}
.block9 {
  order: 7;
}
.block10 {
  order: 11;
  grid-row: 5 / span 2;
    grid-column: 3 / span 2;
}

.block11 {
  order: 8;
}
.block12 {
  order: 12;
  grid-row: 6;
    grid-column: 1 / span 2;
}

.block7_img {
  left: -170%;
}

.block7_circle {
  left: 35%;
}

.block11_1 {
  top: 20px;
}

  .block11_4 {
    background: url(images/pic_29.svg) no-repeat 50% 45px;
    background-size: 100% auto;
    position: relative;
}

@keyframes orangeAnimation {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    /* roll */
    35% {
        transform: translate(600px, 0) rotate(720deg);
    }
    /* fall*/
    65% {
        transform: translate(650px, 300px) rotate(1000deg);
    }
    /* пауза    */
    93.33% {
        transform: translate(600px, 300px) rotate(1000deg);
    }
    /* falldown */
    100% {
        transform: translate(650px, 400px) rotate(1000deg);
    }
}
}

@media screen and (max-width: 768px) {
.block11_1 {
        top: 40px;
    }
    
    .block11_4 {
        background: url(images/pic_29.svg) no-repeat 50% 60px;
        background-size: 100% auto;
        position: relative;
    }

   @keyframes orangeAnimation {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    /* roll */
    35% {
        transform: translate(420px, 0) rotate(720deg);
    }
    /* fall*/
    65% {
        transform: translate(550px, 350px) rotate(1000deg);
    }
    /* пауза    */
    93.33% {
        transform: translate(400px, 350px) rotate(1000deg);
    }
    /* falldown */
    100% {
        transform: translate(550px, 350px) rotate(1000deg);
    }
}
}


@media screen and (max-width: 320px) {


.block_text {
  font-size: 12px;
}

  .block1_1_round img {
    position: relative;
    top: 21px;
  }

.block9_arrow {
   top: 2%;
  left: 48%;
}

.block11_4 {
    background: url(images/pic_29.svg) no-repeat 50% 87px;
    background-size: 100% auto;
}

  .block11_1 {
    grid-row: 1;
grid-column: 1;  
    background: url(images/pic_40.svg) no-repeat 100%;
    background-size: 100% auto;
    position: relative;
    top: 30px;
}

.block7_circle {
   top: 75px;
    left: 33%;
}

.garland1 {
    position: absolute;
    top: 40%;
    left: 6%;
    z-index: 10;
}

.garland2 {
    position: absolute;
    top: 45%;
    left: 28%;
     z-index: 10;
}

.garland3 {
    position: absolute;
    top: 45%;
    left: 51%;
     z-index: 10;
}

.garland4 {
    position: absolute;
    top: 40%;
    left: 70%;
     z-index: 10;
}

.shade1 {
  position: absolute;
    top: 20%;
    left: -5%;
    z-index: 1;  
    animation: flicker 0.5s infinite;
}

.shade2 {
  position: absolute;
    top: 30%;
    left: 20%;
    z-index: 1; 
    animation: flicker 0.5s infinite linear 3s;
}

.shade3 {
  position: absolute;
    top: 30%;
    left: 44%;
    z-index: 1; 
    animation: flicker 0.5s infinite linear; 
}

.shade4 {
  position: absolute;
    top: 20%;
    left: 50%;
    z-index: 1;  
    animation: flicker 0.5s infinite linear 3s;
    overflow: hidden;
}


img {
  max-width: 100%;
}
  .block7_1 img {
height: 150px;
  }

.block7_img {
    top: 75px;
}

  .block8 h2 {
    font-size: 50px;
  }

.block11_1 img{
width: 30px;
height: auto;
}

.orange1, .orange2, .orange3 {
 top: 35px;
}

  
.block1_1 {
  height: auto;

}

.block1_1_round, .block1_3_round  {
  height: 100px;
  width: 100px;
}
.block1_1_round img, .block1_3_round img{
  height: 80px;
  width: 80px;
}
.block10_1 {
    height: 200px;
    width: 200px;
  }
.block10_1_wrap {
  background-size: 100% auto;
}
  .parent {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(6, 1fr) 320px 1fr 350px;
}
.block1 {
  order: 1;
  grid-column: 1;
  grid-row: 1 / span 4;
  grid-template-rows: 169px repeat(2, 1fr) 169px;
}
.block6 {
  order: 7;
  grid-row: 5;
}
.block7 {
  order: 6;
   grid-row: 5;
}
.block8 {
  order: 8;
}
.block9 {
  order: 9;
}
.block10 {
  order: 10;
    grid-column: 1 / span 2;
    grid-row: 7;
}

.block11 {
  order: 12;
    grid-column: 1 / span 2;
    grid-row: 9;
}
.block12 {
  order: 11;
   grid-column: 1 / span 2;
   grid-row: 8;
}




@keyframes orangeAnimation {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    /* roll */
    35% {
        transform: translate(250px, 0) rotate(720deg);
    }
    /* fall*/
    65% {
        transform: translate(300px, 300px) rotate(1000deg);
    }
    /* пауза    */
    93.33% {
        transform: translate(300px, 300px) rotate(1000deg);
    }
    /* falldown */
    100% {
        transform: translate(300px, 400px) rotate(1000deg);
    }
}

@keyframes block7_img{
  0% {
    transform: translateX(-10%);
  }
 50% {
    transform: translateX(25%);

  }

   75% {
    transform: translateX(57%);

  }
  100% {
    transform: translateX(-10%);

  }
}
}