/*
Theme Name: Domino's Local Stores 2.0 - Landing Page
Description: Landing page for Local Stores 2.0
Author: HS2 Solutions
Version: 2.0

*/
* { margin: 0; padding: 0; line-height: 1; box-sizing: border-box; }

html { font-size: 150%; }
@media all and (min-width: 768px) { html { font-size: 100%; } }

body { font-size: 1rem; font-family: Arial; color: black; min-width: 320px; }

a { text-decoration: none; color: #1759a4; }
a:hover { color: #5aa3e8; }

button { border: 1px solid #979797; background: #c93838; border-radius: 5px; color: white; display: block; width: 100%; font-size: inherit; font-family: inherit; padding: 20px 10px; cursor: pointer; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
button:hover { background: #a22c2c; }

h1 { color: #646464; font-size: 1.5rem; }
@media all and (min-width: 480px) { h1 { font-size: 2rem; } }
h1.site-title { padding: 20px 5px; }
@media all and (min-width: 768px) { h1.site-title { padding-top: 5px; } }

.row:before, .row:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
@media all and (min-width: 768px) { .row .column.third { width: 33%; float: left; }
  .row .column.half { width: 50%; float: left; }
  .row .column.full-width { width: 100%; float: none; } }

@media all and (max-width: 767px) { .bp-up { display: none !important; } }

@media all and (min-width: 768px) { .bp-down { display: none !important; } }

#header { background: #e0e0e0; border-bottom: 1px solid #979797; padding: 5px; }
@media all and (min-width: 768px) { #header { background: none; border: none; padding: 0; position: relative; }
  #header:before, #header:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } }
@media all and (min-width: 980px) { #header { width: 980px; margin-left: auto; margin-right: auto; } }

#logo { width: 55px; margin: 0px auto; }
@media all and (min-width: 480px) { #logo { display: inline-block; vertical-align: middle; margin: 0; } }
@media all and (min-width: 768px) { #logo { width: 25%; display: block; float: left; padding: 10px 0; }
  #logo a { width: 81px; display: block; margin-left: auto; margin-right: auto; } }
#logo img { width: 100%; height: auto; }

#corner-nav { margin-top: 10px; vertical-align: middle; text-align: center; font-size: 1rem; }
@media all and (min-width: 480px) { #corner-nav { display: inline-block; font-size: 1.25rem; margin-top: 0; } }
@media all and (min-width: 768px) { #corner-nav { margin: 0; background: #e0e0e0; border-radius: 0 0 10px 10px; position: absolute; top: 0; right: 0; font-size: .8rem; padding: 10px 20px; } }
#corner-nav a { color: #646464; text-transform: uppercase; padding: 0 10px; }
#corner-nav a:hover { color: #5aa3e8; }
@media all and (min-width: 480px) { #corner-nav a { display: block; float: left; } }
@media all and (min-width: 768px) { #corner-nav a { float: none; display: inline; color: #1759a4; }
  #corner-nav a:hover { color: #5aa3e8; } }
#corner-nav i { color: #5aa3e8; font-size: .75rem; }

#banner-nav { position: absolute; right: 0; bottom: 10px; width: 75%; background: #5aa3e8; border-radius: 5px 5px 0 0; text-align: center; }
#banner-nav a { display: inline-block; background: #5aa3e8; color: white; padding: 10px 40px; font-size: 1.25rem; text-transform: uppercase; }
#banner-nav a:hover { background: #1759a4; }

#content { padding: 5px; }
@media all and (min-width: 768px) { #content { margin-top: 20px; }
  #content:before, #content:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
  #content #left-sidebar { width: 25%; float: left; }
  #content #main-content { width: 72.5%; margin-left: 2.5%; float: left; } }
@media all and (min-width: 980px) { #content { width: 980px; margin-left: auto; margin-right: auto; padding: 0; } }

#left-sidebar .sidebar-content { position: relative; top: -66px; z-index: 99; background: white; display: none; border-radius: 5px; border: 1px solid #979797; color: #646464; -webkit-box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.25); -ms-box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.25); -o-box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.25); box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.25); }
#left-sidebar .sidebar-content:before, #left-sidebar .sidebar-content:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
@media all and (min-width: 768px) { #left-sidebar .sidebar-content { position: static; display: block; border: none; box-shadow: none; background: #f2f2f2; border-radius: 5px 5px 0 0; } }
#left-sidebar .sidebar-content ul { list-style: none; }
#left-sidebar .sidebar-content ul li.nav-link { padding: 20px 10px; cursor: pointer; border-radius: 5px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
#left-sidebar .sidebar-content ul li.nav-link i { float: right; }
#left-sidebar .sidebar-content ul li.nav-link:hover { background: #e0e0e0; }
#left-sidebar .sidebar-content ul li.button { padding: 0; }
#left-sidebar .sidebar-content ul li.button a { padding: 5px 5px; }
#left-sidebar .sidebar-content ul li.button a button { padding-top: 15px; padding-bottom: 15px; }
#left-sidebar .sidebar-content ul li.button a:hover { background: none; }
@media all and (min-width: 768px) { #left-sidebar .sidebar-content ul li.button { font-size: 1.5rem; } }
#left-sidebar .sidebar-content ul li.signup-form { background: #e0e0e0; border-radius: 5px; padding: 10px; border-top: 1px solid #979797; }
@media all and (min-width: 768px) { #left-sidebar .sidebar-content ul li.signup-form { border-left: 1px solid #979797; border-right: 1px solid #979797; border-radius: 5px 5px 0 0; margin-top: 10px; }
  #left-sidebar .sidebar-content ul li.signup-form.bottom-border { border-bottom: 1px solid #979797; border-radius: 5px; } }
#left-sidebar .sidebar-content ul li.signup-form h2 { text-align: center; line-height: 2rem; }
#left-sidebar .sidebar-content ul li.signup-form p { display: block; text-align: center; }
@media all and (min-width: 768px) { #left-sidebar .sidebar-content ul li.signup-form p { line-height: 1.25rem; } }
#left-sidebar .sidebar-content ul li.signup-form span.form-error { color: #c93838; margin: 0 10px 5px; font-weight: bold; display: block; }
#left-sidebar .sidebar-content ul li.signup-form .inline-form:before, #left-sidebar .sidebar-content ul li.signup-form .inline-form:after, #left-sidebar .sidebar-content ul li.signup-form .popup-form:before, #left-sidebar .sidebar-content ul li.signup-form .popup-form:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
#left-sidebar .sidebar-content ul li.signup-form .inline-form input, #left-sidebar .sidebar-content ul li.signup-form .inline-form select, #left-sidebar .sidebar-content ul li.signup-form .popup-form input, #left-sidebar .sidebar-content ul li.signup-form .popup-form select { font-family: inherit; font-size: inherit; background: white; border-radius: 5px; border: 1px solid #979797; float: none; width: 100%; padding: 10px; margin-bottom: 10px; }
#left-sidebar .sidebar-content ul li.signup-form .inline-form button, #left-sidebar .sidebar-content ul li.signup-form .popup-form button { background: #1759a4; width: 100%; vertical-align: middle; }
#left-sidebar .sidebar-content ul li.signup-form .inline-form button:hover, #left-sidebar .sidebar-content ul li.signup-form .popup-form button:hover { background: #5aa3e8; }
@media all and (min-width: 768px) { #left-sidebar .sidebar-content ul li.signup-form .inline-form button, #left-sidebar .sidebar-content ul li.signup-form .popup-form button { float: none; width: 100%; font-size: 1.5rem; padding-top: 15px; padding-bottom: 15px; margin-top: 10px; } }
#left-sidebar .sidebar-content ul li.signup-form .inline-form { background: white; border-radius: 5px; border: 1px solid #979797; margin-top: 10px; margin-bottom: 10px; }
@media all and (min-width: 768px) { #left-sidebar .sidebar-content ul li.signup-form .inline-form { background: none; border: none; } }
@media all and (max-width: 767px) { #left-sidebar .sidebar-content ul li.signup-form .inline-form input { border: none; background: none; float: left; width: auto; padding: 20px 0 20px 10px; vertical-align: middle; width: 50%; margin-bottom: 0; } }
@media all and (min-width: 480px) and (max-width: 767px) { #left-sidebar .sidebar-content ul li.signup-form .inline-form input { width: 65%; } }
@media all and (max-width: 767px) { #left-sidebar .sidebar-content ul li.signup-form .inline-form button { float: right; border-right: none; border-top: none; border-bottom: none; width: auto; } }
#left-sidebar .sidebar-content ul li.signup-form .popup-form { display: none; }
#left-sidebar .sidebar-content ul li a { display: block; padding: 20px 10px; border-radius: 5px; color: #646464; }
#left-sidebar .sidebar-content ul li a:hover { color: white; background: #5aa3e8; }
#left-sidebar .sidebar-content ul li a.active, #left-sidebar .sidebar-content ul li a.active:hover { background: #1759a4; color: white; }
@media all and (min-width: 768px) { #left-sidebar .sidebar-content ul li a { padding: 10px 20px; } }

#mobile-nav-button { border: 1px solid #979797; padding: 20px 10px; border-radius: 5px; color: #646464; cursor: pointer; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
@media all and (min-width: 768px) { #mobile-nav-button { display: none; } }
#mobile-nav-button i { float: right; }
#mobile-nav-button:hover { background: #e0e0e0; }

@media all and (min-width: 768px) { #fb-sb-widget #fb-like-box { background: white; }
  #fb-sb-widget #fb-like-box .fb_iframe_widget span { width: 100% !important; } }
#store-list:before, #store-list:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
#store-list .store { padding: 20px 10px; border-bottom: 2px solid #979797; }
@media all and (min-width: 768px) { #store-list .store { width: 50%; float: left; } }
@media all and (min-width: 980px) { #store-list .store { width: 33%; border-bottom: none; } }
#store-list .store h3 { font-size: 1.25rem; margin-bottom: .25rem; }
#store-list .store p { color: #a6a6a6; font-size: .9rem; }
@media all and (min-width: 980px) { #store-list .store-border.first { border-top: 2px solid #979797; clear: both; }
  #store-list .store-border.first.sb-1 { border-top: none; } }

#footer { color: #646464; margin-top: 20px; }
@media all and (min-width: 768px) { #footer { border-top: 2px solid #1759a4; background: #fafafa; } }
#footer h3 { font-size: 1.25rem; margin-bottom: .25rem; }
#footer p, #footer li { font-size: .8rem; line-height: 1.1rem; color: #7d7d7d; }
#footer ul { list-style: none; }
#footer .btnSM { padding: 10px 0; }
@media all and (min-width: 480px) { #footer .btnSM { width: 50%; float: left; padding: 0 0 20px; } }
#footer .btnSM i { font-size: 1.25rem; }
#footer .row { background: #e0e0e0; border-top: 1px solid #979797; border-left: 1px solid #979797; border-right: 1px solid #979797; }
#footer .row + .row { border-top: none; }
#footer .row + .row + .row { border-bottom: 1px solid #979797; }
@media all and (min-width: 768px) { #footer .row, #footer .row + .row + .row { border-bottom: 2px solid #979797; } }
@media all and (min-width: 980px) { #footer .row { width: 980px; margin-left: auto; margin-right: auto; border-top: none; border-left: none; border-right: none; } }
#footer .row .column { padding: 20px 10px; }
@media all and (min-width: 768px) { #footer .row .column { padding: 20px; } }
@media all and (min-width: 480px) { #footer .row .column.third + .column.third { width: 50%; float: left; } }
@media all and (min-width: 768px) { #footer .row .column.third + .column.third { width: 33%; } }
#footer .row .column.more-links p { line-height: 2rem; }
#footer .row .column.more-links p a { padding-left: 10px; padding-right: 10px; white-space: nowrap; }
@media all and (min-width: 768px) { #footer .row .column.more-links p a { padding-left: 0; padding-right: 0; } }
@media all and (min-width: 768px) { #footer .row .column.more-links p { line-height: 1.5rem; } }