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; /* font-size: 100%;*/ /* font: inherit;*/ vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } * { box-sizing:border-box;} /* -------- 1. LAYOUT -------- */ html { font-size: 1rem; } body{ font-family: 'Roboto', sans-serif!important; position: relative } p{ font-weight: 400; font-size: 1rem; line-height: 1.5; letter-spacing: 0px; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{ font-family: 'Exo 2', sans-serif; font-weight: 600; } /*///////////////////-----ESTILOS GENÉRICOS-----/////////////////////*/ /*Enlaces en contacto*/ a.text-white.effect-1, a.text-green.effect-1 { /* color: #027847;*/ color: whitesmoke; transition: all 0.3s ease-in-out; font-weight: 500; display: block; position: relative; } a.text-white.effect-1:hover, a.text-green.effect-1:hover{ color: #027847; text-decoration: none; } a.text-white.effect-1:before, a.text-green.effect-1:before, a.text-white.effect-1:after, a.text-green.effect-1:after { content: ''; position: absolute; transition: transform .5s ease; } /*Efecto hover de links*/ .effect-1{ } a.text-white.effect-1:before, a.text-green.effect-1:before { left: 0; bottom: 0px; width: 100%; height: 2px; background: #fff; transform: scaleX(0); } a.text-green.effect-1:before { background: #027847!important; } a.text-white.effect-1:hover:before, a.text-green.effect-1:hover:before { transform: scaleX(1); } /*Input fondo verde*/ .form-control, .form-control-white {; color: #04B86D; background-color: #025230; transition: all .2s ease-in-out; border: 2px solid #04B86D; } .form-control:hover{ color: #04B86D; border-color: #05F792; background-color:#025230; } .form-control:focus, .form-control-white:focus { border-color: #04B86D; color: black; background-color: white; outline: 0px auto -webkit-focus-ring-color; /*Eliminar outline y sombra al dar click*/ box-shadow:none; /*Eliminar outline y sombra al dar click*/ } /*PARA CAMBIAR EL COLOR DEL PLACEHOLDER*/ .form-control::placeholder { color: #04B86D;} /* Chrome, Firefox, Opera*/ :-ms-input-placeholder.form-control { color: #04B86D; } /* Internet Explorer*/ .form-control::-ms-input-placeholder { color: #04B86D; } /* Microsoft Edge*/ /*PARA CAMBIAR EL COLOR DEL PLACEHOLDER EN ESTADO FOCUS*/ .form-control:focus::placeholder { color: #025230;} /* Chrome, Firefox, Opera*/ :-ms-input-placeholder.form-control:focus { color: #025230; } /* Internet Explorer*/ .form-control:focus::-ms-input-placeholder { color: #025230; } /* Microsoft Edge*/ /*Input fondo blanco*/ .form-control-white { color: #000; background-color: #fff; border-color:#BDC7D8; } .form-control-white:hover{ color: #000; border-color: #027847; background-color:#fff; } .form-control-white:focus { background-color: white; } /*PARA CAMBIAR EL COLOR DEL PLACEHOLDER*/ .form-control-white::placeholder { color: black;} /* Chrome, Firefox, Opera*/ :-ms-input-placeholder.form-control-white { color: black; } /* Internet Explorer*/ .form-control-white::-ms-input-placeholder { color: black ; } /* Microsoft Edge*/ /*PARA CAMBIAR EL COLOR DEL PLACEHOLDER EN ESTADO FOCUS*/ .form-control-white:focus::placeholder { color: #027847;} /* Chrome, Firefox, Opera*/ :-ms-input-placeholder.form-control-white:focus { color: #027847; } /* Internet Explorer*/ .form-control-white:focus::-ms-input-placeholder { color: #027847; } /* Microsoft Edge*/ /*Estilos botón enviar fondo verde*/ .btn-white-success, .btn-green-success { padding: 6px 28px; background-color: #fff; border-radius: 50px; color: #027847; font-weight: 600; border: 2px solid #04B86D; /* width: 100%;*/ } .btn-white-success:hover{ background-color: #025230; color: white; } .btn-white-success:focus { outline: 0px auto -webkit-focus-ring-color; /*Eliminar outline y sombra al dar click*/ box-shadow:none; /*Eliminar outline y sombra al dar click*/ } /*Estilos botón enviar fondo blanco*/ .btn-green-success { background-color: #025230; color: white; } .btn-green-success:hover{ background-color: #fff; color: #027847; } .btn-green-success:focus { outline: 0px auto -webkit-focus-ring-color; /*Eliminar outline y sombra al dar click*/ box-shadow:none; /*Eliminar outline y sombra al dar click*/ } /*///////////////////-----ESTILOS GENÉRICOS-----/////////////////////*/ /*menu*/ .menu-erp{ background-color: #025230; width: 100%; } /*Header logos*/ .header-logos img[alt="logo-geros"]{ max-width: 100%; height: 30px; } .header-logos p{ color: #027847; line-height: 1.2; border-left: 1px solid #027847; padding-left: 16px; margin-left: 16px; } /*Content items erp*/ .items-erp{ background-color:#F9F9F9; text-align: center; padding: 40px 15px; transition: all 300ms ease-in; transform: scale(1); width: 100%; position: relative; } .items-erp:hover{ background: #027847; box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.2); z-index: 100; transition: all 300ms ease-in; /*transform: scale(1.1);*/ } .items-erp h2{ font-size: 1.2rem; color: #025230; text-align: center; transition: all .2s ease-in-out; } .items-erp:hover.items-erp h2 { color: white; } .items-erp i{ color: white; font-size: 2.9em; width: 80px; height: 80px; text-align: center; display: inline-block; line-height: 80px; margin-bottom: 15px; border-radius: 80px; background: #027847; transition: all .2s ease-in-out; transform: scale(1); } .items-erp:hover.items-erp i { background: #fff; color:#027847 ; transform: scale(1.1); } /*items text*/ .items-erp-text{ width: 100%; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#025230+0,027847+100 */ background: url(images/Geros-Login-texture-background.png) no-repeat center center, rgb(2,82,48); /* Old browsers */ background: url(images/Geros-Login-texture-background.png) no-repeat center center, moz-linear-gradient(45deg, rgb(2,82,48) 0%, rgb(2,120,71) 100%); /* FF3.6-15 */ background: url(images/Geros-Login-texture-background.png) no-repeat center center, -webkit-linear-gradient(45deg, rgb(2,82,48) 0%,rgb(2,120,71) 100%); /* Chrome10-25,Safari5.1-6 */ background: url(images/Geros-Login-texture-background.png) no-repeat center center, linear-gradient(45deg, rgb(2,82,48) 0%,rgb(2,120,71) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#025230', endColorstr='#027847',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ background-attachment:fixed; overflow: hidden; } /*Estilos de listas con enlaces*/ ul.items-erp-link { list-style: none; padding: 0; } .items-erp-link li { padding-left: 1.3em; line-height: 1.8; } .items-erp-link li:before { font-family: "Font Awesome 5 Free"; content: "\f00c"; color: #ffffff; font-weight: 900; position: absolute; font-size: 12px; margin: 2px 0px 0px -20px; } .items-erp-link a{ color: white; } /*Any Desk*/ .any-desk{ background-color: gainsboro; } .any-desk img{ max-width: 70%; } /*footer*/ footer{ background-color: #025230; } .footer-intro-erp img{ height: 25px; } /*collapse*/ /* To change this license header, choose License Headers in Project Properties. To change this template file, choose Tools | Templates and open the template in the editor. */ /* Created on : 12/01/2016, 9:19:16 AM Author : Oriongu */ .gridder-list { display: inline-block; vertical-align: top; width: 100%; cursor: pointer; transition: all .8s ease-in-out; opacity: 1; position: relative; } .gridder .gridder-list:nth-child(n) { margin: 15px 0px; } .gridder .selectedItem:after { content: ' '; display: block; border-bottom: 10px solid #025230; border-left: 10px solid transparent; border-right: 10px solid transparent; height: 0%; position: absolute; top: 97%; width: 0; left: 0%; right: 0; margin-bottom: -4px; margin: 0 auto; transform: translateY(15px); } .gridder.hasSelectedItem .gridder-list:not(.selectedItem) { opacity: .2; } .gridder-show { position: relative; display: block; float: left; width: 100%; padding-top: 4px; } .gridder-content { display: none; } .gridder-navigation .gridder-nav { height: 43px; position: absolute; width: 24px; z-index: 1; color: #fff; font-size: 36px; outline: 0; text-align: center; text-decoration: none !important; user-select: none; top: 43%; /* background-color: red;*/ line-height: 42px; } .gridder-navigation .gridder-nav.prev { left: 14px; } .gridder-navigation .gridder-nav.next { right: 14px; } .gridder-navigation .gridder-nav:hover { color: #04B86D; } .gridder-navigation .gridder-close { color: #ffffff; position: absolute; cursor: pointer; height: 30px; right: 10px; top: 10px; width: 30px; z-index: 2; font-size: 24px; } .gridder-navigation .gridder-close:hover { color: #04B86D; } /*========== Mobile First Method ==========*/ /*Extra small devices (portrait phones, less than 576px)*/ /* No media query for `xs` since this is the default in Bootstrap*/ /*Small devices (landscape phones, 576px and up)*/ @media (min-width: 576px) { } /*Medium devices (tablets, 768px and up)*/ @media (min-width: 768px) { /*Content items erp*/ .gridder-list { width: 45.3%; } .gridder .gridder-list:nth-child(n) { margin: 15px; } } /*Large devices (desktops, 992px and up)*/ @media (min-width: 992px) { /*Content items erp*/ .items-erp h2{ /* font-size: 1.25rem;*/ } .gridder-list { width: 29.8%; } } /*Extra large devices (large desktops, 1200px and up)*/ @media (min-width: 1200px) { /*Content items erp*/ .gridder-list { width: 30.3%; } }