/* This File Contains All Responsive CSS - Sweet! */

/* Custom Drop-Down
================================================== */
#masternav .selector option{ background:#eee; -webkit-appearance:none; padding: 5px; }
#masternav .selector, 
#masternav .selector span{ cursor: pointer !important; -webkit-font-smoothing:antialiased; }
#masternav .selector, 
#masternav .selector *{ margin:0; padding:0; }
#masternav .selector select{ top:0px; left:0px; }
#masternav .selector{ width: 100%; font-size:12px;  font-weight:bold; }
#masternav .selector span:after { padding-left: 5px; padding-right: 5px; content: "\f078"; font-family: 'FontAwesome'; }
#masternav .selector span{ cursor:pointer; }
#masternav .selector{ height: 30px; line-height: 30px; display:-moz-inline-box;  display:inline-block;  vertical-align:middle;  zoom:1;  *display:inline; }
#masternav .selector select:focus{outline:0; }
#masternav .selector{ position:relative;  padding-left:10px;  overflow:hidden; }
#masternav .selector span{ display:block;  overflow:hidden;  text-overflow:ellipsis;  white-space:nowrap; }
#masternav .selector select{ position:absolute;  height:35px;  background:none;  width:97%; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;  font-size:12px;  font-weight:500;  border:0 !important; }


/* General
================================================== */
img{ max-width: 100%; }

/*hide redundant menu*/
#masternav select { display: none; width: 100% !important; }
#masternav .selector { display: none; margin-top: 5px; }


/* Apply To All Responsive Layouts
================================================== */

#wrap{ min-width: 240px; }
/* #Tablet (Portrait)
================================================== */

/* Note: Design for a width of 740px */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	
	#wrap{ width: 680px; }
	.portfolio-item, .home-entry, #footer-one,#footer-two,#footer-three,#footer-four{ width: 155px;  }
	#home-tagline{ font-size: 21px; }

	.loop-entry-thumbnail{width: 35%;}
		#masterhead {
    margin-top: 0px;
    position: relative;
}

#logo {
    margin-top: 100px !important;
}
.flexslider .slides img {max-width:366px!important;}
#logo h1 a { font-size: 24px;}
#home-highlights li:first-child {
    margin-left: 0px;
}
}

/*  #Mobile (Portrait)
================================================== */

/* Note: Design for a width of 290px */
@media only screen and (max-width: 767px) {
	
	/*hide*/
	.flexslider .caption{ display: none; }
	
	/*display dropdown nav*/

	 .portfolio-item, .home-entry, #footer-one,#footer-two,#footer-three,#footer-four{ width: 230px; margin-right: auto; margin-left: auto; }
	#portfolio-wrap{ margin-right:  0; }
	
	#home-tagline{ font-size: 16px; }
	
	.flex-direction-nav li a.next,
	.flex-direction-nav li a.prev {height: 40px;width: 25px; line-height: 40px;margin-top: -20px;}
	
	ul.filter{ position: inherit; margin-top: 10px; margin-bottom: 0px; top: 0; left: 0; }
	ul.filter li{ margin-top: 10px; }
	
	#single-nav a{ font-size: 10px; }
	#single-nav-left, #single-nav-right { margin-left: 5px; }
	
	.post, #sidebar{ width: 100%; }
	
	.loop-entry-meta{ display: none; }
	.loop-entry h2{ margin-bottom: 10px; }
	
	
	
	#single-portfolio-left, #single-portfolio-right{float: none;width: 100%; }
	
	#page-heading{ text-align: center; }
	#single-nav{ position: inherit; margin-top: 20px; margin-left: -10px; text-align: center; }
	#single-nav-left, #single-nav-right { display: inline-block; float: none; }
	
	.children li{ margin: 0 !important; }
	
	#copyright,#back-to-top{ float: none; width: 100%; text-align: center; }
	
	.one-half, .one-third, .two-third, .one-fourth, .three-fourth, .one-fifth, .one-sixth {width: 100%; float: none;} 
		#masterhead {
    margin-top: 0px;
    position: relative;
}

#logo {  margin-top: 100px !important;}
#logo h1 a { font-size: 24px;}
.flexslider .slides img {max-width:366px!important;}
#home-highlights li:first-child {
    margin-left: 0px;
}
}


/* #Mobile (Landscape)
================================================== */

/* Note: Design for a width of 420px */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	#wrap{ width: 420px; }
	 .portfolio-item, .home-entry, #footer-one, #footer-three{ width: 200px; margin-right: 20px; }
	#footer-two, #footer-four { width: 200px; margin-right: 0; }
	
	.responsive-clear{ clear: both; }
	
	.loop-entry-thumbnail{width: 33%;}
	
	ul.filter{ margin-bottom: 0; }
	#masterhead {
    margin-top: 0px;
    position: relative;
}

#logo {
    margin-top: 100px !important;
}

.flexslider .slides img {max-width:366px!important;}

#logo h1 a { font-size: 24px;}
#home-highlights li:first-child {
    margin-left: 0px;
}
}

/*******NEW********/

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

#wrap { margin: 0 auto; width: 960px;}
.hp-highlight{margin-right:12px;}
.hpmore{margin-right:0px!important}
.post{max-width:652px}
.shop-page{max-width:918px}
.page-template-template-fullwidth-php .post{max-width:900px}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { margin: 0 2.2% 2.992em 0!important;}
}
@media only screen and (min-width: 960px) and (max-width: 1023px) {	
#sidebar{padding-left:10px;}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { margin: 0 3% 2.992em 0!important;}
}
@media only screen and (min-width: 800px) and (max-width: 959px) {


.top-header {display: block; float: right; margin-bottom: -65px;  margin-top: 86px; }
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { margin: 0 3% 2.992em 0!important;}

}
@media only screen and (min-width: 640px) and (max-width: 799px) {
#wrap{min-width:620px}

.top-header {display: block; float: right; margin-bottom: -65px;  margin-top: 86px; }
#masternav {   font-size: 10px; height: 40px; left: 0;  position: absolute; top: 15px;}
.sf-menu a{padding-left:7px!important; padding-right:7px!important;font-size:14px!important}
.hp-highlight{margin:0 auto!important; float:none!important; margin-bottom:15px!important;}
.sf-menu{float:right!important}
.full-slides .caption{max-width:240px!important}
.post{width:59%}
#sidebar li a{font-size:12px!important; margin-left:18px;}
#sidebar{padding-left:10px; float:left; width:36%!important; margin-left:0}
#sidebar .right-caret { border-bottom: 5px solid transparent; border-left: 6px solid #0A538A; border-top: 5px solid transparent; display: inline-block; height: 0; margin-bottom: 19px;margin-left: 4px;}
#sidebar a:hover .right-caret{ border-left: 6px solid #082d49!important;border-bottom: 5px solid transparent; border-top: 5px solid transparent; display: inline-block; height: 0; margin-bottom: 19px;margin-left: 4px;}

.shop-page{width:auto!important; margin-left:0px!important}
.full-slides .caption{display:block!important; max-width:180px!important}
.full-slides h2{max-width:480px!important; margin-top:10px!important; margin-bottom:10px!important}
#logo h1 a{font-size:22px!important}
.slide-btn{  font-size: 13px; margin-left: -10px; max-width: 210px !important; margin-bottom:40px;}
.flex-control-nav { position: absolute; text-align: center; width: 100px;margin-top:-20px}
.contact-box a{font-size:11px!important}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { margin: 0 1.5% 2.992em 0!important;}
}
@media only screen and (min-width: 480px) and (max-width: 639px) {


	/*display dropdown nav*/
	#masternav .selector,
	#masternav select { display: inline-block; }
	#masternav ul { display: none; }
	#masternav{ padding: 0; height: 40px; line-height: 40px; float: none; padding: 0 5px; margin: 0; background: #3383C1; color: #fff; top: 0; right: 0; cursor: pointer; }
.top-header {display: block; float: right; margin-bottom: -65px;  margin-top: 86px; }
.flexslider .caption{display:block!important;  font-size:12px!important}
.flexslider .caption p{font-size:12px!important}
.slide-btn{padding:6px 15px!important; max-width:280px!important; margin-bottom:10px!important; margin-top:10px}
.flex-control-nav {left:320px;  margin-top: -60px; position: absolute; text-align: center; width: 100px;margin-top:-20px}
.hp-highlight{margin:0 auto!important; float:none!important; margin-bottom:15px!important;}
#sidebar{float:left; margin-left:8px; margin-bottom:15px}
.page-template-template-fullwidth-php .post{width:90%!important; padding-left:0px!important; padding-right:0px!important}
.shop-page{padding-left:0px!important}
.prodct, .woocommerce ul.products li.product, .woocommerce-page ul.products li.product{width:190px!important}
#page-heading h1{left:16px; font-size:20px!important}
.single-product .product_title{font-size:18px!important;}
#page-heading{width:100%!important}
.single-product .woocommerce div.product span.price, .woocommerce div.product p.price, .woocommerce #content div.product span.price, .woocommerce #content div.product p.price, .woocommerce-page div.product span.price, .woocommerce-page div.product p.price, .woocommerce-page #content div.product span.price, .woocommerce-page #content div.product p.price{font-size:18px!important}
.full-slides h2{font-size:18px!important; margin-bottom: 10px!important; margin-top: 20px!important;}
.slide-btn{ margin-bottom:40px!important}
.flex-control-nav { position: absolute; text-align: center; width: 100px;margin-top:-20px!important;left:10px!important}
.contact-box a{font-size:11px!important}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { margin: 0 3% 2.992em 0!important;}

}
@media only screen and (min-width: 321px) and (max-width: 479px) {

	/*display dropdown nav*/
	#masternav .selector,
	#masternav select { display: inline-block; }
	#masternav ul { display: none; }
	#masternav{ padding: 0; height: 40px; line-height: 40px; float: none; padding: 0 5px; margin: 0; background: #3383C1; color: #fff; top: 0; right: 0; cursor: pointer; }
.top-header {display: block; float: right; margin-bottom: -65px;  margin-top: 86px; margin-right:-10px}
#logo {  margin-left: 8px;  margin-top: 100px !important; text-align: center;}
.flexslider .slides img{max-width:176px!important}
#slider-wrap { margin-top: -10px;}
.full-slides h2{font-size:14px!important; margin-top:10px;}
.flex-control-nav li a{width:7px!important; height:7px!important}
.hp-highlight{width:206px; margin-bottom:15px;background-color:#739EC0!important; padding-right:10px;}
.hp-highlight p{line-height:18x!important;}
.hp-highlight h2{font-size:14px}
.flexslider .caption{display:block!important; width:180px!important; font-size:12px!important}
.flexslider .caption p{font-size:12px!important}
.slide-btn{padding:6px 0px!important; max-width:180px!important; margin-bottom:10px!important; margin-top:10px}

#page-heading{width:100%}
.post .entry{background:none!important; font-size:12px!important; width:80%}
#page-heading h1{font-size:20px!important}
#wrap{overflow:visible}
.entry h2{font-size:16px;}
#sidebar { float: left;  margin-bottom: 15px; margin-left: 8px; margin-top: -5px; /*width: 198px;*/}
#sidebar li a{font-size:12px!important}
#sidebar .right-caret { border-bottom: 5px solid transparent; border-left: 6px solid #0A538A; border-top: 5px solid transparent; display: inline-block; height: 0; margin-bottom: 19px;margin-left: 4px;}
#sidebar a:hover .right-caret{ border-left: 6px solid #082d49!important;border-bottom: 5px solid transparent; border-top: 5px solid transparent; display: inline-block; height: 0; margin-bottom: 19px;margin-left: 4px;}
.shop-page{padding-left:8px!important}

#page-heading{margin-top:-10px;width:100%}
#page-heading h1{left:16px!important;}
.single-product .product_title{font-size:16px!important;}
.single-product .woocommerce div.product span.price, .woocommerce div.product p.price, .woocommerce #content div.product span.price, .woocommerce #content div.product p.price, .woocommerce-page div.product span.price, .woocommerce-page div.product p.price, .woocommerce-page #content div.product span.price, .woocommerce-page #content div.product p.price{font-size:16px!important;}
.page-template-template-fullwidth-php .post{width:90%!important; padding-left:0px!important; padding-right:0px!important}
#billing_email{min-width:200px!important}
#wrap{width: 320px; }
.slide-btn{ margin-bottom:40px!important}
.flex-control-nav { position: absolute; text-align: center; width: 100px;margin-top:-20px!important;left:10px!important}
.contact-box a{font-size:11px!important}

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

	/*display dropdown nav*/
	#masternav .selector,
	#masternav select { display: inline-block; }
	#masternav ul { display: none; }
	#masternav{ padding: 0; height: 40px; line-height: 40px; float: none; padding: 0 5px; margin: 0; background: #3383C1; color: #fff; top: 0; right: 0; cursor: pointer; }

#wrap{max-width: 319px; }
.top-header {display: block; float: right; margin-bottom: -65px;  margin-top: 86px; }
#logo {  margin-left: 8px;  margin-top: 100px !important; text-align: center;}
.flexslider .slides img{max-width:176px!important}
#slider-wrap { margin-top: -10px;}
.full-slides h2{font-size:14px!important; margin-top:10px;max-width:180px!important}
.flex-control-nav li a{width:7px!important; height:7px!important}
.hp-highlight{width:206px;  padding-right:10px;}
.hp-highlight p{line-height:18x!important;}
.hp-highlight h2{font-size:14px}
.flexslider .caption{display:block!important; width:180px!important; font-size:12px!important}
.flexslider .caption p{font-size:12px!important}
.slide-btn{padding:6px 0px!important; max-width:180px!important; margin-bottom:10px!important; margin-top:10px}

#page-heading{width:100%}
.post .entry{background:none!important; font-size:12px!important; width:80%}
#page-heading h1{font-size:20px!important}
#wrap{overflow:visible}
.entry h2{font-size:16px;}
#sidebar { float: left;  margin-bottom: 15px; margin-left: 8px; margin-top: -5px; /*width: 198px;*/}
#sidebar li a{font-size:12px!important}
#sidebar .right-caret { border-bottom: 5px solid transparent; border-left: 6px solid #0A538A; border-top: 5px solid transparent; display: inline-block; height: 0; margin-bottom: 19px;margin-left: 4px;}
#sidebar a:hover .right-caret{ border-left: 6px solid #082d49!important;border-bottom: 5px solid transparent; border-top: 5px solid transparent; display: inline-block; height: 0; margin-bottom: 19px;margin-left: 4px;}
.shop-page{padding-left:8px!important}
#page-heading{margin-top:-10px;width:103%}
#page-heading h1{left:16px!important;}
.single-product .product_title{font-size:16px!important;}
.page-template-template-fullwidth-php .post{width:90%!important; padding-left:0px!important; padding-right:0px!important}
#billing_email{min-width:200px!important}
#footer ul{padding-left:0px!important}
#wrap{ width: 240px; }
.flex-control-nav {left:75%!important;  margin-top: -60px; position: absolute; text-align: center; width: 100px;margin-top:-20px}
#wrap{overflow:hidden}
#searchbar input[type="text"] {max-width:130px}
.contact-box a{font-size:11px!important}
.wpcf7-form {
    float: left;
  font-size:14px!important;font-family: 'PT Sans', sans-serif!important;font-weight:400!important;
    margin-right: 3%;
    margin-top: 5px;
    max-width: 90%;
    min-width: 170px;
}
.wpcf7 textarea {
  
    width: 90%;
	max-width:500px;
	min-width:170px;
	margin-bottom:20px
}
.wpcf7-form input[type="text"],.wpcf7-form input[type="password"],.wpcf7-form input[type="email"],.wpcf7-form textarea {
    width:170px!important
}
.slide-btn{}
.slide-btn{ margin-bottom:40px!important; padding-left:15px!important; width:188px!important; margin-left:-25px!important;padding-right:17px!important;}
.flex-control-nav { position: absolute; text-align: center; width: 100px;margin-top:-20px!important; left:10px!important}
.full-slides h2{max-width:180px!important}
.flexslider{width:93.8%!important}
.woocommerce-account.woocommerce form .form-row-first,.woocommerce-account  .woocommerce form .form-row-last,.woocommerce-account  form .form-row-first,.woocommerce-account form .form-row-last{float:none!important; width:95%!important; padding-left:5px!important}

}