justified-nav.css 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. body {
  2. padding-top: 20px;
  3. /*background-color: #E5E5EA;*/
  4. background-color: #EDEEDB;
  5. }
  6. .footer {
  7. padding-top: 40px;
  8. padding-bottom: 40px;
  9. margin-top: 40px;
  10. }
  11. /* Main marketing message and sign up button */
  12. .jumbotron {
  13. text-align: center;
  14. background-color: transparent;
  15. }
  16. .jumbotron .btn {
  17. padding: 14px 24px;
  18. font-size: 21px;
  19. }
  20. /* Customize the nav-justified links to be fill the entire space of the .navbar */
  21. .caja_nodo_proyectado {
  22. background-color: #F1F4C3;
  23. border-top-style: solid;
  24. border-top: 3px solid;
  25. border-top-color: #D3E2B1;
  26. padding: 8px;
  27. }
  28. .caja_nodo_activo {
  29. background-color: #D3F7B8;
  30. border-top-style: solid;
  31. border-top: 3px solid;
  32. border-top-color: #A3E281;
  33. padding: 8px;
  34. }
  35. .nav-justified {
  36. background-color: #eee;
  37. border: 1px solid #ccc;
  38. border-radius: 5px;
  39. }
  40. .nav-justified > li > a {
  41. padding-top: 15px;
  42. padding-bottom: 15px;
  43. margin-bottom: 0;
  44. font-weight: bold;
  45. color: #555;
  46. text-align: center;
  47. /*background-color: #D2DBEC; /* Old browsers */
  48. /*background-image: -webkit-gradient(linear, left top, left bottom, from(#D2DBEC), to(#B8C2D6));
  49. background-image: -webkit-linear-gradient(top, #D2DBFC 0%, #B8C2D6 100%);
  50. background-image: -o-linear-gradient(top, #D2DBFC 0%, #B8C2D6 100%);
  51. background-image: linear-gradient(to bottom, #D2DBFC 0%,#B8C2D6 100%);
  52. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2DBFC', endColorstr='#B8C2D6',GradientType=0 ); /* IE6-9 */
  53. background-color: #EBE7A0; /* Old browsers */
  54. background-image: -webkit-gradient(linear, left top, left bottom, from(#F4ED6A), to(#EBE7A0));
  55. background-image: -webkit-linear-gradient(top, #F4ED6A 0%, #EBE7A0 100%);
  56. background-image: -o-linear-gradient(top, #F4ED6A 0%, #EBE7A0 100%);
  57. background-image: linear-gradient(to bottom, #F4ED6A 0%,#EBE7A0 100%);
  58. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EDe786', endColorstr='#EBE7A0', GradientType=0 ); /* IE6-9 */
  59. background-repeat: repeat-x; /* Repeat the gradient */
  60. border-bottom: 1px solid #d5d5d5;
  61. }
  62. .nav-justified > .active > a,
  63. .nav-justified > .active > a:hover,
  64. .nav-justified > .active > a:focus {
  65. background-color: #ddd;
  66. background-image: none;
  67. -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.25);
  68. box-shadow: inset 0 3px 7px rgba(0,0,0,.25);
  69. }
  70. .nav-justified > li:first-child > a {
  71. border-radius: 5px 5px 0 0;
  72. }
  73. .nav-justified > li:last-child > a {
  74. border-bottom: 0;
  75. border-radius: 0 0 5px 5px;
  76. }
  77. @media (min-width: 768px) {
  78. .nav-justified {
  79. max-height: 52px;
  80. }
  81. .nav-justified > li > a {
  82. border-right: 1px solid #d5d5d5;
  83. border-left: 1px solid #fff;
  84. }
  85. .nav-justified > li:first-child > a {
  86. border-left: 0;
  87. border-radius: 5px 0 0 5px;
  88. }
  89. .nav-justified > li:last-child > a {
  90. border-right: 0;
  91. border-radius: 0 5px 5px 0;
  92. }
  93. }
  94. /* Responsive: Portrait tablets and up */
  95. @media screen and (min-width: 768px) {
  96. /* Remove the padding we set earlier */
  97. .masthead,
  98. .marketing,
  99. .footer {
  100. padding-right: 0;
  101. padding-left: 0;
  102. }
  103. }