/*
Theme Name: Smith Co
Theme URI: 
Author: Consumer Focus Marketing
Author URI: https://consumerfocusmarketing.com
Description: Theme for Smith Co
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: TAGS
Text Domain: #
*/

:root {
	--white: #FFFFFF;
	--black: #000000;
	--body: #231F20;
	--dk-gray: #D0D0D0;
	--lt-gray: #F4F4F4;
	--red: #D71635;
	--hover-red: #960f25;
}

/*** DEFAULTS ***/

/* font size will +/- by 1px for every 100px of the viewport width */

html {
	font-size: calc(10px + 0.5vw); 
}

body { 
	font-size: 1rem;
	line-height: 1.45;
	overflow-x: hidden;
	color: var(--body);
	margin: 0;
	font-family: 'Roboto', sans-serif;
}

@media (max-width: 767px){
	body{
		font-size: 1.25rem;
	}
}

* {
	transition-property: all;
	transition-duration: 0.2s;
	transition-timing-function: linear;
}

*, ::after, ::before {
	box-sizing: border-box;
}

.wrapper {
	padding: 3rem 15px 4rem;
}

img {
	max-width: 100%;
	height: auto;
}

.clearfix::after {
	content: "";
	clear: both;
	display: table;
}

h1, h2, h3, h4 {
	margin: 0 0 .5rem;
	line-height: normal;

}

/**

Font size formula: Target Size / Base Size = Value
Example: 50px / 16px = 3.125rem

**/

h1 {
	font-size: 4.688rem;
}

.home h1 {
	text-shadow: 0px 3px 6px #00000029;
	color: var(--white);
	margin: 5rem auto 6.875rem;
}

h2 {
	font-size: 2.813rem;
}

h3 {
	font-size: 1.563rem;
}

h4 {
	font-size: 1.375rem;
	color: var(--red);
}

p {
	padding: 0;
}

a:not(footer a) {
	text-decoration: none;
	color: var(--red);
}

a:not(footer a):hover {
	color: var(--hover-red);
	text-decoration: underline;
}


a[href^="mailto:"], a[href^="tel:"] {
	color: inherit;
	text-decoration: none;
}
.btn[href^="tel:"]{
	color: var(--white);
}

/*** "GLOBAL" STYLES ***/

.container {
	min-width: 90vw;
}

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

.text-right {
	text-align: right;
}

.text-left {
	text-align: left;
}

hr {
	border: none;
	border-top: 1px solid var(--dk-gray);
	margin: 2rem 0;
}

@media (min-width: 768px) {
	.float-md-left {
		text-align: left;
	}
	.float-md-right {
		text-align: right;
	}
	.float-md-none {
		text-align: none;
	}
}



/** TESTIMONIALS LINE **/

.hr-testimonials {
	display: flex;
}
.hr-line {
	width: 100%;
	margin: 75px 0;
	border-bottom: 0.625rem solid var(--red);
}

/*** COLORS ***/

.body-bkg, footer {
	background: var(--body);
	color: var(--white);
}

/*** BUTTONS ***/

button:hover {
	cursor: pointer;
}

.btn, .gform_button {
	padding: 0.625rem 2.188rem;
	margin: 1rem .25rem;
	letter-spacing: 0.021rem;
	text-decoration: none;
	display: inline-block;
	white-space: pre-wrap;
	text-transform: uppercase;
	font-size: 0.938rem;
	font-weight: 700;
	border-radius: 1.188rem;
	line-height: 1.1;
}

.btn:hover {
	transition: all 0.2s ease 0s;
	text-decoration: none;
	border-radius: 0;
}

.gform_button {
	border:  none;
}

.btn-primary, .gform_button {
	background: var(--red);
	color: var(--white);
	text-align: center;
}

.btn-primary:hover, .gform_button:hover {
	background: var(--hover-red);
	color: var(--white);
}

.btn-default {
	border: 2px solid var(--red);

}

.btn-default:hover {


}

@media (max-width: 767px){
	.btn-primary, .gform_button, .btn{
		display: block;
		font-size: 1.5rem;
	}
}

/*** COLORS ***/



/*** HEADER ***/

@media(min-width: 768px) {
	.header-container {
		text-align: right;
	}
}

header .body-bkg {
	padding-top: 0.438rem;
	padding-bottom: 0.5rem;
	font-size: 0.75rem;
	line-height: normal;
}

@media (max-width: 767px){
	header .body-bkg{
		font-size: 1.2rem;
		text-align: center;
		padding: 0.75rem;
	}
}
/*** NAV BAR ***/

.main-menu {
	font-size: 1.063rem;
	padding-top: 0;
}



.main-menu .nav-link {
	color: var(--black);
	font-weight: 700;
	text-transform: uppercase;
}

.navbar-brand {

	background: var(--white);
	padding: 1.188rem 0.75rem;
}


.navbar {
	z-index: 10000;
}

@media(max-width: 768px) {
	.navbar-brand img {
		margin-bottom: 25px;
		margin-top: 25px;
	}
}

@media (max-width: 991px) and (min-width: 768px){
	.navbar-brand{
		padding: 1.5rem;
		margin: auto;
	}
}

/*** MENU - BASE STYLES ***/

/* show dropdown menus on hover */
.dropdown:hover > .dropdown-menu {
	display: block;
}

.dropdown-item {
	text-align: left;
	padding: .5rem 1.5rem;
}

/* removes the deadzone click area */
.dropdown-menu {
	margin: 0;
	border: 0;
	border-radius: 0;
}

.dropdown-menu .submenu-two {
	width: 100%;
}


.nav-link:hover,
.nav-item:hover {
	color: var(--red);
}

.dropdown-item {
	font-weight: 700;
}

.dropdown-item:hover {
	background: var(--lt-gray);
}


.nav-item.active > a {
	color: var(--red);

}

.dropdown-item:hover {

}


@media(min-width: 768px) {
	.dropdown-menu {
		background: ;
	}

	.dropdown-menu {
		left: auto;
		right: 0;
		margin: 0 auto;
	}

	/* hides carets */
	.dropdown-toggle::after {
		display: none;
	}
}


/*** MENU - TOP LEVEL ***/


/*** MENU - SECOND LEVEL MENU DROPDOWNS ***/

.second-level {
	position: relative;
}

.second-level > .dropdown-menu {
	top: 0;
	left: 100%;
}

.dropdown-menu {
	box-shadow: rgba(0, 0, 0, 0.19) 0 0 8px 0;
}


@media (min-width: 768px) {
	.second-level > .dropdown-menu {
		margin-top: -.5rem;
	}

	.second-level.menu-item-has-children > a:after {
		display: block;
		content: "▸";
		float: right;
		margin-right: -20px;
	}

	.second-level:hover > a:after {
		border-left-color: inherit;
	}

	.menu-item-has-children > .dropdown-item {
		padding: .5rem 2.25rem .5rem 1.5rem;
	}
}


/*** MENU - THIRD LEVEL MENU DROPDOWNS ***/

.submenu-two {

}

@media (max-width: 768px) {
	.third-level .dropdown-item {
		padding-left: 40px;
		font-size: 1.2rem;
	}

	.second-level.menu-item-has-children .dropdown-item::after {
		display: inline-block;
		margin-left: .255em;
		vertical-align: .255em;
		content: "";
		border-top: .3em solid;
		border-right: .3em solid transparent;
		border-bottom: 0;
		border-left: .3em solid transparent;
	}

	.third-level a.dropdown-item::after {
		display: none !important;
	}
}

/**** MENU - MOBILE ****/



@media (max-width: 768px){
	.main-menu .nav-link{
		text-align: left;
		font-size: 1.3rem;
		padding: 0.75rem;
	}

	button.navbar-toggler.navbar-dark {
		background: var(--red);
	}
	div#bs-example-navbar-collapse-1 {
		background: var(--lt-gray);
	}
	.dropdown-item{
		font-size: 1.4rem;
	}
}

/*** HOME ***/

.main-content h2:after {
	display: block;
	content: '';
	background: var(--red);
	height: 4px;
	max-width: 200px;
	margin-top: 1.281rem;
	margin-bottom: 1.219rem;
}

.box-link {
	color: initial;
}

.box-link:hover {
	color: initial;
	text-decoration: none;
}

.box-wrapper {
	background: var(--lt-gray);
	border-radius: 1.875rem;
	padding: 1.875rem 0.938rem;
	margin: 3.625rem auto 2.375rem;

}

.box-wrapper:hover {
	background: var(--dk-gray);
}

.red-line {
	border-bottom: 0.25rem solid var(--red);
	max-width: 6.25rem;
	margin: auto;
}

.testimonials-section {
	margin-bottom: 3.938rem;
}

.testimonials-section h4 {
	margin: 0 0 1.875rem;
}


.testimonials-section blockquote {
	font-size: 1.125rem;
	line-height: 2.188rem;
}

.testimonials-section cite, .testimonials-section p  {
	display: inline;
}

.testimonial-item * {
	margin: 0;
}
.testimonials-page .testimonial-item {
	margin-bottom: 2rem;
}

.testimonials-page blockquote {
	border-left: 8px solid var(--red);
	background: var(--lt-gray);
	padding: 1rem 2rem;
	font-size: 1.125rem;
	line-height: 2.188rem;
}

.testimonials-page blockquote cite {
	display: block;
	padding-top: .5rem;
}


@media (max-width: 767px){
	.home .main-content img {
		display: none;
	}
}
/*** FOOTER ***/

footer {
	font-size:  0.875rem;
	padding-top: 2.813rem;
	padding-bottom: 3rem;
}


footer a {
	color: inherit;
}

footer a:hover {
	color: var(--lt-gray);
}

footer strong {
	font-size: 0.938rem;
}


[class*="footer-icon"]:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	display: inline-block;
	margin-top: 0.25rem;

}

.footer-icon--phone:before {
	background: url('img/phone.svg') no-repeat;


}

.footer-icon--contact:before {
	background: url('img/contact.svg') no-repeat;

}

.footer-icon--address:before {
	background: url('img/pin.svg') no-repeat;
}



.footer-icon--phone,
.footer-icon--contact,
.footer-icon--address {
	padding-left: 0.875rem;
}

a.footer-icon--phone {
	padding-bottom: 1.5rem;
	display: inline-block;
}

@media (max-width: 767px){
	footer{
		font-size: 1rem;
	}
	footer .float-md-right {
		margin-top: 2rem;
	}
}

/*** PAGES ***/

/*.page-content {
margin: 25px auto 50px;
}*/

.page-content h1 {
	font-size:  3rem;
	color: var(--white);
}

.page-title-wrapper {
	margin-bottom: 2.5rem;
}

.page-background.text-center.bkg-img .title-text h1 {
	color: var(--white);
}

.page-background.text-center.no-img {
	background: var(--black);
	padding: 1rem;
	border-top: 3px solid var(--red);
	border-bottom: 3px solid var(--red);
}

.page-background .no-img .title-text h1 {
	color: var(--black);
}



ul.serviceArea {
	column-count: 2;
}

/*** 404 ***/

.not-found {
	min-height: 15rem;
	flex-direction: column;
}

.not-found h1 {
	font-size: 10rem;
}

.not-found h2 {
	margin-bottom: 1.66rem;
}

/*** SIDEBARS ***/


.well {
	padding: 1rem;
	margin: 1rem auto 1.5rem;
	text-align: center;
	background: var(--lt-gray);
	border-radius: 1.875rem;
}

.well-alt {
	background: var(--dk-gray);
	color: initial;
}

.well h2, .well h3 {
	font-size: 1.875rem;
}







/*** PAGE CALLOUTS ***/

.callout {
	background: var(--lt-gray);
	margin-bottom: 1.563rem;
	margin-right: 0;
	margin-left: 0;
}

.callout-image {
	max-width: 15rem;
}

.callout-text {
	padding: 3.75rem 4.313rem 3.688rem 3rem;
}


@media(max-width:768px) {
	.callout .callout-text {
		flex: 0 0 100%;

	}
	.callout-image{
		max-width: none;
		height: 150px;
	}
}

.full-callout {
	margin-bottom: 1.563rem;
}

.full-callout-text:before {
	content:"";
	background-color: var(--body);
	position: absolute;
	height: 100%;
	width: 200vw;
	left: -100vw;
	z-index: -1;
}

.full-callout-bkg:before {
	background-size: cover !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
}

.full-callout-bkg * {
	color: var(--white);
}

.full-text {
	background: none;
	position: relative;
	display: grid;
	padding-top: 3.75rem;
	padding-bottom: 4.313rem;
	color: var(--white);
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}

.full-text:before {
	content:"";
	position: absolute;
	height: 100%;
	z-index: -1;
	/*   width: 200vw; 
	left: -100vw;*/
	width: 100%;
	left: 0;
	right: 0;

}



/*** CATEGORIES & TAGS ***/

.post-tags, .post-categories {
	font-size: small;
	font-style: italic;
}

/*** BLOG POSTS ***/

.blog-categories ul, .blog-categories li {
	list-style: none;
	padding: 0;
}

.blog-wrapper h2 a {
	color: initial;
}

.blog-wrapper h2 a:hover {
	text-decoration: none;
}

.blog-wrapper .btn {
	margin-left: 0;
	margin-top: 0;
}

.blog-wrapper .btn:hover {
	border-color: var(--hover-red);
}

/*** SCREEN READERS ***/

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	border: 0;
}


/*** FORMS ***/

.gform_wrapper {
	background: var(--lt-gray);
	padding: 2rem;
}