/* ==========================================================================
   Author's custom styles
   ========================================================================== */
@import 'flexvideo.css';

/* ----------------------------------------------*/
/* -------------- General Defaults --------------*/
/* ----------------------------------------------*/
body, a { position:relative; color:#333; font:400 16px/24px "Source Sans Pro",sans-serif; line-height: 1.5; }
body.bg { background:#f7f7f8; }
input[type="text"], input[type="password"], input[type="url"], input[type="email"], textarea { background:#fff; border:1px solid #ddd; border-radius:4px; box-shadow:inset 1px 1px 6px #eaeaea; font-size:16px; padding:12px 25px;  }
p { margin-top:15px; }
.bold { font-weight:bold; }
img { max-width:100%; }
.clearfix::after, .contentSection::after { clear:both; content:""; display:table; }
.wrapper {  }
#main-wrapper { position: relative; }
div.articles { display: grid; grid-template-columns: 1fr 1fr; row-gap: 30px; column-gap: 20px; }
div.articles footer { margin-top: 10px; }
a { text-decoration:none; }
a.btn:visited {color: #fff;}
.btn { background: #1CB0EF; border-radius:3px; border: 1px solid #1D9FEC; box-shadow:1px 2px 1px #1073A0; color:#fff; display:inline-block; font:18px/24px 'Abel'; letter-spacing:1px; padding:4px 25px; text-align:center; text-decoration:none; text-transform:uppercase; }
.btn:hover {background: #1073A0; box-shadow:1px 2px 1px #1CB0EF;}
.btn.disabled {background: #B3B3B3; border: 1px solid #c0c0c0; box-shadow:1px 2px 1px #787878;}
.btn.lrg { font:600 26px/32px 'Abel'; padding:10px 35px; }
.btn.orange { background:#fab92e; border:1px solid #fbba30; box-shadow:1px 2px 1px #e0a528; text-shadow: 1px 1px 1px #a17517; transition:all .3s; }
.btn.orange:hover { background:#e0a528; box-shadow:1px 2px 1px #fdc449; }
.btn.green { background:#4bcaa2; border:1px solid #50d4aa; box-shadow:1px 2px 1px #43b18e; text-shadow: 1px 1px 1px #318167; transition:all .3s; }
.btn.green:hover { background:#42b490; box-shadow:1px 2px 1px #4bcaa2; }
.card { background:#fff; border-radius:4px; box-shadow:1px 4px 10px #ccc; padding:25px; }
.pageHeader { margin:25px 0; padding:8px; }
.pageHeader u { border-bottom:1px solid #F16522; display:inline-block; padding-bottom:8px; text-decoration:none; }
.contentSection {  }
.contentSection.white { background:#fff; }
.contentSection.gray {  }
.contentSection ol { list-style: decimal; margin: 1em; }
.contentSection ol > li { margin-left: 1em; }
.contentSection strong { font-weight: bold; }
a.btn.demo { display:block; margin:50px auto; width:350px; }

/* ----------------------------------------------*/
/* ------------- Error/Messages -----------------*/
/* ----------------------------------------------*/
#errorSection {margin:75px auto 0px;}
#errors, #messages {margin: 15px 30px 5px; padding: 10px; background-color: #FFFAA6; border: 2px solid #FFC01B; border-radius: 4px;}
/* ----------------------------------------------*/
/* --------------- Main Header ------------------*/
/* ----------------------------------------------*/
#menuHeader { background:#fff; border-bottom:1px solid #ccc; width:100%; z-index:2; }
#menuHeader #logo { float:left; margin-bottom:5px; }
#menuHeader #logo img { display:block; max-width:320px; position:relative; top:4px; transition:all .7s; }
#menuHeader #logo .phone { color:#4bcaa2; display:none; }
#menuHeader #login { float:right; text-align:right; }
#menuHeader #login .phone { color:#4bcaa2; display:inline-block; margin-right:15px; position:relative; }
#menuHeader #login .phone a { color:#4bcaa2; display: inline-block }
#menuHeader #login .phone a:hover {color: #F6AC25; }
#menuHeader #login .phone i { font-size:20px; left:-20px; position:absolute; top:4px; }
#menuHeader #login .btn { margin-top:25px; min-width:140px; }

/* ----------------------------------------------*/
/* --------------- Navigation -------------------*/
/* ----------------------------------------------*/
#mobileMenu { display:none; }
#mobileMenu ul { display:none; }
#mainMenu { position:absolute; top:105px; width:100%; z-index:2; }
#mainMenu ul { margin:0 auto; max-width:960px; width:100%; }
#mainMenu li { float:left; width:20%; background:rgba(51,51,51,.7); color:#fff; letter-spacing:1px; text-align:center; transition: all .3s; }
#mainMenu li a { color:#fff; cursor:pointer; display:block; font-size:14px; padding:6px 0; text-transform:uppercase; }
#mainMenu li:hover { background:#111; border-bottom:5px solid #FFBC2D; }
#mainMenu li.active { border-bottom:5px solid #4bcaa2; }
#mainMenu li { border-left:1px solid #fff; }
#mainMenu li:last-child { border-right:1px solid #fff; }


/* --------------- Home Page -------------------*/
.homeSection { padding:75px 0; background-color:#f5f5f5; background-attachment:fixed; background-position:0 -50px; background-repeat:no-repeat; background-size:cover; clear:both; min-height:850px; position:relative; }
#homeAction { background-image:url(https://blog.grovemenus.com/images/front-end/eating.jpg); border-bottom:1px solid #ccc; z-index:1; }
#homeAction #homeBanner { background:rgba(39,168,125,0.6); border-bottom:1px solid #43b18e; border-top:1px solid #43b18e; bottom:26%; color:#fff; padding:35px 0; position:absolute; text-align:center; width:100%; }
#homeAction #homeBanner h1 { margin-bottom:5px; text-shadow:1px 1px 1px #000; }
#homeAction #homeBanner h3 { margin-bottom:15px; text-shadow:1px 1px 1px #555; }
#homeAction #homeBanner a.btn { width:250px; }
#homeAction #homeBanner .fa-chevron-down { bottom:-33%; color:#fff; cursor:pointer; font-size:55px; margin-left:-25px; position:absolute; text-align:center; text-shadow:1px 1px 1px #000; }

#whyGrove .pageHeader { margin:-20px 0 35px 0; text-align:center; }
#whyGrove .movie { margin:0 auto; width:800px; }
#whyGrove .icons { margin:0 auto; width:80%; }
#whyGrove .icons h4 { float:left; margin-bottom:20px; padding:0 10px; text-align:center; width:25%; }
#whyGrove .icons h4 img { display:block; height:65px; margin:0 auto; }
#whyGrove .myplayer { background-image: url(https://blog.grovemenus.com/images/front-end/graph.jpg); background-repeat: no-repeat;	background-position: center; }

#savingPoints .point { margin:25px 0; width:100%; }
#savingPoints .point h3 { color:#43b18e; }
#savingPoints .point h4 { margin:15px 0 -15px 0; }
#savingPoints .point:nth-child(odd) .img { float:left; margin:0 15px 15px 0; }
#savingPoints .point:nth-child(even) .img { float:right; margin:0 0px 15px 15px; }

/* ------------  Products Page  -----------------*/
#products .card { margin-bottom:20px; }
#products .card img { display:block; margin:0 auto; }
#products header { background:#43b18e; border-radius:0 9px 9px 0; display:inline-block; color:#fff; margin:25px 0; padding:8px 25px; position:relative; }
#products header:before { border-left:25px solid transparent; border-right:25px solid transparent; border-bottom:44px solid #43b18e; content:" "; height:0; position:absolute; left:-26px; top:0; width:0; }


/* ----------------  Blog  -------------------*/
#blog h4 a, #blog h4 { font-family: Domine; font-size: 24px; font-weight: bold; line-height: 2.5; color: #333333; }
#blog .blogCard { display: flex; flex-direction: column; padding: 20px 60px; }
#blog .blogCard header img { max-height:300px; margin-bottom:15px; width:100%; }
#blog .blogCard header h4 { color:#43b18e; font-weight:bold; }
#blog header .detail { color:#999; display:inline-block; font-size:12px; margin-right:8px; }
#blog .blogCard footer p { margin-top: 5px; }
#blog .blogCard footer a { font-size: 20px; font-weight: 600; color: #57cbd2; }
#blog .detail a {font-size: 12px;}
#blog .pagination li { display: inline-block; margin-left: 10px;}
#blog .pagination-center {clear: both; margin-top: 20px;text-align: center;}
#blog .post .entry-content ul { list-style: inherit; padding-inline-start: 2em }



/* ------------  Testimonials Page  -----------------*/
#testimonials .card { margin:15px 0; }
#testimonials .card em { font-weight:bold; }
#testimonials .card .author { color:#999; font-style:italic; text-align:right; }
#testimonials .card .quotes { color:#F16522; font:600 32px/18px 'Sail'; left:-3px; position:relative; top:10px; }
#testimonials .facility header { background:#db5c1f; border-radius:0 9px 9px 0; display:inline-block; color:#fff; margin-top:45px; padding:8px 25px; position:relative; }
#testimonials .facility header:before { border-left:25px solid transparent; border-right:25px solid transparent; border-bottom:44px solid #db5c1f; content:" "; height:0; position:absolute; left:-26px; top:0; width:0; }
#testimonials .testimony .fa { color:#ddd; float:left; font-size:55px; margin-right:25px; }

/* ------------  Contact Page  -----------------*/
.slide { background:#F16522; padding:15px; }
.slideHeader { background:#db5c1f; color:#fff; padding:15px; margin:-15px -15px 0 -15px; }
.slideHeader i { display:inline-block; margin-right:8px; }
#contact .slideWrapper { float:left; width:33%; } 
#contact .slide { color:#fff; margin:15px; }
#contact .slide .content { min-height:75px; }
#contact .slide a { color:#fff; }

/* ------------  About Page  -----------------*/
#about aside .card img { float:left; margin:0 20px 20px 0; }
#about aside .card { margin:20px 0; }

/* ------------  Demo Page  -----------------*/
#demo .demoForm { margin:30px auto; text-align:left; width:420px; }
#demo .demoForm li { margin-bottom:10px; }
#demo .demoForm label { display:inline-block; margin-right:10px; text-align:right; width:150px; }
#demo .demoForm .btn { float:right; margin-right:24px; margin-top:15px; }

/* ------------  Signup Page  -----------------*/
#signup {max-width: 660px; margin: auto; border-top: none;}
#signup .estimates .card { float:left; border:4px solid #fff; margin:25px 10px; min-height:200px; width:45%; }
#signup .estimates .card:hover { border:4px solid #db5c1f;  }
#signup .estimates .card.selected { border:4px solid #1D9FEC;  }
#signup .estimate h4 span { color:#43b18e; }
#signup .legal { color:#999; font-size:13px; }
#signup .buttonpane {margin-top: 10px; padding-top: 10px;}
#signup .buttonpane .buttonset {float: right;}
#signup .half {float: left;}
#signup .half.first {margin-right: 15px;}
#signup .contact-info {max-width: 495px; margin: 0px auto;}
#signup select{background: #fff; border: 1px solid #ddd; border-radius: 4px; box-shadow: inset 1px 1px 6px #eaeaea; font-size: 16px; padding: 12px 25px; width: 100%; height: 45px; margin-top: 2px;  }
#signup table {margin: 15px auto 5px;  }
#signup .btn.remove-facility {padding: 0px; width: 25px; height: 25px;}
#signup .credit-card-date select {width: auto;}
#signup .license-agreement {margin-top: 25px; height: 500px; overflow-y: scroll;}
#signup .slideWrapper { float: left; width: 50%; }
#signup .slide { color: #fff; margin: 15px; }


/* ------------  Login Page  -----------------*/
#loginSection { margin:75px auto 0; text-align:center; width:425px; }
#loginSection #logo img { border-radius:4px; box-shadow:1px 4px 10px #ccc; margin-bottom:20px; width:425px; }
#loginSection .card { text-align:center; }
#loginSection .card h3 { text-align:center; margin-bottom:15px; }
#loginSection .card input { margin-bottom:20px; width:255px; }
#loginSection .card .btn { margin-top:10px; }

/* -----------  Privacy Policy  --------------*/
#privacy-policy ol {list-style-type: decimal; margin-left: 1em; margin-top: 10px;} 
#privacy-policy ul {list-style-type: disc; margin-left: 1em; margin-top: 10px;}
#privacy-policy .card {margin-bottom: 20px}


/* ----------------------------------------------*/
/* ---------------- Footer ----------------------*/
/* ----------------------------------------------*/
.footerBump { display:block; height:295px; }
#mainFooter { background:rgba(51,51,51,.9); bottom:0; height:295px; margin-top:150px; position:absolute; width:100%; }
#mainFooter .wrapper { padding:0 15px; }
#mainFooter .list { border-bottom:1px dotted #d3d1c7; float:left; padding:15px 0; }
#mainFooter h4 { border-bottom:1px dotted #d3d1c7; color:#9e9b90; padding-bottom:10px; margin-bottom:10px; margin-top:25px; }
#mainFooter .lists { width:80%; }
#mainFooter .lists .list { float:left; margin-right:30px; }
#mainFooter .lists .list ul { float:left; }
#mainFooter .lists .list ul li { margin-right:20px; }
#mainFooter .lists a { color:#d3d1c7; display:block; transition:all .5s; }
#mainFooter .lists a:hover, #mainFooter .lists a.active { color:#FFBC2D; }
#mainFooter #footerSocial { float:right; margin-top:45px; text-align:right; width:20%; }
#mainFooter #footerSocial li { display:inline-block; padding:5px 8px; }
#mainFooter #footerSocial i { font-size:35px; color:#fff; }
.legal { clear:both; color:#d3d1c7; font-size:12px; margin-top:20px; width:100%; }


/* ----------------------------------------------*/
/* ------------  Media Queries  -----------------*/
/* ----------------------------------------------*/

/*-- Extra Large Screens ----* /
@media (min-width: 1441px) {
	#homeAction { min-height:1400px; }
	#homeAction #homeBanner { bottom:30%; }
}

/*-- Large Screens ----*/
@media (min-width: 1280px) { /* and (max-width: 1440px) { */
	#homeAction { min-height:800px; }
	.homeSection { min-height:400px; }
	#homeAction #homeBanner  { bottom:25%; }
}

/*-- Laptop Screens ----*/
@media (max-width: 1280px) {
	.homeSection { background-size:cover; background-position:0 70px; }
	#homeAction #homeBanner  { bottom:25%; }
}

@media (max-width: 1024px) {
	#homeAction #homeBanner  { bottom:25%; }
	#homeAction { background-size:contain; }
}

@media (max-width: 960px) {
	#menuHeader { padding-bottom:15px; }
	#menuHeader #logo { width:40%; }
	#menuHeader #logo img { max-width:100%; }
	#menuHeader #logo .phone { text-align:center; }
	#menuHeader #login { width:60%; }
	#homeAction { background-position:0 150px; }
	#homeAction #homeBanner  { bottom:45%; }
	.contentSection { padding:55px 15px; }
	#about .main, #about aside { width:100%; }
	#whyGrove .icons h3 { width:50%; }
	#whyGrove .movie { width:80%; }
}

@media (max-width: 768px) {
	#menuHeader #logo { width:50%; }
	#menuHeader #login .phone { display:none; }
	#menuHeader #logo .phone { display:block; margin-left:25px; }
	#menuHeader #login { text-align:center; width:50%; }
	#menuHeader #login .btn { margin-top:20px; width:64%; }
	#mainMenu { display:none; }
	#mobileMenu { background:rgba(51,51,51,.9); color:#fff; cursor:pointer; display:block; min-height:45px; position:absolute; transition:all .5s; width:100%; z-index:2; }
	#mobileMenu .icon { font-size:25px; position:absolute; right:17px; top:10px; }
	#mobileMenu .fa-times { display:none; }
	#mobileMenu.active .fa-bars { display:none; }
	#mobileMenu.active .fa-times { display:inline; }
	#mobileMenu li { width:85%; }
	#mobileMenu li a { display:block; padding:10px 20px; color: #fff}
	#homeAction #homeBanner  { bottom:30%; }
	.blogCard { width:100%; }
	#contact .slideWrapper { width:100%%; }
	.footerBump, #mainFooter { height:585px; }
	#mainFooter .lists { width:100%; }
	#mainFooter .lists .list { border:none; width:100%; }
	#mainFooter .lists .list h4 { border:none; margin-top:5px; }
	#mainFooter .lists .list ul { border:none; margin:0; width:100%; }
	#mainFooter .lists .list ul a { color:#fff; border-top:3px solid transparent; border-bottom:3px solid transparent; display:block; padding:8px 20px; transition:all .5s; }
	#mainFooter .lists .list ul li { background:#333; display:inline-block; margin:5px; width:auto; }
	#mainFooter .lists .list ul a { padding:8px; text-align:center; }
	#mainFooter .lists .list ul a:hover, #mainFooter .lists .list a.active { background:#111; border-top:3px solid #FFBC2D; color:#fff; }
	#mainFooter #footerSocial { float:left; text-align:left; width:100%; }
	div.articles { display: block; }
	#demo .demoForm { margin:30px auto; text-align:left; width:365px; }
	#demo .demoForm input { padding:15px 5px; }
	#whyGrove .icons h3 { width:100%; }
	#signup .estimates .card { min-height:280px; }
	#signup .slideWrapper { width:100%%; float: none; }
	#blog .blogCard { float:none; padding:10px; width:100%; }
}

@media (max-width:540px) {
	#menuHeader #logo, #menuHeader #login { width:100%; }
	#menuHeader #logo img { height:67px; margin:0 auto; max-width:none; }
	#menuHeader #logo .phone { margin-left:auto; }
	#menuHeader #login .btn { margin-top:0; width:45%; }
	.homeSection { min-height:350px; }
	#homeAction { background-position:0 185px; }
	#homeAction #homeBanner { bottom:10%; padding:15px 0; }
	#homeAction #homeBanner h1 { font-size:24px; line-height:30px; }
	#homeAction #homeBanner h3 { font-size:18px; line-height:24px; }
	.contentSection { padding:50px 15px; }
	.pageHeader { margin:0; }
	#loginSection { margin:75px auto 0; text-align:center; width:95%; }
	#loginSection .card input { width:80%; }
	#loginSection #logo img { width:100%; }
	#signup .half {float: none; margin-top: 25px;}
	#signup .half.first {margin-right: 0;}
	#signup input[type="text"], #signup input[type="password"] {width: 90%; margin: auto; display: block;}
	#signup table input[type="text"] {display: inherit}
	#signup select {width: 90%; margin: auto; display: block;}
	#signup .credit-card-date select {display: inline; width: auto;}
	#signup p.labeled {width: 90%; display: block; margin-left:auto; margin-right:auto;}
}