.cps-horizontal-scroller-option{
   min-width:150px;
   position:absolute;
   display:flex;
   justify-content:center;
   transition:0.7s ease-in-out;
   opacity:60%;


}

.scroller-button-direct{
   background:rgba(255,255,255,0.6);
   border-radius:50% 50%;
   width:15px;
   height:15px;
   cursor:pointer;
   transition:0.2s;
   margin-left:3px;
   margin-right:3px;
}

.scroller-button-direct:hover{
   background:rgba(255,255,255,0.9);
}

.scroller-button-direct-selected{
   background:rgba(255,255,255,1);
}

.cps-scroller-selection-option{
   opacity:100%;
}

.cps-horizontal-scroller-option-inner{
   max-width:450px;
   border-radius:50% 50%;
   background: rgb(61,117,191);
   background: linear-gradient(225deg, rgba(61,117,191,1) 0%, rgba(137,204,212,1) 100%);
   box-shadow: 3px 3px 4px 0px rgba(0,0,0,0.67);
   -webkit-box-shadow: 3px 3px 4px 0px rgba(0,0,0,0.67);
   -moz-box-shadow: 3px 3px 4px 0px rgba(0,0,0,0.67);

   transition:0.7s ease-in-out;

}

.cps-horizontal-scroller-option-inner-content{
   /*border-radius:50% 50%;*/
   clip-path: ellipse(50% 50% at 50% 50%);
   padding: 20px;
   text-align:center;

   /*

   */
}

.cps-horizontal-scroller-option .inner-content{
  
   opacity:0;
   
}

.cps-horizontal-scroller-option .inner-content-display{
   opacity:1;
   color:#fff; 
   transition:0.8s;
}

.cps-scroller-selection-option .header{
   color:#fff; 
   font-size:2.2em; 
   text-align:bold;

}



.cps-scroller-selection-option .content{
   color:#fff; 
   font-size:1.2em; 
   
}

.cps-horiz-scroll{
   display:none !important;
}


.cps-scroller-append-outer{
   position:absolute;
   width:100%;
   display:block;
}






@media (max-width: 1100px) {
   .cps-scroller-selection-option .header{
      color:#fff; 
      font-size:2em; 
      text-align:bold;
   }

   .cps-scroller-selection-option .content{
      color:#fff; 
      font-size:1em; 
   }
}

@media (max-width: 1000px) {
   .cps-scroller-selection-option .header{
      color:#fff; 
      font-size:1.85em; 
      text-align:bold;
   }

   .cps-scroller-selection-option .content{
      color:#fff; 
      font-size:0.95em; 
   }
}

@media (max-width: 950px) {
   .cps-scroller-selection-option .header{
      color:#fff; 
      font-size:1.75em; 
      text-align:bold;
   }

   .cps-scroller-selection-option .content{
      color:#fff; 
      font-size:0.85em; 
   }
}

@media (max-width: 870px) {
   .cps-scroller-selection-option .header{
      color:#fff; 
      font-size:1.65em; 
      text-align:bold;
   }

   .cps-scroller-selection-option .content{
      color:#fff; 
      font-size:0.75em; 
   }
}

@media (max-width: 820px) {
   .cps-scroller-selection-option .header{
      color:#fff; 
      font-size:1.4em; 
      text-align:bold;
   }

   .cps-scroller-selection-option .content{
      color:#fff; 
      font-size:0.78em; 
   }
}

@media (max-width: 767px) {
   .cps-horizontal-scroller-option {
      width:60% !important;
   }

   .cps-scroller-selection-option{
      margin-left:20% !important;
   }

   .cps-scroller-option-right{
      margin-left:40% !important;
      z-index:10 !important;
   }
}

@media (max-width: 767px) {
   .cps-horizontal-scroller-option {
      width:60% !important;
   }

   .cps-scroller-selection-option{
      margin-left:20% !important;
   }

   .cps-scroller-option-right{
      margin-left:40% !important;
      z-index:10 !important;
   }
}




@media (max-width: 700px) {
   .cps-scroller-selection-option .header{
      color:#fff; 
      font-size:1.25em; 
      text-align:bold;
   }

   .cps-scroller-selection-option .content{
      color:#fff; 
      font-size:0.7em; 
   }
}

@media (max-width: 500px) {
   .cps-horizontal-scroller-option {
      width:60% !important;
   }

   .cps-scroller-selection-option{
      margin-left:20% !important;
   }

   .cps-scroller-option-right{
      margin-left:40% !important;
      z-index:10 !important;
      
   }

   .cps-horizontal-scroller-option-inner{
      width:100% !important;
   }
}


@media (max-width: 400px) {
   .cps-scroller-selection-option .header{
      color:#fff; 
      font-size:1.1em; 
      text-align:bold;
   }

   .cps-scroller-selection-option .content{
      color:#fff; 
      font-size:0.65em; 
   }

   .cps-horizontal-scroller-option-inner-content{
      width:calc(100% - 10px) !important;
      height:calc(100% - 10px) !important;
      margin-top:5px  !important;
   }
}


.scroller-button{
   cursor:pointer;
   color:#3c72ba;
   padding:4px;
   font-weight:bold;
   font-size:3em;
   border-radius:8px;
   text-align:center;
   margin-left:4px;
   margin-right:4px;
   transition: 0.2s;
}

.scroller-button:hover{
   color:#fff;
}