@media(max-width: 1022px){
	#SurveyModal .modal-dialog{
		width: 90%;
		margin: 10px auto;
	}
}
@media(max-width: 991px){
	#sk-section.container::after{
		left: -7.5%;
	}

	/* invite teman */
	#invite-outer #right-content{
		padding-top: 20px;
	}
	#right-content > img{
		width: 100%;
		height: auto;
	}
	/* e- invite teman */
}

@media(max-width: 900px){
	#InviteModal .modal-dialog{
		width: 90%;
	}

	#srv-q3 .option span{
		display: block;
	}
	#srv-q3 .option a{
		display: block;
	}

	#srv-q5{
		padding-left:10px;
		padding-right:10px; 
	}
	#srv-q5 .row2 .col .overlay{
		padding-top: 15%;
	}
}

@media(max-width: 768px){
	#content-wrapper{
		padding-bottom: 30px;
	}
	#top-nav li a span{
		display: none;
	}
	#home-right-content img{
		width: 100%;
	}
	#content-wrapper.home-section::after{
		background-size: auto 150px;
		left: 10px;
		background-position: center bottom;
		width: 100%;
	}

	/* home */
	#btn-mulai{
		margin-bottom: 170px;
	}
	/* e- home */

	/* syarat dan ketentuan */
	#hadiah-title, #hadiah-outer .inner{
		width: 100%;
	}
	#sk-section.container::after,#sk-section.container::before{
		display: none;
	}
	#syarat-ketentuan-outer .inner{
		padding: 20px;
	}
	/* e- syarat dan ketentuan */

	/* hadiah */
	#hadiah-outer .content .col img{
		width: 100%;
	}
	/* e- hadiah */

	#InviteModal .modal-dialog, #EmailModal .modal-dialog{
		margin-left: auto;
		margin-right: auto;
	}
	#EmailModal .modal-dialog {
		margin-top: 100px;
	}
}

@media(max-width: 767px){
	#q2 form{
		padding-left: 0px;
	}
	#q2 div.pull-right img{
		max-width: 100%;
		height: auto;
	}
	#q2 .row .col:nth-child(1){
		padding-top: 0px !important;
		padding-right: 15px;
	}
	.survey-cont .question-v1{
		font-size: 20px;
	}
	#q3 .col a img{
		height: 140px;
	}

	#pengeluaran-cont .selector .caption{
		font-size: 15px;
		bottom: -30px;
	}

	#srv-q2 .option a{
		width: 32.3333%;
	}
	#srv-q2 .option a img{
		width: 100%;
		height: auto;
	}

	#srv-q3, #srv-q4, #srv-q5{
		padding: 0px 10px;
		max-height: 350px;
	}
	#srv-q3 .mCSB_dragger, #srv-q4 .mCSB_dragger, #srv-q5 .mCSB_dragger{
		background-color: #EF6B00 !important;
		width: 7px;
		right: 3px;
		border-radius: 5px;
	}
	#srv-q3 .mCSB_draggerRail, #srv-q4 .mCSB_draggerRail, #srv-q5 .mCSB_draggerRail{
		background-color: #D18A07;
		width: 3px;
	}
	#srv-q3 .answer{
		width: 100%;
		margin-bottom: 15px;
	}
	#srv-q3 .mCSB_container{
		margin-right: 15px;
	}
	#srv3-area-view li{
		width: 32.3333%;
		display: inline-block;	
		padding-right: 5px;
		border-right: 1px solid #eee;	
	}
	#srv-q3 .option{
		width: 100%;
		text-align: center;
	}
	#srv-q3 .option .col-sm-4{
		width: 16.6666%;
		display: inline-block;
	}
	#srv-q3 .option span{
		height: 50px;
		overflow: hidden;
	}

	#SurveyModal .modal-body .text small{
		display: block;
	}

	#srv-q5 .row2 .col{
		width: 50%;
	}
	#srv-q5 .row2 .col .overlay{
		font-size: 23px;
		width: 90%;
		height: 90%;
		padding-top: 20%;
	}
	#srv-q5 .row2 .col.active::before{
		background-position: 70% 10px;
	}
	#srv-q6 .mCSB_container, #srv-q8 .mCSB_container, #srv-q9 .mCSB_container, #srv-q11 .mCSB_container{
		padding-right: 15px;
	}
	#srv-q6, #srv-q8, #srv-q9, #srv-13{
		padding-left: 10px;
		padding-right: 10px;
	}
	#srv-q6 .option, #srv-q8 .option, #srv-q9 .option{
		padding-top: 35px !important;
	}
	#srv-q6 #intensitas-cont,#srv-q8 #intensitas-cont{
		width: 90%
	}
	#srv-q8 #intensitas-cont .selector .caption{
		font-size: 14px;
	}

	#srv-q13 .option::before{
		width: 24px;
		height: 161px;
		right: auto;
		left: 20px;
		background-size: 100%;
	}

	#srv-finish{
		max-height: 350px;
		padding-left: 10px;
		padding-right: 10px;
	}
	#srv-finish .mCSB_dragger {
		background-color: #EF6B00 !important;
		width: 7px;
		right: 3px;
		border-radius: 5px;
	}
	#srv-finish .mCSB_draggerRail{
		background-color: #D18A07;
		width: 3px;
	}
	#srv-finish .mCSB_container{
		margin-right: 15px;
	}
	#srv-finish .col-sm-6{
		width: 100%;
	}
	#srv-finish .col-sm-6 img{
		max-width: 100%;
	}
}

@media(max-width: 650px){
	#InviteModal .modal-body{
		padding: 20px 15px;
	}
	#InviteModal .modal-body .text{
		font-size: 16px;
	}

	#pengeluaran-cont{
		margin-top: 30px;
	}
	#pengeluaran-cont .selector:nth-child(2) .caption{
		bottom: auto;
		top: -25px
	}
}

@media(max-width: 568px){
	footer::before{
		width: 100px;
	}
	footer:after{
		right: 90px;
	}
	#SurveyCarousel .carousel-indicators{
		width: 93%;
	}

	#q1 a img{
		width: 100%;
		height: auto;
	}
	#q1 .col a{
		padding: 0px;
	}

	#srv-q2 .option a{
		width: 48%;
	}
	#srv-q2 .option a:nth-child(2)::before{
		border-right: none;
	}
	#srv-q2{
		max-height: 350px;
	}
	#srv-q2.surv-cont{
		padding: 0px;
	}
	#srv-q2 .mCSB_dragger {
		background-color: #EF6B00 !important;
		width: 7px;
		right: 3px;
		border-radius: 5px;
	}
	#srv-q2 .mCSB_draggerRail{
		background-color: #D18A07;
		width: 3px;
	}

	#srv3-area-view li{
		width: 49%;
	}
	#srv-q3 .option .col-sm-4{
		width: 24%;
	}

	#srv-q10 #intensitas-cont .selector:nth-child(2) .caption{
		bottom: auto;
		top: -35px;
	}
	#srv-q10 #intensitas-cont .selector:nth-child(1) .caption{
		left: -30px;
	}
	#srv-q10 #intensitas-cont .selector:nth-child(3) .caption{
		right: -30px;		
	}	
	#srv-q10 #intensitas-cont .selector .caption{
		font-size: 16px !important;
	}
}

@media(max-width: 527px){
	#srv-q5 .row2 .col .overlay{
		font-size: 16px;
	}

	.surv-cont .question{
		font-size: 18px;
	}
	#srv-finish .btn-submit {
		margin-bottom: 10px;
		margin-top: 0px !important;
	}
}

@media(max-width: 450px){
	footer:before{
		width: 70px;
	}
	footer:after{
		right: 60px;
	}

	/* syarat dan ketentuan */
	#sk-ol .ol-row .text{
		width: 80%;
	}
	/* e- syarat dan ketentuan */

	/* hadiah */
	.hadiah-text1{
		font-size: 15px;
	}
	.hadiah-text1 b{
		font-size: 25px;
	}
	.hadiah-text2{
		font-size: 10px;
	}
	/* hadiah */

	/* invite teman */
	#invite-outer .col{
		width: 100%;
	}
	#invite-img{
		width: 200px;
		max-width: 100%;
		display: block;
		margin: auto;	
	}
	#EmailModal .modal-dialog{
		width: 80%;
	}
	#InviteModal .modal-body .row a img{
		width: 100%;
	}
	/* e- invite teman */

	#q2 .col{
		width: 100%;
	}
	#q2.survey-cont{
		padding-top: 0px;
	}
	#q2 .row .col:nth-child(1){
		padding-bottom: 25px;
	}
	#q2{
		height: 360px;
		overflow: hidden;
	}
	#q2 .row .col:nth-child(2){
		padding-left: 15px;
	}
	#q2 .mCSB_dragger{
		background-color: #EF6B00 !important;
		width: 7px;
		right: 3px;
		border-radius: 5px;
	}
	#q2 .mCSB_container{
		margin-right: 15px;
	}
	#q2 .mCSB_draggerRail{
		background-color: #D18A07;
		width: 3px;
	}

	#q4 .question-v3{
		width: 100%;
		padding: 0px 15px;
	}
	#q4 .question-v3-2{
		padding: 0px 15px;
		margin-top: 50px;
	}

	#srv-q4 form div.pull-left{
		width: 150px;
	}
	#srv-q4 form .row2{
		margin-bottom: 20px;
	}
	#srv-q4 form div:nth-child(2){
		width: 100%;
		float: left;
		margin-top: 0px;
	}

	#srv-q5 .row2 .col{
		width: 100%;
	}
	#srv-q5 .row2 .col .overlay{
		font-size: 24px;
	}
}

@media(max-width: 428px){
	footer span{
		width: 65%;
		display: block;
	}	
	footer:after{
		font-size: 260px;
		top: 75px;
		right: 57px;
	}
	footer img{
		margin-top: 6px;
	}

	#cls-invite-mod{
		font-size: 22px;
	}
	.carousel-indicators li, #SurveyCarousel .carousel-indicators li.active{
		width: 7px;
		height: 7px;
	}
	.so-breadcrumb{
		font-size: 15px;
	}
	#q1 .col:nth-child(1){
		padding-right: 15px;
	}
	#q1 .col:nth-child(2){
		padding-left: 15px;
	}

	#q3 a img{
		max-width: 80%;
		height: auto !important;
	}
	#q3 .question-v1{
		padding: 0px 15px !important;
	}

	#srv-q6, #srv-q8, #srv-q9, #srv-q10, #srv-q11, #srv-q13, #srv-thanks{
		padding: 0px 10px;
		max-height: 350px;
	}
	#srv-q6 .mCSB_dragger,#srv-q8 .mCSB_dragger, #srv-q9 .mCSB_dragger, #srv-q10 .mCSB_dragger, #srv-q11 .mCSB_dragger, #srv-q13 .mCSB_dragger, #srv-thanks .mCSB_dragger{
		background-color: #EF6B00 !important;
		width: 7px;
		right: 3px;
		border-radius: 5px;
	}
	#srv-thanks .mCSB_container{
		margin-right: 15px;
	}
	#srv-q6 .mCSB_draggerRail, #srv-q8 .mCSB_draggerRail, #srv-q9 .mCSB_draggerRail, #srv-q10 .mCSB_draggerRail, #srv-q11 .mCSB_draggerRail, #srv-q13 .mCSB_draggerRail, #srv-thanks .mCSB_draggerRail{
		background-color: #D18A07;
		width: 3px;
	}

	#srv-q11 #intensitas-cont .selector:nth-child(2){
		left: 45%;
	}
	#srv-q11 #intensitas-cont .selector .caption{
		font-size: 14px;
	}
}

@media(max-width: 392px){
	#hadiah-outer .content .col{
		width: 100%;
	}
	#hadiah-outer .content .col:first-child{
		border-right: none;
		border-bottom: 3px dotted #ddd;
		padding-bottom: 15px;
		margin-bottom: 15px;
	}
	#q4 .question-v3-2{
		margin-top: 30px;
	}

	#srv3-area-view li {
		width: 100%;
		display: block;
		border-right: none;
		padding-right: 0px;
	}
	#srv-q3 .option .col-sm-4{
		width: 49%;
	}
}

@media(max-width: 375px){
	#top-nav li a img{
		height: 20px;
	}

	#cls-invite-mod{
		font-size: 18px;
	}
	.carousel-indicators li, #SurveyCarousel .carousel-indicators li.active{
		width: 6px;
		height: 6px;
	}
	.so-breadcrumb{
		font-size: 13px;
	}
}

@media(max-width: 360px){
	#pengeluaran-cont .selector .caption{
		font-size: 13px;
	}

	#srv-q2 .option a{
		width: 100%;
	}
	#srv-q2 .option a:before{
		border: none;
	}
	.btn-submit{
		width: 85%;
		font-size: 14px;
	}

	#intensitas-cont .selector:nth-child(2) .caption{
		bottom: auto;
		top: -35px;
	}
	#srv-q8 .selector:nth-child(2) .caption,#srv-q9 .selector:nth-child(2) .caption, #srv-q11 .selector:nth-child(2) .caption{
		top: auto;
		bottom: -43px;
	}

	#srv-q8 #intensitas-cont .selector:nth-child(2), #srv-q9 #intensitas-cont .selector:nth-child(2), #srv-q10 #intensitas-cont .selector:nth-child(2), #srv-q11 #intensitas-cont .selector:nth-child(2){
		left: 43%;
	}

	#srv-thanks .frm input[type="text"]{
		width: 78%;
	}

	#srv-finish .btn-submit{

	}
	.btn-back{
		margin-right: 0px;
		vertical-align: 0px;
	}
}