@font-face {
	font-family: 'originlight';
	src: url('https://demo.jdinfotech.net/citrine/fonts/origin_light_0-webfont.woff2') format('woff2'), url('https://demo.jdinfotech.net/citrine/fonts/origin_light_0-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@media screen and (max-width: 1284px) and (min-width: 1024px) {
	.gen-nav {
		right: 4% !important;
	}
}

@media screen and (max-width: 1920px) {
	.dk-scroll {
		position: fixed !important;
		bottom: 5% !important;
		padding-left: 5%;
	}
}

@media screen and (min-width: 1920px) {
	.work-loop1 {
		padding: 300px 0 0 0 !important;
	}
	.gen-nav {
		bottom: 6% !important;
	}
	.home-intro {
		background-color: #0a0a0a;
	}
	.lasss {
		margin-top: -300px !important;
	}
	.home-intro-img {
		width: 100%;
	}
	.home-intro img {
		height: 938px;
		margin: 0 auto;
		display: block;
	}
	.about-last-p {
		margin-top: -7% !important;
		margin-left: 5% !important;
		max-width: 20% !important;
	}
	.about-box p {
		font-size: 25px !important;
		line-height: 35px !important;
	}
	.about-first-p {
		max-width: 55% !important;
	}
	.about-second-p {
		max-width: 60% !important;
		margin-top: 5% !important;
	}
	.service-scroll {
		position: absolute;
		bottom: 25%;
		left: 10%;
	}
	.about-scroll {
		position: absolute;
		bottom: -80%;
		left: 10%;
	}
	.about-box h2,
	.work-main h2,
	.service-main h2 {
		color: #fff;
		font-weight: 100;
		font-size: 28px !important;
		/*margin-left: 75px!important;*/
	}
	.tsdw-scroll {
		bottom: 0% !important;
		left: 8% !important;
	}
}

@media only screen and (min-width: 1366px) {
	.hmaf-logo {
		padding-top: 4% !important;
		padding-left: 11% !important;
	}
	.home-scroll {
		position: absolute;
		bottom: 14% !important;
		left: 11% !important;
	}
	.gen-nav {
		position: fixed;
		bottom: 5% !important;
		right: 3% !important;
		transform: translate(0%, 0%);
		z-index: 11;
	}
}

@media only screen and (min-width: 1024px) {
	.about-last-p {
		margin-top: -5% !important;
	}
	.about-second-p {
		max-width: 62.666667%;
	}
	.about-scroll {
		bottom: 2% !important;
	}
	.home-scroll {
		bottom: 18% !important;
	}
	.service-scroll {
		bottom: 21% !important;
	}
	.wdm-sc {
		padding: 70px 0 80px 30px !important;
	}
	.about-box h2,
	.work-main h2,
	.service-main h2 {
		color: #fff;
		font-weight: 100;
		font-size: 28px !important;
		/*margin-left: 27px!important;*/
	}
	.wdm-img {
		padding: 35px 0!important;
	}
	.dm_imge {
		width: 100%!important;
	}
	.wdm-img1 h5 {
		font-size: 20px!important;
		margin: 20px!important;
	}
}

@media (max-width: 576px) {
	.work-side {
		position: relative !important;
		top: unset !important;
		left: unset !important;
		margin-right: 0% !important;
		transform: unset !important;
	}
	.wo-top-ul,
	.wo-bottom-ul {
		margin-bottom: 25px !important;
	}
	.about-box h2,
	.work-main h2 {
		/*margin-left: 0px!important;*/
	}
	.service-box {
		top: 46% !important;
		left: 48% !important;
	}
	.service-main li a {
		font-size: 18px !important;
		line-height: 24px !important;
	}
	.cn-follow {
		padding: 5px !important;
		font-size: 20px !important;
	}
	.cn-fi-p {
		padding: 5px !important;
		font-size: 20px !important;
	}
	.cn-se-p {
		padding: 5px !important;
		font-size: 18px !important;
	}
	p.firstmain-p {
		padding-left: 0px !important;
		padding-top: 0px !important;
	}
	.about-box p {
		font-size: 10px !important;
		line-height: 18px !important;
	}
	p.secondmain-p {
		padding-left: 0px !important;
		padding-top: 0px !important;
	}
	.about-first-p {
		padding: 0px 5px !important;
	}
	p.thirdmain-p {
		top: -40px !important;
	}
	.cn-img {
		padding: 36px;
	}
	.work-detail-main {
		padding: 50px 0;
	}
	.wdm-box {
		position: relative !important;
		top: unset !important;
		left: unset !important;
		margin-right: 0% !important;
		transform: unset !important;
	}
	.myImg,
	.mor-logo {
		margin-bottom: 15px;
	}
	.secoo {
		margin-bottom: 0px;
	}
	.wdm-img1 h5 {
		margin: 0 0 80px 0 !important;
	}
	.thhh,
	.secoo,
	.lasss {
		margin-top: 0px !important;
	}
	.secoo {
		margin-bottom: 0px !important;
	}
	.maindd {
		margin-top: 0px !important;
	}
	.gen-nav {
		right: 8% !important;
	}
	.home-scroll {
		bottom: 21% !important;
	}
	.home-scroll img {
		width: 50%;
	}
	.work-top h4 {
		font-size: 19px !important;
		margin-bottom: 0px !important;
	}
	.service-main li {
		font-size: 22px !important;
	}
	.hmaf-center img {
		margin-left: 15%;
	}
	.hmaf-center {
		position: absolute !important;
		top: 50% !important;
		left: 50% !important;
		margin-right: -50% !important;
		transform: translate(-50%, -50%) !important;
		text-align: unset !important;
	}
}

@media screen and (min-width: 1900px) {
	.home-scroll {
		left: 9% !important;
	}
	.home-intro {
		background-color: #0a0a0a;
	}
	.home-intro-img {
		width: 100%;
	}
	.home-intro img {
		height: 938px;
		margin: 0 auto;
		display: block;
	}
	.about-last-p {
		margin-top: -4% !important;
		margin-left: 5% !important;
		max-width: 20% !important;
	}
	.about-box p {
		font-size: 25px !important;
		line-height: 35px !important;
	}
	.about-first-p {
		max-width: 55% !important;
	}
	.about-second-p {
		max-width: 60% !important;
		margin-top: 5% !important;
	}
	.hmaf-center {
		font-size: 85px!important;
	}
	.videota {
		height: 90% !important;
	}
	.gen-nav {
		bottom: 3.2% !important;
		right: 3.3% !important;
	}
	.gen-nav li a {
		font-size: 26px !important;
	}
	.hmaf-center {
		top: 50% !important;
	}
	.hmaf-logo .img-fluid {
		width: 13% !important;
		margin-left: 5.5%;
		margin-top: -0.5%;
	}
	.hmaf-logo {
		padding-left: 3% !important;
	}
	.service-main li a {
		font-size: 28px !important;
	}
	.service-main li {
		font-size: 50px !important;
	}
	.service-scroll {
		position: absolute;
		bottom: 25%;
		left: 10%;
	}
	.about-scroll {
		position: absolute;
		bottom: -80%;
		left: 10%;
	}
	.mystyle {
		color: white !important;
	}
	.about-box h2,
	.work-main h2,
	.service-main h2 {
		/*margin-left: 27px!important;*/
	}
}

@media only screen and (max-width: 768px) {
	.about-box h2,
	.work-main h2 {
		color: #fff;
		font-weight: 100;
		font-size: 28px;
		/*margin-left: 0px;*/
	}
	.about-scroll {
		bottom: 2% !important;
	}
}

@media only screen and (max-width: 767px) {
    .about-box h2, .work-main h2, .service-main h2, .contact-main h2{margin-left: 0px !important;}
}

@media only screen and (min-width: 769px) {
	body {
		padding: 30px;
	}
	.cn-img {
		margin-top: -50px;
	}
	.wdm-box1 {
		position: fixed;
		bottom: 10px;
		left: 8%;
	}
	.mor-fo {
		left: 8%;
		position: fixed;
		bottom: 10px;
	}
	.mor-main img {
		margin: 0 auto;
		display: block;
		padding: 100px 120px 0px 120px;
	}
	.dk-desk {
		position: absolute;
		top: 50%;
		left: 50%;
		margin-right: -50%;
		transform: translate(-50%, -50%);
	}
	.mor-logo {
		margin-left: -100px;
	}
	.about-first-p {
		padding-top: 1% !important;
		padding-left: 1% !important;
		font-size: 16px!important;
	}
	.hmaf-logo img {
		width: 14%;
	}
	.cnt-logo {
		margin-top: 2.5% !important;
	}
}

@media only screen and (min-width: 1920px) and (max-width: 2560px) {
	.about-box h2,
	.work-main h2,
	.service-main h2,
	.contact-main h2 {
		color: #fff;
		font-weight: 100;
		font-size: 28px !important;
		/*margin-left: 75px!important;*/
	}
}


/* ----------- iPad 1, 2, Mini and Air ----------- */


/* Portrait and Landscape */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
	p.secondmain-p {
		padding-left: 0px !important;
		padding-top: 0px !important;
	}
	p.thirdmain-p {
		top: 0px !important;
	}
	.about-first-p {
		padding-top: 0% !important;
		padding-left: 0% !important;
	}
	.secoo {
		margin-top: 0px !important;
	}
	.thhh {
		margin-top: 0px !important;
	}
	.lasss {
		margin-top: -180px !important;
	}
	.cn-se-p {
		font-size: 18px !important;
		padding-left: 40px !important;
	}
	.cn-fi-p {
		padding: 60px 0px 30px 20px !important;
		font-size: 20px !important;
	}
	#tsdw-bottom {
		padding-top: 60px;
	}
	#player .ytp-cued-thumbnail-overlay-image {
		background-size: auto !important;
	}
	.responsive-container {
		position: relative;
		padding-bottom: 50.25%;
		padding-top: 0px;
		height: 0;
		overflow: hidden;
	}
	.responsive-container iframe {
		position: absolute;
		top: 0;
		left: 0;
		border: 0;
		width: 100%;
		height: 100%;
	}
	.wdm-img1 h5 {
		margin: 10px 50px 90px 50px !important;
	}
	.work-side {
		padding-left: 15px;
	}
}


/* Portrait */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
	#tsdw-bottom {
		position: relative;
	}
	.maindd {
		margin-top: 0px;
	}
	.wdm-sc {
		display: none;
	}
	.about-box p {
		font-size: 18px !important;
		line-height: 24px !important;
	}
	.ab-read a {
		color: #fff;
	}
/*	.about-box h2 {
		margin-left: 0px!important;
	}*/
	.ipad-img {
		-ms-flex: 0 0 25%;
		flex: 0 0 25%;
		max-width: 25%;
	}
	.ipad-first {
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		max-width: 50%;
	}
	.ipad-second {
		-ms-flex: 0 0 75%;
		flex: 0 0 75%;
		max-width: 75%;
		padding: 30px 0px 0px 15px !important;
	}
	.ipad-hide {
		display: none;
	}
	.ix-75 {
		flex: 0 0 75%;
		max-width: 75%;
		padding: 30px 0px 0px 15px !important;
	}
	.ipad-second .secondmain-p {
		padding-left: 0px !important;
		margin-bottom: 0px;
	}	
	.wipf {
		-ms-flex: 0 0 33.333333%;
		flex: 0 0 33.333333%;
		max-width: 33.333333%;
	}
	.wips {
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		max-width: 50%;
	}
	.wipt {
		-ms-flex: 0 0 16.666667%;
		flex: 0 0 16.666667%;
		max-width: 16.666667%;
	}
	.work-side {
		padding-left: 30px;
	}
	.work-side {
		position: relative !important;
		top: unset !important;
		left: unset !important;
		margin-right: unset !important;
		transform: unset !important;
	}
	.work-top h4 {
		margin-bottom: 65px;
	}
	.ix-100 {
		max-width: 100%;
		flex: 0 0 100%;
	}
	p.firstmain-p {
		padding-top: 0px !important;
	}
	.work-detail-main {
		padding-top: 30px;
	}
	.mor-fo {
		position: absolute;
		bottom: 30px;
	}
	.wdm-box1 {
		position: absolute;
		bottom: 15px;
	}
	.dk-scroll {
		display: none;
	}
	.dk-desk {
		padding: 148px 0;
	}
	.dkipad-scroll {
		display: block !important;
		position: absolute;
		bottom: 15px;
	}
	.secoo {
		margin-bottom: 0px !important;
	}
	#tsdw-bottom {
		padding-top: 25px !important;
	}
	.fi-full {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
		margin-bottom: 30px;
	}
	.fio-box {
		position: relative!important;
		top: unset !important;
		left: unset !important;
		margin-right: unset !important;
		transform: unset !important;
	}
	.morris-full {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
		margin-bottom: 30px;
	}
	.morris-full img {
		margin: 0 auto;
		display: block;
	}
	.dk-top {
		margin-top: 100px !important;
	}
}


/* Landscape */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
	#tsdw-bottom>.row {
		height: 95vh;
	}
	.ipad-full {
		height: 100vh;
	}
	#tsdw-bottom {
		height: 100vh;
	}
	.work-detail-main>div>div {
		margin-top: 0px !important;
	}
	.mor-main img {
		padding-top: 150px !important;
	}
	.mor-logo {
		margin-left: 0px !important;
		padding-top: 150px !important;
	}
	.mor-fo {
		bottom: 15px;
	}
	.wdm-sc {
		display: none;
	}
	.ipad-full .col-md-2 {
		display: none;
	}
	.thhh {
		margin-top: -180px !important;
	}
	.lasss {
		margin-top: -220px !important;
	}	
	
}

.dkipad-scroll {
	display: none;
}

/* ----------- iPad 3, 4 and Pro 9.7" ----------- */
/* Portrait and Landscape */


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) {
	p.secondmain-p {
		padding-left: 0px !important;
		padding-top: 0px !important;
	}
	p.thirdmain-p {
		top: 0px !important;
	}
	.about-first-p {
		padding-top: 0% !important;
		padding-left: 0% !important;
	}
	.secoo {
		margin-top: 0px !important;
	}
	.thhh {
		margin-top: -80px !important;
	}
	.lasss {
		margin-top: -20px !important;
	}
	/*-144*/
	.cn-se-p {
		font-size: 18px !important;
		padding-left: 40px !important;
	}
	.cn-fi-p {
		padding: 60px 0px 30px 20px !important;
		font-size: 20px !important;
	}
	#tsdw-bottom {
		padding-top: 0px;
	}
	#player .ytp-cued-thumbnail-overlay-image {
		background-size: auto !important;
	}
	.responsive-container {
		position: relative;
		padding-bottom: 50.25%;
		padding-top: 0px;
		height: 0;
		overflow: hidden;
	}
	.responsive-container iframe {
		position: absolute;
		top: 0;
		left: 0;
		border: 0;
		width: 100%;
		height: 100%;
	}
	.wdm-img1 h5 {
		margin: 10px 50px 90px 50px !important;
	}
	.work-side {
		padding-left: 15px;
	}
}


/* Portrait */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
	#tsdw-bottom {
		position: relative;
	}
	.maindd {
		margin-top: 0px;
	}
	.wdm-sc {
		display: none;
	}
	.about-box p {
		font-size: 18px !important;
		line-height: 24px !important;
	}
	.ab-read a {
		color: #fff;
	}
	.about-box h2,
	.work-main h2,
	.service-main h2 {
		/*margin-left: 0px!important;*/
	}
	.ipad-img {
		-ms-flex: 0 0 25%;
		flex: 0 0 25%;
		max-width: 25%;
	}
	.ipad-first {
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		max-width: 50%;
	}
	.ipad-second {
		-ms-flex: 0 0 75%;
		flex: 0 0 75%;
		max-width: 75%;
		padding: 30px 0px 0px 15px !important;
	}
	.ipad-hide {
		display: none;
	}
	.ix-75 {
		flex: 0 0 75%;
		max-width: 75%;
		padding: 30px 0px 0px 15px !important;
	}
	.ipad-second .secondmain-p {
		padding-left: 0px !important;
		margin-bottom: 0px;
	}
	.wipf {
		-ms-flex: 0 0 33.333333%;
		flex: 0 0 33.333333%;
		max-width: 33.333333%;
	}
	.wips {
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		max-width: 50%;
	}
	.wipt {
		-ms-flex: 0 0 16.666667%;
		flex: 0 0 16.666667%;
		max-width: 16.666667%;
	}
	.work-side {
		padding-left: 30px;
	}
	.work-side {
		position: relative !important;
		top: unset !important;
		left: unset !important;
		margin-right: unset !important;
		transform: unset !important;
	}
	.work-top h4 {
		margin-bottom: 65px;
	}
	.ix-100 {
		max-width: 100%;
		flex: 0 0 100%;
		margin-bottom: 30px;
	}
	p.firstmain-p {
		padding-top: 0px !important;
	}
	.work-detail-main {
		padding-top: 30px;
	}
	.mor-fo {
		position: absolute;
		bottom: 30px;
	}
}


/* Landscape */

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
	#tsdw-bottom>.row {
		height: 95vh;
	}
	.ipad-full {
		height: 100vh;
	}
	#tsdw-bottom {
		height: 100vh;
	}
	.thhh {
		margin-top: -180px !important;
	}
	.lasss {
		margin-top: -220px !important;
	}	
}


/* Landscape */

@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
	.ipad-full {
		height: 100vh;
	}
	.responsive-container {
		position: relative;
		padding-bottom: 50.25%;
		padding-top: 0px;
		height: 0;
		overflow: hidden;
	}
	.responsive-container iframe {
		position: absolute;
		top: 0;
		left: 0;
		border: 0;
		width: 100%;
		height: 100%;
	}
}


/* Portrait */

@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
	.maindd {
		margin-top: 0px !important;
	}
}

@media screen and (min-width: 1025px) and (max-width: 1078px) {
	.cn-se-p {
		font-size: 18px !important;
		padding-left: 40px !important;
	}
	.cn-fi-p {
		padding: 60px 0px 30px 40px !important;
	}
}


/* ----------- iPad Pro 10.5" ----------- */


/* Portrait and Landscape */

@media only screen and (min-device-width: 834px) and (max-device-width: 1112px) and (-webkit-min-device-pixel-ratio: 2) {}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
@media only screen and (min-device-width: 834px) and (max-device-width: 834px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {}


/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
@media only screen and (min-device-width: 1112px) and (max-device-width: 1112px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {}


/* ----------- iPad Pro 12.9" ----------- */
/* Portrait and Landscape */
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2) {}


/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {}


/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
@media only screen and (min-device-width: 1366px) and (max-device-width: 1366px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {}


/* iPhone X */
@media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 3) {
	.vertical-scrolling {
		height: 100%;
	}
}

@media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 3) {
	.home-scroll img {
		width: 40px;
	}
	#after-video3 img {
		width: 68%;
	}
	p.firstmain-p {
		padding-left: 2px !important;
		padding-top: 0px !important;
		font-size: 15px !important;
		line-height: 24px !important;
	}
	p.secondmain-p {
		font-size: 15px !important;
		line-height: 24px !important;
		margin-top: -66px;
	}
	p.thirdmain-p {
		font-size: 15px !important;
		line-height: 24px !important;
	}
	.ix-100 {
		max-width: 100%;
		flex: 0 0 100%;
	}
	.ix-83 {
		max-width: 83.333333%;
		flex: 0 0 83.333333%;
	}
	.ix-75 {
		flex: 0 0 75%;
		max-width: 75%;
		padding-left: 15px !important;
		margin-top: -45px;
	}
	.gen-nav {
		bottom: 0% !important;
	}
	.service-main li a {
		font-size: 22px !important;
		line-height: 30px !important;
	}
	.service-main li {
		font-size: 24px !important;
	}
	.work-top h4 {
		margin-bottom: 40px !important;
	}
	.wo-top-ul {
		margin-bottom: 20px !important;
		font-size: 16px !important;
	}
	.wo-bottom-ul {
		margin-bottom: 20px !important;
		font-size: 16px !important;
	}
	.work-main {
		padding: 35px 0 !important;
	}
	.cn-fi-p {
		padding: 20px 0px 10px 20px !important;
	}
	#contact .hmaf-logo {
		padding-top: 0% !important;
	}
	.cn-follow {
		padding: 10px 0 !important;
	}
}


/* iPhone 11 pro */

@media only screen and (min-device-width: 414px) and (max-device-width: 896px) and (orientation: landscape) {
	.hmaf-logo img {
		width: 80px !important;
	}
}

@media only screen and (min-device-width: 414px) and (max-device-width: 896px) and (orientation: portrait) {
	.hmaf-logo img {
		width: 80px !important;
	}
}


/* ----------- iPhone 6, 6S, 7 and 8 ----------- */
/* Portrait */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {}

/* Landscape */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
	.home-scroll img {
		width: 40px;
	}
	#after-video3 img {
		width: 68%;
	}
	.ix-100 {
		max-width: 100%;
		flex: 0 0 100%;
		padding-top: 0% !important;
		padding-left: 0% !important;
	}
	.ix-83 {
		max-width: 83.333333%;
		flex: 0 0 83.333333%;
		padding-top: 0% !important;
		padding-left: 0% !important;
	}
	.ix-75 {
		flex: 0 0 75%;
		max-width: 75%;
		padding-left: 15px !important;
		margin-top: -30px;
	}
	p.firstmain-p {
		padding-left: 15px !important;
		padding-top: 0px !important;
		font-size: 12px !important;
		line-height: 18px !important;
	}
	p.secondmain-p {
		font-size: 12px !important;
		line-height: 18px !important;
		margin-top: -50px;
		padding-left: 0px !important;
		padding-top: 0px !important;
	}
	p.thirdmain-p {
		font-size: 12px !important;
		line-height: 18px !important;
		top: -20px !important;
	}
	.about-box,
	.service-main,
	.work-main,
	.contact-main {
		padding: 0px 0px 0px 0px !important;
		margin-bottom: 50px;
	}
	.fp-section,
	.fp-section>div {
		height: 100% !important;
	}
}

@media (orientation: landscape) and (max-width: 767px) {
	.home-scroll img {
		width: 30px;
	}
	.hmaf-logo img {
		width: 55px !important;
	}
	#after-video3 img {
		width: 50%;
	}
	.hmaf-center {
		top: 40% !important;
	}
	.ix-100 {
		max-width: 100%;
		flex: 0 0 100%;
		padding-top: 0% !important;
		padding-left: 0% !important;
	}
	.ix-83 {
		max-width: 83.333333%;
		flex: 0 0 83.333333%;
		padding-top: 0% !important;
		padding-left: 0% !important;
	}
	.ix-75 {
		flex: 0 0 75%;
		max-width: 75%;
		padding-left: 15px !important;
		margin-top: -40px;
	}
	p.firstmain-p {
		padding-left: 15px !important;
		padding-top: 0px !important;
		font-size: 12px !important;
		line-height: 18px !important;
	}
	p.secondmain-p {
		font-size: 12px !important;
		line-height: 18px !important;
		margin-top: -50px;
		padding-left: 0px !important;
		padding-top: 0px !important;
	}
	p.thirdmain-p {
		font-size: 12px !important;
		line-height: 18px !important;
		top: 0px !important;
		margin-top: -20px;
	}
	.about-box,
	.service-main,
	.work-main,
	.contact-main {
		padding: 5px 0 !important;
	}
	.gen-nav li a {
		font-size: 14px !important;
	}
	.gen-nav {
		right: 4% !important;
	}
	.home-scroll {
		bottom: 30% !important;
	}
	.service-box {
		top: 50% !important;
	}
	.service-main li {
		font-size: 22px !important;
		margin: 9px 0 !important;
	}
	.service-main li a {
		font-size: 20px !important;
		line-height: 10px !important;
	}
	.work-side {
		position: relative !important;
		top: unset !important;
		left: unset !important;
		margin-right: unset !important;
		transform: unset !important;
	}
	.wo-top-ul,
	.wo-bottom-ul,
	.wo-desc {
		margin-bottom: 0px !important;
	}
	.work-top h4 {
		margin-bottom: 20px !important;
	}
	.wo-top-ul li,
	.wo-bottom-ul li,
	.wo-desc a {
		font-size: 14px !important;
	}
	.cn-img {
		max-width: 50% !important;
		margin-left: 0% !important;
	}
	#contact .hmaf-logo {
		padding-left: 5% !important;
	}
	.cn-fi-p {
		font-size: 18px !important;
	}
	.cn-se-p {
		font-size: 18px !important;
		padding-left: 35px !important;
	}
	.cn-follow {
		padding: 10px 50px !important;
		font-size: 16px !important;
	}
	.cn-soci img {
		width: 20px !important;
	}
	.cn-fi-p {
		padding: 20px 0px 10px 20px !important;
	}
	.cnt-logo {
		margin-top: 0px !important;
	}
	.wdm-box {
		position: relative !important;
		top: unset !important;
		left: unset !important;
		margin-right: unset !important;
		transform: unset !important;
	}
	.wdm-box img {
		margin-bottom: 40px;
	}
	.wdm-box1,
	.mor-fo {
		padding: 0 0 20px 0;
	}
	.mor-main img,
	.mor-logo {
		margin-bottom: 40px;
	}
	.secoo {
		margin-bottom: 40px !important;
		margin-top: 0px !important;
	}
	.thhh {
		margin-left: 0px !important;
		margin-top: 0px !important;
		margin-bottom: 40px !important;
	}
	.lasss {
		margin-top: 0px !important;
		margin-bottom: 40px !important;
	}
	.dk-scroll {
		position: unset !important;
		bottom: unset !important;
		padding: 15px 15px;
	}
	.wdm-sc {
		display: none;
	}
	.wo-bottom-ul {
		margin-top: 25px;
		margin-bottom: 25px !important;
	}
}

@media (orientation: portrait) and (max-width: 576px) {
	p.thirdmain-p {
		top: -5px !important;
	}
	p.secondmain-p {
		margin-top: -10px;
	}
	.hmaf-logo {
		padding-top: 10% !important;
	}
	#contact .hmaf-logo {
		padding-top: 0% !important;
		padding-bottom: 5%;
		padding-left: 5% !important;
	}
	.hmaf-center {
		top: 44% !important;
	}
	.wdm-sc {
		display: none;
	}
	.mor-main img,
	.mor-logo,
	.wdm-box img,
	.secoo img,
	.thhh img,
	.lasss img {
		margin-bottom: 40px;
	}
	.wdm-img {
		padding: 40px 0;
	}
	.about-box p {
		font-size: 18px !important;
		line-height: 24px !important;
	}
	.secondmain-p,
	.thirdmain-p {
		display: none;
	}
	.ab-read {
		display: block !important;
	}
	.ab-read a {
		color: #fff;
	}
	.wdm-img1 h5 {
		margin: 0 0 40px 0 !important;
	}
	.hmaf-logo img {
		width: 85px !important;
	}
}

.ab-read {
	display: none;
}

body {
	background-color: #030303;
}

.videota {
	background: black;
	width: 100%;
	height: 99vh;
}

.hmaf-logo {
	padding-top: 3%;
	padding-left: 13%;
}

.hmaf-logo img {
	width: 14%;
}

.home-intro {
	width: 100%;
	height: 100vh;
	opacity: 1 !important;
}

.hmaf-center {
	font-family: 'originlight';
	position: absolute;
	top: 48%;
	left: 51%;
	margin-right: -50%;
	transform: translate(-51.5%, -36%);
	font-size: 51px;
	color: #fff;
	text-transform: uppercase;
	font-weight: 100;
	text-align: center;
}

.gen-nav {
	position: fixed;
	bottom: 5%;
	right: 12%;
	transform: translate(0%, 0%);
	z-index: 11;
}

.gen-nav ul {
	padding-inline-start: 0px;
}

.gen-nav li {
	list-style: none;
}

.gen-nav li a {
	color: #989797;
	text-transform: uppercase;
	font-size: 18px;
	font-weight: 100;
}

.gen-nav li a:hover {
	text-decoration: none;
}

#afintro .row,
#services .row {
	height: 100vh;
}

.about-box p {
	color: #fff;
	font-size: 20px;
	line-height: 30px;
	font-weight: 100;
}

.about-box h2,
.work-main h2,
.service-main h2,
.contact-main h2 {
	color: #fff;
	font-weight: 100;
	font-size: 28px;
	margin-left: 30px;
}

.service-main li {
	margin: 9px 0;
	list-style-type: square;
	color: white;
	font-size: 30px;
	font-family: inherit;
}

.service-main h2 {
	color: #fff;
	font-weight: 100;
	font-size: 28px !important;
}

.service-main li a {
	color: #fff;
	text-transform: uppercase;
	font-size: 28px;
	font-weight: 100;
	line-height: 60px;
}

.service-main li a:hover {
	text-decoration: none;
}

.service-box {
	position: absolute;
	top: 50%;
	left: 45%;
	margin-right: -50%;
	transform: translate(-50%, -70%);
}

.service-box-home {
	width: 50%;
	margin-left: 25%;
	padding: 100px 0;
}

.cn-fi-p {
	font-size: 24px;
	color: #fff;
	padding: 60px 0px 30px 60px;
	margin-bottom: 0px;
	font-weight: 100;
}

.cn-se-p {
	font-size: 24px;
	color: #fff;
	padding-left: 100px;
	margin-bottom: 0px;
	font-weight: 100;
}

.cn-follow {
	font-size: 24px;
	color: #fff;
	padding: 30px 0;
	margin-bottom: 0px;
	font-weight: 100;
}

.cn-soci {
	display: inline-block;
}

.cn-soci li {
	list-style: none;
	display: inline-block;
	padding: 0px 30px;
}

.cn-soci img {
	width: 30px;
}

.work-top h4 {
	text-align: center;
	font-size: 25px;
	color: #fff;
	font-weight: 100;
	margin-bottom: 50px;
}

.work-top span {
	font-size: 20px;
}

.work-top p {
	text-align: center;
	font-size: 18px;
	color: #fff;
}

.wo-top-ul,
.wo-bottom-ul {
	padding-inline-start: 0px;
}

.wo-top-ul li {
	color: #fff;
	font-size: 18px;
	list-style: none;
	font-weight: 100;
}

.wo-bottom-ul li {
	color: #fff;
	font-size: 18px;
	list-style: none;
	font-weight: 100;
}

.wo-img-box img {
	width: 100%;
}

.wo-desc {
	color: #fff;
	font-size: 18px;
	font-weight: 100;
}

.wo-top-ul {
	margin-bottom: 50px;
}

.wo-desc a {
	color: #fff;
	text-decoration: none;
}

.wo-doc-box {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
}

.work-loop {
	padding: 0 0 0 0;
	height: 100%;
}

.work-loop1 {
	padding: 200px 0 0 0;
}

.secoo {
	margin-bottom: -76px;
	margin-top: -30px;
}

.thhh {
	margin-left: 0px;
	margin-top: -96px;
}

.lasss {
	margin-top: -197px;
}

.maindd {
	margin-top: 40px;
}

.work-side {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
}

.wo-bottom-ul {
	margin-bottom: 70px;
}

.wdm-box {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
}

.wdm-sc {
	padding: 70px 0 80px 30px;
}

.wdm-img1 h5 {
	color: white;
	font-size: 20px;
	font-weight: 100;
	text-align: center;
	margin: 50px;
}

.wdm-img {
	padding: 50px 0;
}

.dkimg {
	margin-bottom: 40px;
}

.menu-active {
	opacity: 22%;
}

.about-first-p {
	padding-top: 5%;
	padding-left: 5%;
}

.about-last-p {
	margin-top: -10%;
}

.cn-img {
	max-width: 75%;
	height: auto;
	margin-left: -10%;
}

.service-scroll {
	position: absolute;
	bottom: 8%;
	left: 10%;
}

.about-scroll {
	position: absolute;
	bottom: 8%;
	left: 10%;
}

.home-scroll {
	position: absolute;
	bottom: 15%;
	left: 13%;
}

.about-box,
.service-main,
.work-main,
.contact-main {
	padding: 50px 0;
}

.hide {
	display: none;
}

.cnt-logo {
	margin-top: 2.5%;
}

.dkimg {
	width: 80%;
	margin-left: 10%;
}

.dk-scroll {
	position: fixed;
	bottom: 5%;
	padding-left: 5%;
}

.tsdw-scroll {
	position: absolute;
	bottom: 0%;
	left: 4%;
	padding-bottom: 13px;
}

.wdm-sc img {
	margin-top: -30px;
	margin-bottom: 30px;
}


/* #about{height:100vh;}*/

#services {
	height: 100vh;
}

#work {}

#contact {
	height: 100vh;
}

p.firstmain-p {
	padding-left: 2px;
	padding-top: 32px;
}

p.thirdmain-p {
	position: relative;
	top: -69px;
}

p.secondmain-p {
	padding-left: 100px;
	padding-top: 30px;
}

@media (max-width:2600px) and (min-width:1556px) {
	p.firstmain-p {
		padding-left: 24px !important;
	}
	p.thirdmain-p {
		top: -109px !important;
	}
}

@media (max-width:1555px) and (min-width:1442px) {
	p.firstmain-p {
		padding-left: 24px !important;
	}
	p.thirdmain-p {
		top: -70px !important;
	}
}

@media (max-width:1441px) and (min-width:1284px) {
	p.firstmain-p {
		padding-left: 24px !important;
	}
	p.thirdmain-p {
		top: -40px !important;
	}
	p.secondmain-p {
		padding-left: 20px !important;
	}
	.thirdmain-p {
		top: -7px !important;
	}
	.gen-nav {
		right: 4% !important;
	}
}

@media (max-width:1283px) and (min-width:1140px) {
	.secondboxx {
		display: block !important;
	}
	/* .firstboxx{display:none !important; }*/
	p.firstmain-p {
		padding-top: 9px !important;
		padding-left: 22px;
	}
	p.secondmain-p {
		padding-left: 49px !important;
	}
	.thirdmain-p {
		top: -24px !important;
	}
	p#firstptag {
		display: none;
	}
	p#secptag {
		display: inline-block !important;
	}
}

@media (max-width:1139px) and (min-width:1083px) {
	.secondboxx {
		display: block !important;
	}
	p.firstmain-p {
		padding-top: 9px !important;
		padding-left: 22px;
	}
	p.secondmain-p {
		padding-left: 29px !important;
	}
	.thirdmain-p {
		top: -7px !important;
	}
	p#firstptag {
		display: none;
	}
	p#secptag {
		display: inline-block !important;
	}
}

@media (max-width:1082px) and (min-width:1003px) {
	.secondboxx {
		display: block !important;
	}
	p.firstmain-p {
		padding-top: 9px !important;
		padding-left: 22px;
	}
	p.secondmain-p {
		padding-left: 27px !important;
	}
	.thirdmain-p {
		top: -7px !important;
	}
	p#firstptag {
		display: none;
	}
	p#secptag {
		display: inline-block !important;
	}
}

@media (max-width:1002px) and (min-width:884px) {
	.secondboxx {
		display: block !important;
	}
	/*.firstboxx{display:none !important; }*/
	p.firstmain-p {
		padding-top: 0px !important;
		padding-left: 22px;
	}
	p.secondmain-p {
		padding-left: 27px !important;
	}
	.thirdmain-p {
		top: -7px !important;
	}
	p#firstptag {
		display: none;
	}
	p#secptag {
		display: inline-block !important;
	}
}

.close:not(:disabled):not(.disabled):focus,
.close:not(:disabled):not(.disabled):hover {
	opacity: 1 !important;
}

.close {
	color: white !important;
	font-size: 35px !important;
	font-weight: 100 !important;
	opacity: 1 !important;
}