.m-30{
	margin-left:150px;
 	display: flex;
}
.second-image{
	width: 129%;
}
.top-container {
	top: 0px;
	background-color: #343B41;
	height: 30vw;
}
.section-2{
	margin-top: 40px;
	max-width: 458px;
}
.section-intro{
	margin-top:0px;
}

.registration {
	padding: 55px;
	border: 1px solid #AFAFAF;
}

.sephora-body {
	background-color: white;
	padding: 24px 0px 24px 0px;
}

.video-box {
	background-color: #ffffff;
    margin-bottom: 24px;
    border-radius: 5px;
}

.heading3 {
	font-size: 22px;
    line-height: 32px;
    font-weight: bold;
}

.uppercase {
	text-transform: uppercase !important;
}

.label-gdpr {
	text-align: justify;
}

textarea {
	min-height: 240px;
	resize: none;
}

.swal2-popup #swal2-content {
	font-family: 'Open Sans', sans-serif !important;
	font-size: 16px !important;
}

.swal2-popup .swal2-title {
	font-family: 'Open Sans', sans-serif !important;
}

.swal2-popup .swal2-styled.swal2-confirm {
	font-family: 'Open Sans', sans-serif !important;
}

.checkbox-error {
    font-size: 12px;
	color: #F70A0A;
	margin-bottom: 0;
	display: flex !important;
}

.checkbox-error-hidden {
    font-size: 12px;
	color: #F70A0A;
	margin-bottom: 0;
	display: none;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
input[type=number] {
    -moz-appearance:textfield; /* Firefox */
}


.side-image{
  	width:60%;
  	height: 81%;
  }

	@font-face {
	  font-family: NeoSans;
	  src: url('../../assets/integration_partner/gojek/neosans/neosans-black.otf');
	}

	body {
		background-color: #f2f2f2;
		color: #333333;
		font-family: 'Open Sans', sans-serif !important;
		overflow-x: hidden;
		font-size: 16px;
		overflow: x-hidden
	}

	.container-gojek {
		margin: 0 auto;
		margin-left: 150px;
	}

	.header-container {
		background-image: url(../../assets/integration_partner/sephora/sephora-header.jpg);
		/*background-repeat: no-repeat;*/
		height: 347px;
		text-align: center;
		padding-top: 50px;
	}

	.header-img {
		background-image: url(../../assets/integration_partner/sephora/sephora-header.jpg);
	}

	.sephora-logo {
		width: 50%;
	}

	.body-container {
		background-color: white;
		padding: 0px;
	}

	.row {
		margin: 0;
	}
	.col {
		padding: 0;
	}

	.text-align-right {
		text-align: right;
	}

	h2 {
		font-size: 1.6rem;
		margin-bottom: 1.0rem
	}
	h3 {
		font-size: 1.2rem;	
	}
	a {
		color: #4278F5 !important;
		line-height: 32px !important;
		font-size: 16px !important;
	}
	ul {
		padding-left: 20px;
	}
	li a, li a:active {
		color: white;
		text-decoration: underline;
	}
	li a:hover {
		color: white;
		text-decoration: underline;
	}
	input {
		font-size: 18px !important;
	    padding: 10px 10px 10px 5px !important;
	    width: 98% !important;
	    border: none !important;
	    border-bottom: 1px solid #757575 !important;
	    border-radius: 0 !important;
	    outline-offset: 0px !important;
	  	outline: none !important;
	}
	input[type=file] {
		border-bottom: 0px solid #757575;
	    padding: 5px 0px 5px 0px !important;
	    border-radius: 0 !important;
	    outline-offset: 0px !important;
	  	outline: none !important;
	  	font-size: 14px !important;
	}
	.btn-primary {
		width: 100%;
		background-color: #000;
		border-color: #000;
		color: white !important;
		border-radius: 6px !important;
	}
	.btn.btn-primary:disabled{
	    background-color: #000;
	}
	.btn.btn-primary:active{
	    background-color: #000 !important;
	}
	.btn.btn-primary:hover{
	    background-color: #000;
	}
	.form-error {
	    border: 2px solid red !important;
	}

	.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
	  background-color: #000 !important;
	}
	.custom-checkbox .custom-control-input:checked:focus ~ .custom-control-label::before {
	  box-shadow: 0 0 0 1px #000, 0 0 0 0.2rem rgba(0, 0, 0, 0.25)
	}
	.custom-checkbox .custom-control-input:focus ~ .custom-control-label::before {
	  box-shadow: 0 0 0 1px #000, 0 0 0 0.2rem rgba(0, 0, 0, 0.25)
	}
	.custom-checkbox .custom-control-input:active ~ .custom-control-label::before {
	  background-color: #000; 
	}
	.gojek-checkbox {
		margin-bottom: 15px;
	}

	/*consent checkbox*/
	.custom-control-consent:checked ~ .custom-control-label::before {
	  background-color: #000 !important;
	}
	.custom-control-consent:checked:focus ~ .custom-control-label::before {
	  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 0, 0, 0.25)
	}
	.custom-control-consent:focus ~ .custom-control-label::before {
	  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 0, 0, 0.25)
	}
	.custom-control-consent:active ~ .custom-control-label::before {
	  background-color: #000; 
	}

	.gojek-quotes {
		font-family: NeoSans;
		font-size: 2.5vw;
		text-transform: uppercase;
		color: #FFFFFF;
		font-weight: bold;
		padding: 40px 0px 40px 40px;
		width: 50vw;
	}

	.gojek-footer {
		height: 120px;
	    width: 100%;
	    background-image: url(../../assets/integration_partner/gojek/footer-gojek.png);
	    background-repeat: round;
	    font-size: 16px;
	    text-align: left;
	    padding: 25px 0px 0px 40px;
	    color: #48AF4A;
	}

	.left-side {
		margin-left: 135px;
	}

	.right-side {
		margin-top: 135px;
		margin-right: 150px;
		margin-left: -65px;
	}

	.label-counter {
		font-size: 14px;
		color: #607D8B;
	}

	.left-content-wrapper {
		margin-top: 40px;
		margin-right: 83px;
		margin-bottom: 40px;
	}

	.label-subtitle {
		font-style: italic;
		font-weight: normal;
		font-size: 12px;
		color: #333333;
	}

	.aggrement{
		background-color: #fafafa;
		padding: 15px;
		margin-bottom: 20px; 
		font-size: 14px;
	}
	.continue{
		font-size: 14px;
	}
@media screen and (min-width: 1920px){
	.container-gojek {
		margin-left: 200px;
	}
	.m-30 {
		margin-left: 200px;
	}
	.left-side {
		margin-left: 185px;
	}
	.side-image{
	  	width:50%;
	  	height: 81%;
	}
	.second-image{
	  	width:48%;
	}
	.section-intro{
	  	margin-top: 0px;
	}
	.right-side{
	  	margin-left: -167px;
	}
	.left-content-wrapper {
		margin-top: 30px;
    	margin-right: 175px;
	}
}
@media screen and (max-width: 1366px){
	.side-image{
	  	width:52%;
	  	height: 81%;
	  }
}
@media screen and (max-width: 1280px){
	.gojek-quotes{
		width: 100%;
		font-size: 39px;
	}
	.top-container{
		margin-top:-1px;
	}
	.side-image{
  	width:546px;
  	height:71%;
  }
  .left-content-wrapper {
  	margin-right: 120px;
  	margin-top: 1px;
  }
  .image-2{
  	width: 100%;
  }
  .right-side{
  	margin-top: 170px;
  	margin-left: -108px;
  }
}
@media screen and (max-width: 1024px){
	body{
		font-size: 12px;
	}
	.form-control{
		font-size: 12px;
	}
	.label-counter{
		font-size: 12px;
	}
	.gojek-footer{
		font-size: 12px;
	}
	.label-gdpr{
		font-size: 12px;
	}
	.label-gdpr-consent{
		font-size: 12px;
	}
	input[type=file] {
	  	font-size: 10px !important;
	}
	a{
		font-size: 12px !important;
		line-height: 24px !important;
	}
  .left-side {
  	margin-left: 67px;
  }
  .side-image{
  	width:54%;
  	height: 77%;
  }
  .left-content-wrapper {
  	margin-top: 40px;
  	margin-right: 39px;
  }
  .right-side{
  	margin-right: 69px;
  	margin-top: 116px;
  	margin-left :-34px;
  }
  .section-intro{
  	margin-top: 0px;
  }
  .second-image{
		width: 64% !important;
	}
  .container-gojek{
  	margin-left: 80px;
  }
  .m-30{
  	margin-left: 80px;
  }
  .image-2{
  	width: 433px;
  	margin-top:-39px;
  }
  .aggrement{
  	font-size:8px;
  }
  .continue{
		font-size: 12px;
	}
	.btn-continue{
		height: 40px;
    font-size: 15px !important;
    text-transform: uppercase;	
  }
  .gojek-quotes{
  	font-size:24px;
  }

}

@media screen  and (max-width: 800px) {
  .side-image{
  	width:53%;
  	height: 76%;
  }
  .right-side{
  	margin-top: 104px;
  }
  .image-2{
  	width: 339px;
  	margin-top:-34px;
  }
  .gojek-quotes{
  	width:330px;
  	font-size: 21px;
  }
}

@media screen and (max-width: 768px){
	.side-image{
  	height: 80%;
  }
  .right-side{
  	margin-top: 80px;
  }
  .image-2{
  	width: 323px;
  	margin-top:-39px;
  }
  .gojek-quotes{
  	font-size: 18px;
  }
  .registration {
	padding: 10px;
	}
	.sephora-logo {
		width: 80%;
	}
	.header-container {
		padding-top: 85px;
		background-image: url(../../assets/integration_partner/sephora/sephora-header-crop.jpg);
	}
	.container {
		padding: 8px;
	}
	.col-md-6 {
		padding: 8px;
	}
}

@media screen and (max-width: 640px){
	.title{
		width: 100px;
		margin-left: 120px;
	}
	.top-container{
		height: 400px;
	}
	.container-gojek{
		margin-left: 150px;
	}
	.m-30{
		margin-left: 0px;
		margin-top: 200px;
	}
	.gojek-quotes{
		width: 397px;
		margin-top:-204px;
		margin-left: -251px;
		font-size: 28px;
	}
	.top-container{
		margin-top:-1px;
	}
	.side-image{
    width: 54%;
    height: 66%;
    margin-top: 93px;
  }
  .image-2{
  	width: 294.2px;
  	margin-top: 133px;
  }
  .section-intro{
  	margin-top: 0px;
  	z-index: -1;
  }
  .second-image{
  	z-index: 999;
  }
  .left-content-wrapper{
  	margin-top: 0px;
  	margin-right: -15px;
  	margin-bottom: 1px;
  	padding-top: 70px;
  }
  .left-side{
  	margin-left: -15px;
  	margin-top: 150px;
  }
  .right-side{
  	margin-top: 0px;
  	margin-left: 0px;
  	margin-right: 0px;
  }
  .section-2{
  	margin-top: 0px;
		max-width: 100%;
		padding-left: 15px;
	}

}

@media screen and (max-width: 414px){
	.side-image{
  	width: 53%;
    height: 163px;
    margin-bottom: 14px;
    margin-top: -74px;
  }
  .m-30{
  	margin-left: 0px;
  	margin-top: 280px;
  }
  .image-2{
  	width: 100%;
    margin-top: 62px;
  }
  .gojek-quotes{
  	margin-top: -280px;
    margin-left: -205px;
    width: 200%;
    font-size: 22px;
  }
  .top-container{
  	margin-top: -1px;
  	height: 330px;
  }
  .title{
  	width: 54%;
  	margin-left: -23px;
  }
  .left-side{
  	margin-left: -15px;
  	margin-top: 0px;
  }
  .section-intro {
    margin-top: 0px;
    z-index: -1;
	}
	.left-content-wrapper{
		margin-top: 34px;
		margin-right: -15px;
		padding-top: 60px;
	}
	.second-image{
		z-index: 999;
	}
	.right-side{
		margin-left: 0px;
		margin-right: 0px;
		margin-top: 0px;
	}
	.p-10{
		padding-left:10px;
	}
	.continue{
		margin-left: 10px;
	}
}
@media screen and (max-width: 400px){
	.side-image{
		width: 53%;
    height: 158px;
	}
	.image-2{
		margin-top: 64px;
	}
	.gojek-quotes{
		margin-left: -194px;
	}
	.section-2{
		padding-left: 13px;
	}
	.right-side{
		margin-top: 0px;
	}
	.left-side{
		margin-top: 0px;
	}
}
@media screen and (max-width: 375px){
	.image-2{
		margin-top: 64px;
	}
}

@media screen and (max-width: 320px){
	.gojek-quotes {
		margin-left: -164px;
	}
	.title{
		margin-left: -28px;
	}
	.top-container{
		height: 300px;
	}
	.gojek-quotes{
		font-size: 17px;
		margin-left: -163px;
	}
	.m-30{
		margin-top: 252px;
	}
	.image-2{
		width: 100%;
		margin-top: 70px;
	}
	.side-image{
		width: 167px;
		height: 130px;
	}
	.left-content-wrapper{
		margin-top: 0px;
	}
}