/* FONT FACE */
@font-face { font-family:'Din'; src:url('webfonts/din.eot'); src:url('webfonts/din.eot?#iefix') format('embedded-opentype'), url('webfonts/din.woff') format('woff'), url('webfonts/din.woff2') format('woff2'), url('webfonts/din.ttf') format('truetype'), url('webfonts/din.svg#Din') format('svg'); font-weight:normal; font-style:normal }
@font-face { font-family:'DinBold'; src:url('webfonts/din-bold.eot'); src:url('webfonts/din-bold.eot?#iefix') format('embedded-opentype'), url('webfonts/din-bold.woff') format('woff'), url('webfonts/din-bold.woff2') format('woff2'), url('webfonts/din-bold.ttf') format('truetype'), url('webfonts/din-bold.svg#DinBold') format('svg'); font-weight:normal; font-style:normal }
@font-face { font-family:'DinLight'; src:url('webfonts/din-light.eot'); src:url('webfonts/din-light.eot?#iefix') format('embedded-opentype'), url('webfonts/din-light.woff') format('woff'), url('webfonts/din-light.woff2') format('woff2'), url('webfonts/din-light.ttf') format('truetype'), url('webfonts/din-light.svg#DinLight') format('svg'); font-weight:normal; font-style:normal }
@font-face { font-family:'OpenSans'; src:url('webfonts/opensans-regular.eot'); src:url('webfonts/opensans-regular.eot?#iefix') format('embedded-opentype'), url('webfonts/opensans-regular.woff') format('woff'), url('webfonts/opensans-regular.woff2') format('woff2'), url('webfonts/opensans-regular.ttf') format('truetype'), url('webfonts/opensans-regular.svg#OpenSans') format('svg'); font-weight:normal; font-style:normal }
@font-face { font-family:'OpenSansItalic'; src:url('webfonts/opensans-italic.eot'); src:url('webfonts/opensans-italic.eot?#iefix') format('embedded-opentype'), url('webfonts/opensans-italic.woff') format('woff'), url('webfonts/opensans-italic.woff2') format('woff2'), url('webfonts/opensans-italic.ttf') format('truetype'), url('webfonts/opensans-italic.svg#OpenSansitalic') format('svg'); font-weight:normal; font-style:normal }
@font-face { font-family:'OpenSansBold'; src:url('webfonts/opensans-bold.eot'); src:url('webfonts/opensans-bold.eot?#iefix') format('embedded-opentype'), url('webfonts/opensans-bold.woff') format('woff'), url('webfonts/opensans-bold.woff2') format('woff2'), url('webfonts/opensans-bold.ttf') format('truetype'), url('webfonts/opensans-bold.svg#OpenSansbold') format('svg'); font-weight:normal; font-style:normal }
@font-face { font-family:'OpenSansBoldItalic'; src:url('webfonts/opensans-bolditalic.eot'); src:url('webfonts/opensans-bolditalic.eot?#iefix') format('embedded-opentype'), url('webfonts/opensans-bolditalic.woff') format('woff'), url('webfonts/opensans-bolditalic.woff2') format('woff2'), url('webfonts/opensans-bolditalic.ttf') format('truetype'), url('webfonts/opensans-bolditalic.svg#OpenSansBoldItalic') format('svg'); font-weight:normal; font-style:normal }
@font-face { font-family:'OpenSansSemiBold'; src:url('webfonts/opensans-semibold.eot'); src:url('webfonts/opensans-semibold.eot?#iefix') format('embedded-opentype'), url('webfonts/opensans-semibold.woff') format('woff'), url('webfonts/opensans-semibold.woff') format('woff2'), url('webfonts/opensans-semibold.ttf') format('truetype'), url('webfonts/opensans-semibold.svg#OpenSansSemiBold') format('svg'); font-weight:normal; font-style:normal }
@font-face { font-family:'OpenSansSemiBoldItalic'; src:url('webfonts/opensans-semibolditalic.eot'); src:url('webfonts/opensans-semibolditalic.eot?#iefix') format('embedded-opentype'), url('webfonts/opensans-semibolditalic.woff') format('woff'), url('webfonts/opensans-semibolditalic.woff2') format('woff2'), url('webfonts/opensans-semibolditalic.ttf') format('truetype'), url('webfonts/opensans-semibolditalic.svg#OpenSansSemiBoldItalic') format('svg'); font-weight:normal; font-style:normal }


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big,
cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd,
ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details,
embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video 
{ margin:0; padding:0; border:0; outline:none; font-size:100%; font:inherit; vertical-align:baseline; font-family:'OpenSans', sans-serif }
select, input, textarea { outline:none; resize:none }
textarea { overflow:auto }
strong { font-weight:normal; font-family:'OpenSansSemiBold' }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block }
ol, ul { list-style:none }
blockquote, q { quotes:none }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none }
html { background:#000 url(../images/fundo.jpg) no-repeat; background-size:cover; background-position:center center; background-attachment:fixed }
body { -webkit-text-size-adjust: none; }


.pagina { margin: 0 auto; max-width:400px }
@media only screen and (max-device-width: 480px) { .pagina { max-width:none } }
.no-tela { display:none }


/* GLOBAL */
.invisivel { display:none !important }
.clear { clear:both; font-size:1px; height:1px; line-height:1px; display:block }
.m0 { margin:0 !important }
.m20 { margin:20px !important }
.mb0 { margin-bottom:0 !important }
.mb10 { margin-bottom:10px !important }
.mb20 { margin-bottom:20px !important }
.ml0 { margin-left:0 !important }
.ml4 { margin-left:4px !important }
.ml5 { margin-left:5px !important }
.ml10 { margin-left:10px !important }
.ml20 { margin-left:20px !important }
.ml30 { margin-left:30px !important }
.mr0 { margin-right:0 !important }
.mr4 { margin-right:4px !important }
.mr10 { margin-right:10px !important }
.mr20 { margin-right:20px !important }
.mt0 { margin-top:0 !important }
.mt10 { margin-top:10px !important }
.mt20 { margin-top:20px !important }
.mt-20 { margin-top:-20px !important }
.mt30 { margin-top:30px !important }
.p0 { padding:0 !important }
.pb0 { padding-bottom:0 !important }
.pb10 { padding-bottom:10px !important }
.pb20 { padding-bottom:20px !important }
.pl0 { padding-left:0 !important }
.pl10 { padding-left:10px !important }
.pl20 { padding-left:20px !important }
.pr0 { padding-right:0 !important }
.pr10 { padding-right:10px !important }
.pr20 { padding-right:20px !important }
.pt0 { padding-top:0 !important }
.pt10 { padding-top:10px !important }
.f11 { font-size:11px !important }

.verde { color:#27A139 !important; font-family:'OpenSansSemiBold' }
tr.verde td { color:#27A139 !important }
.verde-claro { color:#4cff00 !important; font-family:'OpenSansSemiBold' }
.vermelho { color:#CF2134 !important }
.left { float:left !important }
.right { float:right !important }
.direita { text-align:right !important }
.esquerda { text-align:left !important }
.maiusculo { text-transform:uppercase }
.block { display:block !important; width:auto !important }
.inline-block { display:inline-block !important }
.inline { display:inline !important }
.fonte-grande { font-size:18px !important }

/* FORM ELEMENTS */
.erro { color:#B7333F; font:normal 14px 'OpenSansSemiBoldItalic' }
.ok { color:#27A139; font:normal 14px 'OpenSansSemiBoldItalic' }

a { color:#B72535; font-family:'OpenSansSemiBoldItalic'; font-weight:normal; text-decoration:none }
input[type="button"], button, input[type="image"],  input[type="submit"], a.botao { -webkit-appearance:none; border:none; border-radius:0; text-decoration:none; background:none; display:inline-block; color:#FFF; background-color:#CF2134; font:17px 'OpenSansSemiBold'; text-align:left; padding:7px 15px; text-transform:uppercase }
input[type="checkbox"], input[type="radio"] { -webkit-appearance:none; -moz-appearance:none; appearance:none; border-radius:0; border:1px solid #CCC; border-right:none }
button.btntxt { height:44px; width:57px; border:1px solid #CCC; border-left:none; font:16px/24px 'OpenSans'; padding:0 15px; vertical-align:top; line-height:44px; margin:-1px 0 0 -5px }
button.btntxt img { filter:invert(100%) sepia(0%) saturate(0%) hue-rotate(51deg) brightness(110%) contrast(110%); margin-top:5px; width:30px; height:30px }
label { color:#252C33; font:14px/1 'OpenSansSemiBold'; height:18px; margin-top:20px; display:block }
input[type="button"].azul { background:#00397F; margin-right:10px }
input[type="button"].amarelo { background:#ffd800; color:#555 }
.btnCarregando { }
a.link-tabela { font:normal 14px/1 'OpenSansSemiBold' }
input[type="button"].btntxt { height:44px; width:57px; text-align:center; border:1px solid #CCC; border-left:none; font:34px/44px 'OpenSans'; padding:0 15px; vertical-align:top; margin:-1px 0 0 -5px }

.checkbox, .radio { margin:20px 0 }
.checkbox label, .radio label { margin-bottom:5px }
.checkbox input[type="checkbox"], .radio input[type="radio"] { display:none }
.checkbox input[type="checkbox"] + label, .radio input[type="radio"] + label { background:url("../images/checkbox.svg") no-repeat 0 0; background-size:16px; line-height:16px; margin:0; padding-left:20px; height:16px; display:inline-block }
.radio input[type="radio"] + label, .checkbox input[type="checkbox"] + label { padding-left:20px; margin-right:20px; font:16px/18px 'OpenSansItalic' }
.radio span.mr0 input[type="radio"] + label { margin-right:0 }
.radio span.mr10 input[type="radio"] + label { margin-right:10px }
.radio span.mb10 input[type="radio"] + label { margin-bottom:10px }
.checkbox input[type="checkbox"]:checked + label, .radio input[type="radio"]:checked + label { background:url("../images/checkbox.svg") no-repeat 0 -16px; background-size:16px }
.radio span.aspNetDisabled input[type="radio"] + label { filter:invert(68%) sepia(5%) saturate(15%) hue-rotate(319deg) brightness(88%) contrast(90%) }

.check_background { margin:7px 0; padding:3px 0; width:100%; text-align:left }
.check_background input[type="checkbox"]+label { background-size:15px; height:15px; padding-left:20px; font:normal 14px/15px 'OpenSansSemiBold' }
.check_background input[type="checkbox"]:checked + label { background:url("../images/checkbox.svg") no-repeat 0 -15px; background-size:15px }

#CPH_Conteudo_rblOqueVoceDeseja { display:block }
.radio #CPH_Conteudo_rblOqueVoceDeseja input[type="radio"] + label, 
.radio #CPH_Conteudo_rblOqueVoceDeseja input[type="radio"]:checked + label { margin-bottom:10px }
#CPH_Conteudo_rblMonitorPlugado_0 + label { margin-right:100px }

.radio_br_none span br { display:none }

.select { position:relative; display:inline-block; border:1px solid #CCC; border-radius:0; background:#F0F0F0; height:40px; padding:0 10px }
.select select { width:100%; background:none; outline:none; border:none;
                 appearance:none; -webkit-appearance:none; font:16px/24px 'OpenSansItalic'; color:#000; padding:0; height:40px }
.select::after { content:""; position:absolute; width:16px; height:16px; top:12px; right:5px; background:url("../images/arrow-select.svg") no-repeat center; filter:invert(71%) sepia(6%) saturate(125%) hue-rotate(323deg) brightness(87%) contrast(78%); background-size:10px; z-index:2; pointer-events:none }
.select option { font-weight:normal; color:#000 }
x:-o-prefocus, .select::after { display:none }
@media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) { .select select::-ms-expand { display:none } .select select:focus::-ms-value { background:transparent; color:#000 } }
@-moz-document url-prefix() { .select { overflow:hidden }  .select select { width:100%; width:-moz-calc(100% + 4em); width:calc(100% + em) } }
@media screen and (-webkit-min-device-pixel-ratio:0) { .select { font-size:1px } }
.select select:-moz-focusring { color:transparent; text-shadow:0 0 0 #000 }
select.listbox { padding-top:7px }

::placeholder { color:rgb(0,57,127); text-transform:none !important }
input[type="tel"], input[type="text"], input[type="file"],
input[type="password"], textarea, .listbox { -webkit-appearance:none; border-radius:0; display:inline-block; height:40px; font:16px/24px 'OpenSansItalic'; color:#000; background:#F0F0F0; border:1px solid #CCC; padding:0 10px }
textarea { padding:5px 10px }
textarea.mini { padding:5px; font:14px/16px 'OpenSansItalic' }
span.obs_textbox { color:#CF2134; font:14px/16px 'OpenSansSemiBoldItalic'; display:block; margin:5px 0 0 15px; width:calc(100% - 22px) }

.js .custom-inputfile { width:0.1px; height:0.1px; opacity:0; overflow:hidden; position:absolute; z-index:-1 }
.custom-inputfile + label { width:calc(100% - 78px); text-overflow:ellipsis; text-align:left; white-space:nowrap; margin:0; height:40px; display:inline-block; font:16px/40px 'OpenSansItalic'; color:#000; background:#F0F0F0; border:1px solid #CCC; overflow:hidden; padding:0 10px }
.no-js .custom-inputfile + label { display:none }
.custom-inputfile:focus + label, .custom-inputfile.has-focus + label { background-color:#F0F0F0 }
.custom-inputfile + label * { /* pointer-events:none; */ }
.custom-inputfile + label span { font:16px 'OpenSansItalic'; line-height:34px }
.custom-inputfile + label svg { width:25px; height:31px; padding:4px 15px 7px 15px; border:1px solid #CCC; position:absolute; top:-1px; right:0; background-color:#CF2134; vertical-align:top; fill:#FFF; margin:0 }
.fileupload { position:relative; width:100% }

.listbox { padding:0; position:relative; overflow:auto }
.listbox div, .listbox.semdiv div { position:relative; display:block }
.listbox div label, .listbox.semdiv label { display:block; text-align:left; margin:0; height:auto; padding:3px 5px; font:18px/20px 'OpenSansItalic' }
.listbox div label:after, .listbox div label:before, .listbox.semdiv label:after, .listbox.semdiv label:before { content: "" }
.listbox div input[type="radio"],.listbox.semdiv input[type="radio"]  { display:none; position:absolute; width:100% }
.listbox div input[type="radio"]:checked + label, .listbox.semdiv input[type="radio"]:checked + label { background:#CCC }

.aspNetDisabled, .disabled, input[readonly="readonly"] { color:#999 !important; text-decoration:none !important }

.switch_check { display:inline-block; vertical-align:top; -webkit-box-pack:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-flex:1; -ms-flex:1; flex:1 }
.switch_check div { width:80px; height:44px; position:relative }
.switch_check div input[type="checkbox"] { width:80px; height:44px; margin:-1px -9px 0 0; -webkit-appearance:none; -moz-appearance:none; appearance:none; background:#CF2134; position:relative; outline:0; -webkit-transition:all .2s; transition:all .2s }
.switch_check div input[type="checkbox"]:after { position:absolute; content:""; top:4px; left:4px; width:34px; height:34px; background:#E0E0E0; z-index:2; -webkit-transition:all .35s; transition:all .35s }
.switch_check div img { position:absolute; width:26px; filter:invert(100%); top:37%; -webkit-transform-origin:50% 50%; transform-origin:50% 50%; fill:#fff; -webkit-transition:all .35s; transition:all .35s; z-index:1 }
.switch_check div .yes { left:16%; -webkit-transform:translateX(190%) translateY(-30%) scale(0); transform:translateX(190%) translateY(-30%) scale(0) }
.switch_check div .no { right:5%; -webkit-transform:translateX(0) translateY(-30%) scale(1); transform:translateX(0) translateY(-30%) scale(1) }
.switch_check div input[type="checkbox"]:checked:after { left:calc(100% - 38px) }
.switch_check div input[type="checkbox"]:checked + .yes { -webkit-transform:translateX(0) translateY(-30%) scale(1); transform:translateX(0) translateY(-30%) scale(1) }
.switch_check div input[type="checkbox"]:checked ~ .no { -webkit-transform:translateX(-190%) translateY(-30%) scale(0); transform:translateX(-190%) translateY(-30%) scale(0) }



/* ALERT */
.alert_message { text-align:center; padding:0; margin:0; width:100% }
.alert_message h1 { font:normal 16px/22px 'OpenSansSemiBold'; padding:5px 10px; color:#FFF; background:#999 }
.alert_message p { font-size:18px; padding:20px 10px; line-height:24px }
.alert_message input[type="button"] { margin:0; line-height:24px; width:100%; padding:8px 0; border-top:1px solid #CCC; display:block; color:#CF2134; background:#F0F0F0; font:24px 'OpenSansBold'; text-align:center }
.alert_message input[type="button"]#nao { width:50%; display:inline-block; color:#999 }
.alert_message input[type="button"]#sim { border-left:1px solid #CCC; display:inline-block; width:calc(50% - 1px) }


/* TABLE */
table { text-transform:uppercase; border-spacing:0; border-collapse:collapse; padding:0; margin:0; border:1px solid #84a9cb; width:100% }
table tr th { font:normal 12px/1 'OpenSans'; background:#84a9cb; border-collapse:collapse; vertical-align:bottom; color:#FFF; padding:7px 4px }
table tr td { padding:7px 4px; font:normal 12px 'OpenSans'; vertical-align:middle; border-collapse:collapse; border-top:1px solid #E0E0E0; text-align:center; color:#000 }
table tr:nth-child(2) td { border-top:none }
table tr td:nth-child(even) { background:#EEE }
table tbody td.img0 { font-size:1px }
table tbody td.img0 input, table tbody td.img0 a { padding:0; display:block; margin:0 auto; width:24px; height:24px; font-size:1px; background-color:transparent; background-size:contain; background-repeat:no-repeat }
table tbody td.img0 .excluir { background:url("../images/excluir.svg") no-repeat center; background-size:18px; filter:invert(24%) sepia(44%) saturate(4304%) hue-rotate(337deg) brightness(84%) contrast(100%) }
table tbody td.img0 .editar { background:url("../images/editar.svg") no-repeat center; background-size:18px }
table tbody td.img0 .foto { background:url("../images/foto.svg") no-repeat center; background-size:18px }
table tr.sem-resultados td p { margin:0; font:18px/24px 'OpenSansItalic'; text-transform:none }
table tr.total_ult_linha td { font-weight:bold }

table.padding-maior tr th, table.padding-maior tr td { padding:15px 4px }

div.observacoes { margin:20px 15px 0 15px }
div.observacoes h4 { font:normal 16px 'OpenSans'; background:#6786a3; margin:0; padding:3px 10px; color:#FFF }
div.observacoes div { border:1px solid #6786a3 }
div.observacoes div.centraliza, div.observacoes table { border:none; padding-bottom:0 }
div.observacoes table tbody tr th { display:none }
div.observacoes table tbody tr td { text-align:left; border-bottom:1px solid #E0E0E0 }
div.observacoes table tbody tr:last-child td { border-bottom:none }
div.observacoes table tbody tr td h5 { font:normal 12px 'OpenSansSemiBold'; margin:5px 0 }
div.observacoes table tbody tr td p { margin:0 }
div.observacoes table tbody tr td span { font:normal 12px 'OpenSansSemiBoldItalic'; color:#888; margin:5px 0; display:block }



/* TABLE FILE UPLOAD */
table.gvFileUpload { width:273px; margin-left:0; border:none }
table.gvFileUpload tbody tr td { padding:5px; line-height:13px; background:#00397F; text-align:left; vertical-align:top; color:#FFF; border-bottom:2px solid #FFF }
table.gvFileUpload tbody tr td:nth-child(even) { background:#00397F }
table.gvFileUpload tbody tr td p { margin:0 0 0 5px; font-size:11px }
table.gvFileUpload tbody tr td span { font-size:10px; opacity:0.5; line-height:12px; margin-left:5px; color:#FFF }
table.gvFileUpload tbody tr td.img0 .excluir { background:none; text-align:center; font:normal 10px/21px 'OpenSansBold'; width:21px; margin:2px 5px 0 0; height:21px; color:#FFF; border-radius:50%; background-color:#6786a3; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); background-size:unset; filter:unset }


/* TABLE FILE UPLOAD SD */
table.gvFileUploadSD { width:100%; margin-left:0; border:none }
table.gvFileUploadSD tbody tr td { padding:5px; line-height:13px; background:#27A139; text-align:left; vertical-align:top; color:#FFF; border-bottom:2px solid #FFF }
table.gvFileUploadSD tbody tr td:last-child { text-align:center; width:36px }
table.gvFileUploadSD tbody tr td:nth-child(even) { background:#27A139 }
table.gvFileUploadSD tbody tr td p { margin:0; font-size:11px; line-height:18px; width:calc(100% - 50px) }
table.gvFileUploadSD tbody tr td p.ico_ok { margin:0; width:24px; height:17px; text-align:center; border-radius:50%; background-color:#185b22; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0) }
table.gvFileUploadSD tbody tr td p.ico_ok img { width:14px; height:14px; vertical-align:top; margin:2px 0 0 0; filter:invert(100%) sepia(100%) saturate(1%) hue-rotate(45deg) brightness(102%) contrast(101%) }
table.gvFileUploadSD tbody tr td span { font-size:11px; opacity:0.7; line-height:18px; text-align:right; color:#FFF; width:40px }
table.gvFileUploadSD tbody tr td.img0 input.excluir { height:32px; filter:invert(16%) sepia(42%) saturate(3693%) hue-rotate(343deg) brightness(95%) contrast(95%) }



/* TOP BAR */
#top_bar { height:42px; position:fixed; left:0; background:#000; width:100%; z-index:98 }
.pagina #top_bar { left:unset; max-width:400px }
@media only screen and (max-device-width:480px) { #top_bar { max-width:none } }
#top_bar div { margin:2px 1% 0 1% }
#top_bar a, #top_bar span, #top_bar p { color:#FFF; float:right; display:inline-block; margin-top:12px; vertical-align:top; font:normal 13px/1 'OpenSansSemiBold' }
#top_bar a { margin-right:15px }
#top_bar p { margin:11px 4px 0 4px }
#top_bar a.ico_menu { font-size:1px; height:29px; width:42px; padding:7px 0 0 4px; margin:0 -15px 0 0; display:block; float:left; text-align:center }
#top_bar a.ico_menu img { filter:invert(100) brightness(1000); width:22px }
#top_bar span.projeto { float:left; margin-left:15px }
#top_bar .select { border:1px solid #666; background:#000; margin:5px 0 0 15px; height:25px; padding:0 }
#top_bar .select select option { background:#000; color:#FFF }
#top_bar .select select { width:62px; background:none; outline:none; border:none;
                 appearance:none; -webkit-appearance:none; font:13px/25px 'OpenSansSemiBold'; color:#FFF; padding:0 0 0 7px; height:25px }
#top_bar .select::after { width:9px; height:9px; top:8px; right:7px; background-size:9px }


/* LOGO */
#logo { text-align:center; padding-top:30px }
#logo h1 { text-align:center; color:#FFF; font:32px/1 'DinBold'; text-shadow:2px 2px #000; display:block; font-weight:normal }
#logo h1 strong { font:18px/1 'Din'; display:block; font-style:italic; text-shadow:2px 2px #162E45; font-weight:normal }
#logo h1 img  { width:100px; margin-bottom:10px }


/* LOGIN */
section[id*="form_login"] { margin:30px 15px 0 15px }
section[id*="form_login"] h1 { color:#E0E0E0; letter-spacing:-0.4px; font:22px/1 'Din'; text-transform:uppercase; margin-bottom:20px }
section[id*="form_login"] h1 strong { font-family:'DinBold'; font-weight:normal }
section[id*="form_login"] input[type="tel"], section[id*="form_login"] input[type="text"], 
section[id*="form_login"] input[type="password"] { background:#FFF; width:calc(100% - 20px); margin:0 0 25px 0 }
section[id*="form_login"] input[type="text"]:-webkit-autofill::first-line, 
section[id*="form_login"] input[type="tel"]:-webkit-autofill::first-line, 
section[id*="form_login"] input[type="password"]:-webkit-autofill::first-line { font:20px/24px 'OpenSansItalic'; color:#000 }
section[id*="form_login"] .link { font:14px/1 'OpenSansSemiBold'; text-decoration:underline; background:none; display:none; padding:0; text-transform:none; color:#FFF; margin-left:110px }
section[id*="form_login"] a.botao { text-transform:uppercase; font:18px/1 'OpenSans'; padding:10px 24px; margin:0 }
section[id*="form_login"] input.esqueci_senha { float:right; background:none; padding:0; text-transform:none; font:16px/38px 'OpenSansItalic' }


/* MENU*/
.menu { border-top:42px solid transparent; border-left:5px solid transparent; border-right:5px solid transparent }
h2.menu { font:normal 20px 'OpenSansSemiBold'; border:none; letter-spacing:-0.5px; margin:0 0 -30px 0; padding:62px 0 0 10px; color:#FFF }
.menu .square { float:left; position:relative; width:30%; padding-bottom:30%; margin:1.66%; background-color:rgba(128, 128, 128, 0.3); overflow:hidden }
.menu .content { position:absolute; height:90%; overflow:hidden; width:100%; padding:5% 0 }
.menu p { display:table; overflow:hidden; width:100%; height:100%; background-repeat:no-repeat; background-position:center 10%; 
		  background-size:75% 55%; filter:invert(100%) sepia(0%) saturate(0%) hue-rotate(124deg) brightness(101%) contrast(104%) }
.menu a { display:table-cell; width:100%; overflow:hidden; text-align:center; color:#000; vertical-align:middle }
.menu a span { display:block; text-align:center; white-space:nowrap; width:100%; overflow:hidden; height:36%; margin-top:60%; color:#000; font:normal 13px/14px 'OpenSansSemiBold' }

.menu p.ico_abastecimento { background-image:url('../images/abastecimento.svg') }
.menu p.ico_alterarsenha { background-image:url('../images/alterar-senha.svg') }
.menu p.ico_autorizacao-agendamento { background-image:url('../images/autorizacao-agendamento.svg') }
.menu p.ico_controle-equipamentos { background-image:url('../images/controle-equipamentos.svg') }
.menu p.ico_conclusao-trem { background-image:url('../images/conclusao-trem.svg') }
.menu p.ico_consolidacao { background-image:url('../images/consolidacao.svg') }
.menu p.ico_desova-caminhao { background-image:url('../images/desova-caminhao.svg') }
.menu p.ico_desova-cntr { background-image:url('../images/desova-cntr.svg') }
.menu p.ico_enderecamento-cg { background-image:url('../images/enderecamento-cg.svg') }
.menu p.ico_enderecamento-cntr { background-image:url('../images/enderecamento-cntr.svg') }
.menu p.ico_entrada-via-ferrea { background-image:url('../images/entrada-via-ferrea.svg') }
.menu p.ico_gate { background-image:url('../images/gate.svg') }
.menu p.ico_gate-contingencia { background-image:url('../images/gate-contingencia.svg') }
.menu p.ico_gate-saida { background-image:url('../images/gate-saida.svg') }
.menu p.ico_horimetro { background-image:url('../images/horimetro.svg') }
.menu p.ico_inventario { background-image:url('../images/inventario.svg') }
.menu p.ico_liberacao-imo { background-image:url('../images/liberacao-imo.svg') }
.menu p.ico_movimentacao-cntr { background-image:url('../images/movimentacao-cntr.svg') }
.menu p.ico_multitag { background-image:url('../images/multitag.svg') }
.menu p.ico_parada-onibus { background-image:url('../images/parada-onibus.svg') }
.menu p.ico_pesagem-cg { background-image:url('../images/pesagem-cg.svg') }
.menu p.ico_picking { background-image:url('../images/picking.svg') }
.menu p.ico_posicionamento-cg { background-image:url('../images/posicionamento-cg.svg') }
.menu p.ico_posicionamento-cntr { background-image:url('../images/posicionamento-cntr.svg') }
.menu p.ico_reefer { background-image:url('../images/reefer.svg') }
.menu p.ico_registro-entrada-saida { background-image:url('../images/registro-entrada-saida.svg') }
.menu p.ico_romaneio-cg { background-image:url('../images/romaneio-cg.svg') }
.menu p.ico_romaneio-cntr { background-image:url('../images/romaneio-cntr.svg') }
.menu p.ico_romaneio-expresso { background-image:url('../images/romaneio-expresso.svg') }
.menu p.ico_saida-cg { background-image:url('../images/saida-cg.svg') }
.menu p.ico_saida-cg-balsa { background-image:url('../images/saida-cg-balsa.svg') }
.menu p.ico_saida-cg-rodando { background-image:url('../images/saida-cg-rodando.svg') }
.menu p.ico_saida-cg-rodoviario { background-image:url('../images/saida-cg-rodoviario.svg') }
.menu p.ico_saida-cg-trem { background-image:url('../images/saida-cg-trem.svg') }
.menu p.ico_saida-via-ferrea { background-image:url('../images/saida-via-ferrea.svg') }
.menu p.ico_teste { background-image:url('../images/teste.svg') }


/* MÁSCARAS */
.f_3numeros, .f_5numeros, f_7numeros, .f_11numeros, .f_data, .f_datahora, .f_ano, .f_cpf,
.f_cep, .f_ddd, .f_endereco, .f_matricula, .f_tel, .f_cnh, .f_cnpj, .f_placa { }



/* CONTEUDO */
.conteudo { margin:0; background:#FFF; padding-top:42px }
.pagina .conteudo { margin:0 15px }
.conteudo h2 { font:normal 20px 'OpenSans'; letter-spacing:-0.8px; background:#00397F; margin:0; padding:7px 10px; color:#FFF }
.conteudo p { margin:20px 0 }

.centraliza { text-align:center; padding:20px 0 }
.aesquerda { text-align:left; padding:20px 0; margin-left:15px }
.aesquerda button.btntxt { padding:0 13px }

.w100 { width:100% !important }
.w50 { width:50% !important }
.d50_3 { width:calc(50% - 42px) }
.t35a { width:35% }
.t65a { width:calc(65% - 30px) }
.t65b { width:calc(65% - 20px) }

.t45 { width:calc(45% - 12px) }
.t55 { width:calc(55% - 2px) }

.t50 { width:calc(50% - 32px) }
.t50_1 { width:calc(50% - 100px) }
.t50_2 { width:calc(50% - 12px) }
.t70a { width:calc(70% - 42px) }
.t30a { width:calc(30% - 32px) }
.t70b { width:calc(70% - 26px) }

.t37 { width:calc(37% - 10px) }
.t23 { width:calc(23% - 10px) }
.t40 { width:calc(40% - 10px) }

.t70d { width:calc(70% - 8px) }
.t70 { width:70% }
.t30d { width:calc(30% - 12px) }
.t30 { width:30% }
.t80d { width:calc(80% - 8px) }
.t20d { width:calc(20% - 12px) }
.t25_c { width:calc(25% - 12px) }

.t75 { width:75% }
.t25 { width:25% }
.t100 { width:calc(100% - 32px) }
.t100_0 { width:calc(100% - 18px) }
.t100_1 { width:calc(100% - 100px) }
.t100_1b { width:calc(100% - 79px) }
.t100_1c { width:calc(100% - 92px) }
.t100_1d { width:calc(100% - 88px) }
.t100_1e { width:calc(100% - 68px) }
.t100_2 { width:calc(100% - 160px) }
.t100_3 { width:calc(100% - 143px) }
.t100_f { width:calc(100% - 23px) }
.t100_t { width:calc(100% - 42px) }
.t100_t2 { width:calc(100% - 40px) }
.t100_t3 { width:calc(100% - 20px) }
.t100_t4 { width:calc(100% - 185px) }
.t100_t5 { width:calc(100% - 22px) }
.t100_t6 { width:calc(100% - 37px) }
.t100_t7 { width:calc(100% - 28px) }
.t100_t8 { width:calc(100% - 13px) }

.requisitos { padding:15px; border:1px solid #6786a3; margin:20px 10px }
.requisitos p, .requisitos span { font:normal 13px 'OpenSans', sans-serif }
.requisitos p { margin:0 0 10px 0 }
.requisitos span { display:block; line-height:22px; vertical-align:top; transition:0.4s }
.requisitos span img { width:14px; margin:4px 7px 0 0; vertical-align:top; line-height:22px; transition:0.4s }
.requisitos span.ok { color:#009a2d }
.requisitos span.ok img { filter:invert(32%) sepia(94%) saturate(1303%) hue-rotate(117deg) brightness(93%) contrast(104%) }

.dados-imagem { padding:0 0 3px 10px; border:1px solid #6786a3; margin:0 15px 20px 15px; position:relative }
.dados-imagem div.icone { width:61px; height:36px; line-height:31px; vertical-align:middle; background:#6786a3; position:absolute; left:0; top:0 }
.dados-imagem img { width:40px; max-height:24px; vertical-align:middle; filter:invert(100) brightness(1000); margin:0 0 0 10px }
.dados-imagem h3, .dados-imagem h4, .dados-imagem h5, .dados-imagem h6, 
.dados-imagem span, .dados-imagem p { font:14px 'OpenSansSemiBold'; margin:0; padding:3px 0; display:inline-block; vertical-align:top }
.dados-imagem strong { font-family:'OpenSansSemiBold'; font-weight:normal; color:#00397F; padding-right:3px }
.dados-imagem h3 { display:block; border-bottom:1px solid #6786a3; margin:0 0 5px 50px; height:35px; line-height:35px; padding:0 0 0 10px; font-size:18px; color:#CF2134 }
.dados-imagem p, .dados-imagem h5  { width:160px }

.dados-imagem h4, .dados-imagem h6 { width:130px }
.dados-imagem ul { display:block; width:calc(100% - 10px); padding:5px 0 }
.dados-imagem ul li { display:block; width:100%; font:normal 14px 'OpenSansSemiBold'; margin-bottom:10px }
.dados-imagem ul li span { display:block; color:#00397F; font:normal 14px 'OpenSansSemiBold' }
.dados-imagem ul li p { display:inline-block; vertical-align:top; width:auto; margin:0 0 0 20px; padding:0 }
.dados-imagem ul li p:first-child { margin-left:0 }
.dados-imagem .embarque input[type="text"]:read-only { text-align:center; font:28px 'OpenSansBold'; color:#000 !important }
.dados-imagem .embarque input[type="button"] { margin:0; font-size:24px; padding:8px 20px }
.dados-imagem span.obs, .dados-imagem span.obs2 { display:block; background:#E0E0E0; border-top:1px solid #BBB; margin:0 0 0 -10px; padding:3px 10px; font-size:13px }
.dados-imagem span.obs2 { margin:0 0 -3px -10px }
.dados-imagem span.obs strong, .dados-imagem span.obs2 strong { color:#00397F }

.dados-imagem ul.galeria li { display:block; vertical-align:top; margin:20px 0 }
.dados-imagem ul.galeria li:first-child { margin-top:10px }
.dados-imagem ul.galeria li:nth-child(3n) { margin-right:0 }
.dados-imagem ul.galeria li p { margin:0; display:inline-block; height:60px; line-height:60px }
.dados-imagem ul.galeria li p a { display:block; height:60px; line-height:60px }
.dados-imagem ul.galeria li img { width:60px; height:60px; max-height:60px; filter:unset; margin:0; vertical-align:top; border:1px solid #CCC }
.dados-imagem ul.galeria li span { display:inline-block; margin:0 0 0 10px; width:calc(100% - 76px); color:#00397F; font:normal 12px/16px 'OpenSans'; text-transform:uppercase; vertical-align:top }
.dados-imagem ul.galeria li span cite { display:block; margin:0 0 5px 0; color:#00397F; font:normal 12px/12px 'OpenSansItalic'; text-transform:none }
.dados-imagem ul.galeria li span input { background:none; color:#CF2134; font:13px/16px 'OpenSansSemiBoldItalic'; padding:0; text-transform:none }
.dados-imagem p.sem_fotos  { width:100%; text-align:center; margin:10px 0 20px 0; font:18px/24px 'OpenSansItalic' }

#CPH_Conteudo_pnlddlRota { width:calc(55% - 22px) }
.total_passageiros { float:right; text-align:right; width:calc(45% - 15px); margin-right:15px }
.total_passageiros span { font:normal 40px/40px 'OpenSansSemiBold' }
.total_passageiros img { height:40px; margin-right:12px; vertical-align:top }

.dados { border:1px solid #6786a3; margin:20px 15px 0 15px }
.dados h3 { font:normal 16px 'OpenSans'; background:#6786a3; margin:0; padding:3px 10px; color:#FFF }
.dados h5 { font:normal 14px 'OpenSansSemiBold'; text-align:left; margin:-10px 10px 10px 10px; padding:0; color:#00397F }
.dados h5 span { font:normal 14px 'OpenSansSemiBold' }
.dados h6 { font:normal 18px 'OpenSansSemiBold'; color:#CF2134; margin:5px 12px }
.dados ul { display:block; width:calc(100% - 20px); padding:10px }
.dados ul li { display:block; width:100%; font:normal 13px 'OpenSans'; margin-bottom:10px }
.dados ul li span { display:block; color:#00397F; font:normal 13px 'OpenSansBold'; text-transform:uppercase }
.dados ul li p { display:inline-block; vertical-align:top; margin:0 0 0 20px; padding:0 }
.dados ul li p:first-child { margin-left:0 }
.dados ul.qtd { padding:0; width:100%; font-size:1px }
.dados ul.qtd li { display:inline-block; padding:2px 0; text-align:center; border-right:1px solid #FFF; color:#000; width:33%; font:normal 12px 'OpenSans'; background:#bcdfff; margin:0 }
.dados ul.qtd li:last-child { border-right:none }
.dados ul.qtd li span { display:inline; color:#000; font-size:12px; margin-right:3px; text-transform:uppercase }

.dados-tabela { margin:20px 15px 10px 15px }
.dados-tabela h3 { font:normal 16px 'OpenSans'; margin:0 0 10px 0; color:#00397F }


.registro { border:1px solid #6786a3; margin:20px 15px 0 15px }
.registro h3 { font:normal 16px 'OpenSans'; background:#6786a3; margin:0; padding:3px 10px; color:#FFF }
.registro p { color:#000; display:block; font:normal 12px/16px 'OpenSansBold'; margin:10px 0 0 0 }
.registro span { color:#00397F; height:26px; display:block; font:normal 12px/14px 'OpenSansSemiBold'; text-transform:uppercase }
.registro .foto { border:1px solid #6786a3; padding:5px; float:left; width:110px; height:142px; margin:10px }
.registro .matricula { float:left; width:calc(50% - 67px) }
.registro .cracha { float:left; width:calc(50% - 75px) }
.registro .nome { width:calc(100% - 1px) }
.registro .nome span { height:35px }
.registro .gestor { float:left; width:55%; margin-left:10px }
.registro .horario { float:left; width:calc(45% - 20px); margin-left:10px }
.registro .gestor span, .registro .horario span { height:35px }
.registro.ok { border:1px solid #CF2134 }
.registro.nok h3, .registro.nok + div input[type="button"] { background:#CF2134 }
.registro.nok span { color:#CF2134 }
.registro.nok div.erro { background:#CF2134; color:#FFF; font:normal 14px/16px 'OpenSansSemiBold'; padding:7px 10px }
.registro.ok { border:1px solid #00a54e }
.registro.ok h3, .registro.ok + div input[type="button"] { background:#00a54e }
.registro.ok span { color:#00a54e }
div#CPH_Conteudo_pnlRecinto span#CPH_Conteudo_rbRecinto label { width:calc(50% - 42px) }


div h4.antecipar { background:#5581b6; color:#FFF; margin:0; text-transform:uppercase; text-align:right; padding:3px 10px 3px 0; font:normal 14px 'OpenSansSemiBold' }
div.dados-imagem h4.antecipar { background:#DDD; font-size:14px; padding:7px 10px 7px 0; color:#00397F; text-align:center; width:100%; margin:-5px 0 0 -10px }

.dados-imagem input.ver_doc { position:absolute; right:15px; bottom:15px }
.visualizar_pdf { text-align:center }
.visualizar_pdf h3 { text-align:left }
.visualizar_pdf input { margin:20px 0  }

.dados-mini { border:1px solid #6786a3; margin:20px 15px 0 15px }
.dados-mini h3 { font:normal 13px 'OpenSansSemiBold'; background:#6786a3; margin:0; padding:3px 10px; color:#FFF }
.dados-mini ul { display:block; width:calc(100% - 20px); padding:10px }
.dados-mini ul li { display:block; width:100%; font:normal 12px 'OpenSans' }
.dados-mini ul li span { color:#00397F; display:inline-block; font:normal 12px 'OpenSansBold'; text-transform:uppercase; width:48px }
.dados-mini ul li p { display:block; font:normal 12px 'OpenSans'; vertical-align:top; margin:0; padding:0 }

.conteudo p.total { width:auto; margin-left:10px; font-size:14px }
.conteudo p.total span { padding:0; margin-right:30px; font-size:14px }

.operacao { text-align:left; margin:-20px 0 20px 0 }
.operacao .select { height:40px; width:calc(100% - 16px); padding:0 }
.operacao .select select { font:14px/24px 'OpenSansItalic'; height:40px; padding:0 10px }
.operacao .select::after { top:13px }

ul.pilha { width:calc(65% - 2px); display:block; padding:0; margin:0 auto 20px auto; border:1px solid #CCC }
ul.pilha li { display:block; font-size:1px; margin:0; padding:0; border-top:1px solid #CCC; vertical-align:top }
ul.pilha li div.altura { position:relative }
ul.pilha li:first-child { border-top:none }
ul.pilha li a { position:absolute; margin-top:2px; left:22px }
ul.pilha li a img { filter:invert(77%) sepia(62%) saturate(744%) hue-rotate(357deg) brightness(101%) contrast(106%); width:32px }
ul.pilha li p { display:inline-block; text-align:center; width:30px; margin:0; padding:0; vertical-align:top; background:#E0E0E0; height:42px; font:16px/42px 'OpenSansBold';  }
ul.pilha li p.selecionado { background:#E10025; color:#FFF }
ul.pilha li input[type="tel"].txtConteiner { border:none; background:#FFF; width:110px; margin:0; height:42px; vertical-align:top }
ul.pilha li input[type="button"] { position:absolute; border:none; width:56px; text-align:center; padding:0; margin:-1px 0 0 2px; height:42px; line-height:42px; vertical-align:top }
ul.pilha li img.ctnr { width:calc(100% - 31px); max-height:42px; display:block; object-fit:cover; margin:-42px 0 0 31px; background:#333; filter:invert(98%) sepia(7%) saturate(86%) hue-rotate(19deg) brightness(110%) contrast(88%) }
ul.pilha li span { display:block; padding:3px 0 0 0; width:calc(100% - 32px); font-size:1px; text-align:center; position:absolute; top:20px; left:31px }
ul.pilha li span input[type="button"] { margin:-22px 0 0 0; right:-1px }
ul.pilha li span input[type="tel"].txtNovoConteiner { width:calc(100% - 31px); text-align:center; background:none; border:none; height:16px; padding:0; font:14px/16px 'OpenSans'; color:#000 }
ul.pilha li span input[type="tel"].txtNovoConteiner:focus { position:absolute; font:14px/24px 'OpenSansItalic'; top:-20px; text-align:left; left:-1px; width:calc(100% - 19px); padding:0 10px; margin:0; height:42px; vertical-align:top; background:#FFF !important; color:#000 !important }

ul.pilha li span span { height:14px; width:34px; padding:2px 0; font-size:1px; position:initial; top:initial; left:initial; margin:-19px auto 0 auto }
ul.pilha li img.armador { height:14px; margin:0; width:auto; max-width:34px }
ul.pilha li img.ctnr + span { background:#F0F0F0 }
ul.pilha li img.ctnr + span span { background:#F0F0F0 }
ul.pilha li img.ctnr + span img.armador { filter:invert(0%) sepia(0%) saturate(0%) hue-rotate(333deg) brightness(88%) contrast(107%) }

ul.pilha li img.ctnr.amarelo { background:#111; filter:invert(77%) sepia(62%) saturate(744%) hue-rotate(357deg) brightness(101%) contrast(106%) }
ul.pilha li img.ctnr.amarelo + span { background:#ffd800 }
ul.pilha li img.ctnr.amarelo + span span { background:#ffd800 }

ul.pilha li img.ctnr.cinza { filter:invert(89%) sepia(0%) saturate(3926%) hue-rotate(81deg) brightness(91%) contrast(96%) }
ul.pilha li img.ctnr.cinza + span { background:#CCC }
ul.pilha li img.ctnr.cinza + span span { background:#CCC }

ul.pilha li img.ctnr.laranja { background:#CCC; filter:invert(43%) sepia(96%) saturate(2206%) hue-rotate(1deg) brightness(102%) contrast(105%) }
ul.pilha li img.ctnr.laranja + span { background:#ff6a00 }
ul.pilha li img.ctnr.laranja + span span { background:#ff6a00 }

ul.pilha li img.ctnr.azul { filter:invert(18%) sepia(94%) saturate(1412%) hue-rotate(195deg) brightness(90%) contrast(109%) }
ul.pilha li img.ctnr.azul + span { background:#00397F }
ul.pilha li img.ctnr.azul + span input[type="tel"].txtNovoConteiner { color:#FFF }
ul.pilha li img.ctnr.azul + span span { background:#00397F }
ul.pilha li img.ctnr.azul + span img.armador { filter:invert(100%) sepia(0%) saturate(0%) hue-rotate(40deg) brightness(107%) contrast(102%) }

ul.pilha li img.ctnr.vermelho { background:#CCC; filter:invert(22%) sepia(91%) saturate(7239%) hue-rotate(357deg) brightness(89%) contrast(97%) }
ul.pilha li img.ctnr.vermelho + span { background:#E00C0C }
ul.pilha li img.ctnr.vermelho + span input[type="tel"].txtNovoConteiner { color:#FFF }
ul.pilha li img.ctnr.vermelho + span span { background:#E00C0C }
ul.pilha li img.ctnr.vermelho + span img.armador { filter:invert(100%) sepia(0%) saturate(0%) hue-rotate(40deg) brightness(107%) contrast(102%) }

ul.pilha li img.ctnr.rosa { background:#100010; filter:invert(16%) sepia(71%) saturate(3192%) hue-rotate(308deg) brightness(106%) contrast(108%) }
ul.pilha li img.ctnr.rosa + span { background:#BD0F72 }
ul.pilha li img.ctnr.rosa + span input[type="tel"].txtNovoConteiner { color:#FFF }
ul.pilha li img.ctnr.rosa + span span { background:#BD0F72 }
ul.pilha li img.ctnr.rosa + span img.armador { filter:invert(100%) sepia(0%) saturate(0%) hue-rotate(40deg) brightness(107%) contrast(102%) }

ul.pilha li img.ctnr.marrom { filter:invert(20%) sepia(48%) saturate(419%) hue-rotate(350deg) brightness(96%) contrast(97%) }
ul.pilha li img.ctnr.marrom + span { background:#4B3621 }
ul.pilha li img.ctnr.marrom + span input[type="tel"].txtNovoConteiner { color:#FFF }
ul.pilha li img.ctnr.marrom + span span { background:#4B3621 }
ul.pilha li img.ctnr.marrom + span img.armador { filter:invert(100%) sepia(0%) saturate(0%) hue-rotate(40deg) brightness(107%) contrast(102%) }

ul.pilha li img.ctnr.grena { filter:invert(22%) sepia(13%) saturate(6662%) hue-rotate(333deg) brightness(88%) contrast(103%) }
ul.pilha li img.ctnr.grena + span { background:#831D1C }
ul.pilha li img.ctnr.grena + span input[type="tel"].txtNovoConteiner { color:#FFF }
ul.pilha li img.ctnr.grena + span span { background:#831D1C }
ul.pilha li img.ctnr.grena + span img.armador { filter:invert(100%) sepia(0%) saturate(0%) hue-rotate(40deg) brightness(107%) contrast(102%) }

ul.pilha li img.ctnr.verde { background:#666; filter:invert(22%) sepia(99%) saturate(2972%) hue-rotate(144deg) brightness(92%) contrast(101%) }
ul.pilha li img.ctnr.verde + span { background:#008738 }
ul.pilha li img.ctnr.verde + span input[type="tel"].txtNovoConteiner { color:#FFF }
ul.pilha li img.ctnr.verde + span span { background:#008738 }
ul.pilha li img.ctnr.verde + span img.armador { filter:invert(100%) sepia(0%) saturate(0%) hue-rotate(40deg) brightness(107%) contrast(102%) }

.setas { text-align:center; margin:20px auto }
.setas button { margin:0 2%; width:20%; text-align:center; font-size:1px; padding:0 12px; border:none; background:#BBB }
.setas button[disabled="disabled"] { background:#E0E0E0 }
.setas button:first-child { margin-left:0 }
.setas button:last-child { margin-right:0 }
.setas button img { width:90%; height:90%; text-align:center; vertical-align:middle; margin:0 }
.setas button.btnSetaAcima img { transform:rotate(180deg) }
.setas button.btnSetaEsquerda img { transform:rotate(90deg) }
.setas button.btnSetaDireita img { transform:rotate(270deg) }

.abastecimento { position:relative; margin:20px 0 20px 15px }
.abastecimento input[type="tel"], .abastecimento input[type="text"], 
.abastecimento div.select { width:calc(50% - 37px) }
.abastecimento span { font-size:12px; display:block; margin-left:0 }
.abastecimento p { position:absolute; width:50%; display:block; top:0; right:0; text-align:center; display:none }
.abastecimento p img { width:calc(100% - 15px); margin-bottom:15px }
.abastecimento p span { font-size:16px; display:inline; padding:3px 10px; border:1px solid #333; margin:0 }
.abastecimento .checkbox { display:inline-block }
.abastecimento .fileuploadAbast { position:relative; clear:both; margin-left:0; margin-top:20px; text-align:left; width:calc(100% - 15px) }
.abastecimento .fileuploadAbast .custom-inputfile + label { width:calc(100% - 82px) }

.controle_equipamentos { position:relative; margin:20px 0 20px 15px }
.controle_equipamentos input[type="tel"], .controle_equipamentos input[type="text"] { width:calc(50% - 37px) }
.controle_equipamentos span { font-size:12px; display:block; margin-left:0 }
.controle_equipamentos p { position:absolute; width:50%; display:block; top:0; right:0; text-align:center; display:none; max-height:130px }
.controle_equipamentos p img { width:calc(100% - 15px); margin-bottom:15px; max-height:130px }
.controle_equipamentos p span { font-size:16px; display:inline; padding:3px 10px; border:1px solid #333; margin:0 }

.controle_equipamentos #CPH_Conteudo_pnlStatus { display:block; color:#FFF; padding:7px 5px; margin:0 20px 20px 0 }
.controle_equipamentos #CPH_Conteudo_pnlStatus.disponivel { margin-top:130px; margin-bottom:20px; background:#27A139 }
.controle_equipamentos #CPH_Conteudo_pnlStatus.indisponivel { margin-top:130px; background:#CF2134 }
.controle_equipamentos #CPH_Conteudo_pnlStatus span { font:normal 16px/20px 'OpenSansItalic'; text-transform:uppercase }
.controle_equipamentos #CPH_Conteudo_pnlStatus p { font:normal 14px/16px 'OpenSansItalic'; position:unset; margin:0; padding:0; display:block; text-align:left; width:unset }

.controle_equipamentos_estatisticas { margin:20px 0 }
.controle_equipamentos_estatisticas > div { border:1px solid #6786a3; margin:0 10px 20px 10px; display:block; font-size:1px }
.controle_equipamentos_estatisticas > div h4 { font:normal 16px/18px 'OpenSans'; margin:0; background:#6786a3; color:#FFF; padding:3px 10px }
.controle_equipamentos_estatisticas > div p { display:inline-block; vertical-align:top; margin:15px 0; text-align:center; width:50% }
.controle_equipamentos_estatisticas > div p img { width:100%; max-height:70px }
.controle_equipamentos_estatisticas > div div { display:inline-block; vertical-align:top; margin:20px 5px; width:calc(50% - 11px) }

.controle_equipamentos_estatisticas h3 { font:normal 14px/20px 'OpenSans'; display:inline-block; width:calc(70% - 5px); padding-left:5px; color:#6786a3 }
.controle_equipamentos_estatisticas h5 { font:normal 14px/20px 'OpenSans'; display:inline-block; width:calc(70% - 5px); padding-left:5px; color:#27A139 }
.controle_equipamentos_estatisticas h6 { font:normal 14px/20px 'OpenSans'; display:inline-block; width:calc(70% - 5px); padding-left:5px; color:#CF2134 }
.controle_equipamentos_estatisticas h3 + span { font:normal 16px/20px 'OpenSansSemiBold'; display:inline-block; width:calc(30% - 5px); padding-right:5px; color:#6786a3; text-align:right }
.controle_equipamentos_estatisticas h5 + span { font:normal 16px/20px 'OpenSansSemiBold'; display:inline-block; width:calc(30% - 5px); padding-right:5px; color:#27A139; text-align:right }
.controle_equipamentos_estatisticas h6 + span { font:normal 16px/20px 'OpenSansSemiBold'; display:inline-block; width:calc(30% - 5px); padding-right:5px; color:#CF2134; text-align:right }

.controle_equipamentos_tabela { margin:20px 10px 0 10px }
.controle_equipamentos_tabela h3 { font:normal 16px/20px 'OpenSansSemiBold'; margin:0 0 10px 0; color:#CF2134 }

.horimetro { margin:0 0 0 15px }
#CPH_Conteudo_pnlHorimetro .left { width:calc(50% - 37px) }
#CPH_Conteudo_pnlHorimetro .right { width:50% }
.horimetro input[type="tel"], .horimetro input[type="text"] { width:100% }
.horimetro span { font-size:12px; display:block; margin-left:0 }
.horimetro p { width:100%; display:block; text-align:center; display:none }
.horimetro p img { width:calc(100% - 15px); margin-bottom:15px }
.horimetro p span { font-size:16px; display:inline; padding:3px 10px; border:1px solid #333; margin:0 }

.lbComCamera .listbox { margin-right:0 }
.lbComCamera .btnMaisMenos { width:61px; display:inline-block; vertical-align:top }
.lbComCamera .btnMaisMenos button:first-child { margin-bottom:24px }

.status-retorna-verde, .status-retorna-vermelho { background:#27A139; color:#FFF; font:normal 20px/24px 'OpenSansSemiBold'; text-align:center; margin:20px 15px; clear:both; padding:10px }
.status-retorna-vermelho { background:#E10025 }


/* POPUP */
.fundo_popup { background:#FFF }
.popup_janela { padding:36px 10px 0 10px }
.popup_janela h2 { margin:0; position:absolute; left:0; top:0; width:calc(100% - 20px); font:normal 16px/22px 'OpenSansSemiBold'; padding:7px 10px; color:#FFF; background:#999 }
.popup_janela p { margin:10px 0; font:normal 16px/22px 'OpenSans' }


/* CAMERA */
#qr-reader { position:relative }
#qr-reader-results { display:none }
#qr-reader__dashboard_section_csr button { font-size:11px }
#qr-reader__dashboard_section_csr button[disabled] { background:#CCC }
#qr-reader__scan_region video { width:300px !important; height:300px }


/* TIMELINE */
.cd-horizontal-timeline { opacity:0; margin:0 -5px 0 -15px; -webkit-transition:opacity 0.2s; -moz-transition:opacity 0.2s; transition:opacity 0.2s }
.cd-horizontal-timeline.loaded { opacity:1 }
.cd-horizontal-timeline .timeline { position:relative; height:80px; width:100%; margin:0 }
.cd-horizontal-timeline .events-wrapper { position:relative; height:100%; margin:0; overflow:hidden }
.cd-horizontal-timeline .events-wrapper::after, .cd-horizontal-timeline .events-wrapper::before { content:''; position:absolute; z-index:2; top:0; height:100%; width:20px }
.cd-horizontal-timeline .events { position:absolute; z-index:1; left:10px; margin:0 auto; text-align:center; top:39px; height:2px; width:100%; background:#dfdfdf; -webkit-transition:-webkit-transform 0.4s; -moz-transition:-moz-transform 0.4s; transition:transform 0.4s }
.cd-horizontal-timeline .filling-line { position:absolute; z-index:1; left:0; top:0; height:100%; width:100%; padding:0; background-color:#00a54e; -webkit-transform:scaleX(0); -moz-transform:scaleX(0); -ms-transform:scaleX(0); -o-transform:scaleX(0); transform:scaleX(0); -webkit-transform-origin:left center; -moz-transform-origin:left center; -ms-transform-origin:left center; -o-transform-origin:left center; transform-origin:left center; -webkit-transition:-webkit-transform 0.3s; -moz-transition:-moz-transform 0.3s; transition:transform 0.3s }
.cd-horizontal-timeline .events a { position:absolute; bottom:0; z-index:2; text-align:center; padding-bottom:18px; max-width:41px; color:#252C33; font:12px/1 'OpenSansSemiBold'; -webkit-transform:translateZ(0); -moz-transform:translateZ(0); -ms-transform:translateZ(0); -o-transform:translateZ(0); transform:translateZ(0) }
.cd-horizontal-timeline .events-cg a{ max-width:98px }
.cd-horizontal-timeline .events ol li:nth-child(even) a { bottom:-45px }
.cd-horizontal-timeline .events ol li.ti_10 a { text-indent:-10px }
.cd-horizontal-timeline .events a::after { content:''; position:absolute; left:50%; right:auto; -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); transform:translateX(-50%); bottom:-7px; height:15px; width:15px; border-radius:50%; background-color:#FFF; border:2px solid #dfdfdf; -webkit-transition:background-color 3s, border-color 3s; -o-transition:background-color 3s, border-color 3s; -moz-transition:background-color 3s, border-color 3s; transition:background-color 3s, border-color 3s }
.cd-horizontal-timeline .events ol li:nth-child(even) a::after { bottom:38px }
.cd-horizontal-timeline .events a.selected::after { background-color:#E10025; border-color:#E10025; animation:blinker 1.5s linear infinite }
.cd-horizontal-timeline .events a.older-event::after { border-color:#00a54e; background:#00a54e url('../images/check-white.svg') no-repeat center; background-size:14px }
@-webkit-keyframes cd-enter-right {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
  }
}
@-moz-keyframes cd-enter-right {
  0% {
    opacity: 0;
    -moz-transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -moz-transform: translateX(0%);
  }
}
@keyframes cd-enter-right {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
  }
}
@-webkit-keyframes cd-enter-left {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
  }
}
@-moz-keyframes cd-enter-left {
  0% {
    opacity: 0;
    -moz-transform: translateX(-100%);
  }
  100% {
    opacity: 1;
    -moz-transform: translateX(0%);
  }
}
@keyframes cd-enter-left {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
  }
}
@keyframes blinker {
  50% {
        filter:brightness(120%)
  }
}

.tl-onibus .events { top:45px }
.tl-onibus .events a { width:41px; top:-14px }
.tl-onibus .events a span { display:none; position:absolute; left:9px; margin:0 auto; top:-30px; color:#000; z-index:9; padding-top:6px }
.tl-onibus .events a span.esperando { display:inline-block; background:url('../images/esperando.svg') no-repeat 0 0; text-indent:5px; background-size:contain; width:32px; height:17px; line-height:22px }
.tl-onibus .events a strong { position:absolute; display:inline-block; z-index:9; left:0; margin:0 auto; font-size:14px; color:#FFF; top:6px; padding:0; width:41px; text-align:center }
.tl-onibus .events a::after { top:0; height:25px; width:25px }
.tl-onibus .events a.older-event::after { background:#00a54e }

#CPH_Conteudo_pnlddlRota { width:calc(55% - 22px) }

.onibus-esquerda { margin:15px; padding:20px 0; border:1px solid #6786a3; position:relative; float:left; width:calc(70% - 17px); margin-right:0 }
.onibus-esquerda #imgMapaOnibus { width:879px }
.onibus-esquerda div { position:absolute; left:0; top:0 }
.onibus-esquerda div p { margin:0; display:block; font:normal 32px/48px 'OpenSansBold'; color:#FFF; text-align:center; border-radius:50%; background-color:#008738; border:2px solid #008738; animation:blinker 1.3s linear infinite }
.onibus-esquerda div, .onibus-esquerda div p { height:48px; width:48px }
.onibus-esquerda div p.selected { background-color:#00397F; border:2px solid #00397F; animation:blinker 0.7s linear infinite }
.onibus-esquerda div p.aguardando { background-color:#E10025; border:2px solid #E10025; animation:blinker 0.7s linear infinite }
.onibus-esquerda div:nth-child(2) { left:220px; top:180px }
.onibus-esquerda div:nth-child(3) { left:787px; top:57px }
.onibus-esquerda div:nth-child(4) { left:508px; top:45px }
.onibus-esquerda div:nth-child(5) { left:160px; top:200px }
.onibus-esquerda div:nth-child(6) { left:160px; top:380px }
.onibus-esquerda div:nth-child(7) { left:2px; top:222px }
.onibus-esquerda div:nth-child(8) { left:2px; top:5px }
.onibus-esquerda #imgPassageiros { max-height:28px }
.onibus-direita { float:right; width:30%; margin:15px 0 }
.onibus-direita #CPH_Conteudo_lblQtdPassageiros { display:block; padding-right:10px; text-align:center; font:normal 60px/80px 'OpenSansBold' }
.onibus-direita .dados-imagem .embarque { margin-right:10px }
.onibus-direita .dados-imagem .embarque input[type="text"]:read-only { width:calc(100% - 7px); margin-left:5px; border:none; float:left; height:70px; padding:0; text-align:center; font:50px/70px 'OpenSansBold'; color:#000 !important }
.onibus-direita .dados-imagem .embarque input[type="button"] { width:calc(25% - 5px); height:60px; text-align:center; font:32px/60px 'OpenSansSemiBold'; float:left; margin:0 0 0 5px; padding:0; background:#00397F }
.onibus-direita .dados-imagem .embarque input[type="button"]:first-child { width:calc(17% - 5px); margin:0 }
.onibus-direita #CPH_Conteudo_btnConfirmar { padding:0 25px; height:70px; font:normal 36px/70px 'OpenSansSemiBold' }


.motivoRecusa { left:-9999px; position:absolute }
.motivoRecusa div { position:absolute; width:292px; height:182px; margin:-91px 0 0 -146px; background-color:#FFF; top:50%; left:50% }
.motivoRecusa.loading { z-index:999 }


/* LOADING */
.loading { position:fixed; z-index:99999; left:0; top:0; width:100%; height:100%; background:url(../images/fancybox_overlay.png) }
.cssload-wrap { position:fixed; border:1px solid #CCC; width:230px; height:130px; background-color:#FFF; top:50%; left:50%; opacity:0.9; filter:alpha(opacity=90); margin:-65px 0 0 -115px; z-index:999; text-align:center }
.cssload-wrap p { display:block; text-align:center; font:normal 16px/22px 'OpenSansBold', sans-serif; color:#000; padding:25px 0 10px 0 }
.cssload-container { display:inline-block }
.cssload-dots { display:inline-block; position:relative }
.cssload-dots:not(:last-child) { margin-right:12px }
.cssload-dots:before, .cssload-dots:after { content:""; display:inline-block; width:8px; height:8px; border-radius:50%; position:absolute }
.cssload-dots:nth-child(1):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite; 
                                    -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite; 
                                    animation-delay:-1.04s; -o-animation-delay:-1.04s; -ms-animation-delay:-1.04s; -webkit-animation-delay:-1.04s; -moz-animation-delay:-1.04s; background-color:rgb(225,0,37) }
.cssload-dots:nth-child(1):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                   -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                   animation-delay:-1.04s; -o-animation-delay:-1.04s; -ms-animation-delay:-1.04s; -webkit-animation-delay:-1.04s; -moz-animation-delay:-1.04s; background-color:rgba(0,57,127,0.97) }
.cssload-dots:nth-child(2):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite;
                                    -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite;
                                    animation-delay:-2.07s;	-o-animation-delay:-2.07s; -ms-animation-delay:-2.07s; -webkit-animation-delay:-2.07s; -moz-animation-delay:-2.07s; background-color:rgb(225,0,37) }
.cssload-dots:nth-child(2):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                   -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                   animation-delay:-2.07s; -o-animation-delay:-2.07s; -ms-animation-delay:-2.07s; -webkit-animation-delay:-2.07s; -moz-animation-delay:-2.07s; background-color:rgb(0,57,127) }
.cssload-dots:nth-child(3):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite;
                                    -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite;
                                    animation-delay:-3.11s; -o-animation-delay:-3.11s; -ms-animation-delay:-3.11s; -webkit-animation-delay:-3.11s; -moz-animation-delay:-3.11s; background-color:rgb(225,0,37) }
.cssload-dots:nth-child(3):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                   -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                   animation-delay:-3.11s; -o-animation-delay:-3.11s; -ms-animation-delay:-3.11s; -webkit-animation-delay:-3.11s; -moz-animation-delay:-3.11s; background-color:rgb(0,57,127) }
.cssload-dots:nth-child(4):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite;
                                    -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite;
                                    animation-delay:-4.14s; -o-animation-delay:-4.14s; -ms-animation-delay:-4.14s; -webkit-animation-delay:-4.14s; -moz-animation-delay:-4.14s; background-color:rgba(225,0,37,0.98) }
.cssload-dots:nth-child(4):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                   -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                   animation-delay:-4.14s; -o-animation-delay:-4.14s; -ms-animation-delay:-4.14s; -webkit-animation-delay:-4.14s; -moz-animation-delay:-4.14s; background-color:rgb(0,57,127) }
.cssload-dots:nth-child(5):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite;
                                    -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite;
                                    animation-delay:-5.18s; -o-animation-delay:-5.18s; -ms-animation-delay:-5.18s; -webkit-animation-delay:-5.18s; -moz-animation-delay:-5.18s; background-color:rgb(225,0,37) }
.cssload-dots:nth-child(5):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                   -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                   animation-delay:-5.18s; -o-animation-delay:-5.18s; -ms-animation-delay:-5.18s; -webkit-animation-delay:-5.18s; -moz-animation-delay:-5.18s; background-color:rgb(0,57,127) }
.cssload-dots:nth-child(6):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite;
                                    -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite;
                                    animation-delay:-6.21s; -o-animation-delay:-6.21s; -ms-animation-delay:-6.21s; -webkit-animation-delay:-6.21s; -moz-animation-delay:-6.21s; background-color:rgb(225,0,37) }
.cssload-dots:nth-child(6):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                   -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                   animation-delay:-6.21s; -o-animation-delay:-6.21s; -ms-animation-delay:-6.21s; -webkit-animation-delay:-6.21s; -moz-animation-delay:-6.21s; background-color:rgb(0,57,127) }
.cssload-dots:nth-child(7):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite;
                                    -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite;
                                    animation-delay:-7.25s; -o-animation-delay:-7.25s; -ms-animation-delay:-7.25s; -webkit-animation-delay:-7.25s; -moz-animation-delay:-7.25s; background-color:rgba(225,0,37,0.98) }
.cssload-dots:nth-child(7):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                   -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                   animation-delay:-7.25s; -o-animation-delay:-7.25s; -ms-animation-delay:-7.25s; -webkit-animation-delay:-7.25s; -moz-animation-delay:-7.25s; background-color:rgb(0,57,127) }
.cssload-dots:nth-child(8):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite;
                                    -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite;
                                    animation-delay:-8.28s; -o-animation-delay:-8.28s; -ms-animation-delay:-8.28s; -webkit-animation-delay:-8.28s; -moz-animation-delay:-8.28s; background-color:rgb(225,0,37) }
.cssload-dots:nth-child(8):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                   -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                   animation-delay:-8.28s; -o-animation-delay:-8.28s; -ms-animation-delay:-8.28s; -webkit-animation-delay:-8.28s; -moz-animation-delay:-8.28s; background-color:rgb(0,57,127) }
.cssload-dots:nth-child(9):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite;
                                    -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite;
                                    animation-delay:-9.32s; -o-animation-delay:-9.32s; -ms-animation-delay:-9.32s; -webkit-animation-delay:-9.32s; -moz-animation-delay:-9.32s; background-color:rgb(225,0,37) }
.cssload-dots:nth-child(9):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                   -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                   animation-delay:-9.32s; -o-animation-delay:-9.32s; -ms-animation-delay:-9.32s; -webkit-animation-delay:-9.32s; -moz-animation-delay:-9.32s; background-color:rgb(0,57,127) }
.cssload-dots:nth-child(10):before { transform:translateY(-200%); -o-transform:translateY(-200%); -ms-transform:translateY(-200%); -webkit-transform:translateY(-200%); -moz-transform:translateY(-200%); animation:cssload-animBefore 1.15s linear infinite;
                                     -o-animation:cssload-animBefore 1.15s linear infinite; -ms-animation:cssload-animBefore 1.15s linear infinite; -webkit-animation:cssload-animBefore 1.15s linear infinite; -moz-animation:cssload-animBefore 1.15s linear infinite;
                                     animation-delay:-10.35s; -o-animation-delay:-10.35s; -ms-animation-delay:-10.35s; -webkit-animation-delay:-10.35s; -moz-animation-delay:-10.35s; background-color:rgb(225,0,37) }
.cssload-dots:nth-child(10):after { transform:translateY(200%); -o-transform:translateY(200%); -ms-transform:translateY(200%); -webkit-transform:translateY(200%); -moz-transform:translateY(200%); animation:cssload-animAfter 1.15s linear infinite;
                                    -o-animation:cssload-animAfter 1.15s linear infinite; -ms-animation:cssload-animAfter 1.15s linear infinite; -webkit-animation:cssload-animAfter 1.15s linear infinite; -moz-animation:cssload-animAfter 1.15s linear infinite;
                                    animation-delay:-10.35s; -o-animation-delay:-10.35s; -ms-animation-delay:-10.35s; -webkit-animation-delay:-10.35s; -moz-animation-delay:-10.35s; background-color:rgb(0,57,127) }
@keyframes cssload-animBefore { 0% { transform:scale(1) translateY(-200%); z-index:1 } 25% { transform:scale(1.3) translateY(0); z-index:1	}
	50% {
		transform:scale(1) translateY(200%);
		z-index:-1;
	}
	75% {
		transform:scale(0.7) translateY(0);
		z-index:-1;
	}
	100% {
		transform:scale(1) translateY(-200%);
		z-index:-1;
	}
}
@-o-keyframes cssload-animBefore {
	0% {
		-o-transform:scale(1) translateY(-200%);
		z-index:1;
	}
	25% {
		-o-transform:scale(1.3) translateY(0);
		z-index:1;
	}
	50% {
		-o-transform:scale(1) translateY(200%);
		z-index:-1;
	}
	75% {
		-o-transform:scale(0.7) translateY(0);
		z-index:-1;
	}
	100% {
		-o-transform:scale(1) translateY(-200%);
		z-index:-1;
	}
}
@-ms-keyframes cssload-animBefore {
	0% {
		-ms-transform:scale(1) translateY(-200%);
		z-index:1;
	}
	25% {
		-ms-transform:scale(1.3) translateY(0);
		z-index:1;
	}
	50% {
		-ms-transform:scale(1) translateY(200%);
		z-index:-1;
	}
	75% {
		-ms-transform:scale(0.7) translateY(0);
		z-index:-1;
	}
	100% {
		-ms-transform:scale(1) translateY(-200%);
		z-index:-1;
	}
}
@-webkit-keyframes cssload-animBefore { 0% { -webkit-transform:scale(1) translateY(-200%); z-index:1 } 25% { -webkit-transform:scale(1.3) translateY(0); z-index:1 }
                                       50% { -webkit-transform:scale(1) translateY(200%); z-index:-1 } 75% { -webkit-transform:scale(0.7) translateY(0); z-index:-1; } 100% { -webkit-transform:scale(1) translateY(-200%); z-index:-1 } }
@-moz-keyframes cssload-animBefore { 0% { -moz-transform:scale(1) translateY(-200%); z-index:1 } 25% { -moz-transform:scale(1.3) translateY(0); z-index:1 } 50% { -moz-transform:scale(1) translateY(200%); z-index:-1 }
                                    75% { -moz-transform:scale(0.7) translateY(0); z-index:-1 } 100% { -moz-transform:scale(1) translateY(-200%); z-index:-1 } }
@keyframes cssload-animAfter { 0% {	transform:scale(1) translateY(200%); z-index:-1 } 25% { transform:scale(0.7) translateY(0); z-index:-1 } 50% { transform:scale(1) translateY(-200%); z-index:1 }
                              75% { transform:scale(1.3) translateY(0); z-index:1 } 100% { transform:scale(1) translateY(200%); z-index:1 } }
@-o-keyframes cssload-animAfter { 0% { -o-transform:scale(1) translateY(200%); z-index:-1 } 25% { -o-transform:scale(0.7) translateY(0); z-index:-1 } 50% { -o-transform:scale(1) translateY(-200%); z-index:1 }
                                 75% { -o-transform:scale(1.3) translateY(0); z-index:1 } 100% { -o-transform:scale(1) translateY(200%); z-index:1 } }
@-ms-keyframes cssload-animAfter { 0% { -ms-transform:scale(1) translateY(200%); z-index:-1 } 25% { -ms-transform:scale(0.7) translateY(0); z-index:-1 } 50% { -ms-transform:scale(1) translateY(-200%); z-index:1 }
                                  75% {	-ms-transform:scale(1.3) translateY(0); z-index:1 } 100% { -ms-transform:scale(1) translateY(200%); z-index:1 } }
@-webkit-keyframes cssload-animAfter {
	0% {
		-webkit-transform:scale(1) translateY(200%);
		z-index:-1;
	}
	25% {
		-webkit-transform:scale(0.7) translateY(0);
		z-index:-1;
	}
	50% {
		-webkit-transform:scale(1) translateY(-200%);
		z-index:1;
	}
	75% {
		-webkit-transform:scale(1.3) translateY(0);
		z-index:1;
	}
	100% {
		-webkit-transform:scale(1) translateY(200%);
		z-index:1;
	}
}
@-moz-keyframes cssload-animAfter {
	0% {
		-moz-transform:scale(1) translateY(200%);
		z-index:-1;
	}
	25% {
		-moz-transform:scale(0.7) translateY(0);
		z-index:-1;
	}
	50% {
		-moz-transform:scale(1) translateY(-200%);
		z-index:1;
	}
	75% {
		-moz-transform:scale(1.3) translateY(0);
		z-index:1;
	}
	100% {
		-moz-transform:scale(1) translateY(200%);
		z-index:1;
	}
}