/* Minification failed. Returning unminified contents. (2958,17): run-time error CSS1039: Token not allowed after unary operator: '-blue-100' (2964,41): run-time error CSS1039: Token not allowed after unary operator: '-blue-600' (9090,22): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9106,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9107,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9108,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9109,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9110,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9111,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9112,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9113,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9114,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9116,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9117,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9118,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9119,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9120,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9121,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9122,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9123,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9124,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9126,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9127,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9128,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9129,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9130,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9131,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9132,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9133,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9134,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9135,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9136,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9137,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9139,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9141,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9142,4): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9144,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9145,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9146,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9147,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9149,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9150,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9151,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9153,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9154,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9155,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9156,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9158,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9159,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9161,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9162,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9163,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9165,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9167,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9168,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9169,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9171,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9173,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9174,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9175,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9176,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9177,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9178,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9179,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9180,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9181,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9183,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9185,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9186,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9187,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9188,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9189,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9190,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9191,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9192,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9193,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9196,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9197,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9201,14): run-time error CSS1039: Token not allowed after unary operator: '-link-color' (9205,14): run-time error CSS1039: Token not allowed after unary operator: '-link-color-hover' (9238,18): run-time error CSS1039: Token not allowed after unary operator: '-h6' (9249,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9250,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9251,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9255,31): run-time error CSS1039: Token not allowed after unary operator: '-b' (9256,19): run-time error CSS1039: Token not allowed after unary operator: '-bg' (9257,15): run-time error CSS1039: Token not allowed after unary operator: '-c' (9258,19): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9259,17): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9275,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9276,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9277,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9281,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9282,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9283,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9287,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9288,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9289,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9297,14): run-time error CSS1039: Token not allowed after unary operator: '-gray-700' (9300,19): run-time error CSS1039: Token not allowed after unary operator: '-h6' (9302,15): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9302,29): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9309,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9310,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9313,20): run-time error CSS1039: Token not allowed after unary operator: '-p' (9315,18): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9315,30): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9322,20): run-time error CSS1039: Token not allowed after unary operator: '-bg' (9323,15): run-time error CSS1039: Token not allowed after unary operator: '-color' (9330,21): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9342,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9343,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9347,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9348,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9357,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9361,18): run-time error CSS1039: Token not allowed after unary operator: '-small' (9362,16): run-time error CSS1039: Token not allowed after unary operator: '-gap1' (9362,28): run-time error CSS1039: Token not allowed after unary operator: '-gap3' (9367,25): run-time error CSS1039: Token not allowed after unary operator: '-bg' (9368,14): run-time error CSS1039: Token not allowed after unary operator: '-bg' (9373,20): run-time error CSS1039: Token not allowed after unary operator: '-bg' (9374,15): run-time error CSS1039: Token not allowed after unary operator: '-color' (9378,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9379,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9383,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (9406,22): run-time error CSS1039: Token not allowed after unary operator: '-gap8' (9412,22): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9418,19): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (9421,18): run-time error CSS1039: Token not allowed after unary operator: '-small' (9422,16): run-time error CSS1039: Token not allowed after unary operator: '-gap3' (9422,28): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9428,14): run-time error CSS1039: Token not allowed after unary operator: '-gray-500' (9438,17): run-time error CSS1030: Expected identifier, found '.' (9438,34): run-time error CSS1031: Expected selector, found ')' (9438,34): run-time error CSS1025: Expected comma or open brace, found ')' (9444,19): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (9446,18): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9446,32): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9450,15): run-time error CSS1039: Token not allowed after unary operator: '-gray-700' (9451,19): run-time error CSS1039: Token not allowed after unary operator: '-p' (9481,14): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (9483,22): run-time error CSS1039: Token not allowed after unary operator: '-gap1' (9484,18): run-time error CSS1039: Token not allowed after unary operator: '-p' (9495,23): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9508,15): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9508,29): run-time error CSS1039: Token not allowed after unary operator: '-gap8' (9525,19): run-time error CSS1039: Token not allowed after unary operator: '-gray-700' (9526,27): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (9582,33): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (9583,16): run-time error CSS1039: Token not allowed after unary operator: '-gap6' (9583,28): run-time error CSS1039: Token not allowed after unary operator: '-gap8' (9590,30): run-time error CSS1039: Token not allowed after unary operator: '-gray-300' (9591,16): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9591,28): run-time error CSS1039: Token not allowed after unary operator: '-gap8' (9592,12): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9601,15): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9601,27): run-time error CSS1039: Token not allowed after unary operator: '-gap8' (9609,15): run-time error CSS1039: Token not allowed after unary operator: '-link-color' (9611,18): run-time error CSS1039: Token not allowed after unary operator: '-h4' (9612,17): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9612,29): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9617,20): run-time error CSS1039: Token not allowed after unary operator: '-gray-200' (9621,15): run-time error CSS1039: Token not allowed after unary operator: '-gap2' (9627,15): run-time error CSS1039: Token not allowed after unary operator: '-link-color' (9637,17): run-time error CSS1039: Token not allowed after unary operator: '-gap4' (9667,26): run-time error CSS1039: Token not allowed after unary operator: '-gray-600' (9689,16): run-time error CSS1039: Token not allowed after unary operator: '-gap8' (9690,18): run-time error CSS1039: Token not allowed after unary operator: '-gap8' (9703,19): run-time error CSS1039: Token not allowed after unary operator: '-small' (9740,15): run-time error CSS1039: Token not allowed after unary operator: '-gap8' */ @font-face { font-family: 'EntypoRegular'; src: url('https://cdn2.aplicativo.net/cdn/plataforma/entypo/entypo-webfont.eot'); src: url('https://cdn2.aplicativo.net/cdn/plataforma/entypo/entypo-webfont.eot?#iefix') format('embedded-opentype'), url('https://cdn2.aplicativo.net/cdn/plataforma/entypo/entypo-webfont.woff') format('woff'), url('https://cdn2.aplicativo.net/cdn/plataforma/entypo/entypo-webfont.ttf') format('truetype'), url('https://cdn2.aplicativo.net/cdn/plataforma/entypo/entypo-webfont.svg#EntypoRegular') format('svg'), url('https://codonto.aplicativo.net/dev/css/entypo/entypo-webfont.eot?#iefix') format('embedded-opentype'), url('https://codonto.aplicativo.net/dev/css/entypo/entypo-webfont.woff') format('woff'), url('https://codonto.aplicativo.net/dev/css/entypo/entypo-webfont.ttf') format('truetype'), url('https://codonto.aplicativo.net/dev/css/entypo/entypo-webfont.svg#EntypoRegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Museo 300'; font-style: normal; font-weight: normal; src: local('Museo 300'), url('https://cdn2.aplicativo.net/cdn/plataforma/fonts/Museo300-Regular.woff') format('woff'), url('https://codonto.aplicativo.net/dev/css/museo/Museo300-Regular.woff') format('woff'); } @font-face { font-family: 'Museo 700'; font-style: normal; font-weight: normal; src: local('Museo 700'), url('https://cdn2.aplicativo.net/cdn/plataforma/fonts/Museo700-Regular.woff') format('woff'), url('https://codonto.aplicativo.net/dev/css/museo/Museo700-Regular.woff') format('woff'); } /********************************************************/ /* 1. Global */ /********************************************************/ html { -webkit-tap-highlight-color: rgba(0,0,0,0); tap-highlight-color: rgba(0,0,0,0); background: #f2f7f8; } html.layout1 { background: #fff; } body, button, input, textarea { font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 16px; /*color: #665;*/ } input, textarea, .select { font-family: 'Museo 700', Calibri, Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: unset; /* color: #003366;*/ } /********************************************************/ /* 2. Basic elements/styles */ /********************************************************/ p, ul, ol, dl { margin-bottom: 16px; } ul.no-bullets, ul.unstyled-list { list-style-type: none; margin-left: 0; } ul.unstyled-list { margin-bottom: 0; } p:last-child, ul:last-child, ol:last-child, dl:last-child, fieldset:last-child, .fieldset:last-child { margin-bottom: 0; } /* IE7 */ p.last-child, ul.last-child, ol.last-child { margin-bottom: 0; } ol > li { margin-top: 10px; } ol > li:first-child { margin-top: 0; } a { text-decoration: none; /*color: #555;*/ } a:hover { color: #09f; } small, .small { font-size: 10px; /*line-height: 13px; color: #999999;*/ } small.input-info, .small.input-info { font-size: 10px; font-weight: bold; text-transform: uppercase; } .strong { font-weight: bold; } iframe { display: block; } .js noscript { display: none; } /********************************************************/ /* 3. Typography */ /********************************************************/ h1, h2 { padding: 0; -webkit-text-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); -moz-text-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); text-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); } h1 { font-size: 30px; line-height: 36px; margin-bottom: 26px; } h2 { font-size: 24px; line-height: 28px; margin: 32px 0 22px; } h3 { font-size: 21px; line-height: 25px; margin: 30px 0 20px; } h3 > .small { line-height: .8em; text-shadow: none; } h4 { font-size: 16px; line-height: 19px; margin: 25px 0 15px; } h2.block-title { line-height: 18px; font-size: 15px; margin-bottom: 0; } h5 { margin: 20px 0 10px; } h6 { font-size: 11px; text-transform: uppercase; } h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top: 0; } .thin, .thin h1, .thin h2, .thin h3, .thin h4, .thin h5, .thin h6 { font-weight: 300; font-family: 'Open Sans', sans-serif; } .underline { padding-bottom: 0.15em; border-bottom: 1px solid #D1D1D1; } /* Text styles */ .big-text { font-size: 18px; line-height: 24px; } .middle-text { font-size: 14px; line-height: 20px; } /*.intro { font-style: italic; color: #afafaf; }*/ /* Box styling */ .left-border { border-left: 2px solid; padding-left: 10px; } .left-border-silver { border-left: solid 2px silver; padding-left: 10px; } .left-border-green { border-left: solid 2px #99c624; padding-left: 10px; } .left-border-red { border-left: solid 2px #dd380d; padding-left: 10px; } .right-border { border-right: 2px solid; padding-right: 10px; text-align: right; } .wrapped { display: block; border-width: 1px; border-style: solid; padding: 10px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .boxed { display: block; padding: 16px; } /********************************************************/ /* 4. Utility classes */ /********************************************************/ /* Align */ .align-left { text-align: left; } .align-center { text-align: center; } .align-right { text-align: right; } /* Floating elements */ .float-left { float: left; } .float-right { float: right; } .clear-left { clear: left; } .clear-right { clear: right; } .clear-both { clear: both; } /* Padding */ .mid-padding-top { padding-top: 8px !important; } .mid-padding-bottom { padding-bottom: 8px !important; } .padding-top { padding-top: 16px !important; } .padding-bottom { padding-bottom: 16px !important; } .large-padding-left { padding-left: 30px !important; } .padding-left { padding-left: 16px !important; } .with-padding { padding: 20px !important; } .with-mid-padding { padding: 10px !important; } .with-small-padding { padding: 5px !important; } .no-padding { padding: 0 !important; } .no-padding-top { padding-top: 0 !important; } /* Margins */ .no-margin { margin: 0 !important; } .large-margin-top { margin-top: 30px !important; } .margin-top { margin-top: 16px !important; } .mid-margin-top { margin-top: 8px !important; } .small-margin-top { margin-top: 4px !important; } .no-margin-top { margin-top: 0 !important; } .large-margin-right { margin-right: 30px !important; } .margin-right { margin-right: 16px !important; } .mid-margin-right { margin-right: 8px !important; } .small-margin-right { margin-right: 4px !important; } .no-margin-right { margin-right: 0 !important; } .large-margin-left { margin-left: 30px !important; } .margin-left { margin-left: 16px !important; } .mid-margin-left { margin-left: 8px !important; } .small-margin-left { margin-left: 4px !important; } .no-margin-left { margin-left: 0 !important; } .large-margin-bottom { margin-bottom: 30px !important; } .margin-bottom { margin-bottom: 16px !important; } .mid-margin-bottom { margin-bottom: 8px !important; } .small-margin-bottom { margin-bottom: 4px !important; } .no-margin-bottom { margin-bottom: 0 !important; } /* Absolute positioning */ .relative { position: relative; } .absolute-left, .absolute-right { position: absolute; top: 50%; margin-top: -8px; } .absolute-left { left: 0; } .absolute-right { right: 0; } /* This class disables mouse events on compatible browsers, a polyfill is provded in setup.js for others */ .no-pointer-events { pointer-events: none; } /* This class is only active if the device does not handle touch */ /*.touchevents*/ .show-on-parent-hover { pointer-events: none; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0; -webkit-transition: opacity 200ms; -moz-transition: opacity 200ms; -ms-transition: opacity 200ms; -o-transition: opacity 200ms; transition: opacity 200ms; } /*.touchevents*/ :hover > .show-on-parent-hover, :active > .show-on-parent-hover{ pointer-events: auto; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; } .show-on-right { position: absolute; right: 0; top: 10px; } /* Class used to determine which media queries are on */ #mediaquery-checker { width: 10px; height: 10px; position: absolute; top: 0; left: 0; } /* IE7 vertically aligned images fix */ .vert-align { display: inline; width: 0; margin-right: -4px; } /* Contextual elements */ .hidden-on-mobile, .only-on-tablet, .only-on-desktop { display: none; } .hidden-on-tablet, .hidden-on-desktop, .only-on-mobile { display: block; } .left-column-50px { width: 50px; content: "\0020"; display: block; height: 0; } .left-column-100px { float: left; width: 100px; content: "\0020"; display: block; height: 0; } .left-column-150px { float: left; width: 150px; content: "\0020"; display: block; height: 0; } .left-column-200px { float: left; width: 200px; content: "\0020"; display: block; height: 0; } .margin-left-column-50px { margin-left: 50px; } .margin-left-column-100px { margin-left: 100px; } .margin-left-column-150px { margin-left: 150px; } .margin-left-column-200px { margin-left: 200px; } /* .right-column-150px { width: 150px; content: "\0020"; display: block; height: 0; } .margin-right-column-150px { margin-right: 150px; } .left-column-50px:after, .margin-left-column-50px:after, .left-column-100px:after, .margin-left-column-100px:after, .right-column-150px:after, .margin-right-column-150px:after { clear: both; }*/ .margin-left-column-100px:after { clear: both; } /********************************************************/ /* 5. Generic shadows */ /********************************************************/ .lite-box-shadow { -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); } .box-shadow { -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); } .strong-box-shadow { -webkit-box-shadow: 0 1px 3px black; -moz-box-shadow: 0 1px 3px black; box-shadow: 0 1px 3px black; } .large-box-shadow { -webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.45); -moz-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.45); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.45) } .lite-text-shadow { -webkit-text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); -moz-text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); } .text-shadow { -webkit-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); -moz-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); } .strong-text-shadow { -webkit-text-shadow: 0 1px 2px black; -moz-text-shadow: 0 1px 2px black; text-shadow: 0 1px 2px black; } .large-text-shadow { -webkit-text-shadow: 0 3px 8px rgba(0, 0, 0, 0.45); -moz-text-shadow: 0 3px 8px rgba(0, 0, 0, 0.45); text-shadow: 0 3px 8px rgba(0, 0, 0, 0.45) } /********************************************************/ /* 6. Generic bevel/emboss/gloss styles */ /********************************************************/ .top-bevel { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); } .top-bevel-on-light { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); } .top-bevel-on-dark { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25); } .bottom-bevel { -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25); -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25); } .bottom-bevel-on-light { -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); } .bottom-bevel-on-dark { -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.5); } /*.bevel, .bevel-subs > li, .big-menu > li, li.big-menu, .calendar-menu > li, li.calendar-menu, .title-menu > li, li.title-menu { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.25); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.25); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.25); } .no-boxshadow .big-menu > li { border-bottom: 1px solid #666666; }*/ .bevel-on-light, .bevel-on-light-subs > li, .message-menu > li, li.message-menu { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 0 -1px 0 rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 0 -1px 0 rgba(0, 0, 0, 0.15); } .bevel-on-dark, .bevel-on-dark-subs > li, #menu header, /*#access-home,*/ #access-places, #access-modulos /*#access-panic*/ { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.5); } .bright-text-bevel-on-dark, #menu header, #profile { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.5); } .title-menu { -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); } .bright-text-bevel-on-dark /*#menu header, #profile*/ { -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); } .dark-text-bevel, .calendar-menu > li, li.calendar-menu, .message-menu > li, li.message-menu { -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); } .dark-text-bevel-on-dark { -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25); } #access-home > li.active > a, #access-modulos > li.active > a, #access-places > li.active > a { /*background: #f2f7f8;*/ } #access-modulos > li.active > a::before, #access-places > li.active > a::before { display: block; content: ''; width: 0; height: 0; overflow: hidden; position: absolute; left: 3px; top: 50%; margin-top: -5px; border: 5px solid transparent; border-left-color: transparent; border-left-color: #fff; } #access-home > li.active > a:after, #access-places > li.active > a:after, #access-modulos > li.active > a:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; } .emboss, .emboss-subs > li { -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.25); -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.25); box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.25); } .emboss-on-dark, .emboss-on-dark-subs > li { -webkit-box-shadow: inset 0 1px 4px black; -moz-box-shadow: inset 0 1px 4px black; box-shadow: inset 0 1px 4px black; } .bright-text-bevel, /*.big-menu:not(.no-shadow),*/ .title-menu { -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); } .bright-text-bevel-on-dark, #menu header, #profile { /*-webkit-text-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); -moz-text-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); text-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);*/ } .dark-text-bevel, .calendar-menu > li, li.calendar-menu, .message-menu > li, li.message-menu { -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); } .dark-text-bevel-on-dark { -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25); } .layout1 .dark-text-bevel, .layout1 .calendar-menu > li, .layout1 li.calendar-menu, .layout1 .message-menu > li, .layout1 li.message-menu { -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; } /********************************************************/ /* 7. Generic effects */ /********************************************************/ .with-border { border-width: 1px; border-style: solid; } .glow, #title-bar { /*background: var(--head-bg);*/ position: relative; border-top: 1px solid #666666; background: #000; } #title-bar > .logo-header { width: 200px; height: 60px; background-repeat: no-repeat } #title-bar.header-app { background: #a20a0a; } #title-bar.header-co { background: #012a3e; } #title-bar.header-cm { background: #0e390b; } #title-bar.header-gc { background: #243267; } #title-bar.header-app > .logo-header { background-image: url(https://cdn2.aplicativo.net/cdn/plataforma/images/head-logo-app_modelo_1.png); background-size: 180px; background-position: 4px 12px } #title-bar.header-co > .logo-header { background-image: url(https://cdn2.aplicativo.net/cdn/plataforma/images/head-logo-co_modelo_3.png); background-size: 110px; background-position: 1px 2px } #title-bar.header-cm > .logo-header { background-image: url(https://cdn2.aplicativo.net/cdn/plataforma/images/head-logo-cm_modelo_3.png); background-size: 110px; background-position: 1px 1px } #title-bar.header-gc > .logo-header { background-image: url(https://cdn2.aplicativo.net/cdn/plataforma/logos/head-logo-gc.png); } .glow:before, #title-bar:before { display: block; content: ' '; position: absolute; left: 0; right: 0; top: 0; bottom: 0; /*background: url(img/effects/glow.png) no-repeat center center;*/ pointer-events: none; /*-webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%;*/ } /*#title-bar .codigo-cliente { position: absolute; top: 10px; font-size: 12px; color: #8B8B7A; }*/ header > .place-search { width: 300px; color: white; position: absolute; left: 200px; top: 5px; } /*header > .place-search input, header > .place-search button { display :none; }*/ header > .place-search > a.fa-search { font-size: 70px; position: relative; top: -15px; width: 70px; filter: alpha(opacity=50); -khtml-opacity: 0.50; -moz-opacity: 0.50; opacity: 0.50; display: none; } header > .place-search > .fa-search:hover { font-size: 40px; top: 5px; filter: alpha(opacity=100); -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; } header > .place-search input { width: 220px; line-height: 30px; font-size: 18px; font-weight: 600; opacity: .2; display: block; } header > .place-search input:focus { opacity: 1; } header > .place-search.hidden-search > .fa-search { display: block; -webkit-transition: all 300ms; -moz-transition: all 300ms; -ms-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; } header > .place-search.hidden-search > .input { display: none; -webkit-transition: all 300ms; -moz-transition: all 300ms; -ms-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; } /* Stripes */ .thin-stripes, .dark-thin-stripes, .stripes, .dark-stripes, .big-stripes, .dark-big-stripes { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; pointer-events: none; -webkit-border-radius: inherit; -moz-border-radius: inherit; border-radius: inherit; } .thin-stripes, .dark-thin-stripes { -webkit-background-size: 10px 10px; -moz-background-size: 10px 10px; background-size: 10px 10px; } .stripes, .dark-stripes { -webkit-background-size: 20px 20px; -moz-background-size: 20px 20px; background-size: 20px 20px; } .big-stripes, .dark-big-stripes { -webkit-background-size: 40px 40px; -moz-background-size: 40px 40px; background-size: 40px 40px; } .thin-stripes, .stripes, .big-stripes { background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0.25, rgba(255, 255, 255, 0.05)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.05)), color-stop(0.75, rgba(255, 255, 255, 0.05)), color-stop(0.75, transparent), to(transparent)); background-image: -webkit-linear-gradient(135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent); background-image: -moz-linear-gradient(135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent); background-image: -ms-linear-gradient(135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent); background-image: -o-linear-gradient(135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.1) 50%, rgba(255, 255, 255, 0.1) 75%, transparent 75%, transparent); } .no-cssgradients .thin-stripes { /*background-image: url(img/old-browsers/stripes-white-10.png);*/ } .no-cssgradients .stripes { /*background-image: url(img/old-browsers/stripes-white-20.png);*/ } .no-cssgradients .big-stripes { /*background-image: url(img/old-browsers/stripes-white-40.png);*/ } .dark-thin-stripes, .dark-stripes, .dark-big-stripes { background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0.25, rgba(0, 0, 0, 0.05)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(0, 0, 0, 0.05)), color-stop(0.75, rgba(0, 0, 0, 0.05)), color-stop(0.75, transparent), to(transparent)); background-image: -webkit-linear-gradient(135deg, rgba(0, 0, 0, 0.05) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0.05) 75%, transparent 75%, transparent); background-image: -moz-linear-gradient(135deg, rgba(0, 0, 0, 0.05) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0.05) 75%, transparent 75%, transparent); background-image: -ms-linear-gradient(135deg, rgba(0, 0, 0, 0.05) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0.05) 75%, transparent 75%, transparent); background-image: -o-linear-gradient(135deg, rgba(0, 0, 0, 0.05) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0.05) 75%, transparent 75%, transparent); background-image: linear-gradient(135deg, rgba(0, 0, 0, 0.05) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0.05) 75%, transparent 75%, transparent); } .dark-big-stripes.red-stripes { background-image: linear-gradient(135deg, rgba(255, 0, 0, 0.03) 25%, transparent 25%, transparent 50%, rgba(255, 0, 0, 0.03) 26%, rgba(255, 0, 0, 0.03) 75%, transparent 75%, transparent); } .no-cssgradients .dark-thin-stripes { /*background-image: url(img/old-browsers/stripes-black-10.png);*/ } .no-cssgradients .dark-stripes { /*background-image: url(img/old-browsers/stripes-black-20.png);*/ } .no-cssgradients .dark-big-stripes { /*background-image: url(img/old-browsers/stripes-black-40.png);*/ } /* Animated stripes */ .thin-stripes.animated, .dark-thin-stripes.animated { -webkit-animation: animate-thin-stripes 3s linear infinite; -moz-animation: animate-thin-stripes 3s linear infinite; -ms-animation: animate-thin-stripes 3s linear infinite; -o-animation: animate-thin-stripes 3s linear infinite; } .stripes.animated, .dark-stripes.animated { -webkit-animation: animate-stripes 4s linear infinite; -moz-animation: animate-stripes 4s linear infinite; -ms-animation: animate-stripes 4s linear infinite; -o-animation: animate-stripes 4s linear infinite; } .big-stripes.animated, .dark-big-stripes.animated { -webkit-animation: animate-big-stripes 5s linear infinite; -moz-animation: animate-big-stripes 5s linear infinite; -ms-animation: animate-big-stripes 5s linear infinite; -o-animation: animate-big-stripes 5s linear infinite; } @-webkit-keyframes animate-thin-stripes { from { background-position: 0 0; } to { background-position: -20px 0; } } @-moz-keyframes animate-thin-stripes { from { background-position: 0 0; } to { background-position: -20px 0; } } @-ms-keyframes animate-thin-stripes { from { background-position: 0 0; } to { background-position: -20px 0; } } @-o-keyframes animate-thin-stripes { from { background-position: 0 0; } to { background-position: -20px 0; } } @-webkit-keyframes animate-stripes { from { background-position: 0 0; } to { background-position: -40px 0; } } @-moz-keyframes animate-stripes { from { background-position: 0 0; } to { background-position: -40px 0; } } @-ms-keyframes animate-stripes { from { background-position: 0 0; } to { background-position: -40px 0; } } @-o-keyframes animate-stripes { from { background-position: 0 0; } to { background-position: -40px 0; } } @-webkit-keyframes animate-big-stripes { from { background-position: 0 0; } to { background-position: -80px 0; } } @-moz-keyframes animate-big-stripes { from { background-position: 0 0; } to { background-position: -80px 0; } } @-ms-keyframes animate-big-stripes { from { background-position: 0 0; } to { background-position: -80px 0; } } @-o-keyframes animate-big-stripes { from { background-position: 0 0; } to { background-position: -80px 0; } } /********************************************************/ /* 8. Columns */ /********************************************************/ /* Columns */ .columns { margin-left: -2.25%; } .columns:last-child { margin-bottom: -20px; } .columns > div, .columns > form { float: left; margin: 0 0 20px 2.25%; } /* These styles define the columns size. They must be redefined for each responsive size */ .column, .one-column, .one-column-tablet, .one-column-mobile, .one-column-mobile-landscape, .one-column-mobile-portrait { width: 6.0833%; } .two-columns, .two-columns-tablet, .two-columns-mobile, .two-columns-mobile-landscape, .two-columns-mobile-portrait { width: 14.4167%; } .three-columns, .three-columns-tablet, .three-columns-mobile, .three-columns-mobile-landscape, .three-columns-mobile-portrait { width: 22.75%; } .four-columns, .four-columns-tablet, .four-columns-mobile, .four-columns-mobile-landscape, .four-columns-mobile-portrait { width: 31.0833%; } .five-columns, .five-columns-tablet, .five-columns-mobile, .five-columns-mobile-landscape, .five-columns-mobile-portrait { width: 39.4167%; } .six-columns, .six-columns-tablet, .six-columns-mobile, .six-columns-mobile-landscape, .six-columns-mobile-portrait { width: 47.75%; } .seven-columns, .seven-columns-tablet, .seven-columns-mobile, .seven-columns-mobile-landscape, .seven-columns-mobile-portrait { width: 56.0833%; } .eight-columns, .eight-columns-tablet, .eight-columns-mobile, .eight-columns-mobile-landscape, .eight-columns-mobile-portrait { width: 64.4167%; } .nine-columns, .nine-columns-tablet, .nine-columns-mobile, .nine-columns-mobile-landscape, .nine-columns-mobile-portrait { width: 72.72%; } .ten-columns, .ten-columns-tablet, .ten-columns-mobile, .ten-columns-mobile-landscape, .ten-columns-mobile-portrait { width: 81.0833%; } .eleven-columns, .eleven-columns-tablet, .eleven-columns-mobile, .eleven-columns-mobile-landscape, .eleven-columns-mobile-portrait { width: 89.4167%; } .twelve-columns, .twelve-columns-tablet, .twelve-columns-mobile, .twelve-columns-mobile-landscape, .twelve-columns-mobile-portrait { width: 97.75%; } /* Line breaks to ensure correct float */ .new-row, .new-row-mobile, .new-row-mobile-portrait { clear: left; } /* Fixed columns */ .left-column-200px .left-column, .right-column-200px .right-column { margin-bottom: 20px; } .left-column-100px .left-column, .right-column-100px .right-column { margin-bottom: 20px; } /* Content panels */ .content-panel, .content-panel.mobile-panels { border: 1px solid #cccccc; position: relative; overflow: hidden; padding-left: 0; zoom: 1; } .panel-navigation, .mobile-panels > .panel-navigation { position: relative; top: auto; left: auto; bottom: auto; width: auto; border-right: 0; overflow: auto; } .panel-content { -webkit-box-shadow: inset 0 2px 9px rgba(0, 0, 0, 0.2); -moz-box-shadow: inset 0 2px 9px rgba(0, 0, 0, 0.2); box-shadow: inset 0 2px 9px rgba(0, 0, 0, 0.2); overflow: auto; } .panel-content.linen, .panel-content.carbon { -webkit-box-shadow: inset 0 2px 9px rgba(0, 0, 0, 0.75); -moz-box-shadow: inset 0 2px 9px rgba(0, 0, 0, 0.75); box-shadow: inset 0 2px 9px rgba(0, 0, 0, 0.75); } /* Bar for controls */ .panel-control { display: block; padding: 5px; height: 30px; line-height: 30px; border-bottom-width: 1px; border-bottom-style: solid; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); } .linen > .panel-control, .carbon > .panel-control { -webkit-box-shadow: 0 2px 9px rgba(0, 0, 0, 0.75); -moz-box-shadow: 0 2px 9px rgba(0, 0, 0, 0.75); box-shadow: 0 2px 9px rgba(0, 0, 0, 0.75); } /* Styles when js is enabled */ .enabled-panels > .panel-navigation, .mobile-panels.enabled-panels > .panel-navigation { position: absolute; top: 0; bottom: 0; left: 0; right: 0; -webkit-transition: left 200ms, right 200ms; -moz-transition: left 200ms, right 200ms; -ms-transition: left 200ms, right 200ms; -o-transition: left 200ms, right 200ms; transition: left 200ms, right 200ms; } .enabled-panels.show-panel-content > .panel-navigation, .mobile-panels.enabled-panels.show-panel-content > .panel-navigation { left: -100%; right: 100%; } .enabled-panels > .panel-content, .mobile-panels.enabled-panels > .panel-content { width: 100%; margin-left: 100%; -webkit-transition: margin-left 200ms; -moz-transition: margin-left 200ms; -ms-transition: margin-left 200ms; -o-transition: margin-left 200ms; transition: margin-left 200ms; } .enabled-panels.show-panel-content > .panel-content, .mobile-panels.enabled-panels.show-panel-content > .panel-content { margin-left: 0; } .mobile-panels > .panel-content > .back { display: block; } /********************************************************/ /* 9. Lists & tags */ /********************************************************/ /* Bullet list */ .bullet-list { margin-left: 0; list-style-type: none; } .bullet-list > li { padding-top: 10px; padding-left: 16px; } .bullet-list > li:first-child { padding-top: 0; } .bullet-list > li:before { display: block; float: left; width: 16px; margin: 1px 0 0 -16px; font-weight: normal; font-style: normal; font-family: 'EntypoRegular'; content: '\f010'; font-size: 25px; color: #cccccc; } /* IE7 */ .bullet-list-before { display: block; float: left; width: 16px; margin: 1px 0 0 -16px; font-weight: normal; font-style: normal; font-family: 'EntypoRegular'; font-size: 25px; color: #cccccc; } /* Definition lists */ .definition > dt { font-weight: bold; color: black; margin-bottom: 4px; } .definition > dd { font-style: italic; margin-bottom: 10px; padding-left: 16px; } /* Generic list style */ .list { list-style-type: none; margin-left: 0; } .list > li, .list-link { padding: 4px 0; color: #000; /*min-height: 16px;*/ line-height: 16px; } .list.spaced > li, .list.spaced > li > .list-link { padding: 12px 0; } li.hover:hover { background-color: #f0f5fa; } .list > li { position: relative; } .list > li:not(.no-border) { border-top: 1px dotted #cccccc; } .list > li:first-child { border-top: 0; } .list-link { display: block; margin: -4px 0; } .list.spaced > li > .list-link { margin: -12px 0; } .list > li > strong, .list-link > strong { color: black; } /* jQuery UI classes for sorting interaction */ .list > li.ui-state-highlight { background: url(img/textures/textures/grid.png); } .list > li.ui-sortable-helper { background: white; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; filter: alpha(opacity=75); -khtml-opacity: 0.75; -moz-opacity: 0.75; opacity: 0.75; -webkit-box-shadow: 0 2px 7px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 2px 7px rgba(0, 0, 0, 0.25); box-shadow: 0 2px 7px rgba(0, 0, 0, 0.25); border-top: 1px dotted #cccccc; border-bottom: 1px dotted #cccccc; } .layout1 .calendar-menu .list > li, .layout1 .calendar-menu .list-link { color: #fff; } /* Blocks list */ .blocks-list { margin-left: -5px; list-style-type: none; } .blocks-list > li { float: left; margin: 0 0 5px 5px; padding: 3px 6px; border-width: 1px; border-style: solid; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .blocks-list > li > [class^="icon-"]:before, .blocks-list > li > [class*=" icon-"] { border: 1px solid transparent; } /* Fixed sizes */ .fixed-size-50 > li { width: 36px; } .fixed-size-100 { margin-left: -7px; } .fixed-size-100 > li { width: 86px; margin: 0 0 7px 7px; } .fixed-size-150, .fixed-size-200, .fixed-size-250 { margin-left: -10px; } .fixed-size-150 > li { width: 136px; margin: 0 0 10px 10px; } .fixed-size-200 > li { width: 186px; margin: 0 0 10px 10px; } .fixed-size-250 > li { width: 236px; margin: 0 0 10px 10px; } /* Square sizes */ .square-26 > li { text-align: center; padding: 4px; width: 16px; height: 16px; line-height: 16px; } .square-46 { margin-left: -7px; } .square-46 > li { text-align: center; padding: 6px; width: 32px; height: 32px; line-height: 32px; margin: 0 0 7px 7px; } .square-66, .square-90, .square-134 { margin-left: -10px; } .square-66 > li { text-align: center; padding: 8px; width: 48px; height: 48px; line-height: 48px; margin: 0 0 10px 10px; } .square-90 > li { text-align: center; padding: 12px; width: 64px; height: 64px; line-height: 64px; margin: 0 0 10px 10px; } .square-134 > li { text-align: center; padding: 18px; width: 96px; height: 96px; line-height: 96px; margin: 0 0 10px 10px; } /* Version history */ .version-history { margin: 0 0 20px 0; padding: 0; list-style-type: none; } .version-history > li { margin: 0 0 7px 0; padding: 0 0 0 62px; zoom: 1; } .version-new, .version-fixed, .version-upgraded { float: left; font-size: 10px; margin-left: -62px; width: 55px; color: white; text-align: center; font-weight: bold; text-transform: uppercase; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .version-new { background: #7dc35b; } .version-fixed { background: #e9a130; } .version-upgraded { background: #00a7ff; } /* Tags */ .tag { font-size: 9px; color: white; text-align: center; font-weight: bold; text-transform: uppercase; margin: 0 5px; padding: 3px 6px 3px 6px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; white-space: nowrap; } .ie9 .tag { padding: 1px 4px; } small.tag { font-size: 10px; line-height: 14px; text-transform: uppercase; padding: 0 2px; vertical-align: 1px; border-width: 1px; border-style: solid; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } /********************************************************/ /* 12. Generic elements */ /********************************************************/ /* Count & close */ .count, .close { color: white; position: absolute; z-index: 88; top: 0; padding: 0 3px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height: 15px; font-weight: bold; height: 17px; min-width: 12px; text-align: center; -webkit-background-clip: padding-box; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; /*border-width: 1px; border-style: solid;*/ font-weight: bold; /*-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 3px rgba(0, 0, 0, 0.75); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 3px rgba(0, 0, 0, 0.75); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 3px rgba(0, 0, 0, 0.75);*/ /*-webkit-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); -moz-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);*/ background: red; } .count.simpler, .close.simpler { border-color: #808080; background: #808080; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; } .count { right: -10%; margin: -5px 0 0 0; } .close { cursor: pointer; } .count.right, .count.inset, .close { right: 0; margin: -10px -10px 0 0; } .count.left, .close.left { right: auto; left: 0; margin: -10px 0 0 -10px; } .count.inside { right: auto; margin: 5px 0 0 5px; } .count.inset, .close.inset { margin: 4px 4px 0 0; } .count.left.inset, .close.left.inset { margin: 4px 0 0 4px; } #access-home > li > .count, #access-home > li > a > .count, #access-places > li > .count, #access-places > li > a > .count, #access-modulos > li > .count, #access-modulos > li > a > .count { right: 50%; margin: 10px -25px 0 0; } #access-home > li > a > .count, #access-places > li > a > .count, #access-modulos > li > a > .count { -webkit-transition: all 200ms; -moz-transition: all 200ms; -ms-transition: all 200ms; -o-transition: all 200ms; transition: all 200ms; } #access-home > li > a:hover > .count, #access-places > li > a:hover > .count, #access-modulos > li > a:hover > .count { margin-top: 6px; } /* Blocks */ .block, details.details { border: 1px solid #bfbfbf; position: relative; /*background-color: white;*/ color: #666666; -webkit-border-radius: 9px; -moz-border-radius: 9px; border-radius: 9px; overflow: hidden; } .block-title, details.details > summary { display: block; position: relative; padding: 18px 19px; border-bottom-width: 1px; border-bottom-style: solid; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); -webkit-text-shadow: 0 1px 0 white; -moz-text-shadow: 0 1px 0 white; /*text-shadow: 0 1px 0 white;*/ } details.details > summary { cursor: pointer; } .block-title { -webkit-border-top-left-radius: 8px; -webkit-border-top-right-radius: 8px; -moz-border-radius-topleft: 8px; -moz-border-radius-topright: 8px; border-top-left-radius: 8px; border-top-right-radius: 8px; } details.details > summary { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } details.details.open > summary, html.details details.details[open] > summary { -webkit-border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-bottomright: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } details.details > summary:before { content: '►'; padding-right: 5px; } html.details details.details > summary:before { display: none; } details.details.open > summary:before { content: '▼'; } h3.block-title { padding: 10px 19px; margin: 0; -webkit-border-top-left-radius: 9px; -webkit-border-top-right-radius: 9px; -moz-border-radius-topleft: 9px; -moz-border-radius-topright: 9px; border-top-left-radius: 9px; border-top-right-radius: 9px; } .block-title > h3, details.details > summary > h3 { padding: 0; margin: -8px 0; } .block-title > .absolute-right { right: 17px; /*top: 15px;*/ } /* Accordions */ .accordion { border: 1px solid #bfbfbf; position: relative; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .accordion > dt { display: block; position: relative; padding: 10px 11px; border-top-width: 1px; border-top-style: solid; border-bottom-width: 1px; border-bottom-style: solid; cursor: pointer; /*-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15);*/ text-align: center; } .accordion > dt:first-child { border-top-width: 0; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; } .accordion > dt.closed { margin-bottom: -1px; } .accordion > dt.closed:last-of-type { border-bottom-width: 0; margin-bottom: 0; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } /* Ribbon, from Chris Coyer CSS Tricks : http://css-tricks.com/snippets/css/corner-ribbon */ .ribbon { display: block; width: 85px; height: 88px; overflow: hidden; position: absolute; z-index: 88; top: -5px; right: -5px; } .no-csstransforms .ribbon { width: 70px; height: 46px; } .ribbon.tiny { width: 43px; height: 44px; top: -4px; right: -4px; } .no-csstransforms .ribbon.tiny { width: 40px; height: 23px; } .ribbon-inner { display: block; font-weight: bold; font-size: 15px; line-height: 15px; text-align: center; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); position: relative; padding: 7px 0; left: -7px; top: 17px; width: 120px; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); -webkit-text-shadow: rgba(0, 0, 0, 0.25) 0 1px 1px; -moz-text-shadow: rgba(0, 0, 0, 0.25) 0 1px 1px; text-shadow: rgba(0, 0, 0, 0.25) 0 1px 1px; } .no-csstransforms .ribbon-inner { left: -25px; } .tiny > .ribbon-inner { font-size: 10px; line-height: 10px; padding: 3px 0; left: -2px; top: 7px; width: 60px; } .no-csstransforms .tiny > .ribbon-inner { left: -9px; } .ribbon-inner:before, .ribbon-inner:after { content: ''; border-left: 3px solid transparent; border-right: 3px solid transparent; border-top: 3px solid; border-top-color: inherit; position: absolute; bottom: -3px; } .tiny > .ribbon-inner:before, .tiny > .ribbon-inner:after { border-left-width: 2px; border-right-width: 2px; border-top-width: 2px; bottom: -2px; } .ribbon-inner:before { left: 1px; } .ribbon-inner:after { right: 1px; } /* Meter bars */ .meter { display: inline-block; height: 11px; line-height: 11px; width: 4px; margin-left: -3px; *margin-left: 3px; *vertical-align: middle; background: #999999 /*url(img/old-browsers/bg_meter.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#808080), to(#999999)); background: -webkit-linear-gradient(top, #808080, #999999); background: -moz-linear-gradient(top, #808080, #999999); background: -ms-linear-gradient(top, #808080, #999999); background: -o-linear-gradient(top, #808080, #999999); background: linear-gradient(top, #808080, #999999); -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.75), 0 1px 0 rgba(255, 255, 255, 0.25); -moz-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.75), 0 1px 0 rgba(255, 255, 255, 0.25); box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.75), 0 1px 0 rgba(255, 255, 255, 0.25); } /* Information spot */ .info-spot { display: inline-block; width: 16px; height: 16px; text-align: center; font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 16px; font-weight: normal; vertical-align: middle; *vertical-align: baseline; position: relative; margin: -1px 0 1px; -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; cursor: help; } .info-spot > [class^="icon-"], .info-spot > [class*=" icon-"] { position: absolute; font-size: 17px; top: 0; left: 1px; } .info-spot:hover > [class^="icon-"], .info-spot:hover > [class*=" icon-"] { color: white; z-index: 99; } .info-bubble { display: none; position: absolute; z-index: 98; top: -5px; left: 15px; min-width: 100px; padding: 8px 11px; background: #4c4c4c; color: white; text-align: left; -webkit-border-radius: 5px; -webkit-border-top-left-radius: 0; -moz-border-radius: 0 5px 5px 5px; border-radius: 0 5px 5px 5px; } .info-spot:hover > .info-bubble { display: block; } .info-bubble:before { content: ''; display: block; position: absolute; top: 0; right: 100%; height: 26px; width: 21px; background-color: inherit; -webkit-border-top-left-radius: 13px; -webkit-border-bottom-left-radius: 13px; -moz-border-radius: 13px 0 0 13px; border-radius: 13px 0 0 13px; } /* IE7 */ .info-bubble-before { display: block; position: absolute; top: 0; right: 100%; height: 26px; width: 21px; /*background-color:expression(this.parentNode.currentStyle['background-color']);*/ } /* Flipped */ .on-top > .info-bubble { top: auto; bottom: -5px; -webkit-border-top-left-radius: 5px; -webkit-border-bottom-left-radius: 0; -moz-border-radius: 5px 5px 5px 0; border-radius: 5px 5px 5px 0; } .on-top > .info-bubble:before { top: auto; bottom: 0; } /* IE7 */ .on-top > .info-bubble > .info-bubble-before { top: auto; bottom: 0; } .on-left > .info-bubble { left: auto; right: 15px; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 0; -moz-border-radius: 5px 0 5px 5px; border-radius: 5px 0 5px 5px; } .on-left > .info-bubble:before { right: auto; left: 100%; -webkit-border-radius: 0; -webkit-border-top-right-radius: 13px; -webkit-border-bottom-right-radius: 13px; -moz-border-radius: 0 13px 13px 0; border-radius: 0 13px 13px 0; } /* IE7 */ .on-left > .info-bubble > .info-bubble-before { right: auto; left: 100%; } .on-top.on-left > .info-bubble { left: auto; right: 15px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0; -moz-border-radius: 5px 5px 0 5px; border-radius: 5px 5px 0 5px; } /* IE7 */ .on-top.on-left > .info-bubble > .info-bubble-before { left: auto; right: 15px; } /* Touch screen do not handle hover correctly, the text is shown on an modal */ .js.touch .info-spot:hover > [class^="icon-"], .js.touch .info-spot:hover > [class*=" icon-"] { color: inherit; } .js.touch .info-spot:hover > .info-bubble { display: none; } /********************************************************/ /* 13. Icons */ /********************************************************/ /*font/x-woff*/ [class^="icon-"]:before, [class*=" icon-"]:before { display: inline-block; font-weight: normal; font-style: normal; font-family: 'EntypoRegular'; font-size: 2em; text-transform: none !important; line-height: 1em; /*margin: -0.5em 0.115em -0.5em -0.077em;*/ margin: -0.5em 0.115em -0.5em 0; } .button.icon:before, .button > .icon:before, .button-icon.icon:before, .button-icon > .icon:before { font-size: 2.3em; margin-top: -0.65em; margin-bottom: -0.65em; } /* Sizes */ .icon-size2:before { font-size: 3.5em; margin-top: -1.25em; margin-bottom: -1.25em; vertical-align: middle; } .icon-size3:before { font-size: 4.5em; margin-top: -1.75em; margin-bottom: -1.75em; vertical-align: middle; } .icon-size4:before { font-size: 7em; margin-top: -3em; margin-bottom: -3em; vertical-align: middle; } .icon-size5:before { font-size: 10em; margin-top: -4.5em; margin-bottom: -4.5em; vertical-align: middle; } /* IE9 and 10 go crazy with relative font-sizes */ :root .icon-size2:before, :root .icon-size3:before, :root .icon-size4:before, :root .icon-size5:before { font-size: 0.25em \0/IE9; /* Ugly hack, but this is the only solution to target IE10 */ } /* Empty icons */ [class^="icon-"]:empty:before, [class*=" icon-"]:empty:before { margin-right: -0.077em; margin-left: -0.077em; } /* IE7 */ /*.font-icon { font-weight: normal; font-style: normal; font-family: 'EntypoRegular'; font-size: 2em; margin: -0.5em 0.115em -0.5em -0.077em; vertical-align: middle; } .font-icon.empty { margin-right: -2px; margin-left: -2px; }*/ /* Sizes */ .icon-size2 > .font-icon { font-size: 3.5em; margin-top: -1.25em; margin-bottom: -1.25em; vertical-align: middle; } .icon-size3 > .font-icon { font-size: 4.5em; margin-top: -1.75em; margin-bottom: -1.75em; vertical-align: middle; } .icon-size4 > .font-icon { font-size: 7em; margin-top: -3em; margin-bottom: -3em; vertical-align: middle; } .icon-size5 > .font-icon { font-size: 10em; margin-top: -4.5em; margin-bottom: -4.5em; vertical-align: middle; } /* IE8 */ [class^="icon-"].font-icon-empty:before, [class*=" icon-"].font-icon-empty:before { margin-right: -0.077em; margin-left: -0.077em; } .left-icon { padding-left: 20px; position: relative; min-height: 16px; } .wrapped.left-icon { padding-left: 30px; } .boxed.left-icon { padding-left: 36px; } .big-left-icon { padding-left: 38px; position: relative; min-height: 32px; } .wrapped.big-left-icon { padding-left: 48px; } .boxed.big-left-icon { padding-left: 54px; } .huge-left-icon { padding-left: 68px; position: relative; min-height: 64px; } .wrapped.huge-left-icon { padding-left: 78px; } .boxed.huge-left-icon { padding-left: 84px; } .left-icon:before, .big-left-icon:before, .huge-left-icon:before { position: absolute; display: block; margin: 0; } .left-icon:before { top: 0; left: -1px; font-size: 30px; line-height: 18px; } .wrapped.left-icon:before { top: 10px; left: 9px; } .boxed.left-icon:before { top: 16px; left: 15px; } .big-left-icon:before { top: -1px; left: -2px; font-size: 60px; line-height: 36px; } .wrapped.big-left-icon:before { top: 9px; left: 8px; } .boxed.big-left-icon:before { top: 15px; left: 14px; } .huge-left-icon:before { top: -3px; left: -5px; font-size: 120px; line-height: 72px; } .wrapped.huge-left-icon:before { top: 7px; left: 5px; } .boxed.huge-left-icon:before { top: 13px; left: 11px; } .icon-plus:before { content: '\f016'; } .icon-minus:before { content: '\f019'; } .icon-info:before { content: '\f01e'; } .icon-left-thin:before { content: '\f08d'; } .icon-up-thin:before { content: '\f08f'; } .icon-right-thin:before { content: '\f08e'; } .icon-down-thin:before { content: '\f08c'; } .icon-level-up:before { content: '\f094'; } .icon-level-down:before { content: '\f093'; } .icon-switch:before { content: '\f097'; } .icon-infinity:before { content: '\f0c3'; } .icon-squared-plus:before { content: '\f018'; } .icon-squared-minus:before { content: '\f01b'; } .icon-home:before { content: '\f022'; } .icon-keyboard:before { content: '\f03b'; } .icon-erase:before { content: '\f0c4'; } .icon-pause:before { content: '\f09a'; } .icon-forward:before { content: '\f09e'; } .icon-backward:before { content: '\f09f'; } .icon-next:before { content: '\f09c'; } .icon-previous:before { content: '\f09d'; } .icon-hourglass:before { content: '\f064'; } .icon-stop:before { content: '\f099'; } .icon-triangle-up:before { content: '\f087'; } .icon-play:before { content: '\f098'; } .icon-triangle-right:before { content: '\f086'; } .icon-triangle-down:before { content: '\f084'; } .icon-triangle-left:before { content: '\f085'; } .icon-adjust:before { content: '\f068'; } .icon-cloud:before { content: '\f0b3'; } .icon-star:before { content: '\f008'; } .icon-star-empty:before { content: '\f009'; } .icon-cup:before { content: '\f047'; } .icon-list:before { content: '\f011'; } .icon-moon:before { content: '\f0b6'; } .icon-heart-empty:before { content: '\f007'; } .icon-heart:before { content: '\f006'; } .icon-music-note:before { content: '\f000'; } .icon-beamed-note:before { content: '\f001'; } .icon-thumbs:before { content: '\f010'; } .icon-flag:before { content: '\f02b'; } .icon-tools:before { content: '\f057'; } .icon-gear:before { content: '\f056'; } .icon-warning:before { content: '\f03f'; } .icon-lightning:before { content: '\f0b5'; } .icon-record:before { content: '\f09b'; } .icon-thunder-cloud:before { content: '\f0b4'; } .icon-voicemail:before { content: '\f0c9'; } .icon-plane:before { content: '\f0b7'; } .icon-mail:before { content: '\f005'; } .icon-pencil:before { content: '\f037'; } .icon-feather:before { content: '\f038'; } .icon-tick:before { content: '\f012'; } .icon-cross:before { content: '\f013'; } .icon-cross-round:before { content: '\f014'; } .icon-squared-cross:before { content: '\f015'; } .icon-question:before { content: '\f01c'; } .icon-quote:before { content: '\f034'; } .icon-plus-round:before { content: '\f017'; } .icon-minus-round:before { content: '\f01a'; } .icon-right:before { content: '\f082'; } .icon-arrow:before { content: '\f045'; } .icon-fwd:before { content: '\f033'; } .icon-undo:before { content: '\f090'; } .icon-redo:before { content: '\f091'; } .icon-left:before { content: '\f081'; } .icon-up:before { content: '\f083'; } .icon-down:before { content: '\f080'; } .icon-list-add:before { content: '\f0a7'; } .icon-numbered-list:before { content: '\f0a6'; } .icon-left-fat:before { content: '\f089'; } .icon-right-fat:before { content: '\f08a'; } .icon-up-fat:before { content: '\f08b'; } .icon-down-fat:before { content: '\f088'; } .icon-add-user:before { content: '\f00c'; } .icon-question-round:before { content: '\f01d'; } .icon-info-round:before { content: '\f01f'; } .icon-eye:before { content: '\f027'; } .icon-price-tag:before { content: '\f028'; } .icon-cloud-upload:before { content: '\f030'; } .icon-reply:before { content: '\f031'; } .icon-reply-all:before { content: '\f032'; } .icon-code:before { content: '\f035'; } .icon-extract:before { content: '\f036'; } .icon-printer:before { content: '\f039'; } .icon-refresh:before { content: '\f03a'; } .icon-speech:before { content: '\f03c'; } .icon-chat:before { content: '\f03d'; } .icon-card:before { content: '\f041'; } .icon-directions:before { content: '\f042'; } .icon-marker:before { content: '\f043'; } .icon-map:before { content: '\f044'; } .icon-compass:before { content: '\f046'; } .icon-trash:before { content: '\f048'; } .icon-page:before { content: '\f049'; } .icon-page-list-inverted:before { content: '\f04d'; } .icon-pages:before { content: '\f04a'; } .icon-frame:before { content: '\f04b'; } .icon-drawer:before { content: '\f052'; } .icon-rss:before { content: '\f054'; } .icon-path:before { content: '\f058'; } .icon-cart:before { content: '\f05a'; } .icon-shareable:before { content: '\f059'; } .icon-login:before { content: '\f05d'; } .icon-logout:before { content: '\f05e'; } .icon-volume:before { content: '\f062'; } .icon-expand:before { content: '\f06a'; } .icon-reduce:before { content: '\f06b'; } .icon-new-tab:before { content: '\f06c'; } .icon-publish:before { content: '\f06d'; } .icon-browser:before { content: '\f06e'; } .icon-arrow-combo:before { content: '\f06f'; } .icon-pie-chart:before { content: '\f0c5'; } .icon-language:before { content: '\f0cb'; } .icon-air:before { content: '\f0cf'; } .icon-database:before { content: '\f0d4'; } .icon-drive:before { content: '\f0d5'; } .icon-bucket:before { content: '\f0d6'; } .icon-thermometer:before { content: '\f0d7'; } .icon-down-round:before { content: '\f070'; } .icon-left-round:before { content: '\f071'; } .icon-right-round:before { content: '\f072'; } .icon-up-round:before { content: '\f073'; } .icon-chevron-down:before { content: '\f074'; } .icon-chevron-left:before { content: '\f075'; } .icon-chevron-right:before { content: '\f076'; } .icon-chevron-up:before { content: '\f077'; } .icon-chevron-small-down:before { content: '\f078'; } .icon-chevron-small-left:before { content: '\f079'; } .icon-chevron-small-right:before { content: '\f07a'; } .icon-chevron-small-up:before { content: '\f07b'; } .icon-chevron-thin-down:before { content: '\f07c'; } .icon-chevron-thin-left:before { content: '\f07d'; } .icon-chevron-thin-right:before { content: '\f07e'; } .icon-chevron-thin-up:before { content: '\f07f'; } .icon-progress-0:before { content: '\f0a0'; } .icon-progress-1:before { content: '\f0a1'; } .icon-progress-2:before { content: '\f0a2'; } .icon-progress-3:before { content: '\f0a3'; } .icon-back-in-time:before { content: '\f0ab'; } .icon-network:before { content: '\f0ae'; } .icon-mailbox:before { content: '\f0b0'; } .icon-download:before { content: '\f0b1'; } .icon-buoy:before { content: '\f0ba'; } .icon-tag:before { content: '\f0bb'; } .icon-dot:before { content: '\f0be'; } .icon-two-dots:before { content: '\f0bf'; } .icon-ellipsis:before { content: '\f0c0'; } .icon-suitcase:before { content: '\f0bd'; } .icon-flow-cascade:before { content: '\f0d9'; } .icon-flow-branch:before { content: '\f0da'; } .icon-flow-tree:before { content: '\f0db'; } .icon-flow-line:before { content: '\f0dc'; } .icon-flow-parallel:before { content: '\f0dd'; } .icon-brush:before { content: '\f0c1'; } .icon-paper-plane:before { content: '\f0b8'; } .icon-magnet:before { content: '\f0c2'; } .icon-gauge:before { content: '\f0df'; } .icon-traffic-cone:before { content: '\f0e0'; } .icon-creative-commons:before { content: '\f0e1'; } .icon-cc-by:before { content: '\f0e2'; } .icon-cc-nc:before { content: '\f0e3'; } .icon-cc-nc-eu:before { content: '\f0e4'; } .icon-cc-nc-jp:before { content: '\f0e5'; } .icon-cc-sa:before { content: '\f0e6'; } .icon-cc-nd:before { content: '\f0e7'; } .icon-cc-pd:before { content: '\f0e8'; } .icon-cc-zero:before { content: '\f0e9'; } .icon-cc-share:before { content: '\f0ea'; } .icon-cc-remix:before { content: '\f0eb'; } .icon-github:before { content: '\f0ec'; } .icon-github-circled:before { content: '\f0ed'; } .icon-flickr:before { content: '\f0ee'; } .icon-flickr-circled:before { content: '\f0ef'; } .icon-vimeo:before { content: '\f0f0'; } .icon-vimeo-circled:before { content: '\f0f1'; } .icon-twitter:before { content: '\f0f2'; } .icon-twitter-circled:before { content: '\f0f3'; } .icon-facebook:before { content: '\f0f4'; } .icon-facebook-circled:before { content: '\f0f5'; } .icon-facebook-squared:before { content: '\f0f6'; } .icon-gplus:before { content: '\f0f7'; } .icon-gplus-circled:before { content: '\f0f8'; } .icon-pinterest:before { content: '\f0f9'; } .icon-pinterest-circled:before { content: '\f0fa'; } .icon-tumblr:before { content: '\f0fb'; } .icon-tumblr-circled:before { content: '\f0fc'; } .icon-linkedin:before { content: '\f0fd'; } .icon-linkedin-circled:before { content: '\f0fe'; } .icon-dribbble:before { content: '\f0ff'; } .icon-dribbble-circled:before { content: '\f100'; } .icon-stumbleupon:before { content: '\f101'; } .icon-stumbleupon-circled:before { content: '\f102'; } .icon-lastfm:before { content: '\f103'; } .icon-lastfm-circled:before { content: '\f104'; } .icon-rdio:before { content: '\f105'; } .icon-rdio-circled:before { content: '\f106'; } .icon-spotify:before { content: '\f107'; } .icon-spotify-circled:before { content: '\f108'; } .icon-qq:before { content: '\f109'; } .icon-instagrem:before { content: '\f10a'; } .icon-dropbox:before { content: '\f10b'; } .icon-evernote:before { content: '\f10c'; } .icon-flattr:before { content: '\f10d'; } .icon-skype:before { content: '\f10e'; } .icon-skype-circled:before { content: '\f10f'; } .icon-renren:before { content: '\f110'; } .icon-sina-weibo:before { content: '\f111'; } .icon-paypal:before { content: '\f112'; } .icon-picasa:before { content: '\f113'; } .icon-soundcloud:before { content: '\f114'; } .icon-mixi:before { content: '\f115'; } .icon-behance:before { content: '\f116'; } .icon-google-circles:before { content: '\f117'; } .icon-vkontakte:before { content: '\f118'; } .icon-smashing:before { content: '\f119'; } .icon-db-shape:before { content: '\f11b'; } .icon-bullet-list:before { content: '\f11a'; } .icon-db-logo:before { content: '\f11c'; } .icon-pictures:before { content: '\f00e'; } .icon-globe:before { content: '\f0b2'; } .icon-leaf:before { content: '\f0b9'; } .icon-graduation-cap:before { content: '\f0ca'; } .icon-mic:before { content: '\f05f'; } .icon-palette:before { content: '\f0a5'; } .icon-ticket:before { content: '\f0cc'; } .icon-movie:before { content: '\f00d'; } .icon-target:before { content: '\f0a4'; } .icon-music:before { content: '\f002'; } .icon-trophy:before { content: '\f0a9'; } .icon-like:before { content: '\f02c'; } .icon-unlike:before { content: '\f02d'; } .icon-bag:before { content: '\f05b'; } .icon-user:before { content: '\f00a'; } .icon-users:before { content: '\f00b'; } .icon-light-bulb:before { content: '\f065'; } .icon-new:before { content: '\f040'; } .icon-water:before { content: '\f0cd'; } .icon-droplet:before { content: '\f0ce'; } .icon-credit-card:before { content: '\f0d0'; } .icon-monitor:before { content: '\f0ac'; } .icon-briefcase:before { content: '\f0bc'; } .icon-save:before { content: '\f0d1'; } .icon-cd:before { content: '\f0af'; } .icon-folder:before { content: '\f051'; } .icon-page-list:before { content: '\f04c'; } .icon-calendar:before { content: '\f05c'; } .icon-line-graph:before { content: '\f0c6'; } .icon-bar-graph:before { content: '\f0c7'; } .icon-clipboard:before { content: '\f0d2'; } .icon-paperclip:before { content: '\f024'; } .icon-ribbons:before { content: '\f02a'; } .icon-book:before { content: '\f050'; } .icon-read:before { content: '\f04f'; } .icon-phone:before { content: '\f055'; } .icon-megaphone:before { content: '\f0d3'; } .icon-outbox:before { content: '\f02f'; } .icon-inbox:before { content: '\f02e'; } .icon-box:before { content: '\f053'; } .icon-newspaper:before { content: '\f04e'; } .icon-mobile:before { content: '\f0ad'; } .icon-wifi:before { content: '\f0a8'; } .icon-camera:before { content: '\f00f'; } .icon-swap:before { content: '\f095'; } .icon-loop:before { content: '\f096'; } .icon-cycle:before { content: '\f092'; } .icon-light-down:before { content: '\f066'; } .icon-light-up:before { content: '\f067'; } .icon-mute:before { content: '\f060'; } .icon-loud:before { content: '\f061'; } .icon-battery:before { content: '\f0aa'; } .icon-search:before { content: '\f003'; } .icon-key:before { content: '\f0d8'; } .icon-lock:before { content: '\f025'; } .icon-unlock:before { content: '\f026'; } .icon-bell:before { content: '\f03e'; } .icon-ribbon:before { content: '\f029'; } .icon-link:before { content: '\f023'; } .icon-revert:before { content: '\f021'; } .icon-flashlight:before { content: '\f004'; } .icon-area-graph:before { content: '\f0c8'; } .icon-clock:before { content: '\f063'; } .icon-rocket:before { content: '\f0de'; } .icon-forbidden:before { content: '\f069'; } /* Thin grey menu */ .title-menu { margin: 0; min-height: 0; list-style-type: none; } .title-menu > li, li.title-menu { padding: 1px 8px 3px; font-size: 13px; line-height: 16px; font-weight: normal; text-align: center; white-space: nowrap; text-overflow: ellipsis; } .title-menu > li > a, li.title-menu > a { display: block; margin: -2px -8px; padding: 2px 8px; color: inherit; white-space: nowrap; text-overflow: ellipsis; position: relative; } /* Calendar events menu */ .calendar-menu { margin: 0; min-height: 0; list-style-type: none; -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; } .calendar-menu > li, li.calendar-menu { padding: 10px 10px 10px 50px; font-size: 13px; line-height: 14px; font-weight: normal; min-height: 40px; border-bottom: dotted 1px silver; padding-bottom: 17px; } .calendar-menu > li > a, li.calendar-menu > a { display: block; margin: -10px -10px -10px -50px; padding: 10px 14px 10px 50px; min-height: 40px; color: inherit; } .calendar-menu > li time, li.calendar-menu time { float: left; display: block; width: 30px; margin-left: -40px; color: #CCCCCC; color: rgba(0, 0, 0, 0.2); text-transform: uppercase; text-align: center; line-height: 12px; } .calendar-menu > li time > b, li.calendar-menu time > b { display: block; font-family: Arial, Helvetica, sans-serif; font-size: 26px; line-height: 28px; margin-bottom: -3px; } .calendar-menu > li small, li.calendar-menu small { display: block; } /* Messages menu */ .message-menu { margin: 0; min-height: 0; list-style-type: none; -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; } .message-menu > li, li.message-menu { padding: 9px 65px 5px 45px; min-height: 41px; color: #4c4c4c; font-size: 13px; line-height: 14px; font-weight: normal; position: relative; } li.chat-item { padding: inherit; min-height: inherit; line-height: inherit; } .message-menu > li > a, li.message-menu > a { display: block; margin: -9px -65px -10px -30px; padding: 9px 57px 10px 30px; min-height: 41px; color: #4c4c4c; position: relative; } li.chat-item > a { margin: inherit; min-height: inherit; } .message-status { float: left; /*margin: 6px 0 0 6px;*/ margin: -1px 0 0 -35px; width: 25px; /*text-align: center;*/ } .message-status > a, .message-status > span { height: 16px; font-weight: bold; } .message-info { position: absolute; top: 9px; right: 7px; /*width: 50px;*/ margin-left: 0; list-style-type: none; text-align: right; } .message-info > a, .message-info > span { display: block; float: right; /*height: 16px;*/ } .starred, .unstarred, .new-message, .attach { display: block; overflow: hidden; text-indent: -9999px; text-align: left; width: 16px; white-space: nowrap; } .starred, .unstarred, .new-message, .attach { display: block; overflow: hidden; text-indent: -9999px; text-align: left; width: 16px; white-space: nowrap; } .starred { background: url(img/sprites.png) no-repeat 0 -34px; } a.starred:hover { background: url(img/sprites.png) no-repeat 0 -50px; } .unstarred { background: url(img/sprites.png) no-repeat -16px -34px; } a.unstarred:hover { background: url(img/sprites.png) no-repeat -16px -50px; } .new-message { background: url(img/sprites.png) no-repeat -32px -34px; } a.new-message:hover { background: url(img/sprites.png) no-repeat -32px -50px; } .attach { background: url(img/sprites.png) no-repeat -48px -34px; } a.attach:hover { background: url(img/sprites.png) no-repeat -48px -50px; } .calendar-menu > li > a, li.calendar-menu > a, .message-menu > li > a, li.message-menu > a { border-left: 0px solid #404040; border-left: 0px solid rgba(0, 0, 0, 0.5); -webkit-transition: border-left-width 100ms, padding-right 100ms; -moz-transition: border-left-width 100ms, padding-right 100ms; -ms-transition: border-left-width 100ms, padding-right 100ms; -o-transition: border-left-width 100ms, padding-right 100ms; transition: border-left-width 100ms, padding-right 100ms; } .touchevents .calendar-menu > li > a:hover, .touchevents li.calendar-menu > a:hover, .touchevents .message-menu > li > a:hover, .touchevents li.message-menu > a:hover { border-left-width: 4px; } /********************************************************/ /* 16. Custom scrollbars */ /********************************************************/ .custom-scroll { overflow: hidden !important; } .custom-hscrollbar, .custom-vscrollbar { position: absolute; z-index: 999000; padding: 0; margin: 0; border: 0; /*background: url(img/old-browsers/grey20.png);*/ background: rgba(128, 128, 128, 0.2); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .custom-hscrollbar { height: 8px; } .custom-vscrollbar { width: 8px; } .custom-hscrollbar > div, .custom-vscrollbar > div { position: absolute; /*background: url(img/old-browsers/grey50.png);*/ background: rgba(128, 128, 128, 0.5); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; cursor: pointer; -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25); -moz-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25); } .custom-hscrollbar > div { top: 0; bottom: 0; } .custom-vscrollbar > div { left: 0; right: 0; } .layout2 #menu > .custom-vscrollbar { display: none !important; user-select: none; } /********************************************************/ /* 17. Buttons */ /********************************************************/ /* Set line-height so buttons fit */ .button-height { line-height: 34px; margin-top: -2px; margin-bottom: -2px; } .button-height.wrapped { padding: 8px 10px; margin-top: 0; } p.button-height, ul.button-height, ol.button-height { margin-bottom: 14px; } p.button-height:last-child, ul.button-height:last-child, ol.button-height:last-child { margin-bottom: -2px; } /* IE7 */ p.button-height.last-child, ul.button-height.last-child, ol.button-height.last-child { margin-bottom: -2px; } .button-height.absolute-left, .button-height.absolute-right { margin-top: -17px; margin-bottom: 0; } /* Disabled elements */ .disabled, .disabled span, .disabled .input, .disabled input, .disabled .label, .disabled label, .disabled .button, .disabled button, .disabled a, :disabled { cursor: not-allowed !important; } .button { display: inline-block; *display: inline; zoom: 1; vertical-align: baseline; *vertical-align: middle; position: relative; text-align: center; font-weight: bold; text-transform: none; padding: 0 11px; font-size: 13px; line-height: 28px; height: 28px; *line-height: 26px; *height: 26px; -webkit-background-clip: padding-box; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; min-width: 6px; border-width: 1px; border-style: solid; -webkit-background-clip: padding-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-appearance: none; background-position: center center !important; /* This is required for glossy gradients image fallbacck*/ } .button::-moz-focus-inner { padding: 0; border: 0; } .ie7 button.button { line-height: 24px; height: 28px; } .ie7 .button { margin-left: 4px; } .ie7 .button:first-child { margin-left: 0; } .button.full-width, .btn.full-width { width: 100%; margin: 0; height: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .no-boxsizing .button.full-width { width: 94%; } .no-boxsizing button.button.full-width { width: 100%; } .button-height .button.float-left, .button-height .button.float-right { margin-top: 2px; } .button.absolute-left, .button.absolute-right { position: absolute; margin-top: -15px; } .button:focus { outline: 0; -webkit-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 1), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 5px rgba(51, 153, 255, 0.75); -moz-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 1), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 5px rgba(51, 153, 255, 0.75); box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 1), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 5px rgba(51, 153, 255, 0.75); } /* Buttons in inputs */ .input .button { margin-top: -1px; margin-bottom: -1px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .input .button:first-child { margin-left: -9px; } .ie7 .input .button:first-child { margin-left: 0; margin-right: 3px; } .input.large .button, .input .button:first-child { -webkit-border-bottom-left-radius: 3px; -webkit-border-top-left-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-bottomleft: 3px; border-bottom-left-radius: 3px; border-top-left-radius: 3px; } .input .button:last-child { margin-right: -9px; } /* IE7 */ .input .button.last-child { margin-right: -9px; } .input.large .button, .input .button:last-child { -webkit-border-bottom-right-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 3px; border-bottom-right-radius: 3px; border-top-right-radius: 3px; } /* Default shadows */ .button, .button-group > .button:first-child, .select-value, .legend { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); } .button-group > .button, .select-arrow { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 1px 0 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 1px 0 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 1px 0 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); } .button, .select-value, .legend { -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); } /* Custom tones shadows */ .button.black-gradient, .button-group > .black-gradient:first-child, .button.anthracite-gradient, .button-group > .anthracite-gradient:first-child, .button.grey-gradient, .button-group > .grey-gradient:first-child, .button.blue-gradient, .button-group > .blue-gradient:first-child, .button.red-gradient, .button-group > .red-gradient:first-child, .button.orange-gradient, .button-group > .orange-gradient:first-child, .button.green-gradient, .button-group > .green-gradient:first-child, .black-gradient > .select-value, .anthracite-gradient > .select-value, .blue-gradient > .select-value, .grey-gradient > .select-value, .red-gradient > .select-value, .orange-gradient > .select-value, .green-gradient > .select-value { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 1px rgba(0, 0, 0, 0.25); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 1px rgba(0, 0, 0, 0.25); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 1px rgba(0, 0, 0, 0.25); } .button.black-gradient, .button.anthracite-gradient, .button.grey-gradient, .button.blue-gradient, .black-gradient > .select-value, .anthracite-gradient > .select-value, .blue-gradient > .select-value, .grey-gradient > .select-value { -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); } .button.red-gradient, .button.orange-gradient, .button.green-gradient, .select.red-gradient > .select-value, .select.orange-gradient > .select-value, .select.green-gradient > .select-value { -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); } .button-group > .silver-gradient, .button-group > .white-gradient, .white-gradient > .select-arrow { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 1px 0 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 1px 0 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 1px 0 0 rgba(255, 255, 255, 0.75), 0 1px 1px rgba(0, 0, 0, 0.15); } .button-group > .black-gradient, .button-group > .anthracite-gradient, .button-group > .grey-gradient, .button-group > .red-gradient, .button-group > .orange-gradient, .button-group > .green-gradient, .button-group > .blue-gradient, .black-gradient > .select-arrow, .anthracite-gradient > .select-arrow, .grey-gradient > .select-arrow, .red-gradient > .select-arrow, .orange-gradient > .select-arrow, .green-gradient > .select-arrow, .blue-gradient > .select-arrow { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 1px 0 0 rgba(255, 255, 255, 0.35), 0 1px 1px rgba(0, 0, 0, 0.25); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 1px 0 0 rgba(255, 255, 255, 0.35), 0 1px 1px rgba(0, 0, 0, 0.25); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 1px 0 0 rgba(255, 255, 255, 0.35), 0 1px 1px rgba(0, 0, 0, 0.25); } /* Active state */ .button:active, .button.active { border: 0; padding: 1px 12px; -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), 0 1px 1px rgba(255, 255, 255, 0.35) !important; -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), 0 1px 1px rgba(255, 255, 255, 0.35) !important; box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), 0 1px 1px rgba(255, 255, 255, 0.35) !important; } .button.silver-active:active, .button.silver-active.active, .button.white-active:active, .button.white-active.active { -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); } .button.black-active:active, .button.black-active.active, .button.anthracite-active:active, .button.anthracite-active.active, .button.grey-active:active, .button.grey-active.active, .button.blue-active:active, .button.blue-active.active { -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); } .button.red-active:active, .button.red-active.active, .button.orange-active:active, .button.orange-active.active, .button.green-active:active, .button.green-active.active { -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); } /* Disabled state */ .button:disabled, .button.disabled, .disabled .button, .disabled .select-value, .disabled .select-arrow { -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; -webkit-text-shadow: none !important; -moz-text-shadow: none !important; text-shadow: none !important; } .button:disabled, .button.disabled, .disabled .button { border-width: 1px; border-style: solid; padding: 0 11px; } /* Icon section in a button */ .button > .button-icon { display: inline-block; vertical-align: baseline; position: relative; text-align: left; font-weight: bold; padding: 0 10px; line-height: inherit; /*line-height:expression(this.parentNode.currentStyle['line-height']);*/ height: inherit; /*height:expression(this.parentNode.currentStyle['height']-2);*/ min-width: 6px; border-width: 1px; border-style: solid; margin: -1px 9px -1px -12px; -webkit-background-clip: padding-box; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3); background-position: center center !important; /* This is required for glossy gradients image fallbacck*/ } .button.button-icon-outline { color: var(--blue-100); background: none; } .button.button-icon-outline:before { content: ''; -webkit-text-stroke: 1px solid var(--blue-600); color: #fff; background: none; } .ie7 .button > .button-icon { margin: -1px 9px -1px 0; } @-moz-document url-prefix() { .button > .button-icon { margin-left: -15px; } } .button.full-width > .button-icon { float: left; } .button > .button-icon.right-side { margin: -1px -12px -1px 9px; -webkit-border-radius: 0; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0; } .ie7 .button > .button-icon.right-side { margin: -1px 0 -1px 0; } @-moz-document url-prefix() { .button > .button-icon.right-side { margin-right: -15px; } } .button.full-width > .button-icon.right-side { float: right; } :active > .button-icon, .active > .button-icon { -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75); -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75); box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75); } :active > .button-icon.black-gradient, .active > .button-icon.black-gradient, :active > .button-icon.anthracite-gradient, .active > .button-icon.anthracite-gradient, :active > .button-icon.grey-gradient, .active > .button-icon.grey-gradient, :active > .button-icon.blue-gradient, .active > .button-icon.blue-gradient { -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); } :active > .button-icon.white-gradient, .active > .button-icon.white-gradient { -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); } :active .button-icon.red-gradient, .active .button-icon.red-gradient, :active .button-icon.orange-gradient, .active .button-icon.orange-gradient, :active .button-icon.green-gradient, .active .button-icon.green-gradient { -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); } :disabled > .button-icon, .disabled .button-icon { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; } /* Tiny button */ .button.tiny, .tiny .button { padding: 0 5px; line-height: 16px; height: 16px; *line-height: 14px; *height: 14px; font-size: 11px; min-width: auto; font-weight: normal; -webkit-background-clip: padding-box; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .ie7 button.button.tiny, .ie7 .tiny button.button { line-height: 12px; height: 16px; } p > .button.tiny, p.tiny > .button, .tiny p > .button { margin-top: -1px; margin-bottom: -1px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .button.tiny.absolute-left, .tiny .button.absolute-left, .button.tiny.absolute-right, .tiny .button.absolute-right { margin-top: -9px; } .input .button.tiny:first-child, .input.tiny .button:first-child { margin-left: -3px; } .input .button.tiny:last-child, .input.tiny .button:last-child { margin-right: -3px; } /* IE7 */ .input .button.tiny.last-child, .input.tiny .button.last-child { margin-right: -3px; } .button.tiny:active, .tiny .button:active, .button.tiny.active, .tiny .button.active { padding: 1px 6px; } .button.tiny:disabled, .button.tiny.disabled, .tiny .button:disabled, .tiny .button.disabled, .tiny.disabled .button, .disabled .tiny .button { padding: 0 5px; } .button-group.tiny, .tiny .button-group { line-height: 18px; height: 18px; margin-top: -2px; margin-bottom: 0; } .button-group.tiny.absolute-left, .tiny .button-group.absolute-left, .button-group.tiny.absolute-right, .tiny .button-group.absolute-right { margin-top: -9px; } /* Compact button */ .button.compact, .compact .button { padding: 0 8px; line-height: 22px; height: 22px; *line-height: 20px; *height: 20px; } .ie7 button.button.compact, .ie7 .compact button.button { line-height: 18px; height: 22px; } .button.compact.absolute-left, .compact .button.absolute-left, .button.compact.absolute-right, .compact .button.absolute-right { margin-top: -12px; } .input .button.compact { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .input .button.compact:first-child, .input.compact .button:first-child { margin-left: -6px; } .input .button.compact:last-child, .input.compact .button:last-child { margin-right: -6px; } /* IE7 */ .input .button.compact.last-child, .input.compact .button.last-child { margin-right: -6px; } .button.compact:active, .compact .button:active, .button.compact.active, .compact .button.active { padding: 1px 9px; } .button.compact:disabled, .button.compact.disabled, .compact .button:disabled, .compact .button.disabled, .compact.disabled .button, .disabled .compact .button { padding: 0 8px; } .button-group.compact, .compact .button-group { line-height: 24px; height: 24px; margin-top: -5px; margin-bottom: -3px; } .button-group.compact.absolute-left, .compact .button-group.absolute-left, .button-group.compact.absolute-right, .compact .button-group.absolute-right { margin-top: -12px; } .compact > .button-icon { margin: -1px 4px -1px -9px; padding: 0 6px; } .compact > .button-icon.right-side { margin: -1px -9px -1px 4px; } /* Big button */ .button.big, .big .button { padding: 0 12px; font-size: 14px; line-height: 32px; height: 32px; *line-height: 30px; *height: 30px; margin-top: 0; margin-bottom: 0; -webkit-background-clip: padding-box; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .ie7 button.button.big, .ie7 .big button.button { line-height: 28px; height: 32px; } .button.big.absolute-left, .big .button.absolute-left, .button.big.absolute-right, .big .button.absolute-right { margin-top: -17px; } .button.big:active, .big .button:active, .button.big.active, .big .button.active, .button.big:first-child:active, .big .button:first-child:active, .button.big.active:first-child, .big .button.active:first-child { padding: 1px 13px; } .button.big:disabled, .button.big.disabled, .big .button:disabled, .big .button.disabled, .big.disabled .button, .disabled .big .button { padding: 0 12px; } .big > .button-icon { margin: -1px 8px -1px -13px; padding: 0 11px; } .big > .button-icon.right-side { margin: -1px -13px -1px 8px; } /* Huge button */ .button.huge, .huge .button { padding: 0 18px; font-size: 18px; line-height: 46px; height: 46px; *line-height: 44px; *height: 44px; min-width: 10px; margin-top: 0; margin-bottom: 0; -webkit-background-clip: padding-box; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .ie7 button.button.huge, .ie7 .huge button.button { line-height: 42px; height: 46px; } .button.huge.absolute-left, .huge .button.absolute-left, .button.huge.absolute-right, .huge .button.absolute-right { margin-top: -24px; } .button.huge:active, .huge .button:active, .button.huge.active, .huge .button.active, .button.huge:first-child:active, .huge .button:first-child:active, .button.huge.active:first-child, .huge .button.active:first-child { padding: 1px 19px; } .button.huge:disabled, .button.huge.disabled, .huge .button:disabled, .huge .button.disabled, .huge.disabled .button, .disabled .huge .button { padding: 0 18px; } .huge > .button-icon { margin: -1px 15px -1px -19px; padding: 0 18px; } .huge > .button-icon.right-side { margin: -1px -19px -1px 15px; } /* Checkable included in a button label */ .js label.button > input[type="checkbox"], .js label.button > input[type="radio"] { display: none; } /* Grouped buttons */ .button-group { display: inline-block; zoom: 1; font-size: 13px; line-height: 30px; height: 30px; vertical-align: middle; padding-left: 1px; } .ie7 .button-group { display: inline; margin-left: 4px; } .ie7 .button-group:first-child { margin-left: 0; } p > .button-group { margin-top: -8px; margin-bottom: -6px; } .button-height .button-group { margin-top: -2px; margin-bottom: 2px; } .button-group.absolute-left, .button-group.absolute-right { margin-top: -15px; } .button-group > .button, .ie7 .button-group > .button { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; float: left; margin-left: -1px; } .button-group > .button:first-child { border-left-width: 1px; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .button-group > .button:last-child { -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } /********************************************************/ /* 18. Loaders */ /********************************************************/ .loader { display: inline-block; *display: inline; zoom: 1; vertical-align: middle; width: 16px; height: 16px; line-height: 16px; background: url(img/loaders/loading16.gif) no-repeat center center; margin-top: -1px; margin-bottom: 1px; } .input .loader:first-child { margin-left: -1px; } .input .loader:last-child { margin-right: -1px; } /* IE7 */ .input .loader.last-child { margin-right: -1px; } .loader.waiting { background-image: url(img/loaders/waiting16.gif); } .loader.working { background-image: url(img/loaders/working16.gif); } .loader.refreshing { background-image: url(img/loaders/refreshing16.gif); } .loader.on-dark { background-image: url(img/loaders/loading16_anthracite.gif); } .loader.waiting.on-dark { background-image: url(img/loaders/waiting16_anthracite.gif); } .loader.working.on-dark { background-image: url(img/loaders/working16_anthracite.gif); } .loader.refreshing.on-dark { background-image: url(img/loaders/refreshing16_anthracite.gif); } .loader.big { background-image: url(img/loaders/loading32.gif); width: 32px; height: 32px; } .loader.big.waiting { background-image: url(img/loaders/waiting32.gif); } .loader.big.working { background-image: url(img/loaders/working32.gif); } .loader.big.refreshing { background-image: url(img/loaders/refreshing32.gif); } .loader.big.on-dark { background-image: url(img/loaders/loading32_anthracite.gif); } .loader.big.waiting.on-dark { background-image: url(img/loaders/waiting32_anthracite.gif); } .loader.big.working.on-dark { background-image: url(img/loaders/working32_anthracite.gif); } .loader.big.refreshing.on-dark { background-image: url(img/loaders/refreshing32_anthracite.gif); } .loader.huge { background-image: url(img/loaders/loading64.gif); width: 64px; height: 64px; } .loader.huge.waiting { background-image: url(img/loaders/waiting64.gif); } .loader.huge.working { background-image: url(img/loaders/working64.gif); } .loader.huge.refreshing { background-image: url(img/loaders/refreshing64.gif); } .loader.huge.on-dark { background-image: url(img/loaders/loading64_anthracite.gif); } .loader.huge.waiting.on-dark { background-image: url(img/loaders/waiting64_anthracite.gif); } .loader.huge.working.on-dark { background-image: url(img/loaders/working64_anthracite.gif); } .loader.huge.refreshing.on-dark { background-image: url(img/loaders/refreshing64_anthracite.gif); } /*.chart_container .chart.loading + div.overlay:after, .chart_container .chart.highcharts.loading:after {*/ /*.loader.huge.waiting { content: ''; width: 125px; height: 125px; position: absolute; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHsAAAB8CAYAAABJws/HAAAJjUlEQVR4nO2dTYwUxxXHf+vFfIYPAbaVtSMcEW1kYiJbBItcCFxsH7AV5eKg3HIwUdq01CLnGEu5RAoqqUgdwoEccSTf7It9CDE5xLK9Igd7D8jIm8SwEk4weLW7gFk2h3qzzA7TM/1R1T09Uz9pxGq7+1Ux/3318epVNQQCgUCgwYzVXYGyKG12A7uBR+TT4kv5TCdx9EUddRs0Giu20uYJ4HlgS4bbvwbeG3XRGym20uYnwLMFHr2YxNH7ruvTFBonttLmeWBPCRPTSRy956o+TeKhuiuQB6XNAcoJDbBHaVOkVWg8jRFbabMFOODI3AGxN1KsqbsCOXAlNMA6see1OVfafK/Lr68kcbTos9w0GiG20mYd5ZvvTnY7tgeA0mY/sBd4usc9V4ALSRx95KMOaTRigCZz6Zc8mH7L1XRMafM48HPg8RyPXQfeTOLoMxd16EdT+uxH+t9SiCdcGBFvPkE+oQG2A79W2vzURT360RSxBxYR+mhJMweVNmVt9CWIXQKlzdOUF7rFfqXNQUe2uhLELojSZgPuhG7xgtJmu2ObKzRF7C892S0zODsIbHBVEWED8IJjmys0RWxfCxhl/oh8Nbn7pdVwTiPETuLoNnDZsdlpsZsbCZZ4EURInaOXoRFiCxcd2/ugxLNeAjJtdIu8laYxYkvww5XgHyRx9HWJ5/POp/PiZZDWGLEBZC267GBtOomjMl4NfptwbzRKbOEtivffI7uWDQ4WQpQ2E8C3gW3AVvn1TWAemAWuJnH0TdlyWsig6m1Zkz6AXcHqx23g/SSOph1V4zr++23nFPZspc2E0uZF7Be+i/tCIz9PAPuAF1OW+kqRxNFF4Cx2mTJtanZZrp91KDRYsX1yxYfRQp6ttNmHFTgLDwM/VNrsBKY8ePm0fKrkEzwGP/Akdm7Pzil0OxPAjws8N3AkcXQFf969iP1jck4usaU5LiJ0i51Km6dKPD9IvOvJ7gVfmSyZxVbaPAy4EOoppc1GB3ZqRbJMXDe3i8AFxzZXyOPZu7D9rwu8RIhq4E2sQK74s8/8tDxiTzgs16Wt2pC++5wjc+d8pyflEXunw3I3DkNTDpDE0SfAKYp7+CJWaO/Jh3VG0DbVWLZTxMN/B+QV7DJwqqos00zz7GHxQp9IX3tOafMudq17N90XTK5jp1YfyR9JZWROJVba/Mxx2X9P4shXBsrAICnGGwCqShlOI08EbQFw5uGjIDSsNPEDQZ4+26U4/3VoK5CRPGL/22G5/3JoK5CRzGJLs+vCI28mcRTEroG8U6+PgbKrVh+XfD5QkNwb+5Q2W7FTiyKh06ng1flR2jwKPAl8t8vlz4FPkzia72en0C5OEfxHrE5Y6MUC8I8kjm4WKW9UUdocBo7QXeROPgTekYheV0pt2VXa7MKuhKVNyRawg7HPXCYtDDuyh+w14NECj3+Kzcz5vPOCk/3ZEmHbxn1PXwBuBE/Oj9LmFeCVkmbmsYKfb/9lIzbjjwpKm+PAYYcmT7cL3sRU4qFEPNql0ADHpd8HgtgDgfTRZZvuNH4po/kg9oDwmkfbm4DjEPrs2pFm9ngFRf02eHb9HKmonMNB7BqRvjRLwMQFzwWx6+UHFZa1KYhdL0UiZIUJYtdLEHuECGKPENeqLCyIXS9B7BHigWVInwSx62WmwrLmg9g1ksTRNWyyQRV8GMSun79WVM5fMi2EKG02Y7ewrAHuAotJHM35rNkoobQ5hd+w6fkkjk6nbv9R2owDj2HnguNdri8BN4D/JHG05KuWI8Ifsdt+fTCPPVWq+wBNcsr2YM83e0BoYRzYAewVzw8URJIDT3sy//tWmvEDYovQk8DajMbGgUmlzTZn1RtBJFfsrGOzp9tTi1f12dJ07yXdm3uxhD0u8k65+o02jpIZ5rEevSqHvNOzH6OY0MhzQ3FWSp2Ih5+g+JTsPPCrbpsFOj37GYqL3eKfYcDmBklEPAI81+fWee7vCEmNyq2ILYOsSQd1vJzE0Q0HdgJtiPBPsvosmmvATC+B22mferk6Q3sjdkoWcIg0y6WOuWzvsxvxXs5AcUK4dIRoF9tV+LPQG3UC/mkXe8GRzRAzH1BWxJbp0v9K2psLQZXBpbPPvoqNhBXF15v1Ag5YJbZ45UxBWzNJHLnqCgIe6LqerbTZAXyH7NG0mSSOynYBI4nS5hBwCBvQ6hbUugRMYQ8f+luZslKTF5Q2a7Gx7h09np8DvggenQ+JVh6VT57l4VngTBJHbxcpt2+mioi+mdXvz7pNGIwVQl6ocxKbK1CUWeBEEkeX8jwU9mdXiNLmVeBVhybfyOPlQeyKUNqcxM9e7MyCh3BpBShtjuJv0/3rSpuXstwYPNsz0kf/yXMxc8Cxfn148Gz/nKygjM3Y7JaeBLE9Is1rmVF3HvZJK5JKENsvLkfepcsLYntCaTNJdV7dYp+8z7wrQWx/HKqp3NSmPIjtDxfJm07LDWL7o64tUUHsGug5Mq6DIPYIEcT2x2zdFegkiO2Pq3VXoJMgtj/q8uyptAuV7wJR2oxhEyHaU57uJnE0bPnmU1R3vHRnuV2pbNVLRN5E+p6yJWB+WESX1KPzfW90y1wSR6nvGamkGReht9F78+A4sGVYjuyQA4beqbjYnuVV1WdvJXuXsV5ps95nZSrkTMXlnet10bvYIlze93Z+S1qDRpPE0VX6COCQM1JeKlV4dtaDeNppDeKGgTPY3G+fXEriqG8rUoXYRUUr8hbfgUP67pP42/A4BxzLcuMgz7PLnu0yMEhu2DHcC97KPctkN5y20IaME1oOsJzE0T1XtpM4uqS0+QXwB9wsf04Bv8lzrKj3QZDSZjvFvHQhywvAXaC0eQg7tuhs6ZaBO65Pf5LNAnm3/rSYww7Gcg/8qmjGi743u5LgitJmDbCe7t/FGLBOtkA5QwZTL2MHb1nDqrPY801fLiI0VOPZ48D2nI99U8XxWuLRWef0d5I4uuupHpPA97E5axPy7yx2MWUWu4Oz9MJKJXNZmWtnbbKWsS9a9/LFtqO06YzR92IZuJXE0bLHKnmlktF4Eke3yDYSXaI6ocfIN5ZoH7w1ksoqL4J/BdzqcnkJe4DPV1UILRT5vzda7EqnXiLkHDAnA6Mx4F4467QaaptnV+jBaRSZQze2v4aGN0tlkIFWXsEb3QKNrNhCnhjA3SaPxGHExZaxQhbB7w3D+TGNXzN2gQR+1vLg97GM9eiiUcCBIojdhojeau3uYT260U13IBAIBAKBQCAQGAT+D3bOspmyA3KOAAAAAElFTkSuQmCC') no-repeat center center; -moz-animation: spin 2s infinite linear; -webkit-animation: spin 2s infinite linear; animation: spin 2s infinite linear; left: 50%; top: 50%; margin-left: -62px; margin-top: -62px }*/ /********************************************************/ /* 19. Messages */ /********************************************************/ .message, .big-message { display: block; position: relative; border-width: 1px; border-style: solid; line-height: 16px; -webkit-background-clip: padding-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: inset 0 1px 0 white, 0 1px 5px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 1px 0 white, 0 1px 5px rgba(0, 0, 0, 0.3); box-shadow: inset 0 1px 0 white, 0 1px 5px rgba(0, 0, 0, 0.3); } .message { padding: 6px 8px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; color: black; } .message .icon { margin-top: -3px; } .message.compact { padding: 3px 4px; font-size: 11px; line-height: 12px; } .big-message { padding: 16px 20px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; color: rgba(0, 0, 0, 0.6); } .big-message strong { color: black; font-size: 18px; font-weight: normal; } .message.silver-gradient, .big-message.silver-gradient, .message.white-gradient, .big-message.white-gradient { -webkit-box-shadow: inset 0 1px 0 white, 0 1px 5px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 1px 0 white, 0 1px 5px rgba(0, 0, 0, 0.3); box-shadow: inset 0 1px 0 white, 0 1px 5px rgba(0, 0, 0, 0.3); color: rgba(0, 0, 0, 0.6); } .message.black-gradient, .big-message.black-gradient, .message.anthracite-gradient, .big-message.anthracite-gradient, .message.grey-gradient, .big-message.grey-gradient, .message.red-gradient, .big-message.red-gradient, .message.orange-gradient, .big-message.orange-gradient, .message.green-gradient, .big-message.green-gradient, .message.blue-gradient, .big-message.blue-gradient { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 5px rgba(0, 0, 0, 0.4); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 5px rgba(0, 0, 0, 0.4); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 5px rgba(0, 0, 0, 0.4); color: rgba(255, 255, 255, 0.45); } .message.black-gradient, .big-message.black-gradient strong, .message.anthracite-gradient, .big-message.anthracite-gradient strong, .message.grey-gradient, .big-message.grey-gradient strong, .message.red-gradient, .big-message.red-gradient strong, .message.orange-gradient, .big-message.orange-gradient strong, .message.green-gradient, .big-message.green-gradient strong, .message.blue-gradient, .big-message.blue-gradient strong { color: white; } .big-message.black-gradient, .big-message.anthracite-gradient, .big-message.grey-gradient, .big-message.red-gradient, .big-message.orange-gradient, .big-message.green-gradient, .big-message.blue-gradient { color: rgba(255, 255, 255, 0.45); } .message.simpler, .big-message.simpler { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .big-message-icon { float: left; margin: 0 17px 0 -3px; text-align: center; } .big-message-icon:before { display: block; font-weight: normal; font-style: normal; font-family: 'EntypoRegular'; font-size: 80px; line-height: 36px; margin: 0; } .big-message-icon.fa:before { display: block; font-weight: normal; font-style: normal; font-family: inherit; font-size: 80px; line-height: 36px; margin: 0; font-size: 32px; } .big-message-icon.with-text { margin: -6px 20px -6px -6px; } .big-message-icon.with-text:before { font-size: 56px; line-height: 29px; } .big-message-icon.right-side { float: right; margin-left: 17px; margin-right: -6px; } .big-message-icon.with-text.right-side { margin-left: 20px; margin-right: -6px; } /********************************************************/ /* 20. Tabs */ /********************************************************/ /* This wrapper class is required to handle responsive variations */ .standard-tabs, .swipe-tabs, .side-tabs { border: 1px solid #cccccc; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; overflow: hidden; position: relative; zoom: 1; } /* Actual tabs */ .tabs { list-style-type: none; margin: 0; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .tabs > li { padding: 12px 30px 12px 12px; border-top: 1px solid #cccccc; color: #c0c0c0; } .tabs > li:first-child { border-top: 0; } .tabs > li > a { display: block; margin: -12px -30px -12px -12px; padding: 12px 30px 12px 12px; color: #222; } .tabs > li > a:focus { outline: 0; } .touchevents .tabs > li > a:hover { color: black; } .tabs > li.disabled > a, .touchevents .tabs > li.disabled > a:hover { color: #c0c0c0; } .standard-tabs.-always-show { height: auto !important; overflow: inherit; } .-always-show.tabs-active > .tabs-content { left: 0; } .standard-tabs.-always-show .tabs-back { display: none; } /* Content */ .tabs-content { background: white; /*color: #666666;*/ -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; overflow: hidden; } /* Back button */ .tabs-back { display: block; padding: 12px 12px 12px 30px; color: #666666; border-bottom: 1px solid #cccccc; cursor: pointer; position: relative; -webkit-border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; } /* When js is activated */ .tabs-active > .tabs, .tabs-active > .tabs-content { position: absolute; top: 0; left: 0; width: 100%; } .tabs-active > .tabs-content { left: 100%; } .tabs-active > .tabs, .tabs-active > .tabs-content.-always-show { position: relative; top: inherit; left: inherit; } /* When transistions are enabled */ .tabs-animated { -webkit-transition: height 300ms; -moz-transition: height 300ms; -ms-transition: height 300ms; -o-transition: height 300ms; transition: height 300ms; } /* Animation must be disabled for inner tabs within equalized tabs, because it give false results */ .same-height .tabs-animated { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } .tabs-animated > .tabs, .tabs-animated > .tabs-content { -webkit-transition: left 300ms; -moz-transition: left 300ms; -ms-transition: left 300ms; -o-transition: left 300ms; transition: left 300ms; } .csstransforms .tabs-animated > .tabs, .csstransforms .tabs-animated > .tabs-content { -webkit-transition: -webkit-transform 300ms; -moz-transition: -moz-transform 300ms; -ms-transition: -ms-transform 300ms; -o-transition: -o-transform 300ms; transition: translatex 300ms; } /* When a tab is opened */ .tab-opened > .tabs { left: -100%; } .csstransforms .tab-opened > .tabs { left: 0; -webkit-transform: translatex(-100%); -moz-transform: translatex(-100%); -ms-transform: translatex(-100%); -o-transform: translatex(-100%); transform: translatex(-100%); } .tab-opened > .tabs-content { left: 0; } .csstransforms .tab-opened > .tabs-content { left: 100%; -webkit-transform: translatex(-100%); -moz-transform: translatex(-100%); -ms-transform: translatex(-100%); -o-transform: translatex(-100%); transform: translatex(-100%); } /* Recursive tabs */ .inner-tabs { border: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; border-top-left-radius: 0; border-top-right-radius: 0; } .with-padding > .inner-tabs { margin: -20px; } .inner-tabs > .tabs-content > .tabs-back { display: none; } /********************************************************/ /* 22. Tooltips */ /********************************************************/ /* Root elements */ #tooltips, #tooltips-over { position: absolute; top: 0; left: 0; } #tooltips { z-index: 999100; } #tooltips-over { z-index: 999500; } .tooltip { position: absolute; /*white-space: nowrap;*/ min-width: 150px; text-align: center; } /* Tooltips inserted inside some elements */ .message.inner-tooltip { position: absolute; display: block; left: 50%; bottom: 100%; text-align: center; margin: 0 0 10px 0; min-width: 16px; max-width: 250px; z-index: 89; pointer-events: none; white-space: nowrap; } .message.inner-tooltip.right { left: 100%; top: 50%; bottom: auto; margin: -15px 0 0 10px; } .message.inner-tooltip.bottom { top: 100%; bottom: auto; margin: 10px 0 0 0; } .message.inner-tooltip.left { left: auto; right: 100%; top: 50%; bottom: auto; margin: -15px 10px 0 0; } .message.inner-tooltip.right.compact, .message.inner-tooltip.left.compact { margin-top: -10px; } .paperwork__wrapper { max-width: 800px; width: 100%; } .paperwork__wrapper { display: flex; gap: 8px; width: calc(100% - 40px); text-align: left; } .paperwork__column { width: 33%; min-width: 220px; box-sizing: border-box; } @media screen and (max-width: 640px) { .paperwork__wrapper { display: block; } .paperwork__column { width: 100%; } } /********************************************************/ /* 10. List arrows, count & sort handle */ /********************************************************/ /* Arrows */ .with-left-arrow, .with-right-arrow, .tabs > li > a { position: relative; } .with-left-arrow:after, .with-right-arrow:after, .tabs > li > a:after { display: block; content: ''; width: 15px; height: 20px; position: absolute; top: 50%; margin: -11px 0 0 0; padding: 0; border: 0; } /* IE7 */ .with-arrow-after { display: block; width: 15px !important; height: 20px !important; position: absolute !important; top: 50%; margin: -11px 0 0 0 !important; padding: 0 !important; border: 0 !important; } .with-left-arrow:after { left: 7px; background: url(img/sprites.png) no-repeat -209px 0; } /* IE7 */ .with-left-arrow > .with-arrow-after { left: 7px; background: url(img/sprites.png) no-repeat -209px 0; } .with-right-arrow:after, .tabs > li > a:after { right: 7px; background: url(img/sprites.png) no-repeat -224px -20px; } /* IE7 */ .with-right-arrow > .with-arrow-after, .tabs > li > a > .with-arrow-after { right: 7px; background: url(img/sprites.png) no-repeat -224px 0; } /* Variations */ .with-left-arrow.grey-arrow:after { background-position: -209px -20px; } .with-left-arrow.black-arrow:after { background-position: -209px -40px; } .with-right-arrow.grey-arrow:after, .tabs > li > a:after { background-position: -224px -20px; } .with-right-arrow.black-arrow:after { background-position: -224px -40px; } /* IE7 */ .with-left-arrow.grey-arrow > .with-arrow-after { background-position: -209px -20px; } .with-left-arrow.black-arrow > .with-arrow-after { background-position: -209px -40px; } .with-right-arrow.grey-arrow > .with-arrow-after, .tabs > li > a > .with-arrow-after { background-position: -224px -20px; } .with-right-arrow.black-arrow > .with-arrow-after { background-position: -224px -40px; } /* Arrow up */ .arrow-up:after { background-position: -239px 0; width: 20px; height: 15px; margin: -8px -2px 0 -2px; } .arrow-up.grey-arrow:after { background-position: -239px -15px; } .arrow-up.black-arrow:after { background-position: -239px -30px; } /* IE7 */ .arrow-up > .with-arrow-after { background-position: -239px 0; width: 20px !important; height: 15px !important; margin: -8px -2px 0 -2px !important; } .arrow-up.grey-arrow > .with-arrow-after { background-position: -239px -15px; } .arrow-up.black-arrow > .with-arrow-after { background-position: -239px -30px; } /* Arrow down */ .arrow-down:after { background-position: -259px 0; width: 20px; height: 15px; margin: -8px -2px 0 -2px; } .arrow-down.grey-arrow:after { background-position: -259px -15px; } .arrow-down.black-arrow:after { background-position: -259px -30px; } /* IE7 */ .arrow-down > .with-arrow-after { background-position: -259px 0; width: 20px !important; height: 15px !important; margin: -8px -2px 0 -2px !important; } .arrow-down.grey-arrow > .with-arrow-after { background-position: -259px -15px; } .arrow-down.black-arrow > .with-arrow-after { background-position: -259px -30px; } /* Count */ .list-count { display: block; position: absolute; top: 50%; right: 10px; font-size: 13px; line-height: 16px; height: 16px; padding: 1px 6px; margin: -9px 0; min-width: 11px; text-align: center; background: rgba(128, 128, 128, 0.2); -webkit-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.5); -webkit-border-radius: 9px; -moz-border-radius: 9px; border-radius: 9px; -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; } .with-right-arrow > .list-count, .with-right-arrow > a > .list-count, .with-right-arrow > span > .list-count, .tabs > li > .list-count, .tabs > li > a > .list-count, .tabs > li > span > .list-count { right: 30px; } .no-boxshadow .list-count { padding: 0 6px; border: 1px solid white; } /* Sort handle */ .list-sort { display: block; position: absolute; right: 0; top: 50%; margin-top: -4px; width: 11px; height: 8px; background: url(img/sprites.png) no-repeat -154px 0; cursor: move; } /********************************************************/ /* 11. Block arrows */ /********************************************************/ .block-arrow { display: block; width: 0; height: 0; padding: 0; position: absolute; top: 100%; left: 50%; margin: 1px 0 0 -6px; border: 6px solid transparent; border-top-color: inherit; } .block-arrow > span { display: block; width: 0; height: 0; position: absolute; margin: -7px -6px -5px -6px; border: 6px solid transparent; border-top-color: #e4e7eb; } .silver-gradient > .block-arrow > span { border-top-color: #d6dadf; } .translucid > .block-arrow > span, .notification > .block-arrow > span, .black-gradient > .block-arrow > span { border-top-color: #000000; } .anthracite-gradient > .block-arrow > span { border-top-color: #404040; } .grey-gradient > .block-arrow > span { border-top-color: #939393; } .red-gradient > .block-arrow > span { border-top-color: #d52607; } .orange-gradient > .block-arrow > span { border-top-color: #ff9e00; } .green-gradient > .block-arrow > span { border-top-color: #608807; } .blue-gradient > .block-arrow > span { border-top-color: #00438d; } .block-arrow.top { top: auto; left: 50%; bottom: 100%; margin: 0 0 1px -6px; border-top-color: transparent; border-bottom-color: inherit; } .block-arrow.top > span { margin: -5px -6px -7px -6px; border-top-color: transparent; border-bottom-color: #f7f7fa; } .silver-gradient > .block-arrow.top > span { border-bottom-color: #efeff4; } .translucid > .block-arrow.top > span, .notification > .block-arrow.top > span, .black-gradient > .block-arrow.top > span { border-bottom-color: #333333; } .anthracite-gradient > .block-arrow.top > span { border-bottom-color: #565656; } .grey-gradient > .block-arrow.top > span { border-bottom-color: #b3b3b3; } .red-gradient > .block-arrow.top > span { border-bottom-color: #e24913; } .orange-gradient > .block-arrow.top > span { border-bottom-color: #ffb900; } .green-gradient > .block-arrow.top > span { border-bottom-color: #90bb13; } .blue-gradient > .block-arrow.top > span { border-bottom-color: #006aac; } .block-arrow.right { top: 50%; left: 100%; margin: -6px 0 0 1px; border-top-color: transparent; border-left-color: inherit; } .block-arrow.right > span { margin: -6px -5px -6px -7px; border-top-color: transparent; border-left-color: #eeeff2; } .silver-gradient > .block-arrow.right > span { border-left-color: #e3e4ea; } .translucid > .block-arrow.right > span, .notification > .block-arrow.right > span, .black-gradient > .block-arrow.right > span { border-left-color: #1a1a1a; } .anthracite-gradient > .block-arrow.right > span { border-left-color: #4b4b4b; } .grey-gradient > .block-arrow.right > span { border-left-color: #a3a3a3; } .red-gradient > .block-arrow.right > span { border-left-color: #db370c; } .orange-gradient > .block-arrow.right > span { border-left-color: #ffac00; } .green-gradient > .block-arrow.right > span { border-left-color: #97c526; } .blue-gradient > .block-arrow.right > span { border-left-color: #00569c; } .block-arrow.left { top: 50%; left: auto; right: 100%; margin: -6px 1px 0 0; border-top-color: transparent; border-right-color: inherit; } .block-arrow.left > span { margin: -6px -7px -6px -5px; border-top-color: transparent; border-right-color: #eeeff2; } .silver-gradient > .block-arrow.left > span { border-right-color: #e3e4ea; } .translucid > .block-arrow.left > span, .notification > .block-arrow.left > span, .black-gradient > .block-arrow.left > span { border-right-color: #1a1a1a; } .anthracite-gradient > .block-arrow.left > span { border-right-color: #4b4b4b; } .grey-gradient > .block-arrow.left > span { border-right-color: #a3a3a3; } .red-gradient > .block-arrow.left > span { border-right-color: #db370c; } .orange-gradient > .block-arrow.left > span { border-right-color: #ffac00; } .green-gradient > .block-arrow.left > span { border-right-color: #97c526; } .blue-gradient > .block-arrow.left > span { border-right-color: #00569c; } /********************************************************/ /* 14. Main layout elements */ /********************************************************/ /* Main content */ #main { position: relative; z-index: 2; /*margin-top: 57px;*/ border-top: solid 1px #f2f7f8; } .fixed-title-bar > #main { margin-top: 25px; } /* Title */ #main-title { /*color: #b3b5b8;*/ padding: 17px 20px 21px; position: relative; } #main-title + .with-padding { padding-top: 0 !important; } #main-title h1, #main-title h2 { margin: 0; padding: 0; } #main-title h2 { position: absolute; top: 17px; right: 20px; font-size: 22px; } #main-title h2 strong { font-size: 30px; vertical-align: -3px; } /* Side tabs shortcuts */ #shortcuts { display: none; position: absolute; z-index: 1000; top: 50px; right: 10px; margin: 0; width: 240px; list-style-type: none; padding: 15px 4px 5px 14px; padding-bottom: 25px; border: 1px solid white; background: #f9f9f9; /*-webkit-background-size: auto; -moz-background-size: auto; -o-background-size: auto; background-size: auto; background: #555 url(img/textures/grid.png); -webkit-box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.3); box-shadow: inset -5px 5px 5px rgba(0, 0, 0, 0.3); -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;*/ -webkit-box-shadow: 0 1px 7px #aaa; -moz-box-shadow: 0 1px 7px #aaa; box-shadow: 0 1px 7px #aaa; } .reversed #shortcuts { left: auto; right: 10px; } body.shortcuts-open #shortcuts { display: block; } .fixed-title-bar > #shortcuts { position: fixed; } #shortcuts:before { display: block; content: ' '; width: 0; height: 0; border: 7px solid transparent; border-bottom-color: white; position: absolute; bottom: 100%; right: 75px; } #shortcuts > li { float: left; width: 55px; height: 55px; margin: 3px 0 2px 5px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; text-align: center; cursor: pointer; } #shortcuts > li > a { display: block; color: #ccc; padding-top: 9px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } #shortcuts > li[data-body="0"] { background-color: transparent !important; border: solid 1px #ccc; } #shortcuts > li.current[data-body="0"] { border: solid 1px #147297; } #shortcuts > li[data-body="0"] > a { color: #ccc; } #shortcuts > li.current[data-body="0"] > a { color: #147297; } #shortcuts > li.current[data-body="0"]:hover > a { color: black; } #shortcuts > li > a > span { display: block; } #shortcuts > li > a > span.fa { margin: 2px 0 2px 0; font-size: 22px; } #shortcuts > li > a > span.only { margin-top: 8px; font-size: 35px; } #shortcuts > li > a > span.code { font-size: 8px; line-height: 21px; background-color: transparent; width: 35px; margin: 0 auto; } #shortcuts > li.current { background: #147297; /*border: solid 1px #ddd;*/ } #shortcuts > li.current > a { color: #fff; } #shortcuts > li:hover > a { color:#667; } #shortcuts > li.current:hover > a { color: #fff; } #shortcuts > li.at-bottom { background: #FFC107; } #shortcuts > li.at-bottom:hover { box-shadow: 0 14px 26px -12px rgba(255, 193, 7, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(255, 193, 7, 0.2); } #shortcuts .count { top: 18px; right: 18px; } /********************************************************/ /* 21. Notifications */ /********************************************************/ #top-notifications, #bottom-notifications { position: absolute; /* This is for older iOS devices that do not support position: fixed */ position: fixed; z-index: 999400; right: 0; left: 0; text-align: left; } #top-notifications { top: 0; } #bottom-notifications { bottom: 0; } #top-notifications > ul, #bottom-notifications > ul { list-style-type: none; margin: 0; } .notification { border-width: 1px; border-style: solid; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin: 5px; position: relative; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 2px 7px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 2px 7px rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 2px 7px rgba(0, 0, 0, 0.5); } .notification > .close { margin: -3px -3px 0 0; } .notification > a, .notification > div { display: block; text-decoration: none; padding: 6px 10px; color: inherit; margin: 0; } .notification.no-title > a, .notification.no-title > div { color: white; } .notification > a > h3, .notification > div > h3 { color: white; font-size: 16px; line-height: 19px; margin-bottom: 4px; } .notification > a > b, .notification > div > b, .notification > div > a { color: white; } .notification.silver-gradient.no-title > a, .notification.silver-gradient.no-title > div, .notification.silver-gradient > a > h3, .notification.silver-gradient > div > h3, .notification.white-gradient.no-title > a, .notification.white-gradient.no-title > div, .notification.white-gradient > a > h3, .notification.white-gradient > div > h3, .notification.silver-gradient > a > b, .notification.silver-gradient > div > b, .notification.white-gradient > a > b, .notification.white-gradient > div > b { color: #333333; } .notification-icon { float: left; margin: 7px 6px 7px 8px; } .notification > .block-arrow { display: none; } .extra-notifications { padding: 2px 6px; font-weight: bold; -webkit-border-bottom-left-radius: 3px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 -1px 0 rgba(0, 0, 0, 0.5); margin-bottom: 0; } .more-notifications { padding: 3px 7px; cursor: pointer; } /********************************************************/ /* 23. Extra stuff */ /********************************************************/ /* Fix mobile browsers increased font-size */ body { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } /* Taped link color */ a:link { -webkit-tap-highlight-color: rgb(52,158,219); } /* Better resized images under IE7 */ .ie7 img, .iem7 img { -ms-interpolation-mode: bicubic; } /* The legen - wait for it - dary clearfix */ .clearfix:before, .clearfix:after, .columns:before, .columns:after, .left-column-200px:before, .left-column-200px:after, .right-column-200px:before, .right-column-200px:after, .right-column-100px:before, .right-column-100px:after, #profile:before, #profile:after, #main-title:before, #main-title:after, .notification:before, .notification:after, .inline-small-label:before, .inline-small-label:after, .inline-label:before, .inline-label:after, .inline-medium-label:before, .inline-medium-label:after, .inline-large-label:before, .inline-large-label:after, .definition.inline:before, .definition.inline:after, .blocks-list:before, .blocks-list:after { content: "\0020"; display: block; height: 0; visibility: hidden; } .clearfix:after, .columns:after, .left-column-200px:after, .right-column-200px:after, #profile:after, #main-title:after, .notification:after, .inline-small-label:after, .inline-label:after, .inline-medium-label:after, .inline-large-label:after, .definition.inline:after, .blocks-list:after { clear: both; } .clearfix, .columns, .left-column-200px, .right-column-200px, .right-column-100px, #profile, #main-title, .notification, .inline-small-label, .inline-label, .inline-medium-label, .inline-large-label, .definition.inline, .blocks-list { zoom: 1; } #profile-sms { background: #fff; color:#000; -webkit-text-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); -moz-text-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); text-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); } /* Image replacement */ .ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; } /* Hide for screenreaders and visual browsers */ .hidden { display: none; visibility: hidden; } /* Hide visually */ .visuallyhidden { position: absolute; clip: rect(0 0 0 0); overflow: hidden; margin: -1px; padding: 0; height: 1px; width: 1px; border: 0; } /* Allow an element to be focusable via keyboard */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { position: static; clip: auto; overflow: visible; height: auto; margin: 0; width: auto; } /* Hide but maintain layout */ .invisible { visibility: hidden; } ul.message-menu li a:hover span.chat-status { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; -webkit-transition: opacity 200ms; -moz-transition: opacity 200ms; -ms-transition: opacity 200ms; -o-transition: opacity 200ms; transition: opacity 200ms; } ol.levels { counter-reset: item; margin-top: 20px; } ol.levels li { display: block; } ol.levels li:before { content: counters(item, ".") ". "; counter-increment: item; font-weight: bold; } /********************************************************/ /* Bootstrap-tour styles */ /********************************************************/ .popover { position: absolute; top: 0; left: 0; z-index: 1060; display: none; max-width: 276px; padding: 1px; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-style: normal; font-weight: 400; letter-spacing: normal; line-break: auto; line-height: 1.42857143; text-align: left; text-align: start; text-decoration: none; text-shadow: none; text-transform: none; white-space: normal; word-break: normal; word-spacing: normal; word-wrap: normal; font-size: 14px; background-color: #fff; background-clip: padding-box; border: 1px solid #ccc; border: 1px solid rgba(0,0,0,.2); border-radius: 6px; -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2); box-shadow: 0 5px 10px rgba(0,0,0,.2) } .popover.top { margin-top: -10px } .popover.right { margin-left: 10px } .popover.bottom { margin-top: 10px } .popover.left { margin-left: -10px } .popover-title { margin: 0; padding: 8px 14px; font-size: 14px; background-color: #f7f7f7; border-bottom: 1px solid #ebebeb; border-radius: 5px 5px 0 0 } .popover-content { padding: 9px 14px } .popover > .arrow, .popover > .arrow:after { position: absolute; display: block; width: 0; height: 0; border-color: transparent; border-style: solid } .popover > .arrow { border-width: 11px } .popover > .arrow:after { border-width: 10px; content: "" } .popover.top > .arrow { left: 50%; margin-left: -11px; border-bottom-width: 0; border-top-color: #999; border-top-color: rgba(0,0,0,.25); bottom: -11px } .popover.top > .arrow:after { content: " "; bottom: 1px; margin-left: -10px; border-bottom-width: 0; border-top-color: #fff } .popover.right > .arrow { top: 50%; left: -11px; margin-top: -11px; border-left-width: 0; border-right-color: #999; border-right-color: rgba(0,0,0,.25) } .popover.right > .arrow:after { content: " "; left: 1px; bottom: -10px; border-left-width: 0; border-right-color: #fff } .popover.bottom > .arrow { left: 50%; margin-left: -11px; border-top-width: 0; border-bottom-color: #999; border-bottom-color: rgba(0,0,0,.25); top: -11px } .popover.bottom > .arrow:after { content: " "; top: 1px; margin-left: -10px; border-top-width: 0; border-bottom-color: #fff } .popover.left > .arrow { top: 50%; right: -11px; margin-top: -11px; border-right-width: 0; border-left-color: #999; border-left-color: rgba(0,0,0,.25) } .popover.left > .arrow:after { content: " "; right: 1px; border-right-width: 0; border-left-color: #fff; bottom: -10px } .tour-step-backdrop { position: relative; z-index: 1101 } .tour-step-backdrop > td { position: relative; z-index: 1101 } .tour-step-background { position: absolute !important; z-index: 1100; background: inherit; border-radius: 6px } .popover[class*=tour-] { z-index: 1102 } .popover[class*=tour-] .popover-navigation { padding: 9px 14px; overflow: hidden } .popover[class*=tour-] .popover-navigation [data-role=end] { float: right } .popover[class*=tour-] .popover-navigation [data-role=prev], .popover[class*=tour-] .popover-navigation [data-role=next], .popover[class*=tour-] .popover-navigation [data-role=end] { cursor: pointer } .popover[class*=tour-] .popover-navigation [data-role=prev].disabled, .popover[class*=tour-] .popover-navigation [data-role=next].disabled, .popover[class*=tour-] .popover-navigation [data-role=end].disabled { cursor: default } .popover[class*=tour-].orphan { position: fixed; margin-top: 0 } .popover[class*=tour-].orphan .arrow { display: none } @media print { html { height: 95% !important; } .minheight40 { min-height: 700px; } } /** * Colors for the whole template * Using a separate stylesheet allows easy customizing and upgrading * * Content: * 1. Generic colors * 2. Generic backgrounds * 3. Specific gradients * 4. Inputs & progress * 5. Modal window * 6. Generic gradients - defaults * 7. Generic gradients - main * 8. Generic gradients - active * 9. Generic gradients - disabled * * Hey wait! Why are the generic gradient declared several times? * -> to is the best way to handle inheritance issues. For instance, if all generic gradients * where only declared once, * because the blue styles are declared after the green ones. */ /********************************************************/ /* 1. Generic colors */ /********************************************************/ .silver, .silver-color .color { color: #cccccc !important; } .icon-silver:before { color: #cccccc; } .black, .black-color .color { color: black !important; } .icon-black:before { color: black; } .anthracite, .anthracite-color .color { color: #4c4c4c !important; } .icon-anthracite:before { color: #4c4c4c; } .grey, .grey-color .color { color: #a5a5a5 !important; } .icon-grey:before { color: #a5a5a5; } .white, .white-color .color { color: white !important; } .icon-white:before { color: white; } .orange, .orange-color .color { color: #ce7502 !important; } .icon-orange:before { color: #ffae00; } .green, .green-color .color { color: #6d960c !important; } .icon-green:before { color: #6d960c; } .blue, .blue-color .color { color: #0059a0 !important; } .icon-blue:before { color: #0059a0; } .magenta, .magenta-color .color { color: #EC73E7 !important; } .icon-magenta:before { color: #EC73E7; } .lightblue, .lightblue-color .color { color: #3F9BE4 !important; } .icon-lightblue:before { color: #3F9BE4; } .red, .red-color .color { color: #dd380d !important; } .icon-red:before { color: #dd380d; } /********************************************************/ /* 2. Generic backgrounds */ /********************************************************/ .carbon { color: white; background: #3c4044 url(img/textures/grid.png); background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0))), #3c4044 url(img/textures/grid.png); background: -webkit-linear-gradient( top, rgba(0,0,0,0.4), rgba(0,0,0,0)), #3c4044 url(img/textures/grid.png); background: -moz-linear-gradient( top, rgba(0,0,0,0.4), rgba(0,0,0,0)), #3c4044 url(img/textures/grid.png); background: -ms-linear-gradient( top, rgba(0,0,0,0.4), rgba(0,0,0,0)), #3c4044 url(img/textures/grid.png); background: -o-linear-gradient( top, rgba(0,0,0,0.4), rgba(0,0,0,0)), #3c4044 url(img/textures/grid.png); background: linear-gradient( top, rgba(0,0,0,0.4), rgba(0,0,0,0)), #3c4044 url(img/textures/grid.png); } .linen { background: #F7F7FA url(img/textures/linen.png); } .scratch-metal { border-color: #999999; background: #dedede url(img/textures/scratches.png); background: url(img/textures/scratches.png), -webkit-gradient(linear, left top, left bottom, from(#aaaaaa), to(#aaaaaa), color-stop(0.25, #f2f2f2), color-stop(0.38, #ffffff), color-stop(0.63, #c5c5c5), color-stop(0.87, #f7f7f7)); background: url(img/textures/scratches.png), -webkit-linear-gradient(top, #aaaaaa, #f2f2f2 25%, #ffffff 38%, #c5c5c5 63%, #f7f7f7 87%, #aaaaaa); background: url(img/textures/scratches.png), -moz-linear-gradient(top, #aaaaaa, #f2f2f2 25%, #ffffff 38%, #c5c5c5 63%, #f7f7f7 87%, #aaaaaa); background: url(img/textures/scratches.png), -ms-linear-gradient(top, #aaaaaa, #f2f2f2 25%, #ffffff 38%, #c5c5c5 63%, #f7f7f7 87%, #aaaaaa); background: url(img/textures/scratches.png), -o-linear-gradient(top, #aaaaaa, #f2f2f2 25%, #ffffff 38%, #c5c5c5 63%, #f7f7f7 87%, #aaaaaa); background: url(img/textures/scratches.png), linear-gradient(top, #aaaaaa, #f2f2f2 25%, #ffffff 38%, #c5c5c5 63%, #f7f7f7 87%, #aaaaaa); } /********************************************************/ /* 3. Specific gradients */ /********************************************************/ .input-wrapper { background: #585d62 /*url(img/old-browsers/colors/bg_input-wrapper.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#6e7377), to(#585d62)); background: -webkit-linear-gradient(top, #6e7377, #585d62); background: -moz-linear-gradient(top, #6e7377, #585d62); background: -ms-linear-gradient(top, #6e7377, #585d62); background: -o-linear-gradient(top, #6e7377, #585d62); background: linear-gradient(top, #6e7377, #585d62); } /*.big-menu { color: white; background: #001A29 url(img/old-browsers/colors/bg_big-menu.png) repeat-x; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#008ED1), to(#001A29)); background: -webkit-linear-gradient(top, #008ED1, #001A29); background: -moz-linear-gradient(top, #008ED1, #001A29); background: -ms-linear-gradient(top, #008ED1, #001A29); background: -o-linear-gradient(top, #008ED1, #001A29); background: linear-gradient(top, #008ED1, #001A29); background: -webkit-linear-gradient(top, #008ED1, #001A29); }*/ .translucid, .notification { color: #bdbdbd; /*background: url(img/old-browsers/black75.png) repeat-x;*/ -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.2)), to(rgba(255, 255, 255, 0))), rgba(0, 0, 0, 1); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)), rgba(0, 0, 0, 1); background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)), rgba(0, 0, 0, 1); background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)), rgba(0, 0, 0, 1); background: -o-linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)), rgba(0, 0, 0, 1); background: linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)), rgba(0, 0, 0, 1); border-color: black; } .field-drop, .row-drop > th, .row-drop > td, .cell-drop /*, .back*/ { background: #3c4044; /*background: #3c4044 url(img/textures/grid.png) !important; background: url(img/textures/grid.png), -webkit-gradient(linear, left top, left bottom, from(#6d7073), to(#3c4044)) !important; background: url(img/textures/grid.png), -webkit-linear-gradient(top, #6d7073, #3c4044) !important; background: url(img/textures/grid.png), -moz-linear-gradient(top, #6d7073, #3c4044) !important; background: url(img/textures/grid.png), -ms-linear-gradient(top, #6d7073, #3c4044) !important; background: url(img/textures/grid.png), -o-linear-gradient(top, #6d7073, #3c4044) !important; background: url(img/textures/grid.png), linear-gradient(top, #6d7073, #3c4044) !important;*/ color: #afafaf; } .field-drop b, .field-drop strong, .row-drop b, .row-drop strong, .cell-drop b, .cell-drop strong { color: white; } /********************************************************/ /* 4. Inputs & progress */ /********************************************************/ .input, .inputs, .progress, .slider, .checkbox, .radio, .select { background: #fff /*url(img/old-browsers/bg_input.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(white), to(#fff)); background: -webkit-linear-gradient(top, white, #fff); background: -moz-linear-gradient(top, white, #fff); background: -ms-linear-gradient(top, white, #fff); background: -o-linear-gradient(top, white, #fff); background: linear-gradient(top, white, #fff); border-color: #cccccc; /* color: #003366;*/ color: #333; } .black-inputs .input, .input.black-input, .black-inputs .inputs, .inputs.black-input, .black-inputs .progress, .progress.black-input, .black-inputs .slider, .slider.black-input, .black-inputs .checkbox, .checkbox.black-input, .black-inputs .select, .select.black-input, .black-inputs .radio, .radio.black-input { background: #323232 /*url(img/old-browsers/bg_black-inputs_input.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#4b4b4b), to(#323232)); background: -webkit-linear-gradient(top, #4b4b4b, #323232); background: -moz-linear-gradient(top, #4b4b4b, #323232); background: -ms-linear-gradient(top, #4b4b4b, #323232); background: -o-linear-gradient(top, #4b4b4b, #323232); background: linear-gradient(top, #4b4b4b, #323232); color: white; border-color: #777777; } .input:disabled { -webkit-text-fill-color: #999999; } .black-inputs .input:disabled, .input.black-input:disabled { -webkit-text-fill-color: #cccccc; } /********************************************************/ /* 5. Modal window */ /********************************************************/ .modal { background: white; /*-webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#002D42), to(#001E2C)); background: -webkit-linear-gradient(top, #002D42, #001E2C); background: -moz-linear-gradient(top, #002D42, #001E2C); background: -ms-linear-gradient(top, #002D42, #001E2C); background: -o-linear-gradient(top, #002D42, #001E2C); background: linear-gradient(top, #002D42, #001E2C);*/ color: #0b597d; border-color: #2e6da4; } .modal-bar { background-color: #337ab7; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; /*background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.15)), to(rgba(255, 255, 255, 0))); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0) 50%); background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0) 50%); background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0) 50%); background: -o-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0) 50%); background: linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0) 50%);*/ } /********************************************************/ /* 6. Generic gradients - defaults */ /********************************************************/ /* Silver */ .button, .button:visited, .select-value, .select-arrow, .switch-button, .agenda-header, .agenda-event, .label-count, .tabs-back, .blocks-list > li, .panel-control, .wizard-step { color: #666666; background: #d6dadf /*url(img/old-browsers/bg_button.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#efeff4), to(#d6dadf)); background: -webkit-linear-gradient(top, #efeff4, #d6dadf); background: -moz-linear-gradient(top, #efeff4, #d6dadf); background: -ms-linear-gradient(top, #efeff4, #d6dadf); background: -o-linear-gradient(top, #efeff4, #d6dadf); background: linear-gradient(top, #efeff4, #d6dadf); border-color: #cccccc; } /* Silver */ .legend, .block-title, .details > summary, .accordion > dt, .table > thead > tr > th, .table > thead > tr > td, .table > tfoot > tr > th, .table > tfoot > tr > td { color: #666666; background: #f4f4f4; /*-webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#efeff4), to(#d6dadf)); background: -webkit-linear-gradient(top, #efeff4, #d6dadf); background: -moz-linear-gradient(top, #efeff4, #d6dadf); background: -ms-linear-gradient(top, #efeff4, #d6dadf); background: -o-linear-gradient(top, #efeff4, #d6dadf); background: linear-gradient(top, #efeff4, #d6dadf);*/ border-color: #cccccc; } a.button:hover, button.button:hover, a.select-value:hover, .touchevents .select-arrow:hover, a.agenda-event:hover, a.label-count:hover { color: #666666; background: #d7dbdf /*url(img/old-browsers/bg_a_button_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#d7dbdf)); background: -webkit-linear-gradient(top, #fefefe, #d7dbdf); background: -moz-linear-gradient(top, #fefefe, #d7dbdf); background: -ms-linear-gradient(top, #fefefe, #d7dbdf); background: -o-linear-gradient(top, #fefefe, #d7dbdf); background: linear-gradient(top, #fefefe, #d7dbdf); border-color: #cccccc; } .button.glossy, .glossy > .select-value, .glossy > .select-arrow { /*color: #666666;*/ background: #dcdce0 /*url(img/old-browsers/bg_button_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f7), to(#dcdce0), color-stop(0.5, #dededf), color-stop(0.5, #d1d1d2)); background: -webkit-linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); background: -moz-linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); background: -ms-linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); background: -o-linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); background: linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); } a.button.glossy:hover, button.button.glossy:hover, .glossy > a.select-value:hover, .glossy > .select-arrow:hover { background: #e8e8eb /*url(img/old-browsers/bg_a_button_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fafafc), to(#e8e8eb), color-stop(0.5, #ededf0), color-stop(0.5, #e3e3e5)); background: -webkit-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -moz-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -ms-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -o-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); } a.button:active, button.button:active, .button.active, .button.active:hover, a.button.glossy:active, button.button.glossy:active, .button.glossy.active { background: #dbdbdb /*url(img/old-browsers/bg_a_button_active.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#bdbdbd), to(#dbdbdb)); background: -webkit-linear-gradient(top, #bdbdbd, #dbdbdb); background: -moz-linear-gradient(top, #bdbdbd, #dbdbdb); background: -ms-linear-gradient(top, #bdbdbd, #dbdbdb); background: -o-linear-gradient(top, #bdbdbd, #dbdbdb); background: linear-gradient(top, #bdbdbd, #dbdbdb); } /* Black */ #title-bar { /*background-color: #123B4F;*/ } .layout1 #access-places, .layout1 #access-modulos { background: #000000 url(img/old-browsers/colors/bg_tr_highlight_glossy_th.png) repeat-x; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#5e5e5e), to(black), color-stop(0.04, #4f4f4f), color-stop(0.44, #262626), color-stop(0.5, #1c1c1c), color-stop(0.5, #050505)); background: -webkit-linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); background: -moz-linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); background: -ms-linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); background: -o-linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); background: linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); } #access-home { /*background: -webkit-linear-gradient( top, #60666c, #1e2129 ); background: -moz-linear-gradient( top, #60666c, #1e2129 ); background: -ms-linear-gradient( top, #60666c, #1e2129 ); background: -o-linear-gradient( top, #60666c, #1e2129 ); background: linear-gradient( top, #60666c, #1e2129 );*/ } /* Anthracite */ .black-inputs .switch-button, .black-input > .switch-button, .wizard-steps { color: white; background: #404040 /*url(img/old-browsers/bg_black-inputs_switch-button.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#565656), to(#404040)); background: -webkit-linear-gradient(top, #565656, #404040); background: -moz-linear-gradient(top, #565656, #404040); background: -ms-linear-gradient(top, #565656, #404040); background: -o-linear-gradient(top, #565656, #404040); background: linear-gradient(top, #565656, #404040); border-color: #282e36; } /* White */ /*.calendar-menu > li,*/ li.calendar-menu, .message-menu > li, li.message-menu, .message, .big-message, .table > thead > tr > .header:hover { color: #666666; background: #e4e7eb; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#f7f7fa), to(#e4e7eb)); background: -webkit-linear-gradient(top, #f7f7fa, #e4e7eb); background: -moz-linear-gradient(top, #f7f7fa, #e4e7eb); background: -ms-linear-gradient(top, #f7f7fa, #e4e7eb); background: -o-linear-gradient(top, #f7f7fa, #e4e7eb); background: linear-gradient(top, #f7f7fa, #e4e7eb); border-color: #cccccc; } .message.glossy, .big-message.glossy { background: #e8e8eb /*url(img/old-browsers/bg_message_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fafafc), to(#e8e8eb), color-stop(0.5, #ededf0), color-stop(0.5, #e3e3e5)); background: -webkit-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -moz-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -ms-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -o-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); } .bubble1 { color: white; border: solid 2px white; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; border: solid 2px white; position: absolute; z-index: 88; padding: 0 2px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height: 23px; font-weight: bold; height: 23px; min-width: 20px; text-align: center; -webkit-background-clip: padding-box; -webkit-border-radius: 13px; -moz-border-radius: 13px; border-radius: 13px; font-weight: bold; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 3px rgba(0, 0, 0, 0.75); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 3px rgba(0, 0, 0, 0.75); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 3px rgba(0, 0, 0, 0.75); -webkit-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); -moz-text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); } /* Red */ /*.count,*/ .close, .extra-notifications, .more-notifications { color: white; background: #d52607; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#e24913), to(#d52607)); background: -webkit-linear-gradient(top, #e24913, #d52607); background: -moz-linear-gradient(top, #e24913, #d52607); background: -ms-linear-gradient(top, #e24913, #d52607); background: -o-linear-gradient(top, #e24913, #d52607); background: linear-gradient(top, #e24913, #d52607); border-color: white; } a.count:hover, a.close:hover { color: white; background: #d12206 /*url(img/old-browsers/bg_a_count_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#eb671d), to(#d12206)); background: -webkit-linear-gradient(top, #eb671d, #d12206); background: -moz-linear-gradient(top, #eb671d, #d12206); background: -ms-linear-gradient(top, #eb671d, #d12206); background: -o-linear-gradient(top, #eb671d, #d12206); background: linear-gradient(top, #eb671d, #d12206); border-color: #931a03; } .count.glossy, .close.glossy { background: #d42622 /*url(img/old-browsers/bg_count_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fd8383), to(#d42622), color-stop(0.5, #c30909), color-stop(0.5, #a70606)); background: -webkit-linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); background: -moz-linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); background: -ms-linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); background: -o-linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); background: linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); } a.count.glossy:hover, a.close.glossy:hover { background: #e94237 /*url(img/old-browsers/bg_a_count_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fe9b96), to(#e94237), color-stop(0.5, #df1411), color-stop(0.5, #ce0d0c)); background: -webkit-linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); background: -moz-linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); background: -ms-linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); background: -o-linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); background: linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); } a.count:active, a.count.active, a.count.glossy:active, a.close:active, a.close.active, a.close.glossy:active { background: #e4360a /*url(img/old-browsers/bg_a_count_active.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ce1d06), to(#e4360a)); background: -webkit-linear-gradient(top, #ce1d06, #e4360a); background: -moz-linear-gradient(top, #ce1d06, #e4360a); background: -ms-linear-gradient(top, #ce1d06, #e4360a); background: -o-linear-gradient(top, #ce1d06, #e4360a); background: linear-gradient(top, #ce1d06, #e4360a); } /* Green */ .ribbon-inner, .active > .wizard-step { color: white; background: #608807; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#90bb13), to(#608807)); background: -webkit-linear-gradient(top, #90bb13, #608807); background: -moz-linear-gradient(top, #90bb13, #608807); background: -ms-linear-gradient(top, #90bb13, #608807); background: -o-linear-gradient(top, #90bb13, #608807); background: linear-gradient(top, #90bb13, #608807); border-color: #6d960c; } /* Blue */ .tag { background: #0059a0; color: white; border-color: #004795; } .tag-convenio { background: #905CA5; } .tag-cancelado { background: #FFA188; } .tag-confirmado { background: #86AF19; } .tag-novo { background: #FFAE00; } .tag-inativo { background: #f00; } .tag-ativo { background: #00A500; } .tag-permitido { background: #28BB28; } .tag-red { background: red; } .tag-grey { background: grey; } .tag-orange { background: #FFAE00; } .tag-green { background: #86AF19; } .button-icon, .progress-bar, .slider-bar, .table-header, .table-footer { color: white; background: #00438d /*url(img/old-browsers/bg_button-icon.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#006aac), to(#00438d)); background: -webkit-linear-gradient(top, #006aac, #00438d); background: -moz-linear-gradient(top, #006aac, #00438d); background: -ms-linear-gradient(top, #006aac, #00438d); background: -o-linear-gradient(top, #006aac, #00438d); background: linear-gradient(top, #006aac, #00438d); border-color: #004795; } .touchevents .drop-down > span:hover:not(.disabled), .touchevents .drop-down > a:hover:not(.disabled), .drop-down > .selected:not(.disabled), :hover > .button-icon { color: white; background: #003d86 /*url(img/old-browsers/bg_no-touch_drop-down_span_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#0089c3), to(#003d86)); background: -webkit-linear-gradient(top, #0089c3, #003d86); background: -moz-linear-gradient(top, #0089c3, #003d86); background: -ms-linear-gradient(top, #0089c3, #003d86); background: -o-linear-gradient(top, #0089c3, #003d86); background: linear-gradient(top, #0089c3, #003d86); border-color: #004795; } .button-icon.glossy, .glossy > .button-icon, .progress-bar, .slider-bar { background: #0a5db8 /*url(img/old-browsers/bg_button-icon_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#65b2dd), to(#0a5db8), color-stop(0.5, #045ab2), color-stop(0.5, #004995)); background: -webkit-linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); background: -moz-linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); background: -ms-linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); background: -o-linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); background: linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); } :hover > .button-icon.glossy, .glossy:hover > .button-icon { background: #056fc9 /*url(img/old-browsers/bg_hover_button-icon_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#46bde5), to(#056fc9), color-stop(0.5, #026cc4), color-stop(0.5, #005cac)); background: -webkit-linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); background: -moz-linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); background: -ms-linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); background: -o-linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); background: linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); } .button:active > .button-icon, .active > .button-icon { background: #005fb4 /*url(img/old-browsers/bg_button_active_button-icon.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#003475), to(#005fb4)); background: -webkit-linear-gradient(top, #003475, #005fb4); background: -moz-linear-gradient(top, #003475, #005fb4); background: -ms-linear-gradient(top, #003475, #005fb4); background: -o-linear-gradient(top, #003475, #005fb4); background: linear-gradient(top, #003475, #005fb4); } /********************************************************/ /* 7. Generic gradients - main */ /********************************************************/ .silver-bg, .drop-down, .wrapped, .boxed { background: #eee; /*color: #666666;*/ border-color: #cccccc; } a.silver-bg:hover { color: #666666; background: #e8e9ee; } .silver-gradient, .silver-gradient:visited, .silver-gradient > .select-value, .silver-gradient > .select-arrow { color: #666666; background: #d6dadf /*url(img/old-browsers/bg_silver-gradient.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#efeff4), to(#d6dadf)); background: -webkit-linear-gradient(top, #efeff4, #d6dadf); background: -moz-linear-gradient(top, #efeff4, #d6dadf); background: -ms-linear-gradient(top, #efeff4, #d6dadf); background: -o-linear-gradient(top, #efeff4, #d6dadf); background: linear-gradient(top, #efeff4, #d6dadf); border-color: #cccccc; } a.silver-gradient:hover, button.silver-gradient:hover, :hover > .button-icon.silver-gradient, .silver-gradient > a.select-value:hover, .silver-gradient > .select-arrow:hover { color: #666666; background: #d7dbdf /*url(img/old-browsers/bg_a_silver-gradient_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#d7dbdf)); background: -webkit-linear-gradient(top, #fefefe, #d7dbdf); background: -moz-linear-gradient(top, #fefefe, #d7dbdf); background: -ms-linear-gradient(top, #fefefe, #d7dbdf); background: -o-linear-gradient(top, #fefefe, #d7dbdf); background: linear-gradient(top, #fefefe, #d7dbdf); border-color: #cccccc; } .silver-gradient.glossy, .glossy > .button-icon.silver-gradient, .button-icon.glossy.silver-gradient, .silver-gradient.glossy > .select-value, .silver-gradient.glossy > .select-arrow { background: #dcdce0 /*url(img/old-browsers/bg_silver-gradient_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f7), to(#dcdce0), color-stop(0.5, #dededf), color-stop(0.5, #d1d1d2)); background: -webkit-linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); background: -moz-linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); background: -ms-linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); background: -o-linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); background: linear-gradient(top, #f5f5f7, #dededf 50%, #d1d1d2 50%, #dcdce0); } a.silver-gradient.glossy:hover, button.silver-gradient.glossy:hover, .glossy:hover > .button-icon.silver-gradient, :hover > .button-icon.glossy.silver-gradient, .silver-gradient.glossy > a.select-value:hover, .silver-gradient.glossy > .select-arrow:hover { background: #e8e8eb /*url(img/old-browsers/bg_a_silver-gradient_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fafafc), to(#e8e8eb), color-stop(0.5, #ededf0), color-stop(0.5, #e3e3e5)); background: -webkit-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -moz-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -ms-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -o-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); } a.silver-gradient:active, button.silver-gradient:active, .button.silver-gradient:active, .silver-gradient.active, :active > .button-icon.silver-gradient, .active > .button-icon.silver-gradient { background: #dbdbdb /*url(img/old-browsers/bg_a_silver-gradient_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#bdbdbd), to(#dbdbdb)) !important; background: -webkit-linear-gradient(top, #bdbdbd, #dbdbdb) !important; background: -moz-linear-gradient(top, #bdbdbd, #dbdbdb) !important; background: -ms-linear-gradient(top, #bdbdbd, #dbdbdb) !important; background: -o-linear-gradient(top, #bdbdbd, #dbdbdb) !important; background: linear-gradient(top, #bdbdbd, #dbdbdb) !important; } .black-bg, .black-gradient > .drop-down { background: #101010; color: white; border-color: black; } a.black-bg:hover { color: white; background: #383838; } .black-gradient, .black-gradient:visited, .black-gradient > .select-value, .black-gradient > .select-arrow { color: white; background: #000000 /*url(img/old-browsers/bg_black-gradient.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#333333), to(#000000)); background: -webkit-linear-gradient(top, #333333, #000000); background: -moz-linear-gradient(top, #333333, #000000); background: -ms-linear-gradient(top, #333333, #000000); background: -o-linear-gradient(top, #333333, #000000); background: linear-gradient(top, #333333, #000000); border-color: black; } a.black-gradient:hover, button.black-gradient:hover, :hover > .button-icon.black-gradient, .black-gradient > a.select-value:hover, .black-gradient > .select-arrow:hover { color: white; background: #1b1b1b /*url(img/old-browsers/bg_a_black-gradient_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#474747), to(#1b1b1b)); background: -webkit-linear-gradient(top, #474747, #1b1b1b); background: -moz-linear-gradient(top, #474747, #1b1b1b); background: -ms-linear-gradient(top, #474747, #1b1b1b); background: -o-linear-gradient(top, #474747, #1b1b1b); background: linear-gradient(top, #474747, #1b1b1b); border-color: black; } .black-gradient.glossy, .glossy > .button-icon.black-gradient, .button-icon.glossy.black-gradient, .black-gradient.glossy > .select-value, .black-gradient.glossy > .select-arrow { background: #000000 /*url(img/old-browsers/bg_black-gradient_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#5e5e5e), to(black), color-stop(0.04, #4f4f4f), color-stop(0.44, #262626), color-stop(0.5, #1c1c1c), color-stop(0.5, #050505)); background: -webkit-linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); background: -moz-linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); background: -ms-linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); background: -o-linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); background: linear-gradient(top, #5e5e5e, #4f4f4f 4%, #262626 44%, #1c1c1c 50%, #050505 50%, black); } a.black-gradient.glossy:hover, button.black-gradient.glossy:hover, .glossy:hover > .button-icon.black-gradient, :hover > .button-icon.glossy.black-gradient, .black-gradient.glossy > a.select-value:hover, .black-gradient.glossy > .select-arrow:hover { background: #080808 /*url(img/old-browsers/bg_a_black-gradient_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#6b6b6b), to(#080808), color-stop(0.04, #5c5c5c), color-stop(0.44, #303030), color-stop(0.5, #262626), color-stop(0.5, #0d0d0d)); background: -webkit-linear-gradient(top, #6b6b6b, #5c5c5c 4%, #303030 44%, #262626 50%, #0d0d0d 50%, #080808); background: -moz-linear-gradient(top, #6b6b6b, #5c5c5c 4%, #303030 44%, #262626 50%, #0d0d0d 50%, #080808); background: -ms-linear-gradient(top, #6b6b6b, #5c5c5c 4%, #303030 44%, #262626 50%, #0d0d0d 50%, #080808); background: -o-linear-gradient(top, #6b6b6b, #5c5c5c 4%, #303030 44%, #262626 50%, #0d0d0d 50%, #080808); background: linear-gradient(top, #6b6b6b, #5c5c5c 4%, #303030 44%, #262626 50%, #0d0d0d 50%, #080808); } a.black-gradient:active, button.black-gradient:active, .button.black-gradient:active, .black-gradient.active, :active > .button-icon.black-gradient, .active > .button-icon.black-gradient { background: #262626 /*url(img/old-browsers/bg_a_black-gradient_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(black), to(#262626)) !important; background: -webkit-linear-gradient(top, black, #262626) !important; background: -moz-linear-gradient(top, black, #262626) !important; background: -ms-linear-gradient(top, black, #262626) !important; background: -o-linear-gradient(top, black, #262626) !important; background: linear-gradient(top, black, #262626) !important; } .anthracite-bg, .anthracite-gradient > .drop-down { background: #4c4c4c; color: white; border-color: #282e36; } a.anthracite-bg:hover { color: white; background: #6a6a6a; } .anthracite-gradient, .anthracite-gradient:visited, .anthracite-gradient > .select-value, .anthracite-gradient > .select-arrow, .black-inputs .number-up, .black-input > .number-up, .black-inputs .number-down, .black-input > .number-down { color: white; background: #404040; /*url(img/old-browsers/bg_anthracite-gradient.png) repeat-x*/ -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#565656), to(#404040)); background: -webkit-linear-gradient(top, #565656, #404040); background: -moz-linear-gradient(top, #565656, #404040); background: -ms-linear-gradient(top, #565656, #404040); background: -o-linear-gradient(top, #565656, #404040); background: linear-gradient(top, #565656, #404040); border-color: #282e36; } a.anthracite-gradient:hover, button.anthracite-gradient:hover, :hover > .button-icon.anthracite-gradient, .touchevents .red-gradient > .drop-down > span:hover, .touchevents .red-gradient > .drop-down > a:hover, .red-gradient > .drop-down > .selected, .touchevents .orange-gradient > .drop-down > span:hover, .touchevents .orange-gradient > .drop-down > a:hover, .orange-gradient > .drop-down > .selected, .touchevents .green-gradient > .drop-down > span:hover, .touchevents .green-gradient > .drop-down > a:hover, .green-gradient > .drop-down > .selected, .touchevents .blue-gradient > .drop-down > span:hover, .touchevents .blue-gradient > .drop-down > a:hover, .blue-gradient > .drop-down > .selected, .anthracite-gradient > a.select-value:hover, .anthracite-gradient > .select-arrow:hover, .black-inputs .number-up:hover, .black-input > .number-up:hover, .black-inputs .number-down:hover, .black-input > .number-down:hover { color: white; background: #3a3a3a; /*url(img/old-browsers/bg_a_anthracite-gradient_hover.png) repeat-x*/ -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#6d6d6d), to(#3a3a3a)); background: -webkit-linear-gradient(top, #6d6d6d, #3a3a3a); background: -moz-linear-gradient(top, #6d6d6d, #3a3a3a); background: -ms-linear-gradient(top, #6d6d6d, #3a3a3a); background: -o-linear-gradient(top, #6d6d6d, #3a3a3a); background: linear-gradient(top, #6d6d6d, #3a3a3a); border-color: #282e36; } .anthracite-gradient.glossy, .glossy > .button-icon.anthracite-gradient, .button-icon.glossy.anthracite-gradient, .anthracite-gradient.glossy > .select-value, .anthracite-gradient.glossy > .select-arrow { background: #505050 /*url(img/old-browsers/bg_anthracite-gradient_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#7f7f7f), to(#505050), color-stop(0.5, #444444), color-stop(0.5, #292929)); background: -webkit-linear-gradient(top, #7f7f7f, #444444 50%, #292929 50%, #505050); background: -moz-linear-gradient(top, #7f7f7f, #444444 50%, #292929 50%, #505050); background: -ms-linear-gradient(top, #7f7f7f, #444444 50%, #292929 50%, #505050); background: -o-linear-gradient(top, #7f7f7f, #444444 50%, #292929 50%, #505050); background: linear-gradient(top, #7f7f7f, #444444 50%, #292929 50%, #505050); } a.anthracite-gradient.glossy:hover, button.anthracite-gradient.glossy:hover, .glossy:hover > .button-icon.anthracite-gradient, :hover > .button-icon.glossy.anthracite-gradient, .anthracite-gradient.glossy > a.select-value:hover, .anthracite-gradient.glossy > .select-arrow:hover { background: #656565 /*url(img/old-browsers/bg_a_anthracite-gradient_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#919191), to(#656565), color-stop(0.5, #5a5a5a), color-stop(0.5, #3e3e3e)); background: -webkit-linear-gradient(top, #919191, #5a5a5a 50%, #3e3e3e 50%, #656565); background: -moz-linear-gradient(top, #919191, #5a5a5a 50%, #3e3e3e 50%, #656565); background: -ms-linear-gradient(top, #919191, #5a5a5a 50%, #3e3e3e 50%, #656565); background: -o-linear-gradient(top, #919191, #5a5a5a 50%, #3e3e3e 50%, #656565); background: linear-gradient(top, #919191, #5a5a5a 50%, #3e3e3e 50%, #656565); } a.anthracite-gradient:active, button.anthracite-gradient:active, .button.anthracite-gradient:active, .anthracite-gradient.active, :active > .button-icon.anthracite-gradient, .active > .button-icon.anthracite-gradient, .black-inputs .number-up:active, .black-input > .number-up:active, .black-inputs .number-down:active, .black-input > .number-down:active { background: #474747 /*url(img/old-browsers/bg_a_anthracite-gradient_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#262626), to(#474747)) !important; background: -webkit-linear-gradient(top, #262626, #474747) !important; background: -moz-linear-gradient(top, #262626, #474747) !important; background: -ms-linear-gradient(top, #262626, #474747) !important; background: -o-linear-gradient(top, #262626, #474747) !important; background: linear-gradient(top, #262626, #474747) !important; } .grey-bg, .grey-gradient > .drop-down { background: #a5a5a5; color: white; border-color: #666666; } a.grey-bg:hover { color: white; background: #b4b4b4; } .grey-gradient, .grey-gradient:visited, .grey-gradient > .select-value, .grey-gradient > .select-arrow, .title-menu > li, li.title-menu { color: white; background: #939393 /*url(img/old-browsers/bg_grey-gradient.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#b3b3b3), to(#939393)); background: -webkit-linear-gradient(top, #b3b3b3, #939393); background: -moz-linear-gradient(top, #b3b3b3, #939393); background: -ms-linear-gradient(top, #b3b3b3, #939393); background: -o-linear-gradient(top, #b3b3b3, #939393); background: linear-gradient(top, #b3b3b3, #939393); border-color: #666666; } a.grey-gradient:hover, button.grey-gradient:hover, :hover > .button-icon.grey-gradient, .grey-gradient > a.select-value:hover, .grey-gradient > .select-arrow:hover { color: white; background: #8b8b8b /*url(img/old-browsers/bg_a_grey-gradient_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#d6d6d6), to(#8b8b8b)); background: -webkit-linear-gradient(top, #d6d6d6, #8b8b8b); background: -moz-linear-gradient(top, #d6d6d6, #8b8b8b); background: -ms-linear-gradient(top, #d6d6d6, #8b8b8b); background: -o-linear-gradient(top, #d6d6d6, #8b8b8b); background: linear-gradient(top, #d6d6d6, #8b8b8b); border-color: #666666; } .grey-gradient.glossy, .glossy > .button-icon.grey-gradient, .button-icon.glossy.grey-gradient, .grey-gradient.glossy > .select-value, .grey-gradient.glossy > .select-arrow { background: #9c9c9c /*url(img/old-browsers/bg_grey-gradient_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#cccccc), to(#9c9c9c), color-stop(0.5, #909090), color-stop(0.5, #757575)); background: -webkit-linear-gradient(top, #cccccc, #909090 50%, #757575 50%, #9c9c9c); background: -moz-linear-gradient(top, #cccccc, #909090 50%, #757575 50%, #9c9c9c); background: -ms-linear-gradient(top, #cccccc, #909090 50%, #757575 50%, #9c9c9c); background: -o-linear-gradient(top, #cccccc, #909090 50%, #757575 50%, #9c9c9c); background: linear-gradient(top, #cccccc, #909090 50%, #757575 50%, #9c9c9c); } a.grey-gradient.glossy:hover, button.grey-gradient.glossy:hover, .glossy:hover > .button-icon.grey-gradient, :hover > .button-icon.glossy.grey-gradient, .grey-gradient.glossy > a.select-value:hover, .grey-gradient.glossy > .select-arrow:hover { background: #ababab /*url(img/old-browsers/bg_a_grey-gradient_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#d4d4d4), to(#ababab), color-stop(0.5, #a0a0a0), color-stop(0.5, #888888)); background: -webkit-linear-gradient(top, #d4d4d4, #a0a0a0 50%, #888888 50%, #ababab); background: -moz-linear-gradient(top, #d4d4d4, #a0a0a0 50%, #888888 50%, #ababab); background: -ms-linear-gradient(top, #d4d4d4, #a0a0a0 50%, #888888 50%, #ababab); background: -o-linear-gradient(top, #d4d4d4, #a0a0a0 50%, #888888 50%, #ababab); background: linear-gradient(top, #d4d4d4, #a0a0a0 50%, #888888 50%, #ababab); } a.grey-gradient:active, button.grey-gradient:active, .button.grey-gradient:active, .grey-gradient.active, :active > .button-icon.grey-gradient, .active > .button-icon.grey-gradient, .black-inputs .switch-off, .black-input > .switch-off { background: #b7b7b7 /*url(img/old-browsers/bg_a_grey-gradient_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#7a7a7a), to(#b7b7b7)) !important; background: -webkit-linear-gradient(top, #7a7a7a, #b7b7b7) !important; background: -moz-linear-gradient(top, #7a7a7a, #b7b7b7) !important; background: -ms-linear-gradient(top, #7a7a7a, #b7b7b7) !important; background: -o-linear-gradient(top, #7a7a7a, #b7b7b7) !important; background: linear-gradient(top, #7a7a7a, #b7b7b7) !important; } .white-bg { background: #fff; } .white-gradient > .drop-down { background: #f1f3f4; color: #666666; border-color: #cccccc; } a.white-bg:hover { color: #666666; background: #f3f5f6; } .white-gradient, .white-gradient:visited, .white-gradient > .select-value, .white-gradient > .select-arrow { color: #666666; background: #e4e7eb /*url(img/old-browsers/bg_white-gradient.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#f7f7fa), to(#e4e7eb)); background: -webkit-linear-gradient(top, #f7f7fa, #e4e7eb); background: -moz-linear-gradient(top, #f7f7fa, #e4e7eb); background: -ms-linear-gradient(top, #f7f7fa, #e4e7eb); background: -o-linear-gradient(top, #f7f7fa, #e4e7eb); background: linear-gradient(top, #f7f7fa, #e4e7eb); border-color: #cccccc; } a.white-gradient:hover, button.white-gradient:hover, :hover > .button-icon.white-gradient, .white-gradient > a.select-value:hover, .white-gradient > .select-arrow:hover { color: #666666; background: #edf0f2 /*url(img/old-browsers/bg_a_white-gradient_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#edf0f2)); background: -webkit-linear-gradient(top, #fefefe, #edf0f2); background: -moz-linear-gradient(top, #fefefe, #edf0f2); background: -ms-linear-gradient(top, #fefefe, #edf0f2); background: -o-linear-gradient(top, #fefefe, #edf0f2); background: linear-gradient(top, #fefefe, #edf0f2); border-color: #cccccc; } .white-gradient.glossy, .glossy > .button-icon.white-gradient, .button-icon.glossy.white-gradient, .white-gradient.glossy > .select-value, .white-gradient.glossy > .select-arrow { background: #e8e8eb /*url(img/old-browsers/bg_white-gradient_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fafafc), to(#e8e8eb), color-stop(0.5, #ededf0), color-stop(0.5, #e3e3e5)); background: -webkit-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -moz-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -ms-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: -o-linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); background: linear-gradient(top, #fafafc, #ededf0 50%, #e3e3e5 50%, #e8e8eb); } a.white-gradient.glossy:hover, button.white-gradient.glossy:hover, .glossy:hover > .button-icon.white-gradient, :hover > .button-icon.glossy.white-gradient, .white-gradient.glossy > a.select-value:hover, .white-gradient.glossy > .select-arrow:hover { background: #f5f5f7 /*url(img/old-browsers/bg_a_white-gradient_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fefeff), to(#f5f5f7), color-stop(0.5, #f5f5f7), color-stop(0.5, #efeff1)); background: -webkit-linear-gradient(top, #fefeff, #f5f5f7 50%, #efeff1 50%, #f5f5f7); background: -moz-linear-gradient(top, #fefeff, #f5f5f7 50%, #efeff1 50%, #f5f5f7); background: -ms-linear-gradient(top, #fefeff, #f5f5f7 50%, #efeff1 50%, #f5f5f7); background: -o-linear-gradient(top, #fefeff, #f5f5f7 50%, #efeff1 50%, #f5f5f7); background: linear-gradient(top, #fefeff, #f5f5f7 50%, #efeff1 50%, #f5f5f7); } a.white-gradient:active, button.white-gradient:active, .button.white-gradient:active, .white-gradient.active, :active > .button-icon.white-gradient, .active > .button-icon.white-gradient, .switch-off { background: #f0f0f0 /*url(img/old-browsers/bg_a_white-gradient_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#e0e0e0), to(#f0f0f0)) !important; background: -webkit-linear-gradient(top, #e0e0e0, #f0f0f0) !important; background: -moz-linear-gradient(top, #e0e0e0, #f0f0f0) !important; background: -ms-linear-gradient(top, #e0e0e0, #f0f0f0) !important; background: -o-linear-gradient(top, #e0e0e0, #f0f0f0) !important; background: linear-gradient(top, #e0e0e0, #f0f0f0) !important; border-color: #cccccc; } .magenta-bg { background: #842A95; } .red-bg, .red-gradient > .drop-down { background: #dd380d; color: white; border-color: #931a03; } a.red-bg:hover { color: white; background: #e35a36; } .red-gradient, .red-gradient:visited, .red-gradient > .select-value, .red-gradient > .select-arrow { color: white; background: #d52607 /*url(img/old-browsers/bg_red-gradient.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#e24913), to(#d52607)); background: -webkit-linear-gradient(top, #e24913, #d52607); background: -moz-linear-gradient(top, #e24913, #d52607); background: -ms-linear-gradient(top, #e24913, #d52607); background: -o-linear-gradient(top, #e24913, #d52607); background: linear-gradient(top, #e24913, #d52607); border-color: #931a03; } a.red-gradient:hover, button.red-gradient:hover, :hover > .button-icon.red-gradient, .red-gradient > a.select-value:hover, .red-gradient > .select-arrow:hover { color: white; background: #d12206 /*url(img/old-browsers/bg_a_red-gradient_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#eb671d), to(#d12206)); background: -webkit-linear-gradient(top, #eb671d, #d12206); background: -moz-linear-gradient(top, #eb671d, #d12206); background: -ms-linear-gradient(top, #eb671d, #d12206); background: -o-linear-gradient(top, #eb671d, #d12206); background: linear-gradient(top, #eb671d, #d12206); border-color: #931a03; } .red-gradient.glossy, .glossy > .button-icon.red-gradient, .button-icon.glossy.red-gradient, .red-gradient.glossy > .select-value, .red-gradient.glossy > .select-arrow { background: #d42622 /*url(img/old-browsers/bg_red-gradient_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fd8383), to(#d42622), color-stop(0.5, #c30909), color-stop(0.5, #a70606)); background: -webkit-linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); background: -moz-linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); background: -ms-linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); background: -o-linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); background: linear-gradient(top, #fd8383, #c30909 50%, #a70606 50%, #d42622); } a.red-gradient.glossy:hover, button.red-gradient.glossy:hover, .glossy:hover > .button-icon.red-gradient, :hover > .button-icon.glossy.red-gradient, .red-gradient.glossy > a.select-value:hover, .red-gradient.glossy > .select-arrow:hover { background: #e94237 /*url(img/old-browsers/bg_a_red-gradient_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fe9b96), to(#e94237), color-stop(0.5, #df1411), color-stop(0.5, #ce0d0c)); background: -webkit-linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); background: -moz-linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); background: -ms-linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); background: -o-linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); background: linear-gradient(top, #fe9b96, #df1411 50%, #ce0d0c 50%, #e94237); } a.red-gradient:active, button.red-gradient:active, .button.red-gradient:active, .red-gradient.active, :active > .button-icon.red-gradient, .active > .button-icon.red-gradient { background: #e4360a /*url(img/old-browsers/bg_a_red-gradient_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ce1d06), to(#e4360a)) !important; background: -webkit-linear-gradient(top, #ce1d06, #e4360a) !important; background: -moz-linear-gradient(top, #ce1d06, #e4360a) !important; background: -ms-linear-gradient(top, #ce1d06, #e4360a) !important; background: -o-linear-gradient(top, #ce1d06, #e4360a) !important; background: linear-gradient(top, #ce1d06, #e4360a) !important; } .orange-bg, .orange-gradient > .drop-down { background: #ce7502; color: white; border-color: #a84f00; } a.orange-bg:hover { color: white; background: #ffbb2b; } .orange-gradient, .orange-gradient:visited, .orange-gradient > .select-value, .orange-gradient > .select-arrow { color: white; background: #ff9e00 /*url(img/old-browsers/bg_orange-gradient.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ce6202), to(#ca5f00)); background: -webkit-linear-gradient(top, #ce6202, #ca5f00); background: -moz-linear-gradient(top, #ce6202, #ca5f00); background: -ms-linear-gradient(top, #ca5f00); background: -o-linear-gradient(top, #ce6202, #ca5f00); background: linear-gradient(top, #ce6202, #ca5f00); border-color: #b58726; } a.orange-gradient:hover, button.orange-gradient:hover, :hover > .button-icon.orange-gradient, .orange-gradient > a.select-value:hover, .orange-gradient > .select-arrow:hover { color: white; background: #ff9700 /*url(img/old-browsers/bg_a_orange-gradient_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ffcd00), to(#ff9700)); background: -webkit-linear-gradient(top, #ffcd00, #ff9700); background: -moz-linear-gradient(top, #ffcd00, #ff9700); background: -ms-linear-gradient(top, #ffcd00, #ff9700); background: -o-linear-gradient(top, #ffcd00, #ff9700); background: linear-gradient(top, #ffcd00, #ff9700); border-color: #cc9707; } .orange-gradient.glossy, .glossy > .button-icon.orange-gradient, .button-icon.glossy.orange-gradient, .orange-gradient.glossy > .select-value, .orange-gradient.glossy > .select-arrow { background: #d38800 /*url(img/old-browsers/bg_orange-gradient_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ffd844), to(#d38800), color-stop(0.5, #ff9f01), color-stop(0.5, #da8d00), color-stop(0.8, #e59400)); background: -webkit-linear-gradient(top, #ffd844, #ff9f01 50%, #da8d00 50%, #e59400 80%, #d38800); background: -moz-linear-gradient(top, #ffd844, #ff9f01 50%, #da8d00 50%, #e59400 80%, #d38800); background: -ms-linear-gradient(top, #ffd844, #ff9f01 50%, #da8d00 50%, #e59400 80%, #d38800); background: -o-linear-gradient(top, #ffd844, #ff9f01 50%, #da8d00 50%, #e59400 80%, #d38800); background: linear-gradient(top, #ffd844, #ff9f01 50%, #da8d00 50%, #e59400 80%, #d38800); } a.orange-gradient.glossy:hover, button.orange-gradient.glossy:hover, .glossy:hover > .button-icon.orange-gradient, :hover > .button-icon.glossy.orange-gradient, .orange-gradient.glossy > a.select-value:hover, .orange-gradient.glossy > .select-arrow:hover { background: #e8a400 /*url(img/old-browsers/bg_a_orange-gradient_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ffe326), to(#e8a400), color-stop(0.5, #ffb700), color-stop(0.5, #eca900), color-stop(0.8, #f1ae00)); background: -webkit-linear-gradient(top, #ffe326, #ffb700 50%, #eca900 50%, #f1ae00 80%, #e8a400); background: -moz-linear-gradient(top, #ffe326, #ffb700 50%, #eca900 50%, #f1ae00 80%, #e8a400); background: -ms-linear-gradient(top, #ffe326, #ffb700 50%, #eca900 50%, #f1ae00 80%, #e8a400); background: -o-linear-gradient(top, #ffe326, #ffb700 50%, #eca900 50%, #f1ae00 80%, #e8a400); background: linear-gradient(top, #ffe326, #ffb700 50%, #eca900 50%, #f1ae00 80%, #e8a400); } a.orange-gradient:active, button.orange-gradient:active, .button.orange-gradient:active, .orange-gradient.active, :active > .button-icon.orange-gradient, .active > .button-icon.orange-gradient { background: #ffbf00 /*url(img/old-browsers/bg_a_orange-gradient_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ff8a00), to(#ffbf00)) !important; background: -webkit-linear-gradient(top, #ff8a00, #ffbf00) !important; background: -moz-linear-gradient(top, #ff8a00, #ffbf00) !important; background: -ms-linear-gradient(top, #ff8a00, #ffbf00) !important; background: -o-linear-gradient(top, #ff8a00, #ffbf00) !important; background: linear-gradient(top, #ff8a00, #ffbf00) !important; } .green-bg, .green-gradient > .drop-down { background: #28a745; color: white; border-color: #6d960c; } a.green-bg:hover { color: white; background: #aad049; } .green-gradient, .green-gradient:visited, .green-gradient > .select-value, .green-gradient > .select-arrow { color: white; background: #608807 /*url(img/old-browsers/bg_green-gradient.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#90bb13), to(#608807)); background: -webkit-linear-gradient(top, #90bb13, #608807); background: -moz-linear-gradient(top, #90bb13, #608807); background: -ms-linear-gradient(top, #90bb13, #608807); background: -o-linear-gradient(top, #90bb13, #608807); background: linear-gradient(top, #90bb13, #608807); border-color: #6d960c; } a.green-gradient:hover, button.green-gradient:hover, :hover > .button-icon.green-gradient, .green-gradient > a.select-value:hover, .green-gradient > .select-arrow:hover { color: white; background: #80b514 /*url(img/old-browsers/bg_a_green-gradient_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#bfdd4d), to(#80b514)); background: -webkit-linear-gradient(top, #bfdd4d, #80b514); background: -moz-linear-gradient(top, #bfdd4d, #80b514); background: -ms-linear-gradient(top, #bfdd4d, #80b514); background: -o-linear-gradient(top, #bfdd4d, #80b514); background: linear-gradient(top, #bfdd4d, #80b514); border-color: #6d960c; } .green-gradient.glossy, .glossy > .button-icon.green-gradient, .button-icon.glossy.green-gradient, .green-gradient.glossy > .select-value, .green-gradient.glossy > .select-arrow { background: #5eb80a /*url(img/old-browsers/bg_green-gradient_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#b1dc64), to(#5eb80a), color-stop(0.5, #58b104), color-stop(0.5, #499400)); background: -webkit-linear-gradient(top, #b1dc64, #58b104 50%, #499400 50%, #5eb80a); background: -moz-linear-gradient(top, #b1dc64, #58b104 50%, #499400 50%, #5eb80a); background: -ms-linear-gradient(top, #b1dc64, #58b104 50%, #499400 50%, #5eb80a); background: -o-linear-gradient(top, #b1dc64, #58b104 50%, #499400 50%, #5eb80a); background: linear-gradient(top, #b1dc64, #58b104 50%, #499400 50%, #5eb80a); } a.green-gradient.glossy:hover, button.green-gradient.glossy:hover, .glossy:hover > .button-icon.green-gradient, :hover > .button-icon.glossy.green-gradient, .green-gradient.glossy > a.select-value:hover, .green-gradient.glossy > .select-arrow:hover { background: #6ac905 /*url(img/old-browsers/bg_a_green-gradient_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#b8e545), to(#6ac905), color-stop(0.5, #65c302), color-stop(0.5, #56ab00)); background: -webkit-linear-gradient(top, #b8e545, #65c302 50%, #56ab00 50%, #6ac905); background: -moz-linear-gradient(top, #b8e545, #65c302 50%, #56ab00 50%, #6ac905); background: -ms-linear-gradient(top, #b8e545, #65c302 50%, #56ab00 50%, #6ac905); background: -o-linear-gradient(top, #b8e545, #65c302 50%, #56ab00 50%, #6ac905); background: linear-gradient(top, #b8e545, #65c302 50%, #56ab00 50%, #6ac905); } a.green-gradient:active, button.green-gradient:active, .button.green-gradient:active, .green-gradient.active, :active > .button-icon.green-gradient, .active > .button-icon.green-gradient, .switch-on { background: #b0d222 /*url(img/old-browsers/bg_a_green-gradient_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#6dad12), to(#b0d222)) !important; background: -webkit-linear-gradient(top, #6dad12, #b0d222) !important; background: -moz-linear-gradient(top, #6dad12, #b0d222) !important; background: -ms-linear-gradient(top, #6dad12, #b0d222) !important; background: -o-linear-gradient(top, #6dad12, #b0d222) !important; background: linear-gradient(top, #6dad12, #b0d222) !important; border-color: #6d960c; } .blue-bg, .blue-gradient > .drop-down { background: #0059a0; color: white; border-color: #004795; } a.blue-bg:hover { background: #2b75b0; color: white; } .blue-gradient, .blue-gradient:visited, .blue-gradient > .select-value, .blue-gradient > .select-arrow { color: white; background: #00438d /*url(img/old-browsers/bg_blue-gradient.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#006aac), to(#00438d)); background: -webkit-linear-gradient(top, #006aac, #00438d); background: -moz-linear-gradient(top, #006aac, #00438d); background: -ms-linear-gradient(top, #006aac, #00438d); background: -o-linear-gradient(top, #006aac, #00438d); background: linear-gradient(top, #006aac, #00438d); border-color: #004795; } a.blue-gradient:hover, button.blue-gradient:hover, .blue-gradient > a.select-value:hover, .blue-gradient > .select-arrow:hover { color: white; background: #003d86 /*url(img/old-browsers/bg_a_blue-gradient_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#0089c3), to(#003d86)); background: -webkit-linear-gradient(top, #0089c3, #003d86); background: -moz-linear-gradient(top, #0089c3, #003d86); background: -ms-linear-gradient(top, #0089c3, #003d86); background: -o-linear-gradient(top, #0089c3, #003d86); background: linear-gradient(top, #0089c3, #003d86); border-color: #004795; } .blue-gradient.glossy, .blue-gradient.glossy > .select-value, .blue-gradient.glossy > .select-arrow { background: #0a5db8 /*url(img/old-browsers/bg_blue-gradient_glossy.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#65b2dd), to(#0a5db8), color-stop(0.5, #045ab2), color-stop(0.5, #004995)); background: -webkit-linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); background: -moz-linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); background: -ms-linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); background: -o-linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); background: linear-gradient(top, #65b2dd, #045ab2 50%, #004995 50%, #0a5db8); } a.blue-gradient.glossy:hover, button.blue-gradient.glossy:hover, .blue-gradient.glossy > a.select-value:hover, .blue-gradient.glossy > .select-arrow:hover { background: #056fc9 /*url(img/old-browsers/bg_a_blue-gradient_glossy_hover.png) repeat-x*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#46bde5), to(#056fc9), color-stop(0.5, #026cc4), color-stop(0.5, #005cac)); background: -webkit-linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); background: -moz-linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); background: -ms-linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); background: -o-linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); background: linear-gradient(top, #46bde5, #026cc4 50%, #005cac 50%, #056fc9); } a.blue-gradient:active, button.blue-gradient:active, .button.blue-gradient:active, .blue-gradient.active { background: #005fb4 /*url(img/old-browsers/bg_a_blue-gradient_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#003475), to(#005fb4)) !important; background: -webkit-linear-gradient(top, #003475, #005fb4) !important; background: -moz-linear-gradient(top, #003475, #005fb4) !important; background: -ms-linear-gradient(top, #003475, #005fb4) !important; background: -o-linear-gradient(top, #003475, #005fb4) !important; background: linear-gradient(top, #003475, #005fb4) !important; } /********************************************************/ /* 8. Generic gradients - active */ /********************************************************/ .silver-active:active, .silver-active.active, .silver-active > .switch-on { background: #dbdbdb /*url(img/old-browsers/bg_silver-active_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#bdbdbd), to(#dbdbdb)) !important; background: -webkit-linear-gradient(top, #bdbdbd, #dbdbdb) !important; background: -moz-linear-gradient(top, #bdbdbd, #dbdbdb) !important; background: -ms-linear-gradient(top, #bdbdbd, #dbdbdb) !important; background: -o-linear-gradient(top, #bdbdbd, #dbdbdb) !important; background: linear-gradient(top, #bdbdbd, #dbdbdb) !important; color: #666666 !important; border-color: #cccccc; } .black-active:active, .black-active.active, .black-active > .switch-on { background: #262626 /*url(img/old-browsers/bg_black-active_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(black), to(#262626)) !important; background: -webkit-linear-gradient(top, black, #262626) !important; background: -moz-linear-gradient(top, black, #262626) !important; background: -ms-linear-gradient(top, black, #262626) !important; background: -o-linear-gradient(top, black, #262626) !important; background: linear-gradient(top, black, #262626) !important; color: white !important; border-color: black; } .anthracite-active:active, .anthracite-active.active, .anthracite-active > .switch-on { background: #474747 /*url(img/old-browsers/bg_anthracite-active_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#262626), to(#474747)) !important; background: -webkit-linear-gradient(top, #262626, #474747) !important; background: -moz-linear-gradient(top, #262626, #474747) !important; background: -ms-linear-gradient(top, #262626, #474747) !important; background: -o-linear-gradient(top, #262626, #474747) !important; background: linear-gradient(top, #262626, #474747) !important; color: white !important; border-color: #282e36; } .grey-active:active, .grey-active.active, .grey-active > .switch-on { background: #b7b7b7 /*url(img/old-browsers/bg_grey-active_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#7a7a7a), to(#b7b7b7)) !important; background: -webkit-linear-gradient(top, #7a7a7a, #b7b7b7) !important; background: -moz-linear-gradient(top, #7a7a7a, #b7b7b7) !important; background: -ms-linear-gradient(top, #7a7a7a, #b7b7b7) !important; background: -o-linear-gradient(top, #7a7a7a, #b7b7b7) !important; background: linear-gradient(top, #7a7a7a, #b7b7b7) !important; color: white !important; border-color: #666666; } .white-active:active, .white-active.active, .white-active > .switch-on { background: #f0f0f0 /*url(img/old-browsers/bg_white-active_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#e0e0e0), to(#f0f0f0)) !important; background: -webkit-linear-gradient(top, #e0e0e0, #f0f0f0) !important; background: -moz-linear-gradient(top, #e0e0e0, #f0f0f0) !important; background: -ms-linear-gradient(top, #e0e0e0, #f0f0f0) !important; background: -o-linear-gradient(top, #e0e0e0, #f0f0f0) !important; background: linear-gradient(top, #e0e0e0, #f0f0f0) !important; color: #666666 !important; border-color: #cccccc; } .red-active:active, .red-active.active, .red-active > .switch-on { background: #e4360a /*url(img/old-browsers/bg_red-active_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ce1d06), to(#e4360a)) !important; background: -webkit-linear-gradient(top, #ce1d06, #e4360a) !important; background: -moz-linear-gradient(top, #ce1d06, #e4360a) !important; background: -ms-linear-gradient(top, #ce1d06, #e4360a) !important; background: -o-linear-gradient(top, #ce1d06, #e4360a) !important; background: linear-gradient(top, #ce1d06, #e4360a) !important; color: white !important; border-color: #931a03; } .orange-active:active, .orange-active.active, .orange-active > .switch-on { background: #ffbf00 /*url(img/old-browsers/bg_orange-active_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ff8a00), to(#ffbf00)) !important; background: -webkit-linear-gradient(top, #ff8a00, #ffbf00) !important; background: -moz-linear-gradient(top, #ff8a00, #ffbf00) !important; background: -ms-linear-gradient(top, #ff8a00, #ffbf00) !important; background: -o-linear-gradient(top, #ff8a00, #ffbf00) !important; background: linear-gradient(top, #ff8a00, #ffbf00) !important; color: white !important; border-color: #cc9707; } .green-active:active, .green-active.active, .green-active > .switch-on { background: #b0d222 /*url(img/old-browsers/bg_green-active_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#6dad12), to(#b0d222)) !important; background: -webkit-linear-gradient(top, #6dad12, #b0d222) !important; background: -moz-linear-gradient(top, #6dad12, #b0d222) !important; background: -ms-linear-gradient(top, #6dad12, #b0d222) !important; background: -o-linear-gradient(top, #6dad12, #b0d222) !important; background: linear-gradient(top, #6dad12, #b0d222) !important; color: white !important; border-color: #6d960c; } .blue-active:active, .blue-active.active, .blue-active > .switch-on { background: #005fb4 /*url(img/old-browsers/bg_blue-active_active.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#003475), to(#005fb4)) !important; background: -webkit-linear-gradient(top, #003475, #005fb4) !important; background: -moz-linear-gradient(top, #003475, #005fb4) !important; background: -ms-linear-gradient(top, #003475, #005fb4) !important; background: -o-linear-gradient(top, #003475, #005fb4) !important; background: linear-gradient(top, #003475, #005fb4) !important; color: white !important; border-color: #004795; } /********************************************************/ /* 9. Generic gradients - disabled */ /********************************************************/ /* Silver */ .button:disabled, .button.disabled, .disabled .button, .disabled .select-value, .disabled .select-arrow, .disabled .switch-button, .disabled .switch-off { color: #666666 !important; border-color: #d0d0d0 !important; background: #f8f8f8 /*url(img/old-browsers/bg_button_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#f8f8f8)) !important; background: -webkit-linear-gradient(top, #fafafa, #f8f8f8) !important; background: -moz-linear-gradient(top, #fafafa, #f8f8f8) !important; background: -ms-linear-gradient(top, #fafafa, #f8f8f8) !important; background: -o-linear-gradient(top, #fafafa, #f8f8f8) !important; background: linear-gradient(top, #fafafa, #f8f8f8) !important; } /* Green */ .disabled .switch-on { color: white !important; border-color: #b2b9ab !important; background: #b3d36b /*url(img/old-browsers/bg_disabled_switch-on.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#c7e17e), to(#b3d36b)) !important; background: -webkit-linear-gradient(top, #c7e17e, #b3d36b) !important; background: -moz-linear-gradient(top, #c7e17e, #b3d36b) !important; background: -ms-linear-gradient(top, #c7e17e, #b3d36b) !important; background: -o-linear-gradient(top, #c7e17e, #b3d36b) !important; background: linear-gradient(top, #c7e17e, #b3d36b) !important; } /* Blue */ :disabled > .button-icon, .disabled .button-icon { color: white !important; border-color: #858c94 !important; background: #84a4c8 /*url(img/old-browsers/bg_disabled_button-icon.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#84b7d7), to(#84a4c8)) !important; background: -webkit-linear-gradient(top, #84b7d7, #84a4c8) !important; background: -moz-linear-gradient(top, #84b7d7, #84a4c8) !important; background: -ms-linear-gradient(top, #84b7d7, #84a4c8) !important; background: -o-linear-gradient(top, #84b7d7, #84a4c8) !important; background: linear-gradient(top, #84b7d7, #84a4c8) !important; } .silver-gradient:disabled, .silver-gradient.disabled, .disabled .button.silver-gradient, .silver-gradient.disabled > .select-value, .silver-gradient.disabled > .select-arrow, .disabled .silver-gradient > .select-value, .disabled .silver-gradient > .select-arrow { color: #666666 !important; border-color: #d0d0d0 !important; background: #f8f8f8 /*url(img/old-browsers/bg_silver-gradient_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#f8f8f8)) !important; background: -webkit-linear-gradient(top, #fafafa, #f8f8f8) !important; background: -moz-linear-gradient(top, #fafafa, #f8f8f8) !important; background: -ms-linear-gradient(top, #fafafa, #f8f8f8) !important; background: -o-linear-gradient(top, #fafafa, #f8f8f8) !important; background: linear-gradient(top, #fafafa, #f8f8f8) !important; } .black-gradient:disabled, .black-gradient.disabled, .disabled .black-gradient, .black-gradient.disabled > .select-value, .black-gradient.disabled > .select-arrow, .disabled .black-gradient > .select-value, .disabled .black-gradient > .select-arrow { color: white !important; border-color: #595959 !important; background: #636363 /*url(img/old-browsers/bg_black-gradient_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#636363)) !important; background: -webkit-linear-gradient(top, #757575, #636363) !important; background: -moz-linear-gradient(top, #757575, #636363) !important; background: -ms-linear-gradient(top, #757575, #636363) !important; background: -o-linear-gradient(top, #757575, #636363) !important; background: linear-gradient(top, #757575, #636363) !important; } .button.anthracite-gradient:disabled, .button.anthracite-gradient.disabled, .disabled .button.anthracite-gradient, .button.glossy.anthracite-gradient:disabled, .button.glossy.anthracite-gradient.disabled, .disabled .button.glossy.anthracite-gradient, .anthracite-gradient.disabled > .select-value, .anthracite-gradient.disabled > .select-arrow, .disabled .anthracite-gradient > .select-value, .disabled .anthracite-gradient > .select-arrow, .black-inputs .disabled .switch-off, .black-inputs.disabled .switch-off, .disabled .black-inputs .switch-off, .black-input.disabled > .switch-off, .disabled .black-input > .switch-off, .black-inputs .disabled .switch-button, .black-inputs.disabled .switch-button, .disabled .black-inputs .switch-button, .black-input.disabled > .switch-button, .disabled .black-input > .switch-button, .black-inputs .checkbox.disabled, .black-inputs .disabled .checkbox, .black-inputs.disabled .checkbox, .disabled .black-inputs .checkbox, .black-input.checkbox, .black-inputs .radio.disabled, .black-inputs .disabled .radio, .black-inputs.disabled .radio, .disabled .black-inputs .radio, .black-input.radio { color: white !important; border-color: #777777 !important; background: #848484 /*url(img/old-browsers/bg_button_anthracite-gradient_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#9c9c9c), to(#848484)) !important; background: -webkit-linear-gradient(top, #9c9c9c, #848484) !important; background: -moz-linear-gradient(top, #9c9c9c, #848484) !important; background: -ms-linear-gradient(top, #9c9c9c, #848484) !important; background: -o-linear-gradient(top, #9c9c9c, #848484) !important; background: linear-gradient(top, #9c9c9c, #848484) !important; } .button.grey-gradient:disabled, .button.grey-gradient.disabled, .disabled .button.grey-gradient, .button.glossy.grey-gradient:disabled, .button.glossy.grey-gradient.disabled, .disabled .button.glossy.grey-gradient, .grey-gradient.disabled > .select-value, .grey-gradient.disabled > .select-arrow, .disabled .grey-gradient > .select-value, .disabled .grey-gradient > .select-arrow, .checkbox.disabled, .disabled .checkbox, .radio.disabled, .disabled .radio { color: white !important; border-color: #9c9c9c !important; background: #b9b9b9 /*url(img/old-browsers/bg_button_grey-gradient_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#cdcdcd), to(#b9b9b9)) !important; background: -webkit-linear-gradient(top, #cdcdcd, #b9b9b9) !important; background: -moz-linear-gradient(top, #cdcdcd, #b9b9b9) !important; background: -ms-linear-gradient(top, #cdcdcd, #b9b9b9) !important; background: -o-linear-gradient(top, #cdcdcd, #b9b9b9) !important; background: linear-gradient(top, #cdcdcd, #b9b9b9) !important; } .button.white-gradient:disabled, .button.white-gradient.disabled, .disabled .button.white-gradient, .button.glossy.white-gradient:disabled, .button.glossy.white-gradient.disabled, .disabled .button.glossy.white-gradient, .white-gradient.disabled > .select-value, .white-gradient.disabled > .select-arrow, .disabled .white-gradient > .select-value, .disabled .white-gradient > .select-arrow { color: #666666 !important; border-color: #e0e0e0 !important; background: #fafafa /*url(img/old-browsers/bg_button_white-gradient_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#fafafa)) !important; background: -webkit-linear-gradient(top, #ffffff, #fafafa) !important; background: -moz-linear-gradient(top, #ffffff, #fafafa) !important; background: -ms-linear-gradient(top, #ffffff, #fafafa) !important; background: -o-linear-gradient(top, #ffffff, #fafafa) !important; background: linear-gradient(top, #ffffff, #fafafa) !important; } .button.red-gradient:disabled, .button.red-gradient.disabled, .disabled .button.red-gradient, .button.glossy.red-gradient:disabled, .button.glossy.red-gradient.disabled, .disabled .button.glossy.red-gradient, .red-gradient.disabled > .select-value, .red-gradient.disabled > .select-arrow, .disabled .red-gradient > .select-value, .disabled .red-gradient > .select-arrow { color: white !important; border-color: #a99e9c !important; background: #e98b7a /*url(img/old-browsers/bg_button_red-gradient_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#f09e81), to(#e98b7a)) !important; background: -webkit-linear-gradient(top, #f09e81, #e98b7a) !important; background: -moz-linear-gradient(top, #f09e81, #e98b7a) !important; background: -ms-linear-gradient(top, #f09e81, #e98b7a) !important; background: -o-linear-gradient(top, #f09e81, #e98b7a) !important; background: linear-gradient(top, #f09e81, #e98b7a) !important; } .button.orange-gradient:disabled, .button.orange-gradient.disabled, .disabled .button.orange-gradient, .button.glossy.orange-gradient:disabled, .button.glossy.orange-gradient.disabled, .disabled .button.glossy.orange-gradient, .orange-gradient.disabled > .select-value, .orange-gradient.disabled > .select-arrow, .disabled .orange-gradient > .select-value, .disabled .orange-gradient > .select-arrow { color: white !important; border-color: #d0ccc3 !important; background: #ffc15d /*url(img/old-browsers/bg_button_orange-gradient_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ffd25d), to(#ffc15d)) !important; background: -webkit-linear-gradient(top, #ffd25d, #ffc15d) !important; background: -moz-linear-gradient(top, #ffd25d, #ffc15d) !important; background: -ms-linear-gradient(top, #ffd25d, #ffc15d) !important; background: -o-linear-gradient(top, #ffd25d, #ffc15d) !important; background: linear-gradient(top, #ffd25d, #ffc15d) !important; } .button.green-gradient:disabled, .button.green-gradient.disabled, .disabled .button.green-gradient, .button.glossy.green-gradient:disabled, .button.glossy.green-gradient.disabled, .disabled .button.glossy.green-gradient, .green-gradient.disabled > .select-value, .green-gradient.disabled > .select-arrow, .disabled .green-gradient > .select-value, .disabled .green-gradient > .select-arrow { color: white !important; border-color: #b2b9ab !important; background: #b3d36b /*url(img/old-browsers/bg_button_green-gradient_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#c7e17e), to(#b3d36b)) !important; background: -webkit-linear-gradient(top, #c7e17e, #b3d36b) !important; background: -moz-linear-gradient(top, #c7e17e, #b3d36b) !important; background: -ms-linear-gradient(top, #c7e17e, #b3d36b) !important; background: -o-linear-gradient(top, #c7e17e, #b3d36b) !important; background: linear-gradient(top, #c7e17e, #b3d36b) !important; } .button.blue-gradient:disabled, .button.blue-gradient.disabled, .disabled .button.blue-gradient, .button.glossy.blue-gradient:disabled, .button.glossy.blue-gradient.disabled, .disabled .button.glossy.blue-gradient, .blue-gradient.disabled > .select-value, .blue-gradient.disabled > .select-arrow, .disabled .blue-gradient > .select-value, .disabled .blue-gradient > .select-arrow { color: white !important; border-color: #858c94 !important; background: #84a4c8 /*url(img/old-browsers/bg_button_blue-gradient_disabled.png) repeat-x !important*/; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size: 100% 100%; background-size: 100% 100%; background: -webkit-gradient(linear, left top, left bottom, from(#84b7d7), to(#84a4c8)) !important; background: -webkit-linear-gradient(top, #84b7d7, #84a4c8) !important; background: -moz-linear-gradient(top, #84b7d7, #84a4c8) !important; background: -ms-linear-gradient(top, #84b7d7, #84a4c8) !important; background: -o-linear-gradient(top, #84b7d7, #84a4c8) !important; background: linear-gradient(top, #84b7d7, #84a4c8) !important; } .acqua-gradient{ height:auto; padding: 40px 0; color:#fff; font-size:20px; text-align:center; border-radius:4px; border:1px solid #980021; box-shadow: inset 0 2px 3px 0 rgba(255,255,255,.3), inset 0 -3px 6px 0 rgba(0,0,0,.2), 0 3px 2px 0 rgba(0,0,0,.2); background: #e4e7eb /*url(img/old-browsers/bg_white-gradient.png) repeat-x*/; background: -webkit-gradient(linear, left top, left bottom, from(#f7f7fa), to(#e4e7eb)); background: -webkit-linear-gradient(top, #f7f7fa, #e4e7eb); background: -moz-linear-gradient(top, #f7f7fa, #e4e7eb); background: -ms-linear-gradient(top, #f7f7fa, #e4e7eb); background: -o-linear-gradient(top, #f7f7fa, #e4e7eb); background: linear-gradient(top, #f7f7fa, #e4e7eb); } /** * Form & inputs styles */ /* Disable outline */ input:focus, .input:focus { outline: 0; } /* IE7 */ label { zoom: 1; } /* Standard text input */ .input, .inputs { display: inline-block; padding: 0 9px; line-height: 30px; border: 0; vertical-align: baseline; -webkit-background-clip: padding-box; /* text-align: left; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;*/ -webkit-transition: -webkit-box-shadow 400ms; -moz-transition: -moz-box-shadow 400ms; -ms-transition: box-shadow 400ms; -o-transition: box-shadow 400ms; transition: box-shadow 400ms; -webkit-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 0), inset 0 0.5px 2.5px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 rgba(51, 153, 255, 0); -moz-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 0), inset 0 0.5px 2.5px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 rgba(51, 153, 255, 0); box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 0), inset 0 0.5px 2.5px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 rgba(51, 153, 255, 0); } .ie7 .input { display: inline; zoom: 1; vertical-align: middle; } .no-boxshadow .input { line-height: 28px; min-height: 28px; border-width: 1px; border-style: solid; } .no-boxshadow .inputs { border-width: 1px; border-style: solid; } input.input, textarea.input { padding-top: 7px; padding-bottom: 7px; line-height: 16px; } .no-boxshadow input.input, .no-boxshadow textarea.input { padding-top: 6px; padding-bottom: 6px; line-height: 16px; min-height: 16px; } .inputs { display: block; padding: 0; height: auto; list-style-type: none; margin-left: 0; } .inputs > li { padding: 0 9px; line-height: 30px; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 0 -1px 0 rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), inset 0 -1px 0 rgba(0, 0, 0, 0.15); } .no-boxshadow .inputs > li { border-bottom: 1px solid #cccccc; } .black-inputs .inputs > li, .inputs.black-input > li { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.85); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.875); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.85); } .no-boxshadow .black-inputs .inputs > li, .no-boxshadow .inputs.black-input > li { border-bottom: 1px solid #555555; } .inputs > li:first-child { -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); } .black-inputs .inputs > li:first-child, .inputs.black-input > li:first-child { -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.05); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.05); } .inputs.black-input { -webkit-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); -moz-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5); } .inputs > li:last-child { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); } .no-boxshadow .inputs > li.last-child { border-bottom: 0; } .black-inputs .inputs > li:last-child, .inputs.black-input > li:last-child { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15); } /* IE7 */ .no-boxshadow .black-inputs .inputs > li.last-child, .no-boxshadow .inputs.black-input > li.last-child { border-bottom: 0; } .inputs > li:only-child, .black-inputs .inputs > li:only-child, .inputs.black-input > li:only-child { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .inputs > li > [class^="icon-"]:before, .inputs > li > [class*=" icon-"]:before { width: 15px; display: inline-block; text-align: center; } /* IE7 */ .font-icon { width: 15px; display: inline-block; text-align: center; } p > .button, p > .input { margin-top: -7px; margin-bottom: -7px; } .button-height .button, .button-height .input { margin-top: 0; margin-bottom: 0; } .black-inputs .input, .input.black-input, .black-inputs .inputs, .inputs.black-input { -webkit-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 0), inset 0 2px 5px rgba(0, 0, 0, 0.75), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 rgba(51, 153, 255, 0); -moz-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 0), inset 0 2px 5px rgba(0, 0, 0, 0.75), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 rgba(51, 153, 255, 0); box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 0), inset 0 2px 5px rgba(0, 0, 0, 0.75), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 rgba(51, 153, 255, 0); } .input-unstyled { padding: 0 3px; vertical-align: baseline; *vertical-align: middle; height: 16px; line-height: 16px; border-width: 0; color: inherit; /*color:expression(this.parentNode.currentStyle['color']);*/ -webkit-appearance: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background: none; } .input-unstyled.full-width { padding: 0; width: 100%; } .input > .input-unstyled, .inputs > li > .input-unstyled { padding-top: 6px; padding-bottom: 6px; } .ie7 .input > .input-unstyled, .ie7 .inputs > li > .input-unstyled { margin-top: -6px; margin-bottom: -6px; } .input > .input-unstyled:first-child, .inputs > li > .input-unstyled:first-child { margin-left: -9px; padding-left: 9px !important; } .input > .input-unstyled:last-child, .inputs > li > .input-unstyled:last-child { margin-right: -9px; padding-right: 9px !important; } /* IE7 */ .input > .input-unstyled.last-child, .inputs > li > .input-unstyled.last-child { margin-right: -9px; padding-right: 9px !important; } .input-sep { padding-right: 6px; border-right: 1px solid #cccccc; margin-right: 6px; } .black-inputs .input-sep, .black-input .input-sep { border-right-color: #616161; } .input-sep + .input-unstyled { margin-left: -6px; padding-left: 6px; } .input.focus, .inputs.focus { -webkit-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 1), inset 0 0.5px 1.5px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 3px rgba(51, 153, 255, 0.75); -moz-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 1), inset 0 0.5px 1.5px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 3px rgba(51, 153, 255, 0.75); box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 1), inset 0 0.5px 1.5px rgba(0, 0, 0, 0.35), 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 3px rgba(51, 153, 255, 0.75); } .input.full-width { display: block; width: 100%; margin: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .no-boxsizing .input.full-width { width: 94%; } .input > .input-unstyled.disabled { color: #999999; } .input.disabled, .input:disabled, .disabled .input { padding: 0 8px; line-height: 28px; border-width: 1px; border-style: solid; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #999999; } input.input.disabled, input.input:disabled, .disabled input.input { padding-top: 6px; padding-bottom: 6px; line-height: 16px; } .input.disabled > .input-unstyled, .inputs.disabled > li > .input-unstyled, .disabled .input > .input-unstyled, .disabled .inputs > li > .input-unstyled { padding-top: 6px; padding-bottom: 6px; } .input > .float-left, .input > .float-right { height: inherit; /*height:expression(this.parentNode.currentStyle['height']);*/ line-height: inherit; /*line-height:expression(this.parentNode.currentStyle['line-height']);*/ } .input.large { padding: 0 19px; line-height: 50px; } input.input.large { padding-top: 17px; padding-bottom: 17px; line-height: 16px; } .inputs.large > li { line-height: 50px; padding: 0 19px; } .large > .input-unstyled, .large > li > .input-unstyled { padding-top: 17px; padding-bottom: 17px; } .large > .input-unstyled:first-child, .large > li > .input-unstyled:first-child { margin-left: -19px; padding-left: 19px !important; } .large > .input-unstyled:last-child, .large > li > .input-unstyled:last-child { margin-right: -19px; padding-right: 19px !important; } /* IE7 */ .large > .input-unstyled.last-child, .large > li > .input-unstyled.last-child { margin-right: -19px; padding-right: 19px !important; } .input.large.disabled, .input.large:disabled, .disabled .input.large { padding: 0 18px; line-height: 48px; } input.input.large.disabled, input.input.large:disabled, .disabled input.input.large { padding-top: 16px; padding-bottom: 16px; line-height: 16px; } .input.large.disabled > .input-unstyled, .inputs.large.disabled > li > .input-unstyled, .disabled .input.large > .input-unstyled, .disabled .inputs.large > li > .input-unstyled { padding-top: 16px; padding-bottom: 16px; } input[type=radio], input[type=checkbox] { vertical-align: -2px; } ::-webkit-input-placeholder { color: #f0f0f0; } input:-moz-placeholder { color: #f0f0f0; } /* For older browsers */ .placeholder { color: #f0f0f0 !important; } .input-wrapper { padding: 10px; -webkit-background-clip: padding-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), 0 1px 1px rgba(255, 255, 255, 0.5), 0 -1px 0 rgba(0, 0, 0, 0.25); -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), 0 1px 1px rgba(255, 255, 255, 0.5), 0 -1px 0 rgba(0, 0, 0, 0.25); box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), 0 1px 1px rgba(255, 255, 255, 0.5), 0 -1px 0 rgba(0, 0, 0, 0.25); } .input-wrapper > .inputs + .inputs { margin-top: -6px; } /* Required style */ .required .label { color: black; font-weight: bold; } .required .label:after { content: ' *'; color: red; } /* Value field */ .touchevents .number.input { position: relative; padding: 0 0 0 3px; } .number-up, .number-down { overflow: hidden; text-indent: -5000px; width: 6px; } .touchevents .number-up, .touchevents .number-down { position: absolute; right: 0; padding: 0; margin: 0; padding: 0; width: 17px; -webkit-background-clip: padding-box; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), -1px 0 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), -1px 0 0 rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), -1px 0 0 rgba(0, 0, 0, 0.1); } .touchevents .black-inputs .number-up, .touchevents .black-inputs .number-down { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), -1px 0 0 rgba(0, 0, 0, 0.25); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), -1px 0 0 rgba(0, 0, 0, 0.25); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), -1px 0 0 rgba(0, 0, 0, 0.25); } .number-up:after, .number-down:after { display: block; position: absolute; content: ' '; width: 5px; height: 5px; left: 50%; top: 50%; margin: -2px 0 0 -2px; background-image: url(img/sprites.png); } /* IE7 */ .number-after { display: block; position: absolute; width: 5px; height: 5px; left: 50%; top: 50%; margin: -2px 0 0 -3px; background-image: url(img/sprites.png); } .number-up:after { background-position: -125px -8px; } /* IE7 */ .number-up > .number-after { background-position: -125px -8px; } .number-down:after { margin-top: -1px; background-position: -125px -13px; } /* IE7 */ .number-down > .number-after { margin-top: -1px; background-position: -125px -13px; } .black-inputs .number-up:after { background-position: -120px -8px; } /* IE7 */ .black-inputs .number-up > .number-after { background-position: -120px -8px; } .black-inputs .number-down:after { margin-top: -1px; background-position: -120px -13px; } /* IE7 */ .black-inputs .number-down > .number-after { margin-top: -1px; background-position: -120px -13px; } .touchevents .number-up:active, .touchevents .number-up.active, .touchevents .number-down:active, .touchevents .number-down.active { padding: 1px !important; -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75) !important; -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75) !important; box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75) !important; } .touchevents .number-up.disabled, .number-up:disabled, .disabled .number-up, .touchevents .number-down.disabled, .number-down:disabled, .disabled .number-down { padding: 0 !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; } .touchevents .number-up { top: 0; margin: 0 !important; height: 14px; -webkit-border-radius: 0 !important; -webkit-border-top-right-radius: 3px !important; -moz-border-radius: 0 3px 0 0 !important; border-radius: 0 3px 0 0 !important; } .ie7.touchevents .number-up { height: 16px !important; } .touchevents .disabled .number-up { top: -1px; right: -1px; } .touchevents .number-down { bottom: 0; margin: 0 !important; height: 13px; -webkit-border-radius: 0 !important; -webkit-border-bottom-right-radius: 3px !important; -moz-border-radius: 0 0 3px 0 !important; border-radius: 0 0 3px 0 !important; } .ie7.touchevents .number-down { height: 16px !important; } .touchevents .disabled > .number-down { bottom: -1px; right: -1px; } /* Form layouts */ .block-label > .label { display: block; margin-bottom: 3px; font-weight: bold; line-height: 16px; } .block-label > .label > small { float: right; } .inline-small-label { padding-left: 60px; } .inline-small-label > .label{ display: block; float: left; width: 55px; margin-left: -60px; font-weight: bold; } .inline-small-label.button-height > .label { line-height: 16px; padding-top: 7px; } .inline-label > .label, .inline-medium-label > .label, .inline-large-label > .label { display: block; margin-bottom: 3px; font-weight: bold; line-height: 16px; } /* File input */ .input.file { position: relative; padding: 0; } .file-text { position: absolute; z-index: 1; top: 0; left: 0; right: 0; bottom: 0; padding: 0 9px; overflow: hidden; background: none; } .input.file > .button { position: absolute; z-index: 2; right: 3px; top: 3px; } .input.file > input { position: relative; z-index: 3; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0; } /* Fieldset and field-lists */ .fieldset { padding: 20px; border: 1px solid #cccccc; margin-bottom: 16px; -webkit-background-clip: padding-box; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 0 rgba(255, 255, 255, 0.15); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 0 rgba(255, 255, 255, 0.15); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 0 rgba(255, 255, 255, 0.15); } .fieldset:last-child { margin-bottom: 0; } /* IE7 */ .fieldset.last-child { margin-bottom: 0; } .legend { line-height: 22px; border-width: 1px; border-style: solid; padding: 5px 20px; -webkit-background-clip: padding-box; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; z-index: 88; margin-bottom: 1px; } /* IE7 background bleed bug: http://www.communitymx.com/content/article.cfm?cid=DD9F3 */ .ie7 .fieldset { position: relative; margin-top: 30px; } .ie7 .legend { position: absolute; top: 0; left: 20px; margin-top: -11px; } /* Fields list */ .field-block { padding: 0 20px; margin: 0 -20px; } .field-block.button-height { margin-top: 0; margin-bottom: 0; line-height: 18px; } .field-block + .field-block { margin-top: 15px; border-top: 1px solid #eee; padding-top: 15px; } .field-drop + .field-block { padding-top: 20px; } .field-block + .field-block.button-height, .field-drop + .field-block.button-height { padding-top: 18px; } .field-block small.input-info, .field-block .small.input-info { display: block; padding: 5px 0 3px; } .field-block small.input-info:first-child, .field-block .small.input-info:first-child { padding-top: 0; } .field-block small.input-info:last-child, .field-block .small.input-info:last-child { padding-bottom: 0; } /* IE7 */ .field-block small.input-info.last-child, .field-block .small.input-info.last-child { padding-bottom: 0; } .field-block a { display: inline-block; } .field-block .label, .field-drop .label { display: block; padding: 0; color: #555; /*font-weight: bold;*/ margin: 0; } .field-block .label b, .field-block .label strong { color: #444444; } /* Field drop */ .field-drop { padding: 18px 20px; line-height: 34px; margin: 0 -20px; -webkit-box-shadow: inset 0 1px 10px black; -moz-box-shadow: inset 0 1px 10px black; box-shadow: inset 0 1px 10px black; position: relative; } .field-drop.button-height { margin-top: 0; margin-bottom: 0; } .field-drop:first-child, .fields-list legend:first-child + .field-drop { margin-top: -22px; -webkit-background-clip: padding-box; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; } .field-drop:last-child { margin-bottom: -20px; -webkit-background-clip: padding-box; -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } /* IE7 */ .field-drop.last-child { margin-bottom: -20px; } .field-drop + .field-drop { border-top: 1px solid #666666; } .field-block + .field-drop { margin-top: 20px; } .field-drop .label b, .field-drop .label strong { color: white; } .field-drop:after { display: block; content: ' '; width: 0; height: 0; border: 6px solid transparent; border-top-color: white; position: absolute; z-index: 2; top: 0; left: 100px; } /* Selects */ span.select { display: inline-block; *display: inline; zoom: 1; text-align: left; position: relative; z-index: 89; text-transform: none; /* font-weight: bold; font-size: 13px; font-family: Arial, Helvetica, sans-serif;*/ height: 30px; line-height: 30px; vertical-align: middle; *vertical-align: -10px; background: white; margin: -1px 0 1px; padding: 0 26px 0 0; } .select.replacement { padding-right: 0; } .ie7 .select.replacement { padding-right: 26px; } .ie7 .select.replacement.fixedWidth { padding-right: 0; } span.selectMultiple { display: inline-block; *display: inline; zoom: 1; vertical-align: top; line-height: 0; } span.select, span.selectMultiple { -webkit-background-clip: padding-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-transition: -webkit-box-shadow 400ms; -moz-transition: -moz-box-shadow 400ms; -ms-transition: box-shadow 400ms; -o-transition: box-shadow 400ms; transition: box-shadow 400ms; -webkit-box-shadow: 0 0 0 1px rgba(51, 153, 255, 0), 0 0 0 rgba(51, 153, 255, 0); -moz-box-shadow: 0 0 0 1px rgba(51, 153, 255, 0), 0 0 0 rgba(51, 153, 255, 0); box-shadow: 0 0 0 1px rgba(51, 153, 255, 0), 0 0 0 rgba(51, 153, 255, 0); } .select.focus, .selectMultiple.focus { -webkit-box-shadow: 0 0 0 1px rgba(51, 153, 255, 1), 0 0 5px rgba(51, 153, 255, 0.75); -moz-box-shadow: 0 0 0 1px rgba(51, 153, 255, 1), 0 0 5px rgba(51, 153, 255, 0.75); box-shadow: 0 0 0 1px rgba(51, 153, 255, 1), 0 0 5px rgba(51, 153, 255, 0.75); } .select-cloned { visibility: hidden; } .select.full-width, .selectMultiple.full-width { display: block; margin: 0; width:100%; } .select > select, .selectMultiple > select { top: 0; left: 0; padding: 0; margin: 0 !important; vertical-align: top; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity: 0; } .select > select { height: 30px; line-height: 26px; font-weight: bold; border-right: 26px solid black; } .fixedWidth > select { border-right: 0; } .selectMultiple > select { -webkit-appearance: none; height: 0; line-height: 0; border: 0; } .select.full-width > select { width: 100%; } .button-height .select.float-left, .button-height .select.float-right { margin-top: 2px; } .input .select:first-child { margin-left: -9px; } .input .select:last-child { margin-right: -9px; } /* IE7 */ .input .select.last-child { margin-right: -9px; } .select.open { position: absolute; z-index: 999200; } .select.open.over { z-index: 999600; } .select-value { display: block; position: relative; line-height: 16px; height: 16px; padding: 6px 7px 6px 8px; -webkit-background-clip: padding-box; /*-webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px;*/ border-width: 1px; border-style: solid; text-overflow: ellipsis; z-index: -1; white-space: nowrap; overflow: hidden; } .replacement > .select-value { position: absolute; top: 0; left: 0; bottom: 0; right: 26px; } .select-value.alt { font-style: italic; } .input .select-value { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .input.large .select-value, .input .select:first-child > .select-value { -webkit-border-bottom-left-radius: 3px; -webkit-border-top-left-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-bottomleft: 3px; border-bottom-left-radius: 3px; border-top-left-radius: 3px; } .select-arrow { display: block; position: absolute; z-index: -1; top: 0; right: 0; bottom: 0; width: 25px; -webkit-background-clip: padding-box; /*-webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px;*/ /*-moz-border-radius: 0 4px 4px 0;*/ /*border-radius: 0 4px 4px 0;*/ border-width: 1px; border-style: solid; } .input .select-arrow { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .input.large .select-arrow, .input .select:last-child > .select-arrow { -webkit-border-bottom-right-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 3px; border-bottom-right-radius: 3px; border-top-right-radius: 3px; } .select-arrow:before, .select-arrow:after { display: block; content: ' '; position: absolute; left: 50%; margin-left: -3px; top: 50%; width: 7px; height: 5px; } /* IE7 */ .select-arrow-before, .select-arrow-after { display: block; position: absolute; left: 50%; margin-left: -3px; top: 50%; width: 7px; height: 5px; } .select-arrow:before { margin-top: -5px; background: url(img/sprites.png) no-repeat -130px -8px; } /* IE7 */ .select-arrow-before { margin-top: -5px; background: url(img/sprites.png) no-repeat -130px -8px; } .black-gradient > .select-arrow:before, .anthracite-gradient > .select-arrow:before, .grey-gradient > .select-arrow:before, .red-gradient > .select-arrow:before, .orange-gradient > .select-arrow:before, .green-gradient > .select-arrow:before, .blue-gradient > .select-arrow:before { background-position: -137px -8px; } /* IE7 */ .black-gradient > .select-arrow > .select-arrow-before, .anthracite-gradient > .select-arrow > .select-arrow-before, .grey-gradient > .select-arrow > .select-arrow-before, .red-gradient > .select-arrow > .select-arrow-before, .orange-gradient > .select-arrow > .select-arrow-before, .green-gradient > .select-arrow > .select-arrow-before, .blue-gradient > .select-arrow > .select-arrow-before { background-position: -137px -8px; } .select-arrow:after { margin-top: 2px; background: url(img/sprites.png) no-repeat -130px -13px; } /* IE7 */ .select-arrow-after { margin-top: 2px; background: url(img/sprites.png) no-repeat -130px -13px; } .black-gradient > .select-arrow:after, .anthracite-gradient > .select-arrow:after, .grey-gradient > .select-arrow:after, .red-gradient > .select-arrow:after, .orange-gradient > .select-arrow:after, .green-gradient > .select-arrow:after, .blue-gradient > .select-arrow:after { background-position: -137px -13px; } /* IE7 */ .black-gradient > .select-arrow > .select-arrow-after, .anthracite-gradient > .select-arrow > .select-arrow-after, .grey-gradient > .select-arrow > .select-arrow-after, .red-gradient > .select-arrow > .select-arrow-after, .orange-gradient > .select-arrow > .select-arrow-after, .green-gradient > .select-arrow > .select-arrow-after, .blue-gradient > .select-arrow > .select-arrow-after { background-position: -137px -13px; } .select-styled-list > .select-value, .select-styled-list > .select-arrow { z-index: 99; } .list-over > .select-value, .list-over > .select-arrow { z-index: -2; } .select-styled-list.list-over > .select-value, .select-styled-list.list-over > .select-arrow { z-index: 98; } .select-search-wrapper { display: block; position: absolute; left: 1px; right: 27px; top: 1px; z-index: 105; line-height: 16px; padding: 5px 7px 6px 8px; -webkit-background-clip: padding-box; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; background: white; font-weight: normal; } .select-search { line-height: 16px; padding: 0; border: 0; margin: 0; width: 100%; background: white; } .drop-down { position: absolute; z-index: -2; top: 0; padding-top: 29px; left: 0; right: 0; overflow: auto; border-width: 1px; border-style: solid; -webkit-background-clip: padding-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); opacity: 0.99; } .drop-down { display: none; } .selectMultiple > .drop-down { display: block; position: relative; z-index: auto; top: auto; padding: 0; left: auto; right: auto; } .selectMultiple.no-bg > .drop-down { background: none; border-width: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .select.list-over > .drop-down { z-index: -1; padding-top: 0; } .reversed > .drop-down { top: auto; bottom: 0; padding-top: 0; padding-bottom: 29px; } .select.list-over.reversed > .drop-down { padding-bottom: 0; } .select.expandable-list > .drop-down { padding-top: 0; top: 30px; right: auto; min-width: 100%; max-width: 280px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .select.expandable-list.expand-left > .drop-down { left: auto; right: 0; } .select.expandable-list.list-over > .drop-down { top: 0; } .select.expandable-list.reversed > .drop-down { top: auto; bottom: 30px; padding-bottom: 0; } .select.expandable-list.list-over.reversed > .drop-down { bottom: 0; } .select.open > .drop-down, .select.open-on-hover:hover > .drop-down { display: block; } .disabled .drop-down { display: none !important; } .disabled .selectMultiple > .drop-down, .selectMultiple.disabled > .drop-down { display: block !important; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -khtml-opacity: 0.5; -moz-opacity: 0.5; opacity: 0.5; } .drop-down > span, .drop-down > a { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 16px; padding: 5px 10px; cursor: pointer; color: inherit; } .drop-down > .disabled { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -khtml-opacity: 0.5; -moz-opacity: 0.5; opacity: 0.5; background: none !important; } .check-list > .drop-down > span, .check-list > .drop-down > a { padding: 10px 10px 10px 38px; position: relative; border-top: 1px dotted !important; border-top-color: inherit !important; font-weight: normal; } .check-list > .drop-down > span:first-child, .check-list > .drop-down > a:first-child, .check-list > .drop-down > .custom-vscrollbar:first-child + span, .check-list > .drop-down > .custom-vscrollbar:first-child + a { border-top: 0 !important; } .check-list > .drop-down > span > span, .check-list > .drop-down > a > span { display: block; position: absolute; left: 6px; top: 6px; width: 26px; height: 26px; background: url(img/sprites.png) no-repeat 0 -128px; } .check-list > .drop-down > .disabled > span { background-position: 0 -128px !important; } .check-list > .drop-down > .selected > span { background-position: -26px -128px; } .check-list.red-gradient > .drop-down > .selected > span, .check-list.orange-gradient > .drop-down > .selected > span, .check-list.green-gradient > .drop-down > .selected > span { background-position: -52px -128px; } .check-list.black-gradient > .drop-down > .selected > span, .check-list.anthracite-gradient > .drop-down > .selected > span, .check-list.grey-gradient > .drop-down > .selected > span { background-position: -78px -128px; } .focus > .drop-down > .focus { outline: 1px dotted invert; } .touchevents .drop-down > span:hover, .touchevents .drop-down > a:hover, .drop-down > .selected { border-width: 1px; border-style: solid; padding: 4px 9px; -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6) !important; -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6) !important; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6) !important; } .touchevents .drop-down > .disabled:hover { border: 0; padding: 5px 10px; color: inherit; /*color:expression(this.parentNode.currentStyle['color']);*/ -webkit-text-shadow: none !important; -moz-text-shadow: none !important; text-shadow: none !important; } .touchevents .check-list > .drop-down > span:hover, .touchevents .check-list > .drop-down > a:hover, .check-list > .drop-down > .selected { padding: 10px 10px 10px 38px; border-width: 0; color: inherit; /*color:expression(this.parentNode.currentStyle['color']);*/ background: none !important; -webkit-text-shadow: none !important; -moz-text-shadow: none !important; text-shadow: none !important; } .touchevents .check-list > .drop-down > span:first-child:hover, .touchevents .check-list > .drop-down > a:first-child:hover { border-top: 0; } .drop-down > span:last-child, .drop-down > a:last-child, .select.list-over.reversed > .drop-down > span:last-child, .select.list-over.reversed > .drop-down > a:last-child, .expandable-list.reversed > .drop-down > span:last-child, .expandable-list.reversed > .drop-down > a:last-child, .selectMultiple > .drop-down > span:last-child, .selectMultiple > .drop-down > a:last-child { -webkit-background-clip: padding-box; -webkit-border-bottom-left-radius: 3px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomleft: 3px; -moz-border-radius-bottomright: 3px; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } .reversed > .drop-down > span:last-child, .reversed > .drop-down > a:last-child { -webkit-border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-bottomright: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .reversed > .drop-down > span:first-child, .reversed > .drop-down > a:first-child, .select.list-over > .drop-down > span:first-child, .select.list-over > .drop-down > a:first-child, .expandable-list > .drop-down > span:first-child, .expandable-list > .drop-down > a:first-child, .selectMultiple > .drop-down > span:first-child, .selectMultiple > .drop-down > a:first-child { -webkit-background-clip: padding-box; -webkit-border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-topright: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; } /* Option groups */ .drop-down > strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 16px; padding: 5px 10px; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -khtml-opacity: 0.5; -moz-opacity: 0.5; opacity: 0.5; } .drop-down > a + strong, .drop-down > span + strong, .drop-down > .in-group + a, .drop-down > .in-group + span { margin-top: 7px; } .drop-down > .in-group + .in-group { margin-top: 0; } .drop-down > .in-group { padding-left: 20px; } .touchevents .drop-down > .in-group:hover, .drop-down > .in-group.selected { padding-left: 19px; } .touchevents .drop-down > .in-group.disabled:hover { padding-left: 20px; } .check-list > .drop-down > .in-group, .touchevents .check-list > .drop-down > .in-group:hover, .touchevents .check-list > .drop-down > .in-group.selected { padding-left: 48px; } .check-list > .drop-down > .in-group > span { left: 16px; } .select.compact, .compact .select { line-height: 24px; height: 24px; padding-right: 22px; *vertical-align: -7px; } .select.compact > select, .compact .select > select { height: 24px; line-height: 20px; } .select.compact.replacement, .compact .select.replacement { padding-right: 0; } .input .select.compact:first-child, .input.compact .select:first-child { margin-left: -6px; } .input .select.compact:last-child, .input.compact .select:last-child { margin-right: -6px; } /* IE7 */ .input .select.compact.last-child, .input.compact .select.last-child { margin-right: -6px; } .compact .select-value { padding: 3px 8px; font-size: 0.9em; /*-webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px;*/ } .compact .replacement > .select-value, .compact.replacement > .select-value { right: 22px; } .compact .select-arrow { width: 21px; /*-webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0;*/ } .compact .select-search-wrapper { right: 23px; padding: 3px 8px; } .compact > .drop-down { padding-top: 23px; } .compact.list-over > .drop-down { padding-top: 0; } .compact.reversed > .drop-down { padding-top: 0; padding-bottom: 23px; } .compact.list-over.reversed > .drop-down { padding-bottom: 0; } .compact.expandable-list > .drop-down { padding-top: 0; top: 24px; } .compact.expandable-list.list-over > .drop-down { top: 0; } .compact.expandable-list.reversed > .drop-down { top: auto; bottom: 24px; padding-bottom: 0; } .compact.expandable-list.list-over.reversed > .drop-down { bottom: 0; } /* Styled radio/checkboxes */ .checkbox, .radio { display: inline-block; *display: inline; zoom: 1; vertical-align: middle; width: 13px; height: 13px; border-width: 1px; border-style: solid; padding: 0; -webkit-transition: all 400ms; -moz-transition: all 400ms; -ms-transition: all 400ms; -o-transition: all 400ms; transition: all 400ms; -webkit-background-clip: padding-box; position: relative; margin-top: -2px; margin-bottom: 2px; } .checkbox > input, .radio > input { display: block; position: absolute; top: 0; left: 0; visibility: hidden; } .checkbox { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .radio { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } .checkbox.focus, .radio.focus { -webkit-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 1), inset 0 1px 5px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.5), 0 0 5px rgba(51, 153, 255, 0.75); -moz-box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 1), inset 0 1px 5px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.5), 0 0 5px rgba(51, 153, 255, 0.75); box-shadow: inset 0 0 0 1px rgba(51, 153, 255, 1), inset 0 1px 5px rgba(0, 0, 0, 0.5), 0 1px 0 rgba(255, 255, 255, 0.5), 0 0 5px rgba(51, 153, 255, 0.75); } .check-knob { display: none; position: absolute; } .checkbox > .check-knob { left: 50%; top: 50%; width: 15px; height: 13px; margin: -7px -5px; background: url(img/sprites.png) no-repeat -54px -81px; -webkit-background-size: auto; -moz-background-size: auto; -o-background-size: auto; background-size: auto; } .black-inputs .check-knob, .black-input > .check-knob { background-position: -39px -81px; } .radio > .check-knob { left: 2px; top: 2px; width: 9px; height: 9px; background: url(img/sprites.png) no-repeat -64px 0; -webkit-background-size: auto; -moz-background-size: auto; -o-background-size: auto; background-size: auto; } .black-inputs .radio > .check-knob, .black-inputs.radio > .check-knob { background-position: -64px -9px; } .checked > .check-knob { display: block; } .checkbox.disabled, .disabled .checkbox, .radio.disabled, .disabled .radio { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .checkbox.disabled > .check-knob, .disabled .checkbox > .check-knob { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -khtml-opacity: 0.5; -moz-opacity: 0.5; opacity: 0.5; } .radio.disabled > .check-knob, .disabled .radio > .check-knob { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } /* Wizard */ .full-page-wizard { padding: 15px; } .full-page-wizard > .block { -webkit-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.65); -moz-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.65); box-shadow: 0 2px 12px rgba(0, 0, 0, 0.65); } .wizard-steps { list-style-type: none; margin: 0; padding: 0; height: 40px; border-width: 1px; border-style: solid; text-align: center; margin: 0 -1px; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25); } .wizard-steps > li { display: inline-block; *display: inline; zoom: 1; height: 40px; line-height: 40px; padding: 0 0 0 57px; width: 0; text-indent: -9999px; white-space: nowrap; background: url(img/effects/wizard-steps-separator.png) no-repeat left center; overflow: hidden; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -khtml-opacity: 0.5; -moz-opacity: 0.5; opacity: 0.5; -webkit-transition: opacity 200ms; -moz-transition: opacity 200ms; -ms-transition: opacity 200ms; -o-transition: opacity 200ms; transition: opacity 200ms; } .wizard-steps > li:first-child { padding-left: 36px !important; background: none; } .wizard-steps > .completed, .wizard-steps > .current, .wizard-steps > .active { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; cursor: pointer; } .wizard-steps > .active { width: auto; text-indent: 0; padding: 0 9px 0 65px; } .wizard-step { display: block; float: left; margin: 8px 0 0 -27px; line-height: 16px; min-width: 16px; font-weight: bold; text-indent: 0; padding: 3px; border-width: 1px; border-style: solid; -webkit-border-radius: 11px; -moz-border-radius: 11px; border-radius: 11px; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), 0 2px 4px black; -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), 0 2px 4px black; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), 0 2px 4px black; } .wizard-fieldset { padding: 20px; /*border-top: 1px solid #ccc; margin-top: 10px;*/ } .wizard-enabled .wizard-fieldset { margin-top: 0; border-top: 0; display: none; } .wizard-enabled .wizard-fieldset.active { display: block; } .wizard-enabled .wizard-fieldset > legend { display: none; } .wizard-spacer { padding: 0; margin: 0; } /*480px __________________________________________________________________________________________________________ */ @media only screen and (min-width: 480px) { .select.expandable-list > .drop-down { max-width: 440px; } }/*/mediaquery*/ /*768px __________________________________________________________________________________________________________ */ @media only screen and (min-width: 768px) { /* Form layouts */ .inline-label { padding-left: 120px; } .inline-label > .label{ float: left; width: 105px; margin-left: -120px; line-height: inherit; /*line-height:expression(this.parentNode.currentStyle['line-height']);*/ } .inline-medium-label { padding-left: 180px; } .inline-medium-label > .label{ float: left; width: 165px; margin-left: -180px; line-height: inherit; /*line-height:expression(this.parentNode.currentStyle['line-height']);*/ } .inline-large-label { padding-left: 240px; } .inline-large-label > .label{ float: left; width: 225px; margin-left: -240px; line-height: inherit; /*line-height:expression(this.parentNode.currentStyle['line-height']);*/ } .inline-label.button-height > .label, .inline-large-label.button-height > .label { line-height: 16px; padding-top: 7px; } /* Fields list */ .fieldset.fields-list, .wizard-fieldset.fields-list { background-image: url(img/fieldset-bg.gif); background-repeat: repeat-y; } .field-block { padding: 0 20px 0 160px; margin: 0 -20px; } .field-block .label, .field-drop .label { float: left; text-align: right; margin: 0 0 0 -150px; width: 120px; } /* Field drop */ .field-drop { padding: 28px 30px 28px 230px; } .field-drop .label { width: 190px; } .field-drop:after { left: 236px; } .select.expandable-list > .drop-down { max-width: none; } /* Sizes */ .compact-field-blocks { background-position: -40px 0; } .compact-field-blocks .field-block, .compact-field-blocks .field-drop { padding-left: 190px; } .compact-field-blocks .field-block .label, .compact-field-blocks .field-drop .label { width: 110px; margin-left: -170px; } .mini-field-blocks { background-position: -80px 0; } .mini-field-blocks .field-block, .mini-field-blocks .field-drop { padding-left: 150px; } .mini-field-blocks .field-block .label, .mini-field-blocks .field-drop .label { width: 70px; margin-left: -130px; } /* Wizard */ .full-page-wizard { text-align: center; } .full-page-wizard > .block { text-align: left; margin: 0 auto; max-width: 800px; } .wizard-steps > li { width: auto; text-indent: 0; padding: 0 9px 0 65px; } .wizard-step { margin-left: -32px; } .wizard-fieldset:last-child, .wizard-enabled .wizard-fieldset.active { -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; } }/*/mediaquery*/ .input-small { line-height: 25px; } /** * Switches styles */ .switch { display: inline-block; *display: inline; zoom: 1; text-align: center; position: relative; height: 30px; width: 95px; padding: 0; vertical-align: middle; -webkit-background-clip: padding-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; overflow: hidden; cursor: pointer; -webkit-transition: all 400ms; -moz-transition: all 400ms; -ms-transition: all 400ms; -o-transition: all 400ms; transition: all 400ms; -webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 rgba(51, 153, 255, 0); -moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 rgba(51, 153, 255, 0); box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 rgba(51, 153, 255, 0); } .switch > input { display: block; position: absolute; top: 0; left: 0; visibility: hidden; } .switch.wide { width: 125px; } .switch.wider { width: 155px; } .switch.focus { -webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 5px rgba(51, 153, 255, 0.75); -moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 5px rgba(51, 153, 255, 0.75); box-shadow: 0 1px 1px rgba(255, 255, 255, 0.5), 0 0 5px rgba(51, 153, 255, 0.75); } .button-height .switch { margin-top: -2px; margin-bottom: 2px; } .button-height .switch.float-left, .button-height .switch.float-right { margin-top: 2px; } .switch-on, .switch-off { display: block; position: absolute; line-height: 30px; font-size: 18px; overflow: hidden; padding: 0; top: 0; left: 0; right: 0; bottom: 0; } .no-boxshadow .switch-on, .no-boxshadow .switch-off { line-height: 26px; border-width: 1px; border-style: solid; } .switch-on { color: white; right: 91px; -webkit-background-clip: padding-box; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; -webkit-transition: right 200ms; -moz-transition: right 200ms; -ms-transition: right 200ms; -o-transition: right 200ms; transition: right 200ms; -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), inset -5px 1px 3px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), inset -5px 1px 3px rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), inset -5px 1px 3px rgba(0, 0, 0, 0.5); -webkit-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); -moz-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.35); } .wide > .switch-on { right: 121px; } .wider > .switch-on { right: 151px; } .reversed-switches .switch-on { right: 0; left: 91px; padding-left: 4px; padding-right: 0; -webkit-border-radius: 0; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0; -webkit-transition: left 200ms; -moz-transition: left 200ms; -ms-transition: left 200ms; -o-transition: left 200ms; transition: left 200ms; -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), inset 5px 1px 3px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), inset 5px 1px 3px rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.75), inset 5px 1px 3px rgba(0, 0, 0, 0.5); } .reversed-switches .wide > .switch-on { left: 121px; } .reversed-switches .wider > .switch-on { left: 151px; } .switch-off { color: #999999; left: 36px; padding-left: 4px; -webkit-background-clip: padding-box; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0; -webkit-transition: left 200ms; -moz-transition: left 200ms; -ms-transition: left 200ms; -o-transition: left 200ms; transition: left 200ms; -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.5), inset 5px 1px 3px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.5), inset 5px 1px 3px rgba(0, 0, 0, 0.3); box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.5), inset 5px 1px 3px rgba(0, 0, 0, 0.3); -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); } .black-inputs .switch-off, .black-input > .switch-off { color: #505050; -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35); } .reversed-switches .switch-off { left: 0; right: 36px; padding-left: 0; padding-right: 4px; -webkit-border-radius: 0; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; -webkit-transition: right 200ms; -moz-transition: right 200ms; -ms-transition: right 200ms; -o-transition: right 200ms; transition: right 200ms; -webkit-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.5), inset -5px 1px 3px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.5), inset -5px 1px 3px rgba(0, 0, 0, 0.3); box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.5), inset -5px 1px 3px rgba(0, 0, 0, 0.3); } .switch-on > span, .switch-off > span { display: block; width: 55px; padding-top: 1px; } .wide > .switch-on > span, .wide > .switch-off > span { width: 85px; } .wider > .switch-on > span, .wider > .switch-off > span { width: 115px; } .switch-on > span { margin-left: -55px; -webkit-transition: margin-left 200ms; -moz-transition: margin-left 200ms; -ms-transition: margin-left 200ms; -o-transition: margin-left 200ms; transition: margin-left 200ms; } .wide > .switch-on > span { margin-left: -85px; } .wider > .switch-on > span { margin-left: -115px; } .reversed-switches .switch-on > span { margin-left: 0; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } .reversed-switches .switch-off > span { -webkit-transition: margin-left 200ms; -moz-transition: margin-left 200ms; -ms-transition: margin-left 200ms; -o-transition: margin-left 200ms; transition: margin-left 200ms; } .switch-button { position: absolute; z-index: 88; display: block; border-width: 1px; border-style: solid; width: 38px; left: 0; top: 0; bottom: 0; padding: 0; margin: 0; -webkit-background-clip: padding-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-transition: left 200ms, border-color 400ms; -moz-transition: left 200ms, border-color 400ms; -ms-transition: left 200ms, border-color 400ms; -o-transition: left 200ms, border-color 400ms; transition: left 200ms, border-color 400ms; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); } .black-inputs .switch-button, .black-input > .switch-button { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35); } .reversed-switches .switch-button { left: auto; right: 0; -webkit-transition: right 200ms, border-color 400ms; -moz-transition: right 200ms, border-color 400ms; -ms-transition: right 200ms, border-color 400ms; -o-transition: right 200ms, border-color 400ms; transition: right 200ms, border-color 400ms; } .focus > .switch-button { border-color: #3399ff !important; } .switch-button.silver-gradient, .switch-button.white-gradient { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); } .switch-button.black-gradient, .switch-button.anthracite-gradient, .switch-button.grey-gradient, .switch-button.red-gradient, .switch-button.orange-gradient, .switch-button.green-gradient, .switch-button.blue-gradient { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3); } .medium > .switch-button:after, .tiny > .switch-button:after, .mini > .switch-button:after { display: block; content: ' '; position: absolute; background-image: url(img/sprites.png); } /* Prevent animation when dragging */ .dragging > .switch-on, .dragging > .switch-on > span, .dragging > .switch-off, .dragging > .switch-off > span, .dragging > .switch-button { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } /* Active style */ .switch.checked > .switch-button { left: 55px; } .wide.checked > .switch-button { left: 85px; } .wider.checked > .switch-button { left: 115px; } .reversed-switches .switch.checked > .switch-button { left: auto; right: 55px; } .reversed-switches .wide.checked > .switch-button { right: 85px; } .reversed-switches .wider.checked > .switch-button { right: 115px; } .checked > .switch-on { right: 36px; } .checked > .switch-on > span { margin-left: 0; } .ie7 .checked > .switch-on > span { margin-left: -4px; } .reversed-switches .checked > .switch-on { left: 36px; right: 0; margin-left: 0; } .checked > .switch-off { left: 91px; } .wide.checked > .switch-off { left: 121px; } .wider.checked > .switch-off { left: 151px; } .reversed-switches .checked > .switch-off { left: 0; right: 91px; } .reversed-switches .wide.checked > .switch-off { right: 121px; } .reversed-switches .wider.checked > .switch-off { right: 151px; } .reversed-switches .checked > .switch-off > span { margin-left: -55px; } .reversed-switches .wide.checked > .switch-off > span { margin-left: -85px; } .reversed-switches .wider.checked > .switch-off > span { margin-left: -115px; } .switch.medium { width: 70px; height: 24px; *vertical-align: -7px; } .switch.medium.wide { width: 100px; } .switch.medium.wider { width: 130px; } p > .switch.medium { margin-top: -5px; margin-bottom: -3px; } .button-height .switch.medium { margin-top: -2px; margin-bottom: 2px; } .medium > .switch-on, .medium > .switch-off { line-height: 23px; font-size: 14px; font-weight: bold; } .no-boxshadow .medium > .switch-on, .no-boxshadow .medium > .switch-off { line-height: 20px; } .medium > .switch-on { right: 66px; } .medium.wide > .switch-on { right: 96px; } .medium.wider > .switch-on { right: 126px; } .reversed-switches .medium > .switch-on { left: 66px; right: 0; } .reversed-switches .medium.wide > .switch-on { left: 96px; } .reversed-switches .medium.wider > .switch-on { left: 126px; } .medium > .switch-off { left: 26px; } .reversed-switches .medium > .switch-off { left: 0; right: 26px; } .medium > .switch-on > span, .medium > .switch-off > span { width: 40px; } .medium.wide > .switch-on > span, .medium.wide > .switch-off > span { width: 70px; } .medium.wider > .switch-on > span, .medium.wider > .switch-off > span { width: 100px; } .medium > .switch-on > span { margin-left: -40px; } .medium.wide > .switch-on > span { margin-left: -70px; } .medium.wider > .switch-on > span { margin-left: -100px; } .reversed-switches .medium > .switch-on > span { margin-left: 0; } .medium > .switch-button { width: 28px; } .medium > .switch-button:after { top: 50%; left: 50%; width: 7px; height: 8px; margin: -3px 0 0 -3px; background-position: -120px 0; } .black-inputs .medium > .switch-button:after, .black-input.medium > .switch-button:after { background-position: -127px 0; margin-top: -4px; } .checked.medium > .switch-button { left: 40px; } .medium.checked.wide > .switch-button { left: 70px; } .medium.checked.wider > .switch-button { left: 100px; } .reversed-switches .switch.checked.medium > .switch-button { left: auto; right: 40px; } .reversed-switches .medium.checked.wide > .switch-button { right: 70px; } .reversed-switches .medium.checked.wider > .switch-button { right: 100px; } .checked.medium > .switch-on { right: 26px; } .checked.medium > .switch-on > span { margin-left: 0; } .ie7 .checked > .switch-on > span { margin-left: -4px; } .reversed-switches .checked.medium > .switch-on { left: 26px; right: 0; margin-left: 0; } .checked.medium > .switch-off { left: 66px; } .medium.checked.wide > .switch-off { left: 96px; } .medium.checked.wider > .switch-off { left: 126px; } .reversed-switches .checked.medium > .switch-off { left: 0; right: 66px; } .reversed-switches .medium.checked.wide > .switch-off { right: 96px; } .reversed-switches .medium.checked.wider > .switch-off { right: 126px; } .reversed-switches .medium.checked > .switch-off > span { margin-left: -40px; } .reversed-switches .medium.checked > .switch-off > span { margin-left: -70px; } .reversed-switches .medium.checked > .switch-off > span { margin-left: -100px; } .switch.tiny, .switch.mini { width: 35px; height: 15px; } .switch.tiny { overflow: visible; margin-left: 2px; margin-right: 2px; } p > .switch.tiny, p > .switch.mini, .button-height .switch.tiny, .button-height .switch.mini { margin-top: -1px; margin-bottom: 1px; } .tiny > .switch-on, .tiny > .switch-off, .mini > .switch-on, .mini > .switch-off { line-height: 15px; } .tiny > .switch-on, .mini > .switch-on { right: 27px; -webkit-border-top-left-radius: 8px; -webkit-border-bottom-left-radius: 8px; -moz-border-radius: 8px 0 0 8px; border-radius: 8px 0 0 8px; } .reversed-switches .tiny > .switch-on, .reversed-switches .mini > .switch-on { left: 27px; right: 0; -webkit-border-radius: 0; -webkit-border-top-right-radius: 8px; -webkit-border-bottom-right-radius: 8px; -moz-border-radius: 0 8px 8px 0; border-radius: 0 8px 8px 0; } .tiny > .switch-off, .mini > .switch-off { left: 8px; -webkit-border-top-right-radius: 8px; -webkit-border-bottom-right-radius: 8px; -moz-border-radius: 0 8px 8px 0; border-radius: 0 8px 8px 0; } .reversed-switches .tiny > .switch-off, .reversed-switches .mini > .switch-off { left: 0; right: 8px; -webkit-border-radius: 0; -webkit-border-top-left-radius: 8px; -webkit-border-bottom-left-radius: 8px; -moz-border-radius: 8px 0 0 8px; border-radius: 8px 0 0 8px; } .tiny > .switch-on > span, .tiny > .switch-off > span, .mini > .switch-on > span, .mini > .switch-off > span { display: none; } .tiny > .switch-button { top: -2px; left: -2px; bottom: -2px; width: 17px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: inset 0 1px 0 white, 0 1px 3px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 0 white, 0 1px 3px rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 0 white, 0 1px 3px rgba(0, 0, 0, 0.5); } .black-inputs .tiny > .switch-button, .black-input.tiny > .switch-button { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 3px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 3px rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 3px rgba(0, 0, 0, 0.5); } .reversed-switches .tiny > .switch-button { left: auto; right: -2px; } .tiny > .switch-button:after { top: 6px; left: 6px; width: 5px; height: 7px; background-position: -134px 0; } .black-inputs .tiny > .switch-button:after, .black-input.tiny > .switch-button:after { background-position: -139px 0; } .mini > .switch-button { width: 13px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } .mini > .switch-button:after { top: 4px; left: 4px; width: 5px; height: 6px; background-position: -144px 0; } .black-inputs .mini > .switch-button:after, .black-input.mini > .switch-button:after { background-position: -149px 0; } .switch.checked.tiny > .switch-button { left: 17px; } .reversed-switches .switch.checked.tiny > .switch-button { left: auto; right: 17px; } .switch.checked.mini > .switch-button { left: 20px; } .reversed-switches .switch.checked.mini > .switch-button { left: auto; right: 20px; } .checked.tiny > .switch-on, .checked.mini > .switch-on { right: 8px; } .reversed-switches .checked.tiny > .switch-on, .reversed-switches .checked.mini > .switch-on { left: 8px; right: 0; } .checked.tiny > .switch-off, .checked.mini > .switch-off { left: 27px; } .reversed-switches .checked.tiny > .switch-off, .reversed-switches .checked.mini > .switch-off { left: 0; right: 27px; } .switch.disabled, .disabled .switch, .switch.disabled, .disabled .switch { cursor: default; } .disabled .switch-on, .disabled .switch-off { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; border-width: 1px; border-style: solid; height: 28px; line-height: 28px; } .no-boxshadow .disabled .switch-on, .no-boxshadow .disabled .switch-off { line-height: 26px; } .medium.disabled > .switch-on, .disabled .medium > .switch-on, .medium.disabled > .switch-off, .disabled .medium > .switch-off { height: 22px; line-height: 20px; } .medium.disabled > .switch-on > span, .disabled .medium > .switch-on > span, .medium.disabled > .switch-off > span, .disabled .medium > .switch-off > span { width: 38px; } .tiny.disabled > .switch-on, .disabled .tiny > .switch-on, .tiny.disabled > .switch-off, .disabled .tiny > .switch-off, .mini.disabled > .switch-on, .disabled .mini > .switch-on, .mini.disabled > .switch-off, .disabled .mini > .switch-off { height: 13px; line-height: 13px; } .disabled .switch-button { -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; } .disabled .switch-button:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -khtml-opacity: 0.5; -moz-opacity: 0.5; opacity: 0.5; } html { min-height: 100%; } body { } form { margin-bottom: var(--gap4); } input:-webkit-autofill { color: #fff !important; } ::-webkit-input-placeholder { color: #777; } input:-moz-placeholder { color: #777; } :root { --blue-100:#E8ECF4; --blue-200:#DBE5F9; --blue-300:#CCDDF6; --blue-400:#BBD4FF; --blue-500:#67AAF9; --blue-600:#2267B8; --blue-700:#0F4A9A; --blue-800:#092A56; --blue-900:#041A38; --green-100:#E0F4EE; --green-200:#CDF5E8; --green-300:#ACEBD5; --green-400:#8FDBC0; --green-500:#62BC9C; --green-600:#478A72; --green-700:#2F5755; --green-800:#23373E; --green-900:#1D2B30; --negative:#fff; --gray-100:#F8F8FB; --gray-200:#EAEDEF; --gray-300:#D9DADF; --gray-400:#BCBDC2; --gray-500:#8E909A; --gray-600:#7C7F8D; --gray-700:#5E6278; --gray-800:#36373A; --gray-800:#242528; --gray-900:#191A1E; --eclipse: #101010; --shortcut-active-color: #969ba2; --link-color: var(--blue-600); --link-color-hover: var(--blue-500); --danger: #CC1233; --danger-100: #FF3A5E; --danger-200: #FC9AAC; --danger-bg: #fbdbe1; --warning: #B77A03; --warning-100: #FFA800; --warning-200: #FFDD9C; --success: #3BAC4D; --success-100: #74E586; --success-200: #AAFEB8; --success-bg: #ccf4bd; --blue-main: var(--blue-700); --green-main: var(--green-500); --navbar-height: 70px; --aside-width: 265px; --aside-after-position: var(--aside-width); --aside-tab-width: 265px; --shadow-100: 0px 10px 30px rgba(34, 85, 82, 0.05); --shadow-200: 0px 4px 30px rgba(34, 36, 85, 0.07); --shodow-300: 0 0 50px rgba(82, 63, 105, 0.15); --shadow-inset-100: 0px 20px 30px -33px rgba(34, 36, 85, 0.3) inset, 0px -20px 30px -33px rgba(34, 36, 85, 0.3) inset; --gap1: 4px; --gap2: 8px; --gap3: 12px; --gap4: 16px; --gap5: 20px; --gap6: 24px; --gap7: 28px; --gap8: 32px; --gap9: 36px; --aside-bg: #323B47; --p: 1rem; --h1: 3.2rem; --h2: 2.8rem; --h3: 2.4rem; --h4: 1.8rem; --h5: 1.4rem; --h6: 1.2rem; --small: 0.9rem; --caption: 0.8rem; --btn-primary-bg:var(--blue-700); --btn-primary-bg-hover: var(--blue-600); } a { color: var(--link-color); } a:hover { color: var(--link-color-hover); } .login__body { margin: 0; background: url('images/loginbg.jpg') top left; background-size: cover; background-attachment: fixed; background-repeat: no-repeat; } .login__body.dialog-is--open { overflow: hidden; } .login__wrapper { display: flex; align-items: center; position: relative; z-index: 2; } .company__logo { flex-grow: 2; justify-self: center; margin: -60px 0 0; text-align: center; } .company__slogan { color: #fff; font-size: var(--h6); font-weight: 300; margin: 0; } .company__logo svg { max-width: 400px; width: 100%; } .message { --bg: var(--gray-200); --c: var(--gray-700); --b: var(--gray-700); box-shadow: initial; border-radius: 0; border: 0; border-left: 4px solid var(--b); background: var(--bg); color: var(--c); margin: 0 0 var(--gap2); padding: var(--gap2); } .message .close { padding: 0 4px; } .message .stripes { display: none; } .message .block-arrow { display: none; } .message.error-alert { --bg: var(--danger-bg); --c: var(--danger); --b: var(--danger); } .message.success-alert { --bg: var(--success-bg); --c: var(--success); --b: var(--success); } .message.info-alert { --bg: var(--blue-300); --c: var(--blue-700); --b: var(--blue-700); } .login__body * { box-sizing: border-box; } .login__title { color: var(--gray-700); text-align: left; font-weight: 900; font-size: var(--h6); text-shadow: inherit; margin: var(--gap4) 0 var(--gap2); } .bt { --bg: var(--blue-600); --color: var(--blue-400); display: inline-block; line-height: 1.5; font-size: var(--p); font-weight: 700; padding: var(--gap2) var(--gap4); border: 0; border-radius: 4px; transition: all 0.1s ease; text-shadow: inherit; min-width: 40px; text-align: center; background: var(--bg); color: var(--color); transition: all .1s ease; } .bt > span { display: inline-block; vertical-align: middle; margin-right: var(--gap2); } .bt:hover{ cursor: pointer; } .bt:disabled { opacity: 0.5; } .bt.bt-primary { --bg: var(--btn-primary-bg); --color: white; } .bt.bt-none { --bg: transparent; --color: var(--btn-primary-bg); } .bt.bt-block { display: block; width: 100%; } .bt.bt-primary:hover { --bg: var(--btn-primary-bg-hover); } .bt.bt-small { font-size: var(--small); padding: var(--gap1) var(--gap3); } .bt.bt-outline { border: 1px solid var(--bg); color: var(--bg); background: none; } .bt.bt-outline :hover { background: var(--bg); color: var(--color); } .bt.bt-cancel { --bg: var(--gray-600); --color: white; } .bt.bt-cancel:hover { --bg: var(--gray-500); } .login__container { position: relative; background: white; border-radius: 40px 0px 0px 0px; box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.19); padding: 48px 96px; min-height: 100vh; margin-left: auto; display: flex; align-items: center; max-width: 480px; width: 100%; } .login__content { width: 100%; } .login__logo > svg { display: block; margin: 0 auto var(--gap8); max-width: 140px; } .form-group { margin-bottom: var(--gap4); transition: all 0.2s ease; border-radius: 6px; } .form-input { background: var(--gray-200); border: 0; border-radius: 6px; font-size: var(--small); padding: var(--gap3) var(--gap4); margin: 0; width: 100%; } .form-input::placeholder { color: var(--gray-500); font-weight: 300; } .input-group { display: flex; width: 100%; align-items: stretch; } .form-group:has(.form-input:focus) { box-shadow: 0 0 0 2px var(--blue-400); } .input-group__addon { align-items: center; background: var(--gray-200); display: flex; padding: 0 var(--gap2) 0 var(--gap4); } .input-group__addon > span { color: var(--gray-700); font-size: var(--p); position: relative; z-index: 2; width: 16px; text-align: center; } .input-group :only-child { border-radius: 6px; } .input-group :first-child:not(:only-child) { border-radius: 6px 0 0 6px; } .input-group :not(:only-child):not(:first-child):not(:last-child) { border-radius: 0; } .input-group :last-child:not(:only-child):not(:first-child) { border-radius: 0 6px 6px 0; } .toggle-password { cursor: pointer; } .form-label { color: var(--gray-600); display: inline-block; margin-bottom: var(--gap1); font-size: var(--p); font-weight: 700; text-align: left; } .form-label-group { display: flex; justify-content: space-between; } .form-checkbox { margin-bottom: var(--gap4); } .checkbox-label { cursor: pointer; } .checkbox-label + a { font-weight: 700; cursor: pointer; } .login__forgot-pass { text-align: center; margin: var(--gap2) 0 var(--gap8); } ::-ms-reveal { display: none } .icon-eye { position: relative; } .icon-eye.-not:after { content: ''; display: block; position: absolute; width: 17px; height: 1px; background: var(--gray-700); box-shadow: 0 1px 0 var(--gray-200); transform: rotate(45deg) translate(-6px, -6px); } .login__tab { display: none; } .login__tab.is--active { display: block; } .login__dialog { background: white; border-radius: 6px; display: flex; flex-direction: column; margin: 0 auto; position: relative; max-width: 700px; width: 100%; z-index: 100; transition: all 0.3s ease; max-height: 90vh; } .login-dialog__backdrop { align-items: center; background: rgba(0,0,0,0.4); content: ''; border: 0; position: fixed; overflow: auto; opacity: 0; height: 100vh; display: none; top: 0; left: 0; bottom: 0; right: 0; z-index: 200; width: 100vw; } .login-dialog__backdrop.is--active { opacity: 1; display: flex; animation: openBackdrop 0.25s ease forwards; } @keyframes openBackdrop { 0% {display: none; opacity: 0} 100% {display: flex; opacity: 1} } .login-dialog__header { border-bottom: 1px solid var(--gray-300); padding: var(--gap6) var(--gap8); display: flex; justify-content: space-between; align-items: center; } .login-dialog__footer { border-top: 1px solid var(--gray-300); padding: var(--gap4) var(--gap8); gap: var(--gap2); display: flex; justify-content: flex-end; } .login-dialog__content { max-height: 25rem; flex-grow: 2; overflow-y: auto; margin: var(--gap4) var(--gap8); } .login-tab__back { background: none; border: 0; border-radius: 100px; cursor: pointer; color: var(--link-color); display: inline-block; font-size: var(--h4); padding: var(--gap2) var(--gap4); transition: all 0.2s ease; } .login-tab__back:hover { background: var(--gray-200); } .login__company-title { margin: var(--gap2) 0 0; text-align: center; } .checkbox-label a{ color: var(--link-color); cursor: pointer; font-weight: 700; } .is--loading .login__forgot-pass { visibility: hidden; } .company__logo { padding: var(--gap4); } #form-switch { display: none; } .dialog-close { background: none; border: 0; cursor: pointer; height: 24px; opacity: 0.3; padding: 0; position: relative; transition: all .1s ease; width: 24px; } .dialog-close:hover { opacity: 1; } .dialog-close:before, .dialog-close:after { position: absolute; left: 12px; content: ' '; height: 24px; top: 0; width: 2px; background-color: var(--gray-600); } .dialog-close:before { transform: rotate(45deg); } .dialog-close:after { transform: rotate(-45deg); } @media all and (max-width: 992px) { .login__wrapper { flex-direction: column; min-height: 100vh; } .company__logo { order: 2; } .login__container { margin: var(--gap8) auto; padding: var(--gap8); border-radius: 6px; min-height: auto; order: 1; position: relative; } .company__logo svg { max-width: 200px; height: 200px; } .company__slogan { font-size: var(--small); lin-height: 1.5; } } .app__ra { position: absolute; left: 65px; top: 10px; width: 100px; height: 100px; } @media (max-width: 992px) { .app__ra { left: 21px; } } .app__ra .cls-1 { fill: #292920; } .app__ra .cls-2 { fill: #941914; } .app__ra .cls-3 { fill: #fff; } .app__ra .cls-4 { fill: #90b823; } .app__ra .cls-5 { fill: #646460; } .app__ra .cls-6 { fill: #681412; } .app__ra .cls-7 { fill: #007636; stroke: #fff; stroke-miterlimit: 10; stroke-width: 3.02px; } .app__ra .cls-8 { fill: #88b825;} .app__ra .cls-9 { fill: #b7ce3f; } .app__seals { display: flex; place-items: center; gap: var(--gap8); justify-content: center; } .gptw-seal { width: 60px; height: 100px; top: 0; right:66px; position: absolute; } @media all and (max-width: 992px){ .gptw-seal { top: 0px; right: 21px; } } .login__iso { display: block; margin: 0 auto; width: 88px; } @media only all and (min-width: 480px) { /* Class used to determine which media queries are on */ #mediaquery-checker { width: 20px; } /* Columns */ /* These styles define the columns size. They must be redefined for each responsive size */ .column, .one-column { width: 6.0833%; } .two-columns { width: 14.4167%; } .three-columns { width: 22.75%; } .four-columns { width: 31.0833%; } .five-columns { width: 39.4167%; } .six-columns { width: 47.75%; } .seven-columns { width: 56.0833%; } .eight-columns { width: 64.4167%; } .nine-columns { width: 72.72%; } .ten-columns { width: 81.0833%; } .eleven-columns { width: 89.4167%; } .twelve-columns { width: 97.75%; } .one-column-tablet { width: 6.0833%; } .two-columns-tablet { width: 14.4167%; } .three-columns-tablet { width: 22.75%; } .four-columns-tablet { width: 31.0833%; } .five-columns-tablet { width: 39.4167%; } .six-columns-tablet { width: 47.75%; } .seven-columns-tablet { width: 56.0833%; } .eight-columns-tablet { width: 64.4167%; } .nine-columns-tablet { width: 72.72%; } .ten-columns-tablet { width: 81.0833%; } .eleven-columns-tablet { width: 89.4167%; } .twelve-columns-tablet { width: 97.75%; } .one-column-mobile { width: 6.0833%; } .two-columns-mobile { width: 14.4167%; } .three-columns-mobile { width: 22.75%; } .four-columns-mobile { width: 31.0833%; } .five-columns-mobile { width: 39.4167%; } .six-columns-mobile { width: 47.75%; } .seven-columns-mobile { width: 56.0833%; } .eight-columns-mobile { width: 64.4167%; } .nine-columns-mobile { width: 72.72%; } .ten-columns-mobile { width: 81.0833%; } .eleven-columns-mobile { width: 89.4167%; } .twelve-columns-mobile { width: 97.75%; } .one-column-mobile-landscape { width: 6.0833%; } .two-columns-mobile-landscape { width: 14.4167%; } .three-columns-mobile-landscape { width: 22.75%; } .four-columns-mobile-landscape { width: 31.0833%; } .five-columns-mobile-landscape { width: 39.4167%; } .six-columns-mobile-landscape { width: 47.75%; } .seven-columns-mobile-landscape { width: 56.0833%; } .eight-columns-mobile-landscape { width: 64.4167%; } .nine-columns-mobile-landscape { width: 72.72%; } .ten-columns-mobile-landscape { width: 81.0833%; } .eleven-columns-mobile-landscape { width: 89.4167%; } .twelve-columns-mobile-landscape { width: 97.75%; } /* Line breaks to ensure correct float */ .new-row-mobile-portrait { clear: none; } .new-row-mobile-landscape { clear: left; } } @media only all and (min-width: 768px) { /* Class used to determine which media queries are on */ #mediaquery-checker { width: 30px; } /* Contextual elements */ .hidden-on-mobile, .only-on-tablet { display: block; } .hidden-on-tablet, .only-on-mobile { display: none; } /* Columns */ /* These styles define the columns size. They must be redefined for each responsive size */ .column, .one-column { width: 6.0833%; } .two-columns { width: 14.4167%; } .three-columns { width: 22.75%; } .four-columns { width: 31.0833%; } .five-columns { width: 39.4167%; } .six-columns { width: 47.75%; } .seven-columns { width: 56.0833%; } .eight-columns { width: 64.4167%; } .nine-columns { width: 72.72%; } .ten-columns { width: 81.0833%; } .eleven-columns { width: 89.4167%; } .twelve-columns { width: 97.75%; } .one-column-tablet { width: 6.0833%; } .two-columns-tablet { width: 14.4167%; } .three-columns-tablet { width: 22.75%; } .four-columns-tablet { width: 31.0833%; } .five-columns-tablet { width: 39.4167%; } .six-columns-tablet { width: 47.75%; } .seven-columns-tablet { width: 56.0833%; } .eight-columns-tablet { width: 64.4167%; } .nine-columns-tablet { width: 72.72%; } .ten-columns-tablet { width: 81.0833%; } .eleven-columns-tablet { width: 89.4167%; } .twelve-columns-tablet { width: 97.75%; } /* Line breaks to ensure correct float */ .new-row-mobile, .new-row-mobile-landscape { clear: none; } .new-row-tablet { clear: left; } /* Fixed columns */ .left-column-200px .left-column { float: left; width: 200px; margin-bottom: 0; } .left-column-200px .right-column { margin-left: 220px; } .right-column-200px .left-column { margin-right: 220px; } .right-column-200px .right-column { float: right; width: 200px; margin-bottom: 0; } .right-column-100px .left-column { margin-right: 120px; } .right-column-100px .right-column { float: right; width: 100px; margin-bottom: 0; } .left-column-100px .left-column { float: left; width: 100px; margin-bottom: 0; } .left-column-100px .right-column { margin-left: 120px; } .right-column-100px .left-column { margin-right: 120px; } .right-column-100px .right-column { float: right; width: 100px; margin-bottom: 0; } /* Content panels */ .content-panel { overflow: visible; padding-left: 250px; } .panel-navigation { position: absolute; top: 0; left: 0; bottom: 0; width: 249px; border-right: 1px solid #cccccc; } /* Styles when js is enabled */ .enabled-panels > .panel-navigation, .enabled-panels.show-panel-content > .panel-navigation { left: 0; right: auto; } .enabled-panels > .panel-content, .enabled-panels.show-panel-content > .panel-content { margin-left: 0; } .panel-content > .back { display: none; } /* Typography */ /*h1 { line-height: 48px; font-size: 40px; } h2 { line-height: 38px; font-size: 32px; }*/ .definition.inline { padding-left: 200px; } .definition.inline > dt { float: left; margin-left: -200px; width: 180px; margin-bottom: 0; } .definition.inline > dd { margin-bottom: 12px; } .definition.inline > dd:last-child { margin-bottom: 0; } #main { margin-top: 57px; } .main-version { display: block; } /*.with-shortcuts .logo-header { left: 10px; }*/ .animate-kick { animation-name: animate-kick; animation-timing-function: cubic-bezier(0.280, 0.840, 0.420, 1); } /* .container { width: 200px; height: 100%; margin: 0 auto 0; } */ /* 11. Blocs */ .dashboard { border: 1px solid #666666; } /********************************************************/ /* 16. Tabs */ /********************************************************/ /* This wrapper class is required to handle responsive variations */ .standard-tabs, .side-tabs { border: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; overflow: visible; height: auto !important; } .standard-tabs > .tabs, .side-tabs > .tabs { background: none; position: absolute; left: 0; top: 0; overflow: hidden; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .csstransforms .standard-tabs > .tabs, .csstransforms .side-tabs > .tabs { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } /* * Standard tabs */ .standard-tabs { padding-top: 29px; } /* Actual tabs */ .standard-tabs > .tabs { right: 0; width: auto; height: 30px; margin: -5px -5px 0 -5px; padding: 5px 5px 1px 5px; } .standard-tabs > .tabs > li { float: left; padding: 5px 12px 9px; border-left: 1px solid #cccccc; border-top: 0; } .standard-tabs > .tabs > li:first-child { border-left-color: transparent; } .standard-tabs > .tabs > li > a { margin: -5px -12px -9px; padding: 5px 12px 9px; } .standard-tabs > .tabs > li > a:after { display: none; content: ''; } /* IE7 */ .standard-tabs > .tabs > li > a > .with-arrow-after { display: none; } .touchevents .standard-tabs > .tabs > li > a:hover { padding-bottom: 6px; border-bottom: 3px solid #999999; } .touchevents .standard-tabs > .tabs > li.disabled > a:hover { color: #c0c0c0; padding-bottom: 9px; border-bottom: 0; } .standard-tabs > .tabs > li.active, .standard-tabs > .tabs > li.active + li { border-left-color: transparent; } /* IE7 */ .ie7 .standard-tabs > .tabs > li.active, .ie7 .standard-tabs > .tabs > li.active + li { border-left-color: #cccccc; } .ie7 .standard-tabs > .tabs > li.active.last-child { border-right: 1px solid #cccccc; } .standard-tabs > .tabs > li.active > a { margin-left: -13px; margin-right: -13px; padding: 6px 12px 9px; border: 1px solid #cccccc; border-bottom: 0; background: white; color: #0059a0; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25); } .touchevents .standard-tabs > .tabs > li.active > a:hover { padding-bottom: 9px; border-bottom: 0; } /* * Standard tabs at bottom */ .standard-tabs.at-bottom { padding-top: 0; padding-bottom: 29px; } .standard-tabs.at-bottom > .tabs { top: auto; bottom: 0; margin: 0 -5px -5px -5px; padding: 0 5px 5px 5px; } .standard-tabs.at-bottom > .tabs > li { padding: 9px 12px 5px; } .standard-tabs.at-bottom > .tabs > li > a { margin: -9px -12px -5px; padding: 9px 12px 5px; } .touchevents .standard-tabs.at-bottom > .tabs > li > a:hover { padding-bottom: 5px; border-bottom: 0; padding-top: 6px; border-top: 3px solid #999999; } .touchevents .standard-tabs.at-bottom > .tabs > li.disabled > a:hover { padding-top: 9px; border-top: 0; } .standard-tabs.at-bottom > .tabs > li.active > a { margin-left: -13px; margin-right: -13px; padding: 7px 12px 6px; border-bottom: 1px solid #cccccc; border-top: 0; -webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; -webkit-box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.25); box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.25); } .touchevents .standard-tabs.at-bottom > .tabs > li.active > a:hover { padding-bottom: 6px; border-bottom: 1px solid #cccccc; padding-top: 7px; border-top: 0; } .standard-tabs.at-bottom > .tabs-content { -webkit-border-top-left-radius: 6px; -webkit-border-bottom-left-radius: 6px; -moz-border-radius: 6px 6px 6px 0; border-radius: 6px 6px 6px 0; } /* * Side tabs */ .side-tabs { padding-left: 139px; } /* Actual tabs */ .side-tabs > .tabs { width: 140px; margin: -5px 0 -5px -5px; padding: 5px 1px 5px 5px; } .side-tabs > .tabs > li { padding: 11px 7px 11px 11px; /*margem right era 8px 21-11-15*/ border-top: 1px solid #cccccc; } .side-tabs > .tabs > li:first-child { border-top-color: transparent; } .side-tabs > .tabs > li > a { margin: -11px -8px -11px -11px; padding: 11px 8px 11px 11px; } .side-tabs > .tabs > li > a:after { display: none; } /* IE7 */ .side-tabs > .tabs > li > a > .with-arrow-after { display: none; } .touchevents .side-tabs > .tabs > li > a:hover { padding-right: 6px; border-right: 3px solid #999999; } .touchevents .side-tabs > .tabs > li.disabled > a:hover { color: #c0c0c0; padding-right: 9px; border-right: 0; } .side-tabs > .tabs > li.active, .side-tabs > .tabs > li.active + li { border-top-color: transparent; } .side-tabs > .tabs > li.active > a { margin-top: -12px; margin-bottom: -12px; padding: 11px 9px 11px 10px; border: 1px solid #cccccc; border-right: 0; background: white; color: #0059a0; /*-webkit-border-top-left-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px;*/ -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25); } .touchevents .side-tabs > .tabs > li.active > a:hover { padding-right: 9px; border-right: 0; } /* Right side tabs */ .side-tabs.on-right { padding-left: 0; padding-right: 129px; } .side-tabs.on-right > .tabs { left: auto; right: 0; margin: -5px -5px -5px 0; padding: 5px 5px 5px 0; } .side-tabs.on-right > .tabs > li { padding: 11px 11px 11px 9px; } .side-tabs.on-right > .tabs > li > a { margin: -11px -11px -11px -9px; padding: 11px 11px 11px 9px; } .touchevents .side-tabs.on-right > .tabs > li > a:hover { padding-right: 11px; border-right: 0; padding-left: 6px; border-left: 3px solid #999999; } .touchevents .side-tabs.on-right > .tabs > li.disabled > a:hover { padding-right: 11px; padding-left: 9px; border-left: 0; } .side-tabs.on-right > .tabs > li.active > a { margin-top: -12px; margin-bottom: -12px; padding: 11px 11px 10px 9px; border-right: 1px solid #cccccc; border-left: 0; -webkit-border-top-left-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius: 0 5px 5px 0; border-radius: 0 5px 5px 0; } .touchevents .side-tabs.on-right > .tabs > li.active > a:hover { padding-right: 11px; padding-left: 9px; border-right: 1px solid #cccccc; border-left: 0; } .side-tabs.on-right > .tabs-content { -webkit-border-top-left-radius: 6px; -webkit-border-top-right-radius: 0; -moz-border-radius: 6px 0 6px 6px; border-radius: 6px 0 6px 6px; } .tabs-fullheight.on-right > .tabs-content { -webkit-border-bottom-left-radius: 6px; -moz-border-radius-bottomleft: 6px; border-bottom-left-radius: 6px; -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomright: 0; border-bottom-right-radius: 0; } /* Content */ .standard-tabs > .tabs-content, .side-tabs > .tabs-content { position: static; left: auto; right: auto; overflow: visible; width: auto; border: 1px solid #cccccc; border-radius: 0 6px 6px 6px; box-shadow: 0 20px 12px -10px rgba(0, 0, 0, 0.15); } .tabs-fullheight > .tabs-content { -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0; border-bottom-left-radius: 0; } .csstransforms .standard-tabs > .tabs-content, .csstransforms .side-tabs > .tabs-content { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } .standard-tabs > .tabs-content { min-height: auto !important; } /* Back button */ .standard-tabs > .tabs-content > .tabs-back, .side-tabs > .tabs-content > .tabs-back { display: none; } /* When transistions are enabled */ .standard-tabs.tabs-animated, .standard-tabs.tabs-animated > .tabs, .standard-tabs.tabs-animated > .tabs-content, .side-tabs.tabs-animated, .side-tabs.tabs-animated > .tabs, .side-tabs.tabs-animated > .tabs-content { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } /* Recursive tabs */ .with-padding > .standard-tabs.inner-tabs, .with-padding > .side-tabs.inner-tabs { margin: 0; } /* 18. Notifications */ #top-notifications > ul, #bottom-notifications > ul { position: absolute; width: 400px; } #notifications-top-left { top: 0; left: 0; } #notifications-top-center { top: 0; left: 50%; margin-left: -150px !important; } #notifications-top-right { top: 0; right: 0; } #notifications-bottom-left { bottom: 0; left: 0; } #notifications-bottom-center { bottom: 0; left: 50%; margin-left: -150px !important; } #notifications-bottom-right { bottom: 0; right: 0; } .notification { margin: 20px 20px -10px 20px; } #bottom-notifications .notification { margin: -10px 20px 20px 20px; } .notification > .close { margin: -10px -10px 0 0; } .notification > a, .notification > div { padding: 11px 15px; } .notification-icon { margin: 11px 11px 11px 13px; } .notification-icon.outside { float: none; position: absolute; top: 0; right: 100%; margin: 6px 12px 0 0; } #notifications-top-left .notification-icon.outside, #notifications-bottom-left .notification-icon.outside { right: auto; left: 100%; margin: 6px 0 0 12px; } .notification > .block-arrow { display: block; top: 29px; } } @media only all and (min-width: 992px) { #Page-Dados { margin: 30px 25px 50px 30px; } /* Class used to determine which media queries are on */ #mediaquery-checker { width: 40px; } /* Contextual elements */ .hidden-on-tablet, .only-on-desktop { display: block; } .hidden-on-desktop, .only-on-tablet { display: none; } } @media only all and (min-width: 1200px) { /* Class used to determine which media queries are on */ #mediaquery-checker { width: 50px; } /* Columns */ .columns:last-child { margin-bottom: -25px; } .columns > div { margin-bottom: 25px; } /* These styles define the columns size. They must be redefined for each responsive size */ .column, .one-column { width: 6.0833%; } .two-columns { width: 14.4167%; } .three-columns { width: 22.75%; } .four-columns { width: 31.0833%; } .five-columns { width: 39.4167%; } .six-columns { width: 47.75%; } .seven-columns { width: 56.0833%; } .eight-columns { width: 64.4167%; } .nine-columns { width: 72.72%; } .ten-columns { width: 81.0833%; } .eleven-columns { width: 89.4167%; } .twelve-columns { width: 97.75%; } /* Line breaks to ensure correct float */ .new-row-tablet { clear: none; } .new-row-desktop { clear: left; } } @media only all and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5) { /* Class used to determine which media queries are on */ #mediaquery-checker { height: 20px; } /* Hi-res backgrounds */ /*#shortcuts > li > a, #shortcuts > li > span, #shortcuts > li > a:before { background-image: url(img/highres/shortcuts.png); background-size: 136px 560px; }*/ }