@import url("https://fonts.googleapis.com/css2?family=Montserrat&display=swap");

* {
    box-sizing: border-box;
}


html {
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

html.dark {
    background-color: var(--main-color-dark); /* #9b59b6 */
}

html.dark h1, html.dark .support a {
    color: #fff;
}

.checkbox {
    opacity: 0;
    position: absolute;
}
.dark .home {
    background: linear-gradient(to right, rgb(0 0 0 / 50%), rgb(0 0 0 / 50%)), url(../img/background.png);
    background-size: cover;
	background-position: center;
}
.dark #languageSelect{
    
color: var(--second-color-dark);

}
.dark .thank-you-containter {
    background: #333333;
}
.checkbox-label {
    background-color: #c1c1c1;
    width: 50px;
    height: 26px;
    border-radius: 50px;
    position: relative;
    padding: 5px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: 0.2s ease-in-out;
}

html.dark .checkbox-label {
    transition: 0.1s ease-in-out;
    background-color: #5e5e5e;
}

html.dark .navbar a {
    color: var(--second-color-dark);
}

html.dark header {
    
    background-color: #434242d4;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

html.dark .bx-menu:before {
    color: #ededed;
}

.dark h1,
.dark h5,
.dark h6,
.dark .btn3,

.dark .main-text h2,
.dark .about-text h2,
.dark .video-text h2,
.dark .box h3,
.dark .sec h2,
.dark .gdpr-text h2,
.dark .nadpis h2{
    color: var(--bg-color);
}
.dark p,
.dark .textZ{
    color: var(--second-color-dark);
}
.dark .box,
.dark .container-contact1,
.dark .cont-udaje,
.dark .bank-udaje{
    background-color: #333333;
}
.dark .btn4:hover{
    color: var(--bg-color) !important;
}
.dark hr{
    color: #6b6b6b;
    border: 1px solid;
}
.dark .home h3{
    color: #e7e7e7;
}
.dark .home-text h4{
    text-shadow: 0 0 2px black;
    color: #c7abff;
}
.dark .btn:hover,
.dark .btn2:hover{
    color: white !important;
}

.dark .custom-card{
    box-shadow: 0px 0px 11px 1px rgb(18 18 18);
    background-color: #333333;
    color: #e3e3e3;

}
.dark .custom-card #isp-tutorial, .dark .custom-card span{
    color: #b393f1;
    

}
.dark .form-control{
    border-radius: 10px;
  background-color: #6b6b6b;
  color: #fff;
  border: 1px solid #434343
  
}
.dark .form-control::placeholder{
  color: #ffffff91;
}

.checkbox-label .ball {
    background-color: #fff;
    width: 22px;
    height: 22px;
    position: absolute;
    left: 2px;
    top: 2px;
    border-radius: 50%;
    transition: transform 0.2s linear;
}

.dark .counter img{
    filter: invert(100%);
}

.checkbox:checked + .checkbox-label .ball {
    transform: translateX(24px);
}

/* Support me if you like it */
.support {
    position: absolute;
    right: 20px;
    bottom: 20px;
}

.support a {
    color: #292c35;
    font-size: 32px;
    backface-visibility: hidden;
    display: inline-block;
    transition: transform 0.2s ease;
}

.support a:hover {
    transform: scale(1.1);
}

.dark header.sticky{
    box-shadow: 0px 0px 8px #313131;
}