#mainEditorDiv {
    word-wrap: break-word;
}

#postTitleContainer {
    width: 100%;
    height: 1080px;
    min-width: 380px;
    overflow: hidden;
}

.postTitleContainer {
    transition: height 0.5s ease-in;
    height: 650px !important;
}

body {
    font-family: 'Barlow', 'sans-serif';
}

h1, h2 {
    font-family: 'Cinzel', 'sans-serif';
    font-weight: normal;
}

p {
    font-size: 1.4em;
}

.blogContainerDiv {
    width: 100%;
}


.contentImage {
    max-width: 65%;
}

.contentDiv p {
    width: 65%;
}

.contentDiv {
    word-wrap: break-word;
    width: 100%;
}

#postGallery {
    width: 100%;
    max-width: 1460px;
}

@media (max-width: 1360px) {
    #postGallery {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
    }
    .blogContainerDiv {
        width: 100%;
    }
    .contentDiv p {
        font-size: 1.2em;
        width: 95%;
    }
    .postTitleContainer {
        height: 400px !important;
    }
}

@media (max-width: 768px) {
    h1 {
        font-size: 1.8em;
    }
    #postGallery {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
    }
    .blogContainerDiv {
        width: 100%;
    }
    #postTitleContainer {
        min-width: 380px;
    }
    .postTitleContainer {
        height: 250px !important;
    }
}

@media (max-width: 480px) {
    #postTitleContainer {
        min-width: 380px;
    }
    .postTitleContainer {
        height: 150px !important;
    }
}

.postTitle {
    text-align: center;
}

.postSubtitle {
    text-align: center;
}

.imageInput {
    opacity: 0;
}

.imageInputLabel {
    position: absolute;
    top: 50%;
    left: 1rem;
    transform: translateY(-50%);
}

.hyperlinkInputLabel {
    position: absolute;
    top: 50%;
    left: 1rem;
    transform: translateY(-50%);
}

.image-area {
    padding: 1rem;
    position: relative;
}

.image-area::before {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.8rem;
    z-index: 1;
}

#blogContainer {
        max-width: 100%;
        width: 100%;
 }

.postDate {
    font-size: 1.1em;
}

@media (max-width: 1200px) {
    .limitWidth {
        max-width: 95%;
    }
}

@media (min-width: 1200px) and (max-width: 1360px){
    .limitWidth {
        max-width: 85%;
    }
}

@media (min-width: 1360px) {
    .limitWidth {
        max-width: 60%;
    }
}