.ideaContent{ min-height: 100%; height: 100%; width: 100%; display: block; .head{ padding-top: 20px; padding-bottom: 50px; margin-bottom: 20px; border-bottom: 2px solid rgba(87, 87, 87, 0.3); width: 100%; display: block; label{ margin-left: 50px; margin-bottom: 20px; width: 60%; display: block; float: left; input{ background-color: transparent; border: 0px; border-bottom: 2px solid rgba(87, 87, 87, 0.5); font-size: 24pt; color: white; outline:none; font-weight: bold; width: 100%; transition: 100ms; transition-timing-function: linear; &::placeholder{ color: rgba(255, 255, 255, 0.44); font-weight: bold; } &:hover{ border-color: rgb(80, 209, 160); } &:focus{ border-color: rgb(80, 209, 160); } } } } .textAreaContainer{ width: calc(100% - 10px); height: 700px; display: block; padding-left: 10px; textarea{ outline: 0; display: block; width: calc(100% - 43px); height: 100%; background-color: rgba(71, 71, 71, 0.171); border: 0px solid transparent; resize: none; box-shadow: 4px 0px 7px 2px rgba(61, 61, 61, 0.3); font-size: 13pt; padding-left: 20px; padding-right: 20px; padding-top: 10px; padding-bottom: 10px; font-family: 'Roboto', sans-serif; border-left: 3px solid transparent; transition: 100ms; transition-timing-function: linear; &:hover{ border-color: rgb(80, 209, 160); } &:focus{ border-color: rgb(80, 209, 160); } } .error-text{ padding-left: 23px; } } .input-error{ border-color: rgb(255, 45, 45) !important; } .error-text{ color:rgb(255, 45, 45); font-weight: bold; cursor: text; } }