Advertisement
Guest User

Untitled

a guest
Dec 10th, 2018
175
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.07 KB | None | 0 0
  1. body, html {
  2. height: 100%;
  3. }
  4.  
  5. body {
  6. margin: 0;
  7. display: grid;
  8. grid-template-rows: 100%;
  9. grid-template-columns: 7fr 3fr;
  10. font-family: 'Montserrat', sans-serif;
  11. }
  12.  
  13. /* left side of the page */
  14.  
  15. .container {
  16. display: grid;
  17. grid-template-columns: 100%;
  18. grid-template-rows: repeat(5,1fr);
  19. background: linear-gradient(rgba(194, 189, 189, 0.719), rgba(85, 84, 84, 0.5)), url('./slike/slusalice.jpg');
  20. background-repeat: no-repeat;
  21. background-size: cover;
  22. overflow: hidden;
  23. }
  24.  
  25. .container h3 {
  26. grid-area: 1/1/1/1;
  27. display: flex;
  28. justify-content: center;
  29. align-items: flex-end;
  30. font-size: 3vw;
  31. color: white;
  32. letter-spacing: 0.1vw;
  33. font-weight: 400;
  34. }
  35.  
  36. .container h5 {
  37. padding-top: 0;
  38. margin: 0;
  39. grid-area: 2/1/2/1;
  40. display: flex;
  41. justify-content: center;
  42. align-items: center;
  43. font-size: 1.5vw;
  44. color: #115664;
  45. letter-spacing: 0.1vw;
  46. font-weight: 300;
  47. }
  48.  
  49. /* right side of the page */
  50.  
  51. .holder {
  52. display: grid;
  53. grid-template-columns: 100%;
  54. grid-template-rows: 0.5fr 0.5fr auto 1fr;
  55. border-style: solid;
  56. border-width: 1px;
  57. border-color: #115664;
  58. overflow: scroll;
  59. }
  60.  
  61. /*Create an Account */
  62. .info-container {
  63. grid-area: 2/1/2/1;
  64. display: flex;
  65. justify-content: center;
  66. align-items: center;
  67. font-size: 1.7vw;
  68. font-weight: normal;
  69. opacity: 0.5;
  70. }
  71.  
  72. /*forma*/
  73.  
  74. .form-register {
  75. grid-area: 3/1/3/1;
  76. }
  77.  
  78. .form-control {
  79. width: 85%;
  80. padding: 0.6vw 0.8vw;
  81. margin: auto auto;
  82. display: block;
  83. border: 2px solid #ccc;
  84. border-radius: 4px;
  85. box-sizing: border-box;
  86. }
  87. .form-control:focus {
  88. border-color: #80cec9;
  89. }
  90.  
  91. .form-group input::placeholder {
  92. font-size: 0.8vw;
  93. }
  94.  
  95. /*date and gender*/
  96. .form-group_top {
  97. display: inline-block;
  98. font-size: 0.8vw;
  99. width: 41%;
  100. margin-right: 1vw;
  101. margin-left: 1vw;
  102.  
  103. }
  104. input[type=date] {
  105. font-size: 0.8vw;
  106.  
  107. }
  108.  
  109. .form-group_bottom {
  110. display: inline-block;
  111. margin-right: auto;
  112. margin-left: auto;
  113. }
  114.  
  115. button[type=submit] {
  116. width: 10vw;
  117. background-color: #115664;
  118. color: white;
  119. font-size: 1.2vw;
  120. padding: 1vw 1.5vw;
  121. margin: 1.5vw 0;
  122. border: none;
  123. border-radius: 0.8vw;
  124. cursor: pointer;
  125. float: right;
  126. margin-right: 1.5vw;
  127. display: block;
  128. }
  129.  
  130. button[type=submit]:hover {
  131. background-color: #02b5ca;
  132. }
  133.  
  134. label {
  135. display: block;
  136. padding-top: 1vw;
  137. /* padding-bottom: 10px; */
  138. padding-bottom: .5vw;
  139. margin-left: 1vw;
  140. font-size: 1vw;
  141. font-weight: 500;
  142. opacity: 0.7
  143. }
  144.  
  145.  
  146.  
  147. /**/
  148. .holder-first-row {
  149. background-image: linear-gradient(#0f808d93, #ffffff);
  150. height: 6.5vw;
  151. opacity: 0.5;
  152. grid-area: 1/1/1/1;
  153. }
  154.  
  155. .holder-last-row {
  156. background-image: linear-gradient(#ffffff, #0f808d93);
  157. height: 3.5vw;
  158. opacity: 0.5;
  159. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement