/* ==========================================
   UNIVERSAL SLIDER FINAL
========================================== */

body{
    background:#f3f0fb;
}

/* ==========================
   PRODUCT CONTAINER
========================== */

.product-container{

    background:#ffffff;

    border-radius:25px;

    border:none;

    box-shadow:
        0 10px 30px rgba(90,38,201,.08);

/*    transition:.3s ease; */
}

.product-container:hover{

/*    transform:translateY(-3px); */

    box-shadow:
        0 20px 40px rgba(90,38,201,.15);
}

/* ==========================
   FEATURE CARDS
========================== */

#order-universal_slider .container-with-progress-bar{
    background:#ffffff;
    border-radius:18px;
    padding:25px !important;
	/*
    box-shadow:
        0 5px 15px rgba(0,0,0,.05);
		*/
    transition:.3s ease;
}

#order-universal_slider .container-with-progress-bar:hover{
    transform:translateY(-3px);
/*    box-shadow:
        0 10px 25px rgba(90,38,201,.12);
		*/
}

#order-universal_slider .container-with-progress-bar span{
    display:block;
    font-size:20px !important;
    font-weight:700;
    color:#261345;
}

/* esconder barras dos recursos */
#order-universal_slider .progress{
    display:none !important;
}

/* ==========================
   PRICE BOX
========================== */

#order-universal_slider .price-container{

    background:#ffffff !important;

    border:2px solid #e8defc;

    border-radius:25px;

    padding:30px;

    box-shadow:
        0 10px 30px rgba(90,38,201,.08);
}

#order-universal_slider .price-container:hover{

    box-shadow:
        0 20px 40px rgba(90,38,201,.15);
}

.price-cont{

    display:block;

    font-size:46px !important;

    font-weight:800;

    line-height:1.1;

    color:#5a26c9;

    margin-top:10px;
}

.price-cont small{

    display:block;

    font-size:14px;

    color:#666;
}

/* ==========================
   ORDER BUTTON
========================== */

.order-button{
    display:block;
    width:100%;
    margin-top:20px;
    padding:14px;
    text-align:center;
    text-decoration:none !important;
    border-radius:999px;
    background:linear-gradient(
        135deg,
        #5a26c9,
        #261345
    ) !important;
    color:#ffffff !important;
    font-weight:600;
    transition:.3s ease;
}

.order-button:hover{
    background:linear-gradient(135deg, #fa4a2d, #ff7043) !important;
    color:#fff !important;
/*    transform:translateY(-2px); */
    box-shadow:
        0 10px 25px rgba(250,74,45,.25);
}

/* ==========================
   SLIDER
========================== */

#order-universal_slider .product-selector .irs-line{

    background:#e8defc !important;

    height:8px !important;

    border:none !important;

    border-radius:50px !important;

    box-shadow:none !important;
}

#order-universal_slider .product-selector .irs-bar{

    background:#cf22ac !important;

    height:8px !important;

    border:none !important;

    border-radius:50px !important;
}

#order-universal_slider .product-selector .irs-bar-edge{

    background:#cf22ac !important;

    border:none !important;
}

#order-universal_slider .product-selector .irs-slider,
#order-universal_slider .product-selector .irs-slider:hover{

    width:28px !important;

    height:28px !important;

    top:20px !important;

    border-radius:50% !important;

    background:#fa4a2d !important;

    background-image:none !important;

    border:4px solid #ffffff !important;

    box-shadow:
        0 0 0 4px rgba(250,74,45,.15),
        0 4px 12px rgba(0,0,0,.15);
}

#order-universal_slider .product-selector .irs-single{

    background:#5a26c9 !important;

    color:#ffffff !important;

    border-radius:25px !important;

    padding:4px 12px !important;

    font-weight:700 !important;
}



/* ==========================
   HEADINGS
========================== */

#headline{

    font-weight:800;

    color:#261345;
}

#tagline{

    color:#666;
}

/* Barra não preenchida */

#order-universal_slider .irs-line,
#order-universal_slider .irs-line-left,
#order-universal_slider .irs-line-mid,
#order-universal_slider .irs-line-right,
#order-universal_slider .irs-line-left.last {
background:#F3CAEA !important;
height:10px !important;
background-image: none !important;
border: none !important;
}

/* Parte preenchida */

#order-universal_slider .irs-bar,
#order-universal_slider .irs-bar-edge {

    background: #cf22ac !important;

    background-image: none !important;

    border: none !important;
}

#order-universal_slider .irs-bar,
#order-universal_slider .irs-bar-edge {

    background:#cf22ac !important;
}

/* ==========================================
   HOSTIKO VPS CARD
========================================== */

.hostiko-card{

    padding:20px;
}

.hostiko-header{

    text-align:center;

    margin-bottom:30px;
}

.hostiko-plan-name{

    font-size:28px;

    font-weight:700;

    color:#261345;

    margin-bottom:15px;
}

.hostiko-price{
    font-size:46px;
    font-weight:800;
    color:red;
    line-height:1;
}

.hostiko-price small{
/*    display:block; */
    font-size:16px;
    color:#666;
    margin-top:10px;
}

.hostiko-specs{

    margin-bottom:30px;
}

.hostiko-spec{
    background:#f8f6ff;
	border: 1px solid #cf22ac;
    border-radius:18px;
    padding:20px;
    text-align:center;
    height:100%;
}

.hostiko-value{
    display:block;
    font-size:24px;
    font-weight:800;
    color:#cf22ac;
}

.hostiko-label{
    display:block;
    margin-top:8px;
    font-size:12px;
    text-transform:uppercase;
    color:#666;
}

.hostiko-order{
    max-width:350px;
    margin:auto;
}

#order-universal_slider .product-selector .irs-line,
#order-universal_slider .product-selector .irs-bar {
    height:16px !important;
}

#order-universal_slider .product-selector .irs-slider,
#order-universal_slider .product-selector .irs-slider:hover {
    width:38px !important;
    height:38px !important;
    top:15px !important;
}

#order-universal_slider .product-selector .irs-line,
#order-universal_slider .product-selector .irs-bar {
    height:14px !important;
}

#order-universal_slider .product-selector .irs-slider,
#order-universal_slider .product-selector .irs-slider:hover {
    width:34px !important;
    height:34px !important;
    top:22px !important;
}

/* cor da etiqueta do slider ao mudar */ 
#order-universal_slider .product-selector .irs-single {
    font-size:18px !important;
    font-weight:700 !important;
    top:-18px !important;
    border-radius:30px !important;
	z-index:9999;
    position: absolute !important;
/*    background:#5a26c9 !important; */
    background:	#cf22ac !important;
    opacity:1 !important;
    padding:5px 15px !important;
}



.hostiko-specs {
    margin-top:30px;
    margin-bottom:30px;
}


#order-universal_slider .irs-grid-text {
    font-size:40px !important;
    opacity:.75;
}

/* espaçamento do s valores das VPS para a barra de slider */ 
#order-universal_slider .product-selector .irs-grid {
    bottom: inherit;
	top: 75px !important;
}

/* cor da legenda por baixo da barra- ex. VPS-1, VPS-2 */
#order-universal_slider .product-selector .irs-grid-text{
    color:red !important;
    font-weight:600 !important;
    font-size:14px !important;	
}

#order-universal_slider .irs-grid-pol {

    width: 2px !important;

    height: 18px !important;

    background: #ffffff !important;

    opacity: 1 !important;

    top: -6px !important;
}

#order-universal_slider .irs-grid-pol.small {

    width: 1px !important;

    height: 10px !important;

    background: rgba(255,255,255,.5) !important;

    opacity: 1 !important;
}

#order-universal_slider #headline {
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    font-size:40px !important;
    line-height:1.2 !important;
    color:#cf22ac !important;
/*    background:yellow !important;
    border:2px solid blue !important; */
}

.hostiko-specs {

    margin-top:30px;

    margin-bottom:30px;
}

.hostiko-specs .col-md-3,
.hostiko-specs .col-lg-3,
.hostiko-specs .col-6 {

    margin-bottom:25px !important;
}

