File: D:/HostingSpaces/Neopoints/momsecurity.be/resources/sass/6-Organisms/_organisms.adviceContent.scss
.o-advice-content {
background-color: #FAFCFF;
margin-top: -60px;
padding-top: 120px;
padding-bottom: 160px;
position: relative;
.l-grid-content {
@include mq(700) {
display: flex;
justify-content: center;
align-items: flex-start;
}
}
.left {
width: 120px;
flex-shrink: 0;
@include mq(null, 700) {
margin: 0 auto 30px auto;
}
.phone-holder {
display: block;
width: 150%;
text-align: center;
position: relative;
left: -25%;
margin-top: 10px;
h4 {
line-height: 1.3;
}
a {
text-decoration: none;
font-weight: 400;
}
}
}
.right {
margin-left: column(0.5, 6.5);
@include mq(null, 700) {
margin-left: 0;
}
.s-text {
h1 {
font-size: 2rem;
font-weight: 500;
text-transform: none;
}
margin-bottom: 60px;
}
#adviceForm {
position: relative;
label {
display: block;
color: palette(text, 400);
margin-bottom: 20px;
}
.clientType {
position: relative;
margin-bottom: 50px;
label {
margin: 0;
display: inline-block;
width: column(2, 5);
}
p {
margin: 0 0 30px 0;
}
input {
display: none;
}
.private, .professional {
display: inline-block;
width: 100%;
border-radius: 20px;
border: 2px solid white;
box-shadow: 0 1px 3px 0 rgba(0,0,0,0.5), 2px 2px 15px 0 rgba(198,214,227,0.5);
background-color: white;
padding: 30px 0;
text-align: center;
cursor: pointer;
@include font(18, 22);
color: palette(text, 400);
&:hover {
background-color: rgba(#44A1F4, 0.2);
border: 2px solid #44A1F4;
}
}
.professional {
margin-left: 45px;
}
input[type=radio]:checked + div {
border: 2px solid #44A1F4;
}
}
input[type=text], textarea {
width: 100%;
padding: 12px 15px;
margin-bottom: 30px;
border-radius: 3px;
background-color: white;
color: black;
@include font(18, 22);
outline: none;
border: 1px solid transparent;
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
&:focus {
outline: none;
border: 1px solid #6EB8FF;
}
&::placeholder {
color: palette(text, 400);
}
}
textarea {
resize: none;
min-height: 100px;
color: black;
}
.submit {
input[type=submit] {
background: transparent;
border: none;
padding: 13px 35px 15px 35px;
cursor: pointer;
@include font(18, 22, 500);
@include border-radius;
border-radius: 400px;
color: white;
background: linear-gradient(90deg, #699BFF 0%, #2F6CE6 100%);
}
}
.error-message {
position: absolute;
right: 0;
color: indianred;
}
}
}
}