Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- body, html {
- height: 100%;
- }
- body {
- margin: 0;
- display: grid;
- grid-template-rows: 100%;
- grid-template-columns: 7fr 3fr;
- font-family: 'Montserrat', sans-serif;
- }
- /* left side of the page */
- .container {
- display: grid;
- grid-template-columns: 100%;
- grid-template-rows: repeat(5,1fr);
- background: linear-gradient(rgba(194, 189, 189, 0.719), rgba(85, 84, 84, 0.5)), url('./slike/slusalice.jpg');
- background-repeat: no-repeat;
- background-size: cover;
- overflow: hidden;
- }
- .container h3 {
- grid-area: 1/1/1/1;
- display: flex;
- justify-content: center;
- align-items: flex-end;
- font-size: 3vw;
- color: white;
- letter-spacing: 0.1vw;
- font-weight: 400;
- }
- .container h5 {
- padding-top: 0;
- margin: 0;
- grid-area: 2/1/2/1;
- display: flex;
- justify-content: center;
- align-items: center;
- font-size: 1.5vw;
- color: #115664;
- letter-spacing: 0.1vw;
- font-weight: 300;
- }
- /* right side of the page */
- .holder {
- display: grid;
- grid-template-columns: 100%;
- grid-template-rows: 0.5fr 0.5fr auto 1fr;
- border-style: solid;
- border-width: 1px;
- border-color: #115664;
- overflow: scroll;
- }
- /*Create an Account */
- .info-container {
- grid-area: 2/1/2/1;
- display: flex;
- justify-content: center;
- align-items: center;
- font-size: 1.7vw;
- font-weight: normal;
- opacity: 0.5;
- }
- /*forma*/
- .form-register {
- grid-area: 3/1/3/1;
- }
- .form-control {
- width: 85%;
- padding: 0.6vw 0.8vw;
- margin: auto auto;
- display: block;
- border: 2px solid #ccc;
- border-radius: 4px;
- box-sizing: border-box;
- }
- .form-control:focus {
- border-color: #80cec9;
- }
- .form-group input::placeholder {
- font-size: 0.8vw;
- }
- /*date and gender*/
- .form-group_top {
- display: inline-block;
- font-size: 0.8vw;
- width: 41%;
- margin-right: 1vw;
- margin-left: 1vw;
- }
- input[type=date] {
- font-size: 0.8vw;
- }
- .form-group_bottom {
- display: inline-block;
- margin-right: auto;
- margin-left: auto;
- }
- button[type=submit] {
- width: 10vw;
- background-color: #115664;
- color: white;
- font-size: 1.2vw;
- padding: 1vw 1.5vw;
- margin: 1.5vw 0;
- border: none;
- border-radius: 0.8vw;
- cursor: pointer;
- float: right;
- margin-right: 1.5vw;
- display: block;
- }
- button[type=submit]:hover {
- background-color: #02b5ca;
- }
- label {
- display: block;
- padding-top: 1vw;
- /* padding-bottom: 10px; */
- padding-bottom: .5vw;
- margin-left: 1vw;
- font-size: 1vw;
- font-weight: 500;
- opacity: 0.7
- }
- /**/
- .holder-first-row {
- background-image: linear-gradient(#0f808d93, #ffffff);
- height: 6.5vw;
- opacity: 0.5;
- grid-area: 1/1/1/1;
- }
- .holder-last-row {
- background-image: linear-gradient(#ffffff, #0f808d93);
- height: 3.5vw;
- opacity: 0.5;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement