.progress{
text-align:right;
margin-right:8px;
}
.progressIcon{
margin:0 6px 0 0;
}
.progressInfo{
color:white !important;
background-color:#3C71B3 !important;
}
.progressInfo a{
text-decoration:underline;
}
.progressWarning{
color:black !important;
background-color:#efc100 !important;
border:1px solid #efc100 !important;
}
.progressError{
color:white !important;
background-color:#e0182d !important;
border:1px solid #e0182d !important;
}
.progressNormal{
color:white !important;
background-color:#458500 !important;
border:1px solid #458500 !important;
}
.progressPane{
vertical-align:middle;
margin-right:24px;
background-position:0 0;
text-align:right;
border:0;
width:16px;
height:16px;
}
.progressWatchWrapper{
width:16px;
height:16px;
margin:3px;
}
.progressWatch{
cursor:pointer;
text-align:center;
position:relative;
display:inline-block;
background:transparent;
border:none;
margin-top:-2px;
margin-right:6px;
margin-left:12px;
padding:1px;
flex:0 0 auto;
-ms-flex:0 0 auto;
-webkit-flex:0 0 auto;
}
.watchButton{
border-top:1px solid #626e76;
position:relative;
top:0;
width:3px;
left:calc(50% - 2px);
height:0px;
border-radius:40%;
transition:top 0.5s ease,border-color 1s ease;
}
.watchBody{
position:relative;
left:1px;
top:1px;
width:calc(100% - 5px);
height:calc(100% - 5px);
background:transparent;
border:1px solid #626e76;
-moz-border-radius:50%;
-webkit-border-radius:50%;
border-radius:50%;
transition:border-color 1s ease;
}
.watchBody span.hand{
position:absolute;
border-radius:40%;
}
.watchBody .hand.longMinute{
top:1px;
left:5px;
position:absolute;
height:9px;
width:1px;
}
.watchBody .hand.longMinute > .darkSide{
position:absolute;
left:0;
width:1px;
display:block;
border-radius:40%;
height:5px;
background:#626e76;
transition:background-color 1s ease;
}
.watchBody .hand.longHour{
top:5px;
left:2px;
position:absolute;
width:calc(100% - 4px);
height:1px;
}
.watchBody .hand.longHour > .darkSide{
position:absolute;
height:1px;
display:inline-block;
border-radius:40%;
right:0;
width:4px;
background:#626e76;
transition:background-color 1s ease;
}
.progressWatch.running .watchBody .hand{
-webkit-animation:rotate 60s infinite linear;
-moz-animation:rotate 60s infinite linear;
-ms-animation:rotate 60s infinite linear;
-o-animation:rotate 60s infinite linear;
animation:rotate 60s infinite linear;
}
.progressWatch.running .watchBody .hand.longHour{
-webkit-animation-duration:6s;
-moz-animation-duration:6s;
-ms-animation-duration:6s;
-o-animation-duration:6s;
animation-duration:6s;
}
.progressWatch.running .watchBody .hand.longMinute{
-webkit-animation-duration:0.5s;
-moz-animation-duration:0.5s;
-ms-animation-duration:0.5s;
-o-animation-duration:0.5s;
animation-duration:0.5s;
}
.progressWatch.running .watchButton{
border-color:white;
top:1px;
}
.progressWatch.running .watchBody{
border-color:white;
}
.progressWatch.running .watchBody .hand.longHour > .darkSide{
background-color:white;
}
.progressWatch.running .watchBody .hand.longMinute > .darkSide{
background-color:white;
}
.progressWatch.warning .watchButton{
border-color:#d99608;
}
.progressWatch.warning .watchBody{
border-color:#d99608;
background-color:#fce1a9;
}
.progressWatch.warning .watchBody .hand.longHour > .darkSide{
background-color:#d99608;
}
.progressWatch.warning .watchBody .hand.longMinute > .darkSide{
background-color:#d99608;
}
.progressWatch.error .watchButton{
border-color:#b94a48;
}
.progressWatch.error .watchBody{
border-color:#b94a48;
background-color:#EFA1A7;
}
.progressWatch.error .watchBody .hand.longHour > .darkSide{
background-color:#b94a48;
}
.progressWatch.error .watchBody .hand.longMinute > .darkSide{
background-color:#b94a48;
}
@-webkit-keyframes rotate{
0%{-webkit-transform:rotate(0deg);}
100%{-webkit-transform:rotate(360deg);}
}
@-moz-keyframes rotate{
0%{-moz-transform:rotate(0deg);}
100%{-moz-transform:rotate(360deg);}
}
@keyframes rotate{
0%{transform:rotate(0deg);}
100%{transform:rotate(360deg);}
}
.progressWarning .progressPane_running,.progressWarning .core-sprite-progress{
border-color:#f0ad4e;
}
.progressError .progressPane_running,.progressError .core-sprite-progress{
border-color:#b94a48;
}
.progressNormal .progressPane_running,.progressNormal .core-sprite-progress{
border-color:#468847;
}
.progressPane_running_dialog{
vertical-align:middle;
margin:2px 8px 2px 2px;
background-position:0 0;
text-align:right;
border:0;
width:16px;
height:16px;
}
.progressPane_finished_dialog{
vertical-align:middle;
background:url(../images/none.png) no-repeat center;
width:16px;height:16px;
}
.progressPane_empty{
}
.notificationShow{
color:white;
background-color:#458500;
bottom:0;
position:fixed;
float:left;
margin-left:20%;
margin-right:auto;
width:60%;
max-height:1000px;
overflow:hidden;
padding-top:5px;
padding-bottom:5px;
padding-left:5px;
z-index:7000;
border-top-right-radius:5px;
border-top-left-radius:5px;
border:none;
transition:bottom 0.7s;
-webkit-transition:bottom 0.7s;
-moz-transition:bottom 0.7s;
-ms-transition:bottom 0.7s;
-o-transition:bottom 0.7s;
}
.notificationShow button{
display:block;
}
.notificationHide{
color:white;
background-color:#458500;
bottom:-45px;
position:fixed;
text-align:center;
float:left;
margin-left:20%;
margin-right:auto;
width:60%;
box-shadow:0 2px 0 rgba(0,0,0,0.1);
max-height:1000px;
overflow:hidden;
padding-left:5px;
z-index:300;
border-top-right-radius:5px;
border-top-left-radius:5px;
transition:bottom 0.7s;
-webkit-transition:bottom 0.7s;
-moz-transition:bottom 0.7s;
-ms-transition:bottom 0.7s;
-o-transition:bottom 0.7s;
}
.notificationHide button{
display:none;
}
.notifications a{
color:white;
text-decoration:underline;
}
.notifications{
display:inline-block;
text-align:left;
}
.notifications p:first-child{
margin-top:0;
}
.notifications p:last-child{
margin-bottom:0;
}
