/*
Theme Name: Bo On The Go Theme
Theme URI: www.michaelmamczynski.com
Author: Michael Mamczynski
Author URI: www.michaelmamczynski.com
Description: Theme made for the soft washing company Bo On The Go
Requires at least: 6
Tested up to: 6
Requires PHP: 7
Version: 0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: boonethego
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments


License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

All files, unless otherwise stated, are released under the GNU General Public
License version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html)

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned
with others.
*/

/*
*colors used in the site
*/
:root {
  --bg-main: #fefefe;
  --bg-section: #2293bb;
  --bg-footer: #2293bb;
  --bg-secondary : #006535;
  --bg-selection: #61d0f4;
  --header-text: #1f6570;
}
.bg-main {
	background-color: var(--bg-main);
}
.bg-section {
	background-color: var(--bg-section);
	color: white;
	font-style: italic;
	padding-top: 2rem;
	padding-bottom: 2rem;
	text-align: center;
	opacity:1;
}
.bg-footer {
	background-color: var(--bg-footer);
}
.color-secondary {
	color: var(--bg-secondary);
}
.color-header {
	color:  var(--header-text);
	font-weight: bold;
}
.color-selection {
	color: var(--bg-selection);
}

/*
*Fonts used in the site
*/
@font-face {
    font-family: 'Avenir'; /*a name to be used later*/
    src: url('assets/fonts/Avenir-Font/avenir_ff/AvenirLTStd-Black.otf'); /*URL to font*/
}
html, body, .tooltip, .popover {
  font-family: 'Avenir', 'roboto',sans-serif;
}


/*
* Entire site affected CSS
*/

body {
	background-color: var(--bg-main);
}
a {
	color: var(--bg-selection);
	text-decoration: none;
	transition: color 0.25s;
}
footer a {
	color: white;
}
.bg-section a {
	color: white;
}
a:hover {
	text-decoration: underline !important;
	color: var(--bg-selection);
}
.section-heading {
	font-size: 2em;
	padding: 1em !important;
	z-index: 5;
	box-shadow: 1px 2px 5px 1px rgba(0, 0, 0, 0.2);
	background-color: var(--bg-section);
}
.text-muted {
	color:  #a2c9d7 !important;
}
.mh-500 {
	min-height: 500px;
}



/*
* Nav Bar Drop Down and padding
*/
.top-navbar {
	box-shadow:1px 1px 10px rgba(0, 0, 0, 0.3);
	z-index: 5;
	/*margin-bottom: 1rem;*/
}
nav .navbar-nav li .sub-menu {

	position: absolute;
	background:  var(--bg-main);
	box-shadow:1px 1px 10px rgba(0, 0, 0, 0.5);
	width: 100%;
	left: 0;
	margin: 0;
	padding: 0;
	list-style-type: none;
  visibility: hidden;
  opacity: 0;
  transition-duration: .25s, 0s;
  transition-delay: 0s, .25s;
  z-index: 10;
  border-radius: 5px;
}
nav .navbar-nav .menu-item-has-children .sub-menu{

	transition-delay: 0s, .25s;
}
nav .navbar-nav .nav-item {
	position:relative;
	padding:0vw 1.5vw;

}

nav .navbar-nav a { 
	color: inherit; 
	transition: color 0.25s;
}

nav .navbar-nav a:hover { 
	color: var(--bg-selection);
}

li.current_page_item a {
	color: var(--bg-selection) !important;
  text-decoration:underline !important;
}
li.current-menu-parent a {
	color: var(--bg-selection);
  text-decoration:underline;
}
li.drop-down-item a {
	color: black;
	text-decoration:none;
}

#navbarSupportedContent {
	margin-right: auto;
	flex-grow: initial !important;
}

.logo-head {
	height: auto;
	max-width: 25vh;
}


/*
 * Footer
 */

.list-group-item {
	color: inherit; 
	background-color: unset;
	border: none;
}
footer li.current_page_item a{
	color: var(--bg-selection);
}
/*
* Front Page
*/

.front-img {
	text-shadow:
		-1px -1px 0 #000,
		1px -1px 0 #000,
		-1px 1px 0 #000,
		1px 1px 0 #000;
	}

/* Services Provided */

.img-thumbnail {
	border: none;
	border-radius: 5px;
	overflow: hidden;
	padding: 0px;
	background:  initial;
}


.services-img-main:hover ~ .services-img-Secondary {
	width: 100%;
}


.services-img-Secondary {
	width: 0;
	transition: width 1.5s;;
}

.services-img-Secondary:hover {
	width: 100%;

}

.services-img-text {
	color: black;
	transition: color 0.25s;
	background-color: rgba(255, 255, 255, 0.8);
	padding: 1vw 3vw; 
	display: block;
	font-style: italic;
}

.fa-ul {
	margin-left: 0px !important;

}

.cleaning-solutions {
	width: fit-content !important;
}

ul li::marker {
	color:  var(--bg-selection);
}

/**
 * Contact Page
 * */
 /*Changes f7 spinner*/
 .wpcf7-spinner {
 	display: block;
 	margin-right: auto;
 	margin-left: auto;
 	margin-top: 5px;
 }
 .wpcf7-response-output {
 	text-align:center;
 }

/**
 * Phone Number
 * */
#telephoneText {
	display: none;
}
#telephoneText, #telephoneNumber {
	color: white;
	text-decoration: underline;
	text-decoration-color: white;
}
/**
 * WP classes
 */
p.has-text-align-center {
	font-size: 1.5rem;
	margin-left: auto;
	margin-right: auto;
	width: 50%;
}


/**
 * Media Screens
 */
@media screen and (max-width: 576px) {
	.twentytwenty-wrapper {
		width: 100% !important;
	}
	.fa-ul {
		margin-left: var(--fa-li-margin,2.5em) !important;
	}
	p.has-text-align-center {
		width: 100% !important;
	}
	.services-img-Secondary{
		width: 100% !important;
	}
	h1 a {
	text-decoration: underline;
	}
	.cleaning-solutions-about {
		margin-left: 3rem !important;
	}
	.missing-page-footer {
		top: 800px;
	}	
}

@media screen and (min-width: 1080px) {
	#telephoneText {
		display: block;
	}
	#telephoneLink {
		display: none;
	}
}

/**
 * BEAF twenty20
 * */
.twentytwenty-wrapper {
	width: 70%;
	margin-left:auto;
	margin-right: auto;
}
.twentytwenty-overlay:hover {
	background: initial !important;
}
/*
* Before After Slider
*/
.twenty20 {
	margin-left: auto !important;
	margin-right: auto !important;
}
.twentytwenty-before , .twentytwenty-after {
	max-height: 800px !important;
	border-radius: 5px;
}