/*
Theme Name: Costello
Author: Noel O'Connor
Template: twentytwelve
*/

@import url(../twentytwelve/style.css);

/* Why Choose Us  */

.wcu-col3{
	float: left;
	width: 31%;
	margin: 0 2% 2% 0;
	border: 1px solid #e3e3e3;
	text-align: center;
}

.last{
	margin-right: 0 0 2% 0;
}

.colour{
font-size: 20px;
font-weight: bold;
text-align: center;
}

/* GENERAL SETTINGS */

body.full-width .site-content{
width: 98.1%;	
}

#main{
background: #3895D0;
}

body {
background-color: #eee;
}

body .site {
padding: 0;
margin-top: 20px;
margin-top: 1.428571429rem;
margin-bottom: 0;
box-shadow: none;
}

.site {
background: none;
max-width: 1280px!important;
max-width: 91.42857143rem!important;
}

.site-content {
width: 75%;
padding: 1%;
background: #fff;
margin: 0;
}

.site-content article {
border-bottom: 0;
margin-bottom: 0;
padding-bottom: 0;
word-wrap: normal;
-webkit-hyphens: none;
-moz-hyphens: none;
hyphens: none;
}

.widget-area {
width: 23%;
padding: 0;
margin: 0;
}

/*  IMAGES */

.logoimg, .fullimg {
	max-width: 100%;
	height: auto;
}

@media \0screen {
.logoimg, .fullimg {
  	width: auto; /* for ie 8 */
  }
}

img.wp-post-image {
    border-radius: 0;
    box-shadow: none;
	width: 100%;
}

.entry-content img {
border-radius: 0;
box-shadow: none;
}

.entry-content a, .entry-content a:visited{
	color: #3895D0;
	text-decoration: none;
}

.entry-content a:hover, .entry-content a:active, .entry-content a:focus{
	color: #3895D0;
	text-decoration: none;
	padding-bottom: 2px;
	border-bottom: 1px dotted #e3e3e3;
}

.foogallery-default.hover-effect-zoom a{
	padding-bottom: 0!important;
	border-bottom: 5px solid #fff!important;
}

/*  DISPLAY NONE */

.site-description, footer.entry-meta, .flex-control-nav{ display:none;}

/* HEADER  */

#hgroup-wrap{
overflow: hidden;
max-width: 1260px;
padding: 0 10px 10px 10px;
margin: 0 auto;
background: #fff;
}

hgroup{
overflow: hidden;
padding: 10px 0;
margin: 0 auto;
background: #fff;
}

#hgroup-left{
float: left;
width: 40%;
}

#hgroup-center{
float: left;
width: 30%;
color: #3895D0;
font-size: 20px;
}

#hgroup-right{
float: right;
width: 30%;
text-align: right;
padding-top: 48px;
}

.sales{
color: #13518A;
font-size: 30px;
line-height: 1.5;
margin-top: 26px;
}

.time{
font-size: 14px;
line-height: 1;
}

.mybutton {
	display: inline-block;
    font-size: 16px;
    font-weight: 500;
    color: #fff!important;
    background: #13518A;
	letter-spacing: 1;
    line-height: 1;
    padding: 0.84375em 0.875em 0.78125em;
	width: auto;
	border: 1px solid #3895D0;
    -webkit-transition: background-color .3s ease-in-out, color .3s ease-in-out;
    -moz-transition: background-color .3s ease-in-out, color .3s ease-in-out;
    -ms-transition: background-color .3s ease-in-out, color .3s ease-in-out;
    -o-transition: background-color .3s ease-in-out, color .3s ease-in-out;
    transition: background-color .3s ease-in-out, color .3s ease-in-out;
	margin-top: 5px;
	text-decoration: none;
}

.mybutton:hover {
    background: #3895D0;
}

/* SPLASH  */

#splash{
display: block;
max-width: 1260px;
padding: 0 10px 10px 10px;
margin: 0 auto 20px auto;
background: #fff;
}

/* TAG  */

.tag{
display: inline-block;
background: #3895D0;
padding: 10px;
margin: 0 auto 20px auto;
color: #fff;
font-size: 30px;
text-align: center;
line-height: 1;
}

#cta-wrap{
overflow: hidden;
max-width: 1260px;
padding: 0 10px;
margin: 0 auto;
background: #fff;
border-top: 1px solid #e3e3e3;
border-bottom: 1px solid #e3e3e3;
}

#cta-wrap p{
text-align: center;
color: #13518A;
font-size: 22px;
font-size: 1.571428571rem;
line-height: 1.2;
font-weight: normal;
padding: 20px 0;
}

hr {
    background-color: #e3e3e3;
    margin: 0 auto 2% auto;
	width: 50%;
}

.cta-left{
float: left;
width: 32.33%;
padding: 0 0.5% 0.78125% 0.5%;
background: #fff;
}
.cta-center{
float: left;
width: 32.33%;
padding: 0 0.5% 0.78125% 0.5%;
background: #fff;
}

.cta-right{
float: left;
width: 32.33%;
padding: 0 0.5% 0.78125% 0.5%;
background: #fff;
}

#cta-wrap img:hover{
opacity: 0.9;
}

/* Font Awesome  */

.fa{
margin-right:14px;
font-size: 15px;
vertical-align: top;
}

.right{
margin-right:0!important;
margin-left:14px;
}

/* MENU  */

.main-navigation {
margin-top: 0;
}

.main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul {
border-bottom: 0;
border-top: 0;
}

.main-navigation li {
width: 16.66%;
margin: 0 -5px 0 0;
font-size: 19px;
font-size: 1.357142857rem;
font-weight: 400;
border-top: 2px solid #13518A;
text-align: center;
border-left: 1px solid #fff;
}

.main-navigation li a, .main-navigation li a:visited {
display: block;
color: #fff;
padding: 0;
line-height: 2.6;
text-transform: capitalize;
background: #3895D0;
-webkit-transition: background-color .3s ease-in-out, color .3s ease-in-out;
	-moz-transition: background-color .3s ease-in-out, color .3s ease-in-out;
	-ms-transition: background-color .3s ease-in-out, color .3s ease-in-out;
	-o-transition: background-color .3s ease-in-out, color .3s ease-in-out;
	transition: background-color .3s ease-in-out, color .3s ease-in-out;
}

.main-navigation li a:hover, .main-navigation li a:active, .main-navigation li a:focus {
color: #fff;
text-decoration: none;
background: #13518A;
}

.main-navigation .current-menu-item > a, .main-navigation .current_page_item > a {
color: #fff!important;
font-weight: 400;
}

.main-navigation .current-menu-item > a:hover, .main-navigation .current_page_item > a:hover {
color: #FFCC00;
}

/* MAIN CONTENT  */

.entry-header .entry-title{
	color: #13518A;
}

/* Widget Area  */

.widget-area .widget h3 {
margin-bottom: 0;
}

.widget-title {
font-size: 16px;
font-size: 1.142857143rem;
line-height: 2;
color: #13518A;
text-align: center;
padding: 4% 1%;
border-bottom: 1px dotted #fff;
}

.widget-area .widget li, .widget-area .widget .textwidget {
display: block;
font-size: 14px;
font-size: 1rem;
line-height: 2;
text-align: center;
font-weight: bold;
letter-spacing: 1px;
}

.widget-area .widget a, .widget-area .widget a:visited {
display: block;
color: #fff;
padding: 4% 1%;
text-decoration: none;
border-bottom: 1px dotted #fff;
}

.widget-area .widget a:hover, .widget-area .widget a:active, .widget-area .widget a:focus{
background: #13518A;
color: #fff!important;
}

/* Homepage 5 Col  */

.col-wrap{
overflow: hidden;
}

.col5{
float: left;
width: 21%;
padding: 1%;
border: 1px solid #e3e3e3;
margin: 0 0.5% 2% 0.5%;
background: #fff;
text-align: center;
}

.col5 a, .col5 a:visited{
text-decoration: none;
display: block;
background: #3895D0;
color: #fff!important;
padding-bottom: 6px;
}

.col5 a:hover, .col5 a:active, .col5 a:focus{
text-decoration: none;
background: #13518A;
color: #fff!important;
border-bottom: 0;
padding-bottom: 6px!important;
}


.col5 img{
transition: all .2s ease-in-out;
border-bottom: 5px solid #fff;
}

.col5 img:hover{
transform: scale(1.1);
}

/* 3 Col  */

.col-wrap{
overflow: hidden;
}

.col3{
float: left;
width: 25%;
padding: 1%;
border: 1px solid #e3e3e3;
margin: 0 3% 2% 3%;
background: #fff;
text-align: center;
}

.col3 a, .col3 a:visited{
text-decoration: none;
display: block;
background: #3895D0;
color: #fff!important;
padding-bottom: 6px;
}

.col3 a:hover, .col3 a:active, .col3 a:focus{
text-decoration: none;
background: #13518A;
color: #fff!important;
border-bottom: 0;
padding-bottom: 6px!important;
}


.col3 img{
transition: all .2s ease-in-out;
border-bottom: 5px solid #fff;
}

.col3 img:hover{
transform: scale(1.1);
}

.col3door{
float: left;
width: 27%;
padding: 1%;
border: 1px solid #e3e3e3;
margin: 0 1.5% 2% 1.5%;
background: #fff;
text-align: center;
}

.col3door a, .col3door a:visited{
text-decoration: none;
display: block;
background: #3895D0;
color: #fff!important;
padding-bottom: 6px;
}

.col3door a:hover, .col3door a:active, .col3door a:focus{
text-decoration: none;
background: #13518A;
color: #fff!important;
border-bottom: 0;
padding-bottom: 6px!important;
}


.col3door img{
transition: all .2s ease-in-out;
border-bottom: 5px solid #fff;
}

.col3door img:hover{
transform: scale(1.1);
}

/* Product Page  */

.p-wrap{
overflow: hidden;
margin-bottom: 20px;
}

.p-left{
float: left;
width: 50%;
}

.p-right{
float: right;
width: 50%;
}

/* Foo Gallery  */

.foogallery-container {
width: 96%!important;
overflow: hidden;
border-top: 1px solid #f1f1f1;
border-bottom: 1px solid #f1f1f1;
padding: 2%;
margin: 0 auto 20px auto!important;
background: #f9f9f9;
}

/* Contact*/

.contact-left{
float: left;
width: 45%;
}

.contact-right{
float: right;
width: 46%;
padding: 10px 2%;
border: 1px solid #f5f5f5;
background: #fafafa;
}

textarea, input {
width: 95%;
}

textarea {
height: 6em;
}

input[type="submit"]{
width: auto;
font-size: 16px;
font-weight: bold;
background-image: none;
background: #3895D0;
color: #fff !important;
-webkit-transition: background-color .3s ease-in-out, color .3s ease-in-out;
-moz-transition: background-color .3s ease-in-out, color .3s ease-in-out;
-ms-transition: background-color .3s ease-in-out, color .3s ease-in-out;
-o-transition: background-color .3s ease-in-out, color .3s ease-in-out;
transition: background-color .3s ease-in-out, color .3s ease-in-out;
border: 0;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], textarea {
    background-color: #fff;
}

input[type="submit"]:hover, input[type="submit"]:active{
background-image: none;
background: #13518A;
color: #fff;
}

.wpcf7-form-control-wrap{
	margin-bottom: 5px;
}

input[type="checkbox"]{
	width: auto;
}

/* FOOTER  */

footer[role="contentinfo"] {
border-top: 0;
font-size: 14px;
font-size: 1rem;
overflow: hidden;
max-width: 1260px;
padding: 10px;
padding: 0.714285714;
margin: 0 auto;
background: #fff;
margin-top: 20px;
margin-top: 1.428571429rem;
}

.site-info{
overflow: hidden;
background: #13518A;
padding: 2%;
}

/* Footer 3 Col  */

.footcol-left{
float: left;
width: 27%;
padding: 0 1%;
color: #fff;
}

.footcol-center{
float: left;
width: 19.995%;
padding: 0 1%;
color: #fff;
}

.footcol-right{
float: left;
width: 46.995%;
padding: 0 1%;
color: #fff;
}

.footcol h4{
display: inline-block;
font-size: 18px;
text-transform: uppercase;
border-bottom: 1px dotted #ffffcc;
margin-bottom: 14px;
padding: 0 10px;
}

.footcol p{
margin-left: 10px;
}

footer[role="contentinfo"] a, footer[role="contentinfo"] a:visited{
color: #fff;
text-decoration: none;
padding-bottom: 2px;
border-bottom: 1px dotted #b4b4b4;
}

footer[role="contentinfo"] a:hover, footer[role="contentinfo"] a:active, footer[role="contentinfo"] a:focus{
color: #ffcc00;
text-decoration: none;
padding-bottom: 2px;
border-bottom: 1px dotted #ffcc00;
}

#credit {
    border-top: 0;
    font-size: 14px;
    font-size: 1rem;
    overflow: hidden;
    max-width: 1260px;
    padding: 10px;
    padding: 0.714285714;
    margin: 14px auto 14px auto;
    margin: 1rem auto 1rem auto;
	color: #b1b1b1;
}

.crleft{
	float: left;
	width: 60%;
}

.crleft img{
	margin-right: 5px;
}

.crleft img:hover{
	opacity: 0.9;
}

.crright{
	float: left;
	width: 40%;
	text-align: right;
}

#credit a, #credit a:visited{
color: #b1b1b1;
font-weight: 500;
text-decoration: none;
}

#credit a:hover{
color: #13518A;
text-decoration: none;
}

/*  ************************************************** */
/*  1149PIXELS */
/*  ************************************************** */

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

#hgroup-left{
width: 30%;
}

#hgroup-center{
text-align: center;
}

.sales {
    margin-top: 11px;
}

#hgroup-right{
width: 40%;
padding-top: 37px;
}

}

/*  ************************************************** */
/*  1100 PIXELS */
/*  ************************************************** */

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

#splash {
    padding: 0 10px 10px 10px;
    margin: 0 auto;
}

.col3 {
    width: 29%;
    margin: 0 1% 2% 1%;
}
	
}

/*  ************************************************** */
/*  1023 PIXELS */
/*  ************************************************** */

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

hgroup {
    max-width: 1230px;
    padding: 15px;
}

.main-navigation li{
	font-size: 17px;
}

.main-navigation li a, .main-navigation li a:visited {
    line-height: 2;
	text-transform: capitalize;
}

.site-content {
	float: none;
    width: 98%;
}

.site-content article {
	overflow: hidden;
}


.widget-area {
	float: none;
    width: 98%;
    padding: 0 1%;
}

.widget-title {
    padding: 2% 1%;
}

.widget-area .widget a, .widget-area .widget a:visited {
    padding: 1%;
}
.widget-area .widget {
    margin-bottom: 24px;
    margin-bottom: 1.714285714rem;
}
	
}

/*  ************************************************** */
/*  959 PIXELS */
/*  ************************************************** */

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

#hgroup-left {
    width: 40%;
}

#hgroup-center {
    width: 35%;
}

#hgroup-right {
    width: 25%;
    padding-top: 0;
}

.main-navigation li {
    font-size: 16px;
}

.footcol-left {
    width: 48%;
    padding: 0 1%;
}

.footcol-center {
    width: 48%;
    padding: 0 1%;
}

.footcol-right {
	overflow: hidden;
    float: none;
    width: 98%;
    padding: 4% 1% 0 1%;
}

}

/*  ************************************************** */
/*  767 PIXELS */
/*  ************************************************** */

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

#hgroup-left, #hgroup-center{
	float: left;
    width: 50%;
}

#hgroup-right {
	overflow: hidden;
	float: none;
	width: 100%;
	text-align: center;
}

.sales {
    margin-top: 20px;
}

body.full-width .site-content{
	overflow:hidden;
}

.site-title {
	text-align:center;
	margin-bottom: 14px;
}

.main-navigation ul.nav-menu {
    text-align: center;
}

#tag {
    font-size: 30px;
}

.flex-direction-nav .flex-prev, .flex-direction-nav .flex-next{
	display: none;
}

/*  ************************************************** */
/*  735 PIXELS */
/*  ************************************************** */

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

/*  Main Menu toggle */

.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
display: none !important;
text-align: center;
}

.main-navigation ul.nav-menu.toggled-on {
display: block !important;
}

.menu-toggle{
width: 100%;
float: none;
display: block;
padding: 10px 0;
font-size: 16px;
letter-spacing: 1px;
font-weight: bold;
color: #fff;
background: #3895D0;
background-image: none;
border: 0;
border-radius: 0;
box-shadow: none;
}

.menu-toggle:hover{
color: #fff;
background-color: #13518A;
background-image: none;
box-shadow: none;
border: 0;
}

.menu-toggle:active, .menu-toggle:focus, .menu-toggle.toggled-on {
color: #fff;
background-color: #13518A;
background-image: none;
box-shadow: none;
border: 0;
}

.main-navigation li, .main-navigation li a, .main-navigation li a:visited {
width: 100%;
display: block;
color: #fff;
text-transform: capitlaize;
text-decoration: none;
font-size: 1rem;
font-size: 14px;
margin: 0;
background: #3895D0;
line-height: 2.5;
padding: 0;
border-left: 0;
}

.main-navigation li a:hover {
background: #13518A;
color: #fff;
}

.main-navigation .current-menu-item > a, .main-navigation .current_page_item > a {
color: #fff!important;
}

.main-navigation .current-menu-item > a:hover, .main-navigation .current_page_item > a:hover {
color: #fff!important;
}


.col5, .col3, .col3door{
    width: 45.5%;
    margin: 0 1% 2% 1%;
}

.p-left, .p-right {
    float: none;
    width: 100%;
}

body.full-width .site-content{
	width: 96%;
}

.site-content {
    float: none;
    width: 96%;
	padding: 1% 2%;
}
	
}

/*  ************************************************** */
/*  666 PIXELS */
/*  ************************************************** */

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

.sales {
    margin-top: 10px;
}

.site-info{
	text-align: center;
}

.cta-left, .cta-center, .cta-right {
    float: none;
    width: 100%;
    padding: 0;
}

body .site {
    margin-top: 0;
}

.site-content{
    width: 92%;
    padding: 1% 4%;
	text-align: center;
}

.entry-content ul{
	text-align: left;
}

.entry-header .entry-title {
    font-size: 25px;
	margin-top: 14px;
}

footer[role="contentinfo"] {
    max-width: 1280px;
    padding: 10px 0;
    background: #13518A;
    margin-top: 0;
}
	
}

/*  ************************************************** */
/*  599 PIXELS */
/*  ************************************************** */

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

#hgroup-wrap {
    padding: 0 0 10px 0;
}

#hgroup-left, #hgroup-center, #hgroup-right {
	overflow: hidden;
	float: none;
	width: 100%;
	text-align: center;
}

.sales {
    margin-top: 0;
}

#hgroup-right {
margin-top: 10px;	
}

.mybutton {
	display: block;
    width: 75%;
	padding: 0.84375em 0;
	margin: 5px auto 0 auto;
}

.crleft, .crright{
	float: none;
	width: 100%;
	text-align: center;
}

.crleft{
	margin-bottom: 20px;
}

/*  ************************************************** */
/*  567 PIXELS */
/*  ************************************************** */

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

.col5, .col3, .col3door {
    width: 45%;
    margin: 0 1% 2% 1%;
}

.contact-left {
    float: none;
    width: 100%;
	padding-bottom: 20px;
}

.contact-right {
    float: none;
    width: 97%;
	margin: 0 auto;
}

.footcol-left, .footcol-center {
	float: none;
    width: 98%;
    padding: 0 1% 20px 1%;
}

.footcol-right {
    padding: 0 1%;
}
	
}

/*  ************************************************** */
/*  413 PIXELS */
/*  ************************************************** */

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

.col5, .col3, .col3door {
	float: none;
    width: 80%;
    margin: 0 auto 2% auto;
}
	
}