body {

	background-color: #00aed7;

}

h1 {
  margin-bottom: 1.5em;
}


ul.thumbnails.image_picker_selector li .thumbnail.selected {
  background: inherit !important;
}

ul.thumbnails.image_picker_selector li .thumbnail.selected img {
  border: 3px solid #0098e4 !important;
  padding: .5em;
}

ul.thumbnails.image_picker_selector li .thumbnail img {
  transition: padding .3s;
}

ul.thumbnails.image_picker_selector li .thumbnail:hover img {
  padding: .5em; 
}

.hidden, .hidden-permanent {
  display: none;
}

.container {

	background: #FFF;
  padding: 1em !important;
  margin-bottom: 1em !important;
}

.logo {
  max-width: 350px;
  margin: 2em;
}

.blue-bold-label {
  /*font-weight: bold;*/
  color: #0099e5;
}

.form-group .form-control {

	display: inline-block;

}

table.recap {
  width: 100%;
}

table.recap tr td {
  padding: 1rem 0;
}

table.recap tr:not(:last-child) {
  border-bottom: 1px solid rgba(0,0,0,.1);
}

.price {
  font-weight: bold;
}

.price-value {
  font-size: 1.5em;
}

#main {

	margin-top: 3em;

}

.select-label {
  margin-top: 4.5em;
}


.image_picker_selector li {

	max-width: 40%;

}

.image_picker_selector li img {

  max-width: 10rem;
  text-align: center;

}

.image_picker_selector li .thumbnail {
  text-align: center;
	border: none !important;
}

.image_picker_selector li .thumbnail {
	border: 1px solid #dddddd;
}


.image_picker_image {

	width: 100%;

}

.image_picker_selector p {
	text-align: center;
}

/***************************************************/

/***************************************************/

/***************************************************/

/***************************************************/

/***************************************************/

/***************************************************/


input[type=range] {
  height: 25px;
  -webkit-appearance: none;
  margin: 10px 0;
  width: 100%;
}
input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000;
  background: #2497E3;
  border-radius: 1px;
  border: 0px solid #000000;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 0px 0px 0px #000000;
  border: 1px solid #2497E3;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background: #A1D0FF;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -7px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: #2497E3;
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000;
  background: #2497E3;
  border-radius: 1px;
  border: 0px solid #000000;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 0px 0px 0px #000000;
  border: 1px solid #2497E3;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background: #A1D0FF;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #2497E3;
  border: 0px solid #000000;
  border-radius: 2px;
  box-shadow: 0px 0px 0px #000000;
}
input[type=range]::-ms-fill-upper {
  background: #2497E3;
  border: 0px solid #000000;
  border-radius: 2px;
  box-shadow: 0px 0px 0px #000000;
}
input[type=range]::-ms-thumb {
  margin-top: 1px;
  box-shadow: 0px 0px 0px #000000;
  border: 1px solid #2497E3;
  height: 18px;
  width: 18px;
  border-radius: 25px;
  background: #A1D0FF;
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: #2497E3;
}
input[type=range]:focus::-ms-fill-upper {
  background: #2497E3;
}

.fa-check {
  padding: .5em;
  color: green;
  border-radius: 50%;
  line-height: 10px;
  display: none;
}

.fa-times {
  padding: .5em;
  color: red;
  border-radius: 50%;
  line-height: 10px;
  display: none;
}

.svg-inline--fa.fa-w-16 {
  width: 1em;
  display: none;
}

#code-error-message {
  display: none;
  color: red;
}

.error {
  color: red;
}

input.error {
  border-color: red;
  color: red;
}

.lds-dual-ring {
  display: inline-block;
  width: 64px;
  height: 64px;
  margin-left: 12em;
}
.lds-dual-ring:after {
  content: " ";
  display: block;
  width: 46px;
  height: 46px;
  margin: 1px;
  border-radius: 50%;
  border: 5px solid #00aed7;
  border-color: #00aed7 transparent #00aed7 transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}