@import url("https://fonts.googleapis.com/css?family=Nunito+Sans:400,600,800&display=swap");
*{
padding: 0;
margin: 0;	
}
html{
font-size: 10px;
font-family: 'Nunito Sans', sans-serif;
}
html, body{
height: 100%;
}
img{
max-width: 100%;
height: auto;
}
.clear{
clear: both;
}
.image-top{
float: right; max-width: 50%; margin: 0 0 30px 30px;
}
.center{
margin: 0 auto 40px;
display: block;
}
.medium-padding{
padding: 60px 0;
}
.button{
position: relative;
display: inline-block;
background: white;
color: #0073cf;
text-decoration: none;
font-size: 3rem;
padding: 20px 20px 20px 80px; 
font-weight: 800;
text-transform: uppercase;
}
.button:before{
position: absolute;
top: 50%;
left: 25px;
content: "";
background: url(//www.jeanmauricevezina.ca/wp-content/themes/images/fl-button.png) no-repeat center center;
background-size: 60%;
height: 100%;
width: 37px;
transform: translateY(-50%);
}
.website-width{
width: 90%;
margin: 0 auto;
max-width: 1020px;
position: relative;
}
header{
height: 100%;
background: #0073cf;
}
header .website-width{
height: 100%;
}
header .text{
width: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
header h1{
position: relative;
font-size: 6rem;
text-transform: uppercase;
line-height: 1.2em;
color: white;
font-weight: 900;
margin-bottom: 50px;
}
header h1:before{
content:"";
position: absolute;
right: calc(100% - 15px);
top:-15px;
background: url(//www.jeanmauricevezina.ca/wp-content/themes/images/quote.png) no-repeat center center;
width: 163px;
height: 154px;
z-index: -1;
}
header h1 span{
position: relative;
}
header h1 span:after{
content:"";
position: absolute;
left: -20px; background: url(//www.jeanmauricevezina.ca/wp-content/themes/images/quote.png) no-repeat center center;
width: 163px;
height: 154px;
display: inline-block;
z-index: -1;
transform: rotate(180deg);
}
p{ font-size: 2.5rem;
line-height: 1.2em;
padding: 0 5%;
}
h2{
padding: 0 5%; font-size: 3rem;
line-height: 1.3em;
margin-bottom: 20px;
}
p+p{
margin-top: 20px;
}
.blueblock{
background: #0073cf;
padding: 40px;
margin-top: 50px;
}
.blueblock:after{
content: "";
display: block;
clear: both;
}
.blueblock h2{
font-size: 4rem;
color: white;
line-height: 1.2em;
text-transform: uppercase;
padding: 20px 0;
}
.blueblock p{
text-align: center;
color: white;
margin: 10px 0;
}
.blueblock .float{
width: 49%;
float: left;
}
.blueblock .float+.float{
float: right;
padding-left: 20px;
box-sizing: border-box;
}
.blueblock .float+.float p{
text-align: left;
font-size: 20px;
}
.blueblock .button{
font-size: 3rem;
text-transform: none;
display: block;
color: #0073cf;
padding-left: 20px;
text-align: center;
margin-bottom: 30px;
}
.blueblock .button:before{
display: none;
}
footer{
padding: 40px 0;
text-align: center;
background: #b1b3b3;
color: white;
}
footer a{
font-size: 5rem;
color: white;
text-decoration: none;
font-weight: 800;
margin-top: 20px;
} form{
margin: 30px 0;
}
form:after{
content:'';
display: block;
clear: both;
}
.field{
margin-bottom: 10px;
}
.field.half{
float: left;
width: 50%;
}
.field label{
margin-left: 10px;
}
.field.wpforms-field-checkbox,
.field p:first-child{
margin:15px auto;  
font-weight: bold;
}
.field p{
padding: 0;
width: 98%;
margin: 0 auto 0;
}
.field input[type="text"],
.field input[type="email"] {
width: 95%;
border: none;
padding: 5px 10px;
box-sizing: border-box;
font-size: 18px;
}
.field input[type="checkbox"]+label{
}
.wpforms-submit-container {
margin: -5px 0 10px;
}
.field input[type="submit"],
.wpforms-submit{
border: none;
padding: 5px 10px;
width: 95%;
box-sizing: border-box;
background: #0073D0;
color: white;
text-transform: uppercase;
font-size: 18px;
margin-top: 20px;
}
.wpforms-field { }
.wpforms-field-checkbox {
width: 98%;
font-size: 2.5rem;
line-height: 1.2em;
text-align: left;
}
.wpforms-field-checkbox > .wpforms-field-label {
margin: 15px auto;
}
.wpforms-field-checkbox ul {
margin-top: 15px;
list-style: none;
font-weight: normal;
}
.success,
.wpforms-confirmation-scroll{
color: #0073D0;
}
.wpforms-confirmation-scroll {
margin: 20px auto;
}
.errors,
.wpforms-error-container,
.wpforms-error {
font-size: 15px;
color: red;
text-align: left;
padding-left: 10px;
}
.wpforms-error-container {
margin: 10px 0;
}
@media screen and (max-width: 1000px){
header h1{
font-size: 5rem;
}
header h1:before{
display: none;
}
header h1 span:after{
display: none;
}
.button{
font-size: 2rem;
padding-left: 40px;
}
.button:before{
width: 25px;
left: 10px;
}
.blueblock{
text-align: center;
}
.blueblock .float{
float: none;
width: 100%;
}
}
@media screen and (max-width: 610px){
.image-top{
display: none;
}
header h1{
font-size: 3.5rem;
}
.button{
font-size: 1.5rem;
}
p{
font-size: 3rem;
}
.blueblock h2{
font-size: 2.5rem;
}
.blueblock .button{
font-size: 2rem;
}
footer a{
font-size: 3rem;
}
.field.half{
float: none;
width: 100%;
}
.field input[type="text"], .field input[type="submit"]{
width: 100%;
}
}
@media screen and (max-width: 420px){
header h1{
font-size: 2.8rem;
}
.button{
padding: 10px 10px 10px 40px;
font-size: 1rem;
}
p{
font-size: 2rem;
}
}