﻿/* layout styles */
#l-header {
  height: 68px;
  background-color: #ffffff;
  border-bottom: 4px #cb1350 solid;
}
@media (max-width: 782px) and (min-width: 539px) {
    #l-header {
      width: 781px;
    }
}

@media (max-width: 768px) {
    #l-header {
      height: 100px;
    }
}

#l-main {
  display: table;
  margin: auto;
}

#l-sidenav {
  width: 181px;
  float: left;
  text-align: center;
  box-shadow: 2px 1px 2px rgba(0, 0, 0, 0.15);
  margin-bottom: 20px;
}
@media (max-width: 768px) {
  #l-sidenav {
    display: block;
  }
  .mbl-sidenav {max-height: 460px;overflow: auto; top: 233px; left: 45px; position: absolute;  width: 88.5% !important;}
  .panel.heading.title {display: none;}
}
@media (max-width: 660px) {
  .mbl-sidenav{left: 6%; top: 48.5%;}
  }

#l-container {
  max-width: 100%;
  min-width: 692px;
  display: inline-block;
  margin: 20px 0px;
  border-top: 8px solid #b93857;
  padding: 20px;
 -webkit-border-bottom-right-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-bottomleft: 8px;
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px;
}

#l-content {
  width: 734px;
  margin-left: 44px;
  float: left;
}
@media (max-width: 1034px) /* xl */ {
  #l-content {
    width: 638px;
  }
}
@media (max-width: 935px) /* l */ {
  #l-content {
    width: 596px;
  }
}
@media (max-width: 891px) /* m */ {
  #l-content {
    width: 547px;
  }
}

#l-sidenav, #l-content {
  margin-top: 14px;
  box-sizing: border-box;
}

#l-sidenav, #l-container {
  background-color: white;
}
.payment-gateway { margin: 0 0 10px;}
.payment-gateway > a {margin-right: 15px;}
#l-footer {
  height: auto;
  background-color: #ffffff;
  border-top: 4px #cb1350 solid;
  margin: 10px auto 0 auto;
  text-align: center;
  margin: 0 0px;
  line-height: 16px;
  font-size: 11px;
  color: #655546;
  padding: 15px 0;
}
}
@media (max-width: 782px) and (min-width: 539px) {
    #l-footer {
      width: 781px;
    }
}

@media (max-width: 768px) {
    #l-footer {
      height: 100px;
    }
}

@media (max-width: 768px) {
  #l-container, #l-content {
    width: 100%;
    margin-left: 0px;
  }
}

.l-fixed /* xl */ { 
  margin: auto;
}
@media (max-width: 1034px) /* l */ {
  .l-fixed {
    width: 863px;
  }
}
@media (max-width: 935px) /* m */ {
  .l-fixed {
    width: 821px;
  }
}
@media (max-width: 891px) /* s */ {
  .l-fixed {
    width:781px;
  }
}
@media (max-width: 768px) {
  l-fixed {
    width: 100%;
  }
}

.l-valign {
  display: table-cell;
  vertical-align: middle;
}

.l-halign {
  display: table-cell;
  text-align: center;
  }
