@media screen and (max-width: 560px){
	/*----- layout ----*/
	.container {width: 95%;}
	.grid { margin-top: 30px;}
	.grey-bg, .white-bg { padding: 40px 0;  }
	
	/*---- hero -----*/
	.hero-content{ min-width: 280px;  padding: 25px; }
	
	.menu-wrap {width: 220px;}
	.mouse-icon {bottom: 5px;}
	
	/*---- typography -----*/
	h1 { text-align:center; font-size: 3rem; padding-bottom: 1.5rem; }
	h2 { text-align:center; font-size: 2.2rem; }
	h3 { font-size: 1.8rem;  }
	h4 { font-size: 1.8rem; }
	
	/*---- home -----*/
	
#home {padding-bottom: 20px; top:20px; background-color: #fff;}
.separator { border: none;  height: 40px; }
.hero-content{top:30%; }

	/*---- portfolio -----*/
	ul.portfolio-image li{ width: 100%; padding-top: 95%; }

	/*---- blog -----*/
	.grid-item { width: 100% !important; padding: 0; }

	/*---- quote -----*/
	.wrap-about{  padding: 0 0 20px 0; min-height: 400px !important; }
	.wrap-about .w-content{ left: 0; right: 0; width: 100%; top: 0; padding: 30px 0; transform: none; }
	.intro-centered {text-align: center;}
	.title-small span:after {margin: 0 auto;left:35%; }
	.title-small-center { margin-top: 60px;}

  /*------- testimonial -------*/
  #testimonial { height: 600px; clear: both;}
	
.list-testimonial .content-testimonial .testi { font-size: 14px; line-height: 1.5; letter-spacing: 1px; }
.testi span {font-size: 1.7em; font-weight: 400;line-height: 1 }
.list-testimonial .content-testimonial {padding: 0 15px;}

.skillst {margin-top: 50px;}
	
.instagram-media {max-width: 400px !important;min-width: 280px!important; min-height: auto; margin-bottom: 30px!important;}
.owl-theme .owl-controls .owl-page span{  width: 9px; height: 9px; margin: 4px 6px;}
	
	
.icons { width: 40%; text-align: center; }
	
.team-spacing {margin-bottom: 20px; padding: 0 14px;line-height: 1.2em ; font-size: 14px;}

.header-copy  { margin-bottom: 250px; padding-top: 25px; }	
.header-copy-404  { margin-bottom: 165px; padding-top: 25px; }	
.header-Services  { background-image: url("../images/MCD-MF-TeamBanner_Mob.jpg"); }
.header-Contact  { background-position: top center; background-image: url("../images/MCD-MF-ContactBanner_Mob.jpg"); }
.header-About  { background-position: top center; background-image: url("../images/MCD-MF-ZooBanner_Mob.jpg"); }
.header-404  { background-position: top center; background-image: url("../images/MCD-MF-404Banner_Mob.jpg"); color: #0F1F35; }
	
	
.roller { height: 2.6rem;  line-height: 2.125rem; }
  
  #spare-time { font-size: 1rem; letter-spacing: 0.1rem; }
  
  .roller #rolltext { animation: slide-mob 5s infinite; }
  
  @keyframes slide-mob {
  0%{ top:0;
  }
  25%{ top: -2.125rem;    
  }
  50%{ top: -4.25rem;
  }
  72.5%{ top: -6.375rem;
  }
}
	
		
	.footer-bottom img { max-width: 35%; text-align: center; padding-bottom: 30px;  }
	
	.social-icons { width: 12%; height: auto; margin-right: 15px; }
	.stamp-align { text-align: center; }
	
	.roomy-30-TBR { padding: 10px 10px 10px 0; }
	.roomy-50-TB { padding: 25px 0px; }
	.roomy-50-LR { padding: 5px 25px; }
	.roomy-50-RBL { padding: 0px 30px 30px 30px; }
	.roomy-75-TB { padding: 35px 0px; }
	.mroomy-20-top { padding: 20px 0 0 0; }
	.roomy-150-top { padding: 75px 0px 0px; }	
	.roomy-110-top { padding: 70px 0px 25px; }
	.mroomy-25-LR { padding: 0 25px; }
	
}


@media screen and (max-width: 768px){
	/*------ header -----*/	
	body {font-size: 15px;line-height: 1.5;}
	.for-sticky{ padding: 0; }
	.logo-nav { margin-left: 10px; margin-top: 8px;}
	.menu-button{margin-right: 30px;}
	.ma-infinitypush-wrapper.ma-infinitypush-active-button.ma-infinitypush-button-right .ma-infinitypush-button{ left: -65px; }
	.ma-infinitypush-wrapper{ width: 200px; }
	.ma-infinitypush-wrapper	ul > li{ width: 200px; }

	


	/*------- home ------*/
	#home p {width: 100%;}
	.listing-item{ margin: 0px;}
	
	.img-mobile { display: none; }
	
    .img-desktop { display: block; width: 50%; border-top-left-radius: 15px; border-top-right-radius: 0px; border-bottom-left-radius: 15px; }

	/*----- portfolio -----*/
	.portfolio-image > li{ width: 50%; }
	.title-small{margin-top: 35px; text-align: center;}

  /*---- blog -----*/
	.grid-item {width: 50%;}

  /*------- about -------*/
  .bg-about{min-height: 520px;}
  .wrap-about{ min-height: 520px; padding-bottom: 10%; padding-left: 30px; padding-right: 30px; }
  .wrap-about .head-quote{padding-top: 10%;}

  .content-right{ margin-top: 20px; }

  .text-grey{margin-bottom: 10px;}
	
	
  .skillst{ margin-top: 50px;}
	
	/*------ footer -----*/
  footer p{ text-align: center; }
  footer ul.social { margin-left: -40px; text-align: center; }
  footer ul.social li {  padding: 0px 10px 0px 10px; }
}

@media screen and (min-width: 1024px){
	.content-right { margin-top: 20px; padding: 0 20px 0 60px; 
	}
}

@media only screen and (min-width: 1920px) { 
	
.container { width: 80%; }
.icons { width: 30%; text-align: center; }
.roomy-110-top { padding: 110px 0px 100px; }
.roomy-50-TB { padding: 165px 0px; }
.wroomy-105-TB { padding-top: 105px; padding-bottom: 105px;  }
.header-Services  { background-position: center center; }
.header-404  { background-position: center right; min-height: 540px; padding-top: 125px; }
.social-icons { width: 5%; height: auto; margin-right: 10px;
}

}