/*


 Table Of Contents


 1.) Media Query for Tablet


 2.) Media Query for mobile


 ===============================================*/








/*


}

@media only screen and (min-width: 768px) and (max-width: 1200px) {
	.order-page .order-after {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
		gap: 30px;
		align-items: center;
		padding: 40px 35px;
		box-sizing: border-box;
	}
	.order-page .order-after__copy,
	.order-page .order-after__image { width: auto; min-width: 0; }
	.order-page .order-after__image img { width: 100%; height: 320px; object-fit: cover; }
}

@media only screen and (min-width: 768px) and (max-width: 1200px) {
	.order-page .order-after { gap: 30px; align-items: center; padding: 40px 35px; box-sizing: border-box; display: grid !important; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr) !important; }
	.order-page .order-after__copy, .order-page .order-after__image { width: auto; min-width: 0px; }
	.order-page .order-after__image img { width: 100%; height: 320px; object-fit: cover; }
}

@media only screen and (min-width : 768px) and (max-width : 1199px) {





#footer{ padding: 25px 0; }


#footer .nav{ float: right; }


#footer .pay-by{ width: 100%; text-align: center; margin-top: 20px; }


#footer .pay-by li{ float: none; display: inline-block; }


.select-row{ height: 40px !important; }


.input{ height: 40px !important; }





}





@media only screen and (min-width : 1025px) and (max-width : 1199px) {





.row .tool-tip{ width: 100%; max-width: 400px; }


.slidewrap{ margin-top: 100px; }


	


}





@media only screen and (min-width : 768px) and (max-width : 1024px) {





#header .logo{ margin-top: 7px; }


#header .logo img{ width: 50px; }


#header nav ul{ padding:20px 0;  }


#header nav li{ margin-left: 17px; }

#header nav li a{
	font-size: 16px;
}

.btn{ padding: 15px 20px 10px; }


.slider-content ul.slider-list li strong{ font-size: 50px; }





.process-info li{ padding: 10px; }


.process-info .box .info h4{ font-size: 16px; line-height: 20px; margin-top: 15px; }


.process-info .box .info p{ font-size: 14px; line-height: 18px; }





.order-contet ul li{ font-size: 40px; }





#footer{ padding: 25px 0; }


#footer .nav{ float: right; }


#footer .pay-by{ width: 100%; text-align: center; margin-top: 20px; }


#footer .pay-by li{ float: none; display: inline-block; }





/*order now page*/


.order-list li{ float: left; width: 50%; padding-left: 20px; margin: 10px 0;  }


.order-list li .para-coll{ min-height: 180px; max-height: 180px; overflow: auto; }





/*information Form Content*/


.row .tool-tip{ position: static; width: 100%; overflow: hidden; margin-top: 15px; float: left; }


/*.row small{ position: static; }*/





/*How it works*/


#owl-example .owl-stage { background: url(../images/scroll-slider-img.png) no-repeat 0 100px/100% auto; }


.slidewrap{ margin: 0; }


#owl-example .owl-item{  height: auto; }


#owl-example .owl-dots{ display: none !important; }


#owl-example .owl-nav{ display: block; width: 100%; text-align: center; bottom: -50px; }


#owl-example .owl-nav > div{ display: inline-block; }


#owl-example .owl-nav .pagination-wrap{ display: inline-block; margin: 0 5px; line-height: 48px; }


.forth-slide .slide-item{ margin: 50px 0 0 0; }





}








/*


 2.) Media Query for mobile


 ===============================*/


@media only screen and (max-width : 767px){





h2, .h2{ font-size: 26px; margin-bottom: 15px; padding-bottom: 15px; }


h3, .h3{ font-size: 26px; margin-bottom: 15px; padding-bottom: 15px; }


p{ font-size: 16px; line-height: 22px; }


.btn{ min-width: 150px; font-size: 16px; padding:10px 10px 6px; }





#header nav li a.btn{ padding: 5px 10px ; border-radius: 0; }





#header .page{ padding: 0; }


#header .logo{ width: 50px; margin: 10px 0 10px 15px; }


#header nav{ display: none; width: 100%; }


#header nav ul{ padding: 0; }


#header nav ul li{ float: none; display: block; margin: 0; border-top:1px solid #dddddd;  }


#header nav ul li:first-child{ }


#header nav ul li a{ display: block; padding: 5px 15px; font-size: 16px; }


#header nav ul li.active a,


#header nav ul li a:hover{ background: #ff0000 ; color: #fff; }


#header nav ul li a:before{ display: none; }


.menu-btn{ display: inline-block; float:right; margin: 26px 15px 0 0;  }





.slider-content ul.slider-list li strong{ font-size: 20px; letter-spacing: 2px; }


.slider-content ul.slider-list li a{ margin-top: 10px; padding: 5px 10px 3px; }


.slider-content .bx-pager{ display: none; }


.slider-content .bx-controls-direction .bx-prev{ width: 20px; height: 20px; font-size: 0; background-size:6px 12px;  }


.slider-content .bx-controls-direction .bx-next{ width: 20px; height: 20px; font-size: 0; background-size:6px 12px; }


.slider-content .bx-controls-direction .bx-prev:hover,


.slider-content .bx-controls-direction .bx-next:hover{ background-size:6px 12px; }


.slider-content .bx-controls-direction{ margin-top: -10px; }





.info-content{ padding: 30px 0; }





.process-info ul{ padding: 30px 0; margin-top: 5px; }


.process-info ul li{ padding: 0; width: 100%; margin: 10px 0; }


.process-info .box .info h4{ line-height: 1.5; margin-top: 15px; }


.process-info .box .info p{ line-height: 22px; }





.order-contet{ padding: 30px 0; }


.order-contet .btn{ margin-top: 20px; }


.order-contet ul li{ font-size: 20px; padding: 0 15px; }


.order-contet ul li:after{ width: 10px; height: 10px; bottom: 3px; }





.whyus-content .inner-content{ padding: 30px 0; }


.whyus-content p{ margin-bottom: 20px; }


.whyus-content ul{ width: 100%; }


.whyus-content ul li{ margin-bottom: 10px; }





#footer{ padding: 20px 15px; }


#footer .page{ padding: 0; }


#footer .copyright-row{ width: 100%; text-align: center; font-size: 13px;}


#footer .nav{ width: 100%; text-align: center; margin-left: 0; }


#footer .nav li{ float: none; display: inline-block; padding: 0 4px 0 8px; }


#footer .pay-by{ display: none; }

#footer .nav a{font-size: 13px;}



/*order now page*/


.order-list{ margin: 20px 0 30px; }


.order-list ul{ margin-left: 0; }


.order-list li{ float: left; width: 100%; padding-left: 0; margin: 10px 0;  }


/*.order-list li .para-coll{ min-height: 180px; max-height: 180px; overflow: auto; }*/

.order-list li .para-coll,
.app-lang-fr .order-list li .para-coll{ min-height: auto; max-height: none; overflow: auto; }

.order-list h4{ padding: 10px; }


.terms h3{ margin-bottom: 15px; }





/*order-payment-page*/


.order-payment-content{ margin: 20px 0 50px; }


.grey-box{ padding: 15px; }


.pay-type{ margin: 25px 0; }


.pay-type li{ padding: 5px 12px; }





/*information Form Content*/


.row-name > div{ width: 100%; margin-top: 5px; }


.dob-row{ margin-left: -10px; }


.dob-row > div{ padding-left: 10px; }


.other-persone{ padding: 10px; }


.row-card .coll-1,


.row-card .coll-2,


.row-card .coll-3,


.row-card .coll-4,


.row-card .or{ margin-top: 5px }


.row small{ position:static; line-height: 1.2; }


.contact-row > div.coll-2{ padding-left: 15px; }


.row .tool-tip{ position: static; width: 100%; overflow: hidden; margin-top: 15px; float: left; padding: 10px; }





/*FAQ content*/


.faq-content h4{ font-size: 14px; line-height: 20px; padding: 10px 30px 6px 10px; }


.faq-content h4 i{ right: 10px; top: 12px; }


.faq-content .data{ font-size: 14px; line-height: 20px; padding: 10px 15px;  }





.select-row{ height: 40px !important; }


.input{ height: 40px !important; }





/*Thank you page content*/


.thankyou-box{ width: 100%; max-width: 770px; border: 1px solid #dddddd; background: #f1f1f1; text-align: center; padding: 20px ; margin: 25px auto; }





/*How it work*/


.scroll-slider{ padding: 25px 0; }


#owl-example .owl-item{ height:auto; padding: 0 15px; }


#owl-example .owl-item, #scroll-wrapper{ height:auto !important; }


#owl-example .owl-stage{ background:none; padding-bottom: 20px; }


.slide-item,.app-lang-fr .slide-item, .app-lang-fr .forth-slide .slide-item { width: auto; margin: 0; float: none; }


.slidewrap{ min-height: 100px; margin-top: 0; }


#owl-example .owl-dots{ display: none !important; }


#owl-example .owl-nav{ display: block; position: static; text-align: center; width: 100%; }


.slide-item h3, .app-lang-fr .slide-item h3{ padding: 0; font-size: 30px; text-align: center; }


.slide-item p, .app-lang-fr .slide-item p{ padding: 0; text-align: center; }


#owl-example .owl-nav .pagination-wrap{ display:none ; line-height: 48px; padding: 0 5px; }


.forth-slide .slide-item{ margin: 0; }

.order-list .special-box .btn{margin-top: 0 !important;}


@media only screen and (max-width : 767px){
	.order-page-hero,
	.order-page-hero__overlay { min-height: 230px; }
	.order-page-hero h1 { font-size: 34px; }
	.order-page .order-list,
	.order-comparison,
	.order-legal,
	.order-after { margin-right: -15px; margin-left: -15px; }
	.order-page .order-comparison { margin-right: 0; margin-left: 0; }
	.order-page .order-list { padding-right: 15px; padding-bottom: 80px !important; padding-left: 15px; }
	.order-page .order-list > ul { display: block; width: 100%; min-width: 0; }
	.order-page .order-list > ul > li,
	.order-page .order-list > ul > li:last-child { display: flex; float: none; width: 100%; max-width: 650px; min-width: 0; margin-right: auto; margin-left: auto; padding-right: 0; padding-left: 0; }
	.order-page .order-list li .box { min-height: 0; }
	.order-page .order-list li .inner-box,
	.order-page .order-list li .para-coll { min-width: 0; overflow-wrap: anywhere; }
	.order-page .order-list li .para-coll { min-height: 0; }
	.order-comparison,
	.order-legal,
	.order-after { padding-right: 30px; padding-left: 30px; }
	.order-comparison__grid,
	.order-legal,
	.order-after { grid-template-columns: 1fr; }
	.order-legal__image,
	.order-after__image { order: 0; }
	.order-legal__image img,
	.order-after__image img { height: 300px; }
}

@media only screen and (min-width: 768px) and (max-width: 1200px) {
	.order-page .order-after { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 30px; align-items: center; padding: 40px 35px; box-sizing: border-box; }
	.order-page .order-after__copy,
	.order-page .order-after__image { width: auto; min-width: 0; }
	.order-page .order-after__image img { width: 100%; height: 320px; object-fit: cover; }
}

@media only screen and (max-width : 600px){
	.order-page-hero h1 { font-size: 28px; }
	.order-page-intro { padding: 35px 0; }
	.order-page-intro p,
	.order-comparison__grid p,
	.order-legal p,
	.order-after p { font-size: 16px; line-height: 24px; }
	.order-page .order-list h4 { font-size: 22px; line-height: 28px; }
	.order-comparison h2,
	.order-legal h2,
	.order-after h2 { font-size: 29px; line-height: 36px; }
	.order-comparison__grid h3 { font-size: 21px; line-height: 27px; }
	.order-comparison,
	.order-legal,
	.order-after { padding-top: 44px; padding-bottom: 44px; }
}





}





