html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  color: white;
  background-color: black;
}

.navbar {
  background: black;
  min-height: 70px;
  border-radius: 0px;
}
.navbar-brand{color:#fff;font-size:29px;font-weight:bold;padding:5px 15px 0 0;line-height:70px}
.navbar-inverse .navbar-text{color: white; font-size: 30px;padding-left: 15px;padding-right:15px}

@media (min-width: 768px) {
    div[dir=rtl] .navbar-header { float: right; }
}

header p {
    padding-left: 4.5em;
    padding-right: 4.5em;
    margin-bottom: 2.5em;
    color: #6F777B;
    font-family: Arial,sans-serif;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 300;
    text-transform: none;
}

header.question-one p {
    padding-left: 0px;
}

.visuallyhidden {
    position: absolute;
    left: -9999em;
}
a.back-to-previous, a.back-to-previous:active, a.back-to-previous:hover, a.back-to-previous:focus {
  color: #0B0C0C;
  text-decoration: none;
  box-sizing: content-box;
}
form .back-to-previous {
    position: absolute;
    margin: 0px;
}
.back-to-previous {
    font-family: Arial,sans-serif;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 300;
    text-transform: none;
    padding-right: 0.1em;
    display: block;
    position: static;
    text-decoration: none;
    border-bottom: 1px solid #0B0C0C;
    background: transparent url("icon-caret-left.png") no-repeat scroll left 0.2em;
    padding-left: 0.75em;
    text-align: right;
    margin: 2em 0px 0px 2em;
    overflow: hidden;
}

div[dir=rtl] .back-to-previous {
    background: transparent url("icon-caret-right.png") no-repeat scroll right 0.2em;
    padding-right: 0.75em;
}

body {
  color: #0B0C0C;
  font-size: 160%;
  line-height: 1.5;
  font-weight: normal;
}

html, body, button, input, table, td, th {
  font-family: Arial,sans-serif;
  font-weight: normal;
}

.qtext {
  font-family: Arial,sans-serif;
  font-size: 24px;
  line-height: 1.11111;
  text-transform: none;
  font-weight: 700;
  margin-top: 1.2em;
  padding-bottom: 1em;
}

fieldset {
    margin-left: 0px;
    border: medium none;
    padding: 0px;
}

p, a.paragraph {
    margin: 0px 0px 1em;
    clear: both;
}
p, ol, ul, li {
    font-family: Arial,sans-serif;
    font-size: 19px;
    line-height: 1.31579;
    font-weight: normal;
    text-transform: none;
}

/* TESTING:
label.selectable:hover {
  background-color: #00c98F;
}
*/

textarea { width: 100%; }

label.selectable {
    display: block;
    position: relative;
    background: #F0F0F0 none repeat scroll 0% 0%;
    padding: 12px 14px 12px 46px;
    margin: 0px 0px 1em;
    overflow: hidden;
    cursor: pointer;
}

label.selected {
    border: 1px solid #555;
    background: #FFF none repeat scroll 0% 0%;
    padding: 11px 13px 11px 45px;
}

div[dir=rtl] label.selectable,
div[dir=rtl] label.selected   { padding-right: 48px; }


label {
    margin-bottom: 0.5em;
}
label, textarea, .search, .next {
    display: block;
}
label, .label, select, input, textarea {
    font-family: Arial,sans-serif;
    font-size: 19px;
    line-height: 1.31579;
    font-weight: normal;
    text-transform: none;
}

label.selectable input {
    margin-bottom: 10px;
}

label.selectable input {
    position: absolute;
    left: 14px;
    top: 0.65em;
    margin-right: 10px;
}

div[dir=rtl] label.selectable input {
    left: 0px;
    right: 14px;
}

input.next-btn:hover, 
input.next-btn:focus {
  color: #FFF;
  background: #00692F none repeat scroll 0% 0%;
}


.next-btn {
    font-family: Arial,sans-serif;
    font-size: 19px;
    line-height: 1.31579;
    font-weight: normal;
    text-transform: none;
    padding: 0.6em 0.8em 0.5em;

box-sizing: border-box;
text-align: center;
clear: both;
margin: 2em 0px;

}

input.back-btn {
  border: none;
  background-color: none;
}
input.next-btn:active{
	top:2px;
	-webkit-box-shadow:0 0 0 #00823b;
	-moz-box-shadow:0 0 0 #00823b;
	box-shadow:0 0 0 #00823b
}

input.next-btn {
    line-height: 1.31579;
    font-weight: normal;
    background-color: #00823B;
    position: relative;
    border: medium none;
    border-radius: 0px;
    box-shadow: 0px 2px 0px #003518;
    font-size: 1.2em;
    line-height: 25px;
    margin-left: 0.8em;
    margin-right: 0.8em;
    margin-top: 38px;
    margin-bottom: 38px;
    text-decoration: none;
    cursor: pointer;
    color: #FFF;
    padding: 0.6em 0.8em 0.5em
}

.qnotes {
  font-size: 19px;
  font-weight: normal;
  margin: 0px 0px 1em;
  clear: both;
}

.qendnotes {
  border-left: 4px solid #BFC1C3;
  padding: 14px 0px 14px 14px;
  margin-bottom: 1em;
  margin-top: 1em;
  clear: both;
  font-size: 19px;
  font-weight: normal;
}

div.qbody-error {
  border-left: 5px solid red;
  padding-left: 15px;
  margin-left: -15px;
}

div.qerror {
  border-left: 5px solid red;
  padding-left: 15px;
  margin-left: -15px;
  font-weight: bold;
  font-size: 1.4em;
  color: #DF3034;
  margin-bottom: 20px;
}

div[dir=rtl] div.qerror,
div[dir=rtl] div.qbody-error {
  border-left: 0px;
  border-right: 5px solid red;
  padding-right: 15px;
  margin-right: -15px;
}

div.perror {
  display: none;
}

label+fieldset fieldset {
  margin-left: 15px;
  padding-left: 15px;
  border-left: 4px solid #BFC1C3;
}

legend {
  border: none;
  margin-top: 14px;
  margin-bottom: 0px;
}

label+fieldset fieldset legend {
  margin-left: -19px;
  padding-left: 15px;
  border-left: 4px solid #BFC1C3;
}

fieldset {
  margin-bottom: 14px;
}

fieldset fieldset .qtext { font-weight: normal; font-size: 1.4em;}

/* Remove controls from Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/* Remove controls from Safari and Chrome */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none;
  margin: 0; /* Removes leftover margin */
}

.field-wrapper { display: inline-block; padding-right: 0.8em; }

span.day input,
span.month input {
    width: 2.75em;
}
span.year input {
    width: 4.25em;
}

input[type=number] {
  border: 1px solid #BBB;
  margin: 0px 0px 1em;
  padding: 0.5em;
}

select {
  font-size : 20px;
  margin-left: 8px;
}

/* Rules for large screens (i.e. display as grid) */
@media only screen and (min-width: 768px) {
  .grid-content select { margin-top: 8px; }
  .grid-content .qtext { display: none; }
  .grid-content label.selectable,
  .grid-content label.label-for-select { padding-left: 0px; font-size: 0px; min-height: 48px; text-align: center; }
  .grid-content label.selectable  input { left: auto; font-size: 12px; margin-top: 11px;}

  .grid-header div  { text-align: center; font-size: 20px; min-height: 1px; }
  .grid-row-heading legend { margin-top: 0px; font-size: 20px; }

  .grid-row-heading, .grid-content  { float: left; padding-left: 1%; padding-right: 1%; }

  div[dir=rtl] .grid-row-heading { float: right; }

  .grid-2cols .grid-row-heading { width: 67%;}
  .grid-2cols .grid-content { width: 33%;}
  .grid-3cols .grid-row-heading { width: 50%;}
  .grid-3cols .grid-content { width: 25%;}
  .grid-4cols .grid-row-heading { width: 40%;}
  .grid-4cols .grid-content { width: 20%;}
  .grid-4cols .grid-content.grid-span-2 { width: 40%;}
  .grid-4cols .grid-content.grid-span-3 { width: 60%;}
  .grid-5cols .grid-row-heading { width: 32%;}
  .grid-5cols .grid-content { width: 17%;}
  .grid-5cols .grid-content.grid-span-2 { width: 34%;}
  .grid-5cols .grid-content.grid-span-3 { width: 51%;}
  .grid-5cols .grid-content.grid-span-4 { width: 68%;}
  .grid-6cols .grid-row-heading { width: 30%;}
  .grid-6cols .grid-content { width: 14%;}
  .grid-6cols .grid-content.grid-span-2 { width: 28%;}
  .grid-6cols .grid-content.grid-span-3 { width: 42%;}
  .grid-6cols .grid-content.grid-span-4 { width: 56%;}
  .grid-6cols .grid-content.grid-span-5 { width: 70%;}
  .grid-7cols .grid-row-heading { width: 28%;}
  .grid-7cols .grid-content { width: 12%;}
  .grid-7cols .grid-content.grid-span-2 { width: 24%;}
  .grid-7cols .grid-content.grid-span-3 { width: 36%;}
  .grid-7cols .grid-content.grid-span-4 { width: 48%;}
  .grid-7cols .grid-content.grid-span-5 { width: 60%;}
  .grid-7cols .grid-content.grid-span-6 { width: 72%;}
  .grid-8cols .grid-row-heading { width: 27%;}
  .grid-8cols .grid-content { width: 9%;}
  .grid-8cols .grid-content.grid-span-2 { width: 18%;}
  .grid-8cols .grid-content.grid-span-3 { width: 27%;}
  .grid-8cols .grid-content.grid-span-4 { width: 36%;}
  .grid-8cols .grid-content.grid-span-5 { width: 45%;}
  .grid-8cols .grid-content.grid-span-6 { width: 54%;}
  .grid-8cols .grid-content.grid-span-7 { width: 63%;}
  .grid-9cols .grid-row-heading { width: 20%;}
  .grid-9cols .grid-content { width: 10%;}
  .grid-9cols .grid-content.grid-span-2 { width: 20%;}
  .grid-9cols .grid-content.grid-span-3 { width: 30%;}
  .grid-9cols .grid-content.grid-span-4 { width: 40%;}
  .grid-9cols .grid-content.grid-span-5 { width: 50%;}
  .grid-9cols .grid-content.grid-span-6 { width: 60%;}
  .grid-9cols .grid-content.grid-span-7 { width: 70%;}
  .grid-9cols .grid-content.grid-span-8 { width: 80%;}
  .grid-10cols .grid-row-heading { width: 19%;}
  .grid-10cols .grid-content { width: 9%;}
  .grid-10cols .grid-content.grid-span-2 { width: 18%;}
  .grid-10cols .grid-content.grid-span-3 { width: 27%;}
  .grid-10cols .grid-content.grid-span-4 { width: 36%;}
  .grid-10cols .grid-content.grid-span-5 { width: 45%;}
  .grid-10cols .grid-content.grid-span-6 { width: 54%;}
  .grid-10cols .grid-content.grid-span-7 { width: 63%;}
  .grid-10cols .grid-content.grid-span-8 { width: 72%;}
  .grid-10cols .grid-content.grid-span-9 { width: 81%;}
  .grid-11cols .grid-row-heading { width: 20%;}
  .grid-11cols .grid-content { width: 8%;}
  .grid-11cols .grid-content.grid-span-2 { width: 16%;}
  .grid-11cols .grid-content.grid-span-3 { width: 24%;}
  .grid-11cols .grid-content.grid-span-4 { width: 32%;}
  .grid-11cols .grid-content.grid-span-5 { width: 40%;}
  .grid-11cols .grid-content.grid-span-6 { width: 48%;}
  .grid-11cols .grid-content.grid-span-7 { width: 56%;}
  .grid-11cols .grid-content.grid-span-8 { width: 64%;}
  .grid-11cols .grid-content.grid-span-9 { width: 72%;}
  .grid-11cols .grid-content.grid-span-10 { width: 80%;}
  .grid-12cols .grid-row-heading { width: 23%;}
  .grid-12cols .grid-content { width: 7%;}
  .grid-12cols .grid-content.grid-span-2 { width: 14%;}
  .grid-12cols .grid-content.grid-span-3 { width: 21%;}
  .grid-12cols .grid-content.grid-span-4 { width: 28%;}
  .grid-12cols .grid-content.grid-span-5 { width: 35%;}
  .grid-12cols .grid-content.grid-span-6 { width: 42%;}
  .grid-12cols .grid-content.grid-span-7 { width: 49%;}
  .grid-12cols .grid-content.grid-span-8 { width: 56%;}
  .grid-12cols .grid-content.grid-span-9 { width: 63%;}
  .grid-12cols .grid-content.grid-span-10 { width: 70%;}
  .grid-12cols .grid-content.grid-span-11 { width: 77%;}
}

/* Rules for small screens (i.e. display as individual questions) */
@media only screen and (max-width: 767px) {
  .grid-header { display: none; }
  .grid-row-heading legend { margin-bottom: 14px; font-weight: bold; font-size: 26px; }
  .grid-row-heading, .grid-content { padding-left: 15px; padding-right: 15px; }
}
