﻿.content{
    overflow: hidden;
}

#par-c{
    height: 40rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

#par-c > p:first-child{
    font-family: Verdana;
    font-size: 3.2rem;
    font-weight: 600;
    z-index: 2;
}

#par-c > p:nth-child(2){
    font-size: 1.5rem;
    z-index: 2;
    color: var(--cbg100blue);
    font-family: 'Roboto';
}

span {
    position: absolute;
    pointer-events: none;
    background: #fff;
    animation: animate 5s linear infinite;
}

@keyframes animate {
    0% {
        transform: scale(0) translateY(0) rotate(0deg);
        opacity: 0;
    }

    10% {
        opacity: 1;
    }

    90% {
        opacity: 1;
    }

    100% {
        transform: scale(1) translateY(-500%) rotate(360deg);
        opacity: 0;
    }
}

.bat-c{
    width: 95%;
    display: flex;
    background-color: var(--cbg2);
    margin: auto;
    border-left: 5px solid;
    padding: 2rem 0;
    margin-bottom: 5rem;
}

.bat-c-top{
    width: 100%;
}

.bat-c-top > p:nth-child(1){
    font-size: 2rem;
    color: var(--t3);
    margin: 0 2% 2rem 2%;
    font-family: 'Roboto';
    font-weight: 500;
}

.bat-c-top > p:nth-child(2){
    font-size: 1.6rem;
    font-family: 'Open Sans';
    margin: 0 2%;
    font-weight: 100;
    line-height: 2.4rem;
}

.c1{
    border-left-color: #711c91;
}

.c2 {
    border-left-color: #0abdc6;
}