/* Mobile Responsive Start */

@media (min-width: 1536px) {
	
}

@media only screen and (min-width: 1500px) {
	
}
@media only screen and (max-width: 1800px) {
	.hero-section {
		height: 85vh;
		transition: all .4s ease;
	}
	.sample-templates-section .sample-templates-slider {
	    height: 37em;
	    transition: all .4s ease;
	}
}

@media only screen and (max-width: 1700px) {
	.sample-templates-section .sample-templates-slider {
	    height: 35em;
	}
}

@media only screen and (max-width: 1600px) {
	.hero-section {
	    height: 76vh;
	}
	.sample-templates-section .sample-templates-slider {
	    height: 33em;
	}
}

@media only screen and (max-width: 1540px) {
	.hero-section {
	    height: 70vh;
	}
	.hero-section .content .title {
		font-size: 57px;
		transition: all .4s ease;
	}
	.how-it-work-section .working-process-tabs {
	    padding: 0 25px;
	    transition: all .4s ease;
	}
	.sample-templates-section .sample-templates-slider {
	    height: 32em;
	}
}

@media only screen and (max-width: 1440px) {
	.faq-section .accordion {
	    margin: 0 100px;
	}
}

@media only screen and (max-width: 1399px) {
	.hero-section .content .title {
	    font-size: 48px;
	    transition: all .4s ease;
	}
	.how-it-work-section .content-group .video-area video {
		width: 100%;
		transition: all .4s ease;
	}
	.we-make-section .steps-grid {
	    margin: 0 60px;
	    transition: all .4s ease;
	}
	.sample-templates-section .sample-templates-slider {
	    height: 31em;
	}
	.faq-section .accordion {
	    margin: 0 0;
	}
}

@media only screen and (max-width: 1299px) {
	.hero-section {
	    height: 65vh;
	}
	.we-make-section .steps-grid {
	    margin: 0 0px;
	    transition: all .4s ease;
	}
	.sample-templates-section .sample-templates-slider {
	    height: 100%;
	}
	.sample-templates-section .sample-templates-slider.owl-theme .owl-dots {
		position: relative;
	}
}

@media only screen and (max-width: 1199px) {
	.hero-section {
	    height: 60vh;
	}
	.our-products-section .product-box img {
		height: 200px;
		transition: all .4s ease;
	}
	.how-it-work-section .working-process-tabs .tabs li:not(:last-child) {
		margin-bottom: 35px;
    	margin-top: 10px;
    	transition: all .4s ease;
	}
	.we-make-section .steps-box {
	    padding: 0;
	}
	.footer .content .social-media {
		margin-bottom: 50px !important;
	}
} 

@media only screen and (max-width: 1150px) {
	.hero-section .content .title {
		width: 69%;
	}
	.sample-templates-section .content .title {
		width: 100%;
	}
}

@media only screen and (max-width: 1024px) {
	.hero-section {
	    height: 50vh;
	}
	.hero-section .content .title {
	    width: 79%;
	        font-size: 42px;
	}
	.hero-section .hero-bg {
		width: 55%;
	}
	.our-products-section .product-grid {
	    display: grid;
	    grid-template-columns: repeat(3, 1fr);
	    grid-gap: 40px 25px;
	}
	.our-products-section .content .title,
	.how-it-work-section .content .title,
	.we-make-section .content .title,
	.sample-templates-section .content .title,
	.partners-section .content .title,
	.our-work-section .content .title,
	.faq-section .content .title {
		font-size: 42px;
	}
	.we-make-section .steps-grid {
	    justify-content: center;
	    display: grid;
	    grid-template-columns: repeat(1, 1fr);
	    grid-gap: 50px 25px;
	    margin: 0 180px;
	}
	.partners-section .logos-area {
	    grid-gap: 20px;
	    margin: 0 70px;
	}
	.our-work-section .our-work-slider {
	    margin-left: 0;
	    position: relative;
	}
	.our-work-section .container-slider {
		padding: 0 15px;
	}
	.our-work-section .our-work-slider .owl-dots {
		width: 100%;
	}
	.our-work-section .our-work-slider .owl-nav {
		right: 5.6%;
	}
}

@media only screen and (max-width: 991px) {
	.header-nav .navbar .navbar-collapse {
	    position: fixed;
	    left: 0;
	    top: 0;
	    bottom: 0;
	    background: rgb(24, 23, 30);
	    text-align: center;
	    width: 89vw;
	    max-width: 400px;
	    height: 100%;
	    max-height: 100vh;
	    clear: both;
	    z-index: 10003;
	    box-shadow: none;
	    -webkit-transform: translateX(-100%);
	    -moz-transform: translateX(-100%);
	    -ms-transform: translateX(-100%);
	    transform: translateX(-100%);
	    visibility: hidden;
	    opacity: 0;
	    -webkit-transition: all 0.3s;
	    -o-transition: all 0.3s;
	    transition: all 0.3s;
	    z-index: 10;
	    text-align: left;
	    padding: 24px 40px;
	}
	.header-nav .navbar .navbar-collapse.show {
	    -webkit-transform: translateX(0);
	    -moz-transform: translateX(0);
	    -ms-transform: translateX(0);
	    transform: translateX(0);
	    box-shadow: 0 0 50px rgba(24,24,24,.2);
	    visibility: visible;
	    opacity: 1;
	}
	.header-nav .navbar .navbar-collapse .overlay {
		content: "";
	    position: fixed;
	    top: 0;
	    height: 100vh;
	    width: 100vw;
	    background: #000000;
	    opacity: 0;
    	visibility: hidden;
	    transition: visibility .6s ease-in-out,opacity .6s ease-in-out;
	    left: 100%;
	    right: auto;
	}
	.header-nav .navbar .navbar-collapse.show .overlay {
		opacity: 0.3;
    	visibility: visible;
	}
	.header-nav .navbar .navbar-collapse.show .navbar-toggler {
		margin-bottom: 10px;
	}
	.header-nav .navbar-nav .nav-item:not(:last-child) {
	    margin-right: 0;
	    border-bottom: 1px solid rgb(255 255 255 / 55%);
	}
	.header-nav .navbar-nav .nav-item a {
		padding: 15px 0;
	}
	.header-nav .navbar-nav .nav-item a:after {
		display: none;
	}
	.header-nav .login-nav {
		text-align: center;
    	margin-top: 20px !important;
	}
	.hero-section .content .title {
	    width: 90%;
	    font-size: 42px;
	}
	.how-it-work-section .content-group:before {
		display: none;
	}
	.how-it-work-section .working-process-tabs {
	    padding: 0;
	    margin-top: 60px;
	}
	.how-it-work-section .working-process-tabs .tabs li:not(:last-child) {
	    margin-bottom: 0;
	}
	.how-it-work-section .content-group {
		    padding-bottom: 0;
		    margin-top: 0;
		    transition: all .4s ease;
	}
	.how-it-work-section .content-group .video-area {
		text-align: center;
		background: #d4af37;
		padding: 40px;
	}
	.we-make-section .content p {
		width: 100%;
		transition: all .4s ease;
	}
	.we-make-section .steps-grid {
	    margin: 0 150px;
	}
	.partners-section .logos-area {
	    grid-gap: 20px;
	    margin: 0;
	}
	.footer .content .social-media {
	    margin-bottom: 0px !important;
	}
	.footer .content {
		margin-top: 40px;
	}
	.footer .content .main-title {
		margin-bottom: 20px;
	}
	.footer .footer-bottom .text-left,
	.footer .footer-bottom .text-right {
		text-align: center;
	}
	.footer-bottom p {
		margin-bottom: 15px;
	}
}

@media only screen and (max-width: 767px) {
	.hero-section .hero-bg {
	    width: 70%;
	}
	.our-products-section .product-grid {
	    display: grid;
	    grid-template-columns: repeat(2, 1fr);
	    grid-gap: 40px 25px;
	}
	.we-make-section .steps-grid {
	    margin: 0 100px;
	}
	.partners-section .logos-area {
		grid-template-columns: repeat(5, 1fr);
	}
	.faq-section .accordion .accordion-button .main-title {
		line-height: 26px;
	}
	.faq-section .accordion .accordion-item {
		padding: 0;
	}
}

@media only screen and (max-width: 575px) {
	.hero-section .hero-bg {
	    width: 100%;
	}
	.hero-section .content .title,
	.our-products-section .content .title,
	.how-it-work-section .content .title,
	.how-it-work-section .working-process-tabs .tabs-all-content .title,
	.we-make-section .content .title,
	.sample-templates-section .content .title,
	.partners-section .content .title,
	.our-work-section .content .title,
	.faq-section .content .title {
    width: 100%;
	    font-size: 32px;
	}
	.our-products-section .product-grid {
	    display: grid;
	    grid-template-columns: repeat(1, 1fr);
	    grid-gap: 40px 25px;
	}
	.our-products-section .product-box img {
	    height: auto;
	}
	.container {
		padding-left: 15px;
    	padding-right: 15px;
	}
	.section {
	    padding: 60px 0;
	}
	.footer {
		padding: 60px 0px 0px 0px;
	}

	.our-products-section .content .title,
	.how-it-work-section .content .title {
		margin-top: 18px;
	}
	.how-it-work-section .working-process-tabs .tabs li:not(:last-child) {
	    margin-bottom: 35px;
	}
	.how-it-work-section .content-group .video-area {
		padding: 20px;
	}
	.we-make-section .steps-grid {
	    margin: 0;
	}
	.partners-section .logos-area {
		grid-template-columns: repeat(4, 1fr);
		grid-gap: 15px;
	}
	.our-work-section .our-work-slider .owl-nav {
		display: none;
	}

	.footer .logo-content {
		padding: 0;
	}
	.chat-with-us .chat-box {
		width: 300px;
		padding: 20px 15px;
	}
	.chat-with-us .chat-box .head .logos-area {
		padding: 6px 10px;
	}
	.chat-with-us .chat-box .head .logos-area img {
	    height: 20px;
	}
	.chat-with-us .chat-box ul li:not(:last-child) {
	    margin-right: 3px;
	}
	.chat-with-us .chat-box ul li img {
	    height: 30px;
	}
	.chat-with-us .chat-box .content .text1, 
	.chat-with-us .chat-box .content .text2 {
		    font-size: 26px;
	}
	.chat-with-us .chat-box .start-chat .chat-btn {
		font-size: 16px;		
	}
	.chat-with-us .chat-icon .icon:before,
	.chat-with-us .chat-icon .icon:after {
		font-size: 24px;
	}
	.chat-with-us .chat-icon .icon {
		height: 47px;
    width: 47px;
	}
	#preloader .round_spinner {
		width: 200px;
    height: 200px;
	}
	#preloader .text img {
    height: 27px;
}
#preloader .spinner {
	left: -30px;
    right: -30px;
    bottom: -30px;
    top: -30px;
}
#preloader .spinner:before {
	top: 21px;
}
}

@media only screen and (max-width: 450px) {
	.hero-section .content .title,
	.our-products-section .content .title,
	.how-it-work-section .content .title,
	.how-it-work-section .working-process-tabs .tabs-all-content .title,
	.we-make-section .content .title,
	.sample-templates-section .content .title,
	.partners-section .content .title,
	.our-work-section .content .title,
	.faq-section .content .title {
	    width: 100%;
	    font-size: 24px;
	}
	.our-products-section .product-grid {
	    display: grid;
	    grid-template-columns: repeat(1, 1fr);
	    grid-gap: 40px 10px;
	}
	.how-it-work-section .working-process-tabs .tabs li:not(:last-child) {
	    margin-bottom: 30px;
	   
	}
	.partners-section .logos-area {
		grid-template-columns: repeat(3, 1fr);
	}
	.footer-bottom li:not(:last-child) {
    margin-right: 20px;
}


}

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

@media only screen and (max-width: 375px) {
	.how-it-work-section .working-process-tabs .tabs li:not(:last-child) {
		 margin-right: 0;
	}
	.partners-section .logos-area {
		grid-template-columns: repeat(2, 1fr);
	}
}