Advertisement
Guest User

style css

a guest
Jun 21st, 2018
75
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.36 KB | None | 0 0
  1. body {
  2. background-color: #F2F2F2;
  3. font-family: 'Open Sans', sans-serif;
  4. color: #333333;
  5. }
  6.  
  7. #LogoLaboratoria {
  8. margin-left: 60px;
  9. margin-top: 10px
  10. }
  11.  
  12. .topnav {
  13. background-color: #FFE521;
  14. position: fixed;
  15. top: 0;
  16. width: 100%;
  17. height: 80px;
  18. overflow: hidden;
  19. z-index: 100;
  20. /* z-index es el orden de capas */
  21. }
  22.  
  23. .menuSuperior {
  24. font-weight: 700;
  25. overflow: hidden;
  26. color: #333333;
  27. padding: 28px 40px;
  28. font-size: 15px;
  29. }
  30.  
  31. .sidenav {
  32. height: 100%;
  33. width: 0;
  34. position: fixed;
  35. z-index: 1;
  36. top: 80px;
  37. left: 0;
  38. background-color: white;
  39. overflow-x: hidden;
  40. transition: 0.5s;
  41. padding-top: 60px;
  42. }
  43.  
  44. .elipse {
  45. position: absolute;
  46. width: 45px;
  47. height: 45px;
  48. border-radius: 50%;
  49. left: 15px;
  50. top: 17px;
  51. background: #E0E0E0;
  52. }
  53.  
  54. .fa-bars {
  55. position: absolute;
  56. left: 30px;
  57. top: 30px;
  58. }
  59.  
  60. .sidenav .sidenavText {
  61. padding: 8px 8px 8px 32px;
  62. text-decoration: none;
  63. font-size: 17px;
  64. color: #333333;
  65. display: block;
  66. transition: 0.3s;
  67. }
  68.  
  69. .sidenav .sidenavText:hover {
  70. background-color: rgb(255, 229, 33);
  71. background-color: rgb(255, 229, 33, 0.2);
  72. color: #333333;
  73. }
  74.  
  75. .sidenav .closebtn {
  76. color: #333333;
  77. text-decoration: none;
  78. position: absolute;
  79. top: 0;
  80. right: 25px;
  81. font-size: 36px;
  82. margin-left: 50px;
  83. display: block;
  84. transition: 0.3s;
  85. }
  86.  
  87. #main {
  88. padding: 16px;
  89. background-color: white;
  90. width: 277px;
  91. height: 80px;
  92. float: left;
  93. }
  94.  
  95. @media screen and (max-height: 450px) {
  96. .sidenav {
  97. padding-top: 15px;
  98. }
  99. .sidenav a {
  100. font-size: 15px;
  101. }
  102. }
  103.  
  104. @media screen and (max-width: 900px) {
  105. #cajaChile,
  106. #cajaMexico,
  107. #cajaPeru {
  108. width: 100%;
  109. margin-top: 40px;
  110. margin-bottom: 0px;
  111. }
  112. }
  113.  
  114. #contenido {
  115. margin-top: 100px;
  116. margin-bottom: 10px;
  117. }
  118.  
  119. #contenidoTres {
  120. margin-top: 80px;
  121. }
  122.  
  123. .dropdown {
  124. margin-top: 50px;
  125. }
  126.  
  127. .cajasSedes {
  128. margin: 80px 15px;
  129. width: 250px;
  130. height: 220px;
  131. background: #FFFFFF;
  132. box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.24), 0px 8px 8px rgba(0, 0, 0, 0.12);
  133. border-radius: 2px;
  134. justify-content: center;
  135. align-items: center;
  136. }
  137.  
  138. .buttonSedes {
  139. width: 118px;
  140. height: 36px;
  141. background-color: #FF009E;
  142. color: white;
  143. box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.24), 0px 0px 2px rgba(0, 0, 0, 0.12);
  144. border-radius: 2px;
  145. }
  146.  
  147. .buttonSedes:hover {
  148. box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.24), 0px 0px 8px rgba(0, 0, 0, 0.12), 0px 2px 2px rgba(0, 0, 0, 0.24), 0px 0px 2px rgba(0, 0, 0, 0.12);
  149. }
  150.  
  151. table,
  152. td {
  153. padding: 10px;
  154. align-items: center;
  155. text-align: center;
  156. }
  157.  
  158. .titulosSecciones {
  159. font-size: 25px;
  160. color: #333333;
  161. margin-top: 20px;
  162. }
  163.  
  164. hr {
  165. display: block;
  166. margin-top: 0.5em;
  167. margin-bottom: 0.5em;
  168. margin-left: auto;
  169. margin-right: auto;
  170. border-style: inset;
  171. border-width: 1px;
  172. }
  173.  
  174. .fa-map-marker,
  175. .fa-users,
  176. .fa-user {
  177. padding-right: 15px;
  178. font-size: 25px;
  179. }
  180.  
  181. hr.lineaSeparadorUno {
  182. border-top: 0.5px solid #BDBDBD;
  183. margin-top: 10px;
  184. margin-right: 10px;
  185. }
  186.  
  187.  
  188. /* dropdown */
  189.  
  190. .dropbtn {
  191. width: 250px;
  192. background-color: white;
  193. box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.24), 0px 8px 8px rgba(0, 0, 0, 0.12);
  194. color: #333333;
  195. padding: 16px;
  196. font-size: 16px;
  197. border: none;
  198. cursor: pointer;
  199. text-align: left;
  200. }
  201.  
  202. .dropdown,
  203. .dropdown:hover .dropbtn {
  204. position: relative;
  205. display: inline-block;
  206. }
  207.  
  208. .dropdown-content {
  209. width: 250px;
  210. display: none;
  211. position: absolute;
  212. background-color: #f9f9f9;
  213. box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.24), 0px 8px 8px rgba(0, 0, 0, 0.12);
  214. min-width: 160px;
  215. box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  216. z-index: 1;
  217. text-decoration: none;
  218. }
  219.  
  220. .dropdown-content a {
  221. color: #333333;
  222. padding: 12px 16px;
  223. text-decoration: none;
  224. display: block;
  225. }
  226.  
  227. .dropdown-content a:hover {
  228. background: linear-gradient(90deg, #FF009E 0%, #56F89A 100%);
  229. }
  230.  
  231. .dropdown:hover .dropdown-content {
  232. display: block;
  233. }
  234.  
  235.  
  236. /* Tabla */
  237.  
  238. #tablaAlumnas {
  239. margin-top: 50px;
  240. }
  241.  
  242. thead {
  243. box-lines: 0px;
  244. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement