@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Varela+Round&display=swap');
body {font-family: 'Varela Round', sans-serif;color:#000000}
h1, h2, h3, h4, h5 {color:#36438C}
h1 {}
h2{margin-bottom:1.5rem}section {padding:2rem 0}
img {max-width: 100%}
.jumbotron {background: url(../images/banner.jpg) no-repeat; background-size: cover; padding: 25vh; color:#ffffff; position: relative}
.jumbotron:before {position: absolute; width: 100%; height:100%; background: rgba(36,44,93,0.5); content:''; top:0; left:0}
.jumbotron h1 {color:#ffffff}

.price {color:#ffffff; text-align: center; padding:0.5rem 0 1rem 0; transform: scale(1.01); transition: 0.2s ease all}
.price:hover {transform: scale(1.1); z-index: 2}

.step {padding:2rem;color:#ffffff; margin: 0; height:100%}
.step h5 {color: #ffffff; border-bottom:1px solid #ffffff; padding-bottom:0.6rem;margin-bottom:1rem!important; display: block;text-transform: uppercase;width: fit-content;}
.step.one {background: #2190BB; }
.step.two {background: #A3B73A; }
.step.three {background: #8E236D; }
.step:before {content:''; height:50%;width:100%;position: absolute;top:0;left:0;border-right:70px solid #f1f1f1; border-bottom:160px solid transparent }
.step:after {content:''; height:50%;width:100%; position: absolute;bottom:0;left:0;border-right:70px solid #f1f1f1; border-top:160px solid transparent }

.form-control {display: block; width: 100%;padding: 0.5rem 0.75rem;font-size: 1rem;line-height: 1.25;color: #495057;background-color: #fff; background-image: none;background-clip: padding-box;border: 1px solid rgba(0,0,0,.15);border-radius: .25rem;transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;}

.form-control.main {
    background: #fff;
    padding: 1.8rem 1rem;
    margin-bottom: 20px;
    border: 1px solid #cccccc;
	font-size: 14px;}

textarea {overflow: auto;resize: vertical;}
label {
	width: 100%;}
#reused_form button.btn {background: #36438C; border:1px solid transparent; transition: 0.2s ease all; color:#ffffff}
#reused_form button.btn:hover {background:#F68C35;color:#ffffff}

button, input, optgroup, select, textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
	line-height: inherit;}

[role=button], a, area, button, input, label, select, summary, textarea {
    -ms-touch-action: manipulation;
	touch-action: manipulation;}

.btn-primary {background:#36438C; transition: 0.2s ease all; color:#ffffff;border:1px solid transparent}
.btn-primary:hover {color:#ffffff; background:#F68C35;border:1px solid transparent;}


/* popup */
/* The Modal (background) */
.modal-container {
 visibility: hidden;/* Hidden by default */
 opacity: 0;
 transition: 0.2s ease all;
 position: fixed; /* Stay in place */
 z-index: 1; /* Sit on top */
 left: 0;
 top: 0;
 width: 100%; /* Full width */
 height: 100%; /* Full height */
 overflow: auto; /* Enable scroll if needed */
 background-color: rgb(0,0,0); /* Fallback color */
 background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal-container.open {visibility: visible;opacity: 1;}

/* Modal Content/Box */
.modal-content {
 background-color: #fefefe;
 margin: 15% auto; /* 15% from the top and centered */
 padding: 20px;
 border: 1px solid #888;
 width: 100%; /* Could be more or less, depending on screen size */
 max-width: 650px;
}

/* The Close Button */
.close {
 color: #000000;
position: absolute;
right:25px;
 font-size: 28px;
 font-weight: bold;
}

.close:hover,
.close:focus {
 color: #36438C;
 text-decoration: none;
 cursor: pointer;
}