@media (max-width: 575.98px) {
	/*navbar*/
		.button-contact {
			display : block;
			text-align : center;
		}
		.navbar-light .navbar-toggler {
			color: rgba(0,0,0,.5);
			border-color: rgba(255, 255, 255, 0.56);
		}
		.navbar-light .navbar-toggler-icon {
			background-image: url(/assets/front-end/images/download.png);
		}
		.navbar-expand-lg .navbar-nav .nav-link {
			padding-right: 0.5rem;
			padding-left: 0.5rem;
		}
	/*navbar*/
	/*main banner-section*/
		.banner-section {
			width : 100%;
			height: 100%;
			background-color: #321c49;
			background-position: center;
			background-size: cover;
			background-image: url(https://advika.id/assets/front-end/images/background/background-banner-section.png);
		}
		.banner-section .title-banner-section h1 {
			font-size : 36px;
			color: #fff;
		}
		.banner-section .title-banner-section h3 a {
			color: #fff;
		}
		.banner-section .title-banner-section h3 {
			font-size: 14px;
		}
		.banner-section .title-banner-section h3 a img {
			width : 38px;
		}
		.content-banner-section {
			padding: 140px 20px; 
			padding-bottom : 40px;
		}
		.mobile-arrow-banner {
			display: inline-block;
		}
		.dekstop-arrow-banner {
			display : none;
		}
	/*main banner-section*/
	/*main ourapproach-section*/
		.our-approach .our-approach-content p {
			padding: 0;
			font-size: 13px;
			line-height: 24px;
		}
		.our-approach .our-approach-content h3 {
			font-size : 26px;
		}
		.our-approach .our-approach-content .title-service {
			font-size : 17px;
		}
	/*main ourapproach-section*/
	/*main ourclient-section*/
		.carousel-wrap {
			width : 73%;
			padding : 0;
		}
		.owl-nav > button img {
			width: 30px;
		}
		.owl-nav .owl-next {
			right: -30px;
		}
		.owl-nav .owl-prev {
			left: -30px;
		}
		.owl-nav > button {
			top : 58%;
		}
		.our-client .owl-carousel .owl-item img {
			width: 80%;
			display : block;
			margin : 0 auto;
		}
		.our-client .our-client-content h3 {
			font-size: 26px;
		}
	/*main ourclient-section*/
	/*main creative-team*/
		.creative-team {
			width : 100%;
			height: 100%;
			background-position: left;
			background-size: auto;
		}
		.content-creativeteam-section {
			padding: 80px 40px;
		}
		.content-creativeteam-section .row .col-md-6:last-child {
			padding-left : 0;
		}
		.title-creative-team h1 {
			font-size : 26px;
		}
		.title-creative-team p {
			font-size : 13px;
		}
		.title-creative-team h3 a {
			font-size : 13px;
		}
	/*main creative-team*/
	/*main contact-us*/
		.contact-home .content-contact-section .row .col-md-6:first-child {
			padding: 40px;
			padding-top : 0;
		}
		.contact-home .content-contact-section .title-contact-home h1 {
			font-size: 26px;
		}
		.contact-home .content-contact-section .title-contact-home p {
			font-size: 13px;
		}
		.contact-home .content-contact-section .title-contact-home a {
			font-size : 10px;
		}
	/*main contact-us*/
	/*footer*/
		.top-footer {
			width : 100%;
			background-image: inherit;
			padding: 0;
			border-top: 2px solid #58176f;
		}
		.content-footer .col-md-8 {
			margin-top : 20px;
			background-color : #58176f;
		}
		.content-footer .member-partner-wrap .col-md-3 {
			background-color: #fff;
		}
		.content-footer .col-md-3 {
			background-color: #321c49;
		}
		.content-footer .col-md-3, .content-footer .col-md-1 {
			padding-top : 20px;
			padding-bottom : 20px;
		}
		.content-footer .col-md-3 ul {
			margin : 0;
		}
		.content-footer .member-partner-wrap .col-md-3 ul {
			margin-bottom : 1rem;
		}
		.member-partner-wrap {
			padding-top: 20px;
		}
		.partner-of p, .member-of p {
			font-weight : 800;
			text-align : center;
		}
	/*footer*/
	/*-----------------page service---------------*/
	.title-banner-page-service h1 {
		color : #fff;
	}
	.title-banner-page-service p {
		color : #fff;
	}
	.title-banner-page-service h3 a {
		color : #fff;
	}
	/*-----------------page service---------------*/
	/*-----------------page work---------------*/
		.contact-home.work-approach {
			width : 100%;
			background-position: left;
			padding : 20px 0;
			height : 100%;
			background-size : cover;
		}
		.banner-section.page-work .title-banner-page-service h1, .banner-section.page-work .title-banner-page-service p {
			color : #212529;
		}
		.banner-section.page-work .content-banner-section {
			padding: 160px 20px;
			padding-bottom : 20px;
		}
		.banner-section.page-work {
			background-position : inherit;
		}
		.our-client.work-portfolio .carousel-wrap {
			width: 73% !important;
			padding: 0 !important;
		}
		.wrap-header-pop-up {
			background-size: cover;
			background-position: right;
		}
		.contact-home.work-contact-home .content-contact-section .row .col-md-6:first-child {
			padding: 20px 40px;
		}
	/*-----------------page work---------------*/
	/*-----------------page about---------------*/
		.contact-home.work-approach.page-contact {
			width : 100%;
			height: 100%;
		}
	/*-----------------page about---------------*/
	/*-----------------page contact---------------*/
		.banner-section.page-contact .content-banner-section .col-md-6:first-child {
			padding-right: 20px;
		}
		.page-contact .form-check-label {
			color : #fff;
		}
	/*-----------------page contact---------------*/
	.desc-pop-up-work {
		padding: 10px;
	}
	.client-service-content {
		padding : 20px 10px;
	}
	.pop-up-work-img {
		width: 100%;
	}
	.modal-open .modal {
		padding-right : 0 !important;
	}
	.portfolio-detail .btn-pop-up-mobile {
		display : block;
	}
	.portfolio-detail .btn-pop-up-dekstop {
		display : none;
	}
	.contact-home.work-approach .content-contact-section .row .col-md-6:last-child {
		padding: 40px 30px;
	}
}

@media (min-width: 576px) and (max-width: 767.98px) { 
	/*navbar*/
		.button-contact {
			display : block;
			text-align : center;
		}
		.navbar-light .navbar-toggler {
			color: rgba(0,0,0,.5);
			border-color: rgba(255, 255, 255, 0.56);
		}
		.navbar-light .navbar-toggler-icon {
			background-image: url(/assets/front-end/images/download.png);
		}
	/*navbar*/
	/*main banner-section*/
		.banner-section {
			width : 100%;
			height: 100%;
			background-position: center;
			background-size: cover;
			background-image: url(https://advika.id/assets/front-end/images/background/background-banner-section.png);
		}
		.banner-section .title-banner-section h1 {
			font-size : 36px;
			color: #fff;
		}
		.banner-section .title-banner-section h3 a {
			color: #fff;
		}
		.banner-section .title-banner-section h3 {
			font-size: 14px;
		}
		.banner-section .title-banner-section h3 a img {
			width : 38px;
		}
		.content-banner-section {
			padding: 120px 60px; 
			padding-bottom : 40px;
		}
		.mobile-arrow-banner {
			display: inline-block;
		}
		.dekstop-arrow-banner {
			display : none;
		}
		.navbar-expand-lg .navbar-nav .nav-link {
			padding-right: 0.5rem;
			padding-left: 0.5rem;
		}
	/*main banner-section*/
	/*main ourapproach-section*/
		.our-approach .our-approach-content p {
			padding: 0;
			font-size: 13px;
			line-height: 24px;
		}
		.our-approach .our-approach-content h3 {
			font-size : 26px;
		}
		.our-approach .our-approach-content .title-service {
			font-size : 17px;
		}
	/*main ourapproach-section*/
	/*main ourclient-section*/
		.carousel-wrap {
			width : 73%;
			padding : 0;
		}
		.owl-nav > button img {
			width: 30px;
		}
		.owl-nav .owl-next {
			right: -30px;
		}
		.owl-nav .owl-prev {
			left: -30px;
		}
		.owl-nav > button {
			top : 58%;
		}
		.our-client .owl-carousel .owl-item img {
			width: 80%;
			display : block;
			margin : 0 auto;
		}
		.our-client .our-client-content h3 {
			font-size: 26px;
		}
	/*main ourclient-section*/
	/*main creative-team*/
		.creative-team {
			width : 100%;
			height: 100%;
			background-size : cover;
		}
		.content-creativeteam-section {
			padding: 80px 40px;
		}
		.content-creativeteam-section .row .col-md-6:last-child {
			padding-left : 0;
		}
		.title-creative-team h1 {
			font-size : 26px;
		}
		.title-creative-team p {
			font-size : 13px;
		}
		.title-creative-team h3 a {
			font-size : 13px;
		}
	/*main creative-team*/
	/*main contact-us*/
		.contact-home .content-contact-section .row .col-md-6:first-child {
			padding: 40px;
			padding-top : 0;
		}
		.contact-home .content-contact-section .title-contact-home h1 {
			font-size: 26px;
		}
		.contact-home .content-contact-section .title-contact-home p {
			font-size: 13px;
		}
		.contact-home .content-contact-section .title-contact-home a {
			font-size : 10px;
		}
	/*main contact-us*/
	/*footer*/
		.top-footer {
			width : 100%;
			background-image: inherit;
			padding: 0;
			border-top: 2px solid #58176f;
		}
		.content-footer .col-md-8 {
			margin-top : 20px;
			background-color : #58176f;
		}
		.content-footer .col-md-3, .content-footer .col-md-1 {
			padding-top : 20px;
		}
		.content-footer .col-md-3 ul {
			margin : 0;
		}
		.content-footer .member-partner-wrap .col-md-3 ul {
			margin-bottom : 1rem;
		}
		.member-partner-wrap {
			padding-top: 20px;
			float: left;
		}
		.top-footer .container, .bottom-footer .container {
			max-width: 100%;
		}
	/*footer*/
	/*-----------------page service---------------*/
	.title-banner-page-service h1 {
		color : #fff;
	}
	.title-banner-page-service p {
		color : #fff;
	}
	.title-banner-page-service h3 a {
		color : #fff;
	}
	/*-----------------page service---------------*/
	/*-----------------page work---------------*/
		.contact-home.work-approach {
			width : 100%;
			background-position: left;
			padding : 20px 0;
			height : 100%;
			background-size: cover;
		}
		.banner-section.page-work .title-banner-page-service h1, .banner-section.page-work .title-banner-page-service p {
			color : #212529;
		}
		.banner-section.page-work .content-banner-section {
			padding: 160px 20px;
			padding-bottom : 20px;
			padding-right : 40px;
		}
		.banner-section.page-work {
			background-position : center;
		}
	/*-----------------page work---------------*/
	/*-----------------page about---------------*/
		.contact-home.work-approach.page-contact {
			width : 100%;
			background-position: right;
			background-size: cover;
			height : 100%;
		}
	/*-----------------page about---------------*/
	/*-----------------page contact---------------*/
		.banner-section.page-contact .content-banner-section .col-md-6:first-child {
			padding-right: 20px;
		}
		.page-contact .form-check-label {
			color : #fff;
		}
	/*-----------------page contact---------------*/
	.portfolio-detail .btn-pop-up-mobile {
		display : block;
	}
	.portfolio-detail .btn-pop-up-dekstop {
		display : none;
	}
	.desc-pop-up-work {
		padding : 10px;
	}
	.client-service-content {
		padding: 40px 20px;
	}
	.pop-up-work-img {
		width: 100%;
	}
	.wrap-header-pop-up {
		background-position: right;
		background-size: cover;
	}
	.contact-home.work-contact-home .content-contact-section .row .col-md-6:first-child {
		padding: 20px 40px;
	}
	.contact-home.work-approach .content-contact-section .row .col-md-6:last-child {
		padding: 60px 30px;
	}
}

@media (min-width: 768px) and (max-width: 991.98px) {
	/*navbar*/
		.navbar-light .navbar-toggler {
			color: rgba(0,0,0,.5);
			border-color: rgba(255, 255, 255, 0.56);
		}
		.navbar-light .navbar-toggler-icon {
			background-image: url(/assets/front-end/images/download.png);
		}
		.navbar-expand-lg .navbar-nav .nav-link {
			padding-right: 0.5rem;
			padding-left: 0.5rem;
		}
		.button-contact {
			display : block;
			text-align : center;
		}
	/*navbar*/
	/*main-banner section*/
		.banner-section {
			background-position: center;
			width: 100%;
			font-size: 36px;
			height : 100%;
		}
		.banner-section .title-banner-section h3 a img {
			width: 46px;
		}
		.banner-section .title-banner-section h3 a {
			font-size : 16px;
		}
		.banner-section .title-banner-section h1 {
			font-size: 36px;
		}
		.content-banner-section {
			padding: 130px 40px;
		}
		.banner-section.service .content-banner-section {
			padding: 140px 40px;
		}
	/*main-banner section*/
	/*our-approach*/
		.our-approach .our-approach-content p {
			padding: 0 60px;
			font-size: 13px;
		}
		.our-approach .our-approach-content h3 {
			font-size : 26px;
		}
		.our-approach .our-approach-content .title-service {
			font-size: 18px;
		}
	/*our-approach*/
	/*our-client*/
		.our-client .our-client-content h3 {
			font-size : 26px;
		}
	/*our-client*/
	/*creative-team*/
		.creative-team {
			width : 100%;
			background-position: center;
		}
		.title-creative-team h1 {
			font-size : 26px;
		}
		.title-creative-team p {
			font-size : 14px;
		}
		.title-creative-team h3 a {
			font-size : 14px;
		}
		.content-creativeteam-section {
			padding: 20px 0px;
		}
	/*creative-team*/
	/*contact-us*/
		.contact-home .content-contact-section .title-contact-home h1 {
			font-size: 26px;
		}
		.contact-home .content-contact-section .title-contact-home p {
			font-size : 14px;
		}
		.contact-home .content-contact-section .title-contact-home a {
			font-size: 10px;
		}
		.image-contact-us {
			padding-top : 20px;
		}
		.contact-home .content-contact-section .row .col-md-6:first-child {
			padding: 20px 40px !important;
		}
	/*contact-us*/
	/*footer*/
		.top-footer {
			width: 100%;
			background-position-x: 80%;
		}
		.content-footer .col-md-8 .col-md-3 ul li img {
			width: 64px;
		}
		.content-footer .col-md-8 .col-md-9 ul li img {
			width: 112px;
		}
		.content-footer .col-md-3 {
			font-size: 11px;
		}
		.content-footer .col-md-1 a {
			font-size : 14px;
		}
		.content-footer .col-md-3 ul li img {
			width: 26px;
		}
	/*footer*/
	/*-----------------page service---------------*/
	/*-----------------page service---------------*/
	/*-----------------page work---------------*/
		.contact-home.work-approach {
			width : 100%;
			background-position: top;
			padding : 20px 0;
		}
		.banner-section.page-work .title-banner-page-service h1, .banner-section.page-work .title-banner-page-service p {
			color : #212529;
		}
		.banner-section.page-work .content-banner-section {
			padding: 160px 20px;
			padding-bottom : 20px;
		}
		.banner-section.page-work {
			background-position : center;
			background-size: cover;
			height : 100%;
		}
	/*-----------------page work---------------*/
	/*-----------------page about---------------*/
		.contact-home.work-approach.page-contact {
			width : 100%;
			height : 100%;
			background-size: cover;
			background-position: left;
		}
	/*-----------------page about---------------*/
	/*-----------------page contact---------------*/
		.banner-section.page-contact .content-banner-section .col-md-6:first-child {
			padding-right: 20px;
		}
		.page-contact .form-check-label {
			font-size : 15px;
		}
	/*-----------------page contact---------------*/
	.banner-section .title-banner-section h1 {
		font-size : 40px;
	}
	.our-approach .our-approach-content h3 {
		font-size : 26px;
	}
	.banner-section .title-banner-section h3 a {
		font-size : 15px;
	}
	.banner-section .title-banner-section h3 a img {
		width : 40px;
	}
	.our-approach .our-approach-content .title-service {
		font-size : 15px;
	}
	.title-creative-team h1 {
		font-size : 26px;
	}
	.title-creative-team p, .title-creative-team h3 a {
		font-size : 13px;
	}
	.contact-home .content-contact-section .title-contact-home h1 {
		font-size : 26px;
	}
	.contact-home .content-contact-section .title-contact-home p {
		font-size : 13px;
	}
	.navbar .navbar-nav .nav-item .nav-link {
		font-size : 14px;
	}
	.button-contact {
		font-size : 12px;
	}
	.content-footer .col-md-1 a {
		font-size : 13px;
	}
	.partner-of p, .member-of p {
		font-size : 11px;
	}
	.content-footer .col-md-8 .col-md-3 ul li img {
		width: 54px;
	}
	.content-footer .col-md-3 ul li img {
		width: 22px;
	}
	.title-banner-page-service h1 {
		font-size: 26px;
	}
	.title-banner-page-service p {
		font-size: 13px;
	}
	.title-banner-page-service h3 a {
		font-size: 13px;
	}
	.our-client .our-client-content h3 {
		font-size : 26px;
	}
	.contact-home.work-approach {
		width : 100%;
		background-position: center;
		background-size: cover;
		height : 100%;
	}
	.contact-home.work-approach .content-contact-section .row .col-md-6:last-child {
		padding: 40px 30px;
	}
	.our-client.work-portfolio .owl-carousel .owl-item img {
		width: 100%;
	}
	.section-team-about-us h1 {
		font-size : 26px;
	}
	.section-team-about-us .row .col-md-3 p:first-child {
		font-size: 15px;
	}
	.section-team-about-us .row .col-md-3 p:nth-child(2) {
		font-size : 13px;
	}
	.section-team-about-us .row .col-md-3 .sosmed-team li img {
		width: 15px;
	}
	.page-contact .form-check-label {
		font-size : 14px;
	}
	.page-contact .form-control {
		font-size: 14px;
	}
	our-client {
		padding: 20px 0 !important;
	}
	.portfolio-detail .btn-pop-up-mobile {
		display : block;
	}
	.portfolio-detail .btn-pop-up-dekstop {
		display : none;
	}
	.modal-dialog {
		max-width : 700px;
	}
	.pop-up-work-img {
		width: 100%;
	}
	.logo-pop-up img {
		width : 200px;
	}
	.desc-pop-up-work {
		padding-bottom : 40px;
	}
	.wrap-header-pop-up {
		background-size: cover;
		background-position: right;
	}
	.content-footer .col-md-1 {
		padding-right : 0;
		padding-left : 10px;
	}
	
}

@media (min-width: 992px) and (max-width: 1199.98px) {
	/*main-banner section*/
		.banner-section {
			width: 100%;
		}
	/*main-banner section*/
	/*our-approach*/
	
	/*our-approach*/
	/*our-client*/
	
	/*our-client*/
	/*creative-team*/
		.creative-team {
			width : 100%;
			background-position: center;
		}
		.content-creativeteam-section {
			padding: 80px 80px;
		}
	/*creative-team*/
	/*contact-us*/
		.contact-home .content-contact-section .row .col-md-6:first-child {
			padding: 60px;
			padding: 40px 60px;
		}
	/*contact-us*/
	/*footer*/
		.top-footer {
			width: 100%;
		}
	/*footer*/
	.banner-section .title-banner-section h1 {
		font-size : 50px;
	}
	.our-approach .our-approach-content h3 {
		font-size : 30px;
	}
	.banner-section .title-banner-section h3 a {
		font-size : 16px;
	}
	.banner-section .title-banner-section h3 a img {
		width : 50px;
	}
	.our-approach .our-approach-content .title-service {
		font-size : 18px;
	}
	.title-creative-team h1 {
		font-size : 30px;
	}
	.title-creative-team p, .title-creative-team h3 a {
		font-size : 14px;
	}
	.contact-home .content-contact-section .title-contact-home h1 {
		font-size : 30px;
	}
	.contact-home .content-contact-section .title-contact-home p {
		font-size : 14px;
	}
	.navbar .navbar-nav .nav-item .nav-link {
		font-size : 14px;
	}
	.button-contact {
		font-size : 12px;
	}
	.content-footer .col-md-1 a {
		font-size : 14px;
	}
	.partner-of p, .member-of p {
		font-size : 12px;
	}
	.content-footer .col-md-8 .col-md-3 ul li img {
		width: 70px;
	}
	.content-footer .col-md-3 ul li img {
		width: 22px;
	}
	.title-banner-page-service h1 {
		font-size: 30px;
	}
	.title-banner-page-service p {
		font-size: 14px;
	}
	.title-banner-page-service h3 a {
		font-size: 14px;
	}
	.our-client .our-client-content h3 {
		font-size : 30px;
	}
	.contact-home.work-approach {
		width : 100%;
		background-position: center;
		height : 100%;
		background-size: cover;
	}
	.our-client.work-portfolio .owl-carousel .owl-item img {
		width: 100%;
	}
	.section-team-about-us h1 {
		font-size : 30px;
	}
	.section-team-about-us .row .col-md-3 p:first-child {
		font-size: 18px;
	}
	.section-team-about-us .row .col-md-3 p:nth-child(2) {
		font-size : 14px;
	}
	.section-team-about-us .row .col-md-3 .sosmed-team li img {
		width: 20px;
	}
	.page-contact .form-check-label {
		font-size : 14px;
	}
	.page-contact .form-control {
		font-size: 14px;
	}
	/*-----------------page contact---------------*/
	.contact-home.work-approach.page-contact {
		width : 100%;
		background-position: inherit;
		height : 100%;
	}
	.our-approach .our-approach-content p {
		font-size : 14px;
	}
	.content-footer .col-md-3 {
		font-size : 12px;
	}
	/*-----------------page contact---------------*/
	.portfolio-detail .btn-pop-up-mobile {
		display : block;
	}
	.portfolio-detail .btn-pop-up-dekstop {
		display : none;
	}
	.pop-up-work-img {
		width: 100% !important;
	}
	.desc-pop-up-work {
		padding-bottom : 20px;
	}
	.wrap-header-pop-up {
		background-position: right;
		background-size: cover;
	}
	.content-banner-section {
		padding: 140px 80px;
	}
	.banner-section.page-work .content-banner-section {
		    padding: 140px 60px;
	}
	.banner-section.service .content-banner-section {
		padding: 140px 80px;
	}
	.our-client.work-portfolio .owl-nav > button img {
		width: 30px;
	}
}

@media (min-width: 1200px) { ... }