/*** Smart Phone ***/

/* 
========================
  GRIDINATOR CSS v0.3
  http://gridinator.com/
  
  GRIDINATOR CSS is a very basic framework to create
  grid-based layouts. The content of this file is 
  provided as-is, without support.
  
  If you would like to contact GRIDINATOR to suggest
  improvements, to ask for help or to file a bug report, 
  please feel free to email: 
  
  Your grid settings:
  	columns: 16
  	column width: 50px
  	column margin: 10px
  	container margin: 10px
    
=========================
*/
* { /* quick reset */
	margin: 0;	
}

body { 
	font-size: 16px;
	margin: 0;
	padding: 0;
	text-align: center;
	min-width: 100%;
	max-width: 100%;	
}


/*** Smart Phone Specific Page Styling ***/

#header {
  width: 100%;

  background: #870101; /* Old browsers */
  background: -moz-linear-gradient(top,  #a90329 0%, #8f0222 44%, #6d0019 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(44%,#870101), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #a90329 0%,#8f0222 44%,#870101 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #a90329 0%,#8f0222 44%,#870101 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #a90329 0%,#8f0222 44%,#870101 100%); /* IE10+ */
  background: linear-gradient(top,  #a90329 0%,#8f0222 44%,#870101 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#870101',GradientType=0 ); /* IE6-9 */

  border-bottom: 2px solid #ccc;
  position: relative;
  height: auto;
  padding: 0; 
  margin: 0;
}

.title {height: auto;}

#header h1 span {background-image: none; height: auto; padding: 0; margin: 0;}

h2.application-name {font-size: 14px; margin: .25em 0 0 0; padding: 0; position: inherit; left: 10px; text-shadow: 0 0 1px rgba(0,0,0,.8); color: #fff;}
h2.organization-name {font-size: 12px; padding: 0 0 1em 0; position: inherit; left: 10px; opacity: .9; margin: .25em 0 0 0; top: 0; color: #fff;}

#footer {padding: 0; margin: 0; height: auto; max-width: 100%;}

.wrapper, #footerwrapper {
	margin: 0 auto; 
	text-align: left;
	width: 100%;
}

.inner-wrapper, .footercontent {margin: 0 auto; width: 100%; padding: 0; max-width: 100%; }

#wrapper .inner-wrapper  ul li input,
#wrapper .inner-wrapper  ul li textarea {width: 70%; }

a.button.primary, input.button[type="submit"], .actions button.positive, #wrapper .actions a.positive { 
  clear: both;
  display: block;
  width: 100%;
  font-weight: bold;
  padding: 1em 0;
  -webkit-border-radius: .75em;
  -moz-border-radius: .75em;
  border-radius: .75em;
}

#wrapper a.button.secondary {
  clear: both;
  display: block;
  width: 100%;
  margin: 0; 
  padding: 1em 0;
    -webkit-border-radius: .75em;
  -moz-border-radius: .75em;
  border-radius: .75em;
  margin-top: 1.4em;
  color: #333;
  font-weight: bold;
}


#wrapper .inner-wrapper  ol li.inline {margin-bottom: .5em;}

#wrapper .inner-wrapper  ol li.inline input[type="checkbox"],
#wrapper .inner-wrapper  ol li.inline input[type="radio"] {
  width: auto; 
  border: none; 
  padding: 0 0 1em 0; 
  margin: 0 1em 0 0;   
  vertical-align: top; 
  font-size: 1.1em; 
  background: #fff; 
  border: 1px solid #444;
}

  
 #wrapper select {display: block; width: 90%; font-size: 1em;}
  
#wrapper .inner-wrapper  ol li.inline label {display: inline-block; line-height: 1em; font-size: 1em; line-height: 1.3em; margin: 0; padding: 0;  }
  
/*** End Smart Phone Page Styling ***/

.inner-wrapper {
	clear: both;
	display: inline;/* IE double margin fix. Feel free to move this to your IE specific stylesheets. */
	float: left;
	padding: 0;
	position: relative;
	margin: 0;
}

.container {
	clear: both;
	float: left;
	margin: 0;
	width: 100%;	
}

.one-col, .two-col, .three-col, .four-col, .five-col, .six-col, .seven-col, .eight-col, .nine-col, .ten-col, .eleven-col, .twelve-col, .thirteen-col, .fourteen-col, .fifteen-col, .sixteen-col {
	background:none;
	clear: none;
	display: inline;
	float: none;
	margin-bottom: 10px;
	margin-right:1.05264%;
	overflow:hidden;
	padding: 0;
	margin: 0;
	width: 95%;
	position: relative;
}

 .sixteen-col .last-col {
	margin-right: 0;
}
.fifteen-col .last-col {
	margin-right: 0;
}
.fourteen-col .last-col {
	margin-right: 0;
}
.thirteen-col .last-col {
	margin-right: 0;
}
.twelve-col .last-col {
	margin-right: 0;
}
.eleven-col .last-col {
	margin-right: 0;
}
.ten-col .last-col {
	margin-right: 0;
}
.nine-col .last-col {
	margin-right: 0;
}
.eight-col .last-col {
	margin-right: 0;
}
.seven-col .last-col {
	margin-right: 0;
}
.six-col .last-col {
	margin-right: 0;
}
.five-col .last-col {
	margin-right: 0;
}
.four-col .last-col {
	margin-right: 0;
}
.three-col .last-col {
	margin-right: 0;
}
.two-col .last-col {
	margin-right: 0;
}
.one-col .last-col {
	margin-right: 0;
}
.clear { /* Useful generic clearing class. */
	clear: both;
}
.last-col {
	margin-right: 0;
}


.footercontent {margin: 0 .75em; width: 80%; height: auto; padding: 1em 0 2em 0 ; background: none;}

#wrapper {padding: 0; margin: 0;}

#header .topnavigation {text-align: left;}

.topnavigation ul {width: 100%; margin: 0 auto; padding: 0; border-top: 2px solid #ccc;}
.topnavigation ul li {display: block; padding: 0; margin: 0;}

#header .topnavigation ul li a {
	-webkit-transition: all .15s ease-in-out; 
	-moz-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out; 
	padding: .5em 1em; 
	display: block; 
	text-decoration: none; 	
  background: #eee;
  border-bottom: 1px solid #999;
}

#header .topnavigation ul li.current a {
  background: #BD1E2D; 
  color: #fff; 
  color: rgba(255,255,255,.9); 
  text-shadow: 0 -1px 0 rgba(0,0,0,.3);
  background: #971E2D; /* old browsers */
  background: -moz-linear-gradient(top, #C43442 0%, #971E2D 100%); /* firefox */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#C43442), color-stop(100%,#971E2D)); /* webkit */
}

#header .accountwidget a {font-size: .9em;}

#header .topnavigation ul li.current a:visited {color: #fff;}

#header .topnavigation ul li a:visited {color: #444;}

#header {overflow: hidden;}

.title h2 a {display: block; }

#wrapper .inner-wrapper {padding: 1em 2% 1em 2%; width: 96%;}


/*** Back to Button Styles ***/

a.navigation {
  background: #eee; 
  padding: .75em;
  border: 1px solid #ccc;
  font-size: .8em;
  border-radius: .35em;
  display: inline-block;
  text-decoration: none;
  position: relative;
  left: 0em;
  margin-top: 1em;
  -webkit-box-shadow: none;
}

#wrapper .featurebox a {margin: 0; display: block; clear: both;}

.message {width: 88%; height: auto; line-height: 1.4em;}

#footer dl {
  display: block; 
  float: none;
  width: 100%;
  margin-bottom: 3em;
}

#wrapper .inner-wrapper ol li.inline ul li label { margin: 0; padding: 0 0 1em 0; display: block; float: right;  width: 90%; border-bottom: 1px solid #ccc;}

#wrapper a.button.alternate, #wrapper input.button.alternate[type="submit"] {width: auto; padding: .5em 2em; display: block; margin: 1em 0;}

#wrapper .help-box {background: rgba(163,160,146, .2); color: #3F3831; margin: 0 auto 1em auto; padding: .25em 0; display: block; width: 92%; border-radius: .3em; float: none;}

#wrapper .inner-wrapper .actions {clear: both; margin: 2em 0;}

#wrapper .inner-wrapper ul.progress li, #wrapper .inner-wrapper ol.progress li {margin: .2em; font-size: .85em; -webkit-border-radius: 0; border-radius: 0;}

#wrapper .inner-wrapper fieldset ol li label {position: relative;}

#wrapper .inner-wrapper fieldset ol li label span {margin: 0; padding: 0; right: 8.5%; display: block; margin-right: 10%; float: none;}

#wrapper .inner-wrapper ol li input[type="text"],
#wrapper .inner-wrapper ol li textarea {width: 90%;}

ul.progress li.current, ol.progress li.current {background: #870101 url(../img/selected.png) 50% 180% no-repeat; color: #fff; }

#wrapper .errorSummary {background: #fff; border: 1px solid #870101; margin: 1em 0; padding: 1em; color: #fff; width: 90%; text-align: center; -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3); }

#wrapper .errorMessage {display: block; font-size: .9em;  margin: .1em 1%;  width: 90%; padding: .5em 0; border-bottom: 2px solid #fff; text-shadow: 0 1px 0 rgba(255,255,255,.9); }