body {
	font-family: 'Roboto', sans-serif;
}
/*navbar*/
.navbar {
	position : fixed;
	width : 100%;
	padding: 0rem 1rem;
	z-index: 1;
}
.navbar .navbar-nav .nav-item .nav-link {
	font-size : 15px;
}
.navbar .navbar-nav .nav-item.active .nav-link {
	font-weight : 500;
}
.navbar .navbar-nav .nav-item .nav-link:hover {
	color : #ffc600 !important;
	transition : 0.5s;
}
.button-contact {
	padding : 5px 20px;
	background-color : #ffc600;
	border-radius : 20px;
	font-weight : bold;
	font-size : 13px;
	color : #58176f;
	border: 1px solid #ffc600;
	box-shadow: 0 0 11px #0f0b13;
}
.button-contact:hover {
	background-color : transparent;
	color : #ffc600 !important;
	transition : 0.5s;
}
.button-contact:hover {
	text-decoration : none;
	color : #321c49;
}
.bg-advika-navbar {
	background-color : #321c49;
}
.navbar .nav-link {
	color : #fff !important;
	font-size : 13px;
}
.navbar-light .navbar-brand {
	color : #fff !important;
}
.navbar-light .navbar-brand img {
	width : 150px;
}
.navbar-expand-lg .navbar-nav .nav-link {
	padding-right: 1.5rem;
    padding-left: 1.5rem;
}
/*navbar*/
/*main banner-section*/
.banner-section {
	background-image : url('/assets/front-end/images/background/background-banner-section.png');
	background-repeat : no-repeat;
	background-size : contain;
	height : 100%;
	width : 1263px;
	display : block;
	margin : 0 auto;
}
.our-client .our-client-content button img:hover {
	opacity : 0.7 !important;
}
/*.banner-section .title-banner-section {
	position : relative;
	top : 80%;
}*/
.content-banner-section {
	padding : 160px 80px;
}
.banner-section .title-banner-section h1 {
	font-weight : 300;
	font-size : 56px;
	color : #58176f;
	font-family: 'Rubik', sans-serif;
}
.banner-section .title-banner-section h3 a{
	color : #58176f;
	font-weight : 300;
}
.banner-section .title-banner-section h3 a:hover {
	text-decoration : none;
}
.banner-section .title-banner-section h3 {
	margin-top : 40px;
	letter-spacing : 5px;
	font-size : 18px;
}
.banner-section .title-banner-section h3 a img {
	width : 70px;
	transition: 0.5s;
}
.banner-section .title-banner-section h3 a:hover img {
	margin-left : 10px;
	transition: 0.5s;
}
.mobile-arrow-banner {
	display : none;
}
.dekstop-arrow-banner {
	display: inline-block;
}
/*main banner-section*/
/*main ourapproach-section*/
.our-approach {
	padding : 40px 0;
}
.our-approach .our-approach-content h3{
	font-family: 'Rubik', sans-serif;
	text-align:center;
	margin-bottom : 20px;
	font-size: 36px;
}
.our-approach .our-approach-content p{
	color : #707070;
	padding : 0 160px;
	text-align : center;
	margin-bottom : 40px;
	font-weight : 300;
	line-height : 28px;
}
.our-approach .our-approach-content .title-service {
	text-align : center;
	font-size : 20px;
}
.our-approach .our-approach-content .img-service {
	width : 160px;
	display : block;
	margin : 0 auto;
}
/*main ourapproach-section*/
/*main ourclient-section*/
.our-client {
	padding : 40px 0;
}
.our-client .our-client-content h3{
	text-align:center;
	margin-bottom : 20px;
	font-family: 'Rubik', sans-serif;
	font-size : 36px;
}
	/*our client owlcarousel*/
		.carousel-wrap {
		  margin: 20px auto;
		  padding: 0 6%;
		  width: 80%;
		  position: relative;
		  z-index: 0;
		}

		/* fix blank or flashing items on carousel */
		.owl-carousel .item {
		  position: relative;
		  z-index: 100; 
		  -webkit-backface-visibility: hidden; 
		}

		/* end fix */
		.owl-nav > button {
		  margin-top: -26px;
		  position: absolute;
		  top: 60%;
		  color: #cdcbcd;
		}
		.owl-nav > button img {
			width : 30px;
		}
		.owl-nav i {
		  font-size: 52px;
		}

		.owl-nav .owl-prev {
		  left: -80px;
		}

		.owl-nav .owl-next {
		  right: -80px;
		}
		.our-client .owl-carousel .owl-item img {
			display: block;
			width: 84%;
			margin: 0 auto;
		}	
		.our-client .owl-carousel .owl-dots {
			display : none;
		}
	/*our client owlcarousel*/
/*main ourclient-section*/
/*main creative-team*/
	.creative-team {
		background-image : url('/assets/front-end/images/background/background-creativeteam-section.png');
		background-repeat : no-repeat;
		background-size : contain;
		height : 100%;
		width : 1263px;
		display : block;
		margin : 0 auto;
	}
	.title-creative-team h1 {
		font-size : 36px;
		margin-bottom : 30px;
		font-family: 'Rubik', sans-serif;
	}
	.title-creative-team p {
		font-size : 16px;
		color: #707070;
		margin-bottom : 30px;
		font-weight : 300;
		line-height : 28px;
	}
	.title-creative-team h3 {
		letter-spacing: 6px;
		font-size : 16px;
		font-weight :400;
	}
	.title-creative-team h3 a {
		color: #58176f;
		font-weight : 300;	
	}
	.title-creative-team h3 a:hover {
		text-decoration : none;
	}
	.title-creative-team h3 img {
		width : 20px;
		transition : 0.5s;
	}
	.title-creative-team h3 a:hover img {
		margin-left: 10px;
		transition : 0.5s;
	}
	.content-creativeteam-section {
		padding: 100px 80px;
	}
	.content-creativeteam-section .row .col-md-6:last-child {
		padding-left : 16%;
	}
/*main creative-team*/
/*main contact-us*/
.contact-home {
	padding : 40px 0; 
}
.contact-home .content-contact-section .title-contact-home h1{
	font-size : 36px;
	margin-bottom : 30px;
	font-family: 'Rubik', sans-serif;
}
.contact-home .content-contact-section .title-contact-home p,.contact-home .content-contact-section.detail-service .title-contact-home h1{
	color: #797979;
	font-size : 16px;
	margin-bottom : 30px;
	font-weight : 300;
	line-height : 28px;
}
.contact-home .content-contact-section.detail-service .title-contact-home h1 {
	font-weight : 500;
	color : #212529;
}
.contact-home .content-contact-section .title-contact-home ul {
	text-align :center;
}
.contact-home .content-contact-section .title-contact-home ul li {
	float : left;
	list-style-type : none;
	margin : 10px 20px;
}
.contact-home .content-contact-section .title-contact-home ul li .list-title {
	font-weight: 500;
	font-size : 13px;
	color: #797979;
}
.contact-home .content-contact-section .title-contact-home ul li img {
	width: 70px !important;
    display: block;
    margin: 10px auto;
}
.contact-home .content-contact-section .title-contact-home a{
	padding: 10px 30px;
    background-color: #ffc600;
	border-radius: 20px;
	color: #58176f;
	box-shadow: 0 0 11px #eaf0f6;
	display : inline-block;
	font-size: 12px;
	font-weight : bold;
	border: 1px solid #ffc600;
}
.contact-home .content-contact-section .title-contact-home a:hover {
	text-decoration : none;
	background-color: transparent;
	color: #ffc600 !important;
	transition : 0.5s;
}
.contact-home .content-contact-section .row .col-md-6:first-child {
	padding : 60px 90px;
}
.image-contact-us {
	width : 80%;
	display:block;
	margin: 0 auto;
}
/*main contact-us*/
/*footer*/
	.content-footer .col-md-3 ul,.content-footer .col-md-6 ul {
		padding : 0;
	}
	.content-footer .col-md-3 ul li {
		padding-right: 5px;
	}
	.content-footer .col-md-3 ul li,.content-footer .col-md-6 ul li {
		float : left;
		list-style-type : none;
	}
	.content-footer .col-md-3 ul,.content-footer .col-md-6 ul {
		display : inline-block;
	}
	.member-partner-wrap {
		padding: 0 20px;
		padding-top: 50px;
	}
	.content-footer .col-md-3 a {
		color : #212529;
		font-size : 16px;
		font-weight : bold;
	}
	.content-footer .col-md-3 ul li img {
		width : 24px;
	}
	.content-footer .col-md-3, .content-footer .col-md-3{
		color: #fff;
		padding-top : 100px;
	}
	.content-footer .col-md-3, .content-footer .col-md-3 a{
		color: #fff;
	}
	.content-footer .member-partner-wrap .col-md-3 {
		padding-top : 0;
	}
	.content-footer .col-md-3 {
		font-size : 13px;
		font-weight : 300;
	}
	.content-footer .col-md-3 p b{
		font-weight : bold;
	}
	.content-footer .col-md-6 .col-md-3 ul li img {
		width : 140px;
	}
	.content-footer .col-md-6 .col-md-12 ul li img {
		width : 120px;
		display : inline-block;
	}
	.bottom-footer {
		padding : 20px 0;
		background-color : #ffc600;
	}
	.bottom-footer a {
		padding-right : 10px;
	}
	.bottom-footer .col-md-7 p {
		margin : 0;
	}
	.bottom-footer p, .bottom-footer a {
		font-size : 11px;
		color : #212529;
		font-weight : 300;
	}
	.top-footer {
		padding : 20px 0;
		background-image : url('/assets/front-end/images/background-member-partner.png');
		display : block;
		margin : 0 auto;
		background-repeat : no-repeat;
		background-size: cover;
		background-position-x: 34%;
	}
	.content-footer .col-md-6 .col-md-9 .member-of {
		margin : 0 20px;
	}
	.content-footer .col-md-6 .col-md-9 .row .col-md-3 img{
		display : block;
		margin : 0 auto;
		width: 70px;
	}
	.partner-of p, .member-of p {
		margin : 8px 0;
		color : #212529;
		font-size : 13px;
		font-weight : 400;
	}
/*footer*/
/*--------------- Page Service ----------------------------------*/
/*banner section*/
	.title-banner-page-service h1 {
		font-size : 36px;
		margin-bottom : 30px;
		font-family: 'Rubik', sans-serif;
	}
	.title-banner-page-service p {
		font-size : 16px;
		color: #707070;
		margin-bottom : 30px;
		font-weight : 300;
		line-height : 28px;
	}
	.title-banner-page-service h3 {
		letter-spacing: 6px;
		font-size : 16px;
		font-weight :400;
	}
	.title-banner-page-service h3 a {
		color: #58176f;
		font-weight : 300;
	}
	.title-banner-page-service h3 a:hover {
		text-decoration : none;
	}
	.title-banner-page-service h3 img {
		width : 20px;
		transition : 0.5s;
	}
	.title-banner-page-service h3 a:hover img {
		margin-left: 10px;
		transition : 0.5s;
	}
	.banner-section.service {
		background-size : cover;
	}
	.banner-section.service {
		background-size : cover;
		background-image: url('/assets/front-end/images/background/background-banner-section-service.png');
	}
/*banner section*/
.body-video {
	height : 250px;
	background-repeat : no-repeat;
	background-size : cover;
	box-shadow: 0 0 11px #eaf0f6;
	margin-top : 30px;
 }
 .play-button-video-service {
	padding : 26% 0;
 }
 .play-button-video-service button {
	height : 60px;
	width  : 60px;
	background-color : #171717cc;
	border-radius : 50%;
	color : #fff;
	font-size : 20px;
	display : block;
	margin : 0 auto;
 }
 .play-button-video-service button:hover {
	color : #ffc600;
 }
 .modal-content-video iframe{
	display : block;
	margin : 0 auto;
	margin-bottom : 40px;
 }
 .modal-content-video {
 background-image: url('/assets/front-end/images/background/background-banner-section-work-approach.png');
 background-size : cover;
 background-repeat : no-repeat;
 }	
 .contact-home.work-approach .content-contact-section.detail-service .title-contact-home .row .col-md-6:last-child {
	padding : 0;
 }
 .contact-home.work-approach .content-contact-section.detail-service .title-contact-home .row .col-md-6:first-child {
	padding : 0 !important;
 }
 .contact-home.work-approach .content-contact-section.detail-service .title-contact-home .row .col-md-6 img {
	 width : 80px !important;
	 display : block;
	 margin: 0 auto;
 }
 .contact-home.work-approach.page-contact.service-detail-banner {
	background-image: url('/assets/front-end/images/background/background-banner-section-detail-service.png');
    background-repeat: no-repeat;
    height: 100%;
    width: 1263px;
    display: block;
    margin: 0 auto;
    background-size: cover;
 }
 .contact-home.work-approach .content-contact-section.detail-service .row .col-md-6:first-child {
	padding : 90px 0 !important; 
 }
 .contact-home.work-approach .content-contact-section.detail-service .row .col-md-6:first-child img {
	width : 80%;
 }
 .contact-home.work-approach .content-contact-section.detail-service .row .col-md-6:first-child h3 {
	font-size:36px;
	font-family: 'Rubik', sans-serif;
	font-weight: 300; 	
	padding : 0 100px;
 }
 .img-banner-service {
	width : 80%;
 }
 
/*--------------- Page Service ----------------------------------*/
/*--------------- Page Work ----------------------------------*/
.banner-section.page-work{
	background-image : url('/assets/front-end/images/background/background-banner-section-work.png');
}
.banner-section.page-work .content-banner-section {
	padding: 160px 80px;
}
.our-client.work-portfolio .owl-nav > button {
	top: inherit;
	position : inherit;
	margin : 0 5px;
}
.our-client.work-portfolio .owl-nav {
	padding : 20px 60px;
}
.our-client.work-portfolio .owl-nav > button img {
    width: 24px;
}
.our-client.work-portfolio .carousel-wrap {
	width : 100%;
	padding : 0;
	padding-left : 8%;
}
.contact-home.work-approach .content-contact-section .row .col-md-6:last-child{
	padding: 90px 30px;
}
.contact-home.work-approach .content-contact-section .row .col-md-6:first-child {
	padding : 0;
}
.contact-home.work-approach .content-contact-section .title-contact-home a {
	background-color: #58176f;
	color: #fff;
	border: 1px solid #58176f;
}
.contact-home.work-approach .content-contact-section .title-contact-home a:hover {
	background-color: #fff;
	color: #58176f !important;
	transition : 0.5s;
}
.contact-home.work-approach {
	background-image : url('/assets/front-end/images/background/background-banner-section-work-approach.png');
	background-repeat : no-repeat;
	height : 100%;
	width : 1263px;
	display : block;
	margin : 0 auto;
	background-size : contain;
}
.portfolio-detail {
	position : relative;
}
.portfolio-detail .btn-pop-up-dekstop {
	position : absolute;
	bottom : -20px;
	width : 100%;
	border-radius : 0;
	background-color : #ffc600;
	border-color: #ffc600;
	color: #58176f;
	height : 5px;
	transition : bottom 1s, height 1s;
}
.portfolio-detail .btn-pop-up-mobile {
	position : absolute;
	bottom : 0;
	width : 100%;
	border-radius : 0;
	background-color : #ffc600;
	border-color: #ffc600;
	color: #58176f;
	height : inherit;
	transition : bottom 1s, height 1s;
	display : none;
}
.portfolio-detail .btn-pop-up-dekstop:hover {
	background-color: #58176f;
    color: #fff;
    border: 1px solid #58176f;
	transition : bottom 1s, height 1s;
}
.portfolio-detail .btn-pop-up-dekstop:active {
	background-color: #58176f !important;
	border: 1px solid #58176f !important;
}
.portfolio-detail:hover .btn-pop-up-dekstop {
	bottom : 0;
	height : 40px;
	transition : bottom 1s, height 1s;
}
.portfolio-detail .btn-pop-up-dekstop:focus {
	display : none;
}
.pop-up-work-img {
	width : 400px;
}
.modal-header {
	border-bottom: none;
}
.desc-pop-up-work {
	padding : 0;
	padding-right : 14px;
	font-size : 15px;
	line-height: 25px;
	color: #707070;
}
.client-service-title {
	font-weight : 500;
	margin : 0;
}
.client-service-content {
	padding : 60px 0;
	margin-right : 40px;
	font-size : 15px;
	line-height: 25px;
	color: #707070;
}
.logo-pop-up img{
	margin: -1rem -1rem -1rem auto;
	display : block;
	width : 244px;
}
.logo-pop-up {
	padding : 0 40px; 
}
.wrap-header-pop-up {
	padding-bottom: 40px;
	background-image : url('../img/background-banner-section-work-popup.png');
	background-repeat : no-repeat;
	height : 160px;
}
.wrap-header-pop-up .modal-header {
	padding-bottom : 0;
}
.our-client.work-portfolio .owl-carousel .owl-item img {
	width : 100%;
}
.contact-home.work-contact-home .content-contact-section .row .col-md-6:first-child{
	padding : 20px 90px;
}
/*--------------- Page Work ----------------------------------*/
/*--------------- Page Contact ----------------------------------*/
.page-contact {
	background-image : none;
	background-repeat : no-repeat;
	height : 600px;
	width : 1263px;
	display : block;
	margin : 0 auto;
}
.contact-home.work-approach.page-contact {
	background-image: url('/assets/front-end/images/background/background-banner-section-contact.png');
    background-repeat: no-repeat;
    height: 100%;
    width: 1263px;
    display: block;
    margin: 0 auto;
	background-size : cover;
}
.btn-primary {
	background-color : #ffc600;
	color : #58176f;
	border: 1px solid #ffc600;
	padding: 5px 30px;
	border-radius: 20px;
	font-weight: 500;
	font-size : 15px;
}
.btn-primary:hover {
	background-color : transparent;
	color : #ffc600;
	border: 1px solid #ffc600;
}
.page-contact .form-row {
	margin-top : 20px;
}
.page-contact .form-check-label {
	color : #58176F;
	text-transform : uppercase;
}
.page-contact .form-check-inline .form-check-input {
	background-color : transparent;
}
.page-contact .form-control {
	font-size : 13px;
	padding: 1.2rem .75rem;
}
.banner-section.page-contact .content-banner-section .col-md-6:first-child {
	padding-right : 90px;
}
.banner-section.page-contact .content-banner-section .col-md-6 form .col-md-6 {
	padding : 0 10px;
}
/*--------------- Page Contact ----------------------------------*/
/*--------------- Page about ----------------------------------*/
.section-team-about-us {
	padding : 40px 0;
}
.section-team-about-us .row {
	text-align : center;
	border-top : 1px solid #58176f;	
	border-bottom : 2px solid #58176f;
	padding : 40px 0;
}
.section-team-about-us h1 {
	text-align : center;
	font-size : 36px;
	margin-bottom : 30px;
	font-family: 'Rubik', sans-serif;
}
.section-team-about-us .row .col-md-3 p {
	margin : 0;
}
.section-team-about-us .row .col-md-3 p:first-child {
	font-size : 20px;
	font-weight : 500;
	/*font-family: 'Rubik', sans-serif;*/
}
.section-team-about-us .row .col-md-3 p:nth-child(2){
	color: #707070;
	font-weight : 300;
}
.section-team-about-us .row .col-md-3  {
	margin : 20px 0;
}
.section-team-about-us .row .col-md-3 .sosmed-team {
	display : inline-block;
	padding : 0;
}
.section-team-about-us .row .col-md-3 .sosmed-team li {
	float : left;
	list-style-type : none;
	margin : 11px;
}
.section-team-about-us .row .col-md-3 .sosmed-team li img {
	width : 22px;
}
.img-our-value {
	width : 348px;
}
/*--------------- Page about ----------------------------------*/