/* 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 : 27/03/2020, 12:42:42 PM Author : Ale */ /***** HEADER *****/ .margen-principal{ margin-left: 1.5rem !important; margin-right: 1.5rem !important; } header{ padding: 20px 0; height: 110px; } .menu, .footer{ margin: 0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } header .logotipo{ float: left; clear: none; text-align: inherit; width: 20%; margin-left: 0; margin-right: 0; } header .logotipo:before { content: ''; display: table; } header .logotipo img{ max-width: 200px; } aside .logotipo img{ position: absolute; top: 24px; max-width: 180px; } .mainMenu{ min-width: 85px; } .nav-item{ border-right: 1px solid #969696; } .nav-item:last-child { border-right: 0; } .nav-item > a{ color:#969696; padding: 1px 6px; } .nav-item > a:hover{ color:#D21034; } /* SIDEBAR */ #sidebar { width: 400px; position: fixed; top: 0; right: -400px; height: 100vh; z-index: 1023; transition: all 0.3s; overflow-y: auto; } #sidebar.active {right: 0;} .overlay {display: none; position: fixed; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.6); z-index: 1022; opacity: 0; transition: all 0.5s ease-in-out;} .overlay.active { display: block; opacity: 1;} #sidebar a:hover{text-decoration:none; } /*color:#d12034 !important;}*/ #sidebar a{transition: color 0.6s ease;} .defaultShadow{ -webkit-box-shadow: 0 0 5px 1px rgba(150,150,150,.2); box-shadow: 0 0 5px 1px rgba(150,150,150,.2); } /* ICONOS MENU */ header{ padding: 20px 0; height: 110px; } header .logotipo{ float: left; clear: none; text-align: inherit; width: 20%;margin-left: 0; margin-right: 0;} header .logotipo:before {content: '';display: table;} header .logotipo img, aside .logotipo img {max-width: 200px;} .mainMenu{min-width: 85px;} .menu .nav-item{border-right: 1px solid #969696;} .menu .nav-item:last-child {border-right: 0;} .menu .nav-item > a, .menu .nav-item > span{color:#969696;padding: 1px 10px;} .menu .nav-item > a:hover{color:#D21034;text-decoration: none;} .menu .nav-item > a{transition: color 0.6s ease;} .side-menu .ing-caret{ transition: .3s transform ease-in-out; } #accordionMenu ul { list-style: none; } #accordionMenu .collapsed .ing-caret { display: inline-block; transform: rotate(-90deg); } .iconLogin, .iconOff{ font-size: 16px; display: block; width: 60px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-radius: 30px 0 0 30px; } .iconOff:hover, .iconOff:active{ text-decoration: none; background: #D21034; color: #FFFFFF; height: 40px; } .iconOff{ color: #D21034; } .iconLogin:hover, .iconLogin:active, .iconOff:hover, .iconOff:active{ text-decoration: none; color: #FFFFFF; height: 40px; } .iconLogin{ color: #339933; } .iconLogin:hover, .iconLogin:active{ background: #339933; } .iconSesion{ margin-right: -20px; } .menuicon{ font-size: 40px; cursor: pointer; border-radius: 50%; } .menuicon:hover{ color: #101097 !important; } .cerraricon{ height: 40px !important; max-height: 40px; width: 40px !important; max-width: 40px; cursor: pointer; } .cerraricon:hover{ background: #101097 !important; } /***** FOOTER *****/ footer { font-size:14px !important; } footer ul { list-style:none; padding:0; margin:0; } footer ul > li { display:inline-block; vertical-align:top; } footer a { color:#FFFFFF !important; } footer a:hover { color:#D21034 !important; } /*** TOP ***/ footer .footerTop { background:#001D68; padding:25px 0 15px; } footer .footerTop .logotipo { overflow:hidden; } footer .footerTop .logotipo .lasalle { max-width:180px; float: left; } footer .footerTop .logotipo .profesionales { max-width:150px; float:right; } footer .ubicacion{ margin-top: 40px; } footer .ubicacion .nav-item, footer .ubicacion .nav-link{ border: none; } footer .ubicacion .nav-link { color: rgba(255,255,255,0.5) !important; } footer .ubicacion .nav-link.active { color: #FFFFFF !important; } footer .ubicacion .nav-link:hover { color: #D21034 !important; } footer .ubicacion .nav-link.active:hover { color: #FFFFFF !important; } footer .ubicacion .tab-content{ color: #FFFFFF; font-size: 12px; } footer .ubicacion .btnMap{ color: #0FB7F1 !important; display: block; position: relative; } footer .ubicacion .btnMap .icon { font-size:24px; position:relative; top:7px; left:-5px; margin-right:-5px; } footer .ubicacion .btnMap:after { content:''; width:0; height:1px; background:#0fb7f1; bottom:0; left:10px; display:block; position:absolute; -webkit-transition:.6s all ease; -moz-transition:.6s all ease; -o-transition:.6s all ease; -ms-transition:.6s all ease; transition:.6s all ease; } footer .ubicacion .btnMap:hover:after { width:73px; } footer .ubicacion .redes { text-align: left; } footer .ubicacion .redes h4, footer .ubicacion .redes p{ color: #FFFFFF; font-size: 16px; margin: 0; } /*** MIDDLE ***/ footer .footerMiddle { background:#071e58; overflow:hidden; } footer .footerMiddle li { border-color: #FFFFFF; padding: 1px 10px; display: inline-block; margin-bottom: 10px; } /*** BOTTOM ***/ footer .footerBottom { background:#091941; overflow:hidden; padding:15px 0; } footer .footerBottom .logotipos a .internacional { width:80px; } footer .footerBottom .logotipos a .red { width:75px; } footer .footerBottom .legales ul{ margin-left: auto; } footer .footerBottom .legales ul li { border-right:1px solid #FFFFFF; padding:1px 10px; } footer .footerBottom .legales ul li:last-child { border:0; } /***** SCROLLBAR *****/ ::-webkit-scrollbar {width: 8px;}/*Ancho*/ ::-webkit-scrollbar-track {background: #F1F1F1;}/*Riel*/ ::-webkit-scrollbar-thumb {background: #D6D8DB;}/* Handle */ ::-webkit-scrollbar-thumb:hover { background: #001D68; }/*Hover Handle */ /***** LOADING *****/ .pantallaFull{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 2000;} #posicion { width: 304px; margin: 0 auto; } #caja { width: 100%; perspective: 2200px; margin: auto; position: relative; } #barrasLoaging { position: relative; width: 304px; height: 150px; padding: 0; margin: 0; } .barraLoading:nth-child(1), .barraLoading:nth-child(1) div { z-index: 1; animation-delay: 0.0833333333s; } .barraLoading:nth-child(2), .barraLoading:nth-child(2) div { z-index: 2; animation-delay: 0.1666666667s; } .barraLoading:nth-child(3), .barraLoading:nth-child(3) div { z-index: 3; animation-delay: 0.25s; } .barraLoading:nth-child(4), .barraLoading:nth-child(4) div { z-index: 4; animation-delay: 0.3333333333s; } .barraLoading:nth-child(5), .barraLoading:nth-child(5) div { z-index: 5; animation-delay: 0.4166666667s; } .barraLoading:nth-child(6), .barraLoading:nth-child(6) div { z-index: 6; animation-delay: 0.5s; } .barraLoading:nth-child(7), .barraLoading:nth-child(7) div { z-index: 7; animation-delay: 0.5833333333s; } .barraLoading:nth-child(8), .barraLoading:nth-child(8) div { z-index: 8; animation-delay: 0.6666666667s; } .barraLoading { width: 30px; height: 150px; position: relative; margin-right: 8px; float: left; transform-style: preserve-3d; box-shadow: 0 0 5px rgba(39, 72, 155,.2); animation: animCube; /* Safari and Chrome */ animation-iteration-count: infinite; } .barraLoading div { position: absolute; display: block; width: 30px; height: 150px; } .barraLoading .center { width: 30px; box-shadow: 0 0 3px rgba(39, 72, 155,.3), inset 0 1px rgba(255, 255, 255, .05); animation: animCenter; animation-iteration-count: infinite; } .barraLoading .bottom { width: 30px; height: 10px; bottom: 0; transform: rotateX(90deg); transform-origin: center bottom; animation: animBottom; animation-iteration-count: infinite; } .barraLoading .left { left: 0; transform: rotateY(90deg); transform-origin: left center; animation: animSide; animation-iteration-count: infinite; } .barraLoading .right { right: 0; transform: rotateY(-90deg); transform-origin: right center; animation: animSide; animation-iteration-count: infinite; } .barraLoading .left, .barraLoading .center, .barraLoading .right, .barraLoading .bottom, .barraLoading { animation-duration: 1s; animation-timing-function: ease-in-out; } .left, .right { background-image: linear-gradient(top, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0)); } .center { background-image: linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); } .bottom { background-image: linear-gradient(bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0)); } @media (max-width:560px) { #barrasLoadings{ -ms-transform: scale(0.5); transform: scale(0.5); } } @keyframes animCube { 30% { transform: translateZ(150px) translatex(0) translateY(0) rotatex(3deg) rotatey(0deg) rotateZ(0deg); box-shadow: 0 0 20px rgba(39, 72, 155, .5), 0 12px 20px 1px rgba(39, 72, 155, .5); } 100% { transform: translateZ(0px) rotatez(0deg); box-shadow: 0 0 30px rgba(39, 72, 155, .5), 0 0 0 0 rgba(39, 72, 155, 0); } } @keyframes animSide { 30% { width: 100px; } 95% { width: 10px; } } @keyframes animBottom { 30% { height: 100px; } 95% { height: 10px; } } @keyframes animCenter { /* Safari and Chrome */ 20% { box-shadow: 0 0 3px rgba(255, 255, 255, 0.15), inset 0 1px rgba(255, 255, 255, .5); } 65% { box-shadow: 0 0 3px rgba(255, 255, 255, 0), inset 0 1px rgba(255, 255, 255, .25);} } /***** CONTENEDORES *****/ body{ font-size: 14px !important; } .marco{ max-width: 960px; width: 100%; margin-left: auto; margin-right: auto; margin-bottom: 1.5rem; } .container-fluid{ padding: 0; } /***** TÍTULOS *****/ h1, h2, h3 { letter-spacing: 1px; position: relative; } h1:before, h2:before, h3:before { content: ''; position: absolute; bottom: -8px; left: 0; width: 80px; display: block; background: #D21034; height: 3px; } h4, h5, h6 { font-family: 'indivisa-text-bold'; } h1 { margin-bottom: 40px; font-size: 50px; } h5 { color:#D21034; } h6 { color: #222222; } /***** FONTS *****/ .display-5 { font-size: 2.5rem; font-weight: 300; line-height: 1.2; } .display-6 { font-size: 1.5rem; font-weight: 300; line-height: 1.2; } /***** INPUTS *****/ input { outline: none; } input[type=text], input[type=password], input[type=email], textarea { color: #b7b7b7; background: transparent; border: 1px solid #dbdcdd; border-radius: 5px; font-weight: 300; vertical-align: middle; padding: 10px 20px; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, textarea:focus { color: #001D68; border-color: #001D68; } textarea{ resize: none; overflow-x: hidden; overflow-wrap: break-word; overflow-y: auto; } /***** BOTONES *****/ .btn-ing{ position: relative; padding: 10px 45px 10px 30px; } .btn-outline-secondary:hover{ background:#001D68; color: #FFFFFF; border-color:#001D68; } .btn-outline-primary.arrow:after { color: #D21034; } .btn-outline-danger.arrow:after { color: #001D68; } .btn.arrow:after { content: "\e905"; font-size: 14px; position: absolute; font-family: "ingfont"; right: 20px; margin-top: 3px; font-weight: bold; vertical-align: middle; -webkit-transition: 0.6s all ease; -moz-transition: 0.6s all ease; -o-transition: 0.6s all ease; -ms-transition: 0.6s all ease; transition: 0.6s all ease; } .btn-outline-secondary:hover.arrow:after { color: #D21034; } .btn-outline-info:hover{ background:#D21034; color: #FFFFFF; border-color:#D21034; } .btn-outline-info:hover.arrow:after { color: #001D68; } .btn-extra { cursor: pointer; color: #969696; } .btn-extra:hover{ background: #E0E0E0 !important; color: #001D68; } /********** MODALS **********/ /*--- MODAL MARCO ---*/ .modalMarco .modal-content{ background: url(../img/fondo.webp); border: 0; } .modalMarco .modal-header, .modalMarco .modal-body{ background: #FFFFFF; } .modalMarco .cerrar{ background: #FFFFFF; color: #001D68; padding: 0.5rem; margin: 0.5rem; border: 2px solid #001D68; border-radius: 50%; } .modalMarco .cerrar:hover{ background: #001D68; color: #FFFFFF; } .modalGral .modal-content{ border:1px solid #F0F0F0; box-shadow: 2px 2px #001D68; } .modalGral button.bg-white:hover{ background: none !important; opacity: 0.5; } .modalGral .modal-text-bold{ font-size: 18px; font-family: 'indivisa-text-bold'; padding: 0.75em 2em; } .modalGral .modal-text-italic{ font-size: 14px; font-family: 'indivisa-text-italic'; } /*.modal-divider::after { content: ""; width: 0; height: calc(100% - 1.5rem); position: absolute; border: 1px solid #D21034; top: 0.75rem; left: 25%; } .modal-divider .col-sm-3 { text-align: right; padding-right: 20px; } .modal-divider h6 { color: #001D68; font-family: 'indivisa-display-italic'; } @media (max-width:560px) { .modal-divider:after{ left: 5%; } .modal-divider .col-sm-3{ text-align: left; padding-right: 0px; padding-left: 2rem; } .modal-divider h6{ margin-bottom: 1rem; } .modal-divider .col-sm-9{ padding-left: 2rem; } } */ #modalInicia .icon{ font-size: 30px; color: #001D68; } #modalInicia .errorLogin{ font-size: 16px; } /***** TOOLTIP *****/ .tooltip-inner { background-color: #001D68; } .bs-tooltip-auto[x-placement^="top"] .arrow::before, .bs-tooltip-top .arrow::before { border-top-color: #001D68; } .bs-tooltip-auto[x-placement^="bottom"] .arrow::before, .bs-tooltip-bottom .arrow::before { border-bottom-color: #001D68; } .bs-tooltip-auto[x-placement^="left"] .arrow::before, .bs-tooltip-left .arrow::before { border-left-color: #001D68; } .bs-tooltip-auto[x-placement^="right"] .arrow::before, .bs-tooltip-right .arrow::before { border-right-color: #001D68; } /***** GENERALES *****/ .pointer{ cursor: pointer; } .defaultShadow{ -webkit-box-shadow: 0 0 5px 1px rgba(150,150,150,.2); box-shadow: 0 0 5px 1px rgba(150,150,150,.2); } .bg-barra{ background: #E0E0E0; } .pleca{ background: url(../img/pleca.webp); height: 30px; width: 100%; } .fondoAnuncio{ background: url(../img/fondo.webp); width: 100%; padding: 3rem; } .fondoAnuncio > div:first-of-type{ background: #FFFFFF; } .fondoAnuncio div.tit{ font-family: 'indivisa-text-bold'; font-size: 80px; } .fondoAnuncio div.msg{ font-size: 60px; } .fondoAnuncio div.msg2{ font-size: 40px; } /***** MOBILE *****/ @media (max-width: 800px) { .menu, .subMenu { position: relative; } .iconoMenu { position: absolute; display: block; right: 20px; top:10px; } .menuOculto{ display: none; } } @media (max-width:992px) { .fondoAnuncio div.tit{ font-size: 70px; } .fondoAnuncio div.msg{ font-size: 50px; } .fondoAnuncio div.msg{ font-size: 30px; } } @media (max-width:768px) { .margen-principal{ margin-left: 0 !important; margin-right: 0 !important; } .fondoAnuncio div.tit{ font-size: 60px; } .fondoAnuncio div.msg{ font-size: 50px; } .fondoAnuncio div.msg2{ font-size: 25px; } } @media (max-width:600px) { .fondoAnuncio div.tit{ font-size: 50px; } .fondoAnuncio div.msg{ font-size: 40px; } .fondoAnuncio div.msg2{ font-size: 20px; } } @media (max-width:520px) { .fondoAnuncio div.tit{ font-size: 40px; } .fondoAnuncio div.msg{ font-size: 30px; } .fondoAnuncio div.msg2{ font-size: 17px; } } @media (max-width:480px) { .fondoAnuncio div.tit{ font-size: 30px; } .fondoAnuncio div.msg{ font-size: 20px; } .fondoAnuncio div.msg2{ font-size: 15px; } } @media (max-width:370px) { .fondoAnuncio div.tit{ font-size: 25px; } .fondoAnuncio div.msg{ font-size: 15px; } .fondoAnuncio div.msg2{ font-size: 12px; } }