/*============================================================================
	RESPONSIVE CSS START HERE
==============================================================================*/
@media screen and (max-width: 1200px)
{
	.title_ace_your_base h1, .title_common h1, .faq-title, .main-about-div .image_with_content .img-div h2, .gallery_content .main-title h2 {font-size: 40px;}
	
	.title_ace_your_base h1 span, .title_common h1 span, .faq-title span, .main-about-div .image_with_content .img-div h2 span, .gallery_content .main-title h2 span, .image_with_content .img-div h2 span {font-size: 55px;}
	
	.bebo {font-size: 50px;}
	
	.left-desc, .right-desc {min-height: 830px;}
	
	.right-desc h2 {margin: 118px 0 30px 0;}
	
	.Social---links {width: auto;}
	
	.title_ace_your_base, .title_common {top: 0; margin-top: -60px; margin-bottom: 60px; display: block}
	
	.top_menu--logo {margin-top: -350px;}
	
	.image_with_content .img-div {left: 0}
	
	.afer_hero_content, .hero-faq-titles, .accordions, .main-about-div, .hero-landing-titles, .main-about-div .image_with_content .img-div h2 {margin-top: 0;}
	
}
@media screen and (max-width: 991px)
{
	.header .hamburger-menu nav .mobile_menu {height: 100vh;  max-height: 100vh; z-index: 99999;}
	
	.desc-hero-content,.afer_hero_content, .common-buttons-homepage .btn  {z-index: 1;}
	
}

@media screen and (max-width: 767px)
{
	.container {padding: 0 30px}
	
	.top_menu--logo a img {max-width: 70%;}
		
	.top_menu--logo {margin-top: -200px;}
	
	.top_menu--logo {min-height: 330px;}
	
	.afer_hero_content .hero_banner--title, .faq-title {font-size: 40px;}
	
	.afer_hero_content .hero_banner--title span, .faq-title span {font-size: 55px;}
	
	.afer_hero_content .desc-hero-content {margin: 30px 0;}
	
	.afer_hero_content .buttons-hero-content .btn {margin: 0 auto; float: none;}
	
	.afer_hero_content .buttons-hero-content .buy-now {margin: 0 0 30px 0;}
	
	.left-desc, .right-desc {width: 100%; padding: 0; min-height: auto;}
	
	.time_to_shine .right-desc, .time_to_shine .left-desc p {padding: 0;}
	
	.left-desc,.time_to_shine .left-desc {padding: 0 0 50px 0}
	
	.desc-hero-content::before, .desc-hero-content::after {display: none;}
	
	.left-desc:before {position: absolute; content: ""; left: -100%; background: #ffcbc8; width: 100%; height: 100%;}
	
	.left-desc:after {content: ""; background: #ffcbc8; width: 100%; right: -100%; position: absolute; top: 0; height: 100%;}
	
	.right-desc h2 {margin: 80px 0 30px 0;}
	
	.footer-logo-menu {width: 100%; text-align: center; margin: 0}
	
	.footer--links .footer--link {padding: 0 20px; width: auto; float: none; margin: 0 auto; display: table;}
	
	.newsletter-section {width: 100%; margin: 0 0 30px 0;}
	
	.news-social-outer {margin: 30px 0; width: 100%; text-align: center;}
	
	.news-social-outer .Social---links {margin: 0 auto; display: table; float: none; width: auto; margin-bottom: 30px;}
	
	.Social---links {width: 100%; margin-top: 30px;}
	
	.news-social-outer .Social---links .title {margin: 4px 12px 0 0;}
	
	.copyright-outer .left {float: left;  width: 100%;}
	
	.copyright-outer .footer--copyright.right {margin: 0;}
	
	.footer--copyright.right {text-align: center; width: 100%;}
	
	.copyright-outer .left, .copyright-outer .right {font-size: 14px}

	.image_with_content .img-div {width: 100%}
	
	.image_with_content .img-div .main-title + span {width: 85%;}
	
	.image_with_content .content {padding-left: 0; padding-top: 30px;  width: 100%;}
	
	.afer_hero_content .hero_banner--title, .faq-title {margin: 0;}
	
	.header .hamburger-menu nav .mobile_menu {width: 320px;}
	
	.main-about-div .image_with_content .content p {text-align: justify; font-size: 14px;}

}

@media screen and (max-width: 480px)
{
	.footer--links .footer--link {font-size: 16px; padding: 0 15px;}
	
	.title_ace_your_base h1, .title_common h1, .main-about-div .image_with_content .img-div h2, .gallery_content .main-title h2 {font-size: 28px; margin: 0; word-spacing: 2px}
	
	.image_with_content .img-div h2, .image_with_content .img-div h2{font-size: 35px;}
	
	.title_ace_your_base h1 span, .title_common h1 span, .main-about-div .image_with_content .img-div h2 span, .gallery_content .main-title h2 span, .image_with_content .img-div h2{font-size: 35px;}
	
	.title_ace_your_base, .title_common {top: 0; margin-top: -15px; margin-bottom: 30px;}
	
	.gallery-con .title {top: 0; margin-top: -15px; display: block}
	
	.newsletter-form input[type="email"], .newsletter-form input[type="submit"], .Social---links a {height: 50px; font-size: 16px}
	
	.newsletter-form input[type="email"] {padding: 0 20px}
	
	.Social---links a {width: 50px}
	
	.copyright-outer, .left-desc p, .right-desc ul li, .afer_hero_content .desc-hero-content, .image_with_content .content p, .gallery-con .content, .accordion-content {font-size: 16px;}
	
	.news-social-outer h2 {font-size: 22px; line-height: 1.43;}
	
	.news-social-outer {margin: 30px 0 50px 0;}
	
	.buttons-hero-content .btn {width: 230px; height: 70px; line-height: 70px;}
	
	.top_menu--logo {min-height: 260px;}
	
	.top_menu--logo a, .time_to_shine .right-desc .bebo {padding: 0}
	
	.hero_banner .header img {width: 65%;}
	
	.hero_banner .header .cart-login-icons a {margin: 0; text-align: right;}
	
	.hero_banner .header {padding: 20px 0;}
	
	.afer_hero_content .hero_banner--title, .faq-title {font-size: 28px; line-height: 1.43; word-spacing: 5px;}
	
	.afer_hero_content .hero_banner--title span, .faq-title span {font-size: 35px;}
	
	.afer_hero_content .hero_banner--title, .left-desc p:last-child{margin: 0;}
	
	.afer_hero_content, .hero-landing-titles {padding-bottom: 50px;}
	
	.gallery_content .main-title {margin: 50px 0;}
	
	.right-desc h2 {margin: 50px 0 20px 0;}
	
	.right-desc ul li {margin: 0 0 15px 0; padding-left: 25px;}
	
	.ace_your_base, .time_to_shine, .ultimate_glam {padding: 0 0 80px 0;}
	
	.image_with_content .content p {text-align: justify} 
	
	.bebo {margin-top: 20px; font-size: 50px;}
	
	.main-about-div .image_with_content .img-div h2, .image_with_content .img-div h2 {margin: 0 0 50px 0;}
	
	.gallery_img_inner .gallery_img_common {width: 100%; margin: 0}
	
	.gallery-con {padding: 0 10px 30px 10px;}
	
	.main-about-div .gallery_content .main-title {margin: 50px 0;}
	
	.main-about-div {padding-bottom: 80px;}
	
	.image_with_content {padding: 80px 0 30px 0;}
	
	.image_with_content .img-div .main-title + span {width: 95%;}
	
	.image_with_content .img-div span img {top: -15px; left: 15px;}
	
	.gallery_img_inner {padding-bottom: 50px; margin: 0;}
	
	.faq-sub_title {margin: 20px 0;}
	
	.accordion-content {padding: 15px 0; font-size: 16px;}
	
	.accordions .accordion-inner .accordion-title {font-size: 18px; padding: 15px 30px 8px 0;}
	
	.accordions .accordion-inner .accordion-title:before {right: 0}
	
	.accordions {padding-bottom: 50px;}
	
	.afer_hero_content .desc-hero-content {margin:0 0 10px 0}
	
	.hero-landing-titles .faq-title {max-width: 320px; margin: 0 auto; word-spacing: 5px; line-height: 1.43;}
	
	.accordions .accordion-inner .accordion-title:before {top: 8px}
	
	.time_to_shine .left-desc .title_common {text-align: left}
	
	.hero-landing-titles .faq-title br {display: none;}
	
	.hero_banner img {height: 100%}
	
	.top_menu--logo {margin-top: -235px;}
	
	.afer_hero_content, .main-about-div, .hero-landing-titles, .hero-faq-titles {margin-top: -55px;}
	
	.newsletter-section, .footer--links {margin: 0}
	
	.footer {padding-top: 40px}
	
	.desktop-img {display: none;}
	
	.mobile-img {display: block;}

}


@media screen and (max-width: 395px)
{
	.top_menu--logo {margin-top: -260px; min-height: 235px;}
}

@media screen and (max-width: 360px)
{
	.top_menu--logo {margin-top: -275px;}
	
	.afer_hero_content, .main-about-div, .hero-landing-titles, .hero-faq-titles {margin-top: -85px;}
}