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

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

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

/**
 * -------------------------
 * @material addons
 * -------------------------
 */
 
/* responsive content */
 
@media(min-width:992px) {
  .mt--140 {
      margin-top: -140px
  }
}

@media(max-width:992px) { 
  .btn.btn-app i {
    display: none;
  }
 
}

/* table form fix */

#form-table .form-group,
#form-table .form-control  {
  margin: 0px;
}

.vertical-middle {
	vertical-align: middle!important;
}

/* prepend input icon */

.prepend-icon .field {
    padding-left: 40px;
}  

.prepend-icon .field-icon {
  top: 1px;
  z-index: 4;
  width: 42px;
  height: 36px;
  color: inherit;
  line-height: 36px;
  position: absolute;
  text-align: center;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  pointer-events: none;
}

/* material background */

.ms-hero-img-material {
    background-image: url("/templates/gigaspark/img/banners/banner-material.png");
    background-size: cover;
    background-position: center center;
    z-index: 1000;
}

/* make all images responsive */

img {
/*  display: block; */
    max-width: 100%;
    height: auto;    
}

/* google translate */

.goog-te-banner-frame.skiptranslate {
  display: none !important;
} 
body {
  top: 0px !important; 
}  

/* pwreset fix icon */

.has-feedback label~.form-control-feedback {
  top: 38px;
}

/* kb articles img border for all */

.kbarticle img {
  padding: 4px;
  border: 1px solid #ddd; 
}

/* alert fix */

.alert-light {
  border-top: 1px dotted #b5b5b5;
  border-bottom: 1px dotted #b5b5b5;
}

/* materialstyle addons */

.p-3 {
	padding: 3px;
}

.snackbar-info {
  background-color: #fffeda;
  border: 2px solid #eac367!important;
}

.snackbar-info p {
  color: #000!important; 
  line-height: 20px!important;
}

.shadow-1dp {
	border-bottom: 1px solid rgba(0, 0, 0, .14);
}

.bg-gray {
  background-color: #fcfcfc!important;
  color: #000;
}

.bg-white {
  background-color: #fff!important;
  color: #000;
}

.bg-transparent {
  background-color: transparent!important;  
}

/* hosting packages fix */

.owl-item {
  padding-left: 1px;
}
.owl-item:nth-last-child(1) {
  padding-right: 1px;
}

.owl-carousel .owl-item img {
	width: inherit;
}

.text-strike {
	text-decoration: line-through;
}

/* gigaspark gradient */
.ms-hero-gradient-primary {
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  position: relative;
}

.ms-hero-gradient-primary:before {
  background: -moz-linear-gradient(left, rgba(11, 54, 96, .9) 10%, rgba(11, 54, 96, .8) 40%, rgba(11, 54, 96, .5) 60%, rgba(11, 54, 96, .1) 80%, rgba(11, 54, 96, .95) 90%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(11, 54, 96, .9) 10%, rgba(11, 54, 96, .8) 40%, rgba(11, 54, 96, .5) 60%, rgba(11, 54, 96, .1) 80%, rgba(11, 54, 96, .95) 90%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, rgba(11, 54, 96, .9) 10%, rgba(11, 54, 96, .8) 40%, rgba(11, 54, 96, .5) 60%, rgba(11, 54, 96, .1) 80%, rgba(11, 54, 96, .95) 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#00000000',GradientType=1 );
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	height: 100%;
	width: 100%;
}
.ms-hero-gradient-primary:after {
	display: block;
	content: "";
	padding-top: 8%;
	width: 100%;
}

.ms-hero-gradient-light {
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  position: relative;
}

.ms-hero-gradient-light:before {
  background: -moz-linear-gradient(left, rgba(250,250,250,0.90) 10%,  rgba(250,250,250,0.8) 40%, rgba(250,250,250,0.50) 60%, rgba(250,250,250,0.1) 80%,rgba(250,250,250,0.95) 90%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(250,250,250,0.90) 10%, rgba(250,250,250,0.8) 40%,rgba(250,250,250,0.50) 60%,rgba(250,250,250,0.1) 80%,rgba(250,250,250,0.95) 90%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, rgba(250,250,250,0.90) 10%, rgba(250,250,250,0.8) 40%,rgba(250,250,250,0.50) 60%,rgba(250,250,250,0.1) 80%, rgba(250,250,250,0.95) 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	height: 100%;
	width: 100%;
}
.ms-hero-gradient-light:after {
	display: block;
	content: "";
	padding-top: 8%;
	width: 100%;
}

.ms-hero-vgradient-light {
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  position: relative;
}

.ms-hero-vgradient-light:before {
  background: -moz-linear-gradient(top, rgba(250, 250, 250, 0.3) 0%, rgba(250, 250, 250, 0.9) 70%, rgb(255, 255, 255) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(250, 250, 250, 0.3) 0%, rgba(250, 250, 250, 0.9) 70%, rgb(255, 255, 255) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(250, 250, 250, 0.3) 0%, rgba(250, 250, 250, 0.9) 70%, rgb(255, 255, 255) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	height: 100%;
	width: 100%;
}

.ms-hero-vgradient-light:after {
	display: block;
	content: "";
	padding-top: 8%;
	width: 100%;
}

/* -------------------------
 * Additional labels
 * -------------------------*/

.label.label-unpaid {
    background-color: #f44336
}

.label.label-expired {
    background-color: #f44336
}

.label.label-paid {
    background-color: #4caf50
}

.label.label-active, .label.label-open, {
    background-color: #4caf50
}

.label.label-pending, .label.label-customer-reply {
    background-color: #ff9800
}

.color-unpaid, .color-expired {
    color: #f44336;
}

.color-active, .color-open, .color-paid{
    color: #4caf50;
}

.color-pending, .color-customer-reply {
    color: #ff9800;
}

.color-closed {
    color: #424242;
}

/* -------------------------
 * Website Management Tools
 * -------------------------*/

#management-tools span {
  width: 101px;
  height: 101px;
  display: inline-block;
  margin: 0 22px 0 30px;
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
}
#management-tools span:hover {
  filter: grayscale(0%);
  -webkit-filter: grayscale(0%);
}
#management-tools #manag-1 {
  background: url(../img/hosting-oneclick.png) no-repeat 0 0;
}
#management-tools #manag-2 {
  background: url(../img/hosting-oneclick.png) no-repeat -101px 0;
}
#management-tools #manag-3 {
  background: url(../img/hosting-oneclick.png) no-repeat -209px 0;
}
#management-tools #manag-4 {
  background: url(../img/hosting-oneclick.png) no-repeat -318px 0;
}
#management-tools #manag-5 {
  background: url(../img/hosting-oneclick.png) no-repeat -423px 0;
}
#management-tools #manag-6 {
  background: url(../img/hosting-oneclick.png) no-repeat -525px 0;
}

/* -------------------------
 * Input-XL
 * -------------------------*/
 
 
/* form-group-xl */
 
@media(min-width:768px) {
  .form-group-xl .form-control {
    height: 75px;
    padding: 9px 0;
    font-size: 55px;
    line-height: 1.33333;
    font-weight: 300;
  }

  /* placeholder */
  .form-group-xl .form-control::-moz-placeholder {
      font-size: 55px;
      line-height: 1.42857;
      color: #bdbdbd;
      font-weight: 300
  }

  .form-group-xl .form-control:-ms-input-placeholder {
      font-size: 55px;
      line-height: 1.42857;
      color: #bdbdbd;
      font-weight: 300
  }

  .form-group-xl .form-control::-webkit-input-placeholder {
      font-size: 55px;
      line-height: 1.42857;
      color: #bdbdbd;
      font-weight: 300
  }
}

@media(max-width:768px) {
  .form-group-xl .form-control {
    height: 55px;
    padding: 9px 0;
    font-size: 36px;
    line-height: 1.33333;
    font-weight: 300;
  }

  /* placeholder */
  .form-group-xl .form-control::-moz-placeholder {
      font-size: 30px;
      line-height: 1.42857;
      color: #bdbdbd;
      font-weight: 300
  }

  .form-group-xl .form-control:-ms-input-placeholder {
      font-size: 30px;
      line-height: 1.42857;
      color: #bdbdbd;
      font-weight: 300
  }

  .form-group-xl .form-control::-webkit-input-placeholder {
      font-size: 30px;
      line-height: 1.42857;
      color: #bdbdbd;
      font-weight: 300
  }
}

/* form-group-xl - ostalo */

.form-group-xl select.form-control {
    height: 75px;
    line-height: 75px;
}

.form-group-xl textarea.form-control,
.form-group-xl select[multiple].form-control {
    height: auto
}

.form-group-xl .form-control-static {
    height: 75px;
    min-height: 42px;
    padding: 10px 0;
    font-size: 55px;
    line-height: 1.33333
}

.form-group.form-group-xl {
    padding-bottom: 9px;
    margin: 31px 0 0
}

.form-group.form-group-xl .form-control {
    margin-bottom: 9px
}

.form-group.form-group-xl .form-control::-moz-placeholder {
    font-size: 55px;
    line-height: 1.33333;
    color: #bdbdbd;
    font-weight: 400
}

.form-group.form-group-xl .form-control:-ms-input-placeholder {
    font-size: 55px;
    line-height: 1.33333;
    color: #bdbdbd;
    font-weight: 400
}

.form-group.form-group-xl .form-control::-webkit-input-placeholder {
    font-size: 55px;
    line-height: 1.33333;
    color: #bdbdbd;
    font-weight: 400
}

.form-group.form-group-xl .checkbox label,
.form-group.form-group-xl .radio label,
.form-group.form-group-xl label {
    font-size: 55px;
    line-height: 1.33333;
    color: #bdbdbd;
    font-weight: 400
}

.form-group.form-group-xl label.control-label {
    font-size: 15px;
    line-height: 1.0;
    color: #bdbdbd;
    font-weight: 400;
    margin: 16px 0 0
}

.form-group.form-group-xl .help-block {
    margin-top: 0;
    font-size: 15px
}

.form-group.form-group-xl.label-floating label.control-label,
.form-group.form-group-xl.label-placeholder label.control-label {
    top: -5px;
    font-size: 55px;
    line-height: 1.33333
}

.form-group.form-group-xl.label-static label.control-label,
.form-group.form-group-xl.label-floating.is-focused label.control-label,
.form-group.form-group-xl.label-floating:not(.is-empty) label.control-label {
    top: -34px;
    left: 0;
    font-size: 15px;
    line-height: 1.0
}

.form-group.form-group-xl.label-floating input.form-control:-webkit-autofill~label.control-label label.control-label {
    top: -34px;
    left: 0;
    font-size: 15px;
    line-height: 1.0
}

.form-group.form-group-xl .input-group-btn .btn {
    margin: 0 0 9px
}

.form-group-xl select.form-control {
    height: 75px;
    line-height: 75px;
}

.form-group-xl textarea.form-control,
.form-group-xl select[multiple].form-control {
    height: auto
}

.form-group-xl .form-control-static {
    height: 75px;
    min-height: 42px;
    padding: 10px 0;
    font-size: 55px;
    line-height: 1.33333
}



/* WHMCS - iCheck plugin Square skin, blue
------------------------------------------  */
.icheckbox_square-blue,
.iradio_square-blue {
    display: inline-block;
    *display: inline;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    width: 22px;
    height: 22px;
    background: url(/templates/orderforms/gigaspark/css/blue.png) no-repeat;
    border: none;
    cursor: pointer;
}

.icheckbox_square-blue {
    background-position: 0 0;
}
    .icheckbox_square-blue.hover {
        background-position: -24px 0;
    }
    .icheckbox_square-blue.checked {
        background-position: -48px 0;
    }
    .icheckbox_square-blue.disabled {
        background-position: -72px 0;
        cursor: default;
    }
    .icheckbox_square-blue.checked.disabled {
        background-position: -96px 0;
    }

.iradio_square-blue {
    background-position: -120px 0;
}
    .iradio_square-blue.hover {
        background-position: -144px 0;
    }
    .iradio_square-blue.checked {
        background-position: -168px 0;
    }
    .iradio_square-blue.disabled {
        background-position: -192px 0;
        cursor: default;
    }
    .iradio_square-blue.checked.disabled {
        background-position: -216px 0;
    }


/* misc */

.lowercase {
  text-transform: lowercase!important;
}

.breadcrumb>.active {
    color: #1976d2;
}

.promo-badge {
  float: left; 
  margin: -10px 0 0 -10px;
}


/* configureproductdomain.tpl
******************************/


#order-standard_cart .domain-input-group {
    display: none;
    margin: 10px 0;
}
#order-standard_cart .domain-loading-spinner {
    display: none;
    padding: 30px;
    text-align: center;
}



/* orderforms -- spotlight (import from whmcs.css)
****************************/

/*
.domain-checker-bg {
    padding: 42px 0;
}
*/

.domain-searching {
    color: #ccc;
}

/*
.domain-lookup-result .btn:not(.domain-contact-support) {
    width: 100px;
}
*/

.spotlight-tlds {
    margin: 15px 0;
    padding: 7px 14px;
    background-color: #f8f8f8;
}
.spotlight-tlds-container {
    margin-left: -7px;
    margin-right: -7px;
}
.spotlight-tld-container {
    float: left;
    padding: 7px 7px;
}
.spotlight-tld-container-1 {
    width: 100%;
}
.spotlight-tld-container-2 {
    width: 50%;
}
.spotlight-tld-container-3 {
    width: 33.3%;
}
.spotlight-tld-container-4 {
    width: 25%;
}
.spotlight-tld-container-5 {
    width: 20%;
}
.spotlight-tld-container-6 {
    width: 16.6%;
}
.spotlight-tld-container-7 {
    width: 14.28%;
}
.spotlight-tld-container-8 {
    width: 12.5%;
}

@media screen and (max-width: 991px) {
    .spotlight-tld-container-5,
    .spotlight-tld-container-6 {
        width: 33.3%;
    }
    .spotlight-tld-container-7,
    .spotlight-tld-container-8 {
        width: 25%;
    }
}
@media screen and (max-width: 580px) {
    .spotlight-tld-container-3,
    .spotlight-tld-container-4,
    .spotlight-tld-container-5,
    .spotlight-tld-container-6,
    .spotlight-tld-container-7,
    .spotlight-tld-container-8 {
        width: 50%;
    }
}

.spotlight-tld {
    position: relative;
    overflow: hidden;
    margin: 0;
    padding: 15px 0;
    height: 112px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    text-align: center;
    font-weight: bold;
    color: #555;
}
.spotlight-tld span {
    display: block;
    /* padding: 5px 0; */
    font-weight: normal;
}
.spotlight-tld .btn:not(.domain-contact-support) {
    padding: 2px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
    background-color: #555;
    border-color: #333;
    color: #fff;
    width: 88px;
}
.spotlight-tld .btn.domain-contact-support {
    padding: 2px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
    color: #fff;
    min-width: 88px;
}
.spotlight-tld .btn span {
    padding: 0;
}
.spotlight-tld .unavailable,
.spotlight-tld .invalid {
    margin: 19px 0;
    background-color: #eee;
    border-color: #ddd;
    color: #bbb;
}
.spotlight-tld .domain-contact-support {
    margin: 19px 0;
}
.spotlight-tld .domain-lookup-spotlight-loader {
    line-height: 47px;
    font-size: 1.4em;
}
.spotlight-tld .results {
    display: none;
}
.spotlight-tld-new {
    width: 60px;
    position: absolute;
    letter-spacing: 1px;
    padding: 3px;
    font-size: x-small;
    font-weight: bold;
    text-transform: uppercase;
    color: #fff;
    top: 3px;
    right: -18px;
    background-color: #2ad588;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.spotlight-tld-sale {
    width: 60px;
    position: absolute;
    letter-spacing: 0;
    padding: 3px;
    font-size: x-small;
    font-weight: bold;
    text-transform: uppercase;
    color: #fff;
    top: 3px;
    right: -18px;
    background-color: #f7d458;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.spotlight-tld-hot {
    width: 60px;
    position: absolute;
    letter-spacing: 0;
    padding: 3px;
    font-size: x-small;
    font-weight: bold;
    text-transform: uppercase;
    color: #fff;
    top: 3px;
    right: -18px;
    background-color: #f9615a;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}