/* fonts */

@font-face {
    font-family: 'orbitronmedium';
    src: url('orbitronmedium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body {
    background: linear-gradient(90deg, rgba(54, 188, 221, 0.583) 0%, rgba(98, 135, 202, 0.46) 50%, rgba(26, 72, 158, 0.647) 100%), url('../img/home/bgt.png');
    background-size: 100%;
    background-repeat: repeat;
    background-position: top center;
    background-attachment: fixed;
    color: #000;
    font-family: 'orbitronmedium';
}

.jumbotron {
    background-image: url('../img/about/vlag.jpg');

}

.jumbotron2 {
    background-image: url('../img/about/siener.webp');
    background-size: cover;
    background-attachment: fixed;
    color: white;
}

.pic {
    background-size: 100%;
    background-repeat: repeat;
    background-position: top center;
    background-attachment: fixed;
    color: white;
}

.bunny {
    background-image: url('../img/about/text.webp');

}

.diploma {
    background-image: url('../img/about/text.webp');

}

.skool {
    background-image: url('../img/about/text.webp');

}

.vision {
    background-image: url('../img/about/text.webp');

}

section {
    padding: 15px;
}

.schizo {
    font-size: 1.5rem;
}

.mandela {
    background-image: url('../img/about/text.webp');
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f00' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23f00' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    height: 100px !important;
    width: 100px !important;
}

.carousel .carousel-indicators li {
    background-color: #fff;
    background-color: rgba(70, 70, 70, 0.50);
}

.carousel .carousel-indicators .active {
    background-color: #444;
}

.carousel-item .img-fluid {
    width: 100%;
    height: 100%;
}

.predict {
    margin-top: 50px;
    background-image: url('../img/about/text.webp');
}