@import url(https://fonts.googleapis.com/css?family=Montserrat);
@import url(https://fonts.googleapis.com/css?family=Arvo);

h3 {
    text-align: center;
}

h2 {
    text-align: center;
}

.carousel-item {
    bottom: 0;
    left: 0;
    margin: auto;
    max-height: 75%;
    max-width: 100%;
    position: absolute;
    right: 0;
    top: 0;
}

    .carousel-item p{
        text-size-adjust:200%;
    }

.slick-prev:before,
.slick-next:before {
    color: purple !important;
}

.slick-arrow:before {
    color: red;
}

.slick-prev {
    margin-left: 30px;
    z-index: 1;
}

.slick-next {
    margin-right: 30px;
    z-index: 1;
}

.announcements {

}

.header {
    text-align: center;
    font-size: 36px;
}

    .header p {
        display: inline;
        font-family: 'Arvo','Montserrat', 'Arial Narrow', Arial
    }

/*.article {
    width: 75%;
    border: double;
    margin: auto;
}*/

/*.content {
    width: 75%;
    margin: auto;
    background: rgb(254, 254, 254,.5);
    border-radius: 25px;
    box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086), 0 100px 80px rgba(0, 0, 0, 0.12);
}*/

/*body {
    background: linear-gradient(-45deg, #bf42f5, #da85ff, #e9b8ff, #faf0ff);
    background-size: 400% 400%;
    animation: gradient 10s ease infinite;
    height: 100vh;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}
*/

/*Background Section*/

body {
    margin: 0;
    height: 100vh;
    font-weight: 100;
    /*background: radial-gradient(#f8e3fc,#d3aaf7);*/
    -webkit-overflow-Y: hidden;
    -moz-overflow-Y: hidden;
    -o-overflow-Y: hidden;
    -webkit-animation: fadeIn 1 1s ease-out;
    -moz-animation: fadeIn 1 1s ease-out;
    -o-animation: fadeIn 1 1s ease-out;
    animation: fadeIn 1 1s ease-out;
}

.light {
    position: absolute;
    width: 0px;
    opacity: .75;
    background-color: white;
    box-shadow: #e9f1f1 0px 0px 20px 2px;
    opacity: 0;
    top: 100vh;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: auto;
}

.x1 {
    -webkit-animation: floatUp 4s infinite linear;
    -moz-animation: floatUp 4s infinite linear;
    -o-animation: floatUp 4s infinite linear;
    animation: floatUp 4s infinite linear;
    -webkit-transform: scale(1.0);
    -moz-transform: scale(1.0);
    -o-transform: scale(1.0);
    transform: scale(1.0);
}

.x2 {
    -webkit-animation: floatUp 7s infinite linear;
    -moz-animation: floatUp 7s infinite linear;
    -o-animation: floatUp 7s infinite linear;
    animation: floatUp 7s infinite linear;
    -webkit-transform: scale(1.6);
    -moz-transform: scale(1.6);
    -o-transform: scale(1.6);
    transform: scale(1.6);
    left: 15%;
}

.x3 {
    -webkit-animation: floatUp 2.5s infinite linear;
    -moz-animation: floatUp 2.5s infinite linear;
    -o-animation: floatUp 2.5s infinite linear;
    animation: floatUp 2.5s infinite linear;
    -webkit-transform: scale(.5);
    -moz-transform: scale(.5);
    -o-transform: scale(.5);
    transform: scale(.5);
    left: -15%;
}

.x4 {
    -webkit-animation: floatUp 4.5s infinite linear;
    -moz-animation: floatUp 4.5s infinite linear;
    -o-animation: floatUp 4.5s infinite linear;
    animation: floatUp 4.5s infinite linear;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    left: -34%;
}

.x5 {
    -webkit-animation: floatUp 8s infinite linear;
    -moz-animation: floatUp 8s infinite linear;
    -o-animation: floatUp 8s infinite linear;
    animation: floatUp 8s infinite linear;
    -webkit-transform: scale(2.2);
    -moz-transform: scale(2.2);
    -o-transform: scale(2.2);
    transform: scale(2.2);
    left: -57%;
}

.x6 {
    -webkit-animation: floatUp 3s infinite linear;
    -moz-animation: floatUp 3s infinite linear;
    -o-animation: floatUp 3s infinite linear;
    animation: floatUp 3s infinite linear;
    -webkit-transform: scale(.8);
    -moz-transform: scale(.8);
    -o-transform: scale(.8);
    transform: scale(.8);
    left: -81%;
}

.x7 {
    -webkit-animation: floatUp 5.3s infinite linear;
    -moz-animation: floatUp 5.3s infinite linear;
    -o-animation: floatUp 5.3s infinite linear;
    animation: floatUp 5.3s infinite linear;
    -webkit-transform: scale(3.2);
    -moz-transform: scale(3.2);
    -o-transform: scale(3.2);
    transform: scale(3.2);
    left: 37%;
}

.x8 {
    -webkit-animation: floatUp 4.7s infinite linear;
    -moz-animation: floatUp 4.7s infinite linear;
    -o-animation: floatUp 4.7s infinite linear;
    animation: floatUp 4.7s infinite linear;
    -webkit-transform: scale(1.7);
    -moz-transform: scale(1.7);
    -o-transform: scale(1.7);
    transform: scale(1.7);
    left: 62%;
}

.x9 {
    -webkit-animation: floatUp 4.1s infinite linear;
    -moz-animation: floatUp 4.1s infinite linear;
    -o-animation: floatUp 4.1s infinite linear;
    animation: floatUp 4.1s infinite linear;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9);
    left: 85%;
}

button:focus {
    outline: none;
}

@-webkit-keyframes floatUp {
    0% {
        top: 100vh;
        opacity: 0;
    }

    25% {
        opacity: 1;
    }

    50% {
        top: 0vh;
        opacity: .8;
    }

    75% {
        opacity: 1;
    }

    100% {
        top: -100vh;
        opacity: 0;
    }
}

@-moz-keyframes floatUp {
    0% {
        top: 100vh;
        opacity: 0;
    }

    25% {
        opacity: 1;
    }

    50% {
        top: 0vh;
        opacity: .8;
    }

    75% {
        opacity: 1;
    }

    100% {
        top: -100vh;
        opacity: 0;
    }
}

@-o-keyframes floatUp {
    0% {
        top: 100vh;
        opacity: 0;
    }

    25% {
        opacity: 1;
    }

    50% {
        top: 0vh;
        opacity: .8;
    }

    75% {
        opacity: 1;
    }

    100% {
        top: -100vh;
        opacity: 0;
    }
}

@keyframes floatUp {
    0% {
        top: 100vh;
        opacity: 0;
    }

    25% {
        opacity: 1;
    }

    50% {
        top: 0vh;
        opacity: .8;
    }

    75% {
        opacity: 1;
    }

    100% {
        top: -100vh;
        opacity: 0;
    }
}


/*Card Section*/

* {
    box-sizing: border-box;
    line-height: 1.5;
    font-family: 'Open Sans', sans-serif;
}

.master-block {
    margin-top: 0;
}
/*
    .master-block p {
        display: inline;
        font-family: 'Arvo','Montserrat', 'Arial Narrow', Arial
    }*/

.row.row-cols-sm-2 {
}

.mt-0 {
    margin-top: 1px !important;
}

.container-news {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 75vh;
}

    .container-news card {
        text-align: center;
    }

.card {
    position: relative;
    background: #333;
    width: 360px;
    max-width:400px;
    height: 76vh;
    border-radius: 6px;
    padding: 2rem;
    color: #aaa;
    box-shadow: 0 .25rem .25rem rgba(0,0,0,0.2), 0 0 1rem rgba(0,0,0,0.2);
    overflow: hidden;
}

.card__image-container {
    margin: -2rem -2rem 1rem -2rem;
}

.card__line {
    opacity: 0;
    animation: LineFadeIn .8s .8s forwards ease-in;
}

.card__image {
    opacity: 0;
    height:320px;
    width:102%;
    animation: ImageFadeIn .8s 1.4s forwards;
}

.card__title {
    color: white;
    margin-top: 0;
    font-weight: 800;
    letter-spacing: 0.01em;
    text-align:left;
}

.card__content {
    margin-top: -1rem;
    opacity: 0;
    animation: ContentFadeIn .8s 1.6s forwards;
}

.card__footer {
    margin-top:auto;
    opacity: 0;
    animation: ContentFadeIn .8s 1.6s forwards;
}

.card__svg {
    position: absolute;
    left: 0;
    top: 137px;
}


@keyframes LineFadeIn {
    0% {
        opacity: 0;
        d: path("M 0 300 Q 0 300 0 300 Q 0 300 0 300 C 0 300 0 300 0 300 Q 0 300 0 300 ");
        stroke: #fff;
    }

    50% {
        opacity: 1;
        d: path("M 0 300 Q 50 300 100 300 Q 250 300 350 300 C 350 300 500 300 650 300 Q 750 300 800 300");
        stroke: #888BFF;
    }

    100% {
        opacity: 1;
        d: path("M -2 100 Q 50 200 100 250 Q 250 400 350 300 C 400 250 550 150 650 300 Q 750 450 802 400");
        stroke: #545581;
    }
}

@keyframes ContentFadeIn {
    0% {
        transform: translateY(-1rem);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes ImageFadeIn {
    0% {
        transform: translate(-.5rem, -.5rem) scale(1.05);
        opacity: 0;
        filter: blur(2px);
    }

    50% {
        opacity: 1;
        filter: blur(2px);
    }

    100% {
        transform: translateY(0) scale(1.0);
        opacity: 1;
        filter: blur(0);
    }
}