/*

Theme Name: VMP Red Theme 2019

Theme URI: 

Description: Mobile Friendly responsive theme for VMP

Version: 1.0

Author: Jamison Raymond

*/

@charset "utf-8";

html, body {height: 100%;}
body {font-family: 'Open Sans', sans-serif;background:#671215;color:#333;}

/* Typography */
h1, h2, h3 {font-family: 'Merriweather Sans', sans-serif;}

@media only screen and (max-width: 1280px) {
  .nav-item {font-size: .7em;}
}


/* Header Styles */
.header {background:#7d1619;color:#fff;}
.header img {margin-left: auto;margin-right:auto;margin-bottom:1em;}

/* Navigation Styles */
.nav-red {background-color: #b11f24;color:#fff799;}
.navbar-dark .navbar-nav .nav-link {color:#fff;}
.navbar-dark .navbar-nav .nav-link:hover {color:#fff799;}
.navbar-dark .navbar-nav .dropdown-menu {background-color:#671215;}
.navbar-dark .navbar-nav .dropdown-menu a.dropdown-item:hover {background-color:#7d1619;color:#fff799;}
.navbar-dark .navbar-nav .dropdown-menu .dropdown-item {color:#fff;}


/* Content Area Styles */
.main-content {padding:1.5em;}

/* Footer Styles */
.footer {background-color: #b11f24;color:#fff;margin-left:0;margin-right:0;padding:1em;}
.footer a {color:#fff;}
.footer a:hover {color:#fff799;text-decoration:none;}
.footer a:visited {color:#fff;}

/* COLORS */
.red {color:#b11f24;}
.red-med {color:#7d1619;}
.red-dark {color:#671215;}
.yellow {color:#fff799;}

.bg-white {background: #fff;}
.bg-red {background: #b11f24;}
.bg-red-med {background: #7d1619;}
.bg-red-dark {background: #671215;}


/* Handwritten Text Styles*/
.hand {font-family: 'Kalam', sans-serif;}
.hand-blue {font-family: 'Kalam', sans-serif; color:#0000ff;}
.hand-red {font-family: 'Kalam', sans-serif; color:#b11f24;}

/* Misc Formatting Classes*/
.spacer {padding:.5em;margin:.5em;}

/* Member Banner Rotator (125x125) */

.member-banners-container {margin-bottom: 1em;}
.member-banners-rotator {max-width:533px;margin-left:auto;margin-right:auto;padding:.2em;background:#fffabb;}
.member-banners-rotator img {margin-left: .2em;margin-right: .2em;}

/* payment stuff*/
.paymentbuttons
{
    width:650px;
    max-width:100%;
    text-align: center;
    margin: 0 auto;
    font-family:Arial, Helvetica, sans-serif;
}

.paymentbutton
{
    width:200px;
    max-width:100%;
    display: inline-block;
    margin: 10px;
    border: 2px solid darkblue;
    border-radius: 10px;
    font-size: 12px !important;
    overflow: hidden;
}

.attention
{
    width:580px;
    max-width:100%;
    text-align: center;
    margin: 20px auto;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
    color:darkblue;
    border: 2px solid darkblue;
    padding:5px;
    
}

.paymentbutton .instructions
{
    padding: 10px;
    height: 85px;
}

.logo {
    height: 60px;
    margin-bottom:5px;
    padding:5px;
    border-bottom: 2px solid darkblue;
}

.paymentbutton img {
    max-width:100%;
    max-height: 100%;
}

.paymentbutton button {
  background-color: darkblue;
  border: none;
  color: white;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  cursor: pointer;
  font-weight: bold;
}

.paymentbutton input[type=submit] {
  background-color: darkblue;
  border: none;
  color: white;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  cursor: pointer;
  font-weight: bold;
  width: 100%;
}


.buynow {
  background-color: darkblue;
  width: 400px;
  max-width: 100%;
  border: 6px ridge gold;
  color: white;
  padding: 10px 20px;
  text-align: center;
  text-decoration: none;
  display: block;
  font-size: 26px;
  margin: 20px auto;
  cursor: pointer;
  font-family:Arial, Helvetica, sans-serif;
  font-weight: bold;
}


@media only screen and (max-width: 980px) {
    .member-banners-rotator {max-width:300px;margin-left:auto;margin-right:auto;padding:.2em;background:#fffabb;}
}