body { margin:0; padding: 0%; background-image: url(https://i.imgur.com/fkyj6Or.png); } header { background: rgb(30, 176, 196); height: 206px; width: 100%; } .logo { padding: 65px 0 0 120px /* padding: 96px 0 0 120px*/; } .nav1 { width: 100%; height: 84px; overflow: hidden; text-align: center; background:#232323; border-bottom: 3px solid #fdce4c; } .nvc { margin-top: 10px; width: max-content; box-sizing: border-box; position: relative; left: 50%; width: 720px; margin-left: -310px; overflow: hidden; } .login-min { color: white; text-align: left; position: absolute; right: 50%; margin-right: 337px; font-size: 23px; float: right; width: max-content; } .img-user { position: relative; float: left; width: 70px; height: 69px; box-sizing: border-box; overflow: hidden; margin-top: 11px; background-repeat: no-repeat; background-position: 0px -20px;; } .login-min > p { display: inline-block !important; height: 0px; margin-top: 6px !important; margin-bottom: 38px !important; } .ajustes { font-size: 12px; border: 2px solid #343434; background: #161616; padding-left: 7px; border-radius: 8px; margin-left: 70px; padding-top: 1px; height: 30px; width: 105px; } .ajustes > img { margin-right: 6px; } .armario { float: right; background: #161616; display: flex; align-items: center; justify-content: center; border-radius: 8px; width: 30px; height: 30px; margin-top: -30px; border: 2px solid #343434; } #nav-iconos { background: #161616; width: 52px; height: 52px; border-radius: 6px; float: left; transition: 1s; margin:5px; border: 2px solid #343434; display: flex; align-items: center; justify-content: center; } #nav-iconos img { transition: 0.8s; } #nav-iconos>img:hover { animation: pulse; } #nav-iconos.uno:hover { background: rgb(226, 92, 92); transition:all 1.5s ease-in-out; } #nav-iconos.dos:hover { background: rgb(226, 129, 92); transition:all 1.5s ease-in-out; } #nav-iconos.tres:hover { background: rgb(226, 191, 92); transition:all 1.5s ease-in-out; } #nav-iconos.cuatro:hover { background: rgb(156, 226, 92); transition:all 1.5s ease-in-out; } #nav-iconos.cinco:hover { background: rgba(226, 116, 1, 1); transition:all 1.5s ease-in-out; } #nav-iconos.seis:hover { background: rgb(34, 187, 212); transition:all 1.5s ease-in-out; } #nav-iconos.siete:hover { background: rgb(92, 112, 255); transition:all 1.5s ease-in-out; } #nav-iconos.ocho:hover { background: #363bd7; transition:all 1.5s ease-in-out; } #nav-iconos.ochoymedio:hover { background: rgb(162, 92, 255); transition:all 1.5s ease-in-out; } #nav-iconos.nueve:hover { background: rgb(229, 131, 230); transition:all 1.5s ease-in-out; } #nav-iconos.diez:hover { background: rgb(216, 70, 137); transition:all 1.5s ease-in-out; } .redes { box-sizing: border-box; height: 59px; width: 92px; padding-left: 14px; border-left: 1px solid #3c3c3c; overflow: hidden; margin-left: 390px; margin-top: -61px; position: absolute; left: 50%; } .hobba { position: absolute; left: 50%; margin-left: 418px; margin-top: -58px; } .logout { position: absolute; left: 50%; margin-left: 488px; border-left: 1px solid #3c3c3c; padding-left: 16px; margin-top: -58px; } .redes > img { margin: 2px 0px; } .content-mid { width: 1224px; padding-left: 30px; padding-right: 30px; padding-top: 15px; padding-bottom:15px; box-sizing: border-box; overflow: hidden; margin: 0 auto; background: #f1f1ec; } .carouseel { width: 100%; background: rgb(255, 255, 255); border-radius: 4px; height: auto; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); padding-bottom: 20px; overflow: hidden; text-align: center; margin-bottom: 20px; padding-left: 20px; padding-right: 20px; padding-top: 20px; border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); border: solid 1px rgba( 0, 0, 0, 0.06 ); } .item { width: 339px; display: inline-block !important; height: 160px; background: #fbfbfb; border-radius: 10px; border: 1px solid #ececec; } .img-category { border-radius: 10px 10px 0px 0px; width: 100%; height: 90px; } .title-eventoc { padding:10px; margin-top: 100px; color: white; border-radius: 4px; font-weight: bold; background: #2689de; display: inline-flex; box-shadow: 0px -2px 0px #4278cc inset, 0px 0px 0px, 0px 0px 0px; border-bottom: solid 2px rgb(181 178 178 / 83%); } .subtitle-eventoc { margin-top:100px; float: left; margin-left: 20px; font-size: 16px; font-weight: 600; text-align:left; width: 100%; color: #4c4c4c; } .autor-eventoc { font-size: 12px; color:#777777; float: left; margin-left: 20px; } .autor-eventoc > img { margin-top:-3px !important; margin-right: 5px !important; display: inline !important; width: auto !important; } .fecha-eventoc > img { margin-top:-3px !important; margin-right: 5px !important; display: inline !important; width: auto !important; } .fecha-eventoc { font-size: 12px; color:#777777; float: left; margin-left: 20px; } .puntuaciones { width: 100%; background: rgb(255, 255, 255); border-radius: 4px; height: auto; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); padding-bottom: 20px; overflow: hidden; margin-bottom: 40px; padding-top: 47px; border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); border: solid 1px rgba( 0, 0, 0, 0.06 ); } .button-patos { box-shadow: 0px -2px 0px #752e2e inset, 0px -20px 0px #dc3636 inset, 0px 2px 0px #ff8383 inset; background: #f53e3e; height: 44px; align-items: center; justify-content: center; display: flex; color: white; width: 95%; border-radius: 4px; font-weight: bold; margin: -53px 12px; float:left; } .button-gym { box-shadow: 0px -2px 0px #752e2e inset, 0px -20px 0px #dc3636 inset, 0px 2px 0px #ff8383 inset; background: #f53e3e; height: 44px; align-items: center; justify-content: center; display: flex; color: white; width: 95%; border-radius: 4px; font-weight: bold; margin: -53px 12px; float:left; } .button-puntua { height: 44px; width: 275px; box-shadow: 0px -2px 0px #752e2e inset, 0px -20px 0px #dc3636 inset, 0px 2px 0px #ff8383 inset; color: white; margin-top:-71px; position: absolute; background: #f53e3e; align-items: center; margin-left: 30px; font-size: 16px; padding: 14px; display: flex; text-align: center; border-radius: 4px; font-weight: bold; justify-content: center; } .info-user { width: 240px; height: 104px; margin: 5px 3px; border: solid 1px rgba( 0, 0, 0, 0.06 ); box-sizing: border-box; background: #dadada; display: inline-block; border-radius: 4px; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); position: relative; } .user-img { width: 64px; height: 78px; background: orange; border-radius: 4px; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); margin-left: 12px; margin-top: 12px; margin-right: 8px; border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); float: left; } .name-user { width: 146px; height: 36px; font-weight: bold; margin-top:12px; align-items: center; display: flex; border-radius: 4px; font-size:14px; padding-left:16px; background: #f8f8f8; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); } .points-user { width: 146px; height: 36px; font-weight: bold; font-size:14px; margin-top:4px; align-items: center; display: flex; border-radius: 4px; padding-left:16px; background: #f8f8f8; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); } .box-noticias { width: 100%; background: rgb(255, 255, 255); border-radius: 4px; height: auto; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); padding-bottom: 6px; padding-right: 30px; text-align: center; margin-bottom: 40px; margin-top:73px; border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); padding-left: 30px; border: solid 1px rgba( 0, 0, 0, 0.06 ); overflow: hidden; } .button-noticias { box-shadow: 0px -2px 0px #366e93 inset, 0px -20px 0px #4389b8 inset, 0px 0px 0px #366e93 inset; background: #4690c1; height: 44px; align-items: center; justify-content: center; display: flex; margin-top: -23px; color: white; width: 1000px; left: 50%; margin-left: -500px; position: absolute; border-radius: 4px; font-weight: bold; } .box-buscador { margin-top:45px; margin-bottom: 40px; } .button-img { width: 65px;height: 65px;border-radius: 10px;box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); display: flex; align-items: center; justify-content: center; float: left; background: #a2b6ff; border: solid 1px rgba( 0, 0, 0, 0.06 ); } .busc-noticia { float: left; padding-left: 30px; margin-left: 15px; padding-top:5px; padding-right: 5px; padding-bottom: 5px; width: 300px; margin-top:13px; } .box-noticia { width: 360px; height: 97px; margin: 2.2px; background: #efefef; display: inline-block; padding-right: 15px; overflow: hidden; box-sizing: border-box; border-radius: 4px; } .box-img-noticia { width: 82px; float: left; height: 100%; border-radius: 4px 0 0 4px; display: flex; margin-right: 15px; position: relative; overflow: hidden; align-items: center; justify-content: center; } .autor-noticia { width: 45px; height: 45px; border-radius: 4px; background: #000000ab; text-align: center; position: relative; border: 1px solid gray; overflow: hidden; } .titulo-noticia { width: 71%; color: white; align-items: center; display: flex; overflow: hidden; height: 32px; float: left; font-size: 12px; box-sizing: border-box; padding:12px; margin-top: 10px; margin-bottom: 5px; border-radius: 4px; background: #a5a5a5; } .sub-noticia { width: 71%; color: #757575; text-align: left; height: 22px; box-sizing: border-box; overflow: hidden; align-items: center; font-size: 12px; } .autor2-noticia { float: left; font-weight: bold; margin-right: 10px; font-size: 14px; } .fecha-noticia { float: right; margin-top:2px; font-size: 12px; color: #9c9c9c; } .button-noticia { float: right; margin-right: 10px; font-size: 14px; color: #6e7cbf; font-weight: bold; } .button-all { width: 1000px; background:#b9b9b99a; padding: 10px; border-radius: 4px; align-items: center; float: left; margin-left: -500px; top:20px; left: 50%; justify-content: center; display: flex; position: relative; box-shadow: 0px -2px 0px #ababab inset, 0px -20px 0px #bfbfbf inset, 0px 0px 0px #ababab inset; color: white; } .placas { float: left; width: 49.3%; box-sizing: border-box; text-align: center; padding-top:22px; padding-left: 15px; padding-right: 10px; padding-bottom: 10px; background: rgb(255, 255, 255); box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); border-radius: 4px; } .furnis { float: right; width: 49.3%; box-sizing: border-box; text-align: center; padding-top:22px; padding-left: 15px; padding-right: 10px; padding-bottom: 10px; background: rgb(255, 255, 255); box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); border-radius: 4px; } .top-patos { margin-top:20px; float: left; width: 49.3%; box-sizing: border-box; text-align: center; padding-top:30px; margin-bottom: 38px; padding-left: 15px; padding-right: 10px; padding-bottom: 13px; background: rgb(255, 255, 255); box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); border-radius: 4px; } .top-gym { float: right; margin-bottom: 38px; width: 49.3%; margin-top:20px; box-sizing: border-box; text-align: center; padding-top:30px; padding-left: 15px; padding-right: 10px; padding-bottom: 13px; background: rgb(255, 255, 255); box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); border-radius: 4px; } .button-placas { box-shadow: 0px -2px 0px #bc7e38 inset, 0px -20px 0px #eb9e46 inset, 0px 0px 0px #bc7e38 inset; background: #f7a649; height: 44px; align-items: center; justify-content: center; display: flex; color: white; width: 95%; border-radius: 4px; font-weight: bold; margin: -45px 12px; float:left; } .box-placa { background: #dadada; width: 72px; height: 72px; display: inline-flex; border-radius: 4px; align-items: center; margin: 6px 1px; justify-content: center; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); } .box-furnis { background: #dadada; width: 72px; height: 72px; display: inline-flex; border-radius: 4px; align-items: center; margin: 6px 1px; justify-content: center; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); } .button-furnis { box-shadow: 0px -2px 0px #bc7e38 inset, 0px -20px 0px #eb9e46 inset, 0px 0px 0px #bc7e38 inset; background: #f7a649; height: 44px; align-items: center; justify-content: center; display: flex; color: white; width: 95%; margin: -45px 12px; float:left; border-radius: 4px; font-weight: bold; } .sidebar { width: 30%; box-sizing: border-box; float: left; margin-left: 10px; margin-top: 40px; } .eventos-sid { background: rgb(255, 255, 255); box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); width: 100%; box-sizing: border-box; padding-left: 15px; padding-bottom: 10px; padding-right: 15px; padding-top: 32px; border-radius: 4px; } .eventos-sid > hr { height: 0px !important; margin-bottom: 10px !important; border-top: 1px solid rgba(0,0,0,.1) !important; } .button-eventos { box-shadow: 0px -2px 0px #5d8a27 inset, 0px -20px 0px #74ac31 inset, 0px 0px 0px #5d8a27 inset; background: #7ab433; height: 44px; align-items: center; justify-content: center; display: flex; color: white; width:95%; border-radius: 4px; font-weight: bold; margin: -55px 9px; float:left; } .content-right { width: 68%; box-sizing: border-box; float: right; margin-left: 10px; margin-top: 40px; } .articles { float: right; background: rgb(255, 255, 255); box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); width: 100%; padding-top: 32px; text-align: center; padding-left: 15px; padding-right: 15px; box-sizing: border-box; padding-bottom: 20px; margin-bottom: 40px; border-radius: 4px; } .button-articles { box-shadow: 0px -2px 0px #6b5282 inset, 0px -20px 0px #8667a3 inset, 0px 0px 0px #8667a3 inset; background: #8d6cab; height: 44px; align-items: center; justify-content: center; display: flex; color: white; width:95%; border-radius: 4px; font-weight: bold; margin: -55px 20px; float:left; } .movimientos { background: rgb(255, 255, 255); box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); border-bottom: solid 1px rgba( 0, 0, 0, 0.2 ); width: 100%; box-sizing: border-box; float: left; text-align: center; padding-top: 28px; padding-left: 20px; padding-right: 20px; padding-bottom: 10px; border-radius: 4px; } .button-movimientos { box-shadow: 0px -2px 0px #bc386b inset, 0px -20px 0px #eb4686 inset, 0px 0px 0px #bc386b inset; background: #f7498d; height: 44px; align-items: center; justify-content: center; display: flex; color: white; width:95%; border-radius: 4px; font-weight: bold; margin: -52px 20px; float:left; } .box-movimiento { background: #dadada; width: 67.69px; height: 71px; margin-top:7px; margin:1.67px; border-radius: 4px; display: inline-block; align-items: center; justify-content: center; box-shadow: inset 0px 2px 0px rgb(255 255 255 / 60%), 0px 2px 1px rgb(0 0 0 / 10%); border: solid 1px rgba( 0, 0, 0, 0.06 ); } .box-articles { width: 100%; height: 76px; border-radius: 6px; overflow: hidden; margin-bottom: -6px; background: white; border: 1px solid #cacaca; } .box-img-art { width: 95px; height: 74px; background: darkkhaki; } .categoria-evento { width: 92px; display: flex; align-items: center; justify-content: center; float: left; height: 100%; } .title-evento { height: 36px; width: 70.8%; display: flex; font-weight: bold; font-size: 15.2px; float: left; box-sizing: border-box; overflow: hidden; padding-left: 15px; align-items: center; background: #9c9c9c; color: white; } .fecha-evento { float: left; height: 15px; font-size: 14px; color:#5f5f5f; padding-left: 15px; } .fecha-evento > img { margin-top:-2px; margin-right: 5px; } .org-evento { float: left; height: 13px; font-size: 14px; padding-left: 15px; color: #5f5f5f; } .button-eventos2 { width: 90%; padding: 10px; background: #dadada; color: #8a8a8a; font-size: 14px; font-weight: 600; display: flex; align-items: center; border: 1px solid #cecdcd; justify-content: center; border-radius: 4px; margin: auto; } .lf-article { width: 245.18px; padding-bottom: 10px; border-radius: 4px; margin: 2px; margin-bottom: 10px; overflow: hidden; box-sizing: border-box; display: inline-block; background:white; border: 1px solid #c5c5c5; } .categoria-article { width: 100%; float: left; height: 106px; } .categoria-nombre { border-radius: 4px; padding:8px; margin-top: 10px; background: white; font-size: 12px; font-weight: bold; margin-left: 10px; float: left; } .autor-article { width: 50px; height: 50px; border-radius: 13px; background: #000000ab; text-align: center; float: right; margin-top: 48px; margin-right:10px; border: 1px solid #e8e8e8; overflow: hidden; } .title-article { margin-left: 10px; font-size: 14px; margin-bottom: 5px; margin-top: 4px; float: left; } .org-left { float: left; font-size: 12px; text-align: left; width: 60%; margin-left: 10px; } .org-right { margin-right: 10px; float: right; font-size: 12px; } .cuerp{ padding: 2% 10% 2% 10%; display: flex; flex-direction: column; align-items: center; } .anuncio1{ background-color: black; width: 95%; height: auto; border-radius: 10px; padding: 15px 20px 10% 20px; margin-bottom: 10px; } .anuncio1 a{ text-decoration: none; color: white; } .anuncio1 a:hover{ text-decoration: none; color: white; } .tituloanuncio1{ font-size:22px; background-color: #00000090; width: fit-content; padding: 0px 20px 2px 10px; border-radius: 10px; margin-right: 20%; } .descanuncio1{ line-height: 15px; font-size:12px; background-color: #00000090; width: fit-content; padding: 5px 17px 5px 10px; border-radius: 10px; margin-right: 45%; margin-top: 20px; } .seccion{ margin: 0px 0px 10px 0px; display: flex; flex-direction: row; } .seccionimg{ width: 60px; height: 60px; border: solid 1px #d3d3d2; border-radius: 10px; display: flex; justify-content: center; align-items: center; } .secimg{ width: 85%; height: 50px; background-color: #ededed; border-radius: 10px; display: flex; justify-content: center; align-items: center; } .seccionimgh { width: 60px; height: 60px; /* border: solid 1px #d3d3d2; */ border-radius: 10px; /* background: white; */ display: flex; justify-content: center; align-items: center; background: transparent; } .secimgh { width: 85%; height: 50px; background: rgba(0, 0, 0, 0.61); border-radius: 10px; display: flex; justify-content: center; align-items: center; } .seccionimgl { width: 60px; height: 60px; /* border: solid 1px #d3d3d2; */ border-radius: 10px; /* background: white; */ display: flex; justify-content: center; align-items: center; background: transparent; } .secimgl { width: 85%; height: 50px; background: rgba(0, 0, 0, 0.61); border-radius: 10px; display: flex; justify-content: center; align-items: center; } .secciontext{ color: #555555; margin: 0px 10px 0px; } .secciontexttit{ font-size: 14px; } .secciontextdes{ font-size: 13px; color: #747474; } .ultimosmov{ background-color: white; border: solid 1px #d3d3d2; width: 95%; height: auto; border-radius: 10px; padding: 10px 5px 10px 5px; display: inline-block; margin-bottom: 10px; } .movimiento{ width:60px; height: 60px; background-image: url('https://habborator.org/archive/topstory/general_1/topStory_speeding.gif'); margin: 15px; margin-right: 0px; display: inline-block; margin-bottom: 10px; margin-top: 5px; border-radius: 5px; margin-right: 5px; margin-bottom: 0px; box-shadow: -1px 1px 0px 1px rgb(0 51 85); background-repeat: no-repeat; background-position: left -67px; } .movimiento2 { width:62px; height: 62px; background-color: #ffce79; margin: 15px; margin-right: 0px; margin-bottom: 10px; margin-top: 5px; background-image: url('https://i.imgur.com/pcaDlWQ.png'); border-radius: 50%; background-repeat: no-repeat; background-position: center; background-position-y: -12px; box-shadow: 0px 0px 0px 3px rgb(247 185 112); border: solid #ffe2a5 0px; } .masmovimientos{ background-color: #388E3C; border-radius: 5px; /* border: solid 1px #000000; */ color: white; /* text-shadow: 1px 1px 0px black; */ font-size: 14px; padding: 7px; margin: 5px 15px 2px 15px; box-shadow: 0px 3px 7px #0000002e; border-bottom: #33691E solid; } .masmovimientos a, .masmovimientos a:hover{ text-decoration: none; color: white; } .tooltip-text { visibility: hidden; position: absolute; z-index: 2; width: 170px; color: #555555; background-color: #fdfdfd; border: solid 1px #d3d3d2; border-radius: 5px; margin-top: 2px; padding: 5px 12px 5px 12px; animation: 0.5s; box-shadow: 0px 3px 7px #0000002e; } .hover-text:hover .tooltip-text { visibility: visible; animation: 0.5s; } #right { top: -8px; left: 120%; animation: 0.5s; } .hover-text { position: relative; display: inline-block; text-align: center; animation: 0.5s; } .cuerp{ } .cuerp1{ display: flex; flex-wrap: wrap; width: 100%!important; max-width: 1200px; } .index1{ } .index2{ } .ultimasnotis{ background-color: white; border: solid 1px #d3d3d2; width: 100%; height: auto; border-radius: 10px; padding: 10px 5px 10px 5px; display: inline-block; } .ultnoti{ background-color: white; border: solid 1px #d3d3d2; height: 85px; border-radius: 10px; width: 97%; display: flex; margin-bottom: 13px; } .minianoti{ background-color: black; width: 70px; height:100%; border-radius: 10px; display: flex; justify-content: center; align-items: center; } .kekonoti{ background-color: #0000008c; width: 50px; height: 50px; background-repeat: no-repeat; border-radius: 10px; border: solid 1px #fff; background-position: -12px -20px; } .notiinfo{ padding: 10px 5px 10px 10px; } .notititulom a, .notititulom a:hover{ color: #646464; text-decoration: none; font-size: 13px; } .notititulom{ background-color: #e2e2e2; border-radius: 7px; padding: 3px 7px 3px 7px; width: 100% } .notidescm{ padding: 3px 7px 3px 5px; color: #646464; text-decoration: none; font-size: 11px; } .miniinfoinfo{ padding: 3px 7px 3px 5px; color: #646464; text-decoration: none; font-size: 10px; display: flex; align-items: center; } .miniinfonotm{ display: flex; justify-content: space-evenly; } .index3{ width: 100%; height: 200px; } /* ---- ----- ----- Contenedor Titulo y Controles ----- ----- ----- */ .contenedor-titulo-controles { display: flex; justify-content: space-between; align-items: end; } .contenedor-titulo-controles h3 { color: #fff; font-size: 30px; } .contenedor-titulo-controles .indicadores button { background: #fff; height: 3px; width: 10px; cursor: pointer; border: none; } .contenedor-titulo-controles .indicadores button:hover, .contenedor-titulo-controles .indicadores button.activo { background: red; } /* ---- ----- ----- Contenedor Principal y Flechas ----- ----- ----- */ .peliculas-recomendadas .contenedor-principal { align-items: center; position: relative; } .peliculas-recomendadas .contenedor-principal .flecha-izquierda, .peliculas-recomendadas .contenedor-principal .flecha-derecha { position: absolute; background: transparent; /* border: solid 1px #858585; */ font-size: 25px; /* height: 30px; */ top: calc(50% - 25%); /* line-height: 40px; */ /* width: 30px; */ /* color: #858585; */ cursor: pointer; z-index: 500; transition: .2s ease all; border-radius: 50px; border: none; } .peliculas-recomendadas .contenedor-principal .flecha-izquierda { left: 0; } .peliculas-recomendadas .contenedor-principal .flecha-derecha { right: 0; } /* ---- ----- ----- Carousel ----- ----- ----- */ .peliculas-recomendadas .contenedor-carousel { overflow: hidden; scroll-behavior: smooth; } .peliculas-recomendadas .contenedor-carousel .carousel { display: inline-flex; } .pelicula{ width: 60px; } .puntosgym{ background-color: white; border: solid 1px #d3d3d2; width: 100%; height: auto; border-radius: 10px; padding: 10px 5px 10px 5px; margin-bottom: 10px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; } .lufpatos{ width: 100%; max-width: 520px; align-self: end; } .patosuser{ background-color: #eeeeee; margin: 8px 8px 8px 8px; border-radius: 5px; border: solid 1px #d3d3d2; padding: 10px; width: 240px; display: inline-flex; } .imagenpunto{ border-radius: 5px; } .infopuntoo{ background-color: white; width: 98%; border-radius: 5px; padding: 4px 10px 4px 10px; display: inline-block; color: #555555; margin: 0px 8px 0px 8px; } .events { height: 215px; margin: 0px 0; margin-bottom: 25px; } .more-info-modal { position: fixed; top: 0; right: 0; background: rgba(0, 0, 0, 0.65); width: 100%; height: 100%; z-index: 1050; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center } .more-info-modal .event-modal-wrapper { width: 50% } .more-info-modal .event-modal-wrapper .main-box { max-height: 450px; overflow: auto } .more-info-modal .event-modal-header { width: 100% } .more-info-modal .event-modal-header h1, .more-info-modal .event-modal-header h4 { font-weight: 600; margin: 10px; color: #424242; } .more-info-modal .event-modal-header .left-side { float: left } .more-info-modal .event-modal-header .right-side { float: right } .more-info-modal .closeModal { background: none; width: initial; font-size: 24px; float: right; color: #424242; } .event { background: #F5F5F5; border-radius: 5px; overflow: hidden; display: inline-block; border-bottom: 3px solid #BDBDBD; width: 349px; } .rare_item { background: #2c3e50; border-radius: 5px; overflow: hidden; border-bottom: 3px solid rgba(0, 0, 0, 0.58) } .parrafo-evento { color: #424242; } .event-img, .rare-img_item, .large-rare-img_item { height: 90px; border-bottom: 3px solid rgba(0, 0, 0, 0.5); overflow: hidden; } .rare_item-margin:nth-child(even) { padding: 0 15px 15px 0 } .rare_item-margin:nth-child(odd) { padding: 0 0 15px 0 } .event-details, .rare-details_item { padding: 15px } .event-title, .rare-title_item, .large-rare-title_item { width: 283px; font-size: 16px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 15px 0; color: #737373; } .large-rare-title_item { width: 100%; font-size: 32px; font-weight: 300; line-height: 56px; margin: 0 } .event-wrapper { width: 100% } .event-date, .event-publisher, .event-more-info { font-weight: 300; color: #4a4a4a; font-size: 12px; margin: 5px 0 } .event-publisher { float: left } .event-more-info button { float: right; width: initial; font-weight: bold; margin: initial; background: none; padding: initial; border-radius: 0; color: #00796b; } .event-more-info button:hover, .event-more-info button:focus { background: none } .cajasecciong{ background-color: white; border: solid 1px #d3d3d2; width: 100%; height: auto; border-radius: 10px; display: flex; margin-bottom: 10px; } .owl-stage-outer { height: 220px; } .owl-nav{ display: none; } .noticiatitulod{ width: 100%; height: 70px; background-color:#e2e2e2; margin: 0px; border-radius: 10px 10px 0px 0px; padding: 10px 10px; display: flex; align-items: center; } .cajasecciong{ display: flex; flex-direction: column; } .noticiamin{ width: 50px; height: 50px; border-radius: 10px; border: 1px solid #d3d3d2; } .noticiainf{ margin-left: 5px; } .noticiainf .titulo{ color: #646464; text-decoration: none; font-size: 14px; } .noticiainf .noticiad{ color: #646464; text-decoration: none; font-size: 12px; } .inicor{ font-size: 11px; border: 2px solid #343434; background: #161616; padding-left: 7px; border-radius: 8px; margin-left: 70px; padding-top: 5px; height: 30px; width: 135px!important; transition: 1s; } .inicor a{ color: #fff; text-decoration: none; } .inicor a:hover{ color: #fff; text-decoration: none; } .inicor:hover{ background: #684209; transition:all 1.5s ease-in-out; cursos:pointer; } .cass input{ background-color: #e4e4e4; border-radius: 10px; border: 1px solid #a3a3a3; margin: 5px; padding: 5px; width: 300px; } .login .boton{ font-weight: bold; background-color: #e4e4e4; color: #666666; border-radius: 10px; border: 1px solid #a3a3a3; margin: 5px; padding: 5px; width: 300px; transition: 1s; } .login .boton:hover{ font-weight: bold; background-color: #b9b9b9; color: #494949; border-radius: 10px; border: 1px solid #a3a3a3; margin: 5px; padding: 5px; width: 300px; transition:all 1.5s ease-in-out; } .ajustesel .boton{ font-weight: bold; background-color: #e4e4e4; color: #666666; border-radius: 10px; border: 1px solid #a3a3a3; margin: 5px; padding: 5px; width: 300px; transition: 1s; } .ajustesel .boton:hover{ font-weight: bold; background-color: #b9b9b9; color: #494949; border-radius: 10px; border: 1px solid #a3a3a3; margin: 5px; padding: 5px; width: 300px; transition:all 1.5s ease-in-out; } .botonajuste a{ text-decoration: none; color: #494949; transition: 1s; } .botonajuste a:hover{ text-decoration: none; color: #494949; background-color: #e2e2e2; border-radius:20px; padding: 0px 7px 0px 7px; transition:all 1s ease-in-out; } .cs{ text-decoration: none; color: #a40404; transition: 1s; } .contenido img{ max-width: -webkit-fill-available; } .rangoh { box-shadow: 0px 13px 7px -3px rgba(0,0,0,0.1); border-radius: 7px; margin: 7px 12px; padding: 7px 10px; display: flex; background-image: url(https://images.habsite.es/album2098/news/g0x3Q0grk2l.png); align-items: center; background-repeat: no-repeat; justify-content: space-between; background-position: bottom -143px right; align-content: center; } .rangol{ box-shadow: 0px 13px 7px -3px rgba(0,0,0,0.1); border-radius: 7px; margin: 7px 12px; padding: 7px 10px; display: flex; background-image: url(https://i.imgur.com/5VhASiy.png); align-items: center; background-repeat: no-repeat; justify-content: space-between; background-position: bottom -143px right; align-content: center; } .rango{ border: 1px solid #b5b5b5; border-radius: 7px; margin: 7px 12px; padding: 7px 10px; display: flex; align-items: center; justify-content: space-between; align-content: center; } .infoequipoh { color: #ffffff; font-size: 20px; } .infoequipol { color: #ffffff; font-size: 20px; } .infoequipo{ color: #525252; } .infoequipo hr{ margin: 10px 0px 5px; width: 20% } .equipohead img{ display: contents; } .miembros{ display:flex; flex-wrap: wrap; margin: 7px 10px; } .miembro{ margin: 0px 5px 5px 5px; border: 1px solid #b5b5b5; border-radius: 7px; padding: 7px 10px; width: 198.5px; display: flex; align-items: center; } .miembrofoto{ background-color: #d3d3d2; width: 50px; height: 50px; border-radius: 100px; background-position-x: -5px; background-position-y: -15px; } .miembroinfo{ margin-left: 5px; color:#525252; font-size: 12px; } .equiposgeneralh{ background-color:white; border: solid 1px #d3d3d2; width: 100%; max-width: 1080px; height: auto; border-radius: 10px; padding: 10px 5px 10px 5px; background-image: url(); margin-bottom: 10px; display: flex; flex-direction: column; background-repeat: no-repeat; background-position: bottom -120px right 0px; } .equiposgeneral{ background-color: white; border: solid 1px #d3d3d2; width: 100%; max-width: 1080px; height: auto; border-radius: 10px; padding: 10px 5px 10px 5px; background-image: url(); display: flex; margin-bottom: 10px; display: flex; flex-direction: column; background-repeat: no-repeat; background-position: bottom -120px right 0px; } .calendario{ width: 100%; height: auto; border-radius: 10px; padding: 10px 5px 10px 5px; display: flex; margin-bottom: 10px; display: flex; flex-direction: column; } .cabeza-c{ width: 30px; float: left; height: 30px; margin-right: 10px; border-radius: 8px } .infopatotienda p{ } .tiendasele{ width:50px; height:50px; opacity: 0; } .tiendasele{ width: 10px; height: 20px; background-color: red; } .form-search{ display: flex; justify-content: center; margin-bottom: 5px; } .form-search input{ width: 70%; height: 40px; border-radius: 5px; border: solid 1px #d3d3d2; margin: 5px; padding-left: 5px; } .form-search .btn_search{ width: 25%; margin: 5px } .wiredtabla{ color: #555; font-size: 14px; width: 100%; border-collapse: separate; border-spacing: 5px; } .wiredtabla tr th{ text-align-last: center; border-radius: 7px; border: solid 1px #c7c7c7; padding: 5px; text-align: center; } .wiredtabla tr td{ text-align-last: center; border-radius: 7px; border: solid 1px #c7c7c7; padding: 10px 20px 10px 20px; text-align: center; } .wiredtabla tr td p{ margin-bottom: 0px; } .icono{ width: 20%; } .wired{ width: 30%; } .funcion{ width: 50%; } .registro{ margin:20px; display: flex; flex-direction: row; flex-wrap: wrap; } .textoregistro{ color: #555555; font-size: 13px; margin-bottom: 5px; } .casillaregistro input{ background-color: #ededed; border: solid 1px #c5c5c5; border-radius: 7px; width: 320px; height: 40px; padding: 10px; margin-top:10px; margin-right: 20px; margin-bottom: 20px; } .registro select{ background-color: #ededed; border: solid 1px #c5c5c5; border-radius: 7px; width: 320px; height: 40px; padding: 10px; margin-top:10px; margin-right: 20px; margin-bottom: 20px; } .botonregistro{ background-color: #6a5ac5; border: solid 1px #3a2d89; border-radius: 7px; width: 320px; height: 40px; padding: 10px; margin-top: 10px; margin-right: 20px; margin-bottom: 20px; color: white; display: flex; justify-content: center; align-items: center; transition: 0.3s; } .botonregistro:hover{ background-color: #3a2d89; border: solid 1px #3a2d89; border-radius: 7px; width: 320px; height: 40px; padding: 10px; margin-top: 10px; margin-right: 20px; margin-bottom: 20px; color: white; display: flex; justify-content: center; align-items: center; transition: 0.3s; } .fotodeperfil{ background-color: #ededed; border: solid 1px #c5c5c5; border-radius: 7px; width: 90px; height: 130px; padding: 10px; margin-top:10px; margin-bottom: 20px; display: flex; justify-content: center; align-items: center; } .dato{ margin-top: 15px; } .infodato{ width: 250px; border: solid 1px #c5c5c5; border-radius: 7px; background-color: #ededed; height: 32px; display: flex; align-items: center; justify-content: center; margin-top: 10px; margin-right: 15px; color: #6a6a6a; } .comandog{ background-color: #f7f7f7; border-radius: 7px; border: solid 1px #d9d9d9; padding: 10px; color: #545454; font-size: 12px; width: 140px; height: 195px; display: flex; flex-direction: column; flex-wrap: wrap; align-content: center; align-items: center; justify-content: space-around; margin: 5px; text-align: center; } .famoso{ border: solid 1px #d5d5d5; background-color: #ffffffb0; width: 130px; height: 130px; border-radius: 7px; box-shadow: 0px 0px 10px #d5d5d5; display: flex; align-items: flex-end; margin: 7px; } .famosoinfo{ display: flex; align-items: center; padding: 18px; flex-direction: column; justify-content: flex-end; } @keyframes rotation { from { transform: rotate(0deg) } to { transform: rotate(359deg) } }