/* COLOR */

.blueFont {
    color: rgba(77, 86, 114, 1);
}

.blueBg {
    background-color: rgba(77, 86, 114, 1);
}

fadedBlueBg {
    background-color: rgba(77, 86, 114, .5);
}
.orangeFont {
    color: #e6914c;
}

.orangeBg {
    background-color: #e6914c; 
}

.goldenBg {
    background-color: rgba(209, 175, 125, 1);
}

.goldenFont {
    color: rgba(225, 204, 172, 1);
}

.darkGoldenFont {
    color: rgba(209, 175, 125, 1);
}

.whiteFont {
    color: #fff;
}

.darkkBg {
    background-color: rgba(51, 51, 51, 1);
}

.fadedDarkBg {
    background-color: rgba(70, 70, 70, .8);
}
/* POSITION */

.top0{
    position: absolute;
    top: 0;
}

.top450 {
    position: absolute;
    top: 450px;
}
.left {
    position: absolute;
    left: 0;
}

.right {
    position: absolute;
    right: 0;
}

/* FONT FAMILIES*/
.smFont {
    font-size: 15px;
}
.handwriting {
    font-family: 'Kalam', cursive !important;
    font-weight: 600;
}

.largeWord {
    font-size: 50px;
    font-weight: 600;
    margin: auto;
    margin-top: 200px;
    color: #fff;
    text-align: center;
}

.overlay {
    width: 100%!important;
    opacity: 0.5;
    z-index;
}

.overlay .largeWord {
    width: 50%!important;
    text-align: center;
}

.underlineBlue {
    width: 100%;
    margin: 15px auto;
    height: 4px;
    position: relative;
    background-color: rgba(120, 130, 164, 1);
    animation-name: example;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
}

.underlineGolden {
    width: 100%;
    margin: 15px auto;
    height: 1px;
    position: relative;
    background-color: rgba(209, 175, 125, 1);
    animation-name: example;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
}
.underlineGoldenSmall {
    width: 100%;
    margin: auto;
    height: 1px;
    position: relative;
    background-color: rgba(209, 175, 125, 1);
    animation-name: example;
    animation-duration: .5s;
}


@keyframes example {
    0% {
        width: 0px;
    }

    100% {
        width: 100%;
    }
}


@media (max-width: 768px) {
    .largeWord {
        font-size: 30px;
        margin: auto;
       /* margin-top: 55px;*/
    }
}