/* config
============================================================================= */
body #feature-multiaccounts {
  display: none;
}

body.extended #feature-multiaccounts {
  display: block;
}

/* helper classes
============================================================================= */
.text-bold { font-weight: 600; }

/* modified bootstrap styles
============================================================================= */
a {
  color: #6381A7;
}

a:hover,
a:active {
  color: #4e6889;
  text-decoration: none;
}

.btn-primary {
  color: #ffffff;
  background-color: #29486F;
  border-radius: 4px;
  border-color: #29486F;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:active:focus,
.btn-primary.active {
  color: #ffffff;
  background-color: #1b304a;
  border-color: #1b304a;
}

.btn-primary.disabled:hover,
.btn-primary.disabled:focus,
.btn-primary.disabled:active,
.btn-primary.disabled.active,
.btn-primary[disabled]:hover,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary:hover,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:active,
fieldset[disabled] .btn-primary.active {
  background-color: #29486F;
  border-color: #29486F;
}

.btn-primary.active.focus,
.btn-primary.active:focus,
.btn-primary.active:hover,
.btn-primary:active.focus,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open > .dropdown-toggle.btn-primary.focus,
.open > .dropdown-toggle.btn-primary:focus,
.open > .dropdown-toggle.btn-primary:hover {
  background-color: #29486F;
  border-color: #29486F;
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
  background-color: #29486F;
  border-color: #29486F;
}

.btn-success {
  color: #ffffff;
  background-color: #82B73A;
  border-radius: 4px;
  border-color: #82B73A;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success:active:focus,
.btn-success.active {
  color: #ffffff;
  background-color: #66902e;
  border-color: #66902e;
}

.btn-success.disabled:hover,
.btn-success.disabled:focus,
.btn-success.disabled:active,
.btn-success.disabled.active,
.btn-success[disabled]:hover,
.btn-success[disabled]:focus,
.btn-success[disabled]:active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success:hover,
fieldset[disabled] .btn-success:focus,
fieldset[disabled] .btn-success:active,
fieldset[disabled] .btn-success.active {
  background-color: #82B73A;
  border-color: #82B73A;
}

.btn-success.active.focus,
.btn-success.active:focus,
.btn-success.active:hover,
.btn-success:active.focus,
.btn-success:active:focus,
.btn-success:active:hover,
.open > .dropdown-toggle.btn-success.focus,
.open > .dropdown-toggle.btn-success:focus,
.open > .dropdown-toggle.btn-success:hover {
  background-color: #82B73A;
  border-color: #82B73A;
}

.btn-success:not(:disabled):not(.disabled).active,
.btn-success:not(:disabled):not(.disabled):active,
.show > .btn-success.dropdown-toggle {
  background-color: #82B73A;
  border-color: #82B73A;
}

.text-success {
  color: #82B73A !important;
}

.badge-success {
  background-color: #82B73A !important;
}

.alert-danger {
  border: none;
  background-color: #FCECED;
}

.alert-success {
  border: none;
  background-color: #E9F8D1;
}

/* globals
============================================================================= */
body {
  padding-top: 64px;
  font-family: Quicksand, sans-serif;
  font-size: 14px;
  color: #333333;
}

/* header
============================================================================= */
header {
  height: 450px;
  padding: 90px 20px;
  background-position: bottom center;
}

header.small {
  height: 145px;
}

header.colored {
  background-color: #F9FAFC;
}

header .carousel .carousel-inner {
  overflow: visible;
}

header .carousel .carousel-inner .carousel-item .btn {
  z-index: 9999;
}

header .carousel .carousel-inner .carousel-item .container {
  z-index: 1;
  position: relative;
}

header .carousel .carousel-inner .carousel-item .slide-image-shade {
  position: absolute;
}

header .carousel .carousel-inner .carousel-item .slide-image-container {
  position: absolute;
  top: 0;
  overflow: hidden;
}

.nav-link.active {
  color: #82B73A !important;
}

/* content
============================================================================= */
section {
  padding: 70px 0px;
}

section.colored {
  background-color: #F9FAFC;
}

section.highlighted {
  color: #ffffff;
  background: #284062;
  background: linear-gradient(25deg, #284062 0%, #3d5a85 100%);
}

section.small {
  padding: 50px 0;
}

.pricing-table {
  width: 100%;
  background-color: #ffffff;
  border-radius: 10px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

.pricing-table.highlighted {
  color: #ffffff;
  background: #284062;
  background: linear-gradient(25deg, #284062 0%, #3d5a85 100%);
}

.pricing-table.highlighted .list-group .list-group-item {
  border: none;
  background: none;
}

.pricing-table.highlighted .list-group .list-group-item i {
  color: #ffffff !important;
}

.switch-label:hover {
  cursor: pointer;
}

.pricing-switch label {
  width: 60px;
  height: 30px;
  margin-left: 40px;
}

.pricing-switch label::before {
  width: 100% !important;
  height: 100% !important;
  border-radius: 30px !important;
}

.pricing-switch label::after {
  height: 26px !important;
  width: 26px !important;
  border-radius: 26px !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
  border-color: #29486F !important;
  background-color: #29486F !important;
}

.custom-control .custom-control-input:checked ~ .custom-control-label::after {
  left: calc(-1rem) !important;
}

.custom-switch .custom-control-label::before, .custom-switch .custom-control-label::after {
  cursor: pointer;
}

.choose-item {
  color: gray;
  border-radius: 8px;
  background-color: #F9FAFC;
}

.choose-item:hover {
  cursor: pointer;
  color: #333333;
  background-color: #f2f4f9;
}

.choose-item i {
  font-size: 50px;
}

.choose-item:hover i {
  color: #82B73A;
}

.custom-input-group {
  width: 100%;
  position: relative;
}

@media (min-width: 576px) {
  .custom-input-group {
    width: 80%;
  }
}

@media (min-width: 768px) {
  .custom-input-group {
    width: 70%;
  }
}

@media (min-width: 992px) {
  .custom-input-group {
    width: 60%;
  }
}

@media (min-width: 1200px) {
  #form-domaincheck {
    width: 50%;
    margin: 0 auto;
  }
  #form-dyndns {
    width: 50%;
    margin: 0 auto;
  }

  .custom-input-group {
    width: 100%;
  }
}

@media (min-width: 1600px) {
  #form-domaincheck {
    width: 25%;
    margin: 0 auto;
  }
  #form-dyndns {
    width: 35%;
    margin: 0 auto;
  }
}

.custom-input-group .form-container {
  z-index: 10;
}

.custom-input-group input {
  height: 50px;
  padding: 0 30px;
  border-right: 0px;
  border-radius: 50px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

.custom-input-group .dropdown button {
  width: 120px;
  height: 50px;
  padding-left: 0;
  text-align: left;
  border-top: 1px solid #ced4da;
  border-bottom: 1px solid #ced4da;
  border-radius: 0px;
}

.custom-input-group .dropdown button.dropdown-toggle::before {
  margin-right: 10px;
  content: '';
  border-left: 1px solid #e6e6e6;
}

.custom-input-group .dropdown button.dropdown-toggle::after {
  position: absolute;
  top: 23px;
  right: 20px;
}

.custom-input-group button.submit {
  height: 50px;
  padding: 0 20px;
  border-radius: 50px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}

.custom-input-group .shadowbox {
  width: 100%;
  height: 50px;
  position: absolute;
  border-radius: 50px;
}

.loading {
  pointer-events: none;
  animation: pulse 600ms ease-out 0s alternate infinite none running;
}

@keyframes pulse {
  0% { opacity: 0.3; }
  100% { opacity: 0.1; }
}

#domain-pricing-list .card .card-header {
  font-size: 21px;
  font-weight: 600;
}

#domain-pricing-list .card .card-body .price {
  font-size: 32px;
  font-weight: 600;
}