/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */


#custom_events_deco{
  height: 500px;
  position: absolute;
  width: 106%;
  z-index: 0;
  right: -40px;
}
#hs_cos_wrapper_widget_1729850730242_{
  position: relative;
  display: block;
}
.widget-type-cell.cell_17169175304752-vertical-alignment{
  z-index:15;
}
.widget-type-custom_widget{z-index:5}

#custom_events_deco .circle-unit_small_1 {
  position:absolute;
  top:-60px;
  left:40px;
  animation: circle-animation1 4s infinite ease-in-out;
  background: #C8DAF9;
  border-radius: 50%;
  height: 8px;
  width: 8px;  
}

@keyframes circle-animation1 {
  0% { transform: translateX(10px) translateY(49px); }
  30% { transform: translateX(12px) translateY(43px); }
  60% { transform: translateX(18px) translateY(41px); }
  100% { transform: translateX(10px) translateY(49px); }
}

#custom_events_deco .circle-unit_small_2 {
  position:absolute;
  left: -33px;
  bottom: 120px;
  animation: circle-animation2 6s infinite ease-in-out;
  background: #1A66E6;
  border-radius: 50%;
  height: 8px;
  width: 8px;  
}

@keyframes circle-animation2 {
  0% { transform: translateX(10px) translateY(9px); }
  30% { transform: translateX(12px) translateY(13px); }
  60% { transform: translateX(18px) translateY(11px); }
  100% { transform: translateX(10px) translateY(9px); }
}

#custom_events_deco .circle-unit_big_1 {
  position: absolute;
  left: 56%;
  top: -40px;
  animation: circle-animation2 10s infinite ease-in-out;
  background: #1A66E6;
  border-radius: 50%;
  height: 120px;
  width: 120px;
  z-index: 10;
}

#custom_events_deco .circle-unit_rombo_1{
  border: 2px solid #C7DAF9;
  border-radius: 4px;
  height: 24px;
  width: 24px;
  position: absolute;
  top: -50px;
  left: 120px;
  animation: romb1 10s infinite ease-in-out;
}

@keyframes romb1 {
  0%{ transform: translate(0) rotate(-10deg); }
  31%{ transform: translate(0) rotate(100deg); }
  62%{ transform: translate(0) rotate(140deg); }
  100% { transform: translate(0) rotate(-10deg); }
}

#custom_events_deco .circle-unit_rombo_2{
  border: 4px solid #CCDCF7;
  border-radius: 8px;
  height: 36px;
  width: 36px;
  position: absolute;
  left: 113px;
  bottom: 22%;
  animation: romb2 10s infinite ease-in-out;
}

@keyframes romb2 {
  0%{ transform: translate(0) rotate(10deg); }
  31%{ transform: translate(0) rotate(-100deg); }
  62%{ transform: translate(0) rotate(-140deg); }
  100% { transform: translate(0) rotate(10deg); }
}

.square_events_background{
  position: absolute;
  bottom: 100px;
  right: 15%;
  width: 400px;
  z-index: 0;
}


@media screen and (max-width: 768px){
#custom_events_deco{
  width: 100%;
  z-index: 0;
  padding: 0;
  margin: 0;
  left: 0;
  }
.square_events_background {
  bottom: 14%;
  left: 25%;
  width: 100%;∑
  }
  #custom_events_deco .circle-unit_small_1{
    top: 0;
    left: 40px;
  }
  #custom_events_deco .circle-unit_small_2{
    left: 25%;
    bottom: 50px;
  }
  #custom_events_deco .circle-unit_big_1{
  left: 56%;
  top: -8px;
  }
  #custom_events_deco .circle-unit_rombo_1{
  top: 20px;
  }
}



/*****************************************/