/*
Theme Name: Blenheim and Blue
Theme URI: http://www.squarerchilli.co.uk
Author: squarechilli
Author URI: http://www.squarerchilli.co.uk
Description: A custom theme by squarechilli for Blenheim and Blue.
Version: 1
*/

/*headers*/
@font-face {
    font-family: 'BebasNeueRegular';
    src: url('css/BebasNeueRegular.eot');
    src: url('css/BebasNeueRegular.eot') format('embedded-opentype'),
         url('css/BebasNeueRegular.woff2') format('woff2'),
         url('csss/BebasNeueRegular.woff') format('woff'),
         url('css/BebasNeueRegular.ttf') format('truetype'),
         url('css/BebasNeueRegular.svg#BebasNeueRegular') format('svg');
}

/*text*/
@font-face {
    font-family: 'BitterRegular';
    src: url('css/bitter-regular.eot');
    src: url('css/bitter-regular.eot') format('embedded-opentype'),
         url('css/bitter-regular.woff') format('woff'),
         url('css/bitter-regular.ttf') format('truetype'),
         url('css/bitter-regular.svg#BitterRegular') format('svg');
}

/*logo and some headers*/
@font-face {
    font-family: 'CaviarDreams';
    src: url('css/CaviarDreams.eot');
    src: url('css/CaviarDreams.eot') format('embedded-opentype'),
         url('css/CaviarDreams.woff2') format('woff2'),
         url('css/CaviarDreams.woff') format('woff'),
         url('css/CaviarDreams.ttf') format('truetype'),
         url('css/CaviarDreams.svg#CaviarDreams') format('svg');
}

/*essentials*/
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
body {position: relative; font: 14px BitterRegular, Arial, Helvetica, sans-serif; font-weight: 100; color: #808285; -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust: 100%; margin:0px; padding: 0px 0px 15px 0px }
a {color: #262262; text-decoration: underline; outline: none;-webkit-transition: background-color 0.25s; -moz-transition: background-color 0.25s; -o-transition: background-color 0.25s;  transition: background-color 0.25s;}
a:hover {text-decoration: underline;}
h1, .header1 {font-weight: 100; font-size: 36px; margin: 10px 0px; text-align: center; font-family: BebasNeueRegular; text-transform:uppercase}
.standard h1 {font-family: 'CaviarDreams'; text-transform: none; color: #1d8593 }
h1 a {text-decoration: none; color: #1d8593}
h2 {position: relative; font-size: 22px; }
h3 {margin: 10px 0; color: #6bc4b2}
.standard p {line-height: 1.6em}
img {max-width: 100%; border: 0px; height: auto; width: auto\9; /* ie8 */}
hr {height: 28px; background: url('images/hr.png') no-repeat center; border: none; margin: 28px 0}
.alignleft {float: left; margin-right: 15px}
.alignright {float: right; margin-left: 15px}
.aligncenter {text-align: center;}
.text-right {text-align: right !important}
.center {margin: 0 auto; text-align: center}
.noborder {border: 0px}
.nomargin {margin: 0 !important}
.clear {clear: both}
.clear:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
section {position: relative; clear: both}
.wrapper {max-width: 1110px; margin: 0px auto; color: #808285; background-color: #fff;padding: 0 0 0 0;}
.wrapper:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
.fullwidth {position: relative; width:auto;overflow:hidden; margin: 30px 0}
strong {font-weight: bold; text-transform: uppercase; color: #1d8593 }
a.fancylink {border: 2px solid #23bbd0; border-radius: 5px; padding: 10px; color: #23bbd0; text-decoration: none}
a.fancylink:hover {background-color: #23bbd0; text-decoration: none; color: #fff}

.bb {font-family: 'CaviarDreams'; color: #1d8593; text-transform: capitalize}

.large {font-size: 1.2em}
.larger {font-size: 1.6em}
.largest {font-size: 2em}

/*header*/
header {position: relative; width: 100%; text-align: center; margin-bottom: 10px; font-family: 'BebasNeueRegular'; font-size: 26px}
.logo {position: relative; margin: 20px auto 10px auto; display: inline-block; clear: both}
nav ul {margin: 0 auto; padding: 0px; list-style-type: none; text-align:center; text-transform: uppercase; display: inline-block;}
nav ul li {margin: 0; padding: 0px; display:inline;  position: relative; }
nav ul li a {display:inline-block; color: #808285; text-decoration: none; padding: 10px 11px 10px 11px; font-weight: 100;}
nav ul li a:hover {text-decoration: underline}
nav ul li.active {border-bottom: 3px solid #000}

.nav-tel {position: relative; display: inline-block; color: #1d8593}

.header-social {position: relative; top: 15px;}
.header-social p {position: relative; display: inline-block; float: right; line-height: 26px; margin: 0 20px 0 0;}
.header-social p a {color: #6d6e71; text-decoration: none}
.header-social p a:hover {text-decoration: underline}
ul.social {display: inline-block; list-style-type: none; margin: 0 0 0 20px; padding: 0;  }
ul.social li {display: inline-block; margin: 0 0 0 10px;}
ul.social li a {display: block; width: 20px; height: 20px; background: url('images/social.png') no-repeat; text-indent: -9999px;  padding: 0}
ul.social li.facebook a {background-position: -32px 0;}
ul.social li.twitter a {background-position: -62px 0;width: 24px;}


/*homepage*/
.cityguilds {position: absolute; right: 0; top: 40px}
.home-gallery-area {position: relative; margin: 30px 0 0 0; }
.home-gallery-area div {position: relative; width: 263px; margin-left: 19px; display: inline-block; float: left}
.home-gallery-area div:first-child {margin-left: 0}
.homepage-testimonials {position: relative;margin: 30px 15%; text-align: center}
.homepage-testimonials-title {position: relative; display: block; font-size: 30px; margin: 20px 0px; text-align: center; font-family: BebasNeueRegular; text-transform:uppercase }
.homepage-testimonials ul {position: relative; list-style-type: none; margin: 0; padding: 0}
.homepage-testimonials ul li {position: relative; width: 40%; display: inline-block; float: left; color: #1d8593;}
.homepage-testimonials ul li:first-of-type {margin-right: 10%}
.homepage-testimonials ul li a {text-decoration: none; color: #1d8593; font-size: 16px}
.homepage-testimonials ul li a:hover {text-decoration: underline;}

.home-feeds {position: relative}
.home-feeds-twitter, .home-feeds-instagram, .home-feeds-facebook {position: relative; display: inline-block; float: left; background-color: #f6f6f2; width: 32%; padding: 20px;height: 485px;}
.home-feeds-twitter, .home-feeds-instagram {margin-right: 2%}
.home-feeds h2 {margin: 0 0 20px 0; font-weight: 100}
.home-feeds h2 a, .home-feeds h2 a strong {color: #1d8593; text-decoration: none; font-family: 'CaviarDreams'; text-transform: none;} 
.home-feeds-twitter h2 {padding-left: 40px; background: url('images/social-blue-twitter.png') 0 0 no-repeat}
.home-feeds-instagram h2 {padding-left: 40px; background: url('images/social-blue-instagram.png') 0 0 no-repeat}
.home-feeds-facebook h2 {padding-left: 40px; background: url('images/social-blue-facebook.png') 0 0 no-repeat}
.home-feeds-twitter ul, .home-feeds-facebook ul {margin: 0; padding: 0;}
.home-feeds-twitter ul li, .home-feeds-facebook ul li {margin: 20px 0; padding: 0; list-style-type: none}

.between-grooming-promo {color: #1d8593; font-family: BebasNeueRegular; text-transform: uppercase; font-size: 24px}
.between-grooming-promo a {color: #1d8593; text-decoration: underline}
.between-grooming-promo a:hover {text-decoration: underline}


/*general*/
.two-images, .two-images-reverse {position: relative; margin: 10px 0 20px 0;}
.two-images img:first-of-type {position: relative; float: left; width: 66%}
.two-images img:nth-of-type(2) {position: relative; float: right;width: 32.3%;}
.two-images-reverse img:first-of-type {position: relative; float: left; width: 32.3%;}
.two-images-reverse img:nth-of-type(2) {position: relative; float: right; width: 66%}
.centered-para {position: relative; margin: 0; text-align: center; font-size: 14px; font-weight: 100}
.centered-para > span {position: relative; display: inline-block; margin: 0 15%;}
.gallery .centered-para > span {margin: 0}
.logo-menu {position: relative; width: 100%; text-align: center; margin-bottom: 10px; font-family: 'BebasNeueRegular'; font-size: 26px}
.gallery-item {float: left;text-align: center;width: 263px; margin-right: 19px}
.gallery-item:nth-of-type(4n) {margin-right: 0}


/*footer*/
footer {position: relative; margin: 40px 0}
.footer-menu {position: relative; display: inline-block; float: left; width: 48%; padding: 0; margin-right: 4%}
.footer-menu ul {position: relative; display: inline-block; margin: 0; padding: 0; float: left; width: 45%}
.footer-menu ul li {margin: 0; padding: 0; list-style-type: none}
.footer-menu ul li a {text-decoration: none;font-size: 14px; line-height: 30px}

.footer-newsletter {position: relative; display: inline-block; float: left; width: 48%; padding: 0;}
.footer-newsletter h2 {margin: 0; font-weight: 100; font-size: 18px}
.footer-newsletter form {margin: 29px 0}
.footer-newsletter input[type=email] {position: relative; background-color: #eeeee5; border: 0;font-size: 16px; color: #000; width: 70%; height: 30px; top: 2px; padding-left: 7px}
.footer-newsletter input[type=submit] {background-color: #000; border: 0;font-size: 12px; color: #fff; width: 29%; height: 30px; text-transform: uppercase; -webkit-appearance: none;}

footer ul.social {float: none }

.footer-signoff {position: relative; border-top: 1px solid #ccc; margin: 50px 0; padding-top: 30px}
.footer-signoff p {float: left}
.footer-signoff span {float: right;}
.footer-signoff span a {text-decoration: none}



/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (min-width: 960px) {
		 .product-grid-item:nth-of-type(3n) {margin-right: 0px;}
		}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
			
		}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
			.wrapper {margin: 0 10px}
			.logo {margin-top: 80px}
			.cityguilds {position: relative; top: 0;}
			.centered-para > span {margin: 0}
			.centered-para > span h1 span {display: block; margin: 0px 0 10px 0}
			.home-gallery-area div {width: 23%; margin: 0 2% 0 0}
			.home-gallery-area div:nth-of-type(4n) {margin: 0}
			.homepage-testimonials {margin: 10px 0}
			.homepage-testimonials ul li {width: 100%; margin: 10px 0}
			.home-feeds-twitter, .home-feeds-instagram, .home-feeds-facebook {width: 100%; height: auto; margin-bottom: 15px}

			.gallery-item {width: 46%; margin-right: 8%}
			.gallery-item:nth-of-type(2n) {margin-right: 0}

			
		}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 480px) {
			.home-gallery-area div {width: 49%; margin: 0 2% 0 0}
			.home-gallery-area div:nth-of-type(2n) {margin: 0}
			


			
		}