fitraagungdp

Untitled

Sep 27th, 2022
73
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 2.29 KB | Source Code | 0 0
  1. @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&family=Roboto&display=swap');
  2. *{
  3.     box-sizing: border-box;
  4. }
  5.  
  6. body{
  7.     background: white;
  8.     font-family: 'Poppins', sans-serif;
  9.     margin: 0;
  10.     padding: 0;
  11.     background-color: #9CCDEB;
  12.    
  13. }
  14.  
  15. .form{
  16.     border-radius: 50px;
  17.     justify-content: center;
  18.     background: #F3FBFD;
  19.     border: 1px solid #c1c1c1;
  20.     margin-top: 5%;
  21.     margin-bottom: 5%;
  22.     max-width: 1500px;
  23.     margin-left: auto;
  24.     margin-right: auto;
  25.     padding: 1rem;
  26.     overflow: hidden;
  27.     box-shadow: 100px;
  28. }
  29.  
  30. /* .header{
  31.     text-align: center;
  32. } */
  33.  
  34.  
  35. .form-input label{
  36.     float: left;
  37.     text-align: left;
  38.     display: block;
  39.     padding-bottom: 1.20rem;
  40.  
  41. }
  42.  
  43. .form-input input{
  44.     margin-bottom: 1rem;
  45.     background: white;
  46.     border: 1px solid wheat;
  47.     border-radius: 2px;
  48.     width: 100%;
  49.     padding: 0.7em;
  50.     margin-bottom: 0.5rem;
  51. }
  52.  
  53. .form-input input:focus {
  54.     outline: 1px solid orange;
  55. }
  56.  
  57. .form .button{
  58.     margin-top: 10px;
  59. }
  60.  
  61. .form .button input{
  62.     height: 30px;
  63.     width: 1165px;
  64.     float: right;
  65.     border: none;
  66.     background-color: rgb(238, 175, 56);
  67.     letter-spacing: 1px;
  68.     border-radius: 5px;
  69.     font-size: 20px;
  70.     font-weight: 500;
  71.     cursor: pointer;
  72.     transition: all 0.3s ease;
  73. }
  74.  
  75. .button input:hover{
  76.     background-color: orange;
  77. }
  78.  
  79. select {
  80.     float: right;
  81.     width: 100%;
  82.     padding: 0.7em;
  83.     margin-bottom: 0.5rem;
  84.     background-color: white;
  85.     border: 1px solid wheat;
  86.  
  87. }
  88.  
  89. select:focus {
  90.     outline: 1px solid orange;
  91. }
  92.  
  93. .form .messages{
  94.   margin-top:100px ;
  95. }
  96.  
  97. .form .messages h1{
  98.   margin-top:45rem ;
  99. }
  100.  
  101. .form .box{
  102.   margin-left: 10px;
  103.   margin-bottom: 50px;
  104.   margin-top: 50px;
  105.   width: 500px;
  106.   height: 150px;
  107.   border: 1px solid black;
  108.   background-color: white;
  109.   border-radius: 5px;
  110. }
  111.  
  112. .form .box p{
  113.   padding-left: 1rem;
  114. }
  115.  
  116. @media (min-width: 400px) {
  117.  
  118. .form {
  119.     overflow: hidden;
  120. }
  121.  
  122. .form-input label {
  123.     float: left;
  124.  
  125.     width: 200px;
  126. }
  127.  
  128. .form-input input {
  129.   float: right;
  130.   width: calc(100% - 300px);
  131. }
  132.  
  133. .form select {
  134.     float: right;
  135.     width: calc(100% - 300px);
  136. }
  137.  
  138. .form .button {
  139.  
  140.     float: right;
  141.  
  142.     width: calc(100% - 200px);
  143.  
  144. }
  145.  
  146. }
Advertisement
Add Comment
Please, Sign In to add comment