

/* ---- plugins/UiConfig/media/css/Config.css ---- */


body { background-color: #EDF2F5; font-family: Roboto, 'Segoe UI', Arial, 'Helvetica Neue'; margin: 0px; padding: 0px; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden ; }
h1, h2, h3, h4 { font-family: 'Roboto', Arial, sans-serif; font-weight: 200; font-size: 30px; margin: 0px; padding: 0px }
h2 { margin-top: 10px; }
h3 { font-weight: normal }
h1 { background: -webkit-linear-gradient(33deg,#af3bff,#0d99c9);background: -moz-linear-gradient(33deg,#af3bff,#0d99c9);background: -o-linear-gradient(33deg,#af3bff,#0d99c9);background: -ms-linear-gradient(33deg,#af3bff,#0d99c9);background: linear-gradient(33deg,#af3bff,#0d99c9); color: white; padding: 16px 30px; }
a { color: #9760F9 }
a:hover { text-decoration: none }

.link { background-color: transparent; outline: 5px solid transparent; -webkit-transition: all 0.3s ; -moz-transition: all 0.3s ; -o-transition: all 0.3s ; -ms-transition: all 0.3s ; transition: all 0.3s  }
.link:active { background-color: #EFEFEF; outline: 5px solid #EFEFEF; -webkit-transition: none ; -moz-transition: none ; -o-transition: none ; -ms-transition: none ; transition: none  }

.content { max-width: 800px; margin: auto; background-color: white; padding: 60px 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box ; padding-bottom: 150px; }
.section { margin: 0px 10%; }
.config-items { font-size: 19px; margin-top: 25px; margin-bottom: 75px; }
.config-item { -webkit-transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1); -moz-transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1); -o-transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1); -ms-transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1); transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1) ; position: relative; padding-bottom: 20px; padding-top: 10px; }
.config-item.hidden { opacity: 0; height: 0px; padding: 0px; }
.config-item .title { display: inline-block; line-height: 36px; }
.config-item .title h3 { font-size: 20px; font-weight: lighter; margin-right: 100px; }
.config-item .description { font-size: 14px; color: #666; line-height: 24px; }
.config-item .value { display: inline-block;  white-space: nowrap; }
.config-item .value-right { right: 0px; position: absolute; }
.config-item .value-fullwidth { width: 100% }
.config-item .marker {
	font-weight: bold; text-decoration: none; font-size: 25px; position: absolute; padding: 2px 15px; line-height: 32px;
	opacity: 0; pointer-events: none; -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -o-transition: all 0.6s; -ms-transition: all 0.6s; transition: all 0.6s ; -webkit-transform: scale(2); -moz-transform: scale(2); -o-transform: scale(2); -ms-transform: scale(2); transform: scale(2) ; color: #9760F9;
}
.config-item .marker.visible { opacity: 1; pointer-events: all; -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1) ; }
.config-item .marker.changed { color: #2ecc71; }
.config-item .marker.pending { color: #ffa200; }


.input-text, .input-select { padding: 8px 18px; border: 1px solid #CCC; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px ; font-size: 17px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box ; }
.input-text:focus, .input-select:focus { border: 1px solid #3396ff; outline: none; }
.input-textarea {  overflow-x: auto; overflow-y: hidden; white-space: pre; line-height: 22px; }

.input-select { width: initial; font-size: 14px; padding-right: 10px; padding-left: 10px; }

.value-right .input-text { text-align: right; width: 100px; }
.value-fullwidth .input-text { width: 100%; font-size: 14px; font-family: 'Segoe UI', Arial, 'Helvetica Neue'; }
.value-fullwidth { margin-top: 10px; }

/* Checkbox */
.checkbox-skin { background-color: #CCC; width: 50px; height: 24px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px ; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out ; display: inline-block; }
.checkbox-skin:before {
	content: ""; position: relative; width: 20px; background-color: white; height: 20px; display: block; -webkit-border-radius: 100%; -moz-border-radius: 100%; -o-border-radius: 100%; -ms-border-radius: 100%; border-radius: 100% ; margin-top: 2px; margin-left: 2px;
	-webkit-transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86); -moz-transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86); -o-transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86); -ms-transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: all 0.5s cubic-bezier(0.785, 0.135, 0.15, 0.86) ;
}
.checkbox { font-size: 14px; font-weight: normal; display: inline-block; cursor: pointer; margin-top: 5px; }
.checkbox .title { display: inline; line-height: 30px; vertical-align: 4px; margin-left: 11px }
.checkbox.checked .checkbox-skin:before { margin-left: 27px; }
.checkbox.checked .checkbox-skin { background-color: #2ECC71 }

/* Bottom */

.bottom {
	width: 100%; text-align: center; background-color: #ffffffde; padding: 25px; bottom: -120px;
	-webkit-transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1); -moz-transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1); -o-transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1); -ms-transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1); transition: all 0.8s cubic-bezier(0.86, 0, 0.07, 1) ; position: fixed; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden ; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box ;
}
.bottom-content { max-width: 750px; width: 100%; margin: 0px auto; }
.bottom .button { float: right; }
.bottom.visible { bottom: 0px; -webkit-box-shadow: 0px 0px 35px #dcdcdc; -moz-box-shadow: 0px 0px 35px #dcdcdc; -o-box-shadow: 0px 0px 35px #dcdcdc; -ms-box-shadow: 0px 0px 35px #dcdcdc; box-shadow: 0px 0px 35px #dcdcdc ; }
.bottom .title { padding: 10px 10px; color: #363636; float: left; text-transform: uppercase; letter-spacing: 1px; }
.bottom .title:before { content: "•"; display: inline-block; color: #2ecc71; font-size: 31px; vertical-align: -7px; margin-right: 8px; line-height: 25px; }
.bottom-restart .title:before { color: #ffa200; }

.animate { -webkit-transition: all 0.3s ease-out !important; -moz-transition: all 0.3s ease-out !important; -o-transition: all 0.3s ease-out !important; -ms-transition: all 0.3s ease-out !important; transition: all 0.3s ease-out !important ; }
.animate-back { -webkit-transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important; -moz-transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important; -o-transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important; -ms-transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important; transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important ; }
.animate-inout { -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) !important; -moz-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) !important; -o-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) !important; -ms-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) !important; transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) !important ; }


/* ---- plugins/UiConfig/media/css/button.css ---- */


/* Button */
.button {
	background-color: #FFDC00; color: black; padding: 10px 20px; display: inline-block; background-position: left center;
	-webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px ; border-bottom: 2px solid #E8BE29; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; transition: all 0.5s ease-out ; text-decoration: none;
}
.button:hover { border-color: white; border-bottom: 2px solid #BD960C; -webkit-transition: none ; -moz-transition: none ; -o-transition: none ; -ms-transition: none ; transition: none  ; background-color: #FDEB07 }
.button:active { position: relative; top: 1px }
.button.loading {
	color: rgba(0,0,0,0); background: #999 url(../img/loading.gif) no-repeat center center;
	-webkit-transition: all 0.5s ease-out  ; -moz-transition: all 0.5s ease-out  ; -o-transition: all 0.5s ease-out  ; -ms-transition: all 0.5s ease-out  ; transition: all 0.5s ease-out   ; pointer-events: none; border-bottom: 2px solid #666
}
.button.disabled { color: #DDD; background-color: #999;  pointer-events: none; border-bottom: 2px solid #666 }


/* ---- plugins/UiConfig/media/css/fonts.css ---- */


/* Base64 encoder: http://www.motobit.com/util/base64-decoder-encoder.asp */
/* Generated by Font Squirrel (http://www.fontsquirrel.com) on January 21, 2015 */


@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src:
        local('Roboto'),
        url(data:application/x-font-woff;charset=utf-8;base64,[encoded data, 35452 characters]) format('woff');
}

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: bold;
  src:
  	local('Roboto Medium'),
  	url(data:application/x-font-woff;charset=utf-8;base64,[encoded data, 24188 characters]) format('woff'),
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 200;
    src:
        local('Roboto Light'),
        url(data:application/x-font-woff;charset=utf-8;base64,[encoded data, 23420 characters]) format('woff');
}