/*
    Stylesheet for form
    -------------------
 */

/* Hide of an unnecessary elements */
#dynamic-form #quote h1 {
    display: none;
}

#dynamic-form .container form h2 {
    display: none;
}

/* Main styles for the whole form */
#dynamic-form .container form {
    font-family: "Baloo 2", cursive;
}

#dynamic-form .container .form-control {
    font-family: "Baloo 2", cursive;
}

#dynamic-form .container select.form-control {
    padding-top: 5px;
}

#dynamic-form #quote {
    background: #fff;
    padding: 60px 0;
}

/* Top headline */
#dynamic-form .container div div form p:first-of-type {
    font-weight: bold;
    font-size: 30px;
    color: #014c81;
}

/* Amount buttons */
#dynamic-form #quote .amounts .btn {
    font-family: "Baloo 2", cursive;
    background: #2abe69;
    color: #000;
    font-size: 0.875rem;
    font-weight: bold;
    border-bottom: 4px solid #097f39;
    padding: 0.5rem;
    margin: 0.25rem;
    transition: 0.125s;
}

#dynamic-form #quote .amounts .btn:hover {
    border-bottom: none;
    margin-top: 0.5rem;
}

/* Second text */
#dynamic-form .container div div form p:nth-of-type(2) {
    color: #676767;
    padding: 1rem;
    margin-bottom: 3rem;
    font-size: 1.25rem;
}

/* Background */
#dynamic-form .container form .row .col-md-8.offset-md-2 {
    background: #eef3f7;
    padding: 0rem 1.25rem;
}

#dynamic-form .container form .row:nth-of-type(5) .col-md-8.offset-md-2,
#dynamic-form .container form .row:nth-of-type(6) .col-md-8.offset-md-2,
#dynamic-form .container form .row:nth-of-type(13) .col-md-8.offset-md-2,
#dynamic-form .container form .row:nth-of-type(14) .col-md-8.offset-md-2
{
    background: none;
}

#dynamic-form .container form .row:nth-of-type(2) .col-md-8.offset-md-2,
#dynamic-form .container form .row:nth-of-type(7) .col-md-8.offset-md-2,
#dynamic-form .container form .row:nth-of-type(12) .col-md-8.offset-md-2
{
    padding-top: 1.5rem;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

#dynamic-form .container form .row:nth-of-type(4) .col-md-8.offset-md-2,
#dynamic-form .container form .row:nth-of-type(11) .col-md-8.offset-md-2,
#dynamic-form .container form .row:nth-of-type(12) .col-md-8.offset-md-2
{
    padding-bottom: 0.5rem;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

#dynamic-form .container form .row:nth-of-type(5) .col-md-8.offset-md-2 {
    margin-top: 2rem;
}

#dynamic-form .container form .row:nth-of-type(6) .col-md-8.offset-md-2 {
    margin-bottom: 1.25rem;
}

#dynamic-form .container form .row:nth-of-type(12) .col-md-8.offset-md-2 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

#dynamic-form .container form div.row:last-of-type .col-md-8.offset-md-2,
#dynamic-form .container form div:nth-last-child(2) .col-md-8.offset-md-2
{
    border-radius: 10px;
    padding-top: 1.5rem;
    padding-bottom: 0.5rem;
    margin-bottom: 2rem;
}

#dynamic-form .container hr {
    display: none;
}



/* Labels */
#dynamic-form form .form-control-label {
    color: #014c81;
    font-weight: bold;
    font-size: 1.125rem;
}

/* Button */
#dynamic-form #quote .btn-primary {
    background-color: #29be68;
    border-color: #097f39;
    font-family: "Baloo 2", cursive;
    font-weight: bold;
    display: block;
}

#dynamic-form .btn-outline-primary {
    color: #000;
    background-image: none;
    background-color: transparent;
    border-color: #29be68;
    font-weight: bold;
    font-family: "Baloo 2", cursive;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

#dynamic-form .btns .btn-lg {
    font-family: "Baloo 2", cursive;
    background: #2abe69;
    font-weight: bold;
    color: #fff;
    border: none;
    border-bottom: 4px solid #097f39;
    margin: 2.25rem 0;
    border-radius: 4px;

}

#dynamic-form .btns .btn-lg:hover {
    margin-top: 2.5rem;
    border-bottom: none !important;
}

/* Checkboxes */
#dynamic-form form .form-check {
    font-size: 15px;
    font-family: "Baloo 2", cursive;
    font-weight: 400;
}

#dynamic-form form .form-check input {
    width: 30px;
    height: 30px;
    border-radius: 0.25rem;
    border: 1px solid #2abe69;
    margin-top: 0;
}

#dynamic-form form .form-check input:checked {
    background: #2abe69;
}

/* Hide the browser's default checkbox */
#dynamic-form form .form-check input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

#dynamic-form form .form-check label div::before {
    position: absolute;
    top: 0;
    left: 0;
    height: 30px;
    width: 30px;
    background-color: #fff;
    border: 1px solid #cecece;
    border-radius: 4px;
    content: " ";
    display: block;
}


#dynamic-form form .form-check label input:checked ~ div::before  {
    background: #29be68 url("tick.jpg") no-repeat center center ;
}

#dynamic-form form .form-check label div {
    padding: 0.25rem 1.5rem;
    font-size: 16px;
    font-weight: 300;
}

#dynamic-form #quote .btn-primary ~ p.text-center {
    display: none;
}

#dynamic-form form .btn-link {
    font-weight: bold;
    font-family: "Baloo 2", cursive !important;
    float: none !important;
    margin: 0.5rem auto 1rem !important;
    display: block;
    font-size: 1.125rem;
}

#dynamic-form form .btn-link:before {
    content: "";
    width: 13px;
    height: 13px;
    background: url("arrow-left.jpg") no-repeat center center;
    position: absolute;
    margin-top: 4px;
    margin-left: -20px;
    color: #014c81 !important;
}

#dynamic-form form .text-center .btn-link:before {
    display: none;
}

/* Title - step 2 */
#dynamic-form div.h2.text-center {
    font-family: "Baloo 2", cursive;
    font-size: 1.875rem;
    color: #014c81;
    margin-bottom: 4rem;
}

/* Thank you page */
#quote > div > div ~ .container > div:last-child > h1 ~ p.text-center {
    color: #014c81;
    font-weight: bold;
    font-family: "Baloo 2", cursive;
    font-size: 1.875rem;
    max-width: 60%;
    text-align: center;
    margin: 1rem auto;
    line-height: 2rem;
}

#quote > div > div ~ .container > div:last-child > h1 ~ p.text-center:after {
    width: 100%;
    display: block;
    margin: 3rem 0 3rem;
    background: #eef3f7 url("maskot.jpg") no-repeat;
    background-position-x: 80%;
    background-position-y: bottom;
    content: "";
    min-height: 300px;
    border-radius: 10px;
}

/* Pading fix */
#dynamic-form #quote {
    background: #fff;
    padding: 20px 0;
}

/* Conditions */
#dynamic-form .container form .row:nth-of-type(16) .col-md-8.offset-md-2 p, #dynamic-form .container form .row:nth-of-type(16) .col-md-8.offset-md-2 p .btn-link {
    font-size: 16px !important;
    background: none;
}

#dynamic-form .container form .row:nth-of-type(16) .col-md-8.offset-md-2 p{
    margin-bottom: 0;
}

#dynamic-form .container form .row:nth-of-type(16) .col-md-8.offset-md-2 p .btn-link {
    margin: 0 !important;
}