@charset "utf-8";
/* CSS Document */

.t4-palette-mainnav_dermawan
{
    min-height: 96px;
}



.t4-navbar
{
	display: flex;
}

.toggle-bars
{
	color: #ffffff;
}

.navbar-brand.logo-control img.logo-img
{
	max-height: 72px;
}

.main-page-image
{
	background-image: url(../../../../images/main-page/dermawan-man-background.jpg);
	background-size: cover;
	background-position: center top;
	position: relative;
	height: 840px;
	overflow: hidden;
	display: flex;
    justify-content: center;
}

.main-page-text
{
	text-align: center;
    color: #ffffff;
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
        top: 25%;
    z-index: 10;
}

.main-page-text h1

{
	font-size: 5rem;
    font-weight: 900;
    text-shadow: 2px 2px 3px rgba(0,0,0,0.75);
}


.main-page-text p

{
font-size: 2.5rem;
font-weight: 700;
text-shadow: 1px 1px 2px rgba(0,0,0,0.75);
}




.dermawan-man
{
    
   margin: auto;
    display: inline-flex;
    justify-content: center;
    /* align-items: flex-start; */
    flex-direction: column;
    height: 840px;
	
}



#imageWrap
{
	display: flex;
    justify-content: center;
}





	.dermawan-man img
{
    width: 110%;
    position: relative;
        top: -2%;
		transition: 0.5s;
}




.img-about
{
	display: flex;
    justify-content: center;
    
	overflow: hidden;
}


.img-about img
{
	filter: sepia(1);
	width: 100%;
    height: auto;
	max-width: unset;
}

.t4-offcanvas .t4-off-canvas-header {
    background-color: #ffc107;
    
}


.t4-offcanvas .t4-off-canvas-header h3 {
  
	
    display: none;
}


.t4-offcanvas .t4-off-canvas-body {
    padding: 1rem 1.5rem;
    height: calc(100% - 50px);
    overflow-y: auto;
    background: #3f7300 !important;
    color: #ffffff;
}



.t4-module .nav li a, .t4-card .nav li a, .moduletable .nav li a, .module_menu .nav li a {
    color: #ffffff;
}

.t4-module .nav > li.active > a, .t4-card .nav > li.active > a, .moduletable .nav > li.active > a, .module_menu .nav > li.active > a {
    color: #ffc107;
    font-weight: 600;
}




@media (min-width: 1200px)
{
	
		.dermawan-man
		{
		height: 840px;
		width: 42.33%;
		}
	
	.dermawan-man img {
    width: 110%;
    position: relative;
    top: 1.5%;
}

}



@media (min-width: 992px)
{
	.nav-breakpoint-lg .header-block-2 .t4-navbar .navbar
	{
    
    width: 100%;
	}
	
		.main-top-1
		{
			display: flex !important;
			align-items: center;
		}	
}



@media (min-width: 768px) and (max-width: 1024px)
{
	.img-about img {
   
    width: auto;
    height: auto;
    max-width: unset;
}
}



@media (max-width:992px)
{
	.main-top-1
	{
	display: none;
    
	}
}




@media (max-width:572px)
{
	
	
	
	
	
	
		.main-page-image
			{
				background-image: url(../../../../images/main-page/dermawan-man-background.jpg);
				background-size: cover;
				background-position: center top;
				position: relative;
				height: 480px;
				overflow: hidden;

			}
	
	
	
	
	.main-page-text h1

			{
				font-size: 3rem;
			}	
	
	.main-page-text p

			{
			font-size: 1rem;
				font-weight: 700;
				text-shadow: 1px 1px 2px rgba(0,0,0,0.75);
				line-height: 0.25;

			}
	
			.main-page-text
		{

			
		}
		
	
		.dermawan-man
		{

			
			
			height: 480px;
			

		}
	
	
	
	
}