/* app css stylesheet */

.menu {
  list-style: none;
  border-bottom: 0.1em solid black;
  margin-bottom: 2em;
  padding: 0 0 0.5em;
}

.menu:before {
  content: "[";
}

.menu:after {
  content: "]";
}

.menu > li {
  display: inline;
}

.menu > li + li:before {
  content: "|";
  padding-right: 0.3em;
}

.main-card {
  display: block;
  width: 100%;
  height: 100%;
  padding: 50px;
  padding-top:0px;
  border-width: 1px;
  box-shadow: 0 10px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
}

.question-container {
  display:block;
  padding-top: 40px;
  padding-bottom: 10px;
  /*margin-bottom: 10px;*/
  /*border: solid;*/
  /*border-width: 1px;*/
}

.navbar {
  overflow: hidden;
  background-color: #333;
  position: fixed; /* Set the navbar to fixed position */
  top: 0; /* Position the navbar at the top of the page */
  width: 100%; /* Full width */
}

.nav-container {
  display:block;
  width: 100%;
}

.navbar-li:hover::after {
  width: 100%;
}

.navbar-li::after {
  /*background-color: red;*/
  /*content: "";*/
  /*width: 0;*/
  /*height: 3px;*/
  /*left: 0;*/
  /*bottom: 0;*/
  /*transition: width 0.35s ease 0s;*/
  /*position: absolute;*/
}
li.active{
  border-bottom: 3px solid red;
  color:red;
  padding-bottom:1px;
}

.question-option {
  margin-left: 10px;
}

.add-button {
  padding-left:0px;
  color: #31708f;
  padding-top: 30px;
  border-bottom-style: solid;
}

.nav.navbar-nav {
  display: flex !important;
  justify-content: center!important;
  flex-wrap: wrap!important;
}
@media (min-width: 768px) {
  .navbar-nav {
    float: none!important;
  }
}

.result-btn {
  width: 80px;
  margin-right: 5px;
}

.btn-wrapper {
  /*text-align: center;*/
}

.result-grp {
  padding-bottom: 10px;
  /*margin-left: -30px !important;*/
}

.result-container {
  margin-top: 50px;
}

.btn-input-wrapper {
  padding: 10px;
  padding-top: 20px;
  margin-top: 30px;
}

.number-display {
  text-align: right;
}

.export-row {
  margin-top: 10px;
}

.datepicker-input {
  width: 80px;
 font-size: 10px !important;
}

.navbar-inverse {
  background-color: #fff !important;
  border-color: #fff !important;
  background-color: #7DB65F !important;
  width: 100%;
}

/* Modal style */
.modal-header {
  background-color: #7DB65F;
  border-color: #7DB65F;
  padding:16px 16px;
  color:#FFF;
  border-bottom:2px dashed #7DB65F;
}

.header-main {
  margin-bottom: 0px!important;
  color: #ffffff;
}

.thead-dark {
  background: #337ab7;
  color: white;
}

.results-dgr {
  margin-top: -20px;
}

.table-class {
  border-style: solid;
  border-width: 1px;
  border-color: #ddd;
}

.question-number {
  background: #7DB65F;
  height: 30px;
  text-align: center;
  box-shadow: 0 5px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  line-height: 30px;
  margin-bottom:30px;
  color:#FFF;
}

.empty-row {
  display:block;
}

.question-description{
  /*border-style: solid;*/
  border-width: .5px;
  margin-bottom: 20px;
  background: #eff0f1;
  padding-top: 10px;
  padding-bottom: 10px;
  border-color: #b7b8c0;
}

.radio-option {
  position: absolute;
  opacity: 0;
}

.label-radio {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.radio-button-custom {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eff0f1;
  border-radius: 50%;
  border-style: solid;
  border-width:1px;
  border-color: #b7b8c0;
}

.label-radio:hover input ~ .radio-button-custom {
  background-color: #ccc;
}
.label-radio input:checked ~ .radio-button-custom {
  background-color: #7DB65F;
}

.radio-button-custom:after {
  content: "";
  position: absolute;
  display: none;
}
.label-radio input:checked ~ .radio-button-custom:after {
  display: block;
}
.label-radio .radio-button-custom:after {
  top: -1px;
  left: 1px;
  width: 8px;
  height: 8px;
  content: "\f00c";
  font-family: 'FontAwesome';
  color: #fff;
}

.option-desc {
  margin-left: 40px;
  margin-top: -10px;
}

.taker-details {
  padding-top: 40px;
}

/*#gender-select, #age-select {*/
  /*width: 200px;*/
/*}*/

.details-question-border {
  /*border-top: 2px;*/
  /*border-style: solid;*/
  /*border-bottom : none;*/
  /*border-right: none;*/
  /*border-left: none;*/
  /*border-color: red;*/
}

.fa { transform: scale(2,2); margin-right: 10px;}

.selectWidth {
  width: 100%!important;
}

.publish-error {
  padding-top: 50px;
}

/*switch style*/
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

.publish-toggle-container {
  padding-top: 40px;
}

.loading-overlay {
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-x: hidden;
  transition: 0.5s;
}

.submit-loader-content {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.icon-bar {
  /*width: 50%;*/
  /*background-color: #7DB65F;*/
  /*overflow: auto;*/
  /*height: 100px  ;*/
}

.icon-bar a {
  /*float: right;*/
  /*width: 6%;*/
  /*text-align: center;*/
  /*padding: 35px 0;*/
  transition: all 0.3s ease;
  color: white;
  font-size: 20px;
}

.icon-bar {
  list-style-type: none;
  margin-top: 24px!important;
  padding: 0;
  overflow: hidden;
  background-color: #7DB65F;
}

.icon-bar li {
  float: left;
}

.icon-bar li a {
  display: block;
  color: white;
  text-align: center;
  padding: 16px;
  text-decoration: none;
}

.icon-bar a:hover {
  color: #b65f7d;
}

.social-media-icons {
  list-style-type: none;
}

.green-radio input:checked ~ .radio-button-custom {
  background-color: #7DB65F;
}

.red-radio input:checked ~ .radio-button-custom {
  background-color: darkred;
}

#scoreModal {
  /*height: 800px;*/
  /*width: 700px;*/
  /*padding-right: 19px;*/
  /*left: 25%;*/
}

.red-radio .radio-button-custom:after {
  top: -3.5px;
  left: 2.5px;
  width: 8px;
  height: 8px;
  content: "\f00d";
  font-family: 'FontAwesome';
  color: #fff;
}

.fb-share-button {
  text-align: center;
}

.emoticon {
  color: #CB3837;
  font-size: 500%!important;
}

.scorecard-content {
  border-style: none !important;
  border-color: #FFFFFF;
  background-color: #ffffff;
}

.emoticon-div {
  text-align: center;
}

.score-container {
  color: white;
  text-align: center;
  background-color: darkgrey;
  font-size: 40px;
  top: 15px;
}

.emoticon-container {
  margin-bottom: 5px;
  margin-top: 10px;
}

.close-button:hover {
  color: #665E5F!important;
  font-size: 24px;
  color: #b2aeaf;
}

.result-header {
  padding-top: 5px;
  padding-bottom: 5px;
  background-color:#7DB65F;
  text-align:left;
  font-family: "Arvo";
  color: #FFFFFF;
  font-size:20px;
  text-align: center;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.close-button {
  position: absolute;
  top: -22px;
  right: -12px;
}

.score-modal-header {
  background: none;
  border-style: none;
}

.circle-score {
  border-radius: 50%;
  width: 200px!important;
    height: 200px!important;
    border-style:solid;
  text-align: center;
}

.percent-container {
    /*background-image: url('../assets/images/wallet.png');*/
    /*!*!*background-size:100%;*!*!*/
    /*background-repeat: no-repeat;*/
  /*background-size:250px 250px;*/
  /*background-position-x: 50%;*/
  /*background-position-y: -10%;*/
  /*!*position:relative;*!*/
  /*background-color: white;*/
}

.profile-pic {
  /*background-color: #b65f7d;*/
  padding-top:20px;
}

.row-centered {
  text-align: center;
}

.fq-score {
  background-color: #7DB65F;
  box-shadow: 0 5px 8px 0 rgba(0,0,0,0.2), 0 3px 10px 0 rgba(0,0,0,.19);
  color: white;
}

.fq-score-container {
  margin-bottom:30px;
  margin-left: 0px;
  margin-right: 0px;
}

.errorMessage {
  color: #a94442;
  margin-top:10px;
}

.share-message {
  text-align: center;
}

.email-container {
  margin-top: 20px;
/*  margin-bottom: 20px;*/
}

.share-modal-container {
  background-color: #7DB65F;
  color: #fff;
}

.scorecard-content {
  border-bottom-left-radius: 1px;
  border-bottom-right-radius: 1px;
}

.share-box {position: relative;float:left;}

#toast-container {
  /*z-index: 999999;*/
  /*position: absolute;*/
}