/* Search and clear icons in text areas */

span.icon-wrap
{
  position: relative;
  overflow: visible;
  clear: both;
  -ms-zoom: 1;
  zoom: 1;
}

  span.icon-wrap > span.icon
  {
    position: absolute;
    top: 0; bottom: 0;
    margin: auto;
    right: 1em;
    z-index: 999999;
    display: block;
    width: 24px;
    height: 24px;
    opacity: 0.5;
    filter: alpha(opacity=50);
    -ms-zoom: 1;
    zoom: 1;
  }

  span.icon-wrap span.icon.search
  {
    /*background: url("../images/glyphicons-halflings.png") no-repeat -44px 5px;*/
  }

  span.icon-wrap span.icon.clear
  {
    background: url("../images/glyphicons-halflings.png") no-repeat -44px -91px;;
    cursor: pointer;
  }

    span.icon-wrap span.icon.clear:hover, span.icon-wrap span.icon.clear:active
    {
      opacity: 1;
      filter: alpha(opacity=100);
    }

/* 
  Allow angular.js to be loaded in body, hiding cloaked elements until 
  templates compile.  The !important is important given that there may be 
  other selectors that are more specific or come later and might alter display.  
 */
[ng\:cloak], [ng-cloak], [data-ng-cloak], .ng-cloak, .data-ng-cloak
{
  display: none !important;
}


.windows8
{
  position: relative;
  width: 50px;
  height: 50px;
  margin: 0 auto;
}

.windows8.large
{
  width: 100px;
  height: 100px;
}

.windows8.small
{
  width: 15px;
  height: 15px;
}

  .windows8 .wBall
  {
    position: absolute;
    width: 48px;
    height: 48px;
    opacity: 0;
    -moz-transform: rotate(225deg);
    -moz-animation: orbit 3.8499999999999996s infinite;
    -webkit-transform: rotate(225deg);
    -webkit-animation: orbit 3.8499999999999996s infinite;
    -ms-transform: rotate(225deg);
    -ms-animation: orbit 3.8499999999999996s infinite;
    -o-transform: rotate(225deg);
    -o-animation: orbit 3.8499999999999996s infinite;
    transform: rotate(225deg);
    animation: orbit 3.8499999999999996s infinite;
  }

  .windows8.large .wBall
  {
    width: 95px;
    height: 95px;
  }

  .windows8.small .wBall
  {
    width: 14px;
    height: 14px;
  }

    .windows8 .wBall .wInnerBall
    {
      position: absolute;
      width: 6px;
      height: 6px;
      background: #660000;
      left: 0px;
      top: 0px;
      -moz-border-radius: 6px;
      -webkit-border-radius: 6px;
      -ms-border-radius: 6px;
      -o-border-radius: 6px;
      border-radius: 6px;
    }

    .windows8.large .wBall .wInnerBall
    {
      width: 13px;
      height: 13px;
      -moz-border-radius: 13px;
      -webkit-border-radius: 13px;
      -o-border-radius: 13px;
      -ms-border-radius: 13px;
      border-radius: 13px;
    }    
    
    .windows8.small .wBall .wInnerBall
    {
      width: 2px;
      height: 2px;
      -moz-border-radius: 2px;
      -webkit-border-radius: 2px;
      -o-border-radius: 2px;
      -ms-border-radius: 2px;
      border-radius: 2px;
    }

  .windows8 #wBall_1
  {
    -moz-animation-delay: 0.84s;
    -webkit-animation-delay: 0.84s;
    -ms-animation-delay: 0.84s;
    -o-animation-delay: 0.84s;
    animation-delay: 0.84s;
  }

  .windows8 #wBall_2
  {
    -moz-animation-delay: 0.17s;
    -webkit-animation-delay: 0.17s;
    -ms-animation-delay: 0.17s;
    -o-animation-delay: 0.17s;
    animation-delay: 0.17s;
  }

  .windows8 #wBall_3
  {
    -moz-animation-delay: 0.34s;
    -webkit-animation-delay: 0.34s;
    -ms-animation-delay: 0.34s;
    -o-animation-delay: 0.34s;
    animation-delay: 0.34s;
  }

  .windows8 #wBall_4
  {
    -moz-animation-delay: 0.5s;
    -webkit-animation-delay: 0.5s;
    -ms-animation-delay: 0.5s;
    -o-animation-delay: 0.5s;
    animation-delay: 0.5s;
  }

  .windows8 #wBall_5
  {
    -moz-animation-delay: 0.67s;
    -webkit-animation-delay: 0.67s;
    -ms-animation-delay: 0.67s;
    -o-animation-delay: 0.67s;
    animation-delay: 0.67s;
  }

@-moz-keyframes orbit
{
  0%
  {
    opacity: 1;
    z-index: 99;
    -moz-transform: rotate(180deg);
    -moz-animation-timing-function: ease-out;
  }

  7%
  {
    opacity: 1;
    -moz-transform: rotate(300deg);
    -moz-animation-timing-function: linear;
    -moz-origin: 0%;
  }

  30%
  {
    opacity: 1;
    -moz-transform: rotate(410deg);
    -moz-animation-timing-function: ease-in-out;
    -moz-origin: 7%;
  }

  39%
  {
    opacity: 1;
    -moz-transform: rotate(645deg);
    -moz-animation-timing-function: linear;
    -moz-origin: 30%;
  }

  70%
  {
    opacity: 1;
    -moz-transform: rotate(770deg);
    -moz-animation-timing-function: ease-out;
    -moz-origin: 39%;
  }

  75%
  {
    opacity: 1;
    -moz-transform: rotate(900deg);
    -moz-animation-timing-function: ease-out;
    -moz-origin: 70%;
  }

  76%
  {
    opacity: 0;
    -moz-transform: rotate(900deg);
  }

  100%
  {
    opacity: 0;
    -moz-transform: rotate(900deg);
  }
}

@-webkit-keyframes orbit
{
  0%
  {
    opacity: 1;
    z-index: 99;
    -webkit-transform: rotate(180deg);
    -webkit-animation-timing-function: ease-out;
  }

  7%
  {
    opacity: 1;
    -webkit-transform: rotate(300deg);
    -webkit-animation-timing-function: linear;
    -webkit-origin: 0%;
  }

  30%
  {
    opacity: 1;
    -webkit-transform: rotate(410deg);
    -webkit-animation-timing-function: ease-in-out;
    -webkit-origin: 7%;
  }

  39%
  {
    opacity: 1;
    -webkit-transform: rotate(645deg);
    -webkit-animation-timing-function: linear;
    -webkit-origin: 30%;
  }

  70%
  {
    opacity: 1;
    -webkit-transform: rotate(770deg);
    -webkit-animation-timing-function: ease-out;
    -webkit-origin: 39%;
  }

  75%
  {
    opacity: 1;
    -webkit-transform: rotate(900deg);
    -webkit-animation-timing-function: ease-out;
    -webkit-origin: 70%;
  }

  76%
  {
    opacity: 0;
    -webkit-transform: rotate(900deg);
  }

  100%
  {
    opacity: 0;
    -webkit-transform: rotate(900deg);
  }
}

@-ms-keyframes orbit
{
  0%
  {
    opacity: 1;
    z-index: 99;
    -ms-transform: rotate(180deg);
    -ms-animation-timing-function: ease-out;
  }

  7%
  {
    opacity: 1;
    -ms-transform: rotate(300deg);
    -ms-animation-timing-function: linear;
    -ms-origin: 0%;
  }

  30%
  {
    opacity: 1;
    -ms-transform: rotate(410deg);
    -ms-animation-timing-function: ease-in-out;
    -ms-origin: 7%;
  }

  39%
  {
    opacity: 1;
    -ms-transform: rotate(645deg);
    -ms-animation-timing-function: linear;
    -ms-origin: 30%;
  }

  70%
  {
    opacity: 1;
    -ms-transform: rotate(770deg);
    -ms-animation-timing-function: ease-out;
    -ms-origin: 39%;
  }

  75%
  {
    opacity: 1;
    -ms-transform: rotate(900deg);
    -ms-animation-timing-function: ease-out;
    -ms-origin: 70%;
  }

  76%
  {
    opacity: 0;
    -ms-transform: rotate(900deg);
  }

  100%
  {
    opacity: 0;
    -ms-transform: rotate(900deg);
  }
}

@-o-keyframes orbit
{
  0%
  {
    opacity: 1;
    z-index: 99;
    -o-transform: rotate(180deg);
    -o-animation-timing-function: ease-out;
  }

  7%
  {
    opacity: 1;
    -o-transform: rotate(300deg);
    -o-animation-timing-function: linear;
    -o-origin: 0%;
  }

  30%
  {
    opacity: 1;
    -o-transform: rotate(410deg);
    -o-animation-timing-function: ease-in-out;
    -o-origin: 7%;
  }

  39%
  {
    opacity: 1;
    -o-transform: rotate(645deg);
    -o-animation-timing-function: linear;
    -o-origin: 30%;
  }

  70%
  {
    opacity: 1;
    -o-transform: rotate(770deg);
    -o-animation-timing-function: ease-out;
    -o-origin: 39%;
  }

  75%
  {
    opacity: 1;
    -o-transform: rotate(900deg);
    -o-animation-timing-function: ease-out;
    -o-origin: 70%;
  }

  76%
  {
    opacity: 0;
    -o-transform: rotate(900deg);
  }

  100%
  {
    opacity: 0;
    -o-transform: rotate(900deg);
  }
}

@keyframes orbit
{
  0%
  {
    opacity: 1;
    z-index: 99;
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -moz-animation-timing-function: ease-out;
    -o-animation-timing-function: ease-out;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  7%
  {
    opacity: 1;
    -moz-transform: rotate(300deg);
    -ms-transform: rotate(300deg);
    -o-transform: rotate(300deg);
    -webkit-transform: rotate(300deg);
    transform: rotate(300deg);
    -moz-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    origin: 0%;
  }

  30%
  {
    opacity: 1;
    -moz-transform: rotate(410deg);
    -ms-transform: rotate(410deg);
    -o-transform: rotate(410deg);
    -webkit-transform: rotate(410deg);
    transform: rotate(410deg);
    -moz-animation-timing-function: ease-in-out;
    -o-animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    origin: 7%;
  }

  39%
  {
    opacity: 1;
    -moz-transform: rotate(645deg);
    -ms-transform: rotate(645deg);
    -o-transform: rotate(645deg);
    -webkit-transform: rotate(645deg);
    transform: rotate(645deg);
    -moz-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    origin: 30%;
  }

  70%
  {
    opacity: 1;
    -moz-transform: rotate(770deg);
    -ms-transform: rotate(770deg);
    -o-transform: rotate(770deg);
    -webkit-transform: rotate(770deg);
    transform: rotate(770deg);
    -moz-animation-timing-function: ease-out;
    -o-animation-timing-function: ease-out;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    origin: 39%;
  }

  75%
  {
    opacity: 1;
    -moz-transform: rotate(900deg);
    -ms-transform: rotate(900deg);
    -o-transform: rotate(900deg);
    -webkit-transform: rotate(900deg);
    transform: rotate(900deg);
    -moz-animation-timing-function: ease-out;
    -o-animation-timing-function: ease-out;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    origin: 70%;
  }

  76%
  {
    opacity: 0;
    -moz-transform: rotate(900deg);
    -ms-transform: rotate(900deg);
    -o-transform: rotate(900deg);
    -webkit-transform: rotate(900deg);
    transform: rotate(900deg);
  }

  100%
  {
    opacity: 0;
    -moz-transform: rotate(900deg);
    -ms-transform: rotate(900deg);
    -o-transform: rotate(900deg);
    -webkit-transform: rotate(900deg);
    transform: rotate(900deg);
  }
}