@charset "utf-8";
/* $Id: framework.css,v 1.10 2009/11/02 17:42:27 epiphany Exp $ */


html, body {
	margin: 0;
  height: 100%;
  width: 100%;
  max-width: 100%;
  font-family: 'Hind', sans-serif;
  font-size: 100%;
  color: #343434;
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

h1 {
  color: #0e0e0e;
  margin-top: 0px;
}

h2 {
  color: #0e0e0e;
  margin-top: 0px;
}

h3 {
  color: #0e0e0e;
  margin-top: 0px;
}

a {
  color: inherit;
  cursor: pointer;
}

input, select, option, textarea {
  background-color: #FFFFF8;
  border-radius: 5px;
}

input {
  padding: 3px 5px;
  border-width: 1px;
}

fieldset {
  padding: 10px;
  margin-bottom: 20px;
}

fieldset legend {
  font-weight: 500;
}

.noMargin {
  margin: 0px;
}

.topMargin {
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
}

.bottomMargin {
  margin-top: 0px;
  margin-right: 0px;
  margin-left: 0px;
}

.margin10T {
  margin-top: 10px;
}

.margin10R {
  margin-right: 10px;
}

.margin10B {
  margin-bottom: 10px;
}

.margin10L {
  margin-left: 10px;
}

.margin20T {
  margin-top: 20px;
}

.margin20R {
  margin-right: 20px;
}

.margin20B {
  margin-bottom: 20px;
}

.margin20L {
  margin-left: 20px;
}

.smallTxt {
  font-size: small;
}

.largeTxt {
  font-size: large;
}

.xLargeTxt {
  font-size: x-large;
}

.xxLargeTxt {
  font-size: xx-large;
}

.xxxLargeTxt {
  font-size: xxx-large;
}

.height100 {
  height: 100px;
}

.hidden {
  display: none;
}

.alignLeft {
  text-align: left;
}

.alignRight {
  text-align: right;
}

.alignCenter {
  text-align: center;
}

.fleft {
  float: left;
}

.fright {
  float: right;
}

.vtop {
  vertical-align: top;
}

.vmiddle {
  vertical-align: middle;
}

.vbottom {
  vertical-align: bottom;
}

.inline {
  display: inline;
}

.helpertxt {
  font-size: smaller;
  font-style: italic;
}

.whitetxt {
  color: #FFF;
}

.redtxt {
  color: #F00;
}

.darkredtxt {
  color: #900;
}

.yellowtxt {
  color: #DD0;
}

.greentxt {
  color: #090;
}

.req {
  color: #F00;
  font-weight: bold;
}

.bold {
  font-weight: bold;
}

.italic {
  font-style: italic;
}

.underline {
  text-decoration: underline;
}

.minW100 {
  min-width: 100px;
}

.minW200 {
  min-width: 200px;
}

.minW300 {
  min-width: 300px;
}

.minW400 {
  min-width: 400px;
}

.minW500 {
  min-width: 500px;
}

.minWFull {
  min-width: 100%;
}

.minH100 {
  min-height: 100px;
}

.minH200 {
  min-height: 200px;
}

.minH300 {
  min-height: 300px;
}

.minH400 {
  min-height: 400px;
}

.minH500 {
  min-height: 500px;
}

.maxW100 {
  max-width: 100px;
}

.maxW200 {
  max-width: 200px;
}

.maxW300 {
  max-width: 300px;
}

.maxW400 {
  max-width: 400px;
}

.maxW500 {
  max-width: 500px;
}

.maxW600 {
  max-width: 600px;
}

.maxW700 {
  max-width: 700px;
}

.maxH100 {
  max-height: 100px;
}

.maxH200 {
  max-height: 200px;
}

.maxH300 {
  max-height: 300px;
}

.maxH400 {
  max-height: 400px;
}

.maxH500 {
  max-height: 500px;
}

.container {
  padding: 20px;
  background-color: #FFF;
}

.padding10 {
  padding: 10px;
}

.container-flex_rows {
  display: flex;
  flex-flow: row wrap;
}

.container-flex_columns {
  display: flex;
  flex-flow: column wrap;
}

.flexRow {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}

.flexColumn {
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
}

.nowrap {
  flex-wrap: nowrap;
}

.fg2 {
  flex-grow: 2;
}

.fg3 {
  flex-grow: 3;
}

.flexAlignCenter {
  align-items: center;
}

.flexJustifyCenter {
  justify-content: center;
}

/* Universal Classes to show/hide responsive content
----------------------------------------------------------------------------------------------------*/

/* Mobile Screen ----------- */
@media screen and (max-width: 479px) {
  .mobile_content {
    display: block;
  }
  .nonmobile_content {
    display: none;
  }
}

/* Desktops and laptops ----------- */
@media screen and (min-width: 480px) {
  .mobile_content {
    display: none;
  }

  .nonmobile_content {
    display: block;
  }
}


/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
  flex-basis: 100%;
}

/* http://perishablepress.com/press/2009/12/06/new-clearfix-hack */
.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
  flex-basis: 100%;
}
