API tools faq
paste
ItsDanyAndre

Gentle Sea - CSS

ItsDanyAndre
Dec 20th, 2020 (edited)
401
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 29.10 KB | None | 0 0
raw download clone embed print report
  1. /* --------------------------------- TABLILLAS DEL FORO --------------------------------- */
  2. .gscontadm {
  3.     background: var(--gscolor1);
  4.     border: 15px solid var(--gscolor2);
  5.     height: auto;
  6.     margin: 10px auto;
  7.     padding: 20px;
  8.     width: 500px;
  9. }
  10.  
  11. .gscontadm1 {
  12.     align-content: center;
  13.     background: var(--gsfondo2);
  14.     display: flex;
  15.     flex-direction: column;
  16.     height: 200px;
  17.     justify-content: center;
  18.     justify-items: center;
  19.     margin: 0 auto;
  20.     align-items: center;
  21.     width: 490px;
  22.     border: 5px solid var(--gscolor3);
  23. }
  24.  
  25. .gscontadmtitl {
  26.     color: var(--gscolor5);
  27.     font-family: Montserrat;
  28.     font-size: 35px;
  29.     font-style: normal;
  30.     font-variant: normal;
  31.     font-weight: 800;
  32.     text-align: center;
  33.     text-shadow: 1px 1px var(--gstexto);
  34.     text-transform: uppercase;
  35. }
  36.  
  37. .gscontadmtitl2 {
  38.     background: var(--gscolor5);
  39.     font-family: Montserrat;
  40.     font-size: 9px;
  41.     font-style: normal;
  42.     font-variant: normal;
  43.     font-weight: normal;
  44.     opacity: .8;
  45.     text-align: center;
  46.     width: 490px;
  47.     margin-top: 10px;
  48. }
  49.  
  50. .gsadmtxt {
  51.     width: 450px;
  52.     height: auto;
  53.     padding: 20px;
  54.     margin: 0 auto;
  55.     font: 12px 'Montserrat';
  56.     text-align: justify;
  57.     color: var(--gstexto);
  58. }
  59.  
  60. .gsadmregtit {
  61.     padding: 5px;
  62.     width: 450px;
  63.     text-align: center;
  64.     background: var(--gsfondo2);
  65.     margin: 0 auto;
  66.     font: 20px 'Merienda';
  67.     color: var(--gstexto);
  68.     text-shadow: 1px 1px var(--gscolor3);
  69. }
  70. .gsadmregcont {
  71.     width: 450px;
  72.     margin: 0 auto;
  73.     display: flex;
  74.     align-items: center;
  75.     justify-content: space-around;
  76.     justify-items: center;
  77. }
  78. .gsadmreg1, .gsadmreg2 {
  79.     border: 1px solid var(--gscolor5);
  80.     padding: 20px;
  81.     width: 180px;
  82. }
  83. .gsadmreg1 m, .gsadmreg2 m {
  84.     width: 150px;
  85.     text-align: justify;
  86.     font: 10px 'Montserrat';
  87.     line-height: 20px;
  88. }
  89. .gsadmreg1 p, .gsadmreg2 p {
  90.     width: 150px;
  91.     background: var(--gscolor4);
  92.     margin: 0 auto;
  93.     text-align: center;
  94.     font: 11px 'Montserrat';
  95.     font-weight: 600;
  96. }
  97.  
  98. .gsadmst {
  99.     font: 15px 'Merienda';
  100.     position: absolute;
  101.     background: var(--gscolor3);
  102.     text-align: center;
  103.     width: 180px;
  104.     margin-top: -30px;
  105. }
  106.  
  107. /* --------------------------------- COLORES Y FUENTES DEL FORO --------------------------------- */
  108. :root {
  109. /*COLORES*/
  110.    
  111.   --gscolor1: #D3E2B6;
  112.   --gscolor2: #C3DBB4;
  113.   --gscolor3: #AACCB1;
  114.   --gscolor4: #87BDB1;
  115.   --gscolor5: #68B3AF;
  116.   --gstexto: #4B4B4B; /*color de texto*/
  117.   --gstexto1: #222;
  118.   --gsfondo: linear-gradient(142deg, rgba(211,226,182,1) 20%, rgba(170,204,177,1) 77%);
  119.   --gsfondo2:linear-gradient(142deg, rgba(170,204,177,1) 14%, rgba(104,179,175,1) 83%);
  120.   /*linear-gradient(142deg, rgba(104,179,175,1) 20%, rgba(170,204,177,1) 77%);*/
  121.  
  122.    
  123. /*IMAGENES*/
  124.   --imgbanner:url('http://placehold.it/970x470') center;
  125.   --gsadmin1:url('http://placehold.it/130x40') center;
  126.   --gsadmin2:url('http://placehold.it/130x40') center;
  127.   --gsadmin3:url('http://placehold.it/130x40') center;
  128.   --gsadmin4:url('http://placehold.it/130x40') center;
  129.   --gsadmin5:url('http://placehold.it/130x40') center;
  130.   --gsadmin6:url('http://placehold.it/130x40') center;
  131.  
  132. /*COLORES DE GRUPOS*/
  133.   --gsgrupo1:#FFE4A1;
  134.   --gsgrupo2:#F79CA7;
  135.   --gsgrupo3:#C57CBC;
  136.   --gsgrupo4:#9882C3;
  137.   --gsgrupo5:#AD549C;
  138.   --gsgrupo6:#615FA8;
  139.   --gsgrupo7:#355983;
  140.    
  141.  
  142. }  
  143.  
  144. /* BARRA DE DESPLAZAMIENTO */
  145. ::-webkit-scrollbar {
  146.   width: 5px;
  147.   height: 5px;
  148. }
  149. ::-webkit-scrollbar-button {
  150.   width: 0px;
  151.   height: 0px;
  152. }
  153. ::-webkit-scrollbar-thumb {
  154.   background: var(--gscolor5);
  155. }
  156. ::-webkit-scrollbar-track {
  157.   background:var(--gscolor1);
  158. }
  159. ::-webkit-scrollbar-corner {
  160.   background: transparent;
  161. }
  162.  
  163. * { scrollbar-color: var(--gscolor5) var(--gscolor1); }
  164.  
  165. a:hover{
  166.   text-decoration:none!important;
  167. }
  168.  
  169. *::selection{
  170.  background:var(--gscolor5);
  171.  color:white;
  172. }
  173.  
  174. #fa_toolbar {
  175.   display: none;
  176. }
  177.  
  178. #search-box, p.rightside, ul.linklist {
  179.     display: none;
  180. }
  181.  
  182. a.button2, body:last-child a.button1, button.button2, input.button1, input.button2 {
  183.     padding: 5px;
  184.     background: var(--gsfondo);
  185.     border: 2px solid var(--gscolor1);
  186.     color: var(--gstexto);
  187.     font-size: 10px;
  188. }
  189.  
  190. /* --------------------------------- CUERPO PRINCIPAL DEL FORO, FONDO Y NAVBAR --------------------------------- */
  191.  
  192. /*Fondo del foro*/
  193. body#phpbb{
  194.   background-color: #aaccb1;
  195.   background-image: url("https://www.transparenttextures.com/patterns/diagonal-striped-brick.png");
  196.   background-attachment: fixed;
  197. }
  198.  
  199. /*Cuerpo del foro*/
  200. #wrap {
  201.   width: 1000px;
  202.   min-width:1000px;
  203.   max-width:1000px;
  204.   padding: 30px;
  205.   border: 30px solid var(--gscolor2);
  206.   background: var(--gscolor4);
  207. }
  208. /*Contenedor del Logo del foro*/
  209. #logo-desc {
  210.     margin: 0 auto;
  211.     text-align: center;
  212.     width: 970px;
  213.     height: 470px;
  214. }
  215. /*El banner del foro (imagen)*/
  216. #logo-desc img {
  217.     width: 970px;
  218.     max-width: 970px;
  219.     height: 470px;
  220.     max-height: 470px;
  221.     background:var(--imgbanner);
  222.      
  223. }
  224. /*Contenedor del titulo y subtitulo del foro*/
  225. .gstitlep {
  226.     align-content: center;
  227.     display: flex;
  228.     flex-direction: column;
  229.     justify-content: center;
  230.     position: absolute;
  231.     width: 970px;
  232.     margin-left: 5px;
  233. }
  234. /*Titulo del Foro*/
  235. #site-title, #site-title h1 {
  236.     font-size: 70px;
  237.     font-weight: 700;
  238.     padding-top: 15px;
  239.     text-transform: uppercase;
  240.     color: var(--gscolor5);
  241.     text-shadow: 1px 1px var(--gstexto);
  242. }
  243. /*Subtitulo del Foro*/
  244. #logo-desc p {
  245.     background: var(--gscolor4);
  246.     color: var(--gstexto);
  247.     margin: 0 auto;
  248.     padding: 0;
  249.     text-align: center;
  250.     width: 800px;
  251.     z-index: 99;
  252.     margin-top: -50px;
  253.     opacity: 0.8;
  254. }
  255. /*Contenedor de la Barra de Navegación*/
  256. ul.linklist.navlinks {
  257.     display: flex;
  258.     position: fixed;
  259.     top: 0px;
  260.     left: 0px;
  261.     width: 100%;
  262.     text-align: right;
  263.     border-bottom: 10px solid var(--gscolor5);
  264.     opacity:0.8;
  265. }
  266. /*Barra de Navegación*/
  267. .navlinks {
  268.     background: var(--gscolor4);
  269.     font: 10px 'Montserrat';
  270.     text-transform: uppercase;
  271.     height: 30px;
  272.     display: flex;
  273.     justify-content: center;
  274.     align-content: center;
  275.     z-index:99!important;
  276. }
  277.  
  278. ul.linklist li {
  279.     display: inline;
  280.     line-height: 30px;
  281. }
  282. a.mainmenu {
  283.     color: var(--gstexto);
  284.     text-shadow: 1px 1px var(--gscolor2);
  285. }
  286. /*Colocar los iconos al lado de cada link, para cambiarlo se va a la página de "Honeybee" y se busca el código
  287. para reemplazar el  content:'\ea62' dependiendo del icono que se quiera*/
  288. a.mainmenu[href*="/"]:before {content:'\ea62'; color: var(--gstexto); font: 10px 'Honeybee'; padding: 6px;}
  289. a.mainmenu[href*="/memberlist"]:before {content:'\e275'; color: var(--gstexto); font: 10px 'SaturnIcons'; padding: 6px;}
  290. a.mainmenu[href*="/groups"]:before {content:'\e123'; color: var(--gstexto); font: 10px 'SaturnIcons'; padding: 6px;}
  291. a.mainmenu[href*="/profile?mode=editprofile"]:before {content:'\eb46'; color: var(--gstexto); font: 10px 'Honeybee'; padding: 6px;}
  292. a.mainmenu[href*="/privmsg?folder=inbox"]:before {content:'\ebda'; color: var(--gstexto); font: 10px 'Honeybee'; padding: 6px;}
  293. a.mainmenu[href*="/login?logout=1"]:before {content:'\eaa1'; color: var(--gstexto); font: 10px 'Honeybee'; padding: 6px;}
  294. a.mainmenu[href*="/login"]:before {content:'\ea9f'; color: var(--gstexto); font: 10px 'Honeybee'; padding: 6px;}
  295. a.mainmenu[href*="/register"]:before {content:'\e940'; color: var(--gstexto); font: 10px 'Honeybee'; padding: 6px;}
  296.  
  297. /*Texto de "Bienvenido, USER" */
  298. .gsbienv {
  299.     position: absolute;
  300.     left: 2px;
  301.     color: var(--gstexto);
  302. }
  303.  
  304. /* --------------------------------- TABLON DE ANUNCIOS --------------------------------- */
  305. /*Contenedor del tablón*/
  306. .gstabcont {
  307.     width: 950px;
  308.     height: 200px;
  309.     padding: 20px;
  310.     background: var(--gsfondo);
  311.     margin: 0 auto;
  312.     display: flex;
  313.     flex-direction: row;
  314.     align-items: center;
  315.     justify-content: space-between;
  316. }
  317. .gstabcont1,.gstabcont2,.gstabcont3 {
  318.     width: 300px;
  319.     height: 200px;
  320. }
  321. /*Subtitulos*/
  322. .gstabnewstitle, .gstabadmintitle, .gsultimostemstitle {
  323.     font: 20px 'Merienda';
  324.     text-align: center;
  325.     color: var(--gstexto);
  326.     text-shadow: 1px 1px var(--gscolor5);
  327.     background: var(--gsfondo2);
  328. }
  329. /*Contenedor de las noticias*/
  330. .gstabnewscont {
  331.     border-bottom: 5px solid transparent;
  332.     height: 90px;
  333.     overflow: auto;
  334.     padding: 10px;
  335.     width: 250px;
  336.     margin: 5px auto;
  337. }
  338. /*Texto de las Noticias*/
  339. .gstabnewscont m {
  340.     align-items: center;
  341.     color: var(--gstexto1);
  342.     display: flex;
  343.     align-items: flex-start;
  344.     justify-content: space-around;
  345.     font-family: Montserrat;
  346.     font-size: 11px;
  347.     text-align: justify;
  348.     padding: 5px;
  349. }
  350. /*Fecha de las Noticias*/
  351. .gstabnewscont p {
  352.     background: var(--gscolor5);
  353.     color: var(--gscolor1);
  354.     font-family: Merienda;
  355.     font-size: 10px;
  356.     font-style: normal;
  357.     font-variant: normal;
  358.     font-weight: normal;
  359.     padding: 5px;
  360.     text-shadow: 1px 1px var(--gstexto1);
  361.     border-right: 10px solid var(--gscolor1);
  362. }
  363. /*Links Importantes*/
  364. .gstablinks {
  365.     width: 300px;
  366.     height: 55px;
  367.     overflow: hidden;
  368.     display: flex;
  369.     align-items: center;
  370.     justify-content: space-around;
  371.     flex-flow: wrap;
  372. }
  373.  
  374. span.gslinks {
  375.     padding: 3px 7px 3px 7px;
  376.     background: var(--gscolor5);
  377.     color: var(--gscolor1);
  378.     text-shadow: 1px 1px var(--gstexto);
  379.     transition: all .5s linear;
  380. }
  381.  
  382. span.gslinks:hover{
  383.     background: var(--gscolor4);
  384.     transition: all .5s linear;
  385. }
  386. /*Administradores*/
  387. .gstabadmin {
  388.     width: 300px;
  389.     max-width: 300px;
  390.     height: 170px;
  391.     margin-top: 2px;
  392.     overflow: hidden;
  393.     display: flex;
  394.     align-items: center;
  395.     justify-content: space-around;
  396.     flex-flow: wrap;
  397. }
  398. .gsadmins {
  399.     width: 130px;
  400.     height: 40px;
  401.     padding: 5px;
  402.     border: 1px solid var(--gscolor5);
  403. }
  404. .gsadmins1 {
  405.     background: var(--gscolor5);
  406.     opacity: 0.8;
  407.     text-align: center;
  408.     margin-top: 25px;
  409.     color: var(--gstexto1);
  410.     font: 10px 'Montserrat';
  411. }
  412. /*últimos temas*/
  413. #left{
  414.     display: none;
  415.     position: absolute;
  416. }
  417. .gsultimostems1 {
  418.     width: 300px;
  419.     height: 175px;
  420. }
  421. .gsultimostems1 a{
  422.     color: var(--gstexto1);
  423.     font: 10px 'Montserrat';
  424. }
  425. #comments_scroll_div {
  426.     font-family: Montserrat;
  427.     font-size: 10px;
  428.     margin: 0 auto;
  429.     max-height: 150px;
  430.     height: 150px;
  431.     padding: 10px;
  432.     width: 250px;
  433. }
  434. #comments_scroll_div a{
  435.     color: var(--gstexto1);
  436.     font: 10px 'Montserrat';
  437.     text-transform: uppercase;
  438. }  
  439. #comments_scroll_div a.activa, #comments_scroll_div.activa a:hover {}
  440.  
  441.  
  442. /* --------------------------------- CATEGORIAS --------------------------------- */
  443. /*Contenedor del titulo de categorias*/
  444. li.header dl.icon {
  445.     min-height: 0;
  446.     background: var(--gsfondo);
  447.     padding: 20px;
  448. }
  449. /*Eliminar el titulo de "temas, mensajes, últimos mensajes y vistos"*/
  450. li.header dl.icon dd.topics{display:none;}
  451. li.header dl.icon dd.posts{display:none;}
  452. li.header dl.icon dd.lastpost{display:none;}
  453. li.header dl.icon dd.views{display:none;}
  454.  
  455. /*Titulo de Categorias*/
  456. .table-title, .table-title h2 {
  457.     display: inline;
  458.     font-family: Montserrat;
  459.     font-size: 25px;
  460.     font-style: normal;
  461.     font-variant: normal;
  462.     font-weight: 500;
  463.     text-shadow: 2px 2px var(--gscolor4);
  464.     color: var(--gstexto);
  465. }
  466.  
  467. /* --------------------------------- PRESENTACION DE FOROS - PAGINA PRINCIPAL --------------------------------- */
  468. /*Titulo de foros*/
  469. a.forumtitle {
  470.     font-family: Merienda,serif;
  471.     font-size: 20px;
  472.     font-weight: 700;
  473.     text-decoration: none;
  474.     color: var(--gscolor2);
  475.     text-shadow: 2px 1px var(--gstexto);
  476. }
  477.  
  478. a.forumtitle:hover{ color: var(--gscolor2);}
  479.  
  480. /*Descripción de los foros*/
  481.   /*contenedor de la descripción*/
  482. .gscontforo{
  483.     width: 620px;
  484.     display: flex;
  485.     justify-content: space-between;
  486. }
  487.  /*texto de la descripción*/
  488. .gsconttext{
  489.     width: 190px;
  490.     height: 150px;
  491.     background: var(--gscolor1);
  492.     display: flex;
  493.     align-items: center;
  494.     justify-content: center;
  495. }
  496. .gsconttext1{
  497.     width: 140px;
  498.     height: 100px;
  499.     padding: 5px;
  500.     background: var(--gscolor2);
  501.     overflow: auto;
  502.     font: 11px 'Montserrat';
  503.     text-align: justify;
  504.     border: 10px solid var(--gscolor2);
  505.     color: var(--gstexto);
  506. }
  507.  /*imagen de la descripción*/
  508. .gscontimg{
  509.     width: 230px;
  510.     height: 130px;
  511.     background: var(--gscolor1);
  512.     border: 10px solid var(--gscolor1);
  513.     background-size: cover;
  514. }
  515.   /*links de la descripción*/
  516. .gscontlink{
  517.     width: 140px;
  518.     height: 120px;
  519.     padding: 5px;
  520.     border: 10px solid var(--gscolor1);
  521.     background: var(--gscolor1);
  522.     display: flex;
  523.     flex-direction: column;
  524.     items-align: center;
  525.     text-align: center;
  526.     overflow: auto;
  527. }
  528. .gscontlink1{
  529.     width: 120px;
  530.     padding: 5px;
  531.     background: var(--gscolor2);
  532.     margin-top: 2px;
  533. }
  534. .gscontlink1 a{
  535.     font: 10px 'Montserrat';
  536.     text-decoration: none;
  537.     color: var(--gstexto);
  538. }
  539.  
  540. /*Mensajes, Temas y Último Post*/
  541. ul.topiclist.forums dl.icon dd.topics {
  542.     background: var(--gscolor2);
  543.     height: 40px;
  544.     margin-left: 690px;
  545.     margin-top: 120px;
  546.     position: absolute;
  547.     width: 100px;
  548.     font: 20px 'Montserrat';
  549.     line-height: 40px;
  550. }
  551. ul.topiclist.forums dl.icon dd.topics:after{content:' T'; font: 20px 'Montserrat';}
  552.  
  553. ul.topiclist.forums dl.icon dd.posts{
  554.     background: var(--gscolor2);
  555.     position: absolute;
  556.     width: 100px;
  557.     height: 40px;
  558.     margin-top: 120px;
  559.     margin-left: 840px;
  560.     font: 20px 'Montserrat';
  561.     line-height: 40px;
  562. }
  563.  
  564. ul.topiclist.forums dl.icon dd.posts:after{content:' M'; font: 20px 'Montserrat';}
  565.  
  566. ul.topiclist.forums dl.icon dd.lastpost {
  567.     display: flex;
  568.     flex-direction: column;
  569.     align-items: center;
  570.     justify-content: center;
  571.     background: var(--gscolor2);
  572.     width: 250px;
  573.     height: 60px;
  574.     position: absolute;
  575.     margin-left: 690px;
  576.     margin-top: 46px;
  577.     text-align: center;
  578. }
  579. /* --------------------------------- ESTADISTICAS DEL FORO --------------------------------- */
  580. /*Contenedor de las estadísticas*/
  581. .gsestadcont {
  582.     align-items: center;
  583.     background: var(--gsfondo);
  584.     height: 200px;
  585.     margin: 0 auto;
  586.     padding: 20px;
  587.     width: 950px;
  588.     display: flex;
  589.     align-items: baseline;
  590.     justify-items: center;
  591. }
  592.  
  593. /*Subtitulos*/
  594. .gsconecttitle, .gslasttitle, .gsnumtitle {
  595.     font: 20px 'Merienda';
  596.     text-align: center;
  597.     color: var(--gstexto);
  598.     text-shadow: 1px 1px var(--gscolor5);
  599.     background: var(--gsfondo2);
  600. }
  601.  
  602. /*Conectados*/
  603. .gsconectados {
  604.     width: 360px;
  605. }
  606. .gsconect {
  607.     font-size: 0;
  608.     width: 300px;
  609.     height: 160px;
  610.     max-height: 160px;
  611.     overflow: auto;
  612.     margin: 5px auto;
  613. }
  614. .gsconect br{display:none;}
  615. .gsconect a{font:12px 'Montserrat';}
  616.  
  617. /*Contenedor 2*/
  618. .gsestadcont0 {
  619.     width: 600px;
  620. }
  621. /*Grupos*/
  622. .gsestadcont1 {
  623.     align-items: center;
  624.     display: flex;
  625.     flex-flow: wrap;
  626.     justify-content: space-around;
  627.     overflow: hidden;
  628.     width: 590px;
  629.     margin: 0 auto;
  630.     height: 40px;
  631. }
  632. .gsestadcont1 span {
  633.     background: var(--gscolor5);
  634.     border: 1px solid var(--gscolor2);
  635.     padding: 5px;
  636.     font: 14px 'Montserrat';
  637.     font-weight: 600;
  638.     text-transform: uppercase;
  639.     text-shadow: 1px 1px var(--gstexto);
  640. }
  641. .gsgroup1{color:var(--gsgrupo1);}
  642. .gsgroup2{color:var(--gsgrupo2);}
  643. .gsgroup3{color:var(--gsgrupo3);}
  644. .gsgroup4{color:var(--gsgrupo4);}
  645. .gsgroup5{color:var(--gsgrupo5);}
  646. .gsgroup6{color:var(--gsgrupo6);}
  647. .gsgroup7{color:var(--gsgrupo7);}
  648.  
  649. /*Contenedor de los últimos conectados y estadísticas*/
  650. .gsestadcont2 {
  651.     height: 200px;
  652.     padding: 20px;
  653.     width: 580px;
  654.     display: flex;
  655.     justify-content: space-between;
  656.     align-content: space-between;
  657. }
  658. /*últimos conectados*/
  659. .gs24horas {
  660.     width: 270px;
  661.     height: 150px;
  662. }
  663. .gslast {
  664.     font-size: 0;
  665.     width: 240px;
  666.     height: 105px;
  667.     max-height: 105px;
  668.     margin: 5px auto;
  669.     overflow: auto;
  670. }
  671. .gslast a{font:12px 'Montserrat';}
  672. /*Estadísticas: "Número de miembros", "Número de mensajes"...*/
  673. .gsnumcont {
  674.     width: 270px;
  675.     height: 150px;
  676. }
  677. p.gsnum {
  678.     text-align: center;
  679.     width: 240px;
  680.     padding: 5px;
  681.     margin: 2px auto;
  682.     background: var(--gscolor2);
  683.     color: var(--gstexto);
  684. }
  685.  
  686.  
  687. /* --------------------------------- AFILIADOS --------------------------------- */
  688. /*Contenedor de los afiliados*/
  689. .gsafiliados {
  690.     width: 950px;
  691.     padding: 20px;
  692.     height: 230px;
  693.     margin: 0 auto;
  694.     background: var(--gsfondo);
  695.     display: flex;
  696.     align-items: flex-start;
  697.     justify-content: space-around;
  698.     justify-items: center;
  699. }
  700. .gsafili1 {
  701.     align-content: center;
  702.     align-items: center;
  703.     display: flex;
  704.     flex-direction: column;
  705.     height: 190px;
  706.     justify-content: space-around;
  707.     padding: 20px;
  708.     width: 300px;
  709. }
  710. /*Contenedor de los créditos*/
  711. .gsafilcreditos{
  712.     width: 320px;
  713.     height: 130px;
  714. }
  715. /*Titulos*/
  716. .gscredtit, .gsdirctit {
  717.     width: 300px;
  718.     padding: 10px;
  719.     height: 15px;
  720.     background: var(--gsfondo2);
  721.     font: 15px 'Merienda';
  722.     text-align: center;
  723.     text-shadow: 1px 1px var(--gscolor1);
  724.     display: flex;
  725.     align-items: center;
  726.     justify-content: center;
  727. }
  728. /*Texto de los créditos*/
  729. .gscred  {
  730.     width: 270px;
  731.     height: 80px;
  732.     margin: 5px auto;
  733.     text-align: justify;
  734.     overflow: auto;
  735.     font: 11px 'Montserrat';
  736. }
  737. .gscred a{
  738.     color: var(--gstexto);
  739.     font-family: Montserrat;
  740.     font-size: 11px;
  741.     font-weight: 600;
  742. }
  743. /*Directorios*/
  744. .gsafildirect{
  745.     width: 320px;
  746.     height: 100px;
  747. }
  748. .gsdirc {
  749.     display: flex;
  750.     align-content: center;
  751.     justify-content: space-around;
  752. }
  753. .gsdirc img {
  754.     width: 60px;
  755.     height: 60px;
  756.     background-size: cover;
  757.     border: 1px solid var(--gscolor5);
  758.     margin-top: 5px;
  759. }
  760. /*Contenedor de los afiliados hermanos y élite*/
  761. .gsafili2 {
  762.     align-items: center;
  763.     display: flex;
  764.     flex-direction: column;
  765.     height: 190px;
  766.     justify-content: space-around;
  767.     padding: 20px;
  768.     width: 580px;
  769. }
  770. /*Hermanos*/
  771. .gsafilherm {
  772.     width: 570px;
  773.     text-align: center;
  774. }
  775.  
  776. .gsafilherm img {
  777.     width: 100px;
  778.     height: 50px;
  779.     background-size: cover;
  780.     border: 1px solid var(--gscolor5);
  781. }
  782. /*Élite*/
  783. .gsafileli {
  784.     width: 570px;
  785.     text-align: center;
  786. }
  787. .gsafileli img {
  788.     width: 50px;
  789.     height: 50px;
  790.     background-size: cover;
  791.     border: 1px solid var(--gscolor5);
  792. }
  793.  
  794.  
  795. /* --------------------------------- FOOTER DEL FORO (índice, crear foro, contactar....)--------------------------------- */
  796. ul.linklist.clearfix {
  797.     background: var(--gsfondo);
  798.     color: var(--gstexto);
  799.     font-family: Montserrat;
  800.     font-size: 10px;
  801.     font-style: normal;
  802.     font-variant: normal;
  803.     font-weight: normal;
  804.     padding: 5px;
  805.     width: 990px;
  806.     margin-left: -10px;
  807. }
  808.  
  809. ul.linklist.clearfix a{
  810.     color: var(--gstexto);
  811.     font: 10px 'Montserrat';
  812. }
  813. .copyright a {
  814.     color: var(--gstexto);
  815.     text-shadow: 1px 1px var(--gscolor1);
  816. }
  817.  
  818. /* --------------------------------- INTERIOR DE LOS FOROS --------------------------------- */
  819. /*Titulo del foro*/
  820. h1.page-title {
  821.     background: var(--gsfondo);
  822.     margin: 0 auto;
  823.     padding: 20px;
  824.     width: 950px;
  825.     text-align: center;
  826.     text-transform: uppercase;
  827. }
  828. h1.page-title a{
  829.     font: 25px 'Montserrat';
  830.     font-weight: 500;
  831.     text-shadow: 2px 2px var(--gscolor4);
  832.     color: var(--gstexto);
  833.     margin-left: 15px;
  834. }
  835. /*Nuevo boton, buscar, ruta del foro y "marcar temas como leidos"*/
  836. .topic-actions {
  837.     align-items: center;
  838.     display: flex;
  839.     align-items: flex-start;
  840.     font-family: Montserrat;
  841.     font-size: 12px;
  842. }
  843. .topic-actions .pagination {
  844.     display: flex;
  845.     width: auto;
  846.     height: 10px;
  847. }
  848. p.nomargin.path a, .pagination a {
  849.     font: 10px 'Montserrat';
  850.     color: var(--gstexto);
  851. }
  852. p.path {
  853.     margin-top: 7px;
  854.     margin-left: 10px;
  855. }
  856. /*Contenedores de Anuncios&Notas y Temas*/
  857. li.header dl.icon {
  858.    background: var(--gsfondo);
  859.     min-height: 0;
  860.     padding: 20px;
  861.     font: 15px 'Merienda';
  862.     color: var(--gstexto);
  863.     text-shadow: 2px 2px var(--gscolor4);
  864.    
  865. }
  866. li.header dl.icon dt, li.header dd.dterm{ text-transform: capitalize;}
  867.  
  868. /*Temas*/
  869. ul.topiclist li.row dl {
  870.     padding: 5px;
  871. }
  872. a.topictitle {
  873.     font-family: 'Montserrat';
  874.     font-size: 1.1em;
  875.     font-weight: 700;
  876.     text-decoration: none;
  877.     color: var(--gstexto);
  878.     text-shadow: 1px 1px var(--gscolor1);
  879. }
  880.  
  881. /* --------------------------------- INTERIOR DE LOS TEMAS --------------------------------- */
  882. /*Ruta del tema*/
  883. .pathname-box {
  884.     font: 11px 'Montserrat';
  885.     color: var(--gstexto);
  886.     display: flex;
  887.     align-self: center;
  888. }
  889. .pathname-box a {
  890.     font: 11px 'Montserrat';
  891.     color: var(--gstexto);
  892. }
  893.  
  894. .gspostpagi {
  895.     margin-left: 300px;
  896.     font: 11px 'Montserrat';
  897.     color: var(--gstexto);
  898.     margin-top: 5px;
  899. }
  900.  
  901. /*Contentedor del titulo*/
  902. .gsposttitle {
  903.     background: var(--gsfondo);
  904.     padding-top: 30px;
  905.     text-align: center;
  906.     height: auto;
  907. }
  908. /*Contenedor del autor y los botones de edición, eliminar...*/
  909. .gsposttitle1 {
  910.     align-items: flex-end;
  911.     display: flex;
  912.     height: 40px;
  913.     justify-content: space-between;
  914.     padding: 10px;
  915.     padding-top: 20px;
  916.  
  917. }
  918. /*Autor del post e Iconos*/
  919. p.author {
  920.     font: 11px 'Montserrat';
  921. }
  922. .postbody ul.profile-icons {
  923.     margin-top: 0px;
  924.     margin-right: 0px;  
  925. }
  926. /*Titulo del post*/
  927. .postbody .topic-title a{
  928.     font: 25px 'Montserrat';
  929.     font-weight: 600;
  930.     color: var(--gstexto);
  931.     text-shadow: 1px 1px var(--gscolor5);
  932.     text-align: center;
  933. }
  934. /*Número de Páginas*/
  935. .pagination span strong, p.pagination span strong {
  936.     background: var(--gscolor2);
  937.     border: 1px solid var(--gscolor1);
  938.     color: var(--gstexto);
  939. }
  940. .pagination span a, p.pagination span a {
  941.     background: var(--gscolor1);
  942.     border: 1px solid var(--gscolor1);
  943.     color: var(--gstexto);
  944. }
  945. /*Contenedor del texto de los mensajes*/
  946. .postbody {
  947.     border-bottom: 5px solid var(--gscolor2);
  948. }
  949. .postbody .content {
  950.     font: 13px 'Montserrat';
  951.     text-align: justify;
  952.     width: 95%;
  953.     margin: 0 auto;
  954.     color: var(--gstexto1);
  955. }
  956.  
  957. /*Contenedor de las "Citas"*/
  958. blockquote {
  959.     border-left: 5px solid var(--gscolor1);
  960.     font-size: .95em;
  961.     margin: 1em 1px 1em 25px;
  962.     overflow: hidden;
  963. }
  964. blockquote cite {
  965.     display: block;
  966.     font-size: 13px;
  967.     font-style: normal;
  968.     font-weight: 700;
  969.     color: var(--gstexto1);
  970.     text-shadow: 1px 1px var(--gscolor1);
  971. }
  972. /*Contenedor del "Codebox" */
  973. dl.codebox {
  974.     background: var(--gsfondo);
  975.     border-left: 20px solid var(--gscolor2);
  976.     font-size: 1em;
  977.     padding: 3px;
  978.     color: var(--gstexto1);
  979. }
  980. dl.codebox dt {
  981.     border-bottom: 1px solid var(--gscolor1);
  982.     display: block;
  983.     font-size: 12px;
  984.     font-weight: 700;
  985.     margin-bottom: 3px;
  986.     color: var(--gstexto1);
  987.     text-shadow: 1px 1px var(--gscolor5);
  988. }
  989.  
  990. dl.codebox code {
  991.     color: var(--gstexto);
  992.     display: block;
  993.     font-family: "Courier New",monospace;
  994.     font-size: .9em;
  995.     height: auto;
  996.     line-height: 1.3em;
  997.     margin: 2px 0;
  998.     max-height: 200px;
  999.     overflow: auto;
  1000.     padding-top: 5px;
  1001.     white-space: normal;
  1002. }
  1003. .codebox dd {
  1004.     margin-left: 10px;
  1005. }
  1006.  
  1007. /* --------------------------------- PERFIL EN TEMAS --------------------------------- */
  1008. /*Contenedor del avatar*/
  1009. .gsavatarcont {
  1010.     width: 230px;
  1011.     margin: 0 auto;
  1012.     background: var(--gsfondo);
  1013. }
  1014. /*Nombre de Usuario*/
  1015. .gsavatarname {
  1016.     height: 85px;
  1017.     margin-top: -5px;
  1018.     padding: 20px;
  1019.     width: 190px;
  1020.     display: flex;
  1021.     flex-direction: column;
  1022.     align-items: center;
  1023.     justify-content: center;
  1024. }
  1025. .gsavatarname1 {
  1026.     font: 20px 'Merienda';
  1027. }
  1028. .gsavatarname1 a {
  1029.     text-shadow: 1px 2px var(--gscolor5);
  1030. }
  1031. /*Rango*/
  1032. .gsavatarrango {
  1033.     border-top: 1px solid var(--gscolor4);
  1034.     color: var(--gstexto);
  1035.     font-family: Montserrat;
  1036.     font-size: 12px;
  1037.     font-style: normal;
  1038.     font-variant: normal;
  1039.     font-weight: 600;
  1040.     padding-top: 3px;
  1041.     text-align: center;
  1042.     text-transform: uppercase;
  1043.     width: 200px;
  1044. }
  1045. /*Avatar*/
  1046. .gsavatar {
  1047.     width: 230px;
  1048.     display: flex;
  1049.     flex-direction: column;
  1050.     align-items: center;
  1051. }
  1052.  
  1053. .gsavatar1 img {
  1054.     border: 1px solid var(--gscolor5);
  1055. }
  1056. /*Contenedor de los campos del perfil*/
  1057. .gsavatarfields {
  1058.     align-items: center;
  1059.     background: var(--gscolor2);
  1060.     display: flex;
  1061.     flex-direction: column;
  1062.     height: 290px;
  1063.     margin-top: 5px;
  1064.     position: absolute;
  1065.     width: 190px;
  1066.     transition: all 0.5s ease-in-out;
  1067.     opacity: 0;
  1068. }
  1069.  
  1070. .gsavatar:hover .gsavatarfields{opacity:0.8; transition: all 0.5s ease-in-out;}
  1071.  
  1072. .gsavfield1 {
  1073.     display: flex;
  1074.     flex-direction: column;
  1075.     margin-top: 5px;
  1076. }
  1077. /*Titulo del campo*/
  1078. .gsavfieldlabel {
  1079.     background: var(--gscolor3);
  1080.     color: var(--gstexto1);
  1081.     font-family: Merienda;
  1082.     font-size: 11px;
  1083.     font-style: normal;
  1084.     font-variant: normal;
  1085.     font-weight: 600;
  1086.     padding: 10px;
  1087.     text-align: center;
  1088.     width: 150px;
  1089. }
  1090. /*Contenido del campo*/
  1091. .gsavfieldcont {
  1092.     color: var(--gstexto1);
  1093.     font-family: Montserrat;
  1094.     font-size: 10px;
  1095.     font-style: normal;
  1096.     font-variant: normal;
  1097.     font-weight: 600;
  1098.     height: auto;
  1099.     padding: 2px;
  1100.     text-align: center;
  1101.     width: 166px;
  1102. }
  1103.  
  1104. .gsavatarfields2 {
  1105.     width: 210px;
  1106.     height: 50px;
  1107.     padding: 10px;
  1108.     display: flex;
  1109.     align-items: center;
  1110.     justify-content: space-around;
  1111. }
  1112. /* ---------------------------------Ttulos Terciarios - Respuestas Rápidas + Previsualización de Mensaje... --------------------------------- */
  1113. .h3 {
  1114.     font-weight: 700;
  1115.     background: var(--gsfondo);
  1116.     padding: 10px;
  1117.     color: var(--gstexto);
  1118.     text-shadow: 1px 1px var(--gscolor4);
  1119. }
  1120.  
  1121.  
  1122. /* ---------------------------------Ttulos en la edición del perfil --------------------------------- */
  1123. #cp-main h1 {
  1124.     border-bottom: none;
  1125.     color: #212121;
  1126.     margin-left: 10px;
  1127.     padding: 10px;
  1128.     text-align: center;
  1129.     font: 20px 'Montserrat';
  1130. }
  1131.  
  1132. ul#privmsgs-menu {
  1133.     color: var(--gstexto1);
  1134.     font-weight: 500;
  1135.     text-shadow: 1px 1px var(--gscolor1);
  1136. }
  1137.  
  1138. ul.topiclist li.header {
  1139.     background: var(--gsfondo);
  1140.     padding: 10px;
  1141.     font: 12px 'Montserrat';
  1142.     text-transform: none;
  1143.     text-shadow: 1px 1px var(--gscolor5);
  1144. }
  1145.  
  1146. /* --------------------------------- PAGINA DE PERFIL /U1 --------------------------------- */
  1147. /*Contenedor del perfil*/
  1148. .gsperfilcont {
  1149.     width: 950px;
  1150.     padding: 20px;
  1151.     display: flex;
  1152.     align-items: flex-start;
  1153.     justify-content: space-around;
  1154.     height: 360px;
  1155.     margin: 0 auto;
  1156. }
  1157. .gsperfilcont1 {
  1158.     width: 200px;
  1159.     height: 350px;
  1160.     padding: 10px;
  1161.     background: var(--gsfondo);
  1162.     display: flex;
  1163.     flex-direction: column;
  1164.     justify-content: space-between;
  1165.     align-items: center;
  1166. }
  1167. /*Contenedor del avatar*/
  1168. .gsperfilavatar {
  1169.     border: 1px solid var(--gscolor1);
  1170. }
  1171. /*Links de contacto*/
  1172. .gsperfilcontacto {
  1173.     width: 200px;
  1174.     height: 40px;
  1175.     padding: 10px;
  1176. }
  1177. .gsperfilcontacto1 {
  1178.     width: 200px;
  1179.     display: flex;
  1180.     align-content: center;
  1181.     justify-content: space-around;
  1182. }
  1183. .gsperfilcont2 {
  1184.     width: 680px;
  1185.     height: 370px;
  1186. }
  1187. /*Nombre de usuario*/
  1188. .gsperfilnombre {
  1189.     width: 640px;
  1190.     height: 30px;
  1191.     padding: 20px;
  1192.     background: var(--gsfondo);
  1193.     display: flex;
  1194.     flex-direction: column;
  1195.     align-items: center;
  1196.     justify-content: center;
  1197. }
  1198. .gsperfilname1 {
  1199.     font: 25px 'Merienda';
  1200.     color: var(--gscoloruser);
  1201. }
  1202. /*Rango*/
  1203. .gsperfilname2 {
  1204.     border-top: 1px solid var(--gscolor1);
  1205.     width: 90%;
  1206.     text-align: center;
  1207.     font: 15px 'Montserrat';
  1208.     font-weight: 500;
  1209.     text-shadow: 1px 1px var(--gscolor5);
  1210. }
  1211. /*Contenedor de los campos*/
  1212. .gsperfilcampos {
  1213.     height: 249px;
  1214.     padding: 10px;
  1215.     width: 660px;
  1216.     overflow: auto;
  1217.     display: flex;
  1218.     flex-flow: wrap;
  1219.     justify-content: center;
  1220. }
  1221. .gsperfilcampos1 {
  1222.     display: flex;
  1223.     align-items: center;
  1224.     flex-flow: column;
  1225.     width: 50%;
  1226.     height: 70px;
  1227. }
  1228. /*itulo de los campos*/
  1229. .gsperfilabel {
  1230.     background: var(--gscolor2);
  1231.     color: var(--gstexto1);
  1232.     font-family: Merienda;
  1233.     font-size: 11px;
  1234.     font-style: normal;
  1235.     font-variant: normal;
  1236.     font-weight: 600;
  1237.     padding: 10px;
  1238.     text-align: center;
  1239.     width: 230px;
  1240. }
  1241. /*Contenido de los campos*/
  1242. .gsperfifield {
  1243.     color: var(--gstexto1);
  1244.     font-family: Montserrat;
  1245.     font-size: 10px;
  1246.     font-style: normal;
  1247.     font-variant: normal;
  1248.     font-weight: 600;
  1249.     height: auto;
  1250.     padding: 10px;
  1251.     text-align: center;
  1252.     width: 230px;
  1253. }
  1254.  
  1255. .gsperfilbarra {
  1256.     width: 680px;
  1257.     height: 30px;
  1258.     background: var(--gsfondo);
  1259. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!