/* https://codepen.io/ig_design/full/qBbdMRJ */

 :root {
     --dark-blue: #102770;
     --white-gr: #c4c3ca;
     --yellow: #ffeba7;
 }
 
 /* #Cursor
 ================================================== */
 .cursor,
 .cursor2,
 .cursor3{
     position: fixed;
     border-radius: 50%;	
     transform: translateX(-50%) translateY(-50%);
     pointer-events: none;
     left: -100px;
     top: 50%;
     mix-blend-mode: difference;
     -webkit-transition: all 300ms linear;
     transition: all 300ms linear; 
     z-index: 9999999;
 }
 .cursor{
     background-color: var(--white-gr);
     height: 0;
     width: 0;
     z-index: 9999999;
 }
 .cursor2,.cursor3{
     height: 36px;
     width: 36px;
     z-index:99998;
     -webkit-transition:all 0.3s ease-out;
     transition:all 0.3s ease-out
 }
 .cursor2.hover,
 .cursor3.hover{
     -webkit-transform:scale(2) translateX(-25%) translateY(-25%);
     transform:scale(2) translateX(-25%) translateY(-25%);
     border:none
 }
 .cursor2{
     border: 2px solid var(--white-gr);
     box-shadow: 0 0 12px rgba(255, 255, 255, 0.2);
 }
 .cursor2.hover{
     background: rgba(255,255,255,1);
     box-shadow: 0 0 0 rgba(255, 255, 255, 0.2);
 }