.float {
        position: fixed;
        width: 30px;
        height: 30px;
        top: 5px;
        right: 8px;
        background-color: #ffb52d;
        color: #fff;
        border-radius: 100px;
        text-align: center;
        transition: all .2s;
        box-shadow: 3px 3px 1px #d4951f;
        z-index: 9999;
        outline: none;
    }
    .float:hover,
    .float:focus,
    .float:active {
        background-color: #fa914c;
        color: rgb(9, 123, 146);
    }

    .float-button {
        margin-top: 8px;
    }

    .game-spinner-border{
        position: fixed;
        width: 30px;
        height: 30px;
        top: 15px;
        right: 40px;
        border-radius: 100%;
        z-index: 9999;
        display: none;
    }

.float-m {
        position: fixed;
        width: 30px;
        height: 30px;
        top: 87px;
        right: 8px;
        background-color: #ffb52d;
        color: #fff;
        border-radius: 50%;
        border: 0;
        text-align: center;
        transition: all .2s;
        box-shadow: 3px 3px 1px #d4951f;
        z-index: 9999;
        outline: none;
    }
    .float-m:hover {
        background-color: #fa914c;
        color: rgb(9, 123, 146);
    }

    .float-button-m {
        margin-top: 4px;
    }

.float-n {
        position: fixed;
        width: 30px;
        height: 30px;
        top: 45px;
        right: 8px;
        background-color: #ffb52d;
        color: #fff;
        border-radius: 50%;
        border: 0;
        text-align: center;
        transition: all .2s;
        box-shadow: 3px 3px 1px #d4951f;
        z-index: 9999;
        outline: none;
    }
    .float-n:hover {
        background-color: #fa914c;
        color: rgb(9, 123, 146);
    }

    .float-button-n {
        margin-top: 4px;
    }

.float-restart {
        position: fixed;
        width: 105px;
        height: 105px;
        bottom: 25px;
        right: 25px;
        background: #0A91AB;
        background: linear-gradient(180deg, rgba(10,165,171,1) 0%, rgba(10,146,171,1) 35%);
        color: #fff;
        border-radius: 100px;
        text-align: center;
        transition: all .2s;
        box-shadow: 3px 3px 1px #09849c;
        z-index: 9999;
        outline: none;
    }
    .float-restart:hover,
    .float-restart:focus,
    .float-restart:active {
        background: #09849c;
        background: linear-gradient(1800deg, rgb(8, 148, 153) 0%, rgb(8, 133, 155) 35%);
        color: #fff;
    }

    .float-button-restart {
        margin-top: 24px;
    }

.floating-hotkeys {
  position: fixed;
  bottom: 25px;
  left: 25px;
  transition: all .2s;
  z-index: 9999;
  outline: none;
  cursor: default !important;
}

.modal-vertical-centered {
    transform: translate(0, 10%) !important;
    -ms-transform: translate(0, 10%) !important; 
    -webkit-transform: translate(0, 10%) !important;
}

.my-modal {
    z-index: 9999;
}

.names-content {
    background-image: none;
    border-radius: 0.5vmin;
    border: none;
    padding: 0 !important;
}

.my-input {
    font-size: 1.8em;
    height: 1.8em;
    margin-bottom: 15px;
}

.my-input-last {
    font-size: 1.8em;
    height: 1.8em;
    margin-bottom: 0;
}

.btn-primaryed {
    background: rgb(63, 113, 206);
    background: linear-gradient(0deg, rgb(63, 113, 206) 0%, rgb(31, 141, 255) 100%);
    color: #fff;
    transition: all 0.2s;
    outline: none;
    font-size: 1.5em;
}
.btn-primaryed:hover, .btn-primaryed:focus, .btn-primaryed:active, .btn-primaryed.active, .open > .dropdown-toggle.btn-primaryed {
    color: #fff;
    background: rgb(46, 85, 156);
    background: linear-gradient(0deg, rgb(46, 85, 156) 0%, rgb(29, 124, 226) 100%);
}

.btn-defaulted-2 {
    background: #8D98A2; 
    color: #fff;
    transition: all 0.2s;
    outline: none;
    font-size: 1.5em;
}
.btn-defaulted-2:hover, .btn-defaulted-2:focus, .btn-defaulted-2:active, .btn-defaulted-2.active, .open > .dropdown-toggle.btn-defaulted-2 {
    background: #65717c;
    color: #fff;
}

.modal-title {
    font-size: 2.5em !important;
    line-height: 1.2em !important;
    padding-top: 0 !important;
    padding-bottom: 0.1em !important;
    display: block !important;
}

.my-modal-footer {
    border: none;
}

.my-modal-footer {
    border: none;
}

.team-label {
    font-size: 1.3em;
    color: #8d98a2;
}

#team-names-title {
  color: #fff;
  display: inline-block;
  font-size: 3.5vmin;
  line-height: 2.5vmin;
  margin: 0;
  padding: 12px 0px 18px 0px;
  font-family: "Bree Serif", serif;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  cursor: default;
}

.squareNumberEmoji {
			top: 40% !important;
		}

.btn-light {
  		  background: linear-gradient(0deg, rgb(95, 148, 247) 0%, rgb(68, 160, 255) 100%);
		}
		.btn-light:hover {
		  background: #fac564;
		  color: #438bf4;
		}

		.btn-dark {
		  background: linear-gradient(0deg, rgb(55, 100, 183) 0%, rgb(31, 141, 255) 100%);
		}
		.btn-dark:hover {
		  background: #fac564;
		  color: #438bf4;
		}

		.grid-square-32 {
		  font-size: 7.5vmin !important;
		}
		.grid-square-32:hover {
		  font-size: 9.5vmin !important;
		}

		.grid-square-35 {
		  font-size: 7.2vmin !important;
		}
		.grid-square-35:hover {
		  font-size: 9.2vmin !important;
		}

		.grid-square-36 {
		  font-size: 7vmin !important;
		}
		.grid-square-36:hover {
		  font-size: 8vmin !important;
		}

		.grid-square-40 {
		  font-size: 6.8vmin !important;
		}
		.grid-square-40:hover {
		  font-size: 7.8vmin !important;
		}

		.grid-square-42 {
		  font-size: 6.5vmin !important;
		}
		.grid-square-42:hover {
		  font-size: 7.5vmin !important;
		}

		.grid-square-48 {
		  font-size: 6vmin !important;
		}
		.grid-square-48:hover {
		  font-size: 7vmin !important;
		}

.typed-cursor {
        color: #0A91AB;
        opacity: 1;
        -webkit-animation: blink 0.7s infinite;
        -moz-animation: blink 0.7s infinite;
        animation: blink 0.7s infinite;
    }

    @keyframes blink {
        0% {
            opacity: 1;
        }

        50% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @-webkit-keyframes blink {
        0% {
            opacity: 1;
        }

        50% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @-moz-keyframes blink {
        0% {
            opacity: 1;
        }

        50% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

.cookie-consent {
        position: fixed;
        bottom: 17px;
        left: auto;
        right: 17px;
        margin: auto;
        width: 400px;
        padding: 15px;
        background-image: -webkit-linear-gradient(top,#3c3c3c 0,#222 100%);
        background-image: -o-linear-gradient(top,#3c3c3c 0,#222 100%);
        background-image: -webkit-gradient(linear,left top,left bottom,from(#3c3c3c),to(#222));
        background-image: linear-gradient(to bottom,#3c3c3c 0,#222 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);
        filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
        background-repeat: repeat-x;
        box-shadow: 0 -8px 13px -4px rgb(0 0 0 / 50%);
        border-radius: 9px;
        z-index: 999;
    }

    .cookie-consent__message {
        color: #9d9d9d;
        font-size: 1.6rem;
        font-weight: 500;
        margin-bottom: 10px;
    }

    @media only screen and (max-width: 576px) {
        .cookie-consent {
            width: 95%;
            left: 0;
            right: 0;
            bottom: 10px;
        }
    }