/*Custom CSS
============ */
#home-version-2 #title {
        background-image: none;
        background-color: #fef1e1 !important;
}

#blog-version-1 #title {
        background-image: url('../img/title-background-blog-version-1-small.jpg')
}

#blog-version-2 #title {
        background-image: url('../img/title-background-blog-version-2-small.jpg')
}

#blog-detail #title {
        background-image: url('../img/title-background-blog-detail-small.jpg')
}

#gallery-page #title {
        background-image: url('../img/title-background-gallery-page-small.jpg')
}

.equal {
        display: flex;
        display: -webkit-flex;
        flex-wrap: wrap;
}

@media(min-width: 769px) {
        #blog-version-1 #title {
                background-image: url('../img/title-background-blog-version-1-medium.jpg')
        }

        #blog-version-2 #title {
                background-image: url('../img/title-background-blog-version-2-medium.jpg')
        }

        #blog-detail #title {
                background-image: url('../img/title-background-blog-detail-medium.jpg')
        }

        #gallery-page #title {
                background-image: url('../img/title-background-gallery-page-medium.jpg')
        }
}

@media(min-width: 1367px) {
        #blog-version-1 #title {
                background-image: url('../img/title-background-blog-version-1-large.jpg')
        }

        #blog-version-2 #title {
                background-image: url('../img/title-background-blog-version-2-large.jpg')
        }

        #blog-detail #title {
                background-image: url('../img/title-background-blog-detail-large.jpg')
        }

        #gallery-page #title {
                background-image: url('../img/title-background-gallery-page-large.jpg')
        }
}


.cnt223 a {
        text-decoration: none;
        font-size: 18px;
        display: block;
        margin: 10px 0px;
}

.popup {
        width: 100%;
        margin: 0 auto;
        display: none;
        position: fixed;
        z-index: 101;
}

.cnt223 {
        min-width: 340px;
        width: 340px;
        min-height: 150px;
        margin: 100px auto;
        background: #f3f3f3;
        position: relative;
        z-index: 103;
        padding: 10px;
        border-radius: 5px;
        box-shadow: 0 2px 5px #000;
}

.cnt223 p {
        clear: both;
        color: #555555;
        text-align: justify;
}

.cnt223 p a {
        color: #d91900;
        font-weight: bold;
}

.cnt223 .x {
        float: right;
        height: 16px;
        left: 8px;
        position: relative;
        top: -8px;
        width: 16px;
}

.cnt223 .x:hover {
        cursor: pointer;
}

.cnt224 {
        z-index: 103;
}

.cnt224 .xb {
        float: right;
        height: 16px;
        left: -18px;
        position: relative;
        top: 0px;
        width: 16px;
}

.cnt224 .xb:hover {
        cursor: pointer;
}

.form-group {
        line-height: 140%;
        margin-bottom: 5px;
}

body {
        background-color: #fef1e1;
}

.limit-1-row {
        -webkit-transition: all 500ms ease;
        transition: all 500ms ease;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;

}

.limit-2-rows {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        -webkit-line-clamp: 2;
        /* Limit to 2 lines */
        text-overflow: ellipsis;
        line-height: 1.2em;
        min-height: calc(1.2em * 2);
}


.limit-3-rows {
        -webkit-transition: all 500ms ease;
        transition: all 500ms ease;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        min-height: 4.5em;
}

.limit-4-rows {
        -webkit-transition: all 500ms ease;
        transition: all 500ms ease;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 24px;
        min-height: 96px;
}

.bg_alb {
        background-color: #fff;
}

div.bg_alb.pad10 {
        position: relative;
}

.pad10 {
        padding: 10px;
}

.bg_alb h3 {
        margin-bottom: 15px;
}

.input-group i {
        height: 32px;
        vertical-align: baseline;
}