/*
Theme Name: getvisual
Template: generatepress
*/

/************************************************
**  
**  GeneratePress Tweaks Section
**
************************************************/

.main-navigation a {
    font-size: 24px;
	font-weight: normal;
}

.main-navigation li a {
	float: left;
	position: relative;
}

.main-navigation .main-nav ul li a {
	width: 140px;
	text-align: center;
	background-color: #e8e8e8;
	padding: 0px 0px 3px 0px;
	margin: 0px 20px 0px 20px;
	border: 4px solid #bbe364;
	border-radius: 70px / 25px;
}

.main-navigation .menu-toggle {color: #FFFFFF; font-size: 22px;}
.main-navigation .menu-toggle:hover {color: #FFFFFF;}
.main-navigation .menu-toggle:visited {color: #FFFFFF;}

.header-widget {
	text-align: center;
	font-size: 20px;
	margin-right: 2%;
}

.header-image {
	width: 100%; max-width: 500px;
}

.copyright-bar {
	font-size: 16px;
	text-align: center;
}

/************************************************
**  
**  popup boxes
**
************************************************/

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}


/************************************************
**  
**  Custom Styles Section
**
************************************************/

h1 {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #3E4E1F;
	font-size: 22px;
	font-weight: bold;
	margin-left: 0px;
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 15px;
	border-bottom: solid;
	border-bottom-color:#1869AB;
	border-bottom-width: 2px;
}
h2 {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #3E4E1F;
	font-size: 18px;
	font-weight: bold;
	font-style: italic;
	text-align: left;
	margin-top: 25px;
	margin-left: 10px;
}
h3 {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #3E4E1F;
	font-size: 18px;
	font-weight: normal;
	font-style: italic;
	margin-top: 15px;
	margin-bottom: 5px;
}
h4 {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #3E4E1F;
	font-size: 18px;
	font-weight: bold;
	font-style: italic;
	margin-top: 5px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 5px;
	border-bottom: solid;
	border-bottom-color:#3E4E1F;
	border-bottom-width: 2px;
}
h5 {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #3E4E1F;
	font-size: 18px;
	font-weight: bold;
	font-style: italic;
	text-align: left;
	margin-top: 5px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
}

.columnfull {
	float: left;
	margin: 1% 0% 1% 0%;
	width: 95%;
	padding: 2%;
	background-color: #f2f2f2;
	border: 3px solid #9DD825;
	border-radius: 6px;
}

.fourcolumn {
	float: left;
	margin: 1% 2% 1% 0%;
	width: 19.8%;
	padding: 1.5%;
	background-color: #ECF8D3;
	border: 3px solid #9DD825;
	border-radius: 6px;
	
	font-size: 14px;
	line-height: 1.4;
	text-align: left;
}

.twocol {
	float: left;
	width: 45%;
    height: auto;
	margin: 1% 2% 1% 0%;
	padding: 1.5%;
	background-color: #f2f2f2;
	border: 3px solid #9DD825;
	border-radius: 6px;
}

#website_portfolio {
	float: left;
	margin-top: 1% 0% 0% 0%;
	padding: 1%;
	background-color: #ECF8D3;
	border: 2px solid #1869AB;
}
#website_portfolio_image {
	float: left;
	margin-top: 1%;
	width: 100%;
}
#website_portfolio_text {
	float: right;
	margin-left: 1.5%;
	margin-top: 0px;
	width: 97%;
}
#mr_portfolio {
	float: left;
	margin: 2% 0% 0% 0%;
	padding: 1%;
	background-color: #ECF8D3;
	border: 2px solid #1869AB;
}
#mr_portfolio_image {
	float: left;
	width: 44%;
}
#mr_portfolio_text {
	float: right;
	margin: 0% 0% 0% 1%;
	width: 54%;
}
#graphics_portfolio_text {
	float: right;
	margin: 1% 1% 0% 0%;
	width: 27%;
	padding: 1%;
	background-color: #ECF8D3;
	border: 2px solid #1869AB;
}
#graphicsportfolioimages {
	float: left; width: 63%;
	margin-top: 1%;
	margin-left: 1%;
}
#testimonial {
	float: left;
	margin-top: 20px;
	margin-left: 0px;
	padding: 10px;
	background-color: #ECF8D3;
	border: 2px solid #1869AB;
}

h4.webportfolio {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	font-style: normal;
	margin: 0px 0px 10px 0px;
	padding: 0px;
	line-height: 1.4;
	text-align: center;
	border: 0px;
}
div.webportfolio {
	float: left;
	width: 29%;
	padding: 1%;
	border: 1px solid #d7d7d7;
	margin: 1%;
}
.bustype {
	font-style: italic;
	font-size: 120%;
}
img.webportfolio {
	width: 100%;
	margin-bottom: 5px;
}

p.fanclubtext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	font-style: italic;
	margin-top: 5px;
	margin-bottom: 15px;
	line-height: 1.4;
	text-align: left;
}
p.smalltext2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	margin-top: 5px;
	margin-bottom: 25px;
	line-height: 1.6;
	text-align: left;
}
a.link {
	color: #F60;
	text-decoration: none;
}
.coregraphic1 {
	float: left;
	width: 29%;
}
.coregraphic2 {
	float: right;
	width: 27%;
}
.coretext {
	float: left;
	width: 38%;
	padding: 0% 2% 0% 2%;
}
.footerlogo {
	float: left;
	margin: -6px 8px 0px 0px;
}


/************************************************
**  
**  Contact Form 7 Styles Section
**
************************************************/
.wpcf7-form {
	background: none;
	width : 100%;
	overflow: hidden;
	margin: 0px;
	font-family: 'Open Sans', sans-serif;
 }
.wpcf7-form-control-wrap {
	margin: 0px;
	padding: 0px;
}
.wpcf7-form h2 {
    font-size : 18px;
    text-align: left;
}
.wpcf7-form input, .wpcf7-form textarea {
    border-color: #808080 #C0C0C0 #C0C0C0 #D4D4D4;
    border-style: solid;
    border-width: 1px;
    padding: 4px;
    line-height: 1.5;
    font-size: 15px;
    width: 100%;
    float: none;
    margin: 0px 0px 0px 0px;
}
.wpcf7-form input {
    line-height: 1.5;
	color: #000;
    font-size: 15px;
    height: 30px;
}
.wpcf7-form textarea {
    line-height: 1.5;
    font-size: 15px;
    height: 200px;
}
.wpcf7-form p {
    font-size : 15px;
    margin: 0px 0px 20px 0px;
    padding: 0 0 0px 0px;
    color: #000;
}
.wpcf7-form-control.wpcf7-submit {
 	margin-left: 0px;
	color: #fff;
	background-color: #7eb347;
	border: 1px solid #07498d;
	width: auto;
	height: auto;
	padding: 8px;
	border-radius: 4px;
}
.wpcf7-form-control.wpcf7-submit:hover {
 	color: #fff;
	background-color: #07498d;
}
p.form-title {
	font-weight: bold;
	font-style: italic;
	background: #d9d9d9;
}
#verticalcheck span.wpcf7-list-item { display: block; }


/************************************************
**  
**  WooCommerce Modifications Section
**
************************************************/

body.woocommerce #primary {
	float: none;
	width: 100%;
}

.woocommerce-Price-amount.amount {
	font-size: 18px;
	color: #000;
}

h1.product_title.entry-title {
	font-size: 30px;
	margin-bottom: 30px;
}

.woocommerce-product-details__short-description p {font-size: 18px; line-height: 2.0; margin-botton: 30px;}

.product-quantity {display: none;}


.single-product .sidebar {display: none !important;}

.woocommerce #primary .images img {
    width: auto;
	margin-bottom: 25px;
}

.woocommerce-message {display: none;}

.woocommerce-page #content div.product div.summary { width:96%; margin: 0% 0% 0% 4%; }

.woocommerce form label {
    font-size: 14px;
}
.woocommerce form .form-row input.input-text, 
.woocommerce form .form-row textarea, 
.woocommerce-page form .form-row input.input-text, 
.woocommerce-page form .form-row text area {
    font-size: 14px;
    line-height: 1.25;
    color: #000;
    padding: 8px;
}

.woocommerce .woocommerce-checkout #billing_state_field {color: #000; font-size: 14px; padding: 8px;}

.woocommerce-additional-fields h3 {display: none;}

#pccp-messages {display: none;}




/************************************************
**  
**  Media Queries / Responsive Styles Section
**
************************************************/

/* When the screen width is less than 470px */
@media only screen and (max-width: 470px) {
	.larger-logo {width: 70px;}
	body {font-size: 15px;}
	.header-widget {font-size: 16px; margin-right: 0%;
}

}

/* When the screen width is less than 600px */
@media only screen and (max-width: 600px) {

.inside-header {}
.site-logo {}
.header-widget {}

.boxeswrapper {width: 100%;}
.fourcolumn {width: 96%; height: auto; padding-bottom: 10px; margin: 3% 0% 3% 0%;}
.twocol {width: 96%; height: auto; padding-bottom: 10px; margin: 3% 0% 3% 0%;}
img.homepic {width: 80%; margin: 2% 10% 2% 10%;}
ul.homelist {margin-left: 5%;}

#sliderarea {padding: 2%; width: 96%; height: auto;}
#rightofsliderarea {padding: 2%; width: 96%; margin-left: 0px;}
.coregraphics {width: 96%; margin: 0% 0% 2% 2%;}
.coregraphic1 {float: left;	width: 46%; margin: 0% 2% 0% 2%;}
.coregraphic2 {float: left;	width: 46%; margin: 0% 2% 0% 2%;}
.coretext {float: left;	width: 96%; padding: 0% 2% 0% 2%;}
	
div.webportfolio {width: 96%;}
h4.webportfolio {font-size: 15px;}
	
#mr_portfolio_image {float: left; width: 96%; margin: 2% 2% 2% 2%;}
#mr_portfolio_text {float: none; margin: 0% 0% 2% 0%; width: 100%;}
}

/* When the screen width is less than 770px */
@media only screen and (max-width: 770px) {
	.main-navigation .main-nav ul li a {
	float: none;
	padding: 0px 0px 3px 0px;
	margin: 10px auto;
	border: 4px solid #bbe364;
	border-radius: 70px / 25px;
}
}

/* When the screen width is between 770px and 900px */
@media only screen and (min-width: 770px) and (max-width: 900px){
.site-logo, .headerinfo {width: 60%;}
}

/* When the screen width is between 600px and 770px */
@media only screen and (min-width: 600px) and (max-width: 770px){

.twocol {width: 96%; height: auto; padding-bottom: 10px; margin: 3% 0% 3% 0%;}
.header-widget {}
#sliderarea {padding: 2%; width: 96%; height: auto;}
#rightofsliderarea {padding: 2%; width: 96%; margin-left: 0px;}
.coregraphics {width: 60%; margin: 0% 0% 2% 20%;}
.coregraphic1 {float: left;	width: 46%; margin: 0% 2% 0% 2%;}
.coregraphic2 {float: left;	width: 46%; margin: 0% 2% 0% 2%;}
.coretext {float: left;	width: 96%; padding: 0% 2% 0% 2%;}
#mr_portfolio_image {float: left; width: 38%; margin: 1% 2% 2% 0%;}
#mr_portfolio_text {float: none; margin: 0% 0% 0% 0%; width: 100%;}
}

/* When the screen width is between 600px and 900px */
@media only screen and (min-width: 600px) and (max-width: 900px){
.fourcolumn {width: 43.5%; height: auto; margin: 1%;}
.fullwidthonoff {float: left; width: 100%;}
div.webportfolio {width: 45.5%;}
h4.webportfolio {font-size: 1.9vw;}
}

/* When the screen width is between 601px and 1099px */
@media only screen and (min-width: 601px) and (max-width: 1099px){
.inside-header {}
.site-logo {}
}

/* When the screen width is between 770px and 1099px */
@media only screen and (min-width: 770px) and (max-width: 1099px){
.inside-header {}
#sliderarea {width: 58%; margin: 0% 0% 0% 1%}
#rightofsliderarea {width: 35%; margin: 0% 0% 0% 2%; font-size: 1.75vw;}
#page {padding: 15px;}
}

/* When the screen width is between 900px and 1099px */
@media only screen and (min-width: 900px) and (max-width: 1099px){
h4.webportfolio {font-size: 1.2vw;}
.mobilemid {display: none;}
}

/* When the screen width is less than 900px */
@media only screen and (max-width: 900px) {
#graphics_portfolio_text {float: left; margin: 1% 1% 1% 0%;	width: 96%;}
#graphicsportfolioimages {float: left; margin: 1% 1% 1% 0%;	width: 96%;}
.desktop {display: none;}
.footerlogo {float: none; margin: 10px auto;}
.copyright-bar {text-align: center;}


}

/* When the screen width is greater than 1099px */
@media only screen and (min-width: 1099px){
.header-widget {}
.inside-header {}
.mobilemid {display: none;}
.mobileonly {display: none;}
}