/*
 * Responsive Style
 */

/*	Table of Content
========================
	# 
========================
*/

.single-wrapper {
    padding-top: 120px;
    padding-left: 70px;
}

.single-content-wrapper {
    /*position: absolute;*/
    /*top: 89px;*/
    /*left: 200px;*/
    /*right: 20px;*/
    /*bottom: 60px;*/
    /*z-index: 4;*/
    padding: 25px;
    height: calc(100vh - 145px);
    display: flex;
    place-content: center;
}

.single-content-wrapper .height-fix {
    height: 84vh;
    /*max-height: 832px;*/
    overflow-y: scroll;
}

.single-content h1 {
    font-size: 40px;
    letter-spacing: 2px;
    text-transform: capitalize;
}

.single-content h1 {
    text-transform: capitalize;
}

.single-content h4 {
    font-size: 24px;
    color: var(--bb-pri-red-color);
    letter-spacing: 1px;
}

/* 	==========================================================================
	
	========================================================================== */
@media (min-width: 320px) and (max-width: 479px) {
    .single-content-wrapper {
        top: 89px;
        left: 20px;
        right: 20px;
        bottom: 20px;
        z-index: 4;
    }

    .single-content-wrapper .height-fix {
        height: inherit;
        max-height: inherit;
        overflow-y: scroll;
        margin-bottom: 20px;
    }
}

/* 	==========================================================================
	
	========================================================================== */
@media (min-width: 480px) and (max-width: 575px) {
    .single-content-wrapper {
        top: 89px;
        left: 20px;
        right: 20px;
        bottom: 20px;
        z-index: 4;
    }

    .single-content-wrapper .height-fix {
        height: inherit;
        max-height: inherit;
        overflow-y: scroll;
        margin-bottom: 20px;
    }
}

/* 	==========================================================================
	Small devices (landscape phones, 576px and up)
	========================================================================== */
@media (min-width: 576px) and (max-width: 767px) {
    .single-content-wrapper {
        top: 89px;
        left: 20px;
        right: 20px;
        bottom: 20px;
        z-index: 4;
    }

    .single-content-wrapper .height-fix {
        height: inherit;
        max-height: inherit;
        overflow-y: scroll;
        margin-bottom: 20px;
    }
}

/* 	==========================================================================
	Medium devices (tablets, 768px and up)
	========================================================================== */
@media (min-width: 768px) and (max-width: 991px) {
    .single-content-wrapper {
        top: 89px;
        left: 80px;
        right: 80px;
        bottom: 60px;
        z-index: 4;
    }

    .single-content-wrapper .height-fix {
        height: inherit;
        max-height: inherit;
        overflow-y: scroll;
        margin-bottom: 20px;
    }
}

/* 	==========================================================================
	Large devices (desktops, 992px and up)
	========================================================================== */
@media (min-width: 992px) and (max-width: 1199px) {
    .single-content-wrapper {
        top: 89px;
        left: 80px;
        right: 80px;
        bottom: 60px;
        z-index: 4;
    }

    .single-content-wrapper .height-fix {
        height: inherit;
        max-height: inherit;
        overflow-y: scroll;
        margin-bottom: 20px;
    }
}

/* 	==========================================================================
	X-Large devices (large desktops, 1200px and up)
	========================================================================== */
@media (min-width: 1200px) and (max-width: 1365px) {}

/* 	==========================================================================
	XX-Large devices (larger desktops, 1400px and up)
	========================================================================== */
@media (min-width: 1366px) and (max-width: 1599px) {}

/* 	==========================================================================
	XXX-Large devices (larger desktops, 1600px and up)
	========================================================================== */
@media (min-width: 1600px) {}