html, body {
   width: 100%;
   height: 100%;
}

body {
   font-family: Arial, Helvetica, "Trebuchet MS", Tahoma, sans-serif;
   font-size: 12px;
   color: #333;
   background: #e9e9e9;
   margin: 0;
   padding: 0;
}

ul {
   list-style: none;
}

a {
   color: #4895c9;
}

p, h2 {
   margin: 0;
   font-size: 110%;
   line-height: 150%;
}

.ui-text-unwarp{
   width: 193px;
   word-wrap: break-word;
   word-break: normal;
   padding-bottom: 8px;
}

.ui-header {
   padding: 1em 2em;
}

.ui-align-middle {
   vertical-align: middle;
}

.ui-view-icon {
   width: 48px;
   height: 48px;
}

.ui-view-logo {
   margin-left: 1em;
   height: 30px;
}

.ui-body {
   border-top: 1px solid rgba(255, 255, 255, .18);
}

.ui-content {
   width: 80%;
   min-width: 900px;
   margin: 3em auto;
}

.ui-indent {
   margin-left: 4em;
}

.ui-align-center {
   margin: 0 auto;
   text-align: center;
}

.ui-corner-all {
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 20px;
}

.ui-list {
   margin: 2em auto 4em auto;
   padding: 0;
   min-width: 70em;
}

.ui-list > li, .ui-list-item,  .ui-list-block, .ui-list-item span {
   display: -moz-inline-stack;
   position: relative;
   display: inline-block;
   zoom: 1;
   *display: inline;
}

.ui-list-item {
   margin: 1em 6em;
   text-align: center;
   text-decoration: none;
   border: 15px solid #efefef;
   background-color: #efefef;
   -webkit-box-shadow: 1px 1px 4px rgba(0,0,0,.5);
   -moz-box-shadow: 1px 1px 4px rgba(0,0,0,.5);
   box-shadow: 1px 1px 4px rgba(0,0,0,.5);
}

.ui-list-block {
   padding: 1em 3em;
   background: #fff;
   font-weight: bold;
   color: #333;
   background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dfdfdf));
   background-image: -webkit-linear-gradient(#fff, #dfdfdf);
   background-image: -moz-linear-gradient(#fff, #dfdfdf);
   background-image: -ms-linear-gradient(#fff, #dfdfdf);
   background-image: -o-linear-gradient(#fff, #dfdfdf);
   background-image: linear-gradient(#fff, #dfdfdf);
   text-decoration: none;
   border: 1px solid #ccc;
}

.ui-list-block:hover {
   text-decoration: underline;
}

.ui-list-title {
   text-shadow: 1px 1px 1px rgba(0, 0, 0, .30);
}

.ui-native-client, .ui-web-client {
   width: 192px;
   height: 192px;
   margin-bottom: 1em;
}

.ui-native-client {
   background: url(../resources/icons/download-icon.png?v=3003747);
}

.ui-web-client {
   background: url(../resources/icons/mac_desktop.png?v=3003747);
}

.ui-margin-top {
   margin-top: 8em;
}

.ui-hidden {
   display: none;
}

.ui-strip {
   width: 100%;
   height: 2px;
   background: url(../resources/icons/ribbon.png?v=3003747) repeat-x;
}

.ui-header-bottom-up {
   height: 1px;
   background-color: #c0c0c0;
}

.ui-header-bottom-down {
   height: 1px;
   background-color: rgba(255, 255, 255, .28);
}

.ui-view-logo {
   width: 160px;
   height: 20px;
}

.ui-register-link {
   color: #333;
}

.ui-register-title {
   padding: 10px 0;
   border-bottom: solid 1px #aaa;
}

.ui-register-text {
   font-size:12px;
}

.ui-align-left {
   width: 730px;
   padding-left: 72px;
   margin: 10px auto 20px 5%;
}

@-webkit-keyframes ui-loadbar {
   from {
      background-position: 40px 0;
   }
   to {
      background-position: 0 0;
   }
}

.ui-progress-bar {
   text-align: center;
   background-color: #e9e9e9;
   border-radius: 8px;
   width: 100%;
}

.ui-progress-bar div {
   background-color: #428bca;
   width: 100%;
   height: 20px;
   border-radius: 5px;
   -webkit-animation: ui-loadbar 2s linear infinite;
   background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
   background-size: 40px 40px;
}

#nativeClient:focus,
#webClient:focus {
  outline: 0;
  border: 2px solid rgb(36, 155, 213);
}