/*============================================================================
 |
 | Copyright © IFM Infomaster. All rights reserved.
 |
 ===========================================================================*/

/* Version: 1.0 */

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

  Reset

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/*
html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, p,
blockquote, fieldset, input, abbr, article, aside, command, details,
figcaption, figure, footer, header, hgroup, mark, meter, nav,
output, progress, section, summary, time {
    margin  : 0;
    padding : 0;
}
*/

/*
h1, h2, h3, h4, h5, h6, pre, code, address, caption, cite, code,
em, strong, th, figcaption, input {
    font-weight : normal;
    font-style  : normal;
}
*/

/*
fieldset, iframe, img {
    border : none;
}
*/

/*
caption, th { 
    text-align : left;
}
*/

/*
table { 
    border-collapse : collapse;
    border-spacing  : 0;
}

input, select {
    box-sizing : border-box;
}
*/

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

  Defaults

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/*
html {
    background-color: #fff;
}
*/
/*
body, input, button, select {
	font: 16px Cuprum, Arial, Helvetica, sans-serif;
    -webkit-font-smoothing : antialiased;
}


body {
    background-color : transparent;
    color            : #333;
}
*/
/*
button {
    border : none;
    background-color : #7bf;
    color            : #fff;
    font-size      : 12px;
    letter-spacing : 1px;
    text-transform : uppercase;
    cursor  : pointer;
    margin  : 2px;
    padding : 10px 20px;
    border-radius : 2px;
}

button:hover {
    background-color : #4197ee;
}

button:disabled {
    cursor : default;
    color            : #69c;
    background-color : transparent;
}

button:focus, input:focus, select:focus, textarea:focus {
    outline : none;
}

label, input, select {
    font-size : 18px;
    min-width : 20px;
}

input[type='checkbox'] {
    float : right;
}

small {
    font-size : 10px;
}*/

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

  Common Element Features

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

.hidden {
    display: none;
}

.unselectable, .toolbar-body {
    -moz-user-select    : none;
    -ms-user-select     : none;
    -webkit-user-select : none;
    user-select         : none;
}

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

  Page Elements

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

#page-layout {
    position : absolute;
    left     : 0;
    top      : 0;
    right    : 0;
    bottom   : 0;
}

.dialog-definitions {
    display: none !important;
}

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

  Generic Animations

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

.accent-light-effect, .accent-light-effect:hover {
    background-image: -moz-linear-gradient(-45deg, #f70 0%, #f70 40%, #ffffff 50%, #f70 60%, #f70 100%);
    background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#f70), color-stop(40%,#f70), color-stop(50%,#ffffff), color-stop(60%,#f70), color-stop(100%,#f70));
    background-image: -webkit-linear-gradient(-45deg, #f70 0%,#f70 40%,#ffffff 50%,#f70 60%,#f70 100%);
    background-image: -o-linear-gradient(-45deg, #f70 0%,#f70 40%,#ffffff 50%,#f70 60%,#f70 100%);
    background-image: linear-gradient(-45deg, #f70 0, #f70 40%, #ffffff 50%, #f70 60%, #f70 100%);
    filter :     progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#f70', EndColorStr='#f70', GradientType=1);
    background-repeat   : no-repeat;
    background-position : 0px;
    background-size     : 2000px;
    background-color    : #f70;
    -moz-animation    : light-animation 10s infinite ease-in-out;
    -o-animation      : light-animation 10s infinite ease-in-out;
    -webkit-animation : light-animation 10s infinite ease-in-out;
    animation         : light-animation 10s infinite ease-in-out;
}

@-moz-keyframes light-animation {
    0%   { background-position : -10000px; }
    100% { background-position : 0; }
}

@-o-keyframes light-animation {
    0%   { background-position : -10000px; }
    100% { background-position : 0; }
}

@-webkit-keyframes light-animation {
    0%   { background-position : -10000px; }
    100% { background-position : 0; }
}

@keyframes light-animation {
    0%   { background-position : -10000px; }
    100% { background-position : 0; }
}

.slide-rtl {
    position : relative;
    left: 0;
    -moz-animation    : slide-rtl-animation 400ms ease-in-out;
    -o-animation      : slide-rtl-animation 400ms ease-in-out;
    -webkit-animation : slide-rtl-animation 400ms ease-in-out;
    animation         : slide-rtl-animation 400ms ease-in-out;
}

@-moz-keyframes slide-rtl-animation {
    0%   { left: 100%; }
}

@-o-keyframes slide-rtl-animation {
    0%   { left: 100%; }
}

@-webkit-keyframes slide-rtl-animation {
    0%   { left: 100%; }
}

@keyframes slide-rtl-animation {
    0%   { left: 100%; }
}

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

  Dialog Elements and Animations

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

.dialog {
    position : absolute;
    left     : 25%;
    right    : 25%;
    top      : 25%;
    bottom   : 25%;
    overflow : hidden;

    border: 0px;
    border-bottom: 1px solid #333;
    z-Index: 1010;

    animation: dialog-animation-x 400ms ease-out,
               dialog-animation-y 400ms ease-out 400ms;
    animation-fill-mode: both;
    -webkit-animation: dialog-animation-x 400ms ease-out,
                       dialog-animation-y 400ms ease-out 400ms;
    -webkit-animation-fill-mode: both;
}

@keyframes dialog-animation-x {
    from { left: 50%; right: 50%; }
}

@-webkit-keyframes dialog-animation-x {
    from { left: 50%; right: 50%; }
}

@keyframes dialog-animation-y {
    from { top: 50%; bottom: 50%; }
}

@-webkit-keyframes dialog-animation-y {
    from { top: 50%; bottom: 50%; }
}

.dialog-close {
    position : absolute;
    top      : 4px;
    right    : 0px;

    -moz-animation              : dialog-close-animation 400ms ease-out 1200ms;
    -moz-animation-fill-mode    : both;
    -o-animation                : dialog-close-animation 400ms ease-out 1200ms;
    -o-animation-fill-mode      : both;
    -webkit-animation           : dialog-close-animation 400ms ease-out 1200ms;
    -webkit-animation-fill-mode : both;
    animation                   : dialog-close-animation 400ms ease-out 1200ms;
    animation-fill-mode         : both;
}

@keyframes dialog-close-animation {
    0%   { top: 1000px; }
    75%  { top: 0; }
}

@-webkit-keyframes dialog-close-animation {
    0%   { top: 1000px; }
    75%  { top: 0; }
}

.dialog-close-button {
    cursor: pointer;
    display: inline-block;
    font: 20px Cuprum, Arial, Helvetica, sans-serif;
    text-decoration: none;
    text-transform: none;
    background-color: transparent;
    width: 40px;
    height: 40px;
    text-align: center;
    vertical-align: baseline;
    border-radius: 20px;
    margin: 0px;
    padding: 0px;
}

.dialog-close-button:hover {
    background-color: #4197ee;
}

.dialog-title { 
    font: 24px Cuprum, Arial, Helvetica, sans-serif;
    /*background-color: #7bf;*/
    color: white;
    height: 30px;
    vertical-align: bottom;
}

.dialog-body {
    position: absolute;
    top: 31px;
    bottom: 41px;
    left: 0px;
    right: 0px;
    padding: 40px;
    background-color: #fff;
    overflow: auto;
}

.dialog-buttons {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: #7bf;
    text-align: center;
    padding: 2px;
}

.dialog-buttons:empty {
    padding: 0;
}

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

  Toolbar Elements

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

.toolbar {
}

.toolbar-body {
    background-color: #7bf;
    color: #fff;
    position: absolute;
    width: 100%;
}

.toolbar-group {
    display: inline-block;
    padding: 8px;
}

.toolbar-label {
    border: none;
    padding: 10px;
    font-size: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin: 2px;
    line-height: 44px;
}

/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/