/*
Theme Name: Santa
Theme URI: 
Author: Consumer Focus Marketing
Author URI: https://consumerfocusmarketing.com
Description: Theme for Nelson Propane
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 {
  --body-color: #0A0A0A;
  --white: #fff;

}



/*** DEFAULTS ***/

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

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

body { 
      font-family: Helvetica, sans-serif;
    color: #666666;
    font-size: 15px;
    line-height: 1.4;
  overflow-x: hidden;
 
  margin: 0;
}

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

* {
    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;
}

h1, h2, h3 {
    font-family: 'Amaranth', sans-serif;
}

h1 {
      font-size: 38.5px;
}

h2{
  font-size: 32px;
  line-height: 32px;
  color: #1f83da;
  margin: 0 0 20px 0;
  padding: 0px;
  }
  
h3{
  font-size: 22px;
  line-height: 22px;
  color: #1f83da;
  }           

h4 {
	    font-size: 17.5px;
}
a{
  color: #1f83da;
  } 

a:hover{
  text-decoration: none;
  } 


/**

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

**/


p {
  padding: 0;
}






a[href^="tel:"], a[href^="mailto:"] {
    color: inherit;
    text-decoration: none;
}


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

.container {
  min-width: 90vw;
}

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

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

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

strong, b {
	color: #0a0a0a;
}

/*** BUTTONS ***/

button:hover {
    cursor: pointer;
}

.btn {
    padding: 4px 12px;
    margin: 1rem .25rem;
    text-decoration: none;
    display: inline-block;
    white-space: pre-wrap;
    text-transform: uppercase;
        border-radius: 4px;
        font-size: 14px;
        box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 1px 2px rgb(0 0 0 / 5%);
       border: 1px solid #ccc;
           line-height: 20px;
           font-weight: 700;
}


.btn:hover, .gform_button:hover {
    transition: all 0.2s ease 0s;
    text-decoration: none;
    filter: brightness(0.90) !important;

}

.btn-primary, .gform_button {

}

.btn-primary:hover {

}

.btn-default {

}

.btn-default:hover {

}

.btn-red, .gform_button {
   background-color: hsl(360, 100%, 27%) !important;
  background-repeat: repeat-x;
  filter: none;
  background-image: -khtml-gradient(linear, left top, left bottom, from(#ef0000), to(#890000));
  background-image: -moz-linear-gradient(top, #ef0000, #890000);
  background-image: -ms-linear-gradient(top, #ef0000, #890000);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ef0000), color-stop(100%, #890000));
  background-image: -webkit-linear-gradient(top, #ef0000, #890000);
  background-image: -o-linear-gradient(top, #ef0000, #890000);
  background-image: linear-gradient(#ef0000, #890000);
  border-color: #890000 #890000 hsl(360, 100%, 22%);
  color: #fff !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33);
  -webkit-font-smoothing: antialiased;
}


.btn-green {
  background-color: hsl(87, 100%, 27%) !important;
  background-repeat: repeat-x;
  filter: none;
  background-image: -khtml-gradient(linear, left top, left bottom, from(#83ef00), to(#4b8900));
  background-image: -moz-linear-gradient(top, #83ef00, #4b8900);
  background-image: -ms-linear-gradient(top, #83ef00, #4b8900);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #83ef00), color-stop(100%, #4b8900));
  background-image: -webkit-linear-gradient(top, #83ef00, #4b8900);
  background-image: -o-linear-gradient(top, #83ef00, #4b8900);
  background-image: linear-gradient(#83ef00, #4b8900);
  border-color: #4b8900 #4b8900 hsl(87, 100%, 22%);
  color: #fff !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33);
  -webkit-font-smoothing: antialiased;
  font-weight: 700;

    padding: 11px 19px;
    font-size: 17.5px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;

}



/*** COLORS ***/



/*** HEADER ***/

.slogan p{
  font-family: 'Norican', cursive;
  color: #55ba00;
  font-size: 24px;
  line-height: 1.3;  
  text-align: center;
  margin: 0 40px 0 0;
  }   


@media(min-width: 768px) {
  .slogan {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .slogan p{
   margin: 10px;
  }
}

.dk-blue {
    position: relative;
    background: #143a53 url('img/bg.jpg');
    z-index: 20;
    padding: 25px 0px 55px 0px;
    border-bottom: 1px solid #9b9b9a;
}

.content{
  position: relative;
  top: -30px;
  border-top: 6px solid #1f83da;
  background-color: #ffffff;
  -webkit-box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0px -10px 10px rgba(0, 0, 0, 0.1);
  padding: 30px 30px 0px 30px;
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;         /* Opera/IE 8+ */
  min-height: 300px;
  z-index: 100;
}

@media (max-width: 768px){
	header#masthead{
		text-align: center;
	}
	.slogan img {
    display: none;
	}
}
/*** NAV BAR ***/

.main-menu {
  background-color: #006ccc;
  background-image: linear-gradient(to bottom, #0098ef, #006ccc);
  background-repeat: repeat-x;
  border-top: 1px solid #47b0ed;
  border-bottom: 1px solid #47b0ed;
  box-shadow: 0px 25px 25px rgba(0, 0, 0, 0.1);
  padding: 0;
}

.nav-link {
  font-size: 14px;
  text-align: center;
  color: var(--white);
  text-decoration: none;
  text-shadow: 0px -1px 0px rgba(0, 0, 0, .50);
  font-weight: 400;
  padding: 20px 10px !important; 
  text-transform:uppercase;
  border-right: 1px solid #47b0ed;
  border-left: 1px solid #006ccc;
}

@media(min-width: 1095px){
	.nav-link {
		  padding: 20px 15px !important; 
		}
}

.nav-link:hover, .dropdown-item:hover {
    background: linear-gradient(to bottom, #006ccc, #0098ef);
    color: var(--white);
}

.dropdown-menu {
  background-color: #006ccc; /* Old browsers */
  background: linear-gradient(to bottom,  #0098ef 0%,#006ccc 100%); /* W3C */
  border: 1px solid #47B0ED;
  border-radius: 5px;
  box-shadow: inset 0px 0px 5px rgba(50, 50, 50, 0.5);
}

.dropdown-menu > li > a {
    color: var(--white);
    line-height: 30px;
    padding: 3px 20px;
}




@media(max-width: 991px){
	.navbar.container.flex-wrap, .navbar-expand-md>.container, .navbar-expand-md>.container-fluid {
		display:block;
		text-align: center;
	}
}






/*** 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: ;
}

.dropdown-item:hover {
  background: ;
}


@media(min-width: 768px) {
  .dropdown-menu {
        background: ;
  }
	
  .dropdown-menu {
      left: auto;
      right: 0;
      margin: 0 auto;
  }

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



@media (max-width: 768px) {
  .nav-link, .dropdown-item {
      text-align: left;
      padding-bottom: 1rem;
     
    }

    .nav-link {
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

}


/*** 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 {
    background: ;
}

@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;
  }
}


/*** HOME ***/

.home h1 {
    font-size: 32px;
    line-height: 32px;
    color: #1f83da;
    margin: 0 0 20px 0;
    padding: 0px;
}

.dk-blue h1, .dk-blue p{
  color: #fff;
}

span.gala-date {
    font-weight: 700;
    display: block;
    text-transform: uppercase;
    line-height: 2;
	font-size: 18px;
}

span.gala-location {
    font-size: 14px;
    font-weight: 700;
}

span.gala-description {
    margin-top: 15px;
    display: block;
}

.home .well {
    height: 100%;
}

.home-well .btn {
    margin-bottom: 0;
}

.home .entry p {
    display: inline;
}

.home-blog-link {
	font-weight: 700;
	color: #ef0000;
}

/*** FOOTER ***/

footer {
  background: #143a53;
  color: #989898;
  overflow: hidden;
  padding: 15px 20px;
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;         /* Opera/IE 8+ */
  }

footer a {  
  color: #bbbbbb;
  font-weight: 400;
  }

footer a:hover {  
  color: #ffffff;
  }
@media(max-width: 768px){
	 footer, footer .text-right{
	 	text-align: center;
	 }
}
/*** PAGES ***/

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

.masonry {
	display: grid;
    grid-gap: 32px 50px;
	grid-gap: 20px;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}
.masonry img {
	box-shadow: 0 8px 17px 0 rgb(0 0 0 / 20%), 0 6px 10px 0 rgb(0 0 0 / 19%);
	height: 100%;
	width: 100%;
    object-fit: cover;
}

.masonry img:hover {
	transform: scale(1.05);
    transition-duration: 0.2s;
    transition-timing-function: linear;

}


.photos-100.hidden-phone {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.brands p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 50px;
}

.brands p img {
    border: 1px solid rgba(0, 0, 0, 0.2);
    margin-bottom: 1rem;
}

.board li {
    text-align: left;
    margin-bottom: 1rem;
}

/*** 404 ***/

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

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

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

/*** SIDEBARS ***/


.well {
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
    padding: 1rem;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    text-align: center;
	color: #0a0a0a;
}

.well.alt-well {
    border-top: 6px solid #1f83da;
    background-color: #ffffff;
}


/*** PAGE CALLOUTS ***/


.full-callout {
	padding: 0;
	text-align: center;
}

.full-callout div {
    width: 100%;
    height: 100%;
    padding: 2rem;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 1;
	 color: var(--white);
}

/*** BLOG POSTS ***/

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


.post-date {
    font-size: 14px;
    color: #ad0000;
    font-family: 'Amaranth';
}

.alignright {
    float: right;
    padding-left: 20px;
}

/*** CATEGORIES & TAGS ***/

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



/*** 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;
}



/*** MISC ***/

.post img{
  padding: 4px;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
     -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
          box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
  -moz-box-sizing: border-box;    /* Firefox, other Gecko */
  box-sizing: border-box;         /* Opera/IE 8+ */
}

.post img.noFrame{
  padding: 0px;
  background-color: none;
  border: none;
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
}     


/*** FORMS ***/

.gform_wrapper {
    background: #f3f3f3;
    padding: 1rem;
    border-radius: 4px;
}

.gform_button {
    border: none;
    padding: .5rem 1rem;
    text-transform: uppercase;
    font-weight: 700;
    border-radius: 4px;
}

