/* -----------------------------------------------------------------------------

    This file should be used to add your own CSS definitions or override
	the existing ones.

----------------------------------------------------------------------------- */

	/* FONT */
	/* body { font-family: 'insert-font-family-name-here', 'Arial', sans-serif; } */

	/* STANDARD LOGO DIMENSIONS */
	.header-branding img { width: 140px; }

	/* LARGE LOGO DIMENSIONS */
	.header-branding.m-large-logo img { width: 180px; }
	/* Scroll down to "MEDIUM DEVICES" to change width of large logo on mobile devices */

	/* your CSS here */

	body {
		font-family: 'Montserrat';
	}

    .bold {
        font-weight: 700;
    }
	.header-menu {
		background-color: #f28a3e;
		font-weight: 500;
		box-shadow: 0 5px 10px rgb(0, 0, 0, 0.25);
	}

	.header-tools {
		top: 20px;
	}


	.header-menu a:link {
		padding: 14px 20px;
	}

	.header-menu a:hover {
		text-decoration: none;
		text-shadow:0px 0px 2px white;
	}

	.header-gmap-switcher {
		display: block;
		float: right;
		line-height: normal;
		height: auto;
		padding: 13px 20px;
		border: none;
		text-align: center;
		text-transform: none;
		box-shadow: 0 5px 10px rgb(0, 0, 0, 0.25);
		min-height: 50px;
	}
	
	.header-gmap-switcher i {
		line-height: normal;
	}

	.header-gmap-switcher:hover {
		box-shadow: 0 5px 10px rgb(0, 0, 0, 0.25);
	}

	.member-btn {
		background-color: #5bc0ef;
		color: #FFF;
		font-weight: 600;
		margin: 0px 0px 0 20px;
		padding: 17px 20px;
		height: auto;
		box-shadow: 0 5px 10px rgb(0, 0, 0, 0.25);
		float: right;
	}

	.member-btn:hover {
		background-color: #FFF;		
		color: #5bc0ef;
	}

	.footer-menu {
		font-weight: 600;
	}

	.footer-text {
		font-weight: 600;
	}

	.notice-title a {
		font-weight: 600;
	}

	.notice-date {
		margin-left: 20px;
	}

	  
	.member-page form {
		width: 100%;
		min-width: 500px;
		align-self: center;
        background: #FFF;
		box-shadow: 0px 0px 0px 0.5px rgba(50, 50, 93, 0.1),
		  0px 2px 5px 0px rgba(50, 50, 93, 0.1), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.07);
		border-radius: 7px;
		padding: 40px;
	  }
	  
	  .member-page .hidden {
		display: none;
	  }
	  
	  #payment-message {
		color: rgb(105, 115, 134);
		font-size: 16px;
		line-height: 20px;
		padding-top: 12px;
		text-align: center;
	  }
	  
	  #payment-element {
		margin-bottom: 24px;
	  }
	  
	  /* Buttons and links */
	  .member-page button {
		background: #5469d4;
		font-family: Arial, sans-serif;
		color: #ffffff;
		border-radius: 4px;
		border: 0;
		padding: 12px 16px;
		font-size: 16px;
		font-weight: 600;
		cursor: pointer;
		display: block;
		transition: all 0.2s ease;
		box-shadow: 0px 4px 5.5px 0px rgba(0, 0, 0, 0.07);
		width: 100%;
	  }
	  .member-page button:hover {
		filter: contrast(115%);
	  }
	  .member-page button:disabled {
		opacity: 0.5;
		cursor: default;
	  }
	  
	  /* spinner/processing state, errors */
	  .spinner,
	  .spinner:before,
	  .spinner:after {
		border-radius: 50%;
	  }
	  .spinner {
		color: #ffffff;
		font-size: 22px;
		text-indent: -99999px;
		margin: 0px auto;
		position: relative;
		width: 20px;
		height: 20px;
		box-shadow: inset 0 0 0 2px;
		-webkit-transform: translateZ(0);
		-ms-transform: translateZ(0);
		transform: translateZ(0);
	  }
	  .spinner:before,
	  .spinner:after {
		position: absolute;
		content: "";
	  }
	  .spinner:before {
		width: 10.4px;
		height: 20.4px;
		background: #5469d4;
		border-radius: 20.4px 0 0 20.4px;
		top: -0.2px;
		left: -0.2px;
		-webkit-transform-origin: 10.4px 10.2px;
		transform-origin: 10.4px 10.2px;
		-webkit-animation: loading 2s infinite ease 1.5s;
		animation: loading 2s infinite ease 1.5s;
	  }
	  .spinner:after {
		width: 10.4px;
		height: 10.2px;
		background: #5469d4;
		border-radius: 0 10.2px 10.2px 0;
		top: -0.1px;
		left: 10.2px;
		-webkit-transform-origin: 0px 10.2px;
		transform-origin: 0px 10.2px;
		-webkit-animation: loading 2s infinite ease;
		animation: loading 2s infinite ease;
	  }
	  
	  @-webkit-keyframes loading {
		0% {
		  -webkit-transform: rotate(0deg);
		  transform: rotate(0deg);
		}
		100% {
		  -webkit-transform: rotate(360deg);
		  transform: rotate(360deg);
		}
	  }
	  @keyframes loading {
		0% {
		  -webkit-transform: rotate(0deg);
		  transform: rotate(0deg);
		}
		100% {
		  -webkit-transform: rotate(360deg);
		  transform: rotate(360deg);
		}
	  }

      .custom-code-widget {
        height: 100%;
      }

      .slide-content h2, .slide-content h3 {
        text-shadow: 1px 1px 2px gray;
      }

	  .sidebar .locale-info-widget.m-has-bg .widget-inner {
		background-position: bottom;
		background-size: cover;

	  }

	  .memorial {
		width: 100%;
		height: 300px;
		background: url(../../images/WM-bg.jpg);
        background-repeat: no-repeat;
		background-position: center -150px;
		background-size: cover;
		margin: 0 0 30px 0;
		padding: 20px;
		position: relative;
	  }

	  .memorial h2 {
		color: #FFF;
		font-size: 40px;
	  }

	  .memorial-banner {
		background-color: #5bc0ef;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 50px;
		font-size: 18px;
		font-weight: 500;
		color: #FFF;
		text-align: center;
		padding-top: 15px;
	  }

	  .memorial img {
		width: 100px;
		position: absolute;
		top: 20px;
		right: 20px;
	  }



	  .history-tile {
		width: 100%;
		padding: 90% 20px 20px 20px;
		background: url(../../images/history-tile.jpg);
		background-position: center;
		background-size: cover;
		margin: 0 0 30px 0;
		position: relative;
		overflow: hidden;
	  }

	  .history-tile img {
		position: absolute;
		bottom: -25%;
		left: -10%;
		width: 60%;
	  }

	  .history-tile h2 {
		color: #FFF;
		font-size: 46px;
		z-index: 1;
		text-align: right;
		position: absolute;
		right: 20px;
		top: 20px;
		width: 100%;
		text-shadow: 1px 1px 2px gray;
	  }

	  .history-tile-banner {
		background-color: #5bc0ef;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 50px;
		font-size: 18px;
		font-weight: 500;
		color: #FFF;
		text-align: center;
		padding-top: 15px;
	  }


	  .hub-tile {
		width: 100%;
		padding: 30px;
		background: url(../../images/bhub-bg.jpg);
		background-position: center;
		background-size: cover;
        background-repeat: no-repeat;
		margin: 0 0 30px 0;
		position: relative;
		color: #FFF;
	  }

	  .hub-tile h2 {
		color: #FFF;
		font-size: 33px;
		text-align: left;
		text-shadow: 1px 1px 2px gray;
	  }

	  .hub-tile p {
		font-size: 18px;
		line-height: 30px;
	  }

	  .hub-tile h3 {
		font-size: 20px;
		color:#FFF;
		text-transform: uppercase;
	  }

	  .hub-tile a {
		font-size: 20px;
		color:#FFF;
		font-weight: 700;
	  }

	  .hub-tile hr {
		margin-bottom: 20px;
	  }

	  .hub-tile .inner {
		left: 30px;
		top: 30px;
		right: 30px;
		bottom: 30px;
	  }
      .c-gallery .gallery-images>li {
        padding: 10px 10px;
      }

      .gallery-image h2 {
        font-size: 24px;
      }

      .gallery-image p {
        margin: 0;
      }

      .gallery-image img {
        margin: 0;
        width: 100%;
      }

      .inner-content {
        padding: 20px;
      }

      .full-btn {
        background-color: #5bc0ef;
        color: #FFF;
        padding: 15px;
        width: 100%;
        text-align: center;
      }

      .pull {
        font-weight: 600;
        font-size: 19px;
        margin: 50px 0;
      }

      .pull-img {
        margin: 30px 0 10px;
        width: 100%;
      }

      .signup-field {
        background-color: #FFF;
        border: 1px solid #DDD;
        border-radius: 3px;
        margin-bottom: 10px;
      }

      .label {
        font-size: 1rem;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
      }

      #payment-form h3 {
        font-weight: 500;
        line-height: 30px;
        
      }

      .big-bullet {
        font-weight: 600;
        line-height: 30px;
      }

	  .form-group input {

		margin-bottom: 20px;

	  }

	  #contact-form button {

		margin-bottom: 20px;
	  }

	  .purchase {
		background: #5bc0ef !important;
	  }

	  .donate {
		background: #88d6a6 !important;
	  }

	  .member-sub {
		font-weight: 500;
		font-size: 20px;
		margin-bottom: 20px;
	  }

	  .donate-blurb {
		margin: 30px 20px;
		text-align: center;
		line-height: 24px;
	  }

	  .membership li {
		padding: 5px;
		margin: 20px;
		list-style-position: outside;

	  }

	  .ribbon {
		width: 150px;
		height: 150px;
		overflow: hidden;
		position: absolute;
	  }
	  .ribbon::before,
	  .ribbon::after {
		position: absolute;
		z-index: -1;
		content: '';
		display: block;
		border: 5px solid #76c4a1;
	  }
	  .ribbon span {
		position: absolute;
		display: block;
		width: 225px;
		padding: 15px 0;
		background-color: #7acea6;
		box-shadow: 0 5px 10px rgba(0,0,0,.1);
		color: #fff;
		font: 700 18px/1 'Lato', sans-serif;
		text-shadow: 0 1px 1px rgba(0,0,0,.2);
		text-align: center;
	  }

	  
	  /* top right*/
	  .ribbon-top-right {
		top: -10px;
		right: 5px;
		z-index: 10;
	  }
	  .ribbon-top-right::before,
	  .ribbon-top-right::after {
		border-top-color: transparent;
		border-right-color: transparent;
	  }
	  .ribbon-top-right::before {
		top: 0;
		left: 0;
	  }
	  .ribbon-top-right::after {
		bottom: 0;
		right: 0;
	  }
	  .ribbon-top-right span {
		left: -25px;
		top: 30px;
		transform: rotate(45deg);
	  }

      .memorial-mobile {
        display: none;
      }


	  /* .fb-container {
		flex-grow: 1;
  		display: flex;
  		flex-direction: column;
		background-color: #f28a3e;
	  }

	  .left-column {
		background-color: #5469d4;
	  }

	  .middle-column {
		background-color: aqua;
	  }

	  .left-column > div {
		display: flex;
		flex-direction: column;
		height: 100%;
	  }

	  .middle-column > div {
		display: flex;
		flex-direction: column;
		height: 100%;
	  } */


/* -----------------------------------------------------------------------------

    RESPONSIVE DEFINITIONS

----------------------------------------------------------------------------- */

    /* -------------------------------------------------------------------------
        LARGE DEVICES
		devices with width between 992px and 1199px
    ------------------------------------------------------------------------- */

    @media ( max-width: 1199px ) {

		/* your CSS here */

	}

    /* -------------------------------------------------------------------------
        MEDIUM DEVICES
		devices with width between 768px and 991px
    ------------------------------------------------------------------------- */

    @media ( max-width: 991px ) {

		/* LARGE LOGO DIMENSIONS */
		.header-branding.m-large-logo img { width: 140px; }

		.fb-page {
			display: none !important;
		}

		.fb-banner {
			display: none !important;
		}

		.member-page form {
			min-width: 300px;
		}

        .memorial {
            background-position: center;
            padding-right: 100px;
        }

        .memorial h2 {
            font-size: 30px !important;
        }

        .memorial-mobile {
            font-size: 16px;
        }

        .memorial-banner {
            display: none;
        }

        .memorial-mobile {
            display: block;
        }

        .history-tile h2 {
            font-size: 35px !important;
        }

		/* your CSS here */

	}

	/* -------------------------------------------------------------------------
        SMALL DEVICES
		devices with width between 481px and 767px
    ------------------------------------------------------------------------- */

    @media ( max-width: 767px ) {

		/* your CSS here */


	}

	/* -------------------------------------------------------------------------
        EXTRA SMALL DEVICES
		devices with width up to 480px
    ------------------------------------------------------------------------- */

	@media ( max-width: 480px ) {

		/* your CSS here */

	

	}