CSS   33
head css
Guest on 17th September 2023 06:21:52 AM


  1.  
  2. #title-categoria {
  3.     background: #b38e5d;
  4.     margin-top: 0 !important;
  5.     padding-bottom: 15px;
  6.     padding-top: 50px;
  7.     padding-left: 20px;
  8.     font-size: 30px !important;
  9.     color: #000000;
  10.     font-family: 'Open Sans',sans-serif;
  11.     text-transform: uppercase;
  12. }
  13.  
  14. .centerText {
  15.             text-align: center;
  16.         }
  17.                
  18. .cards {
  19.     display: flex;
  20.     flex-wrap: wrap;
  21.     align-items: stretch;
  22.   }
  23.   .card {
  24.     flex: 0 0 300px;
  25.     margin: 10px;
  26.     border: 1px solid #ccc;
  27.     box-shadow: 2px 2px 6px 0px  rgba(0,0,0,0.3);
  28.         padding:5px;
  29.   }
  30.   .card img {
  31.     max-width: 100%;
  32.         height:200px;
  33.   }
  34.   .card .text {
  35.     padding: 0 20px 20px;
  36.   }
  37.   .card .text > button {
  38.     background: gray;
  39.     border: 0;
  40.     color: white;
  41.     padding: 10px;
  42.     width: 100%;
  43.     }
  44.        
  45.         /*.card {
  46.     position: relative;
  47.     border: 1px solid rgba(0, 0, 0, 0.04);
  48.     padding: 15px 20px;
  49.     font-size: 18px;
  50.     font-weight: 600;
  51.     margin-bottom: 30px;
  52.     border-radius: 4px;
  53.     box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.08);
  54.     transition: all 0.5s;
  55.     -webkit-transition: all 0.5s;
  56. }
  57. */
  58.  
  59. .page-node .layout-container, .page-municipios .layout-container, .page-dependencias-estatales .layout-container, .page-taxonomy .layout-container, .page-noticias .layout-container, .page-search .layout-container, .page-periodicos .layout-container, .page-tramites .layout-container, .user-anonymous-viewing .layout-container, .user-logged-in .layout-container, .page-proveedores .layout-container
  60. {
  61.     position: relative;
  62.     min-height: 100%;
  63.     height: auto !important;
  64.     height: 100%;
  65.     margin: 0 auto -370px;
  66. }
  67.  
  68. .layout-container
  69. {
  70.     position: relative;
  71. }
  72.  
  73. #header .navbar-header
  74. {
  75.     width: 100%;
  76. }
  77.  
  78. #header
  79. {
  80.     background-color: #9D2449;
  81.     border: 0 none;
  82.     -webkit-border-radius: 0;
  83.     -moz-border-radius: 0;
  84.     border-radius: 0;
  85.     min-height: 50px;
  86.     margin: 0;
  87.     padding: 0;
  88. }
  89.  
  90.  
  91. #header .navbar-header
  92. {
  93.     width: 100%;
  94. }
  95.  
  96. #header .navbar-header
  97. {
  98.     position: relative;
  99.     z-index: 1;
  100. }
  101.  
  102. #header .navbar-toggle
  103. {
  104.     margin-top: 20px;
  105.     z-index: 1;
  106. }
  107.  
  108. #header .navbar-toggle .icon-bar
  109. {
  110.     background-color: #FFF;
  111.     width: 32px;
  112. }
  113.  
  114. #header #main-navigation li
  115. {
  116.     list-style: none;
  117.     margin: 0;
  118.     position: relative;
  119. }
  120.  
  121. #header #main-navigation li a
  122. {
  123.     font-weight: 500;
  124.     display: inline-block;
  125.     padding: 0;
  126.     color: #ffffff;
  127.     font-size: 18px;
  128.     text-transform: inherit;
  129.     background: none;
  130. }
  131.  
  132. #header #main-navigation li a:hover, #header #main-navigation li a.active, #header #main-navigation li a.is-active
  133. {
  134.     background: none; /* color: #ffd302; */
  135.     text-decoration: none;
  136.     outline: 0;
  137. }
  138.  
  139. #header #main-navigation li ul li ul
  140. {
  141.     overflow-y: scroll;
  142.     max-height: 650px;
  143. }
  144.  
  145. #header #main-navigation li:hover > ul
  146. {
  147.     display: block;
  148.     -moz-animation: fadeInUp .1s ease-in;
  149.     -webkit-animation: fadeInUp .1s ease-in;
  150.     animation: fadeInUp .1s ease-in;
  151. }
  152.  
  153. .busquedas
  154. {
  155.     float: right;
  156.     height: 27px;
  157.     position: relative;
  158.     top: 10px;
  159.     width: 200px;
  160.     transition: opacity 0.5s linear;
  161. }
  162.  
  163. .busquedas input[type="search"]
  164. {
  165.     padding: 2px 12px;
  166. }
  167.  
  168. input[type="search"]
  169. {
  170.     width: 100%;
  171.     padding: 8px 12px;
  172.     border-width: 1px;
  173.     -webkit-border-radius: 1px;
  174.     -moz-border-radius: 1px;
  175.     border-radius: 1px;
  176.     border-color: #c1c1c1;
  177. }
  178.  
  179. .busquedas .form-actions .button:first-child
  180. {
  181.     left: 170px;
  182.     padding: 4px 9px;
  183.     top: -28px;
  184. }
  185.  
  186. .visually-hidden
  187. {
  188.     position: absolute !important;
  189.     clip: rect(1px, 1px, 1px, 1px);
  190.     overflow: hidden;
  191.     height: 1px;
  192.     width: 1px;
  193.     word-wrap: normal;
  194. }
  195.  
  196. .form-actions .button:first-child, .resultados-search .layout-content input[type="submit"]
  197. {
  198.     border: inherit;
  199.     background: url(../images/icons/search.png) no-repeat center center;
  200.     position: relative;
  201.     left: 355px;
  202.     padding: 4px 9px;
  203.     text-indent: -99999px;
  204.     top: -30px;
  205. }
  206.  
  207. #block-headerlogo
  208. {
  209.     display: inline-block;
  210.     float: left;
  211.     top: 5px;
  212.     position: relative;
  213. }
  214.  
  215. #block-menuprincipal
  216. {
  217.     float: right;
  218. }
  219.  
  220. #block-menuprincipal h2.block-title
  221. {
  222.     color: #a3a3a3;
  223.     font-size: 24px;
  224.     letter-spacing: 1.3px;
  225.     display: inline-block;
  226. }
  227.  
  228. .logo-tabasco-header, .redes-sociales
  229. {
  230.     display: inline-block;
  231. }
  232.  
  233. .logo-tabasco-header
  234. {
  235.     position: relative;
  236.     bottom: 30px;
  237. }
  238.  
  239. .logo-tabasco-header.responsivo
  240. {
  241.     display: none;
  242. }
  243.  
  244. #tabasco
  245. {
  246.     /* padding-left: 5px; */
  247.     position: relative;
  248.     top: 23px;
  249. }
  250.  
  251. #tabasco h2
  252. {
  253.     font-size: 26px;
  254.     font-weight: normal !important;
  255.     font-family: 'Open Sans' , sans-serif;
  256.     margin: 0;
  257.     letter-spacing: -1px;
  258. }
  259.  
  260. #tabasco h2 a
  261. {
  262.     color: #fff;
  263. }
  264.  
  265. #tabasco a
  266. {
  267.     text-decoration: none;
  268.     outline: 0 none;
  269. }
  270.  
  271. #tabasco .color, #tabasco a, #tabasco .link-color
  272. {
  273.     color: #f5a623;
  274. }
  275.  
  276. #tabasco h2 a strong
  277. {
  278.     color: #ffffff;
  279. }
  280.  
  281. #tabasco strong
  282. {
  283.     font-weight: 700;
  284. }
  285.  
  286. #tabasco h2 a strong.punto
  287. {
  288.     font-size: 48px;
  289.     color: #fff;
  290.     line-height: 0;
  291. }
  292.  
  293. #header ul
  294. {
  295.     margin: 0;
  296.     padding: 0;
  297.     list-style: none;
  298. }
  299.  
  300. #main-wrapper {
  301.     padding-bottom: 50px;
  302.     min-height:600px;
  303.     }
  304.  
  305.  
  306. @media (min-width: 1200px)
  307. {
  308.     #header #main-navigation li
  309.     {
  310.         padding: 0 21px 0 0;
  311.     }
  312. }
  313.  
  314. @media (min-width: 1024px)
  315. {
  316.     #block-menuprincipal
  317.     {
  318.         width: auto;
  319.         float: right;
  320.     }
  321.     .navbar-nav
  322.     {
  323.         margin-top: 0px;
  324.         padding-left: 0px;
  325.     }
  326. }
  327.  
  328.  
  329.  
  330. @media (max-width: 1024px) and (min-width: 768px)
  331. {
  332.     .container
  333.     {
  334.         width: 100%;
  335.     }
  336.     #header .navbar-toggle
  337.     {
  338.         margin-top: 9px;
  339.     }
  340.     .busquedas
  341.     {
  342.         top: 10px;
  343.     }
  344.     #block-headerlogo
  345.     {
  346.         top: 5px !important;
  347.     }
  348.     #block-menuprincipal
  349.     {
  350.         float: inherit;
  351.     }
  352.     .navbar-nav
  353.     {
  354.         padding-left: 16px;
  355.         width: 100%;
  356.     }
  357.     .navbar-collapse, #section-rutas #block-views-block-gastronomia-block-1, .region-header-programas
  358.     {
  359.         width: 100%;
  360.     }
  361.     .navbar-collapse.in
  362.     {
  363.         overflow-y: auto !important;
  364.     }
  365.  
  366. }
  367. @media (max-width: 1199px) and (min-width: 993px)
  368. {
  369.     .navbar-collapse, #section-rutas #block-views-block-gastronomia-block-1, .region-header-programas
  370.     {
  371.         width: auto;
  372.     }
  373. }
  374.  
  375.  
  376. @media (min-width: 992px)
  377. {
  378.     #header #main-navigation
  379.     {
  380.         float: right;
  381.     }
  382.     #header #main-navigation li
  383.     {
  384.         padding: 0 10px 0 0;
  385.     }
  386.     #header #main-navigation li a
  387.     {
  388.         height: 50px;
  389.         line-height: 53px;
  390.     }
  391.     #header #main-navigation li ul
  392.     {
  393.         list-style: none;
  394.         min-width: 190px;
  395.         padding: 0;
  396.         position: absolute;
  397.         left: 0;
  398.         top: 100%;
  399.         display: none;
  400.         background-color: #9D2449;
  401.     }  
  402.        
  403.     #header #main-navigation li ul li
  404.     {
  405.         padding: 0;
  406.         position: relative;
  407.         display: block !important;
  408.     }
  409.  
  410.     #header #main-navigation li ul li a
  411.     {
  412.             border-bottom: 1px solid #9D2449;
  413.     font-weight: normal;
  414.     padding: 7px 14px 7px 34px;
  415.     display: block;
  416.     position: relative;
  417.     color: #ffffff;
  418.     line-height: 1.4;
  419.     height: auto;
  420.     display: block;
  421.     outline: 0;
  422.     }
  423.     #header #main-navigation li ul li ul
  424.     {
  425.         position: absolute;
  426.         left: 100%;
  427.         top: 0;
  428.         display: none;
  429.     }
  430.     #header #main-navigation li ul li a:after
  431.     {
  432.         display: inline-block;
  433.         /*font: normal normal normal 14px/1 FontAwesome;*/
  434.         font-size: inherit;
  435.         text-rendering: auto;
  436.         -webkit-font-smoothing: antialiased;
  437.         -moz-osx-font-smoothing: grayscale;
  438.         /* content: "\f105";*/
  439.         content: ">";
  440.         color: #949da7;
  441.         position: absolute;
  442.         right: auto;
  443.         left: 17px;
  444.         top: 11px;
  445.         font-weight: 700;
  446.     }
  447. }
  448.  
  449. @media (max-width: 992px)
  450. {
  451.     .navbar-header
  452.     {
  453.         float: none;
  454.     }
  455.     .navbar-toggle
  456.     {
  457.         display: block;
  458.     }
  459.     .navbar-collapse.collapse.in
  460.     {
  461.         display: block !important;
  462.     }
  463.     #header #main-navigation
  464.     {
  465.         float: right;
  466.     }
  467.     .navbar-nav
  468.     {
  469.         float: none !important;
  470.         margin: 7.5px -15px;
  471.     }
  472.     #header #main-navigation li
  473.     {
  474.         padding: 0 10px 0 0;
  475.     }
  476.     #header #main-navigation li
  477.     {
  478.         padding: 10px 0;
  479.         display: block !important;
  480.     }
  481.     #header #main-navigation li a
  482.     {
  483.         text-transform: none;
  484.         display: block;
  485.     }
  486.     #header #main-navigation li ul.sub-menu
  487.     {
  488.         background-color: #303337;
  489.         padding: 10px;
  490.         display: none;
  491.     }
  492.     #header #main-navigation li
  493.     {
  494.         padding: 10px 0;
  495.         display: block !important;
  496.     }
  497.     #header #main-navigation li a
  498.     {
  499.         text-transform: none;
  500.         display: block;
  501.     }
  502.     #header #main-navigation li a
  503.     {
  504.         text-transform: none;
  505.         display: block;
  506.     }
  507.     .navbar-nav
  508.     {
  509.         float: none !important;
  510.         margin: 7.5px -15px;
  511.     }
  512.     .navbar-nav > li
  513.     {
  514.         float: none;
  515.     }
  516.     #header #main-navigation li
  517.     {
  518.         padding: 10px 0;
  519.         display: block !important;
  520.     }
  521.  
  522. }
  523.  
  524. @media (max-width: 1199px) and (min-width: 993px)
  525. {
  526.     #header #main-navigation li a
  527.     {
  528.         font-size: 15px;
  529.     }
  530. }
  531.  
  532. @media (max-width: 990px) and (min-width: 768px)
  533. {
  534.     .navbar-toggle
  535.     {
  536.         margin-left: 20px;
  537.     }
  538. }
  539.  
  540. @media (max-width: 767px)
  541. {
  542.     .navbar-toggle
  543.     {
  544.         margin-right: 0;
  545.     }
  546.     #header .navbar-header
  547.     {
  548.         margin: 0;
  549.     }
  550.     #block-headerlogo
  551.     {
  552.         display: inherit;
  553.         float: inherit;
  554.         top: 0;
  555.         position: inherit;
  556.     }
  557.     .logo-tabasco-header
  558.     {
  559.         bottom: -18px;
  560.     }
  561.     #tabasco
  562.     {
  563.         top: 0;
  564.     }
  565.     #tabasco h2
  566.     {
  567.         font-size: 24px;
  568.     }
  569. }
  570.  
  571. @media (min-width: 768px){
  572.     .container{
  573.         min-width: 950px;
  574.     }
  575. }
  576. @media (max-width: 767px) and (min-width: 500px)
  577. {
  578.     #header .navbar-toggle
  579.     {
  580.         margin-top: 9px;
  581.     }
  582.     .navbar-toggle
  583.     {
  584.         margin-left: 20px;
  585.     }
  586.     .busquedas
  587.     {
  588.         top: 10px;
  589.     }
  590.     .user-anonymous-viewing .form-actions .button:first-child
  591.     {
  592.         left: 174px;
  593.         top: -28px;
  594.     }
  595.     #block-headerlogo
  596.     {
  597.         top: 24px !important;
  598.     }
  599.     #block-headerlogo
  600.     {
  601.         top: 11px !important;
  602.     }
  603.     .logo-tabasco-header
  604.     {
  605.         bottom: 0 !important;
  606.     }
  607.     #block-menuprincipal
  608.     {
  609.         float: inherit;
  610.     }
  611.     .navbar-nav
  612.     {
  613.         margin-top: 40px;
  614.         text-align: left;
  615.     }
  616. }
  617.  
  618. @media (max-width: 499px)
  619. {
  620.     #header
  621.     {
  622.         min-height: 60px;
  623.     }
  624.     #header .navbar-header, #section-rutas #block-sierra, #section-rutas #block-cacao, #section-rutas #block-pantanos, #section-rutas #block-playa
  625.     {
  626.         text-align: center;
  627.     }
  628.     #header .navbar-toggle
  629.     {
  630.         margin: 0px;
  631.         position: relative;
  632.         top: 13px;
  633.         right: 2px;
  634.     }
  635.     .busquedas
  636.     {
  637.         top: 15px;
  638.     }
  639.     .user-anonymous-viewing .form-actions .button:first-child
  640.     {
  641.         left: 83px;
  642.         top: -28px;
  643.     }
  644.     #block-headerlogo
  645.     {
  646.         display: inline-block !important;
  647.         margin: 0px auto;
  648.         text-align: center;
  649.     }
  650.     .tramites-buscados, .logo-tabasco-header
  651.     {
  652.         display: none;
  653.     }
  654.     .logo-tabasco-header
  655.     {
  656.         bottom: 0 !important;
  657.     }
  658.     .logo-tabasco-header.responsivo
  659.     {
  660.         display: block;
  661.     }
  662.     .logo-tabasco-header.responsivo #tabasco h2
  663.     {
  664.         font-size: 40px;
  665.     }
  666.     #block-menuprincipal
  667.     {
  668.         margin-top: 30px;
  669.         float: inherit;
  670.     }
  671.     .navbar-nav
  672.     {
  673.         text-align: left;
  674.     }
  675. }
Raw Paste

Login or Register to edit or fork this paste. It's free.