/* font-size on the custom_simple tooltip */

/* The rest is styling for inside the tooltips */
.t_Content_light .hrFull,
.t_Content_lightBordered .hrFull {
  background: #dfdfdf;
  height: 1px;
  margin-bottom: 10px;
}

.custom-white-tooltip {
  width: 280px;
}
.custom-white-tooltip .padder {
  padding: 10px;
  float: left;
  width: 260px;
}
.custom-white-tooltip h1 {
  font: bold 11px/30px Arial, "HelveticaNeue", "Helvetica Neue", "HelveticaNeueRoman", "HelveticaNeue-Roman", "Helvetica Neue Roman", Helvetica, Arial, sans-serif;
  float: left;
  color: #232323;
  text-shadow: 0 1px 0 rgba(255,255,255,1);
  margin-bottom: 0;
  text-transform: uppercase;
}
.custom-white-tooltip .top {
  float: left;
  width: 100%;
  height: 30px;
  margin-bottom: 0px;
  background-color: #d3d3d3;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#e6e6e6), to(#d3d3d3));
  background-image: -webkit-linear-gradient(top, #e6e6e6, #d3d3d3);
  background-image:    -moz-linear-gradient(top, #e6e6e6, #d3d3d3);
  background-image:      -o-linear-gradient(top, #e6e6e6, #d3d3d3);
  background-image:         linear-gradient(to bottom, #e6e6e6, #d3d3d3);
  border-bottom: 1px solid #b0b0b0;
  position: relative;
}
.custom-white-tooltip .top .padder { padding: 0 10px; }
.custom-white-tooltip .bottom {
  float: left;
  clear: both;
  width: 100%;
}
.custom-white-tooltip .top .close {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 22px;
  height: 18px;
  background-image: url('/images/tipped/demonstrations/icon/customize/x.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  cursor: pointer;
}
.custom-white-tooltip .top .close:hover { background-position: 0 -18px; }


/* Hummingbird */
.t_Content_light .HummingbirdDemo a { color: #379c51; }
.t_Content_light .HummingbirdDemo a:hover { color: #2dac4e; }
.HummingbirdDemo {
  font-size: 11px;
}
.HummingbirdDemo h1 {
  font-size: 15px;
  line-height: 23px;
  margin-bottom: 5px;  
}
.HummingbirdDemo .preview {
  float: left;
  width: 140px;
  height: 182px;
  margin-right: 10px;
  position: relative;
}
.HummingbirdDemo .preview img {
  float: left;
}
.HummingbirdDemo .border-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid rgba(0,0,0,.2);
}
.HummingbirdDemo .info {
  float: left;
  width: 290px;
  padding-left: 10px;
  border-left: 1px solid #ccc;
}
.HummingbirdDemo .credits { font-size: 10px; color: #666; }



.onShowDemo {
  float: left;
  width: 275px;
}
.onShowDemo .description { margin-bottom: 10px; }
.onShowDemo .hrFull { margin-bottom: 5px; height: 1px; background: #ccc; }
.onShowDemo label {
  float: left;
  line-height: 23px;
  color: #666;
  width: 100%;
  clear: both;
}
.onShowDemo input[type='text'],
.onShowDemo input[type='password'] {
  float: left;
  clear: both;
  width: 242px;
  margin-bottom: 8px;
}

.googleMapsDemo {
  float: left;
  width: 260px;
}
.googleMapsDemo .map {
  float: left;
  height: 200px;
  width: 258px;
  border: 1px solid #b4b4b4;
}
.googleMapsDemo .hrFull { height: 1px; overflow: hidden;}



/* UI demo /\ */
.UIDemo {
  float: left;
  width: 166px;
}
.UIDemo .description { 
  width: 145px;
  padding: 5px;
}
.UIDemo .description,
.UIDemo .hrFull { margin-bottom: 5px; }
.UIDemo .selectStatus {
  float: left;
  clear: both;
  width: 100%;
  position: relative;
}
.UIDemo .selectStatus a {
  float: left;
  clear: both;
  color: #454545;
  padding: 8px;
  width: 150px;
  height: 15px;
  color: #454545;
  line-height: 18px;
  text-decoration: none;
  background: url("/images/blank.gif");
  position: relative;
  cursor: pointer;
}
.UIDemo .selectStatus a:hover { cursor: pointer; background: #f2f2f2; color: #333; text-decoration: none;}
.UIDemo .selectStatus a.selected { background: #dceafa; color: #0467d4;}
.UIDemo .icon,
#demo_events_ui .icon {
  position: absolute;
  top: 50%;
  margin-top: -3px;
  height: 6px;
  width: 6px;
  right: 10px;
  background: #a0a0a0;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.UIDemo .away .icon,
#demo_events_ui .away .icon { background: #f26522; }
.UIDemo .busy .icon,
#demo_events_ui .busy .icon { background: #ed1c24; }
.UIDemo .online .icon,
#demo_events_ui .online .icon { background: #00c814; }

#UIDemoTarget, #demo_events_ui { position: relative; }
#demo_events_ui .image {
  float: left;
  width: 72px;
  height: 32px;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-image: url('/images/tipped/demonstrations/icon_customize_ui.jpg');
}
#demo_events_ui.active { border-color: #bababa; }
#demo_events_ui.active .image {
  background-position: 0 -32px;
}


/*
 * Artist (diddy/kanye)
 */
.AjaxParametersDemo {
  float: left;
  width: 300px;
  font-size: 10px;
}
.AjaxParametersDemo .description { margin-bottom: 5px; }
.AjaxParametersDemo .info {
  float: left; 
  padding-left: 10px;
  border-left: 1px solid #ccc;
  width: 217px;
}
.AjaxParametersDemo .hrFull { margin-top: 10px; height: 1px; margin-bottom: 10px; }
.AjaxParametersDemo h1 { color: #333; font-size: 15px; line-height: 20px; margin-bottom: 3px; }
.AjaxParametersDemo .albumCount {
  float: left;
  clear: both;
  width: 100%;
  color: #666;
  line-height: 13px;
  margin-bottom: 6px;
}
.AjaxParametersDemo .border-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid rgba(0,0,0,.2);
}
.AjaxParametersDemo .avatar {
  float: left;
  height: 60px;
  width: 60px;
  margin-right: 10px;
  position: relative;
}
.AjaxParametersDemo .avatar img {
  float: left;
}
.AjaxParametersDemo .albums {
  float: left;
  clear: both;
  width: 100%;
}
.AjaxParametersDemo .albums .album { 
  float: left;
  height: 18px;
  width: 18px;
  margin-right: 5px;
  position: relative;
}
.AjaxParametersDemo .albums .album img { float: left; }
.AjaxParametersDemo .albums .more {
  float: left;
  cursor: pointer;
  height: 18px;
  width: 46px;
  background: url('/images/tipped/demonstrations/artists/button_more.png') 0px 0px no-repeat;
  *background: none;
  filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/tipped/demonstrations/artists/button_more.png', sizingMethod='scale');
}


.noCacheDemo {
  float: left;
  width: 320px;
}
.noCacheDemo .countline { color: #fff; font-size: 13px; margin-bottom: 6px; }
.noCacheDemo .hrFull { background: #315787; height: 1px; margin-bottom: 6px; }
.noCacheDemo .description { margin-bottom: 5px; }


.SpinnersDemo {
  float: left;
  width: 190px;
}
.SpinnersDemo .hrFull { margin-bottom: 10px; background: #666; height: 1px;}
.SpinnersDemo .description { margin-bottom: 10px; }

.SpinnersDemo .spinners {
  float: left;
  width: 185px;
  height: 32px;
  margin-bottom: 5px;
  clear: both;
}
.SpinnersDemo .spinner {
  float: left;
  margin-right: 5px;
  width: 32px;
  height: 32px;
  overflow: hidden;
}
.SpinnersDemo .rightmost { margin-right: 0; }

#inlineDemonstration p { margin-bottom: 0px; }

.removeAllDemo { }
.removeAllDemo .question { float: left; line-height: 30px; margin-right: 10px;}
.removeAllDemo .button { float: left; min-width: 1px; width: auto; float: none; display: inline;
}

#demo_api_remove a,
#demo_api_remove a.disabled:hover {
  background-repeat: no-repeat;
  background-position: 0 0;
  background-image: url('/images/tipped/demonstrations/icon_api_removeall.jpg');
}
#demo_api_remove { float: left; width: 72px; height: 32px; }
#demo_api_remove a:hover {
  background-position: 0 -32px;
}

