

/******************** Width 1200px *********************/



		@media screen and (max-width: 1200px) {
			
			
			
			body {
				background: #111111;
			}
			
			#wrap {
				background: #FFFFFF;
				width: 100%;
				float: left;
			}
						
						
				#escapeMobile	{
					display: none !important;
					margin: 20px 00px 00px 00px;
				}
			
			.container {
				width: 100% !important;
				padding: 0% 20px;
			}
			
			#header, 
			#content,
			#banner, 
			#footer {
				width: 100% !important;
				padding: 00px;
				margin: 00px;
			}
			
			 /******************** Header *******************/
		 
		
		[class*='col-'] {
			width: 100%;
		}
		
		 #home header.sticky, header {
			position: static;
			padding: 10px 00px 30px 00px !important;
			background: rgba(255,255,255,1);
        }
		
		#header h1.logo {
			width: 100%;
			float: left;
			text-align: center;
		}
		
			#header aside h3 {
				width: 100%;
				float: left;
				text-align: center;
			}
			

				
			
/***************** Navigation **************/
		
		.pushmenu { background: rgba(255, 255, 255, 0.07); margin: 0; width: 50%; height: 100%; top: 0; z-index: 1000; position:fixed;}
		.pushmenu a:hover {background:#fff;}
		.pushmenu a:active {background: #454f5c; color: #fff;}
		.pushmenu-left {right: -50%;}
		.pushmenu-left.pushmenu-open {right: 0;}
		.pushmenu-push {overflow-x: hidden; position: relative; right: 0;}
		.pushmenu-push-toright {right:50%;}
		
		.pushmenu-push-toleft{left:50%;}
		
		
		.pushmenu, .pushmenu-push {-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}
		.mobile-menu{ padding: 0; cursor: pointer; float: right; display: block; position: relative;}
		.mobile-menu > label{ float: left; display: none; cursor: pointer; color:#FFF; margin: 13px 0 0; font-size: 18px; padding: 0 0 0 16px; text-transform: uppercase; }
		.mobile-menu > ul{ padding: 0px; margin: 0; float: right; cursor: pointer; margin-top: 0px; z-index: 9999; position: absolute; right: -10px; top: -75px;}
		.mobile-menu > ul > li{ width: 30px; height: 3px; border-radius: 2px; background: #000; clear: both; list-style-type: none;}
		.mobile-menu.active > ul > li{background: #fff600;}
		.mobile-menu > ul > li+li{ margin-top: 5px;}
		nav > h3{ display: block; text-align: center; margin: 0; background:rgba(255, 255, 255, 0.9); color:#111111; text-transform: uppercase; font-weight: normal; padding: 14px 16px 10px; line-height: normal;}
		nav > ul{ width: 100%;}
		nav > ul > li{ width: 100%; text-align: center; margin: 00px;}
		nav > ul > li a {margin: 00px;}
		nav > ul > li a:hover {color: #111111 !important;}
		nav > ul > li+li{ margin: 0;}
		nav > ul > li a{ color: #FFFFFF; padding: 8px 10px !important; text-align: left; border-bottom: 1px dashed #999999; display: block; font-size: 12px;  border-radius: 0; background: none; text-shadow: none;}
		
		
		nav > ul > li.active > a, nav > ul > li.active > a:hover {
		border: 0px solid #999999;
	}
		nav > ul > li a:hover, nav > ul > li.menu_rh a {
			color: #92278f;
			background: none;
			text-shadow: 00px 00px 00px;
			text-decoration: none;
			border: 00px;
			border-bottom: 1px dashed #999999;
			background: #FFFFFF;
			background: -webkit-linear-gradient(top, #FFFFFF, #F4F4F4);
			background:   -moz-linear-gradient(top, #FFFFFF, #F4F4F4);
			background:    -ms-linear-gradient(top, #FFFFFF, #F4F4F4);
			background:     -o-linear-gradient(top, #FFFFFF, #F4F4F4);
			background:        linear-gradient(top, #FFFFFF, #F4F4F4);
			filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#FFFFFF", endColorStr="#F4F4F4");	
			padding: 15px 14px;
		}
		
		/*nav > ul > li a.active, nav > ul > li.menu_rh a {
			color: #92278f;
			background: none;
			text-shadow: 00px 00px 00px;
			text-decoration: none;
			border: 0px solid #999999;
			background: #FFFFFF;
			background: -webkit-linear-gradient(top, #FFFFFF, #F4F4F4);
			background:   -moz-linear-gradient(top, #FFFFFF, #F4F4F4);
			background:    -ms-linear-gradient(top, #FFFFFF, #F4F4F4);
			background:     -o-linear-gradient(top, #FFFFFF, #F4F4F4);
			background:        linear-gradient(top, #FFFFFF, #F4F4F4);
			filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#FFFFFF", endColorStr="#F4F4F4");	
			padding: 15px 14px;
		}*/
	
		nav > ul > li ul {
		  display: block;
		}
		
		nav > ul > li:hover ul {
			  position: static;
			  top: 0;
			  display: block;
			  left: 0;
			  padding-top:0px;
			  width:100%;
		}
		
		nav > ul > li ul li a, nav > ul > li.menu_rh ul li a {
			padding: 8px 15px;
			text-decoration: none;
			color: #000;
			text-align: left;
			background:#FFF;
			display: block;
			margin: 00px;
			line-height: normal;
			border-radius: 0px;
			border: 1px solid #555;
			border-bottom: 0px solid #555;
			max-height: 36px;
			-webkit-transition: background .0s ease-out;
			-moz-transition: background .0s ease-out;
			-o-transition: background .0s ease-out;
			transition: background .0s ease-out;
			overflow: hidden;
			text-transform: capitalize;
		}
		nav > ul > li ul li:last-child a, nav > ul > li.menu_rh ul li:last-child a {
			border: 1px solid #555;
			border-bottom: 1px solid #555;
		}
		nav > ul > li ul li a:hover, nav > ul > li.menu_rh ul li a:hover, nav > ul > li:nth-child(3) ul li a:hover {
			color: #FFFFFF !important;
			background: #333333 !important;
			cursor: pointer;
		}
		
	/******************** Banner *******************/	
			
		#banner .container {
			width: 100%;
			margin: 0 0%;
			position: absolute;
			bottom: 0%;
			top: 0%;
			z-index: 9;
			margin-top: 0px;
		}	
		
	/******************** Package *******************/	
	
	#content {
		padding: 20px 00px 00px 00px;
	}
		
	#content .package {
			padding: 30px 00px;
			width: 100%;
			float: left;
			/*background: url(../images-savvy/package.jpg) right top scroll no-repeat;
			-webkit-background-size: cover;
			   -moz-background-size: cover;
			    -ms-background-size: cover;
			     -o-background-size: cover;
			        background-size: cover;*/
			color: #FFFFFF;
			font-family: 'helvetica_condensed_bq_light';	
		}
		
	/************ What Our Customers Have to Say ************/
					
		#content .what-our-customers-have-to-say {
			padding: 30px 00px;
			width: 100%;
			float: left;
			background: url(../images-savvy/what-our-customers-have-to-say.jpg) right top scroll no-repeat;
			-webkit-background-size: cover;
			   -moz-background-size: cover;
			    -ms-background-size: cover;
			     -o-background-size: cover;
			        background-size: cover;
			font-family: 'helvetica_condensed_bq_light';	
		}
		
		/************ About Savvy ************/
			
	   #content .about-savvy {
			padding: 00px 00px 00px 00px;
			width: 100%;
			float: left;
			background:none;
			font-family: 'helvetica_condensed_bq_light';	
		}
		
		#content .about-savvy .container {
			padding: 30px 20px 20px 20px;
			width: 100%;
			float: left;
			background: rgba(255,255,255,1);
		}
		
		#content .about-savvy p {
				width: 100%;
			}
		
			
	
					
			
			/******************** Footer *******************/	
			
				#footer {
					padding: 25px 00px 20px 00px;
				}
				
				#footer h2.footer-logo {
					margin-bottom: 20px;
				}
				
				#footer .col-2-10:first-child, #footer .col-2-10:last-child {
					width: 100%;
					text-align: center;
				}
				
				#footer .col-2-10 {
					width: 33.33%;
					float: left;
				}
				
		

		}

	/******************** Width 1100px *********************/
		
		@media screen and (max-width: 1100px) {
			
		
		
			
}

		/******************** Width 980px *********************/

		@media screen and (max-width: 980px) {

		
			
			
		/******************** Content *******************/
				  
	  
		#content [class*='col-'] {
				width: 100%;
			}
			
			#content .package-inner li {
				width: 100%;
				display: block;
			}
			
		
		    #home .how {
				top: -0%;
			}		
				
		
		
}

		/******************** Width 840px *********************/

		@media screen and (max-width: 840px) {
			
			
			

			
			#banner .beautiful-interior-design {
				width: 100%;
				height: 425px;
				background: url(../images-savvy/banner-header-bg.png) center top scroll no-repeat;
				margin: auto;
				
				-webkit-background-size: contain;
				   -moz-background-size: contain;
				    -ms-background-size: contain;
				     -o-background-size: contain;
				        background-size: contain;
			}
			
			#banner .beautiful-interior-design aside {
				padding: 70px 30px 00px 250px;
				text-align: center;
				font-family: 'helvetica_condensed_bq_light';
			}
	
	.grid {
		width: 100%;
		min-width: 0;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 0px;
		padding-right: 0px;
	}
	
	/*[class*='col-'] {
		width: auto;
		float: none;
		margin-left: 0px;
		margin-right: 0px;
		margin-top: 10px;
		margin-bottom: 10px;
		padding-left: 20px;
		padding-right: 20px;
	}*/
	
	[class*='min-height-'] {
		min-height: 100px;
	}
	
	[class*='max-height-'] {
		max-height: 100px;
	}
	
	[class*='max-width-'] {
		max-width: 100%;
		}
		
		
	[class*='min-width-'] {
		min-width: 100%;
		}
		.mydivs{ height: auto;}
	
}

		/******************** Width 780px *********************/

		@media screen and (max-width: 780px) {
			
		/******************** Header *******************/
		
				

		 /***************** Content *****************/
		 
		 	#banner .beautiful-interior-design aside {
				padding: 30px 30px 00px 200px;
				text-align: center;
				font-family: 'helvetica_condensed_bq_light';
			}
			
			#banner .beautiful-interior-design blockquote {
				font-size: 20px;
				line-height: 26px;
			}
			
			#banner .beautiful-interior-design .box a { 			
				font-size: 20px;			
			}
		 
		  
		 
				#content .package li {
					width: 100%;
					list-style-type: none;
					float: left;
					margin: 0px 00px 15px 00px;
					padding: 25px 25px 100px 25px;
					background: #1c1815;
					color: #FFFFFF;
					min-height: 100px;
					text-align: center;
				}
		 
		
	
		/***************** Footer *****************/
		 
		 #footer [class*='col-'] {
				width: 100%;
			}
			 
			
		
				
			
			
			#footer .copyright, #footer figure.social_media {
				text-align: center;
			}
			
			#footer p.left, #footer p.right {
				float: none;
				text-align: center;
			}
		
			
			
		
		

}



		/******************** Width 640px *********************/

		@media screen and (max-width: 640px) {
			
			 /***************** Header *****************/
			
			
			 /***************** Content *****************/
			 
			 #banner .container {
				 bottom: -20% !important;
			}
			 
			 #banner .beautiful-interior-design aside {
				padding: 10% 5% 5% 25%;
				text-align: center;
				font-family: 'helvetica_condensed_bq_light';
			}
			 
			 #banner .beautiful-interior-design blockquote {
						
				padding: 20px;
				text-align: left;
				margin: 00px 00px 20px 25px;
				background: #881c85;
				font-family: 'helvetica_ce_cond';
				font-size: 17px;
				line-height: 22px;
				color: #FFFFFF;
				text-shadow: 00px 01px 01px #000000;
				position: relative;
			}
			
			#banner .beautiful-interior-design blockquote:before {
				width: 0;
				height: 0;
				border-top: 10px solid transparent;
				border-right: 20px solid #881c85;
				border-bottom: 10px solid transparent;
				position: absolute;
				left: -20px;
				top: 50%;
				z-index: 999;
				content: "";
			}
			
			#banner .beautiful-interior-design h2 {
				font-size: 20px;
				padding: 00px 00px 10px 00px;
			}
			
			#banner .beautiful-interior-design h3 {
				text-transform: uppercase;
				font-size: 15px;
				margin-bottom: 5px;
			}
			
			#banner .beautiful-interior-design h3 A {
				color: #881c85;
				text-decoration: none;
			}
			
			#banner .beautiful-interior-design h3 A:hover {
				text-decoration: underline;
			}
			
			#banner .beautiful-interior-design .box a {
				background: #403c39;
				padding: 8px 15px;
				border: 1px solid #FFFFFF;
				color: #FFFFFF;
				text-decoration: none;
				text-transform: uppercase;
				margin: 5px;
			}
			
			#banner .beautiful-interior-design .box a:hover {
				background: #881c85;
			}
			 
			
		
		 	figure.right.margin_left, figure.left.margin_right {
                 float: none;
                 margin: 00px 00px 15px 00px;
                 width:  100%;
                 text-align: center;
             }
			
			 /***************** Footer *****************/

				#footer .copyright figure {
					width: 25%;
				}
				
.pagi-row button.prev-btn{ margin: 0;}
.pagi-row button.next-btn{ margin: 0;}
.pagi-row button i{ font-size: 18px;}


}

/******************** Width 480px *********************/

		@media screen and (max-width: 580px) {

				.handle::after{height: 30px; line-height: 30px; margin: -15px 0 0 -15px; width: 30px; font-size: 22px;}	
				.draggable:after {
  width: 36px;
  height: 36px;
  margin: -18px 0 0 -18px;
  line-height: 36px;
  font-size: 22px;
}	
		}

		/******************** Width 480px *********************/

		@media screen and (max-width: 480px) {
			
		
		/******************** Banner *********************/
			
				
			#banner .container {
				width: 80% !important;
				margin: 0% 10% !important;
				padding: 0px;
				position: absolute;
				top: 20px;
				z-index: 9;
			}
			
				#banner .beautiful-interior-design {
					width: 100%;
					height: auto !important;
					margin: auto;
				}
				
				#banner .beautiful-interior-design aside {
					padding: 2% 5% 00% 25%;
					text-align: center;
					font-family: 'helvetica_condensed_bq_light';
				}
				
					#banner .beautiful-interior-design blockquote {
						padding: 18px;
						font-size: 13px;
						line-height: 18px;
					}
					
					#banner .beautiful-interior-design blockquote:before {
						top: 35%;
					}
				
				#banner .beautiful-interior-design .box  {
					margin: -15px 00px 00px 0%;
					width: 100%;
					padding: 00px 20px 10px 0%;
					text-align: right;
				}
				
				#banner .beautiful-interior-design .box a { 			
					font-size: 13px;			
				}
				
		#home #content {
			margin-top: 10% !important;
			}
			
			#home .how {
				top: -0%;
			}
	

}

		/******************** Width 400px *********************/

		@media screen and (max-width: 400px) {

	
		.cd-image-label{ padding: 0.4em 0.7em; font-size: 13px; line-height: normal;}

}

/******************** Width 360px *********************/

		@media screen and (max-width: 340px) {

				
				

}
		
		/******************** Width 400px *********************/

		@media screen and (max-width: 320px) {

			
}
