
/*mobile*/
@media screen and (max-width: 768px) {

/* anything in here will affect viewports up to 768px
   eg mobiles */

	 .strapline {
	   margin-right: 0;
	   text-align: left;
	 }
	 .header .address {
	   text-align: center;
	 	margin-top: 20px;
	 }

	 .caption-wrap {
		 min-height: 500px;
	 }

	 .logo {
	   margin: 30px auto 0;
	   max-width: 450px;
	 }
    
    #owl-example {
        display:none;
    }

}

@media screen and (max-width: 940px) {

/* anything in here will affect viewports up to 768px
   eg mobiles */

	 .strapline {
		 font-size: .9em;
	   text-align: left;
	 }

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

/* anything in here will affect viewports up to 768px
   eg mobiles */

	 .aside {
	   clear: both;
	 }

h2.caption-title {
  font-size: 1.2em;
  margin-top: 8%;
}

p.caption-cta {
  font-size: 14px;
}

p.caption-text {
  font-size: 14px;
}

}

@media screen and (max-width: 1024px) {

.workbenches-block, .storage-block, .accessories-block, .bespoke-block {
  min-height: 320px;
}
    
}



/* sometimes you'll want to target very specific widths
e.g */

@media screen and (min-width: 320px) and (max-width: 550px) {
	/* This media query will only hit viewports between
	320 and 550 pixels */
	.cta-text {
		clear: both;
		text-align: center;
	}
	.muk-logo {
		float: none;
	}
	.cta-text {
		float: none;
		margin-top: 20px;
		margin-bottom: 20px;
		margin-left: 0;
	}
	.address {
  text-align: center;
}
.copyright p {
  line-height: 1.5em;
  max-width: 420px;
}
.strapline {
  margin-right: 0;
  text-align: center;
}
.header .address {
  text-align: center;
	margin-top: 20px;
}

.owl-carousel .owl-stage-outer {
  display: none;
  overflow: hidden;
  position: relative;
}

p.intro_text {
  font-size: 1.1em;
  font-weight: 600;
  line-height: 1.4em;
}
.article p {
  font-size: 0.9em;
  line-height: 1.6em;
  margin-bottom: 7px;
}

.header .address {
  color: #1a1a1a;
  font-size: 1.2em;
  line-height: 1.2em;
  margin-bottom: 20px;
  max-width: 100%;
	margin-top: 0px;
	font-weight: 400 !important;
}
.strapline {
	margin-top: 10px;
	line-height: 1.1em;
	font-weight: 600;
}
.main-blocks {
	padding-bottom: 20px;
	padding-top: 0px;
}

.logo {
  margin: 30px auto 0;
  max-width: 450px;
}

}

/*========================

The specific media queries are not important.
It's better to work around your design and let
it dictate your break points.

'make sure it looks good at all sizes'

========================*/

/*
Box Sizing - A better box model
box-sizing: border-box;
more info: http://www.paulirish.com/2012/box-sizing-border-box-ftw/
*/


/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */
@media (min-width: @screen-sm-min) { ... }

/* Medium devices (desktops, 992px and up) */
@media (min-width: @screen-md-min) { ... }

/* Large devices (large desktops, 1200px and up) */
@media (min-width: @screen-lg-min) { ... }
