/* minimal styling for the demo */
body {
  background-color: #F5F5F5;
}
.container {
  /*background-color: #FFFFFF;*/
  /*margin: 20px auto;*/
}
.border {
  border-color: #F5F5F5;
  border-style: solid;
  border-width: 0;
}
h2#title {
  padding: 0px 5px;
  font-size: 24px;
  height: 34px;
  line-height: 34px;
  border-bottom: 2px solid #F5F5F5;
  margin: 0;
}
.clearfix {
  clear: both;
}
#kl-container {
  min-height: 580px;
}
#lhs {
  /* make relative so things like tooltips work */
  position: relative;
}
.citimebar {
  border-top: 2px solid #F5F5F5;
}
.cipad {
  padding: 5px 20px 0px;
}

.shadow {
  -moz-box-shadow: 5px 5px 5px #666;
  -webkit-box-shadow: 5px 5px 5px #666;
  box-shadow: 5px 5px 5px #666;
}

.textinset {
  padding: 10px, 10px;
  height: 526px;
}

#details {
  position: absolute;
  z-index:9001;
  display:none;
  margin-left: 0px;
  margin-top: 0px;
}

#editLabel {
  z-index:9001;
  font-family: Ubuntu, Arial, Helvetica, sans-serif;
  padding: 0px;
  margin: 0px;
  position: absolute;
  display: none;
}

#applemenumask {
  position:absolute;
  left:0;
  top:0;
  z-index:9000;
  background-color:none;
  display:none;
}

#calloutmenu {
  /*float: left;*/
  
  position: absolute;
  display: none;
  left:10;
  padding: 0;
  margin: 0;
  z-index: 9002;
}

.triangle-border {
  position:relative;
  padding:15px;
  margin:1em 0 3em;
  border:2px solid rgb(145, 146, 149);
  background:rgba(255, 255, 255, 0.85);
  /* css3 */
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;

  -moz-box-shadow: 2px 2px 2px #666;
  -webkit-box-shadow: 2px 2px 2px #666;
  box-shadow: 2px 2px 2px #666;

  font-size: 14px;
    
}

.triangle-border ul  {
  width: auto;
  padding: 0;
  margin: 0;
  float: left;
}

.triangle-border li  {
  list-style: none;
  background: none;
}

.triangle-border a { outline: none; }

.triangle-border li a:link, .triangle-border li a:visited {
  font-family: Ubuntu, Arial, Helvetica, sans-serif;
  font-size: 18px;
  display: block;
  color: #262626;
  padding: 5px 14px 6px;
  text-decoration: none;
  text-shadow: 0px 1px 1px #fff;
  margin: 1px;
}

.triangle-border li a:hover  {
  cursor: pointer;
  color: #fff;
  text-shadow: 0px -1px 1px #444;
  background-color: rgba(114, 179, 0, 0.85);
}

.triangle-border li:first-child a, .triangle-border ul {
  -moz-border-radius-topleft: 8px;
  -moz-border-radius-topright: 8px;
  -webkit-border-top-left-radius: 8px;
  -webkit-border-top-right-radius: 8px;
}

.triangle-border li:last-child a, .triangle-border ul {
  -moz-border-radius-bottomleft: 8px;
  -moz-border-radius-bottomright: 8px;
  -webkit-border-bottom-left-radius: 8px;
  -webkit-border-bottom-right-radius: 8px;
}

.triangle-border:before {
    content:"";
    position:absolute;
    bottom:-20px; /* value = - border-top-width - border-bottom-width */
    left:40px; /* controls horizontal position */
    border-width:20px 20px 0;
    border-style:solid;
    border-color:#00AEEA transparent;
    /* reduce the damage in FF3.0 */
    display:block; 
    width:0;
}

/* creates the smaller  triangle */
.triangle-border:after {
    content:"";
    position:absolute;
    bottom:-13px; /* value = - border-top-width - border-bottom-width */
    left:47px; /* value = (:before left) + (:before border-left) - (:after border-left) */
    border-width:13px 13px 0;
    border-style:solid;
    border-color:#fff transparent;
    /* reduce the damage in FF3.0 */
    display:block; 
    width:0;
}

/* Variant : for left positioned triangle
------------------------------------------ */

.triangle-border.left {
    margin-left:30px;
}

/* creates the larger triangle */
.triangle-border.left:before {
    top:10px; /* controls vertical position */
    bottom:auto;
    left:-15px; /* value = - border-left-width - border-right-width */
    border-width:8px 15px 8px 0;
    border-color:transparent rgb(145, 146, 149);
}

/* creates the smaller  triangle */
.triangle-border.left:after {
    top:12px; /* value = (:before top) + (:before border-top) - (:after border-top) */
    bottom:auto;
    left:-12px; /* value = - border-left-width - border-right-width */
    border-width:6px 12px 6px 0;
    border-color:transparent #fff;
}


i.icon-chevron-down, 
i.icon-circle-arrow-left, 
i.icon-circle-arrow-right, 
i.icon-plus-sign, 
i.icon-search,
i.icon-resize-full  {
  background-image: url(images/glyphicons-halflings.png);
}


.framework-fieldset input, .framework-fieldset .btn.btn-kl {
  float: left;
}

.framework-fieldset .btn.btn-kl {
  clear:left;
} 