.tlower {
  text-transform: lowercase;
  color: #000;
}

/*=================== IDENTITAS FOOTER ====================*/
.iden-al {
    display: flex;
    align-items: flex-start; /* ikon dan teks sejajar atas */
    gap: 15px;               /* jarak ikon dan teks */
    font-size:14px;
    font-weight:700;
    font-family: 'Nunito Sans', sans-serif;
    color: #FFF;
}

.iden-al .alamat {
    line-height: 1.4;
}

.iden-al-black{
    font-size:14px;
    font-weight:700;
    font-family: 'Nunito Sans', sans-serif;
    color: #000;
    padding-bottom: 5px;
    padding-top: 5px;
}

.iden-op{
    font-size:14px;
    font-weight:700;
    font-family: 'Nunito Sans', sans-serif;
    color: #FFF;
}

.iden-op-black{
    font-size:14px;
    font-weight:700;
    font-family: 'Nunito Sans', sans-serif;
    color: #000;
    padding-bottom: 5px;
    padding-top: 5px;
}

.sosmed{
    position: relative;
    margin-top: 100px;
}

.fotex{
    font-size:14px;
    font-weight:500;
    font-family: 'Nunito Sans', sans-serif;
    color: #FFF;
}

html {
    scroll-behavior: smooth;
}


.footer-links{
	position:relative;
}

.footer-links li{
	position:relative;
	margin-bottom:6px;
}

.footer-links li a{
	position:relative;
	color:#d5d5d5;
	font-size:14px;
	font-weight:300;
	transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
}

.footer-links li a:hover{
    color:#ffffff;
}

.text-gen{
    color: #000;
    font-size: 16px;
    margin-bottom: 15px;
}

.head-gen{
    color: #000;
    font-size: 28px;
    font-weight: bolder;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.head-gen-white{
    color: #FFF;
    font-size: 28px;
    font-weight: bolder;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.shead-gen{
    color: #000;
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 15px;
}

.lowest-content{
    position:relative;
    color:#000;
    font-size:14px;
    font-weight:300;
    margin-bottom:10px;
    margin-top: 10px;
    min-height: 225px;
    border-bottom: 1px solid #efefef;
    padding: 10px 10px 10px 10px;
}

.j-lcontent{
    position:relative;
    color:#000;
    font-size:18px;
    font-weight: bolder;
    margin-bottom:15px;
    margin-top: 25px;
}

.t-lcontent{
    position:relative;
    color:#000;
    font-size: 16px;
    font-weight: 350;
    margin-bottom:15px;
}

.b-learn{
    position: relative;
    margin-top: 225px;
}

.content-box{
    position: absolute;
    color: #ffffff;
}

.main-sliders h2.twhite{
    font-size:60px;
    color:#ffffff;
    font-weight:800;
    line-height:1.1em;
    padding-bottom:18px;
    font-family: 'Nunito Sans', sans-serif;
}

.main-sliders h2.tblack{
    font-size:60px;
    color: #000000;
    font-weight:800;
    line-height:1.1em;
    padding-bottom:18px;
    font-family: 'Nunito Sans', sans-serif;
}

.main-sliders .swhite{
    font-weight:400;
    line-height:1.6em;
    color: #ffffff;
    font-size:24px;
    font-family:'Roboto',sans-serif;
}

.main-sliders .sblack{
    font-weight:400;
    line-height:1.6em;
    color: #000000;
    font-size:24px;
    font-family:'Roboto',sans-serif;
}

.btn-style-new{
    position:relative;
    padding:14px 35px;
    line-height:24px;
    color:#0d70b7;
    text-align:center;
    font-size:14px;
    font-weight:700;
    background: #FFF;
    letter-spacing:1px;
    text-transform:uppercase;
    border:2px solid #FFF;
    font-family: 'Nunito Sans', sans-serif;
}

.btn-style-new:hover{
    color:#ffffff;
    border-color: #6a6a6a;
    background-color: #6a6a6a;
}

/*=================== VIDEO SECTION ====================*/
.video-section{
	position:relative;
	padding:80px 0px 40px;
	background-color:#072235;
}

.video-section .sec-title h2:before{
	background-color:#ffffff;
}

.video-section:before{
	position:absolute;
	content:'';
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	display:block;
	background:url(../images/resource/bg-layer.jpg) repeat;
}

.video-thumb {
    position: relative;
    display: inline-block;
}

.video-thumb img {
    display: block;
    width: 100%;
}

/* Tombol play */
.play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80px;
    height: 80px;
    background: rgba(255, 0, 0, 0.9);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

/* Segitiga play */
.play-btn::before {
    content: "";
    border-style: solid;
    border-width: 14px 0 14px 22px;
    border-color: transparent transparent transparent #fff;
    margin-left: 5px;
}

/* Hover effect */
.video-thumb:hover .play-btn {
    background: #ff0000;
    transform: translate(-50%, -50%) scale(1.1);
}

.menu-link {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}

.menu-link img {
    transition: 0.2s ease;
}

.jservis {
    font-size: 14px;
    font-weight: 400;
}

.vteks {
    font-size: 16px;
    color: #fff;
}

/** ADD YOUR AWESOME CODES HERE **/
/* Table */
.demo-table {
    border-collapse: collapse;
    font-size: 14px;
    max-width: 350px;
    margin-top: 50px;
    margin-bottom: 50px;
}

.demo-table th, 
.demo-table td {
    border: 1px solid #e1edff;
    padding: 7px 17px;
}
.demo-table caption {
    margin: 7px;
}

/* Table Header */
.demo-table thead th {
    background-color: #508abb;
    color: #FFFFFF;
    border-color: #6ea1cc !important;
    text-transform: uppercase;
}

/* Table Body */
.demo-table tbody td {
    color: #353535;
    }
.demo-table tbody td:first-child,
.demo-table tbody td:nth-child(4),
.demo-table tbody td:last-child {
    text-align: left;
}
		
.demo-table tbody td:empty {
    background-color: #ffcccc !important;
    border-color: #ffcccc !important;
}

.demo-table tbody tr:nth-child(odd) td {
    background-color: #f4fbff;
}
.demo-table tbody tr:hover td {
    background-color: #ffffa2;
    border-color: #ffff0f;
}

.p-4{padding:1.5rem!important}