/** Add your custom styles here **/

@media (max-width: 767px) {
  .hide-mobile {
    display: none;
  }
}
@media (max-width: 767px) {
  .center {
    text-align: center;
  }
.email_head {
  text-align: center;}

}


.xxmain {
    margin-top: 30px;
}

.head {
  margin: -20px 0 10px;
}

.newsletter .follow {
  padding: 20px 30px 20px 0;
  text-align: center;
}

/** make tel no box bigger in contact us page **/
input [type="tel"] {
    border: 1px solid #ccc;
    padding: 6px 4px;
    outline: none;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #777;
    margin: 0;
    width: 310px;
    max-width: 100%;
    display: block;
    margin-bottom: 20px;
    background: #fff;
}
form input[type="tel"] {
    border-radius: 0px;
    border: 1px solid #e5e5e5;
    -webkit-border-radius: 0px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 35px;
    padding-left: 15px;
    padding-right: 15px;
}
/** END tel bigger **/

.logo img {
  width: 100%;
}

@media (min-width: 1200px) {
  .logo img {
    width: auto;  
  }
}
@media (max-width: 767px) {
.logo img {
    
align: center;
  }
} 



/** banner styles **/
.banner .cycle-slideshow {
  
width: 100%; height: 410px;
  
} 

.banner .cycle-slideshow .slide {
  padding: 0px 20px;
  width: 100%;
}
.banner .cycle-slideshow .slide .img {
  width: 45%;
  text-align: right;
  float: left;
}

.banner .cycle-slideshow .slide .txt {
  float: right;
  width: 50%;
}
.bannersubhead {color: #ffffff; font-size: 1.1em; }
.bannerthirdline {color: #000000; font-size: 1.1em; }
/** end of banner styles **/

ul { list-style-type: disc; margin-left: 15px; color: #000000;  }
li:before {
   
   
}

nav .row ul li:hover a,
nav .row ul liactive a {
  background-color: #d6232e;
  color: white;
}
nav .row ul li:visited:hover {
  background-color: #eeeeee;
  color: white;}

nav .row .col-16 .wrap {
  background: #B1B1B1; text-align: center;
  /* Old browsers */
  background: -moz-linear-gradient(top, #ce7ba5 0%, #c66696 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ce7ba5), color-stop(100%, #c66696));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #ce7ba5 0%, #c66696 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #ce7ba5 0%, #c66696 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #ce7ba5 0%, #c66696 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #ce7ba5 0%, #c66696 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@colour1', endColorstr='darken(@colour2, 10%)', GradientType=0);
  /* IE6-9 */
  height: 48px;

}
nav .row ul li .main-sub.active {
  height: auto;
  padding: 20px;
  overlfow: auto;
  border-left: 3px solid #c66696;
  border-right: 3px solid #c66696;
  border-bottom: 3px solid #c66696;
  border-top: 3px solid #c66696;
}
nav .row ul li .main-sub ul li {
  display: block;
  border-bottom: 1px dashed #b3b3b3;
  line-height: 0.9em;
  text-transform: none;
  font-weight: normal;
  text-align: left;
  padding: 10px 0;
}

.prod_section {
   line-height: 0.9em;
  text-transform: uppercase;
  font-weight: normal;
  text-align: left;
color: #eeeeee;
 font-size: 12px; text-decoration: none;
}
.prod_section:hover {
   line-height: 0.9em;
  text-transform: uppercase;
  font-weight: normal;
  text-align: left;
color: #ff0000;
 font-size: 12px;
}
.newsletter {
  background-color: #c66696;
  color: white;
  overflow: auto;
  font-size: 1.3em;}

.display ul li a.active {
  color: white;
  background: #cccccc;
  border: 1px solid #000000;
}
nav .row ul li .main-sub {
  width: 100%;
  height: 0;
  background: #eeeeee;
  right: 0;
  top: 47px;
  position: absolute;
  z-index: 200;
  overflow: hidden;
}

body {
  height:100%; background-image: url("https://fixings-design.qvs3.co.uk/assets/file/img/xbg_grey_fade2.jpg"); margin-top: 65px;  height: 100%; z-index: 200; background-repeat: repeat-x; position: relative;
}
.fa {
  display: inline-block;
  font: normal normal normal 18px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}



.feature-categories {
  border: 3px solid #ff0000;
  height: 400px;
}
.feature-categories ul li {
  margin: 0;
  padding: 0;
  height: 12.5%;
  font-weight: bold;
  text-transform: uppercase;
  border-bottom: 1px solid #ff0000;
  line-height: 2.1em;
 background-color: #ffffff;
}

.feature-categories ul li.title {
  display: block;
  padding: 10px 15px;
  background-color: #ff0000;
  color: white;
  font-size: 1.1em;
  line-height: 1.8em;
}
.feature-categories {
  border: 3px solid #ff0000;
  height: 400px;
}
.feature-categories ul li .sub.active {
  width: 903px;
  padding: 20px;
  border-top: 3px solid #ff0000;
  border-right: 3px solid #ff0000;
  border-bottom: 3px solid #ff0000;
}
.feature-categories ul li:hover a,
.feature-categories ul liactive a {
  color: #ff0000 !important;
}
.feature-categories ul li:hover .sub ul li a,
.feature-categories ul liactive .sub ul li a {
  color: #666666 !important;
}

.primary {
  background: #ff0000;
  color: white;
  font-weight: normal;
  text-transform: uppercase;
  border: 1px solid #ff0000;
  -webkit-transition: background-color 0.2s linear 0;
  -moz-transition: background-color 0.2s linear 0;
  -ms-transition: background-color 0.2s linear 0;
  -o-transition: background-color 0.2s linear 0;
  transition: background-color 0.2s linear 0;
  text-shadow: none;
  border-radius: 3px;
  padding: 7px 14px;
  display: inline-block;
  font-size: 12px;
}

.contact-details .fa {
  margin-right: 5px;
  color: #ff0000;
}

.topper {
  background-color: #ffffff;
  border-bottom: 0px solid #cccccc;
  padding: 0px 0 0px;
  position: fixed;
  width: 100%;
  margin: 0;
  top: 0;
  z-index: 9999;
}



.strap-title {
  margin-top: 18px;
margin-bottom: 8px;
  font-size: 28px; 
  text-align: right; 
line-height: 24px;
  font-weight:bold; 
  color: #888888 
}


.strap-title small {
  display: block;
  margin-top: 2px;  
  font-size: 0.7em; 
  font-weight: normal 
}

@media (max-width: 1199px) {
  .strap-title {
    font-size: 1.4em;
  }
}

@media (max-width: 960px) {
  .strap-title {
    display: block;
font-size: 1.4em; text-align: right;
  }

}  

@media (max-width: 767px) {
.strap-title {
    display: block;
font-size: 1.4em;
align: center;
  }
} 



.contact_head {
  font-family: 'Ek Mukta', sans-serif; color: #888888;
font-size: 28px; font-weight: bold; line-height: 24px; margin-top: 18px; margin-bottom: 8px; align: right; }

.email_head {
  font-family: 'Ek Mukta', sans-serif; color: #888888;
font-size: 22px; line-height: 24px; margin-bottom: 8px; align: right;}

.email_head_hover {
  font-family: 'Ek Mukta', sans-serif; color: #888888;
font-size: 22px; line-height: 24px; margin-bottom: 8px; align: right;}

.email_head_hover:hover {
  font-family: 'Ek Mukta', sans-serif; color: #d62129;
font-size: 22px; line-height: 24px; margin-bottom: 8px; align: right;}


.post {
  background-color: #ffffff;
padding: 20px;
  margin-bottom: 20px;
  border: 1px solid #e5e5e5;
}
.gentext {
  font-family: 'Open Sans', sans-serif;
  font-size: 1.2em;
  line-height: 1.4em;
}

/** making responsive icon colours, text colour change and close button. default was #009f8e **/
.btn.btn-head {
		color: #d6232e;
		display: inline-block;
	}
.md-device-menu.active ul li a {
		width: 100%;
		display: block;
		color: #d6232e;
		padding-bottom: 10px;
		margin-bottom: 10px;
		border-bottom: 1px solid #f4f4f4;
		font-size: 1.2em;
	}

@media only screen and (max-width: 959px) {
.logo img {
		width: 50%;
		height: 50%
	}
.md-close {
		width: 30px;
		height: 30px;
		background: #d6232e;
		color: white;
		border-radius: 50%;
		-webkit-border-radius: 50%;
		float: right;
		border-color: transparent;
		font-size: 1.5em;
		padding: 0;
		line-height: 1;
		text-shadow: 1px 1px #007c6f;
	}

	.md-close:hover, .md-close:active, .md-close:focus {
		background: #ff0000;
		border-color: transparent; color: #ffffff;
	}

	.account-menu-nav, .filter-menu {
		display: none;
	}

	.account-menu-btn, .filter-menu-btn {
		width: 100%;
	}
}

/** end of responsive and close icon colours **/