/*
Theme Name: Visual Instructor
Author: Jon Blackwell
Description: Visual Instructor Theme
Version: 1.0
*/



body{margin:30px 0px 0px 0px; font-family: 'Roboto', sans-serif; font-size: 14px}
.center_div {margin:auto}
h1, h2, h3, button, input{font-family: 'Roboto', sans-serif}
.font_weight-100 {font-weight: 100}
.font_weight-300 {font-weight: 300}
.font_weight-500 {font-weight: 500}
.font_weight-700 {font-weight: 700}
.font_weight-bold {font-weight: bold}
.center {text-align:center; margin-left:auto; margin-right:auto}
.center_group {margin-left:auto; margin-right:auto}
.max_700 { max-width:700px;  }
.max_900 { max-width: 52rem; }
.max_1280 { max-width:1280px; }
.max_83r { max-width:83rem }
.max_72r { max-width:72rem }
.max_70r { max-width:70rem }
.max_1180 { max-width:76rem; }
.max_1000 { max-width:60rem; }
.indent_1 {padding-left:1rem }
.small-tm {font-size:.9em}

.white {color: #fff}
.bg_grey { background-color: #a7a9ac}
.big_white{ font-size:3rem; color:#fff; text-shadow: 0px 0px 20px #229cdd;line-height:1.1}
.med_white{ font-size:2rem; color:#fff; line-height:1.5}
.med_blue {color:#229cdd; font-size:2.6rem }
.reg_blue {color:#229cdd; font-size:2rem }
.blue_heading {color:#229cdd; font-size:1.6rem; font-weight:300 }
.med_grey{ font-size:2rem; color:#a7a9ac; line-height:1.5}
.large_white {font-size:3rem; color:#fff; font-weight:300; letter-spacing: .1rem}
.blue_box {background-color: #229ccd}
.grey_box {background-color: #383838}
.auto_height img {height:auto}
.center_middle {display: flex; width: 100%; align-items: center;   justify-content: center;}
.small {font-size:1.4rem}
.x-small {font-size:1rem}
.indent {margin-left:2rem;}

.no_margin_bottom {margin-bottom:0px}
.no_margin_top {margin-top:0px}

a.blue-button, a:visited.blue-button, .blue-button a, .blue-button a:visited{background-color: #229cdd; overflow-wrap:normal !important}
a:hover.blue-button, .blue-button a:hover{background-color: #1c6d98}

a.blue-button, a:visited.blue-button {font-size:1.2rem;  color:#fff;padding:.6rem 1rem; border-radius:3px;font-weight:400}

a.green-hyper, a:visited.green-hyper {color:#93d400;text-decoration: underline;font-weight: 500}
a:hover.green-hyper {color: #6fa000}

.faq_q {margin-bottom:.1rem}
.answer {color:#229cdd; font-weight:500}
.faq_a {margin-top:0px}
.faq_a ~ ul {margin-top:-1rem}

 a,a:visited{color: #229cdd; text-decoration: none}
 a:hover{color: #1c6d98}

 /* Pricing stuff */
.pricing {overflow: visible !important;border:none }
.pricing table {height: 3.2rem; font-size:1.4rem; font-weight:300; color:#4d4d4f; border-spacing:0px}
.pricing table tr td:first-child {background-color:#eceded; padding-left:2rem; border-top-left-radius: 3px; border-bottom-left-radius: 3px}
.pricing table tr td:nth-child(2) {background-color:#eceded;padding-right:.5rem; border-top-right-radius: 3px; border-bottom-right-radius: 3px}
.pricing table tr td:last-child {width:1% !important;padding-left:1rem}
.wp-block-column {   word-break: normal !important;  overflow-wrap: normal !important;}
.round_corners {border-radius:3px}

sup {font-size: .7rem}

.footer-email {color: #fff; text-decoration: none;}
.footer-email, .footer-email {color:#fff; text-decoration: none; display:block; margin-top:28px}
a:hover.footer-email {color:#999}

/* form submit message */
.frm_message{text-align: center}

header {padding-bottom:1rem}
footer {padding-top:1rem}
p, faq_a ul, faq_a li, #main ul, #main li, .block-editor-block-list__layout ul {font-weight: 300; letter-spacing: .05rem;  font-size: 1.4rem;  color: #4d4d4f; line-height: 1.5}
input,textarea,select {border-style:solid; box-shadow: inset 0px 0px 0px 0px white;  border-radius: 0px !important; border-bottom: 1px solid #ddd;border-right: 1px solid #ddd;border-left: 1px solid #ddd; border-top:0px solid #fff !important; background-color:#f6f6f6 !important}
input, select {height: 46px !important}
textarea {padding-top:12px !important}


/* Mobile Phone ----------- */
@media only screen
and (min-width : 0px) {
	html {font-size:10px}
	/* Header / Menu */
	#menu-icon {display: block; position: absolute; top: 28px; right: .3rem;text-decoration: none; cursor: pointer;  padding: 0 0.4em; font-weight: 100; font-size: 1.7em; }
	.footer_logo, .logo {display:inline-block; padding-left:1rem}
	.header-menu li a, .header-menu li a:visited {text-decoration:none; color: #58595b; text-transform: uppercase;}
	.header-menu li a:hover {color:#000}
	/* responsive menu */
	.header-container-menu {position:absolute; background-color:#fff;width:100%;top:120px;opacity:1; transition: opacity 0.6s ease 0s}
	.hide{opacity:0; pointer-events:none; transition:opacity 0.6s ease 0s}
	.menu li {list-style-type: none}
	.menu li:first-child a {border-top:1px solid #ddd}
	.menu li a { padding: 1rem; border-bottom:1px solid #ddd;display:block}
	.menu {padding-left:0px; margin:0px}
	.menu li.orange-button a,.menu li.orange-button a:visited {background-color:#ff4d00; color:#fff;font-weight:bold}
	.menu li.green-button a, .menu li.green-button a:visited{ background-color: #93d400; color:#fff;font-weight:bold}
	.menu li.orange-button a:hover {background-color:#af3500;}
	.menu li.green-button a:hover{ background-color: #6fa000;}
	/* End of responsive menu */

	/* Footer Menu */
	.footer-menu li { margin-top:1rem}
	.footer-menu li.orange-button a {background-color:#ff4d00; color:#fff;font-weight:bold;padding:.7rem .9rem .7rem .9rem !important;border-radius:3px}
	.footer-menu li.orange-button a:hover {color:#fff; background-color:#af3500}
	.footer-menu li.orange-button {margin-top:1.5rem}
	.footer-menu li a, .footer-menu li a:visited {text-decoration: none; color:#fff; text-transform: uppercase;}
	.footer-menu li a:hover {color:#999;margin-top:1rem}
	.footer-phone {color: #fff;display:block;margin-top:1rem;margin-bottom:2rem}
	.footer-phone a, .footer-phone a:visited {color:#fff; text-decoration:none}
	.footer-phone a:hover {color:#999}

	.copyright{color:#fff; font-size:.7rem; margin-top:50px; padding-bottom:20px;padding-left:1rem}
	#menu-footer{list-style-type: none; padding-left:1rem}
	/* End of Footer Menu */

	.home_head_block {width:100%; background-color:#229cdd;background-image:url(images/head_banner_bg.jpg); background-repeat:no-repeat;background-blend-mode: soft-light;}
	.home_head_block {min-height:300px; background-size:cover;}

	.green_button a {background-color:#93d400 !important}
	.green_button a:hover {background-color:#6fa000 !important}

	.frm_submit {text-align:center}
	button.frm_button_submit {background-color:#93d400 !important; border:none !important}
	button:hover.frm_button_submit {color:#fff !important; background-color:#6fa000 !important}
	.faq_q, .faq_a,.phone_padding {padding-right:2rem; padding-left:2rem}

	.sp_home_banner{margin-left:auto;margin-right:auto; margin-top:0px;margin-bottom:2rem;  padding-left:1rem; padding-right:1rem}
	.sp_home_para {font-size:2.6rem; color:#000; font-weight:300;  line-height:1.5; margin-top:-1rem; padding-left:1rem; padding-right:1rem}
	.sp_home_label {letter-spacing: .1rem; font-size: 1.6rem; color:#39323d; line-height:1.2 }
	.sp_home_desc {font-size: 1.4rem; line-height:1.5;margin-top:-.5rem; color:#39323d }
	.sp_contact_header {border-bottom: 4px solid #93d400;padding-top: 4px; padding-bottom:4px; margin-bottom:6px}
	.sp_contact_desc {font-size: .8rem; font-weight:500; margin-top:0px; margin-bottom:20px }

	.sp_download_banner, .sp_pricing_banner, .sp_product_banner, .sp_onsight_banner, .sp_faq_banner, .sp_contact_banner {height:250px;background-repeat: no-repeat;background-position: right;}
	.sp_download_banner p, .sp_pricing_banner p, .sp_product_banner p, .sp_onsight_banner p, .sp_faq_banner p, .sp_contact_banner p {font-size:2.6rem; font-weight:500; color:#fff}
	.sp_product_banner { background-image:url(images/product_banner_bg.png);}
	.sp_onsight_banner { background-image:url(images/onsight_banner_bg.png);}
	.sp_download_banner, .sp_faq_banner { background-image:url(images/faq_banner_bg.png);}
	.sp_contact_banner { background-image:url(images/contact_banner_bg.png);}
	.sp_pricing_banner { background-image:url(images/pricing_banner_bg.png);}
	.sp_contact_desc {font-size: 1rem}

	.pricing {margin-left:0px; margin-right:0px}
	.pricing table tr td:first-child {padding-left:.2rem;}
}


/* Small Tablet ----------- */
@media only screen
and (min-width : 480px) {

	.home_head_block {min-height:380px; background-size:contain;}
	.big_white{ font-size:4rem; }

}


/* Tablets -----------*/
@media only screen
and (min-width : 768px){

	html {font-size:12px}
	.big_white{ font-size:5rem; }

}


/* Desktop ------------*/

@media only screen
and (min-width : 1024px){
	html{font-size:16px}
	body{margin:48px 0px 0px 0px;}


	/* Header menu */
	/* remove responsive */
	.header-container-menu {position:relative; background-color:transparent;width:auto; top:auto;transition: opacity 0s ease 0s; opacity:1}
	.menu li {list-style-type: none}
	.menu li:first-child a {border-top:none}
	.menu li a { padding: 0px; border-bottom:none;}
	.menu {padding-left:0px; margin:0px}
	/* end of responsive */
	#menu-icon {display:none}
	.footer_logo,.logo {padding-left:0px}
	header{margin-left:.6rem; margin-right:.6rem}
	footer{padding-left:.6rem; padding-right:.6rem}
	.header-container-menu {float:right;margin-top:44px;}
	.header-container-menu, .header-menu li {display:inline-block}
	.header-menu li {margin-left:15px}
	.header-menu li:first-child {margin-left:0px !important}
	.orange-button a, .orange-button a:visited{border-radius: 3px; font-weight:500; padding:.7rem .9rem .7rem .9rem !important;
		background-color:#ff4d00; color:#fff !important; text-transform:capitalize !important;}
	.orange-button a:hover {background-color: #af3500}
	.green-button a, .orange-button a:visited{border-radius: 3px; font-weight:500; padding:.7rem .9rem .7rem .9rem !important;
		background-color:#93d400; color:#fff !important; text-transform:capitalize !important;}
	.green-button a:hover {background-color: #6fa000}
	/* End of Header */
	/* Footer */
	.footer-email{display:block}
	.footer-phone {display:block}
	.footer-container-menu {float:right;margin-top:16px;}
	.footer-container-menu, .footer-menu li {display:inline-block;}

	.footer-menu li {margin-left:15px}
	.footer-menu li:first-child {margin-left:0px !important}
	.copyright{padding-left:0px}
	/* End of Footer */


	.home_head_block {min-height:724px; font-size: 4rem;background-blend-mode: unset;}

	.sp_home_para {color:#000; font-weight:300;  line-height:1.5; margin-top:-2rem; padding-left:0px; padding-right:0px}
	.sp_home_banner{margin-left:auto;margin-right:auto; padding-left:0px; padding-right:0px}
	.sp_home_label {letter-spacing: .1rem;}
	.sp_home_desc {line-height:1.5;margin-top:-.5rem; color:#39323d }

	.sp_contact_desc {font-size: .8rem}

 	.pricing_right {margin: .5rem 0px 14px 14px !important;}
	.pricing table tr td:first-child {padding-left:2rem;}

}
@media only screen
and (min-width : 1120px){
	.footer-menu li, .header-menu li {margin-left:30px}

}


@media only screen
and (min-width : 1200px){
	.footer-menu li, .header-menu li {margin-left:50px}

}
@media only screen
and (min-width : 1280px){
	.faq_q, .faq_a,.phone_padding{ padding-right:0px; padding-left:0px}

}
@media only screen
and (min-width : 1324px){
	.footer-menu li, .header-menu li {margin-left:50px}
	header {margin-left:4rem; margin-right:4rem}
	footer {padding-left:4rem; padding-right:4rem}
}

/* Editor specific */
.wp-block{
    max-width: 100%;
}