/* Loader */ .load-ing { width: 130px; display: block; height: 2px; margin: 28px auto; border-radius: 2px; background-color: #cfcfcf; position: relative; overflow: hidden; z-index: 1; } .load-ing:before { content:''; height: 3px; width: 68px; position: absolute; -webkit-transform: translate(-34px, 0); -ms-transform: translate(-34px, 0); transform: translate(-34px, 0); background-color: #11396f; border-radius: 2px; -webkit-animation: initial-load-ing 1.5s infinite ease; animation: animation 1.4s infinite ease; } @-webkit-keyframes animation { 0% { left: 0 } 50% { left: 100% } 100% { left: 0 } } @keyframes animation { 0% { left: 0 } 50% { left: 100% } 100% { left: 0 } } .face .conter > img { background: #022a5e; -webkit-box-shadow: 0px 7px 20px 2px rgba(167, 167, 167, 0.60); box-shadow: 0px 7px 20px 2px rgba(167, 167, 167, 0.60); border border-radius: 2px; animation: bounce 1.4s ease infinite; -webkit-animation: bounce 1.4s ease infinite; -moz-animation: bounce 1.4s ease infinite; -ms-animation: bounce 1.4s ease infinite; -o-animation: bounce 1.4s ease infinite; } @-webkit-keyframes bounce { 0% { -webkit-transform: scale(1) ; transform: scale(1) ; -webkit-filter: blur(0); filter: blur(0); } 50% { -webkit-transform: scale(.9) ; transform: scale(.9) ; -webkit-filter: blur(1.4); filter: blur(1.4); -webkit-box-shadow: 0px 0.3px 5px .5px rgb(167, 167, 167); box-shadow: 0px 0.3px 5px .5px rgb(167, 167, 167); } 100% { -webkit-transform: scale(1) ; transform: scale(1) ; } } @keyframes bounce { 0% { -webkit-transform: scale(1) ; transform: scale(1) ; -webkit-filter: blur(0); filter: blur(0); } 50% { -webkit-transform: scale(.9) ; transform: scale(.9) ; -webkit-filter: blur(1.4); filter: blur(1.4); -webkit-box-shadow: 0px 0.3px 5px .5px rgb(167, 167, 167); box-shadow: 0px 0.3px 5px .5px rgb(167, 167, 167); } 100% { -webkit-transform: scale(1) ; transform: scale(1) ; } } .caption { white-space: nowrap; margin-top: 40px; text-align: center; } .caption ul { margin: 0; padding: 0; } .caption li { list-style: none; display: inline-block; letter-spacing: 0px; font-size: 13px; color:#f3f3f3; margin-right: 5px; font-family: Arial Narrow, sans-serif; animation: on-run 2.6s ease infinite; -webkit-animation: on-run 2.6s ease infinite; -moz-animation: on-run 2.6s ease infinite; -ms-animation: on-run 2.6s ease infinite; -o-animation: on-run 2.6s ease infinite; } .caption li:nth-child(1){ -webkit-animation-delay:.2s; animation-delay:.2s } .caption li:nth-child(2){ -webkit-animation-delay:.4s; animation-delay:.4s; margin-right: 10px; } .caption li:nth-child(3){ -webkit-animation-delay:.6s; animation-delay:.6s } .caption li:nth-child(4){ -webkit-animation-delay:.8s; animation-delay:.8s } .caption li:nth-child(5){ -webkit-animation-delay:1s; animation-delay:1s; margin-right: 10px; } .caption li:nth-child(6){ -webkit-animation-delay:1.2s; animation-delay:1.2s } .caption li:nth-child(7){ -webkit-animation-delay:1.4s; animation-delay:1.4s } .caption li:nth-child(8){ -webkit-animation-delay:1.6s; animation-delay:1.6s } @-webkit-keyframes on-run { 0% { color:#f3f3f3; } 25% { color: #0073b1; } 50% { color:#0073b1; } 75% { color:#f3f3f3; } 100% { color:#f3f3f3; } } @keyframes on-run { 0% { color:#f3f3f3; } 25% { color: #022a5f; } 50% { color:#082141; } 75% { color:#082141; } 100% { color:#f3f3f3; } } .caption li:last-child{ margin-right:0 } .x-grid-cell-inner { font-size: 11px; padding: 5px 10px 5px !important; } #tbtext-1030:before{ content: "\f124 "; font-family: FontAwesome; } #tbtext-1054:before{ content: "\f080 "; font-family: FontAwesome; } .sp-10{ margin-bottom:0px } .view-color-red { opacity: 0.9; } .view-item-disabled { opacity: 0.1; } body.x-border-layout-ct, div.x-border-layout-ct { background-color: #ececec !important; } .x-fieldset { overflow: visible !important; /* workaround for Safari issue */ } /* =-=-=-== */ .street-view { position: absolute; right:0; bottom:0; width: 270px; height: 160px; background: rgba(255, 255, 255, .0); text-align: center; color: #fff; display: none; } @media (max-width:420px){ .street-view { position: absolute; left:20; bottom:120; width: 220px; height: 130px; background: rgba(255, 255, 255, .0); z-index: 999999; display:none; } } .onlinecolor{ color:#17cc5db8; } .lostconnectioncolor{ color:#fabe4dbf; } .offlinecolor{ color:#ff0500b8; } .rotate-north, #dOnline, #dOffline, #dVM{ max-width:21px; font-size:10px; top: 70px; left: 7px; } .popover-body{ font-weight: bold; font-style: italic; text-transform: uppercase; } /* =-=-=-== */ #logam{ width:130px; } code { font-family: Open Sans !important; font-size: 9px!important; color: #404040 !important; text-transform: capitalize; } #footer-info { position: absolute; bottom: 10px; right: 15px; font-size: x-small; } .img-car { margin-left: 15px; margin-bottom: 5px; width: 60px; height: 60px; display: block; -webkit-box-shadow: 0px 0px 3px 0px #000000; -moz-box-shadow: 0px 0px 3px 0px #000000; box-shadow: 0px 0px 3px 0px #000000; } .duo-content{ display: flex; justify-content: center; align-items: center; flex-direction: column; } .ol-popup { padding: 10px 5px 5px 5px !important; font-size:9px; position: absolute; -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2)); filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2)); bottom: 12px; left: -50px; min-width: 190px; display:none; border-radius: 2%!important; border: 0px !important; opacity: 0.95; } .pop-up-just{ position: relative; left: -15px; } .ol-popup:after, .ol-popup:before { top: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } .ol-popup:after { border-top-color: #fff!important; border-width: 10px; left: 48px; margin-left: -10px; } .ol-popup:before { border-top-color: #fff!important; border-width: 11px; left: 48px; margin-left: -11px; } .ol-popup-closer { position: absolute; top: 15px; right: 5px; font-size: 12px !important; padding: 1px 6px!important; z-index: 999; color: #dc3545!important; text-decoration: none; } .ol-popup-closer:after { content: "CERRAR âœââ‚ÂÂÃÆâââ€ÅÂ¡Ãƒâ€šÃ‚¬ÃƒÂ¢Ã¢â‚¬Å¾Ã‚¢ÃƒÆ’ƒâ€ Ã¢â‚¬â„¢ÃƒÆ’†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…¡Ãƒâ€šÃ‚¬ÃƒÆ’ƒÆ’¢â‚¬Å“"; } .nome { color: black; font-size: 12px; padding-top: 3px; text-align: center; margin-bottom: 10px; text-transform: uppercase; font-family: sans-serif; } .btn-secondary { background-color: #72ade0 !important; border-color: #9fc6e8 !important; } .img-int{ height:30px; } /* =-=-=-== */ .spinner { position: absolute; display: flex; top: 50%; left: 50%; width: 60px; height: 60px; margin-top: -30px; margin-left: -30px; justify-content: center; align-items: center; } /* =-=-=-=-=-=- */ .layer-switcher .panel { border-radius: 0px !important; -webkit-box-shadow: 0px 1px 20px 0px #000000; -moz-box-shadow: 0px 1px 20px 0px #000000; box-shadow: 0px 1px 20px 0px #000000; border: 4px solid #ffffff !important; background-color: #ffffffeb !important; } /* =-=-=-=-=-=- */ .ol-logo-int { position: absolute; background-color: rgba(255, 255, 255, 0.74); border-radius: 2px; padding: 3px; margin-left: 60px; } .layer-switcher { z-index: 100!important; top: 5em !important; } .ol-control button { background-color: #011c46e3 !important; } .x-item-disabled{ visibility: hidden; } .ol-control button:hover { background-color: #011c46f0 !important; transition: all 0.40s linear; -webkit-transition: all 0.40s linear; -moz-transition: all 0.40s linear; } .ol-control { padding: 0px!important; background:none!important; } /* none */ button.was{ display:none!important; } /* Media */ @media (max-width:768px){ .layer-menu{ display: none; } .menu-btns { display: none; } .rotate-north{ display:none; } .touch{ margin-top:-8px; } .x-grid-cell-inner{ padding: 10px!important; } .ol-logo-int{ display:none; } } /* Config */ .layer-menu { position: absolute; top: 8.3em; right: 0.5em; text-align: left; background-color: transparent; z-index: 2; } .layer-menu button { height: 33px!important; width: 33Px!important; } .menu-btns { position: absolute; top: 9.1em; right: 0.3em; background-color: transparent; font-size: 1.2em; width: 36px; z-index: 1; } .menu-btns button { height: 33px!important; width: 33px!important; z-index: 1!important; } button:focus { outline: 0px!important; outline: 0px!important; } .layer-menu .panel { padding-right: 10px; border: 1px solid #fff !important; background-color: #ffffffeb !important; display: none; max-height: 100%!important; -webkit-box-shadow: 0px 1px 10px 0px #000000; -moz-box-shadow: 0px 1px 10px 0px #000000; box-shadow: 0px 1px 10px 0px #000000; z-index: 99999!important; } .layer-menu .show { display:block!important; } .layer-menu .hidden { display:none!important; } .layer-menu li.layer label, .layer-menu li.layer input { display: table-cell; vertical-align: sub; } .layer-menu ul { padding-left: 1em; list-style: none; color: #565656; } .layer-menu li.layer { display: table; padding-top: 5px; margin-left: 5px; } .panel label { max-width: 100%; margin-bottom: 8px; font-size: 13px !important; } .panel ul li label:hover{ cursor: pointer; color: #016a99; transition: all 0.40s linear; -webkit-transition: all 0.40s linear; -moz-transition: all 0.40s linear; } /* Panel */ .toolbar-header-style { background-color: #4a6686 !important; } .x-panel-header-default .x-tool-tool-el { background-color: #ffffff00 !important; } /* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= */ .x-menu{ opacity:0.90; -webkit-box-shadow: 0px 1px 20px 0px #000000; -moz-box-shadow: 0px 1px 20px 0px #000000; box-shadow: 0px 1px 20px 0px #000000; border-radius: 4px !important; } .x-btn-inner-default-toolbar-small{ color:#ffffff!important; } .x-btn-wrap-default-toolbar-small.x-btn-arrow-right:after{ color: #ffffff!important; } /* Botones =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */ .x-btn { background-color: #05285d !important; border: none!important; border-radius: 5px!important; text-decoration: none!important; } .x-btn:hover{ background-color:#0d336f !important; -webkit-transition: all 0.5s 0s ease; -moz-transition: all 0.5s 0s ease; -o-transition: all 0.5s 0s ease; transition: all 0.5s 0s ease; } .btn { font-size: 0.6rem !important; } .x-btn-icon-el-default-toolbar-small { color: #ffffff!important; font-size: 18px!important; } .x-btn-default-toolbar-small { background: none!important; border: none!important; } .x-btn-focus.x-btn-over.x-btn-default-toolbar-small{ box-shadow: none!important; } .x-btn-focus.x-btn-default-toolbar-small{ box-shadow: none!important; } .x-btn.x-btn-pressed.x-btn-default-toolbar-small{ background: #011748 !important; } .x-toolbar-default{ background: rgb(5,40,94) !important; background: -moz-radial-gradient(circle, rgba(5,40,94,1) 0%, rgba(1,34,85,1) 49%) !important; background: -webkit-radial-gradient(circle, rgba(5,40,94,1) 0%, rgba(1,34,85,1) 49%) !important; background: radial-gradient(circle, rgba(5,40,94,1) 0%, rgba(1,34,85,1) 49%) !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#05285e",endColorstr="#012255",GradientType=1) !important; } .x-toolbar-text-default{ color: #ffffff!important; } /* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= */ /* Janelas =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= */ .x-window-default { border-radius: 5px!important; border: none!important; -webkit-box-shadow: 0px 1px 20px 0px #000000; -moz-box-shadow: 0px 1px 20px 0px #000000; box-shadow: 0px 1px 20px 0px #000000; } .x-window-header-default-top, .x-panel-header-default { background: rgb(5,40,94) !important; background: -moz-radial-gradient(circle, rgba(5,40,94,1) 0%, rgba(1,34,85,1) 49%) !important; background: -webkit-radial-gradient(circle, rgba(5,40,94,1) 0%, rgba(1,34,85,1) 49%) !important; background: radial-gradient(circle, rgba(5,40,94,1) 0%, rgba(1,34,85,1) 49%) !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#05285e",endColorstr="#012255",GradientType=1) !important; border: none !important; } .x-window-header-default { border-color: transparent!important; } .x-window-header-default .x-tool-img { background-color: transparent !important; } /* =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= */ .x-toolbar-footer{ background-color: transparent !important; } .x-grid-item-selected, .x-grid-item:hover{ transition: all 0.50s linear; -webkit-transition: all 0.50s linear; -moz-transition: all 0.50s linear; border-color: none !important; cursor: pointer; } .conter { margin: auto; position: relative; } .face{ margin-top: 00px; text-align: center; } #attribution { position: absolute; bottom: 10px; right: 15px; font-size: x-small; }