html, body{ padding-top: 0px; font: 0.9em sans-serif; height:100%;font-weight:100; background-color: #ffffff;}
.big{font-size: 2em;}
.field-label-title {font-size:1.4em; font-weight: 500;}
.field-label-helptxt {font-weight: 200; color: #808080;}
.tiny, .tinyfieldset{font-size: 90%;}
.tinyfieldset {padding:0.1em 0 2em 0; }
.setplan{border: thin solid #bdbdbd; margin-top:0.8em; padding:0.8em; }
.tiny_service_delete{font-size: 80%;}
.gt{ color: black;}
a.gt:hover {color: black;}
.gt_active, .gt_highlight{  color: #06F; font-weight: 300; font-size:120%;}
h1, h2, h3, .h1{margin: 1em 0em 0.5em 0em; padding:1px;  font-weight:200;}
hr{  border: 0;  width: 100%; margin: 1em 0 1em 0; height: 2px;  /* background-color: #eee; */  border-style: dashed;  border-top: 1px dashed #eee;}
h1, .h1{ font-size:160%; color: #303030;}
h2 { font-size:140%; color: #303030;}
h3 { font-size:120%; color: #303030;font-weight:200;}
h4 {font-size: 100%; color: black;font-weight: 200;margin: 1em 0em 0.5em 0em; padding:1px;}
.flex_wrapper {
    display: flex;
    flex-direction: row;
    max-height: 80vh;
}
.flex_item {
    flex: 1;
    padding: 4px;
    max-height: 100%;
    overflow: scroll;
}
.flex_item:nth-child(1) {
    width: 330px; /* Or a percentage value */
    flex:initial;
}
.flex_item:nth-child(2) {
    flex: 2;
}
img {border:0;}
.highlight{color: #ff0073;}
.highlight_pos{color: #06F;}
.logo_link {   color: #6E6E6E;    text-decoration: none;  font-weight:100;    font-size: 2em;     font-family: 'Courier New', Georgia, sans-serif;
   padding-right: 5px;}
::-webkit-input-placeholder { color:#AAAAAA; font-weight:100; font-size: 1em;  font-family: sans-serif;}
:-moz-placeholder { /* Firefox 18- */
   color: #AAAAAA; font-weight:100; font-size: 1em;  font-family: sans-serif; 
}
::-moz-placeholder {  /* Firefox 19+ */
   color: #AAAAAA;  font-weight:100; font-size: 1em;  font-family: sans-serif;
}
:focus::-webkit-input-placeholder{color:transparent;}
strong, b {
font-weight: 600;
}
.nav{ color: #06F;  text-decoration: none;  font-weight:bold;}
.group {  border: thin dashed #bdbdbd;  margin: 5px;  padding: 5px;}
form {
  padding: 0.2em 0.8em 0.2em 0.8em;
  border: thin solid #eee;
    -moz-border-radius: 0.4em;
    -webkit-border-radius: 0.3em;
}
form#child {
  padding: 0em;
  margin: 0em;
  border: none;
}

div.childform {
    padding: 0.2em 0.6em;
    font-size: 90%;
    -moz-border-radius: 0.2em;
    -webkit-border-radius: 0.2em;
}
div.parentform, div.parentformselected, div.centerform {
  padding: 0.4em 0.6em 0.8em 0.6em;
  border: thin solid #eee;
  -moz-border-radius: 0.2em;
  -webkit-border-radius: 0.2em;
}

div.parentform, div.childform {
  border: thin solid #eee;
  background-color: #fff;
}
div.parentformselected {
  background-color: #fff;
}
.parentform input, .parentform textarea {
  font-size: 14px;
}
.parentform, .centerform, .childform {
  /* background-color: #EEEEEE; */
}
.parentformselected {border: thin solid #F1A8A8;}

.centerform {padding: 0.8em;margin-left: 20%; margin-right: 20%;}

div.table_of_contents {
    position:absolute; top:0; right:0;
    width:250px;
    padding: 0.2em 0.6em;
    -moz-border-radius: 0.2em;
    -webkit-border-radius: 0.2em;
    float:right;
    border: thin solid #EEEEEE;
    background:#EEEEEE;
    border: thin solid #bdbdbd;
    
}

.help_section_zebra {
    background-color: #ffffff;
}
.help_section {
    background-color: #EEEEEE;
}
.help_section, .help_section_zebra {
    padding: 0.2em 2em 2em 2em;
}
.help_optional {
	color:#FF0084;
}

table.stat_table {border: thin solid #bdbdbd; background: #f1f1f0; padding: 8px;}
table.stat_table thead {border-style: none; padding: 0px;font-weight:700;}
table.stat_table th{padding: 0px;border-style: none;text-align: right;}
table.stat_table tbody td {border-top: 1px solid #ccc; padding-top:2px; }

div.table_of_contents ul {
    list-style: none;
    margin-left: 0;
    padding-left: 1em;
    line-height: 1.6em;      

}
div.tableofcontents ul li {
    margin-top:0.8em;
}
div.tableofcontents ul li:before {
    content: "\00BB \0020";

}
ul.button-list {list-style: none; }
ul.button-list li {margin-top:10px;}
ul.button-list a {width:170px;}
ul.simple { list-style: none; }
ul.simple li {  margin:0.5em; }
ul.upload-result { list-style: disc;   }
ul.upload-result li {  margin:0.5em 0 0.5em 0.9em; }

.edit{float:right; margin-top:-1.5em; margin-left:2em;font-size:80%;}
p#action_links{ margin: 0em;  padding: 1em 0.5em 1em 0.5em; background-color: #f0f8ff;  border-left: thin solid #bdbdbd; border-right: thin solid #bdbdbd; border-top: thin solid #bdbdbd;}
p{margin: 0.5em 0.0em; padding: 1px;line-height:130%;color:#3D3D3D}
a{color: #00F;text-decoration:underline}
.response_not, .response_set, .response_green { 
   height: 1em;  
   -webkit-border-radius: 14px; 
   -moz-border-radius: 0.5em; 
   padding: 0.5em 0.8em; 
   margin: auto; 
   text-align: center; 
   text-decoration:none; font-size: 0.8em;
   border: 1px solid #A9A9A9; 
   /* border-bottom : 2px solid #A9A9A9; */
   /* border-right : 2px solid #A9A9A9; */
}
.response_not  { background-color: #FFFFFF;color:#A6B2CC; text-decoration:none; }
.response_set  { background-color: #A0CAE8; color:#303030;}
.response_green  { background-color: #0CFF00; color:#303030;}
a.response_set:hover, a.response_not:hover, a.response_green:hover {background: #B1D1E8;}
a#fdate{color:blue;text-decoration:none;}
a#finfo{color:blue;text-decoration:none;}
a#highlight{font-size:120%;}
div#container{width:90%;margin:0 auto; min-width:850px; max-width:1600px;}
div#main{width: 100%;}
div#main2{ margin: 0 auto; margin-top:10px;}
div{margin-top: 1px; font-weight:300; }
div#footer{width: 100%;min-width:600px; margin-top: 10px; border-top: 1px solid #CCC; text-align:left;}
.spread{margin-left:0.8em; }
span#greentext {font: 12pt Arial;letter-spacing: 4pt;color: #00AA00; margin:6px;}
.api_message {  margin: 0.8em;  padding: 0.8em; text-align: left;   color: black;}
.hint_message, .alert_message, .conflict_message, .addition_message, .info_message {  margin: 0.8em;  padding: 0.8em; text-align: left; color: black;   /* border: thin solid #d3d3d3; */}
.hint_message{background-color: #9ECAFF;}
.alert_message{border: thin solid #FE9EA7; background-color: #FFD7D5;}
.conflict_message {background-color: rgb(255, 215, 215);}
.addition_message {background-color: #8AFFAB;}
.info_message {background-color: #EEEEEE; /* color:#303030; *//* border:1px solid #C0C0FF; */}
.info_message a {text-decoration: underline;}
.info_message strong {color:#FF0084;}
.info_message ul {list-style-position: inside;}
.alert_message ul {list-style-type: none; padding: 0px; margin: 0px;}
.count-box { margin-top: 0.5em;  padding:0.1em; font-size: 12px; text-align:left;}
.tag_word_group {
    line-height:18px;
    padding-top:5px;
    margin-top:5px;
}
.tag_word_lead {
    color:#303030;
    font-size: 12px;
}
.tag_word { 
    color: #555555;
  font-size: 10px;
  padding: 2px;
  margin-left: 2px;
  border: thin solid #EEEEEE;
    background:#FFFFFF;
    border: thin solid #bdbdbd;
    display: inline-block;
    white-space:nowrap;
    line-height:0.9em;
}
.tag_word_selected {
    font-weight: 900;
    font-size: 1.2em;
}
.tag_word a {
    padding-right:10px; 
    style:none;
}
table.tag_word_table { 
    background-color: none; 
  padding: 0px;
  margin: 0px;
  border-collapse: collapse;
    border: none;
    width:100%;
    
}
table.tag_word_table tr td {
  margin: 0px;
  padding: 0.2em 0;
  font-stretch: ultra-condensed;
  color:#303030;
  font-size: 12px;
}
.code, .code_text {font-family:'Courier',serif;
font-weight:100; font-stretch: ultra-condensed;color:#FF1493;   
}

.code, .quote {padding:1em; border:1px solid #CCC; text-align:left; width: 90%;min-width:300px;margin:1em;
-moz-box-shadow: 3px 3px 4px #303030; -webkit-box-shadow: 3px 3px 4px #303030; box-shadow: 3px 3px 4px #303030;background:#FFFFCC;}
.code a{text-align:center;}
.code span a {font-size: 0.8em; text-decoration: none; color: #f00; }

.quote {
color: #FF1493;
background: #ffffff;
}

pre{  
background-color: White;  
color: #666;
border: thin solid #bdbdbd;
margin: 0.8em;  
overflow: auto; 
padding: 0.8em; font: 100% "Courier New"; 
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
}
div#infotext, div#servicename, div#password {position:relative; float:left; margin-right:1px; background: #EEEEEE; border: none; border-style: none }
.overlabel {color:#999;}
.overlabel-apply {  position:absolute;top:3px;left:5px; z-index:1;  color:#999;}
label.overlabel {color:#999;}
label.overlabel-apply { position:absolute;top:3px;left:5px; z-index:1;  color:#999;}
table.basic {border: thin solid #bdbdbd; background: #f1f1f0;}
table.basic thead {border-style: none; padding: 0px;font-weight:700;}
table.basic th{padding: 0px;border-style: none;text-align: right;}
table.basic td {border-style: none; padding: 0px;}
table.example {background-color:#E5EECC;background-image:url(images/bgfadegreen.gif);background-repeat:repeat-x;border:1px solid #D4D4D4;color:#000000;padding:8px 10px;}
table.simple{border-collapse: collapse;border-spacing: 0px; }
table.simple th{ border-bottom: 1px inset #7D7D7D; font-weight: bold;padding-left: 8px; }
table.simple td{  
  text-align: left;
  font-weight: normal;
  margin-top: 5px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 8px;
  padding-right: 0px;
  /*border-bottom: 1px inset #7D7D7D; */
}
table.history{border-collapse: collapse;border-spacing: 0px; }
table.history th{ border-bottom: 1px inset #7D7D7D; font-weight: bold;padding: 1px; }
table.history td{
  border-bottom: 1px inset #7D7D7D;
  text-align: left;
  font-weight: normal;
  padding: 1px;
  
}
table.api{border-collapse: collapse;border: thin solid #eee; background: #FFFFFF; width: 100%; }
table.api th{ border: 1px inset #eee; font-weight: 100;padding: 0.5em; background-color: #eee; color: #000;}
table.api td{
    border: 1px inset #eee;
    text-align: left;
    padding: 0.5em;
    margin:0.8em;
    
}
.jqifade{
      position: absolute;
      background-color: #aaaaaa;
}
div.jqi{
      width: 400px;      
      position: absolute;
      background-color: #ffffff;      
      text-align: left;
      border: solid 1px #eeeeee;
      -moz-border-radius: 4px;
      -webkit-border-radius: 4px;
      padding: 7px;
}
div.jqi .jqicontainer{
}
div.jqi .jqiclose{
      position: absolute;
      top: 4px; right: -2px;
      width: 18px;
      cursor: default;
      color: #bbbbbb;
}
div.jqi .jqimessage{
      padding: 10px;
      line-height: 20px;
      color: #444444;
}
div.jqi .jqibuttons{
      text-align: center;
      padding: 5px 0 5px 0;
      border: solid 1px #eeeeee;
      background-color: #f4f4f4;
      -moz-border-radius: 4px;
      -webkit-border-radius: 4px;
      
}
div.jqi button{
      padding: 3px 10px;
      margin: 0 10px;
      background-color: #A0CAE8;
      border: solid 1px #f4f4f4;
      -moz-border-radius: 4px;
      -webkit-border-radius: 4px;
}
div.jqi button:hover{
      background-color: #B1D1E8;
}
div.jqi button.jqidefaultbutton{
      background-color: #A0CAE8;
}
.jqiwarning .jqi .jqibuttons{
      background-color: #FF0084;
}
.js .display { display:none; }

div.service_edit_links {
    text-align: right;    
}
#jsddm {margin: 0; padding: 0}
#jsddm li { float: left;list-style: none;}
#jsddm li a {display: block; background: #20548E;padding:0.2em 0.8em 0.2em 0.8em; text-decoration: none;  border-right: 1px solid white; width: 70px; color: #EAFFED; white-space: nowrap;}
#jsddm li a:hover { background: #1A4473;}   
#jsddm li ul { margin: 0; padding: 0; position: absolute; visibility: hidden; border-top: 1px solid white;}
#jsddm li ul li { float: none; display:inline;}   
#jsddm li ul li a { width: auto; background: #9F1B1B; }
#jsddm li ul li a:hover { background: #7F1616;}
div.grippie {background:#EEEEEE url(../images/grippie.png) no-repeat scroll center 2px;border-color:#7D7D7D;border-style:solid;border-width:0pt 1px 1px;cursor:s-resize;height:9px;overflow:hidden;}
.resizable-textarea textarea {display:block;margin-bottom:0pt;width:100%;height: 20%; background-color: #FFFFF2;}
.selected, .sourceselected{background-color:#FC829F; color:#FFFFFF;}
.destination_selected{background-color:#68FA7E;}
.hide { display:none;}
.show { display:block;} 
.remove_grey {padding: 0 0.5em 0 0.2em; color: #7F7F7F;text-decoration:none;font-size:80%;margin-bottom:02em;}
.remove_grey:hover{color:#FF0000;}
label, input { display:inline; }
label {font-weight:600;}
input.text  {
margin: 0.8em 0 0.8em 0;
padding:0.4em;
width:95%;
/* background-color: #FFFFF2; */
}
input.blur {
color:#999999;
font-family:sans-serif;
font-weight:100;
}

#header_tool_wrapper {
 position:relative;
 clear:both;
 padding: 0 0.2em 0.8em 0;
 /* border: thin solid #BDBDBD; */
     
 background: #FBFBFB;
    -moz-border-radius: 0.2em;
    -webkit-border-radius: 0.2em;
 height:35px;
}
#header_tool_wrapper_right {
 
 padding-top:1em;
 
}
#header_tool_wrapper_left {
 position:absolute;
 top:0;
 left:0;
 text-align:left;
 margin-left: 1em;
}
#search-term-wrapper {
 margin: auto;
 width: 300px;
 display:table-cell;
 text-align:left;
 height: 40px;
}
#search_term {
display:inline;
width:280px;
 
/* background-color:#FFFFF2; */

}

fieldset { padding:0; border:0; margin-top:25px; max-width: 850px; margin: 0 auto;}
div#users-contain { width: 350px; margin: 20px 0; }
div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
.ui-dialog .ui-state-error { padding: .3em; }
.validateTips { border: 1px solid transparent; padding: 0.3em; color: red;}
div.scroll {
overflow: auto;
border: 0px solid #C0C0C0;
padding: 8px;
}
div.home-left-list-scroll {
    height: 65vh;
    overflow: auto;
    border: 0px solid #C0C0C0;
    padding: 8px;
}
div.home-main-list-scroll {
    height: 40vh;
    overflow: auto;
    border: 0px solid #C0C0C0;
    padding: 8px;
}
#updated, #foo, #deleted, #error-info{
    position: fixed;
    max-width: 850px;
    right: 10px;
    margin: 0 auto;
    text-align: center;
    top: 10px;
    padding: 0.8em;
    z-index:9090;
    font-size: 1.2em;
    background: #8AFFAB;
    color: #000;
    border: thin solid #00AA00;
}

.configuration-info {
    text-align: center;
    padding: 0.4em; 
    margin: 0.8em;
     
    border: thin solid #eee;
    -moz-border-radius: 0.2em;
    -webkit-border-radius: 0.2em;
    
}
.configuration-info {background-color: #fff;}
.configuration-info a:link {text-decoration: none;}
.configuration-info a:visited {text-decoration: none;}
.configuration-info a:active {text-decoration: none;}
.configuration-info a:hover {text-decoration: underline;}

.power-link a:link {color:#FF0084;}
.power-link a:link span {color:#FF0084;}
.power-link a:visited {text-decoration: none;color:#FF0084;}
.power-link a:active {text-decoration: none;color:#FF0084;}
.power-link a:hover {text-decoration: underline; color:#FF0084;}

.icon-link a:link {text-decoration: none;color:#7F7F7F;}
.icon-link a:visited {text-decoration: none;color:#7F7F7F;}
.icon-link a:active {text-decoration: none;color:#7F7F7F;}
.icon-link a:hover {text-decoration: underline; color:#7F7F7F;}

.invisible-focusable{color:black;}
.invisiblefield {border:0;padding-left:0; margin-left:0; color:blue; width:100%;background:transparent;}
.invisiblefiled-in-focus{  
        border:solid 1px #73A6FF;  
        background:#EFF5FF;  
        color:#000;  
        padding: 0.2em;
    } 
.service { list-style: none; word-break:break-all;  }
.service div {  margin:0.5em 0 0.5em 0; }
.basic_label {color:#303030;}
div.service-value {color:#616161; font-weight:100;}
div.service-label {color:#555555; padding-top:0.8em;}
div.border-top{border-top: 1px dashed #eee;}
div.not-top {margin-top:2em;}
.sidebarme{margin-left:60%; margin-right:5%;}
.warning_no_scenario{font-size:0.8em;color:red;font-weight:bold;margin-top:1em;}
.service-detail-scenario-list-item{
 border: thin dashed #bdbdbd;
 padding:2px 5px;
 /* background-color:#FFFBF2; */
}

/* EDIT SCENARIO FORM */
.no-scenario-defined-warning {color: red;}
.edit-scenario-name-label, .edit-scenario-match-label, .edit-scenario-response-label {font-weight:bold; font-size:1.0em;}
.edit-scenario-name-value, .edit-scenario-match-value {margin:0.8em 0; padding:0.4em; width:95%; }
.edit-scenario-response-value {display:block;margin-bottom:0pt;width:100%; font-size:0.2em;height: 300px;font-family: Courier New, monospace;font-weight:100; font-stretch: ultra-condensed;}
.edit-scenario-header {width:250px;}
.noborder_textarea {border:none; width:100%; height:100px;overflow: auto;}
.intro_txt {
font-family: Georgia, serif;
font-size: 20px;
font-style: italic;
font-weight: normal;
text-transform: normal;
letter-spacing: normal;
line-height: 1.4em;
}
.hhButton, .hhButtonGreen, .hhButtonRed, .hhButtonBlue {
  display: inline-block;
  text-align: center;
  padding: 5px 18px 4px;
  font-size: 12px;
  line-height: 18px;
  color: #333;
  text-decoration: none;
  border: 1px solid #BDBDBD;
  position: relative;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  font-weight:bolder;
}
.hhButtonGreen img {
    border:none;
    vertical-align:middle;
    height:15px;
}
.hhButton {
  background-color: #f6f6f6; 
}
.hhButtonGreen {
  background-color: #66CD00;
  color: #333;
}
.hhButtonBlue, .true_jsonschema {
  background-color: #009ACD;
  color: #333;
}
.hhButtonRed, .false_jsonschema {
  background-color: #E80C24;
  color: #BDBDBD;
}

.hhButton:hover, .hhButtonGreen:hover, .hhButtonRed:hover, .hhButtonBlue:hover {
  border: 1px solid #aaa;
  background-color: #B1D1E8;
  color: #333;
}
.hhButton a:link, .hhButtonGreen a:link, .hhButtonRed a:link, .hhButtonBlue a:link {
  text-decoration:none;

}
.consoleTextArea {display:block;margin-bottom:0pt;width:100%;height: 700px;background-color: #FFFFF2; border:thin solid #BDBDBD;}

.tooltip {
display: none;
margin-top:10px;
padding: 10px 13px;
text-align: left;
}
div.tooltip ul  {
     list-style: none;

}
div.tooltip ul li:before {
    content: "\00BB \0020";

}

div.historyTextArea textarea { height: 200px;
}

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

          
.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */

}
.control-panel {
  padding: 5px;
}

.on_off{
	display:inline-block;
	min-width:30px;
}
#time-range p {
    color:#333;
}
#time-range p span {
    background: #ccf;
}
.ui-slider-horizontal {
    height: 8px;
    background: #D7D7D7;
    border: 1px solid #BABABA;
    box-shadow: 0 1px 0 #FFF, 0 1px 0 #CFCFCF inset;
    clear: both;
    margin: 8px 0;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    border-radius: 6px;
}
.ui-slider {
    position: relative;
    text-align: left;
}
.ui-slider-horizontal .ui-slider-range {
    top: -1px;
    height: 100%;
}
.ui-slider .ui-slider-range {
    position: absolute;
    z-index: 1;
    height: 8px;
    font-size: .7em;
    display: block;
    border: 1px solid #5BA8E1;
    box-shadow: 0 1px 0 #AAD6F6 inset;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
    background: #81B8F3;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgipZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 0, 50% 100%, color-stop(0%, #A0D4F5), color-stop(100%, #81B8F3));
    background-image: -webkit-linear-gradient(top, #A0D4F5, #81B8F3);
    background-image: -moz-linear-gradient(top, #A0D4F5, #81B8F3);
    background-image: -o-linear-gradient(top, #A0D4F5, #81B8F3);
    background-image: linear-gradient(top, #A0D4F5, #81B8F3);
}
.ui-slider .ui-slider-handle {
    border-radius: 50%;
    background: #F9FBFA;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgipZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
    background-size: 100%;
    background-image: -webkit-gradient(linear, 50% 0, 50% 100%, color-stop(0%, #C7CED6), color-stop(100%, #F9FBFA));
    background-image: -webkit-linear-gradient(top, #C7CED6, #F9FBFA);
    background-image: -moz-linear-gradient(top, #C7CED6, #F9FBFA);
    background-image: -o-linear-gradient(top, #C7CED6, #F9FBFA);
    background-image: linear-gradient(top, #C7CED6, #F9FBFA);
    width: 22px;
    height: 22px;
    -webkit-box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.6), 0 -1px 0 1px rgba(0, 0, 0, 0.15) inset, 0 1px 0 1px rgba(255, 255, 255, 0.9) inset;
    -moz-box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.6), 0 -1px 0 1px rgba(0, 0, 0, 0.15) inset, 0 1px 0 1px rgba(255, 255, 255, 0.9) inset;
    box-shadow: 0 2px 3px -1px rgba(0, 0, 0, 0.6), 0 -1px 0 1px rgba(0, 0, 0, 0.15) inset, 0 1px 0 1px rgba(255, 255, 255, 0.9) inset;
    -webkit-transition: box-shadow .3s;
    -moz-transition: box-shadow .3s;
    -o-transition: box-shadow .3s;
    transition: box-shadow .3s;
}
.ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 22px;
    height: 22px;
    cursor: default;
    border: none;
    cursor: pointer;
}
.ui-slider .ui-slider-handle:after {
    content:"";
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    top: 50%;
    margin-top: -4px;
    left: 50%;
    margin-left: -4px;
    background: #30A2D2;
    -webkit-box-shadow: 0 1px 1px 1px rgba(22, 73, 163, 0.7) inset, 0 1px 0 0 #FFF;
    -moz-box-shadow: 0 1px 1px 1px rgba(22, 73, 163, 0.7) inset, 0 1px 0 0 white;
    box-shadow: 0 1px 1px 1px rgba(22, 73, 163, 0.7) inset, 0 1px 0 0 #FFF;
}
.ui-slider-horizontal .ui-slider-handle {
    top: -.5em;
    margin-left: -.6em;
}
.ui-slider a:focus {
    outline:none;
}