﻿
/*
 * jQuery UI CSS Framework 1.8.16
 *
 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Theming/API
 *
 */
.ui-widget-header {background: #01adef }
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 2px solid #ffffff; background: #000; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 2px solid #fff; background: #333;}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 2px solid #fff; background: #333; }
.ui-widget :active { outline: none; }
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight  { background: #333;  }
.ui-slider { position: relative; text-align: left; background-color:#e0e2e2;border: 2px solid #fff;z-index: 1001;}
.ui-slider a{outline:0;text-decoration:none;color:#fff;}
.ui-slider .ui-slider-handle { position: absolute; z-index: 2; cursor: default; cursor:pointer;}
.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; }
.ui-slider-horizontal { height:10px; margin-bottom:0px; }
.ui-slider-horizontal .ui-slider-handle { top:-7px; margin-left: -2px;height:20px;width:7px; }
.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
.ui-slider-horizontal .ui-slider-range-min { left: 0; }
.ui-slider-horizontal .ui-slider-range-max { right: 0; }

.pricing-calc-meters li, .pricing-calc-meters, .pricing-calc-meters-advanced li, .pricing-calc-meters-advanced{
    list-style-type:none;
    padding: 0;
    margin: 0;
}

.page-pricing-calculator h1 {
     margin-left: 50px;
}
.pricing-calc-meters-advanced {
     display:none
}

.active .pricing-calc-meters-advanced{ display: block}
#calc-advanced-options{ float: left;}
#calc-advanced-options a{color: #0CA2DA;float: left;padding-right: 35px;background: transparent url("images/arrow-large-r-blue.png") right center no-repeat;line-height: 33px;}

.pricing-calc-nav {
    overflow: hidden;
    padding-top: 12px;
    padding: 0;    
}

.pricing-calc-container {
    width: 100%;
    display:inline-block;
}
.pricing-calc-meters > li {
    clear: both;
    border-bottom: 1px solid #DDD;
}
.pricing-calc-nav li:first-child {
    margin-left: 0;
    margin-left:12px;
}
.pricing-calc-nav li{
    float:left;
    list-style-type:none;
    width: auto;
    margin-top:12px;
    margin-left:1px;
}
.pricing-calc-nav a{
    text-align:center;
    display:block;
    /*padding-top: 105px;*/
    padding:10px 14px 5px 14px;
    color: black;
    /*text-transform: lowercase;*/
    font-size: 10px;
    font-family:arial,helvetica,tahoma;
    font-weight:bold;
    background: #e1e1e1;
    border:1px solid #e1e1e1;
    border-top-left-radius:6px;
    border-top-right-radius:6px;
    border-bottom:0px solid #fff;
    border-left:0px solid #fff;   
    text-decoration:none; 
}
.pricing-calc-nav a:hover {
    background-color: #0b4f6f;
    color: white;
    border-bottom-color:#00adef;
}
.pricing-calc-nav .active span {
    border-color: #0b4f6f white white white;
    border-style: solid;
    border-width: 6px;
    padding-bottom:10px;
    display: block;
    width: 0px;
}
.pricing-calc-nav .active a {
    background-color: #0b4f6f;
    color: white;
    font-weight:bold;
    border-bottom-color:transparent !important;
    font-weight:bold;
}

.pricing-calc-vm-select a{ background-position: -140px 0;border-bottom-color:#8abd46}
.pricing-calc-cloudservices-select a{ background-position: -140px 0;border-bottom-color:#f98673}
.pricing-calc-storage-select a{ background-position: -140px 0;border-bottom-color:#988dc5}
.pricing-calc-full-select a{ background-position: -140px 0;border-bottom-color:#dcc673}

.pricing-calc-meters li
.pricing-calc-nav span{
    clear:both;
    display:block;
}

.pricing-calc-choice {
    clear: both;
    width: 100%;
    margin-left: 40px;
}
.slider-pricing-group {
    display: block;
    padding: 20px 0 0;
}
.ie7 .slider-pricing-group {
    clear: both;
}
.slider-div {
    width: 475px;
    float: left;
    display: block;
    clear: both;
    min-height: 1px;
}

.pricing-calc-meters h3, .pricing-calc-meters-advanced h3 {
    float: left;
    color: #0CA2DA;
}

.slider-total, .slider-amount, .slider-hourly {
    float: left;
    display: block;
    width: 100px;
    margin: -10px 0 0 20px;
    font-size: 21px;
    line-height: 21px;
}
.slider-hourly {
    width: 50px;
    font-size: 14px;
    color: #919191;
}

.slider-amount .slider-type{ font-size: 14px;}

.slider-total {
    font-weight: bold;
    color: #333;
    margin-left:0;
}

.slider-caption,.slider-foreword {
    display: block;
    clear: left;
    color: #919191;
    padding: 7px 0 7px;
    width: 544px;
}
.slider-foreword { padding-bottom: 0;}

.buy-configure-purchase-box {
    width: 183px;
    margin-top: 10px;
    float: right;
}

.buy-configure-purchase-box h2 {
    margin-bottom: 3px;
    font-size: 30px;
    font-weight: bold;
}
#buy-configure-summary {
    float: left;
}
#currency_icons .icon_USD{ border-top: 1px solid #ccc;}
#currency_icons{ border: 0;padding: 0;color: #4A91AC;clear: both;}
#currency_icons li:first-child{padding: 0;}

/*tooltip*/
.slider-tooltip{
    position:relative;
    display:inline-block;
    float:left;
    padding: 10px 5px 0px;
    opacity:0;
    z-index:1000;
    cursor:pointer;
    visibility: hidden;
     -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
}
.pricing-calc-meters li:hover .slider-tooltip 
{
    visibility:visible;
    opacity:.8;
}

.pricing-calc-meters li:hover .slider-tooltip:hover {
    opacity:1;
}

.slider-tooltip p
{
    padding:10px;
    width:270px;
    position:absolute;
    background:#454545;
    right:-315px;
    top:-10px;
    opacity:0;
    color:#fff;
    z-index:1000;
    display:none;
    cursor:auto;
    color: #fff;
     -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
}
        
.slider-tooltip:hover p{
    display:block;
    opacity:1;
    right:-290px;
}

.ui-slider .ui-slider-handle{ z-index: 1002}
.slider-tooltip:hover { z-index: 1003;}

.slider-tooltip::after {
    content: "";
    display: none;
    border: 7px solid transparent;
    border-right-color: #454545;
    position: absolute;
    top: 7px;
    right: 0;
    opacity: .96;
}

/*t shirt selector*/
.slider-caption .selector-abbr,.slider-caption .selector-name {
    padding:0;
    margin: 0;
    overflow: hidden;
}
.slider-caption .selector-abbr {
    float: left;
    padding-right: 10px;
}
.slider-caption .selector-name li{ float: left;}
.slider-caption .selector-abbr li {
    float: left;
    height: 10px;
    min-width: 10px;
    line-height: 11px;
    font-size: 11px;
    padding: 8px;
    background-color: #999;
    clear: none;
    border-left: 2px solid #fff;
    text-transform: uppercase;
    font-weight: bold;
    text-align: center;
    cursor: pointer;
}
.slider-caption .selector-abbr li:hover {
    background-color: #cecece;
 }
.slider-caption .selector-abbr li a {
    color: #fff;
}
.slider-caption .selector-abbr li:hover a {
    color: #4D4D4D;
}
.slider-caption .selector-abbr li.active, .slider-caption .selector-abbr li.active:hover a {
    background-color: #00adef;
    color: #fff;
}
.slider-caption .selector-name li {
    display: none;
    line-height: 28px;
}
.slider-caption .selector-name li.active {
    display: block;
}
/*end tshirt selector*/

.pricing-quick-links {
    width: 520px;
    padding: 130px 0 35px;
    margin-left: 50px;
}

.pricing-quick-links ul, .pricing-quick-links li{
    margin: 0;padding: 0;
    list-style-type: none;
    line-height: 30px;
}
.pricing-quick-links h2 {
    text-transform: lowercase;
    font-size: 27px;
}

.pricing-calc-estimate {
    display: block;
    font-weight: bold;
    color: #555;
    border-bottom: 2px solid #555;
    padding-bottom: 3px;
}
.pricing-calc-month {
    text-transform: lowercase !important;
    font-size: 20px;
}
.pricing-calc-total-wrapper {
    white-space: nowrap;
}

/* override for main styles - remove after they are cleaned out */
#currency_icons li:first-child {
    background: transparent none !important;
}
#buy-configure-summary{
    color: #222;
}

/* Website - shared/deciated switcher */
.website-selector {
    margin-bottom: 5px;
    text-align: right;
    display: block;
    clear: both;
    border-bottom: 1px solid #ddd;
    width: 477px;
    height: 24px;
}

.website-selector > a{ 
    cursor: pointer;
    padding: 2px 10px;
    border: 1px solid transparent;
    border-bottom: 0;
    font-size: 15px;
    display: block;
    float: left;
    margin-right: 5px;
    text-align: center;
    line-height: 19px;
    color:#919191;
}

.website-selector > a > span {
    font-size: 10px;
    font-weight: normal;
    display: block;
}

.website-selector .shared{ font-weight: bold;color: #0CA2DA;border: 1px solid #CCC; border-bottom-color: white;}
.dedicated-active .website-selector .shared{ font-weight: normal;color:#919191; border: 1px solid transparent;}
.dedicated-active .website-selector .dedicated{ font-weight: bold;color: #0CA2DA;border: 1px solid #CCC;  border-bottom-color: white;}
.buy-configure-websites-dedicated {
    display: none;
}

.dedicated-active .buy-configure-websites-dedicated {
    display: block;
}

.dedicated-active .buy-configure-websites-shared {
    display: none;
} 

.show-subscriptions .calculator-main{
    display: none;
}
.show-subscriptions .subscribe-box{
    display: block;
}
.buy-configure-mini-pricing{ margin-left: -90px;}

.meter-disabled {float: right; padding: 13px 81px 0 0;}
.meter-disabled .slider-div { display: none;}
.meter-disabled .slider-amount { visibility: hidden;}

/* linked sliders */
.link-slave .slider-total { display: none;}

/* review & purchase tweaks */
#page .subscribe-box > div {
    width: 415px;
}

.buy-configure-purchase-box h1{ margin: 0;}
.buy-configure-purchase-box p { clear: both;}

/* hide storage size in reserved website &  virtual machines */
.buy-configure-websites-dedicated .selector-name span, .buy-configure-virtual-machines-windows .selector-name span, .buy-configure-virtual-machines-non-windows .selector-name span{ display: none;}

a.calc-purchase-button {
    font-size: 18px !important;
}

.ie7 .ui-slider-range{ height: 11px;} /*partial fix for a weird bug - where it the slider grows far to large*/

