body {background-color: #eee;
      color: #222;
      font-family: sans-serif;
      font-size: 24px;
      text-align: left;
      padding: 4px 8px 4px;
      margin: 4px 8px 4px; }
pre {margin: 0; font-family: monospace;}
.row {display: block;}
img {float: right; border: 0;}
hr {width:90%; background-color:#ccc; border:0; height:1px;}
a:link, a:hover {text-decoration: none;}
header {
  margin: 0 auto;
  font-weight: bold;
  background-image: url(images/bg_body.png);
  background-size: 100% 100%;
  color: #efc;
}
footer {font-size: 50%; width: 90%; text-align: center; margin: 1em auto;}
header h1 {font-size: 175%; text-shadow: 2px 2px 5px blue; text-align: center;}
header .sup {font-size: 75%;}
h2 {font-size: 90%; text-shadow: 2px 2px 3px blue; text-align: center;}
h3 {font-size: 75%;}
header a:link {font-weight:bold; color:#fff;}
header a:hover {color:#abc;}
header .topbar{text-align:center; font-size:60%; padding:12px;}
header .info {float:left; color:#eee;}
header .menu {float:right;}
.actions {width: 100%; text-align:center; font-size:85%;}

a.cartQ:link  { color: #0434BB; }
a.cartQ:hover { color: #0458D9; }
#cartlogintitle,
#cartlogintitle a,
#cartlogintitle a:link,
#cartlogintitle a:visited,
.cartQ,
.cartlogintitle {
  color: #fff; text-decoration:none; text-align:right;
}
#cartlogintitle a:hover {
  color: #abc; text-decoration:none; text-align:right;
}
.cartloginQ,
.cartsmtitle {
  font: 0.7em Tahoma, sans-serif;	font-size: 11px; font-weight:bold;
  text-decoration:none;  text-justify:none;
  color: #151515;
}
a.cartsmtitle:link { text-decoration:none; }
.cartsmtitleempty {
  color: #B0B0B0;
}
.cartsmtext {
  font: 0.7em Tahoma, sans-serif;	font-size: 11px;
  text-decoration:none;  text-justify:none;
  color: #151500;
}
#cartview {
  display: block; margin-left: auto; margin-right: auto;
  font: 0.7em Tahoma, sans-serif;	font-size: 11px;
}
/* Add animation (Chrome, Safari, Opera) */
@-webkit-keyframes example {
    from {top:-100px;opacity: 0;}
    to {top:0px;opacity:1;}
}

/* Add animation (Standard syntax) */
@keyframes example {
    from {top:-100px;opacity: 0;}
    to {top:0px;opacity:1;}
}

p.cartlogin.button {
	text-align: right;
	margin: 5px 0;
}

/* styling the checkbox "keep me logged in"*/
.cartlogin-keep {
	margin-top: -5px;
}
.cartlogin-keep input,
.cartlogin-keep label {
	display: inline-block;
	font-size: 12px;
	font-style: italic;
}
.cartlogin-keep input#cartloginkeep {
	  margin: 12px 5px 0 0;
}
.cartlogin-keep label {
	width: 80%;
}

/* The button used to close the modal */
.modal .cartbtnclose {
  text-decoration: none;
  float: right;
  font-size: 35px;
  font-weight: bold;
  color: #fff;
}
/* --- */
body {font-family: Arial, Helvetica, sans-serif;}
.hitxt {color: #700;}

/* The Modal (background) */
.modal:target { display: block; }
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 10px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal-msg  { text-align: center; }
.modal-body   { display: table; }
.modal-body p { display: table-row; }
.modal-body label,
.modal-body div,
.modal-body input,
.modal-body span,
.modal-body .modal-msg {
    display: table-cell; margin: 6px; padding: 8px;
}
.modal-body p label {
    text-align: right;
    vertical-align: middle;
    font-size: 75%;
}
.modal-body input#cartloginpwd,
.modal-body input#cartloginid {
    width: 80%;
}
.modal-body input#loginbtn,
.modal-body input#regbtn {
    padding: 4px;
    font-size: 60%;
}
.modal-body p.cartlogin-keep input {
    float: right;
}
.modal-body .cartlogin-keep label {
    text-align: left;
}
/* Modal Content */
.modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 1px solid #888;
    width: 80%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s
}
.modal-msg {
  font-weight: 600;
  font-size: 18px;
  color: #7d1c21;
  text-decoration:none; text-align:right;
}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/* The Close Button */
.close {
    color: white;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

.modal-footer,
.modal-header {
    padding: 2px 16px;
    background-color: #010D1B;
    color: white;
}
.modal-body {padding: 2px 16px;}

.glyphicon {
    font-size: 14px;
}

.tagline {
  padding: 8px 0px 8px 0px;
}

@font-face {
    font-family: 'BebasNeueRegular';
    src: url('fonts/BebasNeue-webfont.eot');
    src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BebasNeue-webfont.woff') format('woff'),
         url('fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'FontomasCustomRegular';
    src: url('fonts/fontomas-webfont.eot');
    src: url('fonts/fontomas-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/fontomas-webfont.woff') format('woff'),
         url('fonts/fontomas-webfont.ttf') format('truetype'),
         url('fonts/fontomas-webfont.svg#FontomasCustomRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'FranchiseRegular';
    src: url('fonts/franchise-bold-webfont.eot');
    src: url('fonts/franchise-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/franchise-bold-webfont.woff') format('woff'),
         url('fonts/franchise-bold-webfont.ttf') format('truetype'),
         url('fonts/franchise-bold-webfont.svg#FranchiseRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@media (max-width: 512) {
  .modal-content { width: 80%; }
}