Advertisement
Guest User

Untitled

a guest
Jun 30th, 2017
104
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.45 KB | None | 0 0
  1. body {
  2. font-family: 'Open Sans', sans-serif;
  3. box-sizing: border-box;
  4. }
  5.  
  6. #header {
  7. background-color: #e0e80d;
  8. height: 170px;
  9. }
  10.  
  11. #header-logo h1 {
  12. position: absolute;
  13. top: 20px;
  14. left: 50px;
  15. }
  16.  
  17. #header-logo h4 {
  18. position: absolute;
  19. top: 130px;
  20. left: 50px;
  21. text-transform: uppercase;
  22. color: rgb(0, 54, 52);
  23. font-weight: bold;
  24. font-size: 17px;
  25. }
  26.  
  27. #header a {
  28. text-decoration: none;
  29. color: rgb(0, 54, 52);
  30. }
  31.  
  32. #titulo {
  33. text-align: center;
  34. font-weight: bold;
  35. padding-top: 60px;
  36. font-size: 40px;
  37. }
  38.  
  39. #content {
  40. max-width: 800px;
  41. margin: 0 auto;
  42. margin-top: 100px;
  43. }
  44.  
  45. #formulario {
  46. margin-top: 30px;
  47. display: flex;
  48. flex-wrap: wrap;
  49. max-width: 800px;
  50. height: 290px;
  51. }
  52.  
  53. label {
  54. margin-top: 30px;
  55. }
  56.  
  57. label input {
  58. width: 93%;
  59. height: 30px;
  60. padding: 10px;
  61. border-style: none;
  62. border-radius: 4px;
  63. box-shadow: 0px 0.5px #888888;
  64. background-color: #eee;
  65. font-size: 15px;
  66. }
  67.  
  68. input::placeholder {
  69. color: rgb(170, 170, 170);
  70. }
  71.  
  72. span {
  73. display: block;
  74. margin-bottom: 10px;
  75. color: rgb(0, 54, 52);
  76. font-weight: bold;
  77. }
  78.  
  79. .p48 {
  80. width: 49%;
  81. margin-right: 1%;
  82. }
  83.  
  84. .p23 {
  85. width: 22%;
  86. margin-right: 3%;
  87.  
  88. }
  89.  
  90. #enviar {
  91. margin-top: 65px;
  92. padding: 15px;
  93. background-color: #b4bb07;
  94. border-style: none;
  95. border-radius: 4px;
  96. width: 31%;
  97. height: 60px;
  98. color: white;
  99. box-shadow: 1px 1px 1px #888888;
  100. font-size: 20px;
  101. cursor: pointer;
  102. }
  103.  
  104. #footer {
  105. background-color: #e0e80d;
  106. margin-top: 300px;
  107. padding: 40px 0px;
  108. display: flex;
  109. justify-content: center;
  110. position: relative;
  111. bottom: 0;
  112. width: 100%;
  113. }
  114.  
  115. #footer p {
  116. font-weight: bold;
  117. }
  118.  
  119.  
  120. @media screen and (max-width: 380px) {
  121.  
  122. #header {
  123. display: flex;
  124. justify-content: center;
  125. height: 260px;
  126. }
  127.  
  128. #header-logo h1 {
  129. left: 30%;
  130. }
  131.  
  132. #header-logo h4 {
  133. position: absolute;
  134. top: 140px;
  135. left: 25%;
  136. text-transform: uppercase;
  137. color: rgb(0, 54, 52);
  138. font-weight: bold;
  139. font-size: 17px;
  140. }
  141.  
  142. #titulo {
  143. font-weight: bold;
  144. padding-top: 180px;
  145. font-size: 40px;
  146. }
  147.  
  148. #content {
  149. max-width: 280px;
  150. margin: 0px 4% 0px 4%;
  151. }
  152.  
  153. label {
  154. display: flex;
  155. flex-wrap: wrap;
  156. }
  157.  
  158. .p23 {
  159. width: 95%;
  160. margin-left: 5%;
  161. margin-right: 0%;
  162. }
  163.  
  164. .p48 {
  165. width: 95%;
  166. margin-left: 5%;
  167. margin-right: 0%;
  168. }
  169.  
  170. #enviar {
  171. width: 84%;
  172. margin: 0 auto;
  173. margin-top: 80px;
  174.  
  175. }
  176.  
  177. #footer {
  178. margin-top: 800px;
  179. padding: 40px 0px;
  180.  
  181. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement