﻿.add_padding {
  padding: 10px 16px !important;
}

.center {
  text-align: center;
}

#displayError {
	display: block;
	width: 99%;
	position: relative;
	margin: 10px auto;
	border: 1px solid #8CB1D1;
	background-color: #FFC;
	overflow: hidden;
}
#displayError .error-image {
	float: left;
	margin: 0px 10px 0px 0px;
}

.mobile-nav-button {
  background: transparent url("./phone_nav.png") no-repeat scroll 0px 0px;
  width: 47px;
  height: 41px;
  cursor: pointer;
}

#MobileHeader,
#MobileFooter {
	display: none;
}

div.rows-container {
	padding: 0px 16px;
}
div.row {
  display: block;
  margin-bottom: 15px;
}

div.cell {
  display: inline-block;
  vertical-align: middle;
  padding-bottom: 1px;
  *display: inline;
  zoom: 1;
}

div.cell.label {
  width: 16%;
  text-align: right;
  margin-right: 5px;
}
div.cell.field.short {
  width: 25%;
  width: auto;
}
div.cell.field.long {
  width: 40%;
}
div.cell.text-description1 {
  width: 57%;
}
div.cell.caption {
  text-align: center;
  white-space: normal;
}


div.row.button {
  background: transparent;
  border: 0 none;
  text-align: center;
}
div.row.button.left {
  text-align: left;
}
div.row.button > div.cell input[type=button],
div.row.button > div.cell input[type=submit],
div.row.button > div.cell button {
  width: 100%;
  height: 100%;
  margin: 0px;
  padding: 0.7em 1em;
  border-radius: 1em;
  border: 1px solid #BBB;
  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.3);
  background: #FFF linear-gradient(#FAFAFA, #F6F6F6) repeat scroll 0% 0%;
  font-weight: bold;
  color: #333;
  text-shadow: 0px 1px 0px #FFF;
  cursor: pointer;
}
div.row.button > div.cell input[type=button]:hover,
div.row.button > div.cell input[type=submit]:hover,
div.row.button > div.cell button:hover {
  border-color: #AAAAAA;
  background: #FFF linear-gradient(#FAFAFA, #F6F6F6) repeat scroll 0% 0%;
}
div.row.button > div.cell input[type=button]:active,
div.row.button > div.cell input[type=submit]:active,
div.row.button > div.cell button:active {
  border-color: #AAAAAA;
  background: #EEE linear-gradient(#E5E5E5, #F2F2F2) repeat scroll 0% 0%;
  box-shadow: 0px 0px 12px #387BBE;
}

div.row.button > div.cell input[type=button].submit,
div.row.button > div.cell input[type=submit].submit,
div.row.button > div.cell button.submit {
  border-color: #044062;
  background: #396B9E;
  background: #396B9E linear-gradient(#5F9CC5, #396B9E) repeat scroll 0% 0%;
  color: #FFF;
  text-shadow: 0px 1px 1px #194B7E;
}
div.row.button > div.cell input[type=button].submit:hover,
div.row.button > div.cell input[type=submit].submit:hover,
div.row.button > div.cell button.submit:hover {
  border-color: #00415E;
  background: #4B88B6 linear-gradient(#6FACD5, #4272A4) repeat scroll 0% 0%;
}
div.row.button > div.cell input[type=button].submit:active,
div.row.button > div.cell input[type=submit].submit:active,
div.row.button > div.cell button.submit:active {
  border-color: #225377;
  background: #4E89C5 linear-gradient(#295B8E, #3E79B5) repeat scroll 0% 0%;
}

div.row.button > div.cell input[type=button].login,
div.row.button > div.cell input[type=submit].login,
div.row.button > div.cell button.login {
  border-color: #888;
  background: #E6E6E6;
  background: #E6E6E6 linear-gradient(#E6E6E6, #777777) repeat scroll 0% 0%;
  color: #333;
  text-shadow: none;
}
div.row.button > div.cell input[type=button].login:hover,
div.row.button > div.cell input[type=submit].login:hover,
div.row.button > div.cell button.login:hover {
  border-color: #7A7A7A;
  background: #4C4C4C linear-gradient(#CFCFCF, #6B6B6B) repeat scroll 0% 0%;
}
div.row.button > div.cell input[type=button].login:active,
div.row.button > div.cell input[type=submit].login:active,
div.row.button > div.cell button.login:active {
  border-color: #044062;
  background: #396B9E;
  background: #396B9E linear-gradient(#5F9CC5, #396B9E) repeat scroll 0% 0%;
}

.width-auto {
  width: auto !important;
}



@media screen and (max-width: 960px)  {
 
  /* General */
  html, body {
    overflow: hidden;
  }
  
  input,
  select {
    width: 100%;
  }
  
  .add_padding {
    padding: 0px !important;
  }
  
  /* Mobile Header */
  #MobileHeader {
    display: block;
	width: 100%;
	background: #013D5D;
	background: #013D5D linear-gradient(#005B8A, #013D5D) repeat scroll 0% 0%;
	margin-top: -3px;
  }
  #MobileHeader > div {
    display: inline-block;
    vertical-align: middle;
  }
  #MobileHeader > #MobileNavigation {
    display: block;
    max-height: 0px;
    overflow: hidden;
    transition: max-height 0.2s;
  }
  #MobileHeader > #MobileNavigation.visible {
    max-height: 200px;
  }
  
  #MobileNavigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  #MobileNavigation ul li {
    padding: 8px 0px;
    text-align: center;
    background: darkblue;
    color: white;
    font-weight: bold;
    font-size: 1.1em;
    border-top: 1px solid white;
  }
   #MobileNavigation ul li a {
    display: block;
    color: inherit;
  }
  
  /* Content */
  #main_content {
	position: fixed !important;
	width: 100% !important;
	height: 100% !important;
	z-index: 9999;
	top: 0px;
	left: 0px;
	background: white;
	overflow-y: auto;
	overflow-x: hidden;
  }
  
  div.cell,
  div.cell.label,
  div.cell.field,
  div.cell.field.short,
  div.cell.field.long,
  div.cell.text-description1 {
	display: block;
	width: 100%;
	text-align: left;
  }
  
  div.row.button > div.cell {
    display: block;
    width: 100%;
    margin: 7px 0px;
    text-align: center;
  }
  
  /* Mobile Footer */
  #MobileFooter {
    display: table;
	  width: 100%;
  }
  #MobileFooter > div {
    display: table-cell;
    vertical-align: middle;
  }
  
}   