.cccSection{min-height:600px}

.cccSection .textPic{position:relative}

#page .cccSection .galWrap{position:absolute;top:100px;left:0;z-index:0;margin:0 auto;width:70rem!important}
#page .cccSection .galWrap .imgRow{margin-right:55%;width:45%;height:100%;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-flex-direction:column;flex-direction:column;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;align-items:center}
#page .cccSection .galWrap .imgCol{display:inline-block}
#page .cccSection .galWrap img{margin:0!important}

.cccSection .txtWrap{position:relative;z-index:1;padding-left:0!important;width:100%!important}

.cccItem .cccText{display:none;width:48%}
.cccItem.act .cccText{display:inline-block}
.cccItem .cccText .textBox{padding-bottom:30px}

.cccItem .cccImage{display:inline-block;width:48%}
.cccItem .cccImage picture{position:absolute;z-index:6;background-color:#fff;border:2px solid transparent;cursor:pointer;-webkit-transition:all .4s;transition:all .4s}
.cccItem .cccImage picture.rounded{-webkit-border-radius:50%;border-radius:50%}
.cccItem.inact .cccImage picture{background-color:#fff!important}
.cccItem.inact .cccImage picture:hover{-webkit-opacity:.6;opacity:.6}
.cccItem:nth-child(1) .cccImage picture{top:310px;left:-4px}
.cccItem:nth-child(2) .cccImage picture{top:62px;left:7px}
.cccItem:nth-child(3) .cccImage picture{top:50px;left:390px}
.cccItem:nth-child(4) .cccImage picture{top:245px;left:405px}
.cccItem:nth-child(5) .cccImage picture{top:355px;left:310px}
.cccItem.inact .cccImage picture:nth-child(1){display:none}
.cccItem.act .cccImage picture:nth-child(2){display:none}
.cccItem .cccImage picture img{width:60%!important;height:auto}

.cccWrap.animated .cccItem.inact .cccImage picture::before{content:'';position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;-webkit-border-radius:50%;border-radius:50%;animation:ringPulse 2.5s ease-out infinite}
.cccWrap.animated .cccItem.inact .cccImage picture:hover{-webkit-transition:all .4s;transition:all .4s}
.cccWrap.animated .cccItem.inact .cccImage picture{animation:popPulse 1s infinite;animation-delay:0s;animation-direction:normal;animation-delay:1.5s;animation-direction:alternate-reverse}
		
@keyframes ringPulse {
    0% {
        transform: scale(1);
        opacity: 0.6;
        }
    100% {
        transform: scale(1.8);
        opacity: 0;
        }
    }
@keyframes popPulse {
    0% {
        transform: scale(1);
        }
    50% {
        transform: scale(1.05);
        }
    100% {
        transform: scale(1);
        }
    }


/* --- OLD --- */


.clickChange{position:relative}

.clickChange .bodyWrap{height:100%}

.clickChange .galWrap{display:inline-block;position:relative;width:45%;height:500px;background-size:auto;background-position:center center;background-repeat:no-repeat;-webkit-transition:all .4s;transition:all .4s}

.clickChange .txtWrap{display:none;position:relative;z-index:5;width:48%;height:100%}
.clickChange .txtWrap.cur{display:inline-block}
.clickChange .txtWrap.flexCol.cur{display:-moz-box!important;display:-webkit-box!important;display:-webkit-flex!important;display:-ms-flexbox!important;display:flex!important}

.clickChange .txtWrap .hGroup::after{display:none!important}

.clickChange .txtWrap .buttonBox .btn{text-align:center}
.clickChange .txtWrap .buttonBox .btn a{font-size:var(--font-size-l);font-weight:normal;font-family:regular,arial,helvetica,awesome5,awesome5b,awesome5l,awesome5s,microns,icofont,sans-serif}
.clickChange .txtWrap .buttonBox .btn i{position:relative;top:2px;margin:0 0 0 10px}
.clickChange .txtWrap .buttonBox .btn.btnDefault a {font-size:var(--font-size-m)}
.clickChange .txtWrap .buttonBox .btn.btnSmall a {font-size:var(--font-size-s)}


/* ---- BUBBLES --- */

.clickChange.bubbleType .galWrap div.cccPic{display:block;position:absolute;z-index:6;-webkit-border-radius:50%;border-radius:50%;border:2px solid;cursor:pointer;-webkit-transition:all .4s;transition:all .4s}
.clickChange.bubbleType .galWrap div.cccPic:nth-child(1){bottom:70px;left:10px;width:120px;height:120px}
.clickChange.bubbleType .galWrap div.cccPic:nth-child(2){top:75px;left:20px;width:95px;height:95px}
.clickChange.bubbleType .galWrap div.cccPic:nth-child(3){top:65px;right:20px;width:105px;height:105px}
.clickChange.bubbleType .galWrap div.cccPic:nth-child(4){top:245px;right:25px;width:85px;height:85px}
.clickChange.bubbleType .galWrap div.cccPic:nth-child(5){bottom:85px;right:135px;width:65px;height:65px}
.clickChange.bubbleType .galWrap div.cccPic.inact{background-color:#fff!important}

.clickChange.bubbleType .galWrap div.cccPic.cur{-webkit-transform:scale(1.1);transform:scale(1.1);-webkit-transition:all .4s;transition:all .4s;animation:none!important}

.clickChange.bubbleType .galWrap div.cccPic::before{content:'';position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;-webkit-border-radius:50%;border-radius:50%}
.clickChange.bubbleType .galWrap div.cccPic.cur::before{display:none!important}

.clickChange.bubbleType .galWrap div.cccPic img{position:absolute;z-index:7;top:20%;left:20%;width:60%!important;height:60%!important;-webkit-transition:all .4s;transition:all .4s}
.clickChange.bubbleType .galWrap div.cccPic:hover img:nth-child(1),.clickChange.bubbleType .galWrap div.cccPic img:nth-child(2),.clickChange.bubbleType .galWrap div.cccPic.cur img{-webkit-opacity:0;opacity:0}
.clickChange.bubbleType .galWrap div.cccPic:hover img:first-child + img,.clickChange.bubbleType .galWrap div.cccPic.cur img + img{display:block;-webkit-opacity:1;opacity:1}


/* --- SQUARES --- */

.clickChange.squareType .galWrap div.cccPic{display:block;position:absolute;z-index:6;width:170px;height:auto;cursor:pointer;-webkit-transition:all .4s;transition:all .4s}
.clickChange.squareType .galWrap div.cccPic:nth-child(1){bottom:70%;left:-100px}
.clickChange.squareType .galWrap div.cccPic:nth-child(1) img{box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);}
.clickChange.squareType .galWrap div.cccPic:nth-child(2){bottom:32%;right:-10px}
.clickChange.squareType .galWrap div.cccPic:nth-child(2) img{box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);}
.clickChange.squareType .galWrap div.cccPic:nth-child(3){bottom:25%;left:0}
.clickChange.squareType .galWrap div.cccPic:nth-child(3) img{box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);}

.clickChange.squareType .galWrap div.cccPic img{position:absolute;z-index:7;top:20%;left:20%;padding:10px 20px;width:100%!important;height:auto!important;background-color:#fff;-webkit-border-radius:10px;border-radius:10px;-webkit-transition:all .4s;transition:all .4s}
