﻿@charset "utf-8";
@media only screen and (min-width:240px) and (max-width:480px) {
	.call-head h4.cl-me {
		padding: 11px 0 20px 0!important
	}
	.call-head p {
		font-size: 14px!important
	}
	.banner .carousel-caption {
		display: none
	}
	.blue-part, .right-blue {
		background: #1874c1
	}
	.device-block {
		margin: 0;
		padding: 10%;
		min-height: inherit
	}
	.mobile-block {
		margin: 40px 0
	}
	.we-do {
		margin: 0;
		max-height: none;
		padding: 46px 0 0 0
	}
	.hexa {
		height: 325px;
		width: 100%;
		transform: none
	}
	.hex1, .hex2, .hexa img {
		transform: none
	}
	.hexa img {
		left: 0
	}
	.hexagons h3 a {
		margin: 10px 0
	}
	.done {
		margin: 50px 0;
		text-align: center
	}
	.done-image-block {
		margin: 30px 0 0 0
	}
	.done-image-block:after {
		display: none
	}
	.form-part {
		margin-top: 0;
		padding: 15px
	}
	.packages {
		padding: 30px 0
	}
	.contact {
		margin: 20px 0
	}
	.form-image {
		margin-top: 20px
	}
	.part {
		width: 100%
	}
	.contact h2 {
		text-align: center;
		width: 100%
	}
	.my-f-sub {
		float: none;
		margin: 0 auto
	}
	.right-blue {
		float: left;
		padding: 0 0 50px 0
	}
	h2 {
		font-size: 35px
	}
}
@media only screen and (min-width:240px) and (max-width:767px) {
	.done-image-block img {
		width: 100%!important
	}
	.register-block {
		display: block;
		overflow: scroll;
		height: 100%
	}
	.reg-main {
		width: 100%;
		margin-top: 100px
	}
	.navbar-collapse .call-head ul li {
		width: 100%;
		float: left;
		text-align: center;
		background: #ecebeb;
		padding: 20px 0;
		margin: 0;
		border: 1px solid #fff
	}
	.navbar-collapse .call-head ul li a {
		color: #202b33
	}
	.navbar-collapse .call-head ul li:last-child {
		margin-bottom: 10px
	}
	.login {
		float: none;
		margin: 0 auto;
		justify-content: center;
		display: flex
	}
	.device-block {
		padding: 10%
	}
	.carousel-indicators {
		display: none
	}
	.we-do p {
		margin-bottom: 20px
	}
	.banner .carousel-caption {
		display: none
	}
	.bnr-normal {
		display: none
	}
	.bnr-mob {
		display: block
	}
	.blue-part {
		background: #1874c1
	}
	.right-blue {
		float: left;
		padding: 0 0 50px 0;
		background: 0 0
	}
	.my-f-sub {
		float: none;
		margin: 0 auto
	}
	.we-do {
		max-height: max-content;
		padding: 40px 0 0 0;
		margin: 30px 0 20px 0
	}
	.done {
		margin: 20px 0;
		text-align: center
	}
	.done-image-block:after {
		display: none
	}
	.done h3 a {
		margin-bottom: 20px
	}
	.form-part {
		padding: 0 20px;
		box-sizing: border-box
	}
	.hexagons {
		margin: 0
	}
	.form-part h2 {
		text-align: center
	}
	.form-image img {
		width: 100%;
		margin: 30px 0 0 0
	}
	.part {
		width: 100%
	}
	.hexa {
		height: 325px;
		width: 100%;
		transform: none
	}
	.hex1, .hex2, .hexa img {
		transform: none
	}
	.hexa img {
		left: 0
	}
	.device-block {
		margin: 0;
		min-height: max-content
	}
	.mobile-block {
		margin: 40px 0
	}
	.social {
		display: none
	}
	.logo {
		float: left;
		width: auto
	}
	.logo img {
		max-width: 35%
	}
	.righ-head {
		background: #40251b;
		right: 0;
		float: left
	}
	.call-head p {
		background: 0 0;
		font-size: 17px;
		padding: 0;
		width: 100%;
		float: left;
		line-height: 22px
	}
	.call-head h4.cl-me {
		width: 100%;
		float: left;
		margin: 0;
		padding: 11px 0
	}
	.banner {
		background: #f6f2e9;
		min-height: auto!important
	}
	.mid {
		background: 0 0
	}
	img {
		max-height: 100%;
		max-width: 100%
	}
	.bulk-order:after, .bulk-order:before, .contact:after, .contact:before {
		display: none
	}
	.about {
		padding: 0 0 100px
	}
	.ft-social-block ul li {
		width: 30px;
		height: 30px
	}
	.ft-s-icon {
		float: left
	}
	.cakes img {
		max-width: 92px;
		margin: 0 auto;
		display: block
	}
	.bulk-order h2.headings:before {
		top: 135px
	}
	.bulk-order h2.headings2:before {
		top: 100px
	}
	.cater p {
		margin: 51px 0 0 0
	}
	.about h2.headings:before {
		top: 135px
	}
	.rating {
		text-align: center;
		display: flex;
		margin: 10px 0;
		vertical-align: ce;
		vertical-align: middle;
		align-items: center;
		justify-content: center
	}
	.rating-text {
		width: auto;
		float: left;
		padding: 0;
		margin: 0
	}
	.ft-social-block ul {
		margin: 10px 0 30px 0
	}
	.righ-head .bg-light {
		background-color: transparent!important;
		height: auto;
		position: relative;
		padding: 0;
		display: block
	}
	.righ-head .navbar-light .navbar-toggler {
		color: #f6f2e9;
		border: none;
		right: 0;
		top: -46px;
		position: absolute
	}
	.righ-head .navbar-light .navbar-collapse {
		position: absolute;
		top: 0;
		background: #fff;
		width: 100%;
		padding: 10px;
		border-radius: 0 0 6px 6px;
		margin-top: 2px
	}
	.righ-head .normal-cl-head {
		display: none
	}
	.form-part textarea {
		height: auto
	}
	.inner-banner-text {
		width: 100%;
		top: 150px;
		padding: 0 6px;
		box-sizing: border-box
	}
	.inner-banner-text h2 {
		font-size: 32px
	}
	.s-right h2, .s-right p {
		text-align: center
	}
	.service-main h2 {
		width: 100%
	}
	/*------------about---------*/
	.mobile-img{ height: 100%}
	.mobile-ftr{ width: 100%; height: 100%; margin-bottom: 30%}
	.mobile-img img{ width: 100% !important; object-fit: cover !important}
	/*----------pricing---------*/
}
@media only screen and (min-width:400px) and (max-width:510px) {
	.righ-head .navbar-light .navbar-collapse {
		padding: 0 10px 15px 10px
	}
	
	.mobile-ftr{ margin-bottom: 45%}
	
}
@media only screen and (min-width:511px) and (max-width:767px) {
	.mobile-ftr{ margin-bottom: 55%}
}
@media only screen and (min-width:768px)and (max-width:980px) {
	.call-head {
		float: right;
		width: auto;
		margin: 0 0 8px 0
	}
	.social {
		display: none
	}
	.banner .carousel-caption {
		top: 25%
	}
	.banner .carousel-caption h2 {
		font-size: 34px;
		margin: 8px 0 0 0;
		line-height: 36px
	}
	.banner .carousel-caption .btn-btn {
		margin: 2px 0 0 0
	}
	.banner .carousel-caption h3 {
		font-size: 18px
	}
	.banner .carousel-caption h2 {
		font-size: 31px
	}
	.bulk-order:after, .bulk-order:before {
		display: none
	}
	.cater h2.headings span {
		font-size: 18px
	}
	.cater h2.headings:before, .contact h2.headings:before {
		top: 130px
	}
	.hexa {
		width: 100%;
		transform: none
	}
	.hex1, .hex2, .hexa img {
		transform: none
	}
	.hexa img {
		left: 0
	}
	.hexagons h3 a {
		margin: 10px 0
	}
	.banner .carousel-caption p {
		margin: 0!important;
		font-size: 14px
	}
	.banner .carousel-caption h3 {
		font-size: 18px
	}
	.banner .carousel-caption h2 {
		font-size: 22px;
		margin: 0
	}
	.done-image-block:after {
		display: none
	}
	.done {
		margin: 20px 0
	}
	/*------------about---------*/
	.abt-mobile, .abt-mobile2{ width: 100%}
	.mobile-ftr{ width: 100%;}
	/*----------pricing---------*/
	.faq_area .faq_content .col-md-6{ max-width: 100%; flex: auto;}
	.faq .panel-group .panel:last-child{ border-bottom: none}	
	.faq .panel-group .panel:last-child{ border-bottom: none !important}	
	.faq{ margin-top: 0}
}
@media only screen and (min-width:768px) and (max-width:1023px) {
	
	
	.register-block {
		display: block;
		overflow: scroll
	}
	.reg-main {
		width: 100%;
		margin-top: 100px
	}
	.part {
		width: 100%
	}
	.hexa {
		width: 100%;
		transform: none
	}
	.hex1, .hex2, .hexa img {
		transform: none
	}
	.hexa img {
		left: 0;
		object-fit: contain
	}
	.hexagons {
		margin: 6px 0
	}
	.call-head ul li a {
		font-size: 15.5px;
		margin: 0 15px 0 0
	}
	.login {
		padding: 12px 34px
	}
	ul.social li {
		margin: 13px 0 0 0
	}
	ul.social li img {
		width: 38px;
		height: 37px
	}
	.call-head p {
		font-size: 15px;
		background-size: 12%;
		padding: 0 0 0 44px
	}
	.call-head h4.cl-me {
		margin: 6px 6px 0 8px
	}
	.call-head h4.cl-me a {
		padding: 8px 22px
	}
	.contact:after {
		position: absolute;
		content: '';
		background: url(../images/bulk-order-right.png) no-repeat;
		width: 265px;
		height: 503px;
		right: 0;
		top: -253px;
		z-index: 999;
		background-size: 100%
	}
	.contact:before {
		width: 285px;
		background-size: 100%;
		top: 191px
	}
	.banner .carousel-caption {
		top: 30%;
		width: 38%
	}
	.logo img {
		max-width: 80%
	}
	.banner .carousel-caption p {
		margin-top: 10px
	}
	.banner .carousel-caption h2 {
		font-size: 30px;
		margin: 8px 0 0 0;
		line-height: 36px
	}
	.banner .carousel-caption .btn-btn {
		margin: 5px 0 0 0;
		padding: 13px 28px;
		font-size: 14px
	}
	#package-block .owl-carousel .item{  min-height: 830px;}
	
}
@media only screen and (min-width:1024px) and (max-width:1200px) {
	.banner .carousel-caption {
		top: 25%;
		width: 36%
	}
	.banner .carousel-caption h2 {
		font-size: 34px;
		margin: 8px 0 0 0;
		line-height: 36px
	}
	.contact:after {
		position: absolute;
		content: '';
		background: url(../images/bulk-order-right.png) no-repeat;
		width: 265px;
		height: 503px;
		right: 0;
		top: -253px;
		z-index: 999;
		background-size: 100%
	}
	.contact:before {
		width: 285px;
		background-size: 100%;
		top: 191px
	}
	.banner .carousel-caption p {
		margin-top: 10px
	}
	.banner .carousel-caption .btn-btn {
		margin: 0
	}
	.banner .carousel-caption {
		top: 26%
	}
	.banner .carousel-caption h2 {
		font-size: 35px
	}
	.banner .carousel-caption h3 {
		font-size: 25px
	}
	.hexa {
		width: max-content;
		height: 210px
	}
	.logo img {
		max-width: 65%
	}
}
@media only screen and (min-width:1201px) and (max-width:1599px) {
	.logo img {
		max-width: 50%
	}
	.contact:before {
		left: -146px
	}
	.contact:after {
		right: 0;
		top: -289px;
		background-size: 100%;
		max-width: 323px
	}
	.l-map:after {
		right: -115px
	}
	.bulk-order:after {
		max-width: 520px;
		right: 0;
		z-index: -99
	}
	.about:after {
		bottom: -2px
	}
	.banner .carousel-caption {
		top: 26%;
		width: 34%
	}
	.banner .carousel-caption h2 {
		font-size: 46px
	}
	.banner .carousel-caption p {
		margin-top: 10px
	}
}