/* global */

@font-face{
    font-family: "Bahnschrift";
    src: url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.eot"); /* IE9*/
    src: url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.woff2") format("woff2"),
    url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.woff") format("woff"),
    url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.ttf") format("truetype"),
    url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.svg#Bahnschrift") format("svg"); /* iOS 4.1- */
}

.body{
    font-family: 'Bahnschrift';
	-webkit-font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-smooth: always;
}

.center-al{
	text-align: center;
}

a.c-black{
	color: black !important;
	text-decoration: none;
}

.mg-t-10{
	margin-top:10px;
}

.mg-t-20{
	margin-top:20px;
}

.mg-t-30{
	margin-top:30px;
}

.mg-t-50{
	margin-top:50px;
}

.mg-t-60{
	margin-top:60px;
}

.pd-t-10{
	padding-top: 10px;
}

.pd-t-20{
	padding-top: 20px;
}

.pd-t-30{
	padding-top: 30px;
}

.pd-t-40{
	padding-top: 40px;
}

.page-wrapper{
    position: fixed;
    z-index: 2;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    overflow-y: auto;
    overflow-x: hidden;
    transition: all 0.2s linear;
    background: url('../img/background.jpg');
    background-size: cover;
    background-repeat: no-repeat;
}

.page-content{
    margin: auto;
    display: flex;
    width: 100%;
    height: 100%;
}

/* Home */

.home {
    display: flex;
    flex-direction: column;
}

.home .home-top {
    display: flex;
    justify-content: center;
    margin-top: 100px;
}

.home .home-top img{
    width: 300px;
}

.home .home-title{
    display: flex;
    justify-content: center;
}

.home .home-title .title{
    font-size: 24px;
    font-weight: bold;
}

.home .home-sub-title{
    display: flex;
    justify-content: center;
}

.home .home-sub-title .sub-title{
    font-size: 18px;
}

.home .home-content{
    display: flex;
    justify-content: center;
    margin-top: 80px;
}

.home-content .home-login{
    display: flex;
    margin-right: 100px;
}

.home-content .home-login .icon-login img{
    width: 70px;
    margin-right: 10px;
}

.home-content .home-login .text-login{
    margin-top: 20px;
}

.home-content .home-login .text-login a{
    font-weight: bold;
    text-decoration: none;
    color: black;
}

.home-content .home-login .text-login:hover a{
    text-decoration: underline;
}

.home-content .home-web{
    display: flex;
    margin-left: 100px;
}

.home-content .home-web .icon-web img{
    width: 70px;
    margin-right: 10px;
}

.home-content .home-web .text-web{
    margin-top: 20px;
}

.home-content .home-web .text-web a{
    font-weight: bold;
    text-decoration: none;
    color: black;
}

.home-content .home-web .text-web:hover a{
    text-decoration: underline;
}
/* end home */

/* Login */
.login{
    display: flex;
    justify-content: space-around;
    padding: 20px;
    margin-top: 50px;
}

.login .login-left{
    display: flex;
    flex-direction: column;
    margin-top: 60px;
}

.login-left .img-login{
    margin-left: auto;
    margin-right: auto;
}

.login-left .img-login img{
    width: 300px;
}

.login-left .wc-text-login{
    text-align: center;
    font-size: 24px;
    margin-top: 50px;
    font-weight: bold;
}

.login-left .cms-text-login{
    text-align: center;
    margin-top: 30px;
    font-size: 20px;
    font-weight: bold;
}

.login .login-right{
    display: flex;
    flex-direction: column;
}

.login-right .login-right-box{
    border: 1px solid #aeaeae;
    border-radius: 20px;
    box-shadow: 2px 2px 2px 2px #aeaeae;

}

.login-right .login-right-box .login-right-content{
    padding: 30px;
    background: white;
    width: 500px;
    border-radius: 20px;
    background-image: linear-gradient(#31dad1, #d6dbde);
}

.login-right-content .login-content-title{
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 30px;
}

.login-right-content .login-form{
    display: flex;
    flex-direction: column;
}

.login-form .username-form{
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.login-form .username-form label{
    font-weight: bold;
    margin-bottom: 10px;
    margin-left: 30px;
}

.login-form .username-form input{
    box-shadow: 2px 2px 2px 2px #aeaeae;
    width: 370px;
    margin-left: 30px;
}

.login-form .password-form{
    display: flex;
    flex-direction: column;
    margin-bottom: 60px;
}

.login-form .password-form label{
    font-weight: bold;
    margin-bottom: 10px;
    margin-left: 30px;
}

.login-form .password-form input{
    box-shadow: 2px 2px 2px 2px #aeaeae;
    margin-left: 30px;
    width: 370px;
}

.login-form button{
    display: flex;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    width: 120px;
    height: 30px;
    border: 1px solid #aeaeae;
    border-radius: 8px;
    color: black;
    font-weight: bold;
    background: white;
    box-shadow: 2px 2px 2px 2px #aeaeae;
}
/*  end login */


/* dashboard */
.page-content-dashboard{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}
/* end dashboard*/



/* Sidebar*/

.sidebar{
    width: 30%;
    height: auto;
	overflow-y:auto;
	overflow-x: hidden;
	min-height: calc(100vh - 134px);
    position: relative;
    background: #2d2d2d;
}

.sidebar::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.sidebar::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.sidebar::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.sidebar-menu{
	display: flex;
	flex-direction: column;
	text-align: left;
	padding: 6.75px 10px;
}

.sidebar-menu .sidebar-logo{
    display: flex;
    border-bottom: 1px solid #f1f1f1;
    justify-content: center;
}

.sidebar-menu .sidebar-logo img{
    width: 220px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    margin-bottom: 20px;
}

.sidebar-menu .menu-box{
	position:relative;
}

.sidebar-menu .menu-box a{
	color: black;
	text-decoration: none;
}

.sidebar-menu .menu-box button{
    padding: 0px;
}

.sidebar-menu .menu-box .main-menu{
	border-right: 5px solid transparent;
	padding-bottom: 10px;
	padding-top: 10px;
	padding-left: 20px;
	margin-bottom: 10px;
}

.sidebar-menu .menu-box .main-menu:hover{
	background: white;
	border-right: 5px solid #69b8b2;
}



.sidebar-menu .menu-box .main-menu.active{
	background: #f1f1f1;
	border-right: 5px solid #69b8b2;
}

.sidebar-menu .menu-box img{
	width: auto;
	height: 25px;
}

.sidebar-menu .menu-box span{
	margin-left: 50px;
    color: #f1f1f1;
}

.sidebar-menu .menu-box:hover span{
    color: #2d2d2d;
}

.sidebar-menu .menu-box .drop-toggle{
	position: absolute;
	right: 10px;
	top: 13px;
}

.sidebar-menu .menu-box .drop-toggle .active-state{
	display:none;
}

.sidebar-menu .menu-box .drop-toggle.active .inactive-state{
	display:none;
}

.sidebar-menu .menu-box .drop-toggle .inactive-state{
	display:block;
}

.sidebar-menu .menu-box .drop-toggle.active .active-state{
	display:block;
}

.sidebar-menu .menu-box .add-on-menu{

}

.sidebar-menu .menu-box .add-on-menu .add-on-list{
	border-right: 5px solid transparent;
	padding-left: 25px;
	padding-top: 5px;
	padding-bottom: 5px;
	cursor: pointer;
	font-size: 13px;
}

.sidebar-menu .menu-box .add-on-menu .add-on-list span{
	float:right;
}

.sidebar-menu .menu-box .add-on-menu .add-on-list:hover{
	background: #f1f1f1;
	border-right: 5px solid #69b8b2;
}

.sidebar-menu .menu-box .add-on-menu .add-on-list.active{
	background: #f1f1f1;
	border-right: 5px solid #69b8b2;
}

.sidebar.alter{
	top: 46px;
}
/* end sidebar*/

/* content dashboard*/
.content-dashboard{
    background: white;
    width: 100%;
}

.content-dashboard .dashboard-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-dashboard .dashboard-nav .title{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-dashboard .dashboard-content-box{
    display: flex;
    flex-direction: column;
    padding: 30px;
    overflow-y:auto;
	overflow-x: hidden;
}

.dashboard-content-box::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.dashboard-content-box::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.dashboard-content-box::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.dashboard-content-box .dashboard-welcome{
    font-size: 24px;
}

.dashboard-content-box .dashboard-cms{
    font-size: 26px;
}

.dashboard-content-box .dashboard-pt{
    font-size: 24px;
    font-weight: bold;
}

/* end content dashboard*/

/* page about*/

.page-content-about{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-about{
    background: white;
    width: 100%;
}

.content-about .about-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-about .about-nav .title{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-about .about-content-box{
    display: flex;
    flex-direction: column;
    padding: 30px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.about-content-box::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.about-content-box::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.about-content-box::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.about-content-box .title-about{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.about-content-box .create-about{
    margin-top: 10px;
    margin-bottom: 20px;
}

.about-content-box .create-about a{
    background: #00ccff;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 30px;
    padding-right: 30px;
    color: white;
}

.about-content-box .form-about{
    display: flex;
    flex-direction: column;
}

.form-about .table-top-about{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
    background: #e8e8e8;
    color: black;
    font-weight: bold;
}

.form-about .table-top-about .table-about-name{
    width: 20%;
}

.form-about .table-top-about .table-about-img{
    width: 40%;
}

.form-about .table-top-about .table-about-job{
    width: 20%;
}

.form-about .table-top-about .table-about-action{
    width: 20%;
}

.form-about .table-content-about{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
}

.form-about .table-content-about .table-content-name{
    width: 20%;
}

.form-about .table-content-about .table-content-img{
    width: 40%;
}

.form-about .table-content-about .table-content-img img{
    width: 300px;
}

.form-about .table-content-about .table-content-job{
    width: 20%;
}

.form-about .table-content-about .table-content-action{
    width: 20%;
}


.page-content-create-about{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-create-about{
    background: white;
    width: 100%;
}

.content-create-about .create-about-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-create-about .create-about-nav .title-create-about{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-create-about .form-create-about{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
}

.form-create-about .form-create-about-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-create-about-row .form-name{
    margin-bottom: 20px;
}

.form-create-about-row .form-name label{
    font-weight: bold;
}

.form-create-about-row .form-name input{
    border: 1px solid #aeaeae;
}

.form-create-about-row .form-image{
    margin-bottom: 20px;
}

.form-create-about-row .form-image label{
    font-weight: bold;
}

.form-create-about-row .form-image input{
    border: 1px solid #aeaeae;
}

.form-create-about-row .form-job{
    margin-bottom: 20px;
}

.form-create-about-row .form-job label{
    font-weight: bold;
}

.form-create-about-row .form-job input{
    border: 1px solid #aeaeae;
}


.page-content-edit-about{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}


.content-edit-about{
    background: white;
    width: 100%;
}

.content-edit-about .edit-about-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-edit-about .edit-about-nav .title-edit-about{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-edit-about .form-edit-about{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
}

.form-edit-about .form-edit-about-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-edit-about-row .form-edit-name{
    margin-bottom: 20px;
}

.form-edit-about-row .form-edit-name label{
    font-weight: bold;
}

.form-edit-about-row .form-edit-name input{
    border: 1px solid #aeaeae;
}

.form-edit-about-row .form-edit-image{
    margin-bottom: 20px;
}

.form-edit-about-row .form-edit-image label{
    font-weight: bold;
}

.form-edit-about-row .form-edit-image input{
    border: 1px solid #aeaeae;
}

.form-edit-about-row .form-edit-job{
    margin-bottom: 20px;
}

.form-edit-about-row .form-edit-job label{
    font-weight: bold;
}

.form-edit-about-row .form-edit-job input{
    border: 1px solid #aeaeae;
}

.about-content-box .paginator{
    display: flex;
    justify-content: flex-start;
    margin-top: 30px;
    margin-right: 10px;
}

.about-content-box .paginator div.flex{
    display: none;
}

.about-content-box .paginator div.hidden{
    display: flex;
    flex-direction: column;
}

.about-content-box .paginator div.hidden div {
    display: flex;
    justify-content: flex-start;
    word-spacing: 2px;
}

.about-content-box .paginator div.hidden div p span{
    width: 100px;
}


.about-content-box .paginator div.hidden div a{
    color: #62c7c2;
    text-decoration: none;
}

.about-content-box .paginator div.hidden div a:hover{
    text-decoration: underline;
}

.about-content-box .paginator div.hidden svg{
    width: 20px;
}

/* end content about */


/* contact */

.page-content-contact{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-contact{
    background: white;
    width: 100%;
}

.content-contact .contact-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-contact .contact-nav .title{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-contact .contact-content-box{
    display: flex;
    flex-direction: column;
    padding: 30px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.contact-content-box::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.contact-content-box::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.contact-content-box::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.contact-content-box .title-contact{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.contact-content-box .create-contact{
    margin-top: 10px;
    margin-bottom: 20px;
}

.contact-content-box .create-contact a{
    background: #49a8c0;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 30px;
    padding-right: 30px;
    color: white;
    border-radius: 10px;
    cursor: pointer;
}

.contact-content-box .form-contact{
    display: flex;
    flex-direction: column;
}

.form-contact .table-top-contact{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
    background: #e8e8e8;
    color: black;
    font-weight: bold;
}

.form-contact .table-top-contact .table-name{
    width: 15%;
}

.form-contact .table-top-contact .table-email{
    width: 30%;
}

.form-contact .table-top-contact .table-phone{
    width: 15%;
}

.form-contact .table-top-contact .table-subject{
    width: 15%;
}

.form-contact .table-top-contact .table-message{
    width: 25%;
}

.form-contact .table-top-contact .table-action{
    width: 15%;
}

.form-contact .table-content-contact{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
}

.form-contact .table-content-contact .table-content-name{
    width: 15%;
}

.form-contact .table-content-contact .table-content-email{
    width: 30%;
}

.form-contact .table-content-contact .table-content-phone{
    width: 15%;
}

.form-contact .table-content-contact .table-content-subject{
    width: 15%;
}

.form-contact .table-content-contact .table-content-message{
    width: 25%;
}

.form-contact .table-content-contact .table-content-action{
    width: 15%;
}

.page-content-create-contact{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-create-contact{
    background: white;
    width: 100%;
}

.content-create-contact .create-contact-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-create-contact .create-contact-nav .title-create-contact{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-create-contact .form-create-contact{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-create-contact::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-create-contact::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-create-contact::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-create-contact .form-create-contact-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-create-contact-row .form-name{
    margin-bottom: 20px;
}

.form-create-contact-row .form-name label{
    font-weight: bold;
}

.form-create-contact-row .form-name input{
    border: 1px solid #aeaeae;
}

.form-create-contact-row .form-email{
    margin-bottom: 20px;
}

.form-create-contact-row .form-email label{
    font-weight: bold;
}

.form-create-contact-row .form-email input{
    border: 1px solid #aeaeae;
}

.form-create-contact-row .form-phone{
    margin-bottom: 20px;
}

.form-create-contact-row .form-phone label{
    font-weight: bold;
}

.form-create-contact-row .form-phone input{
    border: 1px solid #aeaeae;
}

.form-create-contact-row .form-subject{
    margin-bottom: 20px;
}

.form-create-contact-row .form-subject label{
    font-weight: bold;
}

.form-create-contact-row .form-subject input{
    border: 1px solid #aeaeae;
}

.form-create-contact-row .form-message{
    margin-bottom: 20px;
}

.form-create-contact-row .form-message label{
    font-weight: bold;
}

.form-create-contact-row .form-message input{
    border: 1px solid #aeaeae;
}

.page-content-edit-contact{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}


.content-edit-contact{
    background: white;
    width: 100%;
}

.content-edit-contact .edit-contact-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-edit-contact .edit-contact-nav .title-edit-contact{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-edit-contact .form-edit-contact{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-edit-contact::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-edit-contact::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-edit-contact::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-edit-contact .form-edit-contact-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-edit-contact-row .form-edit-name{
    margin-bottom: 20px;
}

.form-edit-contact-row .form-edit-name label{
    font-weight: bold;
}

.form-edit-contact-row .form-edit-name input{
    border: 1px solid #aeaeae;
}

.form-edit-contact-row .form-edit-email{
    margin-bottom: 20px;
}

.form-edit-contact-row .form-edit-email label{
    font-weight: bold;
}

.form-edit-contact-row .form-edit-email input{
    border: 1px solid #aeaeae;
}

.form-edit-contact-row .form-edit-phone{
    margin-bottom: 20px;
}

.form-edit-contact-row .form-edit-phone label{
    font-weight: bold;
}

.form-edit-contact-row .form-edit-phone input{
    border: 1px solid #aeaeae;
}

.form-edit-contact-row .form-edit-subject{
    margin-bottom: 20px;
}

.form-edit-contact-row .form-edit-subject label{
    font-weight: bold;
}

.form-edit-contact-row .form-edit-subject input{
    border: 1px solid #aeaeae;
}

.form-edit-contact-row .form-edit-message{
    margin-bottom: 20px;
}

.form-edit-contact-row .form-edit-message label{
    font-weight: bold;
}

.form-edit-contact-row .form-edit-message input{
    border: 1px solid #aeaeae;
}

.contact-content-box .paginator{
    display: flex;
    justify-content: flex-start;
    margin-top: 30px;
    margin-right: 10px;
}

.contact-content-box .paginator div.flex{
    display: none;
}

.contact-content-box .paginator div.hidden{
    display: flex;
    flex-direction: column;
}

.contact-content-box .paginator div.hidden div {
    display: flex;
    justify-content: flex-start;
    word-spacing: 2px;
}

.contact-content-box .paginator div.hidden div p span{
    width: 100px;
}


.contact-content-box .paginator div.hidden div a{
    color: #62c7c2;
    text-decoration: none;
}

.contact-content-box .paginator div.hidden div a:hover{
    text-decoration: underline;
}

.contact-content-box .paginator div.hidden svg{
    width: 20px;
}

/* end contact */

/* career */

.page-content-career{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-career{
    background: white;
    width: 100%;
}

.content-career .career-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-career .career-nav .title{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-career .career-content-box{
    display: flex;
    flex-direction: column;
    padding: 30px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.career-content-box::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.career-content-box::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.career-content-box::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.career-content-box .title-career{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.career-content-box .create-career{
    margin-top: 10px;
    margin-bottom: 20px;
}

.career-content-box .create-career a{
    background: #49a8c0;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 30px;
    padding-right: 30px;
    color: white;
    border-radius: 10px;
    cursor: pointer;
}

.career-content-box .form-career{
    display: flex;
    flex-direction: column;
}

.form-career .table-top-career{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
    background: #e8e8e8;
    color: black;
    font-weight: bold;
}

.form-career .table-top-career .table-name-job{
    width: 20%;
    text-align: center;
}

.form-career .table-top-career .table-qualifikasi{
    width: 30%;
    text-align: center;
}

.form-career .table-top-career .table-image{
    width: 35%;
    text-align: center;
}

.form-career .table-top-career .table-action{
    width: 15%;
    text-align: center;
}

.form-career .table-content-career{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
    justify-content: center;
    align-items: center;
}

.form-career .table-content-career .table-content-name-job{
    width: 30%;
}

.form-career .table-content-career .table-content-qualifikasi{
    width: 30%;
}

/* .form-career .table-content-career .table-content-image{
    width: 35%;
} */

.form-career .table-content-career .table-content-image img{
    width: 200px;
    margin-left: 80px;
}

.form-career .table-content-career .table-content-action{
    width: 15%;
}

.page-content-create-career{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-create-career{
    background: white;
    width: 100%;
}

.content-create-career .create-career-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-create-career .create-career-nav .title-create-career{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-create-career .form-create-career{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-create-career::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-create-career::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-create-career::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-create-career .form-create-career-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-create-career-row .form-name-job{
    margin-bottom: 20px;
}

.form-create-career-row .form-name-job label{
    font-weight: bold;
}

.form-create-career-row .form-name-job input{
    border: 1px solid #aeaeae;
}

.form-create-career-row .form-qualifikasi{
    margin-bottom: 20px;
}

.form-create-career-row .form-qualifikasi label{
    font-weight: bold;
}

.form-create-career-row .form-qualifikasi textarea{
    border: 1px solid #aeaeae;
}

.form-create-career-row .form-image{
    margin-bottom: 20px;
}

.form-create-career-row .form-image label{
    font-weight: bold;
}

.form-create-career-row .form-image input{
    border: 1px solid #aeaeae;
}

.page-content-edit-career{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}


.content-edit-career{
    background: white;
    width: 100%;
}

.content-edit-career .edit-career-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-edit-career .edit-career-nav .title-edit-career{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-edit-career .form-edit-career{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-edit-career::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-edit-career::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-edit-career::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-edit-career .form-edit-career-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-edit-career-row .form-edit-name-job{
    margin-bottom: 20px;
}

.form-edit-career-row .form-edit-name-job label{
    font-weight: bold;
}

.form-edit-career-row .form-edit-name-job input{
    border: 1px solid #aeaeae;
}

.form-edit-career-row .form-edit-qualifikasi{
    margin-bottom: 20px;
}

.form-edit-career-row .form-edit-qualifikasi label{
    font-weight: bold;
}

.form-edit-career-row .form-edit-qualifikasi input{
    border: 1px solid #aeaeae;
}

.form-edit-career-row .form-edit-image{
    margin-bottom: 20px;
}

.form-edit-career-row .form-edit-image label{
    font-weight: bold;
}

.form-edit-career-row .form-edit-image input{
    border: 1px solid #aeaeae;
}

.career-content-box .paginator{
    display: flex;
    justify-content: flex-start;
    margin-top: 30px;
    margin-right: 10px;
}

.career-content-box .paginator div.flex{
    display: none;
}

.career-content-box .paginator div.hidden{
    display: flex;
    flex-direction: column;
}

.career-content-box .paginator div.hidden div {
    display: flex;
    justify-content: flex-start;
    word-spacing: 2px;
}

.career-content-box .paginator div.hidden div p span{
    width: 100px;
}

.career-content-box .paginator div.hidden div a{
    color: #62c7c2;
    text-decoration: none;
}

.career-content-box .paginator div.hidden div a:hover{
    text-decoration: underline;
}

.career-content-box .paginator div.hidden svg{
    width: 20px;
}
/* end career */

/* group */

.page-content-group{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-group{
    background: white;
    width: 100%;
}

.content-group .group-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-group .group-nav .title{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-group .group-content-box{
    display: flex;
    flex-direction: column;
    padding: 30px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.group-content-box::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.group-content-box::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.group-content-box::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.group-content-box .title-group{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.group-content-box .create-group{
    margin-top: 10px;
    margin-bottom: 20px;
}

.group-content-box .create-group a{
    background: #00ccff;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 30px;
    padding-right: 30px;
    color: white;
}

.group-content-box .form-group{
    display: flex;
    flex-direction: column;
}

.form-group .table-top-group{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
    background: #e8e8e8;
    color: black;
    font-weight: bold;
}

.form-group .table-top-group .table-group-name{
    width: 22%;
    text-align: left;
}

.form-group .table-top-group .table-alamat{
    width: 63%;
    text-align: left;
}

.form-group .table-top.group .table-action{
    width: 15%;
    text-align: left;
}

.form-group .table-content-group{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
}

.form-group .table-content-group .table-content-group-name{
    width: 22%;
}

.form-group .table-content-group .table-content-alamat{
    width: 63%;
}

.form-group .table-content-group .table-content-action{
    width: 15%;
}

.page-content-create-group{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-create-group{
    background: white;
    width: 100%;
}

.content-create-group .create-group-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-create-group .create-group-nav .title-create-group{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-create-group .form-create-group{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-create-group::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-create-group::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-create-group::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-create-group .form-create-group-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-create-group-row .form-group-name{
    margin-bottom: 20px;
}

.form-create-group-row .form-group-name label{
    font-weight: bold;
}

.form-create-group-row .form-group-name input{
    border: 1px solid #aeaeae;
}

.form-create-group-row .form-group-alamat{
    margin-bottom: 20px;
}

.form-create-group-row .form-group-alamat label{
    font-weight: bold;
}

.form-create-group-row .form-group-alamat textarea{
    border: 1px solid #aeaeae;
}

.page-content-edit-group{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}


.content-edit-group{
    background: white;
    width: 100%;
}

.content-edit-group .edit-group-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-edit-group .edit-group-nav .title-edit-group{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-edit-group .form-edit-group{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-edit-group::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-edit-group::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-edit-group::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-edit-group .form-edit-group-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-edit-group-row .form-edit-group-name{
    margin-bottom: 20px;
}

.form-edit-group-row .form-edit-group-name label{
    font-weight: bold;
}

.form-edit-group-row .form-edit-group input{
    border: 1px solid #aeaeae;
}

.form-edit-group-row .form-edit-alamat{
    margin-bottom: 20px;
}

.form-edit-group-row .form-edit-alamat label{
    font-weight: bold;
}

.form-edit-group-row .form-edit-alamat textarea{
    border: 1px solid #aeaeae;
}

.group-content-box .paginator{
    display: flex;
    justify-content: flex-start;
    margin-top: 30px;
    margin-right: 10px;
}

.group-content-box .paginator div.flex{
    display: none;
}

.group-content-box .paginator div.hidden{
    display: flex;
    flex-direction: column;
}

.group-content-box .paginator div.hidden div {
    display: flex;
    justify-content: flex-start;
    word-spacing: 2px;
}

.group-content-box .paginator div.hidden div p span{
    width: 100px;
}


.group-content-box .paginator div.hidden div a{
    color: #62c7c2;
    text-decoration: none;
}

.group-content-box .paginator div.hidden div a:hover{
    text-decoration: underline;
}

.group-content-box .paginator div.hidden svg{
    width: 20px;
}

/* end group */

/* apply cv */

.page-content-applycv{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-applycv{
    background: white;
    width: 100%;
}

.content-applycv .applycv-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-applycv .applycv-nav .title{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-applycv .applycv-content-box{
    display: flex;
    flex-direction: column;
    padding: 30px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.applycv-content-box::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.applycv-content-box::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.applycv-content-box::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.applycv-content-box .title-applycv{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.applycv-content-box .create-applycv{
    margin-top: 10px;
    margin-bottom: 20px;
}

.applycv-content-box .create-applycv a{
    background: #49a8c0;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 30px;
    padding-right: 30px;
    color: white;
    border-radius: 10px;
    cursor: pointer;
}

.applycv-content-box .form-applycv{
    display: flex;
    flex-direction: column;
}

.form-applycv .table-top-applycv{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
    background: #e8e8e8;
    color: black;
    font-weight: bold;
}

.form-applycv .table-top-applycv .table-name{
    width: 20%;
    text-align: left;
}

.form-applycv .table-top-applycv .table-email{
    width: 30%;
    text-align: left;
}

.form-applycv .table-top-applycv .table-phone{
    width: 20%;
    text-align: left;
}

.form-applycv .table-top-applycv .table-file-cv{
    width: 25%;
    text-align: left;
}

.form-applycv .table-top-applycv .table-action{
    width: 15%;
    text-align: left;
}

.form-applycv .table-content-applycv{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
}

.form-applycv .table-content-applycv .table-content-name{
    width: 20%;
}

.form-applycv .table-content-applycv .table-content-email{
    width: 30%;
}

.form-applycv .table-content-applycv .table-content-phone{
    width: 20%;
}

.form-applycv .table-content-applycv .table-content-file-cv{
    width: 25%;
}

.form-applycv .table-content-applycv .table-content-action{
    width: 15%;
}

.page-content-create-applycv{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-create-applycv{
    background: white;
    width: 100%;
}

.content-create-applycv .create-applycv-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-create-applycv .create-applycv-nav .title-create-applycv{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-create-applycv .form-create-applycv{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-create-applycv::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-create-applycv::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-create-applycv::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-create-applycv .form-create-applycv-row{
    padding-left: 50px;
}

.form-create-applycv-row .form-name{
    margin-bottom: 20px;
}

.form-create-applycv-row .form-name label{
    font-weight: bold;
}

.form-create-applycv-row .form-name input{
    border: 1px solid #aeaeae;
}

.form-create-applycv-row .form-email{
    margin-bottom: 20px;
}

.form-create-applycv-row .form-email label{
    font-weight: bold;
}

.form-create-applycv-row .form-email input{
    border: 1px solid #aeaeae;
}

.form-create-applycv-row .form-phone{
    margin-bottom: 20px;
}

.form-create-applycv-row .form-phone label{
    font-weight: bold;
}

.form-create-applycv-row .form-phone input{
    border: 1px solid #aeaeae;
}

.form-create-applycv-row .form-file-cv{
    margin-bottom: 20px;
}

.form-create-applycv-row .form-file-cv label{
    font-weight: bold;
}

.form-create-applycv-row .form-file-cv input{
    border: 1px solid #aeaeae;
}

.page-content-edit-applycv{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}


.content-edit-applycv{
    background: white;
    width: 100%;
}

.content-edit-applycv .edit-applycv-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-edit-applycv .edit-applycv-nav .title-edit-applycv{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-edit-applycv .form-edit-applycv{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-edit-applycv::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-edit-applycv::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-edit-applycv::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-edit-applycv .form-edit-applycv-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-edit-applycv-row .form-edit-applycv-name{
    margin-bottom: 20px;
}

.form-edit-applycv-row .form-edit-applycv-name label{
    font-weight: bold;
}

.form-edit-applycv-row .form-edit-applycv-name input{
    border: 1px solid #aeaeae;
}

.form-edit-applycv-row .form-edit-applycv-email{
    margin-bottom: 20px;
}

.form-edit-applycv-row .form-edit-applycv-email label{
    font-weight: bold;
}

.form-edit-applycv-row .form-edit-applycv-email input{
    border: 1px solid #aeaeae;
}

.form-edit-applycv-row .form-edit-applycv-phone{
    margin-bottom: 20px;
}

.form-edit-applycv-row .form-edit-applycv-phone label{
    font-weight: bold;
}

.form-edit-applycv-row .form-edit-applycv-phone input{
    border: 1px solid #aeaeae;
}

.form-edit-applycv-row .form-edit-applycv-file-cv{
    margin-bottom: 20px;
}

.form-edit-applycv-row .form-edit-applycv-file-cv label{
    font-weight: bold;
}

.form-edit-applycv-row .form-edit-applycv-file-cv input{
    border: 1px solid #aeaeae;
}

.applycv-content-box .paginator{
    display: flex;
    justify-content: flex-start;
    margin-top: 30px;
    margin-right: 10px;
}

.applycv-content-box .paginator div.flex{
    display: none;
}

.applycv-content-box .paginator div.hidden{
    display: flex;
    flex-direction: column;
}

.applycv-content-box .paginator div.hidden div {
    display: flex;
    justify-content: flex-start;
    word-spacing: 2px;
}

.applycv-content-box .paginator div.hidden div p span{
    width: 100px;
}


.applycv-content-box .paginator div.hidden div a{
    color: #62c7c2;
    text-decoration: none;
}

.applycv-content-box .paginator div.hidden div a:hover{
    text-decoration: underline;
}

.applycv-content-box .paginator div.hidden svg{
    width: 20px;
}

/*  end apply cv */

/* Article */

.page-content-article{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-article{
    background: white;
    width: 80%;
}

.content-article .article-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-article .article-nav .title{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-article .article-content-box{
    display: flex;
    flex-direction: column;
    padding: 30px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.article-content-box::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.article-content-box::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.article-content-box::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.article-content-box .title-article{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.article-content-box .create-article{
    margin-top: 10px;
    margin-bottom: 20px;
}

.article-content-box .create-article a{
    background: #49a8c0;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 30px;
    padding-right: 30px;
    color: white;
    border-radius: 10px;
    cursor: pointer;
}

.article-content-box .form-article{
    display: flex;
    flex-direction: column;
}

.form-article .table-top-article{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
    background: #e8e8e8;
    color: black;
    font-weight: bold;
}

.form-article .table-top-article .table-judul{
    width: 15%;
    text-align: left;
}

.form-article .table-top-article .table-banner{
    width: 15%;
    text-align: left;
}

.form-article .table-top-article .table-keterangan{
    width: 20%;
    text-align: left;
    margin-right: 20px;
}

.form-article .table-top-article .table-gambar{
    width: 20%;
    text-align: left;
}

.form-article .table-top-article .table-descript{
    width: 15%;
    text-align: left;
}

.form-article .table-top-article .table-action{
    width: 15%;
    text-align: left;
}

.form-article .table-content-article{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
}

.form-article .table-content-article .table-content-judul{
    width: 15%;
}

.form-article .table-content-article .table-content-banner{
    width: 15%;
}

.form-article .table-content-article .table-content-banner img{
    width: 100px;
}

.form-article .table-content-article .table-content-keterangan{
    width: 20%;
    margin-right: 20px;
text-overflow: ellipsis;
    overflow: hidden;

    white-space: nowrap;
}

.form-article .table-content-article .table-content-gambar{
    width: 20%;
}

.form-article .table-content-article .table-content-gambar img{
    width: 100px;
}

.form-article .table-content-article .table-content-descript {
    width: 15%;
    text-overflow: ellipsis;
    overflow: hidden;

    white-space: nowrap;
}

.form-article .table-content-article .table-content-action{
    width: 15%;
}

.page-content-create-article{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-create-article{
    background: white;
    width: 100%;
}

.content-create-article .create-article-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-create-article .create-article-nav .title-create-article{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-create-article .form-create-article{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-create-article::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-create-article::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-create-article::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-create-article .form-create-article-row{
    padding-left: 50px;
}

.form-create-article-row .form-judul{
    margin-bottom: 20px;
}

.form-create-article-row .form-judul label{
    font-weight: bold;
}

.form-create-article-row .form-judul input{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-judul-2{
    margin-bottom: 20px;
}

.form-create-article-row .form-judul-2 label{
    font-weight: bold;
}

.form-create-article-row .form-judul-2 input{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-banner{
    margin-bottom: 20px;
}

.form-create-article-row .form-banner label{
    font-weight: bold;
}

.form-create-article-row .form-banner input{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-banner-2{
    margin-bottom: 20px;
}

.form-create-article-row .form-banner-2 label{
    font-weight: bold;
}

.form-create-article-row .form-banner-2 input{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-keterangan{
    margin-bottom: 20px;
}

.form-create-article-row .form-keterangan label{
    font-weight: bold;
}

.form-create-article-row .form-keterangan textarea{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-gambar-1{
    margin-bottom: 20px;
}

.form-create-article-row .form-gambar-1 label{
    font-weight: bold;
}

.form-create-article-row .form-gambar-1 input{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-descript-1{
    margin-bottom: 20px;
}

.form-create-article-row .form-descript-1 label{
    font-weight: bold;
}

.form-create-article-row .form-descript-1 textarea{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-gambar-2{
    margin-bottom: 20px;
}

.form-create-article-row .form-gambar-2 label{
    font-weight: bold;
}

.form-create-article-row .form-gambar-2 input{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-descript-2{
    margin-bottom: 20px;
}

.form-create-article-row .form-descript-2 label{
    font-weight: bold;
}

.form-create-article-row .form-descript-2 textarea{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-gambar-3{
    margin-bottom: 20px;
}

.form-create-article-row .form-gambar-3 label{
    font-weight: bold;
}

.form-create-article-row .form-gambar-3 input{
    border: 1px solid #aeaeae;
}

.form-create-article-row .form-descript-3{
    margin-bottom: 20px;
}

.form-create-article-row .form-descript-3 label{
    font-weight: bold;
}

.form-create-article-row .form-descript-3 textarea{
    border: 1px solid #aeaeae;
}

.page-content-edit-article{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}


.content-edit-article{
    background: white;
    width: 100%;
}

.content-edit-article .edit-article-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-edit-article .edit-article-nav .title-edit-article{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-edit-article .form-edit-article{
    padding-top: 70px;
    padding-left: 200px;
    padding-right: 200px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.form-edit-article::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.form-edit-article::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.form-edit-article::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-edit-article .form-edit-article-row{
    padding-left: 50px;
    padding-right: 50px;
}

.form-edit-article-row .form-edit-article-judul{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-judul label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-judul input{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-judul-2{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-judul-2 label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-judul-2 input{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-banner{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-banner label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-banner input{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-banner-2{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-banner-2 label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-banner-2 input{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-keterangan{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-keterangan label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-keterangan textarea{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-gambar-1{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-gambar-1 label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-gambar-1 input{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-descript-1{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-descript-1 label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-descript-1 textarea{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-gambar-2{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-gambar-2 label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-gambar-2 input{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-descript-2{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-descript-2 label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-descript-2 textarea{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-gambar-3{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-gambar-3 label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-gambar-3 input{
    border: 1px solid #aeaeae;
}

.form-edit-article-row .form-edit-article-descript-3{
    margin-bottom: 20px;
}

.form-edit-article-row .form-edit-article-descript-3 label{
    font-weight: bold;
}

.form-edit-article-row .form-edit-article-descript-3 textarea{
    border: 1px solid #aeaeae;
}

.article-content-box .paginator{
    display: flex;
    justify-content: flex-start;
    margin-top: 30px;
    margin-right: 10px;
}

.article-content-box .paginator div.flex{
    display: flex;
}

.article-content-box .paginator div.hidden{
    display: flex;
    flex-direction: column;
}

.article-content-box .paginator div.hidden div {
    display: flex;
    justify-content: flex-start;
    word-spacing: 2px;
}

.article-content-box .paginator div.hidden div p span{
    width: 100px;
}

.article-content-box .paginator div.hidden div a{
    color: #62c7c2;
    text-decoration: none;
}

.article-content-box .paginator div.hidden div a:hover{
    text-decoration: underline;
}

.article-content-box .paginator div.hidden svg{
    width: 20px;
}

/* end article */


/* activitylogs */

.page-content-activitylogs{
    display: flex;
    margin: auto;
    width: 1366px;
    height: 100%;
}

.content-activitylogs{
    background: white;
    width: 100%;
}

.content-activitylogs .activitylogs-nav{
    background: #e8e8e8;
    height: 138px;
}

.content-activitylogs .activitylogs-nav .title{
    padding-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
}

.content-activitylogs .activitylogs-content-box{
    display: flex;
    flex-direction: column;
    padding: 30px;
    overflow-y:auto;
	overflow-x: hidden;
    min-height: calc(100vh - 134px);
    position: relative;
    height: 80px;
}

.activitylogs-content-box .title-activitylogs{
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.form-activitylogs{
    display: flex;
    flex-direction: column;

}

.activitylogs-content-box::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.activitylogs-content-box::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.activitylogs-content-box::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.form-activitylogs .table-top-activitylogs{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
    background: #e8e8e8;
    color: black;
    font-weight: bold;
}

.form-activitylogs .table-top-activitylogs .table-fullname{
    width: 30%;
}

.form-activitylogs .table-top-activitylogs .table-logs{
    width: 70%;
}

.form-activitylogs .table-content-activitylogs{
    display: flex;
    border: 1px solid #aeaeae;
    padding: 10px;
}

.form-activitylogs .table-content-activitylogs .table-content-fullname{
    width: 30%;
}

.form-activitylogs .table-content-activitylogs .table-content-logs{
    width: 70%;
}

.activitylogs-content-box .paginator{
    display: flex;
    justify-content: flex-start;
    margin-top: 30px;
    margin-right: 10px;
}

.activitylogs-content-box .paginator div.flex{
    display: none;
}

.activitylogs-content-box .paginator div.hidden{
    display: flex;
    flex-direction: column;
}

.activitylogs-content-box .paginator div.hidden div {
    display: flex;
    justify-content: flex-start;
    word-spacing: 2px;
}

.activitylogs-content-box .paginator div.hidden div p span{
    width: 100px;
}


.activitylogs-content-box .paginator div.hidden div a{
    color: #62c7c2;
    text-decoration: none;
}

.activitylogs-content-box .paginator div.hidden div a:hover{
    text-decoration: underline;
}


.activitylogs-content-box .paginator div.hidden svg{
    width: 20px;
}



/* end activitylogs */

/* footer*/
.footer-login{
    margin-top: 100px;
    background: transparent;
    color: #2d2d2d;
    position: relative;
    text-align: center;
    font-weight: bold;
}

.footer-home{
    margin-top: 150px;
    background: transparent;
    color: #2d2d2d;
    position: relative;
    text-align: center;
    font-weight: bold;
}

/* end footer*/
.table-data {
   overflow-y: scroll;

}
table.data {
    min-width: 100%;
    font-size: 12px;
}
tr.header-table {
    background: #439A97;
    color: white;
    display: table-row;
    position: relative;
    font-weight: 500;
}
th.header-row {
    padding: 7px;
    font-weight: 500;
    text-align: center;
    font-size: 13px;
    position: relative;
}
tr.body-table {
    background: white;
}
#data-table tbody tr.body-table td:first-child {
    width: 70px;
}
td.body-row {
    padding: 3px 7px;
    border: 1px solid #0606061f;
}
::-webkit-scrollbar {
    width: 7px;
}
::-webkit-scrollbar-thumb {
    background: #63B6B7;
    border-radius: 10px;
}
.modal-popup-detail {
    position: fixed;
    display: flex;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10000;
    width: 100%;
    background-color: #5e5e5e29;
    height: 100%;
    justify-content: center;
    align-items: center;
}
.content-modal {
    padding: 15px;
    background: white;
    width: 50%;
    max-height: 79%;
    border-radius: 10px;
}
.card-pop-up {
    display: flex;
    flex-direction: column;
}
.header-pop {
    display: flex;
    justify-content: space-between;
}
.header-pop p{
    font-size: 20px;
    font-weight: 700;
}
.header-pop span{
    cursor: pointer;
    font-size: 15px;
    font-weight: 800;
}
.body-card {
    position: relative;
    width: 100%;
    height: 50%;
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
}
.header-body {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.header-body p {
    font-size: 18px;
    font-weight: 700;
}
.contect-user {
    display: flex;
    flex-direction: column;
}
.contect-user span {
    font-size: 13px;
    font-weight: 700;
}
.message-body {
    padding-top: 10px;
    overflow-y: scroll;
    height: 361px;
}
.message-body .image-articel {
    width: 385px;
    height: 221px;
    overflow: hidden;
    border-radius: 10px;
}
.message-body .image-articel .img-articel {
    object-fit: cover;
    width: 100%;
    height: 100%;
    background: center;
}
.contect-user .label{
    color: #8d8c8c
}
.sub {
    display: flex;
    justify-content: space-between;
    font-size: medium;
    padding: 4px 0px;
    font-weight: 600;
}
p.text-sub {
    font-size: 20px;
    font-weight: 600;
}

.hidden{
    display: none !important;
}