@import "dh_ui.css";
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Space+Mono&display=swap');
*{
    padding: 0;
    margin: 0;
    font-family: 'Rubik', sans-serif;
    box-sizing: border-box;
}
body{
    font-family: 'Rubik', sans-serif;
}
header#main-header{
	border-bottom: 1px solid var(--dh-grey-light);
}
.header_inner {
    width: auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 0 76px;
	padding: 21px 0;
}
.logo_text{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.header_inner span{
    font-size: 12px;
    font-weight: 500;
    color: var(--dh-text-secondary-lighter);
    margin-left: 8px;
}
.main-content {
    width: 100%;
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;	
}
.menu {
    background: var(--dh-blue-tint);
	height: 88vh;
	padding:16px;
    background-color: var(--dh-grey-lighter);
}
.content {
	padding: 10px 10px 10px 30px;
}

.content h2{
	border-bottom: 1px solid var(--dh-grey-light);
    padding-bottom: 15px;
}

.table_content {
    width: auto;
	padding: 10px;
}

.centered_one table thead th{
    font-weight: 500;
    font-size: 14px;
}

table tbody tr td {
    padding: 10px 32px;
    height: 32px;
    font-size: 14px;
    font-weight: 400;
}

table thead th{
    padding: 12px 32px;
    font-size: 14px;
    font-weight: 500;
    color: #555;
    text-transform: capitalize;
}

table tbody tr td span{
    font-size: 12px;
    font-weight: 400;
    color: #AAACB4;
}

table thead tr th {
    width: 25%;
}

table tbody tr td {
    width: 25%;
}

.table_content h4{
	color: var(--dh-text-secondary-lighter);
}

ul.navigation {
    margin: 0;
	list-style: none;
}
/* new csss */
.header-btn{
    padding: 10px 26px;
    background-color: var(--dh-blue-tint);
    color: var(--dh-primary);
    font-size: 16px;
    font-weight: 500;
    border-radius: 8px;
    text-decoration: none;
    text-underline-position: none;
    border: none;
    outline: none;
}
/* menu dropdown */
.dropdown-container {
    display: none;
    background-color: var(--dh-grey-lighter);
    padding: 0px 10px;
  }
.dropdown-container a{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    border-radius: 8px;
}
.icon_drop {
    cursor: pointer;
}
.right-nav .dropdown-container{
    background-color: unset !important;
}
.nav_main {
    margin: 14px 0;
    cursor: pointer;
    font-size: 16px;
    font-weight: 400;
    color: #555;
}
.menu-dropdown-btn{
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    border: none;
    outline: none;
    background: none;
    padding: 10px 10px;
    text-align: left;
    font-size: 16px;
    font-weight: 500;
    border-radius: 8px;
    color: var(--dh-text-primary);
    cursor: pointer;
    
}
.menu-dropdown-btn i{
    color: var(--dh-text-secondary-lighter);
}
 .menu .active{
    background-color: var(--dh-blue-tint) !important;
    color: var(--dh-primary);
}
.dropdown-container a.active p{
    color: var(--dh-primary) !important;
}
.fa-caret-down {
    float: right;
    padding-right: 8px;
}
.drop-option p{
    font-size: 14px;
    font-weight: 400;
    color: var(--dh-text-primary);
}
.drop-option span{
    font-size: 12px;
    font-weight: 400;
    color: var(--dh-text-secondary);
    background-color: var(--dh-grey-light);
    padding: 4px 8px;
    border-radius: 4px;
    border: 1px solid var(--dh-grey-lighter);
}
.inner-content {
    padding: 16px 24px 16px 16px;
}
.inner-content h2{
    font-size: 28px;
    font-weight: 500;
    color: var(--dh-text-primary);
    border-bottom: 1px solid var(--dh-grey-light);
    padding-bottom: 20px;
    margin-bottom: 28px;
}
.sub_title i{
    font-size: 16px;
    font-weight: 400;
    color: var(--dh-text-secondary-lighter);
}
.sub_title {
    margin-bottom: 28px;
}
.imp-info{
    font-size: 16px;
    font-weight: 400;
    color: var(--dh-dark);
    margin-bottom: 14px;
}
.imp-info span{
    font-size: 14px;
    font-weight: 400;
    padding: 4px 8px;
    background-color: var(--dh-grey-light);
    border-radius: 4px;
}
.text-center{
    text-align: center;
}
.page-table {
    margin-top: 40px;
}
.page-table a {
    color: var(--dh-primary);
}
.sml-heading{
    font-size: 18px;
    font-weight: 500;
    color: var(--dh-text-primary);
    margin-bottom: 10px;
}
.sml-heading span{
    font-weight: 400 !important;
    color: #828282 !important;
}
.md-heading{
    font-size: 24px;
    font-weight: 500;
    color: var(--dh-text-primary);
    margin-bottom: 10px;
}
table{
    table-layout: fixed;
}
table, th, td {
    border: 1px solid var(--dh-text-disabled);
    border-collapse: collapse;
}
.rbe{
    font-size: 14px;
    font-weight: 400;
    color: var(--dh-text-secondary);
    margin-top: 18px;
    cursor: pointer;
}
.right-nav{
    padding: 16px;
}
.right-nav h4{
    font-size: 14px;
    font-weight: 500;
    color: var(--dh-text-secondary-lighter);
    margin-bottom: 20px;
}
.right-nav .active{
    font-weight: 600 !important;
}
.right-nav ul{
    padding-left: 35px;
}
.right-nav ul li {
    cursor: pointer;
    list-style-type: disc;
}
.json-key{
    color: brown;
}
.json-string {
    color: olive;
}
pre {
    border: 1px solid #e5e5e5;
    margin-top: 18px;
    padding: 10px 20px;
}
pre code{
    font-family: 'Space Mono', monospace;
    font-size: 16px;
    font-weight: 400;
}
.btm-info{
    margin-top: 40px;
}
.btm-info p{
    font-size: 12px;
    font-weight: 400;
    color: #AAACB4;
}
.last-updated{
    display: flex;
    justify-content: start;
    align-items: center;
}
.last-updated img{
    margin-right: 6px;
}
hr {
    margin: 26px 0;
    border-top: 1px solid #fff;
}
.previous {
    background-color: #f1f1f1;
    color: black;
    padding: 8px 16px;
}
.next {
    background-color: #f1f1f1;
    color: black;
    padding: 8px 16px;
}
.pr-ne{
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
}
.inner-content .dropdown-container{
    padding: 0 !important;
}
/* bottom last short table */
.page_last_table table{
    width: 75%;
}
/* iframe outer div's */
.menu_frame_outer{
    width: 20%;   
    border-right: 1px solid var(--dh-grey-light);
	background: var(--dh-grey-lighter);
}
.content_frame_outer{
    width: 60%;    
    padding-top: 10px;
}
.tablecontent_frame_outer{
    width: 20%;    
}
/* iframe css */
.menu-frame {
    width: 100%;
    height: calc(100vh - 82px);
}
.content-frame{
    width: 100%;
    height: 88vh;
}
.tablecontent-frame{
    width: 100%;
    height: 88vh;
}
p.imp-info a {
    color: var(--dh-primary);
    text-decoration: underline;
}
.nxt {
    display: flex;
    align-items: center;
    font-size: 14px !important;
    color: #555 !important;
}
.nxt img{
    margin: 0 5px;
}
.nxt span{
    margin: 0 5px;
}
.here-add-some-dummy p{
    padding: 6px 0px 12px;
}

/**welcomepage-start**/
.content_section {
    width: 80%;
    padding: 20px 60px;
    position: relative;
}
.content_section h2 {
    color: var(--dh-text-primary);
    padding-bottom: 15px;
    border-bottom: 1px solid var(--dh-grey-light);
    margin-bottom: 20px;
}
.content_section p {
    color: var(--dh-dark);
    padding: 0px 0px 20px;
}
.process_widget h3 {
    color: var(--dh-text-primary);
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 10px;
}
.process_widget {
    padding-bottom: 5px;
}
.pagefooter_sec {
    position: absolute;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.pagefooter_sec_left , .pagefooter_sec_right {
    width: 50%;
}
.pagefooter_sec_left img {
    width: 50px;
    display: flex;
    align-items: center;
    margin-right: 15px
}
.pagefooter_sec_left {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.pagefooter_sec_left strong {
    color: var(--dh-text-secondary);
    font-size: 14px;
    display: block;
    margin-bottom: 5px;
}
.pagefooter_sec_left span {
    width: calc(100% - 80px);
    color: var(--dh-text-secondary-lighter);
    font-size: 12px;
}
span.pagefooter_tag {
    background: var(--dh-grey-light);
    padding: 10px 20px;
    color: var(--dh-text-secondary);
    border-radius: 4px;
    margin-right: 15px;
    text-transform: uppercase;
}
span.pagefooter_text {
    color: var(--dh-text-primary);
    margin-right: 15px;
}
span.pagefooter_icon i {
    color: var(--dh-text-secondary-lighter);
}



@media (max-width:991px) {
    .process_widget h3 {
        font-size: 14px;
    }
    .content_section p {
        font-size: 14px;
    }
    .content_section {
        width: 80%;
        padding: 20px 30px;
    }
}
/**welcomepage-end**/





@media only screen and (max-width: 480px){
    .main-content {
        flex-direction: column;
    }
    .menu {
        width: 100%;
    }
    .content {
        width: 100%;
        padding: 10px 20px 10px 20px;
    }
    .inner-content {
        height: auto;
        overflow-y: unset;
        width: 100%;
        padding: unset;
    }
    .table_content {
        margin-top: 20px;
        width: 100%;
    }
    .imp-info span {
        word-break: break-word;
    }
    .mb-table{
        width: 100%;
        overflow-x: scroll;
    }
    .header_inner{
        margin: 0 15px;
    }

}