/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on January 5, 2021 */


*{margin: 0;padding: 0;}
p{margin: 0;}
a{text-decoration: none;color: #fff;}
img{border: 0;}
ul,li,i{margin: 0;padding: 0;font-style: normal;list-style: none;}
.fl{float: left;}
.fr{float: right;}
input{border: 0;outline: 0;}
/*li{float: left;}*/
.clearfix:after{display: block;content: "";clear: both;}
.clearfix:after,.clearfix:before{content:"";display:table}
.clearfix:after{clear:both;overflow:hidden}
.clearfix{zoom:1}
.clearfix:after,.clearfix:before{content:"";display:table}
.clearfix:after{clear:both;overflow:hidden}
.clearfix{zoom:1}
@font-face {
    font-family: "Market Sans", Arial, sans-serif;
    src: url('montserrat-regular-8-webfont.woff2') format('woff2'),
         url('montserrat-regular-8-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
body{
    font-family: "Market Sans", Arial, sans-serif;
}
.layout{
    width: 86%;margin: 0 auto;
}





/*
  Theme controls how everything looks in Gallery CSS.
*/
.banner-auto .gallery {
    position: relative;
    width:100%;
    margin: 0 auto
}
.gallery .banner-slides {position: relative;}
.gallery .banner-slides .item {
    overflow: hidden;
    text-align: center;
    margin:0
}
.overflow {
    width: 100%;
    overflow: hidden;
}
.gallery .banner-slides .info{display: none;  position: absolute; top:30%; left:40%; color: #fff; font-size: 20px; }
.gallery .banner-slides .info h3{padding: 5px 0; background: #000}
.gallery .banner-slides .item  a{display:inline-block ; width:100%;}
.gallery .banner-slides .item  img{max-width:100%; width: 100%}
.gallery .controls-banner {
    position: absolute;
    bottom: 16px;
    width: 100%;
    text-align: center;
}
.gallery .controls-banner .control-button {
    display: inline-block;
    margin: 0 3px;
    font-size: 3em;
    text-align: center;
    text-decoration: none;
    transition: background .1s;
    width:14px;
    height:14px;
    background: rgba(255, 255, 255, 0.5);
}

.gallery .controls-banner .control-button:hover {
    background: rgba(255, 255, 255, 1);
}

.gallery .control-operator:target ~ .controls-banner .control-button {
    background: rgba(255, 255, 255, 0.5);
}

.gallery .controls-banner .control-button:first-of-type,
.gallery .control-operator:nth-of-type(1):target ~ .controls-banner .control-button:nth-of-type(1),
.gallery .control-operator:nth-of-type(2):target ~ .controls-banner .control-button:nth-of-type(2),
.gallery .control-operator:nth-of-type(3):target ~ .controls-banner .control-button:nth-of-type(3),
.gallery .control-operator:nth-of-type(4):target ~ .controls-banner .control-button:nth-of-type(4),
.gallery .control-operator:nth-of-type(5):target ~ .controls-banner .control-button:nth-of-type(5),
.gallery .control-operator:nth-of-type(6):target ~ .controls-banner .control-button:nth-of-type(6),
.gallery .control-operator:nth-of-type(7):target ~ .controls-banner .control-button:nth-of-type(7),
.gallery .control-operator:nth-of-type(8):target ~ .controls-banner .control-button:nth-of-type(8),
.gallery .control-operator:nth-of-type(9):target ~ .controls-banner .control-button:nth-of-type(9),
.gallery .control-operator:nth-of-type(10):target ~ .controls-banner .control-button:nth-of-type(10),
.gallery .control-operator:nth-of-type(11):target ~ .controls-banner .control-button:nth-of-type(11),
.gallery .control-operator:nth-of-type(12):target ~ .controls-banner .control-button:nth-of-type(12) {
    background: rgba(255, 255, 255, 1);
}

.gallery .banner-slides .item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0;
    -webkit-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s;
}

.gallery .banner-slides .item:first-of-type {
    position: static;
    pointer-events: auto;
    opacity: 1;

}

.gallery .control-operator {
    display: none;
}

.gallery .control-operator:target  ~ .banner-slides .item {
    pointer-events: none;
    opacity: 0;
    -webkit-animation: none;
    -o-animation: none;
    animation: none;
}

.gallery .control-operator:target ~ .controls-banner .control-button {
    -webkit-animation: none;
    -o-animation: none;
    animation: none;
}


.gallery div#item-1 + .banner-slides + .controls-banner { display: none;}

.gallery div#item-1:target ~ .banner-slides .item:nth-of-type(1) {
    pointer-events: auto;
    opacity: 1;
}

.gallery div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    pointer-events: auto;
    opacity: 1;
}

.gallery div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    pointer-events: auto;
    opacity: 1;
}
.gallery div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    pointer-events: auto;
    opacity: 1;
}
.gallery div#item-5:target ~ .banner-slides .item:nth-of-type(5) {
    pointer-events: auto;
    opacity: 1;
}
.gallery div#item-6:target ~ .banner-slides .item:nth-of-type(6) {
    pointer-events: auto;
    opacity: 1;
}
.gallery div#item-7:target ~ .banner-slides .item:nth-of-type(7) {
    pointer-events: auto;
    opacity: 1;
}
.gallery div#item-8:target ~ .banner-slides .item:nth-of-type(8) {
    pointer-events: auto;
    opacity: 1;
}
.gallery div#item-9:target ~ .banner-slides .item:nth-of-type(9) {
    pointer-events: auto;
    opacity: 1;
}
.gallery div#item-10:target ~ .banner-slides .item:nth-of-type(10) {
    pointer-events: auto;
    opacity: 1;
}
.gallery div#item-11:target ~ .banner-slides .item:nth-of-type(11) {
    pointer-events: auto;
    opacity: 1;
}
.gallery div#item-12:target ~ .banner-slides .item:nth-of-type(12) {
    pointer-events: auto;
    opacity: 1;
}

.gallery .controls-banner .control-button:nth-of-type(1),
.gallery .banner-slides .item:nth-of-type(1) {
    -webkit-animation-delay: -2s !important;
    -o-animation-delay: -2s !important;
    animation-delay: -2s !important;
}

.gallery .controls-banner  .control-button:nth-of-type(2),
.gallery .banner-slides .item:nth-of-type(2) {
    -webkit-animation-delay: 3s !important;
    -o-animation-delay: 3s !important;
    animation-delay: 3s !important;
}

.gallery .controls-banner .control-button:nth-of-type(3),
.gallery .banner-slides .item:nth-of-type(3) {
    -webkit-animation-delay: 8s !important;
    -o-animation-delay: 8s !important;
    animation-delay: 8s !important;
}
.gallery .controls-banner .control-button:nth-of-type(4),
.gallery .banner-slides .item:nth-of-type(4) {
    -webkit-animation-delay: 13s !important;
    -o-animation-delay: 13s !important;
    animation-delay: 13s !important;
}
.gallery .controls-banner .control-button:nth-of-type(5),
.gallery .banner-slides .item:nth-of-type(5) {
    -webkit-animation-delay: 18s !important;
    -o-animation-delay: 18s !important;
    animation-delay: 18s !important;
}
.gallery .controls-banner .control-button:nth-of-type(6),
.gallery .banner-slides .item:nth-of-type(6) {
    -webkit-animation-delay: 23s !important;
    -o-animation-delay: 23s !important;
    animation-delay: 23s !important;
}
.gallery .controls-banner .control-button:nth-of-type(7),
.gallery .banner-slides .item:nth-of-type(7) {
    -webkit-animation-delay: 28s !important;
    -o-animation-delay: 28s !important;
    animation-delay: 28s !important;
}
.gallery .controls-banner .control-button:nth-of-type(8),
.gallery .banner-slides .item:nth-of-type(8) {
    -webkit-animation-delay: 33s !important;
    -o-animation-delay: 33s !important;
    animation-delay: 33s !important;
}
.gallery .controls-banner .control-button:nth-of-type(9),
.gallery .banner-slides .item:nth-of-type(9) {
    -webkit-animation-delay: 38s !important;
    -o-animation-delay: 38s !important;
    animation-delay: 38s !important;
}
.gallery .controls-banner .control-button:nth-of-type(10),
.gallery .banner-slides .item:nth-of-type(10) {
    -webkit-animation-delay: 43s !important;
    -o-animation-delay: 43s !important;
    animation-delay: 43s !important;
}
.gallery .controls-banner .control-button:nth-of-type(11),
.gallery .banner-slides .item:nth-of-type(11) {
    -webkit-animation-delay: 48s !important;
    -o-animation-delay: 48s !important;
    animation-delay: 48s !important;
}
.gallery .controls-banner .control-button:nth-of-type(12),
.gallery .banner-slides .item:nth-of-type(12) {
    -webkit-animation-delay: 53s !important;
    -o-animation-delay: 53s !important;
    animation-delay: 53s !important;
}

/************* BANNER HAVE 2 IMAGES ****************/

@-webkit-keyframes controlAnimation-2 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    14.3%, 50% {
        background: rgba(255, 255, 255, 1);
    }

    64.3%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@-o-keyframes controlAnimation-2 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    14.3%, 50% {
        background: rgba(255, 255, 255, 1);
    }

    64.3%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-2 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    14.3%, 50% {
        background: rgba(255, 255, 255, 1);
    }

    64.3%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@-webkit-keyframes galleryAnimation-2 {
    0% {
        opacity: 0;
    }

    14.3%, 50% {
        opacity: 1;
        pointer-events: auto;
    }

    64.3%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@-o-keyframes galleryAnimation-2 {
    0% {
        opacity: 0;
    }

    14.3%, 50% {
        opacity: 1;
        pointer-events: auto;
    }

    64.3%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@keyframes galleryAnimation-2 {
    0% {
        opacity: 0;
    }

    14.3%, 50% {
        opacity: 1;
        pointer-events: auto;
    }

    64.3%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

.gallery.item-2 .controls-banner .control-button {
    -webkit-animation: controlAnimation-2 10s infinite;
    -o-animation: controlAnimation-2 10s infinite;
    animation: controlAnimation-2 10s infinite;
}

.gallery.item-2 .banner-slides .item {
    -webkit-animation: galleryAnimation-2 10s infinite;
    -o-animation: galleryAnimation-2 10s infinite;
    animation: galleryAnimation-2 10s infinite;
}

@keyframes controlAnimation-2-target  {
    0%, 14.3% {
        background: rgba(255, 255, 255, 0.5);
    }

    14.3%, 50% {
        background: rgba(255, 255, 255, 1);
    }

    64.3%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes galleryAnimation-2-target{
    0%, 14.3% {
        opacity: 0;
    }

    14.3%, 50% {
        opacity: 1;
        pointer-events: auto;
    }

    64.3%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-2 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-2-target 10s infinite;
}
.gallery.item-2 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-2-target  10s infinite;
}

.gallery.item-2 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-2 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-2 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-2 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-2  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-2 10s infinite;
}
.gallery.item-2 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-2 10s infinite;
}

/************* BANNER HAVE 3 IMAGES ****************/

@-webkit-keyframes controlAnimation-3 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    9.5%, 33.3% {
        background: rgba(255, 255, 255, 1);
    }

    42.9%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@-o-keyframes controlAnimation-3 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    9.5%, 33.3% {
        background: rgba(255, 255, 255, 1);
    }

    42.9%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-3 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    9.5%, 33.3% {
        background: rgba(255, 255, 255, 1);
    }

    42.9%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@-webkit-keyframes galleryAnimation-3 {
    0% {
        opacity: 0;
    }

    9.5%, 33.3% {
        opacity: 1;
        pointer-events: auto;
    }

    42.9%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@-o-keyframes galleryAnimation-3 {
    0% {
        opacity: 0;
    }

    9.5%, 33.3% {
        opacity: 1;
        pointer-events: auto;
    }

    42.9%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@keyframes galleryAnimation-3 {
    0% {
        opacity: 0;
    }

    9.5%, 33.3% {
        opacity: 1;
        pointer-events: auto;
    }

    42.9%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

.gallery.item-3  .controls-banner .control-button {
    -webkit-animation: controlAnimation-3 15s infinite;
    -o-animation: controlAnimation-3 15s infinite;
    animation: controlAnimation-3 15s infinite;
}

.gallery.item-3 .banner-slides .item {
    -webkit-animation: galleryAnimation-3 15s infinite;
    -o-animation: galleryAnimation-3 15s infinite;
    animation: galleryAnimation-3 15s infinite;
}

@keyframes controlAnimation-3-target  {
    0%,9.5% {
        background: rgba(255, 255, 255, 0.5);
    }

    9.5%, 33.3% {
        background: rgba(255, 255, 255, 1);
    }

    42.9%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-3-target2  {
    0%,9.5% {
        background: rgba(255, 255, 255, 0.5);
    }

    9.5%, 33.3% {
        background: rgba(255, 255, 255, 1);
    }

    42.9%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-3-target3  {
    0%,9.5% {
        background: rgba(255, 255, 255, 0.5);
    }

    9.5%, 33.3% {
        background: rgba(255, 255, 255, 1);
    }

    42.9%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes galleryAnimation-3-target{
    0%, 9.5% {
        opacity: 0;
    }

    9.5%, 33.3% {
        opacity: 1;
        pointer-events: auto;
    }

    42.9%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-3-target2{
    0%, 9.5% {
        opacity: 0;
    }

    9.5%, 33.3% {
        opacity: 1;
        pointer-events: auto;
    }

    42.9%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-3-target3{
    0%, 9.5% {
        opacity: 0;
    }

    9.5%, 33.3% {
        opacity: 1;
        pointer-events: auto;
    }

    42.9%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-3 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-3-target 15s infinite;
}
.gallery.item-3 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-3-target  15s infinite;
}
/* set animation delay when click #item-2 */
.gallery.item-3 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-3 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-3 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-3 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-3 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-3 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-3  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-3-target2 15s infinite;
}
.gallery.item-3 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-3-target2  15s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-3 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-3 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-3 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-3 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-3 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-3 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-3  div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-3-target3 15s infinite;
}
.gallery.item-3 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-3-target3  15s infinite;
}

/************* BANNER HAVE 4 IMAGES *****************/

@-webkit-keyframes controlAnimation-4 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    7.1%, 25% {
        background: rgba(255, 255, 255, 1);
    }

    32.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@-o-keyframes controlAnimation-4 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    7.1%, 25% {
        background: rgba(255, 255, 255, 1);
    }

    32.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-4 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    7.1%, 25% {
        background: rgba(255, 255, 255, 1);
    }

    32.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@-webkit-keyframes galleryAnimation-4 {
    0% {
        opacity: 0;
    }

    7.1%, 25% {
        opacity: 1;
        pointer-events: auto;
    }

    32.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@-o-keyframes galleryAnimation-4 {
    0% {
        opacity: 0;
    }

    7.1%, 25% {
        opacity: 1;
        pointer-events: auto;

    }

    32.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@keyframes galleryAnimation-4 {
    0% {
        opacity: 0;
    }

    7.1%, 25% {
        opacity: 1;
        pointer-events: auto;
    }

    32.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-4   .controls-banner  .control-button {
    -webkit-animation: controlAnimation-4 20s infinite ;
    -o-animation: controlAnimation-4  20s infinite ;
    animation: controlAnimation-4 20s infinite ;
}
.gallery.item-4  .banner-slides .item {
    -webkit-animation: galleryAnimation-4 20s infinite ;
    -o-animation: galleryAnimation-4 20s infinite ;
    animation: galleryAnimation-4 20s infinite ;
}

@keyframes controlAnimation-4-target  {
    0%, 7.1% {
        background: rgba(255, 255, 255, 0.5);
    }

    7.1%, 25% {
        background: rgba(255, 255, 255, 1);
    }

    32.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-4-target2 {
    0%, 7.1% {
        background: rgba(255, 255, 255, 0.5);
    }

    7.1%, 25% {
        background: rgba(255, 255, 255, 1);
    }

    32.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-4-target3  {
    0%, 7.1% {
        background: rgba(255, 255, 255, 0.5);
    }

    7.1%, 25% {
        background: rgba(255, 255, 255, 1);
    }

    32.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}@keyframes controlAnimation-4-target4  {
     0%, 7.1% {
         background: rgba(255, 255, 255, 0.5);
     }

     7.1%, 25% {
         background: rgba(255, 255, 255, 1);
     }

     32.1%, 100% {
         background: rgba(255, 255, 255, 0.5);
     }
 }
@keyframes galleryAnimation-4-target{
    0%, 7.1% {
        opacity: 0;
    }

    7.1%, 25% {
        opacity: 1;
        pointer-events: auto;
    }

    32.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-4-target2{
    0%, 7.1% {
        opacity: 0;
    }

    7.1%, 25% {
        opacity: 1;
        pointer-events: auto;
    }

    32.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-4-target3{
    0%, 7.1% {
        opacity: 0;
    }

    7.1%, 25% {
        opacity: 1;
        pointer-events: auto;
    }

    32.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-4-target4{
    0%, 7.1% {
        opacity: 0;
    }

    7.1%, 25% {
        opacity: 1;
        pointer-events: auto;
    }

    32.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-4 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-4-target 20s infinite;
}
.gallery.item-4 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-4-target  20s infinite;
}
/* set animation delay when click #item-2 */
.gallery.item-4 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-4 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-4 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-4 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-4 div#item-2:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-4 div#item-2:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 8s !important;
}
.gallery.item-4 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-4 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 13s !important;
}
.gallery.item-4  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-4-target2 20s infinite;
}
.gallery.item-4 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-4-target2  20s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-4 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-4 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-4 div#item-3:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-4 div#item-3:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 3s !important;
}
.gallery.item-4 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-4 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-4 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-4 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 13s !important;
}
.gallery.item-4  div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-4-target3 20s infinite;
}
.gallery.item-4 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-4-target3  20s infinite;
}
/* set animation delay when click #item-4 */
.gallery.item-4 div#item-4:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-4 div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: -2s !important;
}
.gallery.item-4 div#item-4:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-4 div#item-4:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-4 div#item-4:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-4 div#item-4:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-4 div#item-4:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-4 div#item-4:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 13s !important;
}
.gallery.item-4  div#item-4:target  ~ .banner-slides .item   {
    animation: galleryAnimation-4-target4 20s infinite;
}
.gallery.item-4 div#item-4:target ~  .controls-banner .control-button {
    animation: controlAnimation-4-target4  20s infinite;
}

/************* BANNER HAVE 5 IMAGES *****************/

@-webkit-keyframes controlAnimation-5 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    5.7%, 20% {
        background: rgba(255, 255, 255, 1);
    }

    25.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@-o-keyframes controlAnimation-5 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    5.7%, 20% {
        background: rgba(255, 255, 255, 1);
    }

    25.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-5 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    5.7%, 20% {
        background: rgba(255, 255, 255, 1);
    }

    25.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@-webkit-keyframes galleryAnimation-5 {
    0% {
        opacity: 0;
    }

    5.7%, 20% {
        opacity: 1;
        pointer-events: auto;
    }

    25.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@-o-keyframes galleryAnimation-5 {
    0% {
        opacity: 0;
    }

    5.7%, 20% {
        opacity: 1;
        pointer-events: auto;
    }

    25.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@keyframes galleryAnimation-5 {
    0% {
        opacity: 0;
    }

    5.7%, 20% {
        opacity: 1;
        pointer-events: auto;
    }

    25.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-5   .controls-banner  .control-button {
    -webkit-animation: controlAnimation-5 25s infinite;
    -o-animation: controlAnimation-5  25s infinite;
    animation: controlAnimation-5 25s infinite;
}

.gallery.item-5  .banner-slides .item {
    -webkit-animation: galleryAnimation-5 25s infinite;
    -o-animation: galleryAnimation-5 25s infinite;
    animation: galleryAnimation-5 25s infinite;
}



@keyframes controlAnimation-5-target  {
    0%,5.7% {
        background: rgba(255, 255, 255, 0.5);
    }

    5.7%, 20% {
        background: rgba(255, 255, 255, 1);
    }

    25.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-5-target2  {
    0%,5.7% {
        background: rgba(255, 255, 255, 0.5);
    }

    5.7%, 20% {
        background: rgba(255, 255, 255, 1);
    }

    25.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-5-target3  {
    0%,5.7% {
        background: rgba(255, 255, 255, 0.5);
    }

    5.7%, 20% {
        background: rgba(255, 255, 255, 1);
    }

    25.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-5-target4 {
    0%,5.7% {
        background: rgba(255, 255, 255, 0.5);
    }

    5.7%, 20% {
        background: rgba(255, 255, 255, 1);
    }

    25.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-5-target5  {
    0%,5.7% {
        background: rgba(255, 255, 255, 0.5);
    }

    5.7%, 20% {
        background: rgba(255, 255, 255, 1);
    }

    25.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes galleryAnimation-5-target{
    0%, 5.7% {
        opacity: 0;
    }

    5.7%, 20% {
        opacity: 1;
        pointer-events: auto;
    }

    25.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-5-target2{
    0%, 5.7% {
        opacity: 0;
    }

    5.7%, 20% {
        opacity: 1;
        pointer-events: auto;
    }

    25.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-5-target3{
    0%, 5.7% {
        opacity: 0;
    }

    5.7%, 20% {
        opacity: 1;
        pointer-events: auto;
    }

    25.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-5-target4{
    0%, 5.7% {
        opacity: 0;
    }

    5.7%, 20% {
        opacity: 1;
        pointer-events: auto;
    }

    25.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-5-target5{
    0%, 5.7% {
        opacity: 0;
    }

    5.7%, 20% {
        opacity: 1;
        pointer-events: auto;
    }

    25.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

.gallery.item-5 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-5-target 25s infinite;
}
.gallery.item-5 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-5-target  25s infinite;
}
/* set animation delay when click #item-2 */
.gallery.item-5 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-5 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-5 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-5 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-5 div#item-2:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-5 div#item-2:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 8s !important;
}
.gallery.item-5 div#item-2:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-5 div#item-2:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 13s !important;
}
.gallery.item-5 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-5 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 18s !important;
}
.gallery.item-5  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-5-target2 25s infinite;
}
.gallery.item-5 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-5-target2  25s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-5 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-5 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-5 div#item-3:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-5 div#item-3:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 3s !important;
}
.gallery.item-5 div#item-3:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-5 div#item-3:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 8s !important;
}
.gallery.item-5 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-5 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 13s !important;
}
.gallery.item-5 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-5 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 18s !important;
}
.gallery.item-5 div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-5-target3 25s infinite;
}
.gallery.item-5 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-5-target3  25s infinite;
}
/* set animation delay when click #item-4 */
.gallery.item-5 div#item-4:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-5 div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: -2s !important;
}
.gallery.item-5 div#item-4:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-5 div#item-4:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 3s !important;
}
.gallery.item-5 div#item-4:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-5 div#item-4:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-5 div#item-4:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-5 div#item-4:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 13s !important;
}
.gallery.item-5 div#item-4:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-5 div#item-4:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 18s !important;
}
.gallery.item-5  div#item-4:target  ~ .banner-slides .item   {
    animation: galleryAnimation-5-target4 25s infinite;
}
.gallery.item-5 div#item-4:target ~  .controls-banner .control-button {
    animation: controlAnimation-5-target4  25s infinite;
}
/* set animation delay when click #item-5 */
.gallery.item-5 div#item-5:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-5 div#item-5:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: -2s !important;
}
.gallery.item-5 div#item-5:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-5 div#item-5:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-5 div#item-5:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-5 div#item-5:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-5 div#item-5:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-5 div#item-5:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 13s !important;
}
.gallery.item-5 div#item-5:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-5 div#item-5:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 18s !important;
}
.gallery.item-5  div#item-5:target  ~ .banner-slides .item   {
    animation: galleryAnimation-5-target5 25s infinite;
}
.gallery.item-5 div#item-5:target ~  .controls-banner .control-button {
    animation: controlAnimation-5-target5  25s infinite;
}

/************* BANNER HAVE 6 IMAGES *****************/

@-webkit-keyframes controlAnimation-6 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    4.8%, 16.67% {
        background: rgba(255, 255, 255, 1);
    }

    21.47%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@-o-keyframes controlAnimation-6 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    4.8%, 16.67% {
        background: rgba(255, 255, 255, 1);
    }

    21.47%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-6 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }

    4.8%, 16.67% {
        background: rgba(255, 255, 255, 1);
    }

    21.47%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-webkit-keyframes galleryAnimation-6 {
    0% {
        opacity: 0;
    }

    4.8%, 16.67% {
        opacity: 1;
        pointer-events: auto;
    }

    21.47%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@-o-keyframes galleryAnimation-6 {
    0% {
        opacity: 0;
    }

    4.8%, 16.67% {
        opacity: 1;
        pointer-events: auto;
    }

    21.47%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

@keyframes galleryAnimation-6 {
    0% {
        opacity: 0;
    }

    4.8%, 16.67% {
        opacity: 1;
        pointer-events: auto;
    }

    21.47%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-6   .controls-banner  .control-button {
    -webkit-animation: controlAnimation-6 30s infinite;
    -o-animation: controlAnimation-6  30s infinite;
    animation: controlAnimation-6 30s infinite;
}

.gallery.item-6  .banner-slides .item {
    -webkit-animation: galleryAnimation-6 30s infinite;
    -o-animation: galleryAnimation-6 30s infinite;
    animation: galleryAnimation-6 30s infinite;
}

/* click item  */

@keyframes controlAnimation-6-target  {
    0%, 4.8% {
        background: rgba(255, 255, 255, 0.5);
    }

    4.8%, 16.67% {
        background: rgba(255, 255, 255, 1);
    }

    21.47%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-6-target2  {
    0%, 4.8% {
        background: rgba(255, 255, 255, 0.5);
    }

    4.8%, 16.67% {
        background: rgba(255, 255, 255, 1);
    }

    21.47%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-6-target3  {
    0%, 4.8% {
        background: rgba(255, 255, 255, 0.5);
    }

    4.8%, 16.67% {
        background: rgba(255, 255, 255, 1);
    }

    21.47%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-6-target4  {
    0%, 4.8% {
        background: rgba(255, 255, 255, 0.5);
    }

    4.8%, 16.67% {
        background: rgba(255, 255, 255, 1);
    }

    21.47%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-6-target5  {
    0%, 4.8% {
        background: rgba(255, 255, 255, 0.5);
    }

    4.8%, 16.67% {
        background: rgba(255, 255, 255, 1);
    }

    21.47%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-6-target6  {
    0%, 4.8% {
        background: rgba(255, 255, 255, 0.5);
    }

    4.8%, 16.67% {
        background: rgba(255, 255, 255, 1);
    }

    21.47%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes galleryAnimation-6-target{
    0%, 4.8% {
        opacity: 0;
    }
    4.8%, 16.67% {
        opacity: 1;
        pointer-events: auto;
    }
    21.47%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-6-target2{
    0%, 4.8% {
        opacity: 0;
    }
    4.8%, 16.67% {
        opacity: 1;
        pointer-events: auto;
    }
    21.47%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-6-target3{
    0%, 4.8% {
        opacity: 0;
    }
    4.8%, 16.67% {
        opacity: 1;
        pointer-events: auto;
    }
    21.47%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-6-target4{
    0%, 4.8% {
        opacity: 0;
    }
    4.8%, 16.67% {
        opacity: 1;
        pointer-events: auto;
    }
    21.47%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-6-target5{
    0%, 4.8% {
        opacity: 0;
    }
    4.8%, 16.67% {
        opacity: 1;
        pointer-events: auto;
    }
    21.47%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-6-target6{
    0%, 4.8% {
        opacity: 0;
    }
    4.8%, 16.67% {
        opacity: 1;
        pointer-events: auto;
    }
    21.47%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}

.gallery.item-6 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-6-target 30s infinite;
}
.gallery.item-6 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-6-target  30s infinite;
}
/* set animation delay when click #item-2 */
.gallery.item-6 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-6 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-6 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-6 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-6 div#item-2:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-6 div#item-2:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 8s !important;
}
.gallery.item-6 div#item-2:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-6 div#item-2:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 13s !important;
}
.gallery.item-6 div#item-2:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-6 div#item-2:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 18s !important;
}
.gallery.item-6 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-6 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 23s !important;
}
.gallery.item-6  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-6-target2 30s infinite;
}
.gallery.item-6 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-6-target2  30s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-6 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-6 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-6 div#item-3:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-6 div#item-3:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 3s !important;
}
.gallery.item-6 div#item-3:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-6 div#item-3:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 8s !important;
}
.gallery.item-6 div#item-3:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-6 div#item-3:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 13s !important;
}
.gallery.item-6 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-6 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 18s !important;
}
.gallery.item-6 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-6 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 23s !important;
}
.gallery.item-6 div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-6-target3 30s infinite;
}
.gallery.item-6 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-6-target3  30s infinite;
}
/* set animation delay when click #item-4 */
.gallery.item-6 div#item-4:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-6 div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: -2s !important;
}
.gallery.item-6 div#item-4:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-6 div#item-4:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 3s !important;
}
.gallery.item-6 div#item-4:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-6 div#item-4:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 8s !important;
}
.gallery.item-6 div#item-4:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-6 div#item-4:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 13s !important;
}
.gallery.item-6 div#item-4:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-6 div#item-4:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 18s !important;
}
.gallery.item-6 div#item-4:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-6 div#item-4:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 23s !important;
}
.gallery.item-6  div#item-4:target  ~ .banner-slides .item   {
    animation: galleryAnimation-6-target4 30s infinite;
}
.gallery.item-6 div#item-4:target ~  .controls-banner .control-button {
    animation: controlAnimation-6-target4  30s infinite;
}
/* set animation delay when click #item-5 */
.gallery.item-6 div#item-5:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-6 div#item-5:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: -2s !important;
}
.gallery.item-6 div#item-5:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-6 div#item-5:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 3s !important;
}
.gallery.item-6 div#item-5:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-6 div#item-5:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-6 div#item-5:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-6 div#item-5:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 13s !important;
}
.gallery.item-6 div#item-5:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-6 div#item-5:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 18s !important;
}
.gallery.item-6 div#item-5:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-6 div#item-5:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 23s !important;
}
.gallery.item-6  div#item-5:target  ~ .banner-slides .item   {
    animation: galleryAnimation-6-target5 30s infinite;
}
.gallery.item-6 div#item-5:target ~  .controls-banner .control-button {
    animation: controlAnimation-6-target5  30s infinite;
}
/* set animation delay when click #item-6 */
.gallery.item-6 div#item-6:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-6 div#item-6:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: -2s !important;
}
.gallery.item-6 div#item-6:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-6 div#item-6:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-6 div#item-6:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-6 div#item-6:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-6 div#item-6:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-6 div#item-6:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 13s !important;
}
.gallery.item-6 div#item-6:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-6 div#item-6:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 18s !important;
}
.gallery.item-6 div#item-6:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-6 div#item-6:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 23s !important;
}
.gallery.item-6 div#item-6:target  ~ .banner-slides .item   {
    animation: galleryAnimation-6-target6 30s infinite;
}
.gallery.item-6 div#item-6:target ~  .controls-banner .control-button {
    animation: controlAnimation-6-target6  30s infinite;
}

/************* BANNER HAVE 7 IMAGES *****************/

@-webkit-keyframes controlAnimation-7 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-o-keyframes controlAnimation-7 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-7 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-webkit-keyframes galleryAnimation-7 {
    0% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@-o-keyframes galleryAnimation-7 {
    0% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-7 {
    0% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-7   .controls-banner  .control-button {
    -webkit-animation: controlAnimation-7 35s infinite;
    -o-animation: controlAnimation-7  35s infinite;
    animation: controlAnimation-7 35s infinite;
}
.gallery.item-7  .banner-slides .item {
    -webkit-animation: galleryAnimation-7 35s infinite;
    -o-animation: galleryAnimation-7 35s infinite;
    animation: galleryAnimation-7 35s infinite;
}

/* click item  */

@keyframes controlAnimation-7-target  {
    0%, 4.1% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-7-target2  {
    0%, 4.1% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-7-target3  {
    0%, 4.1% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-7-target4  {
    0%, 4.1% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-7-target5  {
    0%, 4.1% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-7-target6  {
    0%, 4.1% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-7-target7  {
    0%, 4.1% {
        background: rgba(255, 255, 255, 0.5);
    }
    4.1%, 14.28% {
        background: rgba(255, 255, 255, 1);
    }
    18.38%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes galleryAnimation-7-target{
    0%, 4.1% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-7-target2{
    0%, 4.1% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-7-target3{
    0%, 4.1% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-7-target4{
    0%, 4.1% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-7-target5{
    0%, 4.1% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-7-target6{
    0%, 4.1% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-7-target7{
    0%, 4.1% {
        opacity: 0;
    }
    4.1%, 14.28% {
        opacity: 1;
        pointer-events: auto;
    }
    18.38%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-7 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-7-target 35s infinite;
}
.gallery.item-7 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-7-target  35s infinite;
}
/* set animation delay when click #item-2 */
.gallery.item-7 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-7 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-7 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-7 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-7 div#item-2:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-7 div#item-2:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 8s !important;
}
.gallery.item-7 div#item-2:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-7 div#item-2:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 13s !important;
}
.gallery.item-7 div#item-2:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-7 div#item-2:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 18s !important;
}
.gallery.item-7 div#item-2:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-7 div#item-2:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 23s !important;
}
.gallery.item-7 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-7 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 28s !important;
}
.gallery.item-7  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-7-target2 35s infinite;
}
.gallery.item-7 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-7-target2  35s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-7 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-7 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-7 div#item-3:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-7 div#item-3:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 3s !important;
}
.gallery.item-7 div#item-3:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-7 div#item-3:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 8s !important;
}
.gallery.item-7 div#item-3:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-7 div#item-3:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 13s !important;
}
.gallery.item-7 div#item-3:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-7 div#item-3:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 18s !important;
}
.gallery.item-7 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-7 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 23s !important;
}
.gallery.item-7 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-7 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 28s !important;
}
.gallery.item-7 div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-7-target3 35s infinite;
}
.gallery.item-7 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-7-target3  35s infinite;
}
/* set animation delay when click #item-4 */
.gallery.item-7 div#item-4:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-7 div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: -2s !important;
}
.gallery.item-7 div#item-4:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-7 div#item-4:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 3s !important;
}
.gallery.item-7 div#item-4:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-7 div#item-4:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 8s !important;
}
.gallery.item-7 div#item-4:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-7 div#item-4:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 13s !important;
}
.gallery.item-7 div#item-4:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-7 div#item-4:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 18s !important;
}
.gallery.item-7 div#item-4:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-7 div#item-4:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 23s !important;
}
.gallery.item-7 div#item-4:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-7 div#item-4:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 28s !important;
}
.gallery.item-7  div#item-4:target  ~ .banner-slides .item   {
    animation: galleryAnimation-7-target4 35s infinite;
}
.gallery.item-7 div#item-4:target ~  .controls-banner .control-button {
    animation: controlAnimation-7-target4  35s infinite;
}
/* set animation delay when click #item-5 */
.gallery.item-7 div#item-5:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-7 div#item-5:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: -2s !important;
}
.gallery.item-7 div#item-5:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-7 div#item-5:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 3s !important;
}
.gallery.item-7 div#item-5:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-7 div#item-5:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 8s !important;
}
.gallery.item-7 div#item-5:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-7 div#item-5:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 13s !important;
}
.gallery.item-7 div#item-5:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-7 div#item-5:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 18s !important;
}
.gallery.item-7 div#item-5:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-7 div#item-5:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 23s !important;
}
.gallery.item-7 div#item-5:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-7 div#item-5:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 28s !important;
}
.gallery.item-7  div#item-5:target  ~ .banner-slides .item   {
    animation: galleryAnimation-7-target5 35s infinite;
}
.gallery.item-7 div#item-5:target ~  .controls-banner .control-button {
    animation: controlAnimation-7-target5  35s infinite;
}
/* set animation delay when click #item-6 */
.gallery.item-7 div#item-6:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-7 div#item-6:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: -2s !important;
}
.gallery.item-7 div#item-6:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-7 div#item-6:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 3s !important;
}
.gallery.item-7 div#item-6:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-7 div#item-6:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-7 div#item-6:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-7 div#item-6:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 13s !important;
}
.gallery.item-7 div#item-6:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-7 div#item-6:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 18s !important;
}
.gallery.item-7 div#item-6:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-7 div#item-6:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 23s !important;
}
.gallery.item-7 div#item-6:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-7 div#item-6:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 28s !important;
}
.gallery.item-7 div#item-6:target  ~ .banner-slides .item   {
    animation: galleryAnimation-7-target6 35s infinite;
}
.gallery.item-7 div#item-6:target ~  .controls-banner .control-button {
    animation: controlAnimation-7-target6  35s infinite;
}
/* set animation delay when click #item-7 */
.gallery.item-7 div#item-7:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-7 div#item-7:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: -2s !important;
}
.gallery.item-7 div#item-7:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-7 div#item-7:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-7 div#item-7:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-7 div#item-7:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-7 div#item-7:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-7 div#item-7:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 13s !important;
}
.gallery.item-7 div#item-7:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-7 div#item-7:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 18s !important;
}
.gallery.item-7 div#item-7:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-7 div#item-7:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 23s !important;
}
.gallery.item-7 div#item-7:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-7 div#item-7:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 28s !important;
}
.gallery.item-7 div#item-7:target  ~ .banner-slides .item   {
    animation: galleryAnimation-7-target7 35s infinite;
}
.gallery.item-7 div#item-7:target ~  .controls-banner .control-button {
    animation: controlAnimation-7-target7  35s infinite;
}

/************* BANNER HAVE 8 IMAGES *****************/

@-webkit-keyframes controlAnimation-8 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-o-keyframes controlAnimation-8 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-8 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-webkit-keyframes galleryAnimation-8 {
    0% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@-o-keyframes galleryAnimation-8 {
    0% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-8 {
    0% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-8   .controls-banner  .control-button {
    -webkit-animation: controlAnimation-8 40s infinite;
    -o-animation: controlAnimation-8  40s infinite;
    animation: controlAnimation-8 40s infinite;
}
.gallery.item-8  .banner-slides .item {
    -webkit-animation: galleryAnimation-8 40s infinite;
    -o-animation: galleryAnimation-8 40s infinite;
    animation: galleryAnimation-8 40s infinite;
}

/* click item  */

@keyframes controlAnimation-8-target  {
    0%,3.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-8-target2  {
    0%,3.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-8-target3  {
    0%,3.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-8-target4  {
    0%,3.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-8-target5  {
    0%,3.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-8-target6  {
    0%,3.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-8-target7  {
    0%,3.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-8-target8  {
    0%,3.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.6%, 12.5% {
        background: rgba(255, 255, 255, 1);
    }
    16.1%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes galleryAnimation-8-target{
    0%,3.6% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-8-target2{
    0%,3.6% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-8-target3{
    0%,3.6% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-8-target4{
    0%,3.6% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-8-target5{
    0%,3.6% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-8-target6{
    0%,3.6% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-8-target7{
    0%,3.6% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-8-target8{
    0%,3.6% {
        opacity: 0;
    }
    3.6%, 12.5% {
        opacity: 1;
        pointer-events: auto;
    }
    16.1%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-8 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-8-target 40s infinite;
}
.gallery.item-8 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-8-target  40s infinite;
}

/* set animation delay when click #item-2 */
.gallery.item-8 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-8 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-8 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-8 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-8 div#item-2:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-8 div#item-2:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 8s !important;
}
.gallery.item-8 div#item-2:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-8 div#item-2:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 13s !important;
}
.gallery.item-8 div#item-2:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-8 div#item-2:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 18s !important;
}
.gallery.item-8 div#item-2:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-8 div#item-2:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 23s !important;
}
.gallery.item-8 div#item-2:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-8 div#item-2:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 28s !important;
}
.gallery.item-8 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-8 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 33s !important;
}
.gallery.item-8  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-8-target2 40s infinite;
}
.gallery.item-8 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-8-target2  40s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-8 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-8 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-8 div#item-3:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-8 div#item-3:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 3s !important;
}
.gallery.item-8 div#item-3:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-8 div#item-3:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 8s !important;
}
.gallery.item-8 div#item-3:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-8 div#item-3:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 13s !important;
}
.gallery.item-8 div#item-3:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-8 div#item-3:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 18s !important;
}
.gallery.item-8 div#item-3:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-8 div#item-3:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 23s !important;
}
.gallery.item-8 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-8 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 28s !important;
}
.gallery.item-8 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-8 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 33s !important;
}
.gallery.item-8 div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-8-target3 40s infinite;
}
.gallery.item-8 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-8-target3  40s infinite;
}
/* set animation delay when click #item-4 */
.gallery.item-8 div#item-4:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-8 div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: -2s !important;
}
.gallery.item-8 div#item-4:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-8 div#item-4:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 3s !important;
}
.gallery.item-8 div#item-4:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-8 div#item-4:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 8s !important;
}
.gallery.item-8 div#item-4:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-8 div#item-4:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 13s !important;
}
.gallery.item-8 div#item-4:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-8 div#item-4:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 18s !important;
}
.gallery.item-8 div#item-4:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-8 div#item-4:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 23s !important;
}
.gallery.item-8 div#item-4:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-8 div#item-4:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 28s !important;
}
.gallery.item-8 div#item-4:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-8 div#item-4:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 33s !important;
}
.gallery.item-8  div#item-4:target  ~ .banner-slides .item   {
    animation: galleryAnimation-8-target4 40s infinite;
}
.gallery.item-8 div#item-4:target ~  .controls-banner .control-button {
    animation: controlAnimation-8-target4  40s infinite;
}
/* set animation delay when click #item-5 */
.gallery.item-8 div#item-5:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-8 div#item-5:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: -2s !important;
}
.gallery.item-8 div#item-5:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-8 div#item-5:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 3s !important;
}
.gallery.item-8 div#item-5:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-8 div#item-5:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 8s !important;
}
.gallery.item-8 div#item-5:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-8 div#item-5:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 13s !important;
}
.gallery.item-8 div#item-5:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-8 div#item-5:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 18s !important;
}
.gallery.item-8 div#item-5:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-8 div#item-5:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 23s !important;
}
.gallery.item-8 div#item-5:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-8 div#item-5:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 28s !important;
}
.gallery.item-8 div#item-5:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-8 div#item-5:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 33s !important;
}
.gallery.item-8  div#item-5:target  ~ .banner-slides .item   {
    animation: galleryAnimation-8-target5 40s infinite;
}
.gallery.item-8 div#item-5:target ~  .controls-banner .control-button {
    animation: controlAnimation-8-target5  40s infinite;
}
/* set animation delay when click #item-6 */
.gallery.item-8 div#item-6:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-8 div#item-6:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: -2s !important;
}
.gallery.item-8 div#item-6:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-8 div#item-6:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 3s !important;
}
.gallery.item-8 div#item-6:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-8 div#item-6:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 8s !important;
}
.gallery.item-8 div#item-6:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-8 div#item-6:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 13s !important;
}
.gallery.item-8 div#item-6:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-8 div#item-6:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 18s !important;
}
.gallery.item-8 div#item-6:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-8 div#item-6:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 23s !important;
}
.gallery.item-8 div#item-6:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-8 div#item-6:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 28s !important;
}
.gallery.item-8 div#item-6:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-8 div#item-6:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 33s !important;
}
.gallery.item-8 div#item-6:target  ~ .banner-slides .item   {
    animation: galleryAnimation-8-target6 40s infinite;
}
.gallery.item-8 div#item-6:target ~  .controls-banner .control-button {
    animation: controlAnimation-8-target6  40s infinite;
}
/* set animation delay when click #item-7 */
.gallery.item-8 div#item-7:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-8 div#item-7:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: -2s !important;
}
.gallery.item-8 div#item-7:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-8 div#item-7:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 3s !important;
}
.gallery.item-8 div#item-7:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-8 div#item-7:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-8 div#item-7:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-8 div#item-7:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 13s !important;
}
.gallery.item-8 div#item-7:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-8 div#item-7:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 18s !important;
}
.gallery.item-8 div#item-7:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-8 div#item-7:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 23s !important;
}
.gallery.item-8 div#item-7:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-8 div#item-7:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 28s !important;
}
.gallery.item-8 div#item-7:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-8 div#item-7:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 33s !important;
}
.gallery.item-8 div#item-7:target  ~ .banner-slides .item   {
    animation: galleryAnimation-8-target7 40s infinite;
}
.gallery.item-8 div#item-7:target ~  .controls-banner .control-button {
    animation: controlAnimation-8-target7  40s infinite;
}
/* set animation delay when click #item-8 */
.gallery.item-8 div#item-8:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-8 div#item-8:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: -2s !important;
}
.gallery.item-8 div#item-8:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-8 div#item-8:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-8 div#item-8:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-8 div#item-8:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-8 div#item-8:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-8 div#item-8:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 13s !important;
}
.gallery.item-8 div#item-8:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-8 div#item-8:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 18s !important;
}
.gallery.item-8 div#item-8:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-8 div#item-8:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 23s !important;
}
.gallery.item-8 div#item-8:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-8 div#item-8:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 28s !important;
}
.gallery.item-8 div#item-8:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-8 div#item-8:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 33s !important;
}
.gallery.item-8 div#item-8:target  ~ .banner-slides .item   {
    animation: galleryAnimation-8-target8 40s infinite;
}
.gallery.item-8 div#item-8:target ~  .controls-banner .control-button {
    animation: controlAnimation-8-target8  40s infinite;
}

/************* BANNER HAVE 9 IMAGES *****************/

@-webkit-keyframes controlAnimation-9 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-o-keyframes controlAnimation-9 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-9 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-webkit-keyframes galleryAnimation-9 {
    0% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@-o-keyframes galleryAnimation-9 {
    0% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-9 {
    0% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-9   .controls-banner  .control-button {
    -webkit-animation: controlAnimation-9 45s infinite;
    -o-animation: controlAnimation-9  45s infinite;
    animation: controlAnimation-9 45s infinite;
}
.gallery.item-9  .banner-slides .item {
    -webkit-animation: galleryAnimation-9 45s infinite;
    -o-animation: galleryAnimation-9 45s infinite;
    animation: galleryAnimation-9 45s infinite;
}

/* click item  */

@keyframes controlAnimation-9-target  {
    0%,3.17% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-9-target2  {
    0%,3.17% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-9-target3  {
    0%,3.17% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-9-target4  {
    0%,3.17% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-9-target5  {
    0%,3.17% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-9-target6  {
    0%,3.17% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-9-target7  {
    0%,3.17% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-9-target8  {
    0%,3.17% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-9-target9  {
    0%,3.17% {
        background: rgba(255, 255, 255, 0.5);
    }
    3.17%, 11.11% {
        background: rgba(255, 255, 255, 1);
    }
    14.28%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes galleryAnimation-9-target{
    0%,3.17% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-9-target2{
    0%,3.17% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-9-target3{
    0%,3.17% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-9-target4{
    0%,3.17% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-9-target5{
    0%,3.17% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-9-target6{
    0%,3.17% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-9-target7{
    0%,3.17% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-9-target8{
    0%,3.17% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-9-target9{
    0%,3.17% {
        opacity: 0;
    }
    3.17%, 11.11% {
        opacity: 1;
        pointer-events: auto;
    }
    14.28%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-9 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-9-target 45s infinite;
}
.gallery.item-9 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-9-target  45s infinite;
}

/* set animation delay when click #item-2 */
.gallery.item-9 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-9 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-9 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-9 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-9 div#item-2:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-9 div#item-2:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 8s !important;
}
.gallery.item-9 div#item-2:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-9 div#item-2:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 13s !important;
}
.gallery.item-9 div#item-2:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-9 div#item-2:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 18s !important;
}
.gallery.item-9 div#item-2:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-9 div#item-2:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 23s !important;
}
.gallery.item-9 div#item-2:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-9 div#item-2:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 28s !important;
}
.gallery.item-9 div#item-2:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-9 div#item-2:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 33s !important;
}
.gallery.item-9 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-9 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 38s !important;
}
.gallery.item-9  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-9-target2 45s infinite;
}
.gallery.item-9 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-9-target2  45s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-9 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-9 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-9 div#item-3:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-9 div#item-3:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 3s !important;
}
.gallery.item-9 div#item-3:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-9 div#item-3:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 8s !important;
}
.gallery.item-9 div#item-3:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-9 div#item-3:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 13s !important;
}
.gallery.item-9 div#item-3:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-9 div#item-3:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 18s !important;
}
.gallery.item-9 div#item-3:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-9 div#item-3:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 23s !important;
}
.gallery.item-9 div#item-3:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-9 div#item-3:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 28s !important;
}
.gallery.item-9 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-9 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 33s !important;
}
.gallery.item-9 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-9 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 38s !important;
}
.gallery.item-9 div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-9-target3 45s infinite;
}
.gallery.item-9 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-9-target3  45s infinite;
}
/* set animation delay when click #item-4 */
.gallery.item-9 div#item-4:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-9 div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: -2s !important;
}
.gallery.item-9 div#item-4:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-9 div#item-4:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 3s !important;
}
.gallery.item-9 div#item-4:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-9 div#item-4:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 8s !important;
}
.gallery.item-9 div#item-4:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-9 div#item-4:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 13s !important;
}
.gallery.item-9 div#item-4:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-9 div#item-4:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 18s !important;
}
.gallery.item-9 div#item-4:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-9 div#item-4:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 23s !important;
}
.gallery.item-9 div#item-4:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-9 div#item-4:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 28s !important;
}
.gallery.item-9 div#item-4:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-9 div#item-4:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 33s !important;
}
.gallery.item-9 div#item-4:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-9 div#item-4:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 38s !important;
}
.gallery.item-9  div#item-4:target  ~ .banner-slides .item   {
    animation: galleryAnimation-9-target4 45s infinite;
}
.gallery.item-9 div#item-4:target ~  .controls-banner .control-button {
    animation: controlAnimation-9-target4  45s infinite;
}
/* set animation delay when click #item-5 */
.gallery.item-9 div#item-5:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-9 div#item-5:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: -2s !important;
}
.gallery.item-9 div#item-5:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-9 div#item-5:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 3s !important;
}
.gallery.item-9 div#item-5:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-9 div#item-5:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 8s !important;
}
.gallery.item-9 div#item-5:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-9 div#item-5:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 13s !important;
}
.gallery.item-9 div#item-5:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-9 div#item-5:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 18s !important;
}
.gallery.item-9 div#item-5:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-9 div#item-5:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 23s !important;
}
.gallery.item-9 div#item-5:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-9 div#item-5:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 28s !important;
}
.gallery.item-9 div#item-5:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-9 div#item-5:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 33s !important;
}
.gallery.item-9 div#item-5:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-9 div#item-5:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 38s !important;
}
.gallery.item-9  div#item-5:target  ~ .banner-slides .item   {
    animation: galleryAnimation-9-target5 45s infinite;
}
.gallery.item-9 div#item-5:target ~  .controls-banner .control-button {
    animation: controlAnimation-9-target5  45s infinite;
}
/* set animation delay when click #item-6 */
.gallery.item-9 div#item-6:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-9 div#item-6:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: -2s !important;
}
.gallery.item-9 div#item-6:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-9 div#item-6:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 3s !important;
}
.gallery.item-9 div#item-6:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-9 div#item-6:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 8s !important;
}
.gallery.item-9 div#item-6:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-9 div#item-6:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 13s !important;
}
.gallery.item-9 div#item-6:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-9 div#item-6:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 18s !important;
}
.gallery.item-9 div#item-6:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-9 div#item-6:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 23s !important;
}
.gallery.item-9 div#item-6:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-9 div#item-6:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 28s !important;
}
.gallery.item-9 div#item-6:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-9 div#item-6:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 33s !important;
}
.gallery.item-9 div#item-6:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-9 div#item-6:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 38s !important;
}
.gallery.item-9 div#item-6:target  ~ .banner-slides .item   {
    animation: galleryAnimation-9-target6 45s infinite;
}
.gallery.item-9 div#item-6:target ~  .controls-banner .control-button {
    animation: controlAnimation-9-target6  45s infinite;
}
/* set animation delay when click #item-7 */
.gallery.item-9 div#item-7:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-9 div#item-7:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: -2s !important;
}
.gallery.item-9 div#item-7:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-9 div#item-7:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 3s !important;
}
.gallery.item-9 div#item-7:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-9 div#item-7:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 8s !important;
}
.gallery.item-9 div#item-7:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-9 div#item-7:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 13s !important;
}
.gallery.item-9 div#item-7:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-9 div#item-7:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 18s !important;
}
.gallery.item-9 div#item-7:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-9 div#item-7:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 23s !important;
}
.gallery.item-9 div#item-7:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-9 div#item-7:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 28s !important;
}
.gallery.item-9 div#item-7:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-9 div#item-7:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 33s !important;
}
.gallery.item-9 div#item-7:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-9 div#item-7:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 38s !important;
}
.gallery.item-9 div#item-7:target  ~ .banner-slides .item   {
    animation: galleryAnimation-9-target7 45s infinite;
}
.gallery.item-9 div#item-7:target ~  .controls-banner .control-button {
    animation: controlAnimation-9-target7  45s infinite;
}
/* set animation delay when click #item-8 */
.gallery.item-9 div#item-8:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-9 div#item-8:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: -2s !important;
}
.gallery.item-9 div#item-8:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-9 div#item-8:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 3s !important;
}
.gallery.item-9 div#item-8:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-9 div#item-8:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-9 div#item-8:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-9 div#item-8:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 13s !important;
}
.gallery.item-9 div#item-8:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-9 div#item-8:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 18s !important;
}
.gallery.item-9 div#item-8:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-9 div#item-8:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 23s !important;
}
.gallery.item-9 div#item-8:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-9 div#item-8:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 28s !important;
}
.gallery.item-9 div#item-8:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-9 div#item-8:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 33s !important;
}
.gallery.item-9 div#item-8:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-9 div#item-8:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 38s !important;
}
.gallery.item-9 div#item-8:target  ~ .banner-slides .item   {
    animation: galleryAnimation-9-target8 45s infinite;
}
.gallery.item-9 div#item-8:target ~  .controls-banner .control-button {
    animation: controlAnimation-9-target8  45s infinite;
}
/* set animation delay when click #item-9 */
.gallery.item-9 div#item-9:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-9 div#item-9:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: -2s !important;
}
.gallery.item-9 div#item-9:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-9 div#item-9:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-9 div#item-9:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-9 div#item-9:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-9 div#item-9:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-9 div#item-9:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 13s !important;
}
.gallery.item-9 div#item-9:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-9 div#item-9:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 18s !important;
}
.gallery.item-9 div#item-9:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-9 div#item-9:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 23s !important;
}
.gallery.item-9 div#item-9:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-9 div#item-9:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 28s !important;
}
.gallery.item-9 div#item-9:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-9 div#item-9:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 33s !important;
}
.gallery.item-9 div#item-9:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-9 div#item-9:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 38s !important;
}
.gallery.item-9 div#item-9:target  ~ .banner-slides .item   {
    animation: galleryAnimation-9-target9 45s infinite;
}
.gallery.item-9 div#item-9:target ~  .controls-banner .control-button {
    animation: controlAnimation-9-target9  45s infinite;
}

/************* BANNER HAVE 10 IMAGES *****************/

@-webkit-keyframes controlAnimation-10 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-o-keyframes controlAnimation-10 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-10 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-webkit-keyframes galleryAnimation-10 {
    0% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@-o-keyframes galleryAnimation-10 {
    0% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10 {
    0% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-10   .controls-banner  .control-button {
    -webkit-animation: controlAnimation-10 50s infinite;
    -o-animation: controlAnimation-10  50s infinite;
    animation: controlAnimation-10 50s infinite;
}
.gallery.item-10  .banner-slides .item {
    -webkit-animation: galleryAnimation-10 50s infinite;
    -o-animation: galleryAnimation-10 50s infinite;
    animation: galleryAnimation-10 50s infinite;
}

/* click item  */

@keyframes controlAnimation-10-target  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-10-target2  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-10-target3  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-10-target4  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-10-target5  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-10-target6  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-10-target7  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-10-target8  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-10-target9  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes controlAnimation-10-target10  {
    0%,2.85% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.85%, 10% {
        background: rgba(255, 255, 255, 1);
    }
    12.85%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes galleryAnimation-10-target{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10-target2{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10-target3{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10-target4{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10-target5{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10-target6{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10-target7{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10-target8{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10-target9{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-10-target10{
    0%,2.85% {
        opacity: 0;
    }
    2.85%, 10% {
        opacity: 1;
        pointer-events: auto;
    }
    12.85%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-10 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-10-target 50s infinite;
}
.gallery.item-10 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target  50s infinite;
}

/* set animation delay when click #item-2 */
.gallery.item-10 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-10 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-10 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-10 div#item-2:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 8s !important;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-10 div#item-2:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 13s !important;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-10 div#item-2:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 18s !important;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-10 div#item-2:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 23s !important;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-10 div#item-2:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 28s !important;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-10 div#item-2:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 33s !important;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-10 div#item-2:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 38s !important;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-10 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 43s !important;
}
.gallery.item-10  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-10-target2 50s infinite;
}
.gallery.item-10 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target2  50s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-10 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-10 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-10 div#item-3:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 3s !important;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-10 div#item-3:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 8s !important;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-10 div#item-3:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 13s !important;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-10 div#item-3:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 18s !important;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-10 div#item-3:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 23s !important;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-10 div#item-3:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 28s !important;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-10 div#item-3:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 33s !important;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-10 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 38s !important;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-10 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 43s !important;
}
.gallery.item-10 div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-10-target3 50s infinite;
}
.gallery.item-10 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target3  50s infinite;
}
/* set animation delay when click #item-4 */
.gallery.item-10 div#item-4:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-10 div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: -2s !important;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-10 div#item-4:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 3s !important;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-10 div#item-4:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 8s !important;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-10 div#item-4:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 13s !important;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-10 div#item-4:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 18s !important;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-10 div#item-4:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 23s !important;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-10 div#item-4:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 28s !important;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-10 div#item-4:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 33s !important;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-10 div#item-4:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 38s !important;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-10 div#item-4:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 43s !important;
}
.gallery.item-10  div#item-4:target  ~ .banner-slides .item   {
    animation: galleryAnimation-10-target4 50s infinite;
}
.gallery.item-10 div#item-4:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target4  50s infinite;
}
/* set animation delay when click #item-5 */
.gallery.item-10 div#item-5:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-10 div#item-5:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: -2s !important;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-10 div#item-5:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 3s !important;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-10 div#item-5:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 8s !important;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-10 div#item-5:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 13s !important;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-10 div#item-5:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 18s !important;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-10 div#item-5:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 23s !important;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-10 div#item-5:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 28s !important;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-10 div#item-5:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 33s !important;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-10 div#item-5:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 38s !important;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-10 div#item-5:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 43s !important;
}
.gallery.item-10  div#item-5:target  ~ .banner-slides .item   {
    animation: galleryAnimation-10-target5 50s infinite;
}
.gallery.item-10 div#item-5:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target5  50s infinite;
}
/* set animation delay when click #item-6 */
.gallery.item-10 div#item-6:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-10 div#item-6:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: -2s !important;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-10 div#item-6:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 3s !important;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-10 div#item-6:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 8s !important;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-10 div#item-6:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 13s !important;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-10 div#item-6:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 18s !important;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-10 div#item-6:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 23s !important;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-10 div#item-6:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 28s !important;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-10 div#item-6:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 33s !important;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-10 div#item-6:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 38s !important;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-10 div#item-6:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 43s !important;
}
.gallery.item-10 div#item-6:target  ~ .banner-slides .item   {
    animation: galleryAnimation-10-target6 50s infinite;
}
.gallery.item-10 div#item-6:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target6  50s infinite;
}
/* set animation delay when click #item-7 */
.gallery.item-10 div#item-7:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-10 div#item-7:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: -2s !important;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-10 div#item-7:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 3s !important;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-10 div#item-7:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 8s !important;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-10 div#item-7:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 13s !important;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-10 div#item-7:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 18s !important;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-10 div#item-7:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 23s !important;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-10 div#item-7:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 28s !important;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-10 div#item-7:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 33s !important;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-10 div#item-7:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 38s !important;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-10 div#item-7:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 43s !important;
}
.gallery.item-10 div#item-7:target  ~ .banner-slides .item   {
    animation: galleryAnimation-10-target7 50s infinite;
}
.gallery.item-10 div#item-7:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target7  50s infinite;
}
/* set animation delay when click #item-8 */
.gallery.item-10 div#item-8:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-10 div#item-8:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: -2s !important;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-10 div#item-8:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 3s !important;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-10 div#item-8:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 8s !important;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-10 div#item-8:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 13s !important;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-10 div#item-8:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 18s !important;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-10 div#item-8:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 23s !important;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-10 div#item-8:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 28s !important;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-10 div#item-8:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 33s !important;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-10 div#item-8:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 38s !important;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-10 div#item-8:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 43s !important;
}
.gallery.item-10 div#item-8:target  ~ .banner-slides .item   {
    animation: galleryAnimation-10-target8 50s infinite;
}
.gallery.item-10 div#item-8:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target8  50s infinite;
}
/* set animation delay when click #item-9 */
.gallery.item-10 div#item-9:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-10 div#item-9:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: -2s !important;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-10 div#item-9:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 3s !important;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-10 div#item-9:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-10 div#item-9:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 13s !important;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-10 div#item-9:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 18s !important;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-10 div#item-9:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 23s !important;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-10 div#item-9:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 28s !important;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-10 div#item-9:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 33s !important;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-10 div#item-9:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 38s !important;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-10 div#item-9:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 43s !important;
}
.gallery.item-10 div#item-9:target  ~ .banner-slides .item   {
    animation: galleryAnimation-10-target9 50s infinite;
}
.gallery.item-10 div#item-9:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target9  50s infinite;
}
/* set animation delay when click #item-10 */
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(10),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(10) {
    animation-delay: -2s !important;
}
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(1),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: 13s !important;
}
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: 18s !important;
}
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: 23s !important;
}
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: 28s !important;
}
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: 33s !important;
}
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: 38s !important;
}
.gallery.item-10 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-10 div#item-10:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: 43s !important;
}
.gallery.item-10 div#item-10:target  ~ .banner-slides .item   {
    animation: galleryAnimation-10-target10 50s infinite;
}
.gallery.item-10 div#item-10:target ~  .controls-banner .control-button {
    animation: controlAnimation-10-target10  50s infinite;
}

/************* BANNER HAVE 11 IMAGES *****************/

@-webkit-keyframes controlAnimation-11 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-o-keyframes controlAnimation-11 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-webkit-keyframes galleryAnimation-11 {
    0% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@-o-keyframes galleryAnimation-11 {
    0% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11 {
    0% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-11   .controls-banner  .control-button {
    -webkit-animation: controlAnimation-11 55s infinite;
    -o-animation: controlAnimation-11  55s infinite;
    animation: controlAnimation-11 55s infinite;
}
.gallery.item-11  .banner-slides .item {
    -webkit-animation: galleryAnimation-11 55s infinite;
    -o-animation: galleryAnimation-11 55s infinite;
    animation: galleryAnimation-11 55s infinite;
}

/* click item  */

@keyframes controlAnimation-11-target  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target2  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target3  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target4  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target5  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target6  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target7  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target8  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target9  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target10  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-11-target11  {
    0%,2.6% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.6%, 9.1% {
        background: rgba(255, 255, 255, 1);
    }
    11.7%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes galleryAnimation-11-target{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target2{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target3{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target4{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target5{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target6{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target7{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target8{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target9{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target10{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-11-target11{
    0%,2.6% {
        opacity: 0;
    }
    2.6%, 9.1% {
        opacity: 1;
        pointer-events: auto;
    }
    11.7%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-11 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-11-target 55s infinite;
}
.gallery.item-11 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target  55s infinite;
}

/* set animation delay when click #item-2 */
.gallery.item-11 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-11 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-11 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 48s !important;
}
.gallery.item-11  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target2 55s infinite;
}
.gallery.item-11 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target2  55s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-11 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-11 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-11 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 48s !important;
}
.gallery.item-11 div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target3 55s infinite;
}
.gallery.item-11 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target3  55s infinite;
}
/* set animation delay when click #item-4 */
.gallery.item-11 div#item-4:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-11 div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-11 div#item-4:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 48s !important;
}
.gallery.item-11  div#item-4:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target4 55s infinite;
}
.gallery.item-11 div#item-4:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target4  55s infinite;
}
/* set animation delay when click #item-5 */
.gallery.item-11 div#item-5:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-11 div#item-5:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-11 div#item-5:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 48s !important;
}
.gallery.item-11  div#item-5:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target5 55s infinite;
}
.gallery.item-11 div#item-5:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target5  55s infinite;
}
/* set animation delay when click #item-6 */
.gallery.item-11 div#item-6:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-11 div#item-6:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-11 div#item-6:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 48s !important;
}
.gallery.item-11 div#item-6:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target6 55s infinite;
}
.gallery.item-11 div#item-6:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target6  55s infinite;
}
/* set animation delay when click #item-7 */
.gallery.item-11 div#item-7:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-11 div#item-7:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-11 div#item-7:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 48s !important;
}
.gallery.item-11 div#item-7:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target7 55s infinite;
}
.gallery.item-11 div#item-7:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target7  55s infinite;
}
/* set animation delay when click #item-8 */
.gallery.item-11 div#item-8:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-11 div#item-8:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-11 div#item-8:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 48s !important;
}
.gallery.item-11 div#item-8:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target8 55s infinite;
}
.gallery.item-11 div#item-8:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target8  55s infinite;
}
/* set animation delay when click #item-9 */
.gallery.item-11 div#item-9:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-11 div#item-9:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-11 div#item-9:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 48s !important;
}
.gallery.item-11 div#item-9:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target9 55s infinite;
}
.gallery.item-11 div#item-9:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target9  55s infinite;
}
/* set animation delay when click #item-10 */
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(10),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(10) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(11),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(11) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(1),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-11 div#item-10:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: 48s !important;
}
.gallery.item-11 div#item-10:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target10 55s infinite;
}
.gallery.item-11 div#item-10:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target10  55s infinite;
}
/* set animation delay when click #item-11 */
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(11),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(11) {
    animation-delay: -2s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(1),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: 13s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: 18s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: 23s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: 28s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: 33s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: 38s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: 43s !important;
}
.gallery.item-11 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(10),
.gallery.item-11 div#item-11:target ~ .banner-slides .item:nth-of-type(10) {
    animation-delay: 48s !important;
}
.gallery.item-11 div#item-11:target  ~ .banner-slides .item   {
    animation: galleryAnimation-11-target11 55s infinite;
}
.gallery.item-11 div#item-11:target ~  .controls-banner .control-button {
    animation: controlAnimation-11-target11  55s infinite;
}



/************* BANNER HAVE 12 IMAGES *****************/

@-webkit-keyframes controlAnimation-12 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-o-keyframes controlAnimation-12 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12 {
    0% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@-webkit-keyframes galleryAnimation-12 {
    0% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@-o-keyframes galleryAnimation-12 {
    0% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12 {
    0% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-12   .controls-banner  .control-button {
    -webkit-animation: controlAnimation-12 60s infinite;
    -o-animation: controlAnimation-12  60s infinite;
    animation: controlAnimation-12 60s infinite;
}
.gallery.item-12  .banner-slides .item {
    -webkit-animation: galleryAnimation-12 60s infinite;
    -o-animation: galleryAnimation-12 60s infinite;
    animation: galleryAnimation-12 60s infinite;
}

/* click item  */

@keyframes controlAnimation-12-target  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target2  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target3  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target4  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target5  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target6  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target7  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target8  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target9  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target10  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target11  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}
@keyframes controlAnimation-12-target12  {
    0%,2.37% {
        background: rgba(255, 255, 255, 0.5);
    }
    2.37%, 8.3% {
        background: rgba(255, 255, 255, 1);
    }
    10.67%, 100% {
        background: rgba(255, 255, 255, 0.5);
    }
}

@keyframes galleryAnimation-12-target{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12-target2{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12-target3{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12-target4{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12-target5{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        pointer-events: none;
        opacity: 0;
    }
}
@keyframes galleryAnimation-12-target6{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12-target7{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12-target8{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12-target9{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12-target10{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
    }
}
@keyframes galleryAnimation-12-target11{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
@keyframes galleryAnimation-12-target12{
    0%,2.37% {
        opacity: 0;
    }
    2.37%, 8.3% {
        opacity: 1;
        pointer-events: auto;
    }
    10.67%, 100% {
        opacity: 0;
        pointer-events: none;
    }
}
.gallery.item-12 div#item-1:target ~ .banner-slides .item  {
    animation: galleryAnimation-12-target 60s infinite;
}
.gallery.item-12 div#item-1:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target  60s infinite;
}

/* set animation delay when click #item-2 */
.gallery.item-12 div#item-2:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-12 div#item-2:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(12),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(12) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-12 div#item-2:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 53s !important;
}
.gallery.item-12  div#item-2:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target2 60s infinite;
}
.gallery.item-12 div#item-2:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target2  60s infinite;
}

/* set animation delay when click #item-3 */
.gallery.item-12 div#item-3:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-12 div#item-3:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(12),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(12) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-12 div#item-3:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 53s !important;
}
.gallery.item-12 div#item-3:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target3 60s infinite;
}
.gallery.item-12 div#item-3:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target3  60s infinite;
}
/* set animation delay when click #item-4 */
.gallery.item-12 div#item-4:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-12 div#item-4:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(12),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(12) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-12 div#item-4:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 53s !important;
}
.gallery.item-12  div#item-4:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target4 60s infinite;
}
.gallery.item-12 div#item-4:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target4  60s infinite;
}
/* set animation delay when click #item-5 */
.gallery.item-12 div#item-5:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-12 div#item-5:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(12),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(12) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-12 div#item-5:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 53s !important;
}
.gallery.item-12  div#item-5:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target5 60s infinite;
}
.gallery.item-12 div#item-5:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target5  60s infinite;
}
/* set animation delay when click #item-6 */
.gallery.item-12 div#item-6:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-12 div#item-6:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(12),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(12) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-12 div#item-6:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 53s !important;
}
.gallery.item-12 div#item-6:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target6 60s infinite;
}
.gallery.item-12 div#item-6:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target6  60s infinite;
}
/* set animation delay when click #item-7 */
.gallery.item-12 div#item-7:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-12 div#item-7:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(12),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(12) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-12 div#item-7:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 53s !important;
}
.gallery.item-12 div#item-7:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target7 60s infinite;
}
.gallery.item-12 div#item-7:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target7  60s infinite;
}
/* set animation delay when click #item-8 */
.gallery.item-12 div#item-8:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-12 div#item-8:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(9),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(9) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(12),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(12) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-12 div#item-8:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 53s !important;
}
.gallery.item-12 div#item-8:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target8 60s infinite;
}
.gallery.item-12 div#item-8:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target8  60s infinite;
}
/* set animation delay when click #item-9 */
.gallery.item-12 div#item-9:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-12 div#item-9:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(10),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(10) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(11),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(11) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(12),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(12) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(1),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(1) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(2),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(2) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(3),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(3) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(4),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(4) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(5),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(5) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(6),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(6) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(7),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(7) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button:nth-of-type(8),
.gallery.item-12 div#item-9:target ~  .banner-slides .item:nth-of-type(8) {
    animation-delay: 53s !important;
}
.gallery.item-12 div#item-9:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target9 60s infinite;
}
.gallery.item-12 div#item-9:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target9  60s infinite;
}
/* set animation delay when click #item-10 */
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(10),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(10) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(11),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(11) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(12),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(12) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(1),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(1) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-10:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-12 div#item-10:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: 53s !important;
}
.gallery.item-12 div#item-10:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target10 60s infinite;
}
.gallery.item-12 div#item-10:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target10  60s infinite;
}
/* set animation delay when click #item-11 */
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(11),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(11) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(12),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(12) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(1),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(1) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-11:target ~ .controls-banner  .control-button:nth-of-type(10),
.gallery.item-12 div#item-11:target ~ .banner-slides .item:nth-of-type(10) {
    animation-delay: 53s !important;
}
.gallery.item-12 div#item-11:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target11 60s infinite;
}
.gallery.item-12 div#item-11:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target11  60s infinite;
}
/* set animation delay when click #item-12 */
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(12),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(12) {
    animation-delay: -2s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(1),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(1) {
    animation-delay: 3s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(2),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(2) {
    animation-delay: 8s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(3),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(3) {
    animation-delay: 13s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(4),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(4) {
    animation-delay: 18s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(5),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(5) {
    animation-delay: 23s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(6),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(6) {
    animation-delay: 28s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(7),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(7) {
    animation-delay: 33s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(8),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(8) {
    animation-delay: 38s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(9),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(9) {
    animation-delay: 43s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(10),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(10) {
    animation-delay: 48s !important;
}
.gallery.item-12 div#item-12:target ~ .controls-banner  .control-button:nth-of-type(11),
.gallery.item-12 div#item-12:target ~ .banner-slides .item:nth-of-type(11) {
    animation-delay: 53s !important;
}
.gallery.item-12 div#item-12:target  ~ .banner-slides .item   {
    animation: galleryAnimation-12-target12 60s infinite;
}
.gallery.item-12 div#item-12:target ~  .controls-banner .control-button {
    animation: controlAnimation-12-target12  60s infinite;
}


@media (max-width: 767px){
    .gallery .controls-banner{bottom: 9px}
    .gallery .controls-banner .control-button{width: 8px; height: 8px; margin: 0 1px; background-size: 100% !important}
}
@media (max-width: 639px){
    .gallery .controls-banner{bottom: 9px}
    .gallery .controls-banner .control-button{width: 5px; height: 5px; margin: 0 1px; background-size: 100% !important}
}