/* body fonts general*/
body {
    font-size: 20px;
    font-family: 'Sansation', sans-serif;
}


/* paleta cromatica casita azul */
/* background */
.bg-ap-pink {
    background: #f2b8d8;
}
.bg-ap-grape {
    background: #7e6b97;
}
.bg-ap-red {
    background: #e8291e;
}
.bg-ap-orange {
    background: #e97a15;
}
.bg-ap-yellow {
    background: #ebce0a;
}
.bg-ap-greenlight {
    background: #b7b746;
}
.bg-ap-greenmedium {
    background: #8e9845;
}
.bg-ap-greendark {
    background: #5c743c;
}

/* text */
.text-ap-pink {
    color: #f2b8d8;
}
.text-ap-grape {
    color: #7e6b97;
}
.text-ap-red {
    color: #e8291e;
}
.text-ap-orange {
    color: #e97a15;
}
.text-ap-yellow {
    color: #ebce0a;
}
.text-ap-greenlight {
    color: #b7b746;
}
.text-ap-greenmedium {
    color: #8e9845;
}
.text-ap-greendark {
    color: #5c743c;
}

/* transp bg text */
.transp {
    background: rgba(255, 255, 255, 0.5);
}


.img-banner {
    background-image: url(img/banner_zslogistic.jpg);
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: scroll;
    background-size: cover;
    border-top-width: 1px;
    border-right-width: 0px;
    border-bottom-width: 1px;
    border-left-width: 0px;
}


/* imagen banner */
.bannerimg {
    width: 90%;
    height: 100%;
    background-image: url(../img/banner_zslogistic.jpg);
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    border-radius: 10px;
}

.alinetext {
    text-align: justify;
}

.scheduleimg {
    background-image: url(../img/students1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.card-wrapper {
    height:200px;
    width: 200px;
    border-radius: 50%;
    background-color: #fff;
    position:relative;
    margin: auto;
    border-color: blue;
    top: -40px;
    -webkit-perspective: 600px;
}

.content {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    transition: transform 0.3s;
    transform-style: preserve-3d;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-wrapper:hover .content {
    transform: rotateY(180deg);
    transition: 0.3s;
}

.face-front, .face-back {
    position: absolute;
    width: 92%;
    height: 92%;
    border-radius: 50%;
    background-color: #fff;
    color: black;
    backface-visibility: hidden;
}

.face-back {
    transform: rotateY(180deg);
}

.centrado {
    display: flex;
    align-items: center;
    justify-content: center;
}

.vertical {
    display: flex;
    align-items: center;
}

.textaround img{
    display: flex;
    width: 40%;
    height: 40%;
    float: left;
    margin-right: 15px;
}