*{
    margin:0px;
    padding:0px;
    box-sizing: border-box;
}
body{
    font-family: dosis;
    background: #fff;
    font-weight: 500;
    text-transform: capitalize;
    overflow-x: hidden;
}
.main{
    height:100vh;
    width:100%;
    position: relative;
    background: linear-gradient(rgba(0, 0, 0, .5),rgba(0, 0, 0, .5)), url('bg1.jpg');
    background-size: cover;
    background-attachment: fixed;
}
.cybella{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    text-align: center;
}
.hero-scroll{
    position:absolute;
    bottom: 30px;
    left:50%;
    transform: translate(-50%, 0);
    color:#fff;
}
.cybella h1{
    font-size: 900%;
}
header{
    position: absolute;
    top:0;
    left:0;
    z-index:1000;
    padding:15px 15px;
    width:100%;
}
.cybella span{
    text-transform: capitalize;
    text-align: center;
    font-size: 1.2em;
}
.logo{
    color:yellow;
    font-size: 1.5em;
}
a{
    text-decoration: none;
}
a.nav{
    float:right;
    padding: 10px;
    color: rgba(255, 255, 255, .8)
}
.prog-title h3{
    margin-bottom: 50px;
    color:#000;
}
.intro{
    width:100%;
    padding:5%;
    text-align: center;
    background: #F5F7FA;
}
.intro p{
    color:#fff;
    padding: 0 30%;
}
.card-title{
    color:#fff;
    font-weight:700;
}
.card-image img{
    filter: brightness(50%);
}
.card .collection{
    margin: 0 !important;
}
p{
    font-size: 1.2em;
}
.inau{
    padding:8em 0;
    background:#fff;
    color:rgba(0, 0, 0, .8);
}
.inau-avatar{
    height:200px;
    float: right;
    border-radius: 50%;
    margin-right:30px;
}

.inau span{
    display: block;
    font-size:1.2em;
}

.card-content{
    font-size:1.2em;
}
.center{
    text-align:center;
}
footer{
    width:100%;
    padding:7em 0;
    background: #13334c;
    color:rgba(255, 255, 255, .8);
}
footer a{
    color:#fff;
}
.copy{
    display:block;
    font-size:1.2em;
}
.contact{
    background: #fff;
    text-align: center;
    padding:7em 0 !important;
}
.contact h3{
    margin-bottom: 60px;
    margin-top:0px;
}
.contact-cont{
    padding: 10px;
    color: rgba(0, 0, 0, .8);
}
.contact-img img{
    width:150px;
    height:150px;
    border-radius: 50%;
    margin-bottom: 20px;
}
.contact-para p{
    padding: 5%;
    margin: 20px 0px 10px 0px;
}
.contact-para span{
    font-size:1.2em;
    margin-bottom: 8px;
    display:block;
}
.photo-add{
    padding:3em 15px;
    text-align:center;
    background: #c50d66;
    color: yellow;  
}
.photo-add a{
    color: yellow;
    text-decoration: underline;
}
@media only screen and (max-width: 600px) {
    .cybella h1{
        font-size: 5em;
    }

    .inau{
        text-align: center;
    }
    .inau-avatar{
        margin-right: 0px;
        float: none;
        margin-bottom: 20px;
    }

    .main{
        background: linear-gradient(rgba(0, 0, 0, .5),rgba(0, 0, 0, .5)), url('bg2.jpg');   
        background-size: cover;
        background-attachment: fixed;
    }

    .contact-cont{
        margin-bottom: 40px !important;
    }
}

/*
#13334crgba(19,51,76,1)
#005792rgba(0,87,146,1)
#f6f6e9rgba(246,246,233,1)
#fd5f00rgba(253,95,0,1)
*/