/*
Theme Name: Sam
Author: Sam Blaxland
Version: 1.0
*/

@import url('styles/reset.css');
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600);

/* Alignment */
.alignleft {
    display: inline;
    float: left;
    margin-right: 1.5em;
}
.alignright {
    display: inline;
    float: right;
    margin-left: 1.5em;
}
.aligncenter {
    clear: both;
    display: block;
    margin: 0 auto;
}
  
/* ------- Typography ---------------------------------------------------------- */

/* Web fonts */

@font-face {
    font-family: 'BebasNeue';
    src: url('styles/fonts/bebasneue.eot');
    src: url('styles/fonts/bebasneue.eot?#iefix') format('embedded-opentype'),
	     url('styles/fonts/bebasneue.woff') format('woff'),
	     url('styles/fonts/bebasneue.ttf') format('truetype'),
	     url('styles/fonts/bebasneue.svg#bebasneue') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Typography styles */

body {
	font-family: Open Sans, Helvetica, Arial, Sans-Serif;
	font-size: 16px;
}
h1,h2,h3,h4,h5,h6 {
	font-family: BebasNeue;
	color: #323232;
}
h1 {
	font-size: 35px;
}
h2 {
	font-size: 27px;
}
h3 {
	font-size: 21px;
}
h4 {
	font-size: 18px;
	background: url('styles/img/square-bullet.png') no-repeat 0 9px;
	text-indent: 13px;
	color: #333;
}
h1 a, h2 a, h3 a, h4 a,
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited{
text-decoration: none;
color: rgb(24, 24, 24);
}
.yellow {
	color: #eeb500;
}
hr.top, hr.bottom {
	height: 32px;
	margin: 50px 0 40px;
	background: url('styles/img/shadow.png') no-repeat center top;
	clear: both;
}
hr.bottom {
	background: url('styles/img/shadow-bottom.png') no-repeat center top;
}
a {
text-decoration: none;
}

/* ------- Layout ---------------------------------------------------------- */

.site { /* Wraps the entire site */
	background: white url('styles/img/dotty-box-pattern-white.png') top center repeat;
	border-top: 8px #4f4738 solid;
	overflow: hidden;
}
.site-header {
   margin: 20px auto;
   width: 960px;
   height: 170px;
}
body.home .site-header {
   height: 130px;
}
#main {
   width: 960px;
   overflow: hidden;
   margin: 0 auto 25px;
   background: url('styles/img/h-div.png') no-repeat top center;
   padding-top: 30px;
}
body.home #main {
   background: none;
   margin-bottom: 0;
}
.site-footer { /* Container for the entire site footer area */
    color: #fff;
}
.single #primary {
    width: 54.5%;
    margin: 0 0 0 10%;
    float: left;
}
.single #secondary {
width: 57.5%; 
margin: 0 0 0 10%; 
float: left;
}
.single #tertiary {
    width: 54.5%;
    margin: 0 5%;
    float: left;
}
.hover-info {
cursor: help;
}


/* ------- Page styles ---------------------------------------------------------- */

/* Home */

.home-testimonial-left {
float: right;
width: 68%;
margin: 35px 20px;
}
.home-testimonial-right {
float: right;
width: 34%;
margin: 0 1% 0 0;
}
.home-testimonial-image {
width: 20%;
}
@media screen and (max-width: 1250px) {
.home-testimonial-left {
margin-top: 0;
}
}
@media screen and (max-width: 900px) {
.home-testimonial-left, .home-testimonial-right {
float: left;
width: 100%;
margin: 0 0 20px 0;
margin: 10px 0 0 0;
}
.home-testimonial-image {
width: auto;
margin: 0;
width: 100%;
}
.home-testimonial-image img {
margin: 0 auto;
display: block;
box-sizing: border-box;
}
}
/* Packages */
ul.packages {
	overflow:hidden;
	margin: 0;
}
.webpackage, .webpackagemid {
	width: 29%;
	float: left;
	max-width: 319px
}
.webpackagemid {
	padding: 0 6.5%;
}
.entry-content .webpackage img {
    border: 0;
    padding: 0;
    margin: 0;
}
.webpackage h2{
	font-family: Georgia, serif;
	font-style: italic;
}
.webpackage p {
	margin-bottom: 7px;
}
li.webpackage {
	list-style: none;
}
.webpackage ul ul {
	margin: 0 0 10px 23px;
}
.purplearrow {
	list-style-image: url("styles/img/purple-arrow.png");
}
.greenarrow {
	list-style-image: url("styles/img/green-arrow.png");
}
.bluearrow {
	list-style-image: url("styles/img/blue-arrow.png");		
}
.price {
	font-size: 35px;
	margin-top: 25px;
}
.pricesmall {
	font-size: 20px;
	vertical-align: text-top;
}
.contact-me {
	text-align: center;
	margin-top: 40px;
	background: url("styles/img/let's-get-in-touch.png") no-repeat top center;
	clear: both;
}
.contact-me a,.contactform input.submit {
	background: white url('styles/img/yellow-button-bg.png') repeat-x top center;
	border: 6px #fff solid;
	border-radius: 10px;
	padding: 3px 15px 0;
	font-size: 35px;
	font-family: bebasneue, georgia, serif;
	text-decoration: none;
	box-shadow: 0 0 3px #888;
	color: #181818;
}
.contact-me a:hover,.contact-me a:active, .contactform input.submit:hover {
	color: #000;
	box-shadow: 0 0 8px #888;
}
.free-quote, .talk-about-website {
	width: 500px;
	height: 60px;
	padding: 60px 0 0 0;
	text-align: center;
	display: block;
	margin: 0 auto;
}
.free-quote {
	background: url("styles/img/free-quote.png") no-repeat top left;
}
.talk-about-website {
	background: url("styles/img/talk-about-website.png") no-repeat top left;
}
/* Portfolio single page */
.entry-content .one-by-one {
margin: 0 1px;
box-shadow: 0 0 2px #B6B6B6;
}
.entry-content .two-by-two {
width: 540px;
margin: 0 1px;
margin-bottom: 0;
box-shadow: 0 0 2px #B6B6B6;
}
@media screen and (max-width: 1265px) {
.entry-content .two-by-two {
width: 48%;
}
}
.entry-content .three-by-three {
width: 353px;
}
.entry-content .three-by-three.alignleft {
margin: 0 20px 0 0;
}
.entry-content .three-by-three.alignright {
margin: 0;
}
@media screen and (max-width: 1265px) {
.entry-content .three-by-three {
width: 31%;
}
.entry-content .three-by-three.alignleft {
margin: 0 2% 0 0;
}
}
.opensans {
font-family: Open Sans;
font-weight: 600;
font-style: italic;
margin-bottom: 20px;
}
/* Contact Us Page */

body.page-template-page-contact-php .entry-content p {
	width: 50%;
	float: left;
}
p.contactinfo {
	font-family: open sans, georgia, serif;
	font-size: 22px;
	font-weight: 300;
}
.big {
	font-family: open sans, georgia, serif;
	font-size: 24px;
	font-weight: 600;
	width: 80px;
	display: inline-block;
}
#contactForm {
	float: right;
	width: 405px;
}
ul.contactform {
	list-style:none;
	padding: 0 0 0 45px;
	margin: 0 0 30px 30px;
	width: 330px;
	background: url("styles/img/vertical-divider.png") no-repeat top left;
}
.contactform li {
	margin:0 0 6px 0;
}
.contactform label {
    margin: 0;
    display: block;    
}
.contactform .red {
	color: red;
}
.contactform textarea {
	width: 300px;
	height: 150px;
	padding: 10px;
	margin: 3px;
}
.contactform textarea, .contactform input {
	border: 3px #8f8f8f solid;
    border-radius: 10px;
    font-family: Courier, Courier new, monospace;
}
.contactform textarea:focus, .contactform input:focus {
	outline: none;
}
.contactform textarea:focus,.contactform input:focus {
	border-color: #88be13;
}
#contactName, #email {
	padding-left: 35px;
}
#contactName {
    background: url('styles/img/user.png') no-repeat 5px 6px;
}
#email {
	background: url('styles/img/email.png') no-repeat 6px 6px;
	background-size: 20px;
}
.contactform input {
	padding: 4px 8px;
	margin: 3px;
	height: 25px;
	width: 277px;
}
.contactform input.submit { /* The rest of the .submit styling is with '.contact-me a' */
	height: 60px;
	width: auto;
	display: block;
	margin: 15px auto 5px;
	font-size: 31px;
}
p.error {
	background: #f1ede2 url('images/error-icon.png') no-repeat 4px 4px;
	padding: 5px 0 0 45px;
	height:34px;
	color: #da1717;
	font-weight: bold;
}
span.error {
	color: #da1717;
}
div.contactform {
float: right;
padding: 0 0 0 45px;
margin: 0 0 30px 30px;
width: 330px;
background: url("styles/img/vertical-divider.png") no-repeat left top;
}
body.page-template-page-contact-php .entry-content .wpcf7 p {
width: 100%;
float: left;
}
.contact-name input {
background: url('styles/img/user.png') no-repeat 5px 6px;
padding-left: 35px;
}
.contact-email input {
background: url('styles/img/email.png') no-repeat 6px 6px;
background-size: 20px;
padding-left: 35px;
}
.contact-phone input {
background: url('styles/img/telephone.png') no-repeat 6px 6px;
padding-left: 35px;
}
.contactform input.wpcf7-submit {
height: 60px;
width: auto;
display: block;
margin: 15px auto 5px;
font-size: 31px;
background: white url('styles/img/yellow-button-bg.png') no-repeat top center;
border: 6px #fff solid;
border-radius: 10px;
padding: 3px 15px 0;
font-size: 35px;
font-family: bebasneue, georgia, serif;
text-decoration: none;
box-shadow: 0 0 3px #888;
color: #181818;
}
.contactform input.wpcf7-submit:hover {
color: #000;
box-shadow: 0 0 8px #888;
}
div.wpcf7-mail-sent-ok {
border: 3px solid #76C52E;
border-radius: 10px;
padding: 10px 15px;
}

/* About Us page */

.float-left, .float-right {
	width: 47.5%;
	display: block;
}
.float-left {
	float: left;
	margin: 0 2.5% 0 0;
}
.float-right {
	float: right;
	margin: 0 0 0 2.5%;
}
.visual-form-builder li.vfb-left-half {
width: 47%!important;
float: left;
}
.visual-form-builder li.vfb-right-half {
width: 47%!important;
float: right;
}

/* Two Quotes page */
.two-quotes-page body{font-family: roboto; font-weight: 300;}
.page-id-516 .entry-title{text-align: center;}
.yellow-button{
background: white url('styles/img/yellow-button-bg.png') repeat top center;
border: 6px #fff solid;
border-radius: 10px;
padding: 3px 15px 0;
font-size: 27px;
font-family: bebasneue, georgia, serif;
text-decoration: none;
box-shadow: 0 0 3px #888;
color: #181818;
}
.yellow-button:hover,.yellow-button:visited,.yellow-button:active{color: #000;
box-shadow: 0 0 8px #888;}
.form-container{overflow: hidden; background:#363636; padding: 50px 0; height: 630px; float: left; width: 100%;}
.form-container h2{text-align: center; font-family: montserrat; font-size: 30px; font-weight: bold; margin-bottom: 20px; color: white;}
span.open{font-weight: bold; background: url('styles/img/button-active-bg.png') no-repeat; cursor:default;}
.button-bar{width: 350px; height: 75px; display: block; margin: 0 auto 30px; background: url('styles/img/button-bg.png') no-repeat left top;}
.button-bar span{float:left; width:175px; height: 75px; display:block; box-sizing:border-box; padding:10px; text-align:center; color:white; transition: 500ms;}
.button-bar span:hover{background-image:url('styles/img/button-lighter-grey-bg.png'); background-repeat:no-repeat;}
.button-bar span.open:hover{background-image:url('styles/img/button-active-bg.png'); background-repeat:no-repeat;}
.button,.button2{cursor: pointer;}
.button.open,.button:hover{background-position:left top;}
.button2.open,.button2:hover{background-position:right top;}
.new-website-quote,.existing-website-quote{display:block; padding:50px; clear:both; font-weight:normal;}
.new-website-quote{ display:none;}
.two-quotes-page input.wpcf7-text,.two-quotes-page textarea.wpcf7-textarea{outline:0; padding: 15px; border: 3px #e9e9e9 solid; width: 100%; box-sizing: border-box; border-radius: 5px;}
.two-quotes-page input.wpcf7-text:hover,.two-quotes-page textarea.wpcf7-textarea:hover{border-color: rgb(213, 213, 213);}
.two-quotes-page input.wpcf7-text:focus,.two-quotes-page textarea.wpcf7-textarea:focus{border-color: rgb(167, 213, 51); color: #000;}
.two-quotes-page .wpcf7-submit{
outline:0; 
width: 100%; 
box-sizing: border-box; 
padding: 15px; 
background: #fba91a; 
font-weight: bold; 
border: 0;
border-radius: 5px;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
color: #fff;
-webkit-appearance: button;
font-size: 18px;
font-size: 2rem;
line-height: 1;
text-shadow: none;}
.two-quotes-page .wpcf7-submit:hover{
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
background: #ffa200;}
.responsive-reasons{padding: 45px 4% 60px; overflow: hidden; background: #fff; margin-top: 40px; float: left;}
.responsive-reasons h2{font-family: montserrat; font-size: 30px; line-height: 30px; text-align: center; font-weight: bold; color: #363636; margin-bottom: 60px;}
.responsive-reasons h3{font-family: montserrat; font-weight: bold; font-size: 23px; color: #363636;}
.col-1-of-3,.col-2-of-3,.col-3-of-3{width: 30%; float: left; box-sizing: border-box; padding-left: 80px;}
.col-1-of-3{background: url('styles/img/blue-tie-pro-icon.png') no-repeat left top; background-size: 60px;}
.col-2-of-3{margin: 0 5%; background: url('styles/img/pink-eye-icon.png') no-repeat left top;}
.col-3-of-3{background: url('styles/img/yellow-buy-icon.png') no-repeat left top;}
h2.montserrat{font-family: montserrat; font-weight: bold; font-size: 30px; color: #363636;}
h3.montserrat{font-family: montserrat; font-weight: bold; font-size: 23px; color: #363636;}
.form-container .wpcf7-form.sent .float-left,.form-container .wpcf7-form.sent .float-right{display: none;}
.form-container .wpcf7-form.sent .wpcf7-mail-sent-ok{border: 3px solid #74B835; background:#80BD38; border-radius: 5px; padding: 10px; width: 80%; margin: 0 auto; float: none; color: white;}
.form-container .wpcf7-form .wpcf7-validation-errors{display: none!important; border: 3px solid #e59b19; background:#fba91a; border-radius: 5px; padding: 10px; width: 100%; margin: 0 auto; float:left; color: white;}
.form-container .wpcf7-form span.wpcf7-not-valid-tip {background: rgb(236, 45, 45);border-radius: 5px;color: white;padding: 5px 10px;}
.form-container .wpcf7-form .ajax-loader{margin: 10px auto; display: block;}
.featured-image-container {
margin: 0 2px 30px;
overflow:hidden;
border: 8px white solid;
box-shadow: #C4C4C4 0 0 5px;
border-radius: 5px;}
.featured-image-container img {max-width: 100%; height: auto;}
.sam-latest-post div {
width: 75px;
height: 75px;
background: white;
float: left;
margin: 0 25px 15px 0;
padding: 5px;
border: 8px solid white;
margin: 2px;
box-shadow: 0 0 5px #D3D3D3;
border-radius: 5px;}
.feature-bar {
margin: 80px 0;
overflow: hidden;
}
.feature {
float: left;
overflow:hidden;
display: block;
width: 340px;
max-width: 31.32%
}
.feature br {
display: none;
}
.feature-2 {
margin: 0 3%;
}
.feature-image-container {
display: block;
position: relative;
}
.feature-image-container:hover img {
opacity: 0.75;
transition: 300ms;
}
.feature-content {
float: left;
margin: 12px 9px 0;
}
.feature-ribbon {
position: absolute;
top: 23px;
left: -55px;
background:#eca00e;
height: 28px;
line-height: 28px;
width: 200px;
padding: 5px 0;
color: white;
text-align: center;
font-weight: bold;
transform: rotate(-45deg);
}
.feature-image {
border: 8px white solid;
border-radius: 5px;
box-shadow: 0 0 5px #ccc;
margin: 2px;
transition: 300ms;
max-width: 98%!important;
box-sizing: border-box;
}
.home-welcome {
margin: 0 auto;
max-width: 550px;
text-align: center;
}
.info-popup {
bottom: -50px;
width: 100%;
overflow: hidden;
text-align: center;
display: block;
position: relative;
float: left;
height: 400px;
}
.entry-content .info-popup-image img {
max-width: 100%;
background: none;
}
.info-popup-image {
width: 100%;
text-align: center;
display: block;
}
.speech-bubble {
float: left;
width: 489px;
height: 139px;
background: url('styles/img/yellow-speech-bubble.png') no-repeat;
position: absolute;
top: 80px;
right: 0;
padding: 40px 40px 20px 100px;
box-sizing: border-box;
font-weight: bold;
color: white;
font-style: italic;
font-size: 18px;
text-align: left;
}


/* ------- Site Header ---------------------------------------------------------- */

.site-header hgroup { /* Container for site title and description */
   display: block;
   width: 300px;
   margin: 0 auto;
}
.site-title,
.site-title a {
   display: block;
   height: 154px;
   width: 220px;
   margin: 20px auto;
   background: url('styles/img/logo.jpg') no-repeat top left;
   text-indent: -9000px;
}
.site-description {
   display: none;
}

/* ------- Menu ---------------------------------------------------------- */
 
.main-navigation {
    display: block;
    float: right;
    margin: -100px 0 0 0;
    width: 36%;
}
.main-navigation ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}
.main-navigation li {
    float: left;
    position: relative;
    margin: 0 6px;
}
.main-navigation a {
    display: block;
    font-family: BebasNeue;
    font-size: 21px;
    text-decoration: none;
    padding: 6px 20px;
    line-height: 25px;
    background: #6c6049;
    color: white;
    border-radius: 6px;
}
.main-navigation a:hover {
    background: #c88300;    
}
.main-navigation ul ul {
    display: none;
    float: left;
    position: absolute;
    top: 35px;
    left: 0;
    z-index: 99999;
    background: #E0E0E0;
    padding: 3px 3px 0 3px;
    border-radius: 6px;
}
.main-navigation ul ul ul {
    left: 100%;
    top: 0;
}
.main-navigation ul ul a {
    width: 120px;
    background: #6c6049;
    border-radius: 6px;
    margin-bottom: 3px;
}
.main-navigation ul ul li {
    margin: 0;
}
.main-navigation ul li:hover > ul {
    display: block;
}
 
/*  Assistive Text  */
.assistive-text {
	display: none;
} 

/* ------- Content ---------------------------------------------------------- */ 

.hentry {
    margin: 0 0 1.5em;
}
.entry-meta {
    clear: both;
}
.entry-title {
	font-family: BebasNeue;
	font-size: 42px;
	color: #32302d;
}
body.home .entry-title {
	display: none;
}
body.home .entry-content {
	margin-top: 0;
}
.entry-title
.byline {
    display: none;
}
.single .byline,
.group-blog .byline {
    display: inline;
}
.entry-content,
.entry-summary {
    margin: 1.5em 0 0;
}
.page-links {
    clear: both;
    margin: 0 0 1.5em;
}
.entry-content table,
.comment-content table {
	border: 1px solid #000;
	border-left-width: 0;
	margin: 1em -0.083em 2.083em 0;
	text-align: left;
	width: 100%;
}
.entry-content tr th,
.entry-content thead th,
.comment-content tr th,
.comment-content thead th {
	border-left: 1px solid #000;
	font-weight: bold;
	padding: 0.5em 	1.25em;
}
.entry-content tr td,
.comment-content tr td {
	border: 1px solid #000;
  	border-width: 1px 0 0 1px;
	padding: 0.5em 	1.25em;
} 
 
/* ------- Media ---------------------------------------------------------- */
 
img.wp-post-image {
    width: 1080px;
}
.attachment img {
	max-width: 98%;
}
.site-header img,
.entry-content img,
.comment-content img,
.widget img {
    margin-bottom: 10px;
    background: #fff;
	max-width: 100%;
}
.site-header img,
.entry-content img,
img[class*="align"],
img[class*="wp-image-"] {
    height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
}
.entry-content img.wp-smiley,
.comment-content img.wp-smiley {
    border: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
}
.wp-caption {
    border: 1px solid #ccc;
    max-width: 100%;
}
.wp-caption.aligncenter,
.wp-caption.alignleft,
.wp-caption.alignright {
    margin-bottom: 1.5em;
}
.wp-caption img {
    display: block;
    margin: 1.2% auto 0;
    max-width: 98%;
}
.wp-caption-text {
    text-align: left;
}
.wp-caption .wp-caption-text {
    margin: 0.8075em 0;
}
.site-content .gallery {
    margin-bottom: 1.5em;
}
article.post img.size-medium, article.post img.size-full {
max-width: 116.8%;
width: 116.8%;
margin-left: -16.8%;
}
blockquote {
width: 100%;
margin-left: -16.8%;
margin-bottom: 10px;
color: rgb(221, 53, 73);
box-sizing: border-box;
padding: 0 1%;
font-style: italic;
font-size: 18px;
font-family: open sans;
overflow: hidden;
}
section.category-result {
overflow: hidden;
margin-bottom: 50px;
}
section.category-result img {
margin-bottom: 15px;
width: 80%;
height: auto;
transition: 300ms;
}
section.category-result a img:hover {
opacity: 0.75;
transition: 300ms;
}
div.category-result-content {
width: 60%;
float: left;
}

/* Gallery */

.gallery {
	width: 100%!important;
	padding-bottom: 20px;
}
.gallery-item {
    margin-bottom: 15px;
}
.gallery a {
	display: block;
	width: 100%;
	float: left;
}
.gallery-caption {
    width: 95%;
    margin: 0 auto 30px!important;
}
.gallery-caption h2 {
	margin: 15px 0 5px;
    line-height: 25px;
    font-size: 29px;
}
.gallery-caption h3 {
    margin: 0 0 4px;
    font-family: georgia, serif;
    font-style: italic;
}
.site-content .gallery a img {
    border: none;
    height: auto;
    max-width: 92%;
    padding: 0;
    margin: 3px 50px 3px 3px;
    border: 7px #fff solid!important;
    box-shadow: 0 0 4px #bdbdbd;
}
.gallery dt {
	overflow: hidden;
}
.site-content .gallery dd {
    margin: 0;
}
embed,
iframe,
object {
    max-width: 100%;
}
  
/* ------- Widgets ---------------------------------------------------------- */

.widget-container {
	list-style: none;	
}
.widget-area { /* All of the sidebar container divs get this common class */
	float: left;
	width: 32%;
}
.widget { /* The individual widget */
	margin: 0 0 1.5em;
}
.widget-title {
    font-size: 34px;
    color: #e1aa01;
}
.widget ul { /* Unordered lists inside widgets */
	list-style: none;
	margin: 0;
}
.widget ul li { /* Unordered list items inside widgets */
	margin-bottom: 0.25em;
}

/* Text Widgets */
.widget p,
.textwidget {
    font-family: Open Sans, Helvetica, Arial, sans serif;
}
.footer-widget-container {
	background: gray url('styles/img/dotty-box-pattern-dark-gray.png') repeat top center;
	border-top: 1px #101010 solid;
}
.footer-widgets {
	width: 960px;
	margin: 0 auto;
    padding: 20px 0 50px 0;
    overflow: hidden;
}
.footer-widgets a {
    color: white;
    text-decoration: none;
}
.footer-widgets a:hover {
    color: yellow;
    text-decoration: none;
}
.footer-widgets ul {
	margin: 0 0 1.5em 20px;
	float: left;
	width: 100%;
}
.footer-widgets ul li {
	list-style-image: url("styles/img/white-arrow.png");
}
.sam-latest-post li {
	float: left;
	border-bottom: 0;
	margin-bottom: 20px;
	width: 50%;
	padding-right: 5%;
	box-sizing: border-box;
}
.sam-latest-post img {
	width: 75px;
	height: 75px;
	padding: 0;
	border: none;
}
.sam-latest-post div {
	width: 75px;
	height: 75px;
	background: white;
	float: left;
	margin: 0 25px 15px 0;
	padding: 0;
}
.sam-latest-post a {
	text-decoration: none;
	color: rgb(99, 99, 99);
	font-weight: bold;
}
#secondary .widget-title {
color: #32302d;
}
/* ------- Site Footer ---------------------------------------------------------- */

.site-footer {
    background: url('styles/img/dotty-box-pattern-gray.png') repeat top center;
}
.site-info {
    width: 960px;
    margin: 0 auto;
    padding: 20px 0;
    color: #fff;
    font-size: 15px;
	position: relative;
}

@media screen and (min-width: 0px) {
/* These are hidden from browsers without css3 support */
#main {
    width: 1100px;
}
body.home .site-header {
   height: 150px;
}
.site-header {
   width: 1100px;
}
.footer-widgets {
	width: 1100px;
}
.site-info {
    width: 1100px;
}
}

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

.site-header {
   margin: 0;
   width: 100%;
}
#main {
   width: 90%;
   padding: 30px 5% 0;
}
.site-info, .footer-widget-container {
	width: 90%;
	padding: 20px 5%; 
}
.footer-widgets {
	width: auto;
}
.feature-image {
box-sizing: border-box;
}
.info-popup-image {
text-align: left;
}
}

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

.main-navigation {
	width: 20%;
	margin: -150px 5% 0 0;
}
.main-navigation li {
	float: none;
    margin: 0 0 3px;
}
.main-navigation ul ul {
	top: 0;
    right: 100%;
    left: auto;
}
.widget-area {
	width: 45%;
	padding: 0 2.5%;
}
ul.contactform {
	padding: 0;
	margin: 0 0 0 5%;
	background: none;
}
#contactForm {
    width: 50%;
}
ul.contactform {
    margin: 0;
    width: 100%;
}
.contactform textarea {
    width: 88%;
    padding: 10px 5%;
    margin: 0;
}
#contactName, #email {
    padding-left: 28px;
    width: 75%;
    max-width: 300px;
}
p.contactinfo {
    word-wrap: break-word; 	
}
.sam-latest-post li {
	width: 100%;
}
.entry-content .feature-image {
box-sizing: border-box;
max-width: 98%;
}
}

@media screen and (max-width: 750px) {
.feature {
float: none;
width: 340px;
max-width: 100%;
margin: 0 auto;
}
.speech-bubble {
float: left;
width: 60%;
background: none;
padding: 40px 0 40px 40px;
color: rgb(56, 56, 56);
}
}

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

.main-navigation {
	width: 90%;
	padding: 0 5%;
	float: none;
	background: #4f4738;
	margin: 0;
	height: 35px;
}
.main-navigation li {
	float: left;
    margin: 0 3px 0 0;
}
.main-navigation li a {
	border-radius: 0;
}
.main-navigation ul ul {
	top: 100%;
    right: auto;
    left: 0;
}
.webpackage, .webpackagemid {
	width: 45%;
	padding: 0 2.5%;
}
.gallery br {
	display: none;
}
#gallery-1 .gallery-item {
    float: left!important;
    width: 46%!important;
    margin: 0 2% 15px
}
.gallery dt {
    display: block;
    width: 100%;
}
.gallery dd {
	max-width: 100%;
    padding: 0;
    min-height: 280px
}
#gallery-1 img {
	max-width: 300px;
	width: 90%;
}
#contactForm {
    width: 100%;
    clear: both;
}
body.page-template-page-contact-php .entry-content p {
    width: 100%;
}
.float-left, .float-right {
	width: 100%;
}
.col-1-of-3,.col-2-of-3,.col-3-of-3{width: 100%; float: left; box-sizing: border-box; padding-left: 80px; margin-bottom: 15px;}
.col-2-of-3 {margin: auto 0;}
.form-container {height: 865px;}
}

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

#masthead {
	height: auto;
}
.widget-area {
	width: 100%;
	padding: 0;
	margin-bottom: 30px;
}
.webpackage, .webpackagemid {
	width: 90%;
	padding: 0 5%;
}
.main-navigation {
	overflow: hidden;
	height: auto;
}
.main-navigation li, .main-navigation ul ul li {
	width: 100%;
	float: none;
	clear: both;
}
.main-navigation ul li a {
	top: 0;
	border-radius: 0;
	margin-bottom: 2px;
}
.main-navigation ul ul {
	position: relative;
	width: 100%;
	padding: 0;
	border-radius: 0;
	top: 0;
	display: block;
	background: #4f4738;
}
.main-navigation ul ul li a {
	background: #776e4d;
	width: auto;
}
#gallery-1 .gallery-item {
    float: none!important;
    width: auto!important;
}
.gallery dt {
	margin: 0 auto;
    width: auto;
}
.gallery dd {
	max-width: 310px;
    padding: 0;
    margin: 0 auto 30px!important;
    min-height: auto;
}
#gallery-1 img {
	max-width: 300px;
}
.site-header hgroup {
	width: auto;
}
.talk-about-website, .free-quote {
	background: none;
	width: 100%;
	padding: 0;
}
.form-container {height: auto;}
.button-bar{width: 90%; background-size:100%; height: 80px; margin-bottom: 10px;}
.button-bar span{width: 50%; font-size: 15px; line-height: 15px; background-size:200%; height: 80px; padding: 5px;}
.new-website-quote, .existing-website-quote {padding: 20px;}
}

@media screen and (max-width: 360px) {
.button-bar{width: 98%; height: 65px;}
.button-bar span{width: 50%; font-size: 15px; line-height: 15px; background-size:200%; height: 65px; padding: 5px;}
.new-website-quote, .existing-website-quote {padding: 15px;}
}

@media print {
#page {
	border: 0;
}
#main {
	padding: 0;
	margin: 0;
}
.site-header, footer, .get-in-touch, .responsive-slider.flexslider, #contactForm {
	display: none;
}
.entry-content {
    width: 17.5cm;
}
.float-left, .float-right {
	width: 100%;
}
}