@import url('https://fonts.googleapis.com/css?family=Dancing+Script:400,700|Merriweather:400,700');
/*basic reset*/

* {margin: 0; padding: 0;}


html {
  height: 100%;

}

#video-fond{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
    display: block;
}
#video-fond > video {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
}
body {
  font-family: arial, verdana,'MS Serif';font-size: 28px;
  /*width:95%;margin:0 auto;*/
  width:100%
}
 .container {
    /*max-width: 970px;*/
}
#step2  {max-width: 80%;}
.step11 {max-width: 80%;}
.step3 {max-width: 80%;}
#msform .step5 {width: 80%;}
@media screen and (max-height: 855px) {
    
    #services{
/*        position:absolute;
            top:760px;*/
            width:100%;
           
                
    }
}
/*@media screen and (max-width: 992px) {*/
   
    #firstsection{
     margin:0 0 150px 0;min-height: 820px;position:relative  
    }
@media screen and (min-width: 992px) {
    .step7 .submit{
       position:absolute;bottom:10px; right:10px
    }}
/*}
@media screen and (min-width: 40.5em) {*/
    #head{
        max-width: 100%;
    /*background-color: #49c3b9;*/
    opacity: 0.55;
   
    padding: 15px 5px 2px 5px;
    text-align: center;
    font-size: 25px;
    font-weight: 700;
    /*margin-left: 200px;*/
    color:black;
    font-family: inherit;
    /*border-radius: 15px;*/
    margin: 0 0 0 10%
/*    position: absolute;
    left: 27%;*/
/*    margin-top: 5px;
    min-width:600px*/
    }
   .step1 p{padding: 5px 71px;}  
   .step2 p{padding: 0 35px;}  
  .break{
    margin-top:35px;
    
  }
  .progress__percentage:after {
      top: -3px;
      border-width: 25px 0 25px 10px;
  }

  .progress_container{
      margin-left: 10%;
      margin-right: 10%;
      /*width:75%;*/
    }

  .progress__percentage:after {
      content: '';
      position: absolute;
      right: -9px;
      width: 0;
      height: 0;
      border-style: solid;
      border-color: transparent transparent transparent #39464E;
      -moz-transform: scale(0.9999);
  }

  .progress__percentage {
      position: relative;
      text-align: right;
      font-family: 'RobotoMedium', Arial, sans-serif;
      font-weight: 500;
          font-size: 18px;
      font-style: normal;
      padding: 0 12px 0 0;
      background: #39464E;
      -moz-transition: width 1.5s 0s;
      -o-transition: width 1.5s 0s;
      -webkit-transition: width 1.5s;
      -webkit-transition-delay: 0s;
      transition: width 1.5s 0s;

      width:0%;
      min-width: 44px;
      height: 44px;
      line-height: 44px;
      
  }

  .progress {
      min-height: 44px;
  }
  .progress {
      position: relative;
      margin: 20px 0 0 0;
      overflow: hidden;
      background: #49c3b9;
      color:white;
      background-color: #49c3b9;
      border-radius: 4px;
      -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
      box-shadow: inset 0 1px 2px rgba(0,0,0,.5);
      opacity: 0.85;
  }
  
  h2 , h3, p{
      font-weight: 500;
  }
  .choice_container_container{
    text-align:center;
  }

  .ml{
     margin-left:25px;
  }

  .input{
    max-width:400px;
    display:block;
    margin:auto;
    text-align:left;
    border:0px
   
  }
  textarea{
      max-width: 600px;
      height: 165px;
      margin:auto;
      text-align:left;
      font-size: 20px
  }
  .choice_container{
      position:relative;
         width: 80%;
      width: 100px;
      height: 100px;
      display:inline-block;
  }

  .choice:before{
    content: '';
      display: inline-block;
      height: 100%;
      vertical-align: middle;
  }


  .choice:hover{
    color:white;
    background-color:#49c3b9;
  }
  .choice{
    font-size: 23px;
      line-height: 1;
    position: absolute;
      top: 0;
      left: 0;
      color:#47535a;
    border:1px solid #47535a;
    width:100px;
    height:100px;
    border-radius:50%;
    
    
  }
  .color_place{
      color:#49c3b9;
      font-weight: bold;
  }
  select{
      width:300px;
	max-width:450px;
	margin-right:auto;
	margin-left:auto;
	margin-top:40px;
	height: 50px !important;
    font: 20px "Lato", "Helvetica Neue", Arial, sans-serif;
    font-size: 18px !important;
}
.itemLoc{
	width: 280px;
    padding: 3px 5px;
    text-align: left;
    overflow: hidden;
    border: 1px #DADADA solid;
    border-radius: 5px;
    font: 16px/1.3 "Lato", "Helvetica Neue", Arial, sans-serif;
    
   background: #F7F7F7;
   margin-bottom: 8px;
    
}
.dptli{
    width: 190px;
    height: 160px;
    margin-top: 10px;
    margin-left: 10px;
    display: table-cell;
    vertical-align: middle;
    margin-right: auto;
   
     margin-left: auto;
   
text-align: center;
    cursor:pointer;}

.otherdpt{width:195px;height:140px ;position:relative; display:table-cell;vertical-align: middle;text-align: center;font-weight:1000; margin: auto 5; }

.itemLoc .fa-map-marker{
	color:#FF0083;
	margin-right:10px;
}
.dptColor{
      outline: 2px solid black;
    box-shadow:inset 2000px 0 0 0 rgba(143, 230, 200, 0.7);
     border-color:rgba(143, 230, 200,0.7);
}
.locSelected{
	margin-top: 10px;
    margin-bottom: -40px;
}

.itemLoc .fa-times{
	/*float: right;*/
    color: #999;
	transition:all 0.6s;
	cursor:pointer;
        position:absolute;bottom:10px;right:10px
}

.itemLoc .fa-times:hover{
	color:red;	
}
.restart{
	font-family: fantasy;
       font-weight:bold;
	 text-align: center;
	color:#49c3b9;
	float:right;
       
}
section {
    padding: 0px 0;
}
#services{
    /*position: absolute;bottom: 0;height:65px*/
    height: auto;
/*  position: absolute;
  bottom: 0;*/
  width:100%;
  margin: 0 auto
}
  /*form styles*/
  #msform {
  	/*width: 75%;*/
        
  	margin: 11% auto;
  	text-align: center;
  	position: relative;
        /*height:65%*/
            
  }
  #msform fieldset ,#msform form{
        font-weight: bold;
        /*height: 78%;*/
  	background: white;
        opacity: 0.85;
  	border: 0 none;
  	border-radius: 3px;
  	box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
  	padding: 20px 30px;
  	/*margin-top: 20%;*/
  	box-sizing: border-box;
  	/*width: 75%;*/
  	margin: 0% 10%;
  	
  	/*stacking fieldsets above each other*/
  	position: absolute;
        /*max-width: 100%;*/
  }
  /*Hide all except first fieldset*/
  #msform fieldset:not(:first-of-type) {
  	display: none;
  }
  /*inputs*/
  #msform input, #msform textarea, #msform select{
        
  	padding: 15px;
  	/*border: 1px solid #ccc;*/
  	border-radius: 3px;
  	margin-bottom: 10px;
  	width: 100%;
  	box-sizing: border-box;
  	/*font-family: montserrat;*/
  	color: #1C2833;
/*  	font-size: 16px !important;*/
        font-weight: 500;
  }
  /*buttons*/
  #msform .action-button {
      max-width: 180px;
      background: #49c3b9;
      font-weight: bold;
      color: white;
      border: 0 none;
      border-radius: 1px;
      cursor: pointer;
      padding: 13px;
/*      margin: 10px;*/
      font-size: 20px;
  }
 #msform .submit.active{
	background-color:#49c3b9;
	transition:all 0.6s;
}
  #msform .action-button:hover, #msform .action-button:focus {
  	box-shadow: 0 0 0 2px white, 0 0 0 3px #27AE60;
  }
  .quote-fees {
      color:#39464E;
    font-size:14px;
    text-align:left;
        width: 100%;
      border: solid 1px;
  }

  .quote-fees td:nth-child(2){
    border-left:1px solid;
    padding-left:20px;
  }

  .not-sure{
    color:#39464E;
    font-size:14px;
    
  }

  /*headings*/
  .fs-title {
  	font-size: 15px;
  	text-transform: uppercase;
  	color: #2C3E50;
  	margin-bottom: 10px;
    
  }
  .fs-subtitle {
  	/*font-weight: normal;*/
  	font-size: 26px;
  	color: #666;
  	margin-bottom: 20px;
  }
  /*progressbar*/
  #progressbar {
  	margin-bottom: 30px;
  	overflow: hidden;
  	/*CSS counters to number the steps*/
  	counter-reset: step;
  }
  #progressbar li {
  	list-style-type: none;
  	color: #1b1919;
  	text-transform: uppercase;
  	font-size: 11px;
  	width: 16.00%;
  	float: left;
  	position: relative;
  }

  #progressbar li:before {
  	content: counter(step);
  	counter-increment: step;
  	width: 20px;
  	line-height: 20px;
  	display: block;
  	font-size: 14px;
  	color: #333;
  	background: #ccc;
  	border-radius: 3px;
  	margin: 5px auto 5px auto;
  }
  /*progressbar connectors*/
  #progressbar li:after {
  	content: '';
  	width: 100%;
  	height: 2px;
  	background: #ccc;
  	position: absolute;
  	left: -50%;
  	top: 9px;
  	z-index: -1; /*put it behind the numbers*/
  }
  #progressbar li:first-child:after {
  	/*connector not needed before the first step*/
  	content: none; 
  }
  /*marking active/completed steps green*/
  /*The number of the step and the connector before it = green*/
  #progressbar li.active:before,  #progressbar li.active:after{
  	background: #27AE60;
  	color: white;
        
  }
  
  .departe {
  /*content: attr(index);*/
  font-size: 1em;
  color: black;
  margin-top: 5px;
  font-weight:1000;margin:0 auto;padding-bottom:5px
  /*text-shadow: 0 0 1px grey, 0 0 1px grey, 0 0 1px grey, 0 0 1px grey, 0 0 1px grey, 0 0 1px grey;*/
}
/*}*/
@media (min-width: 1200px){
    .container {
        width: 1200px;
    }
}
#lab_cons{ padding-left: 55px;padding-top: 15px;float: left;}
.consent{font-weight: 400;font-size: 16px}
.tooltipBox {
/*    -webkit-transition: all .5s ease-in;
 transition: all .5s ease-in;*/
/*display:none;*/
transition:height  0.8s ease 0.8s;
-webkit-transition:height  0.8s ease 0.15s;
/*transition-property: padding;
  -webkit-transition-property: padding;*/
overflow: hidden;
height:0px;
   position: absolute;
   z-index: 100000;
   left: 0%;
   top: 100%;
   padding: 0px 10px;
    
    /*width: 850px;*/
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.35);
    background-color: white;
    opacity:0.9;
    text-align: justify;
    font-size: 13px;
    color:black; 
    font-weight: 500;
    line-height: 12px;
    *width:125%
}
 .tooltipBox {
    /*width:75%*/
}


.tooltipB:hover .tooltipBox{
	display:block;
}


.label__checkbox {
  display: none;
}

.label__check {
  display: inline-block;

  border: 3px solid rgba(0,0,0,0.4);
  background: white;
  vertical-align: middle;
  margin-right: 20px;
  width: 2em;
  height: 2em;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border .3s ease;
}

.label__checkbox:checked + .label__text .label__check {
  animation: check .5s cubic-bezier(0.895, 0.030, 0.685, 0.220) forwards;
  
  .icon {
    opacity: 1;
    transform: scale(0);
    color: white;
    -webkit-text-stroke: 0;
    animation: icon .3s cubic-bezier(1.000, 0.008, 0.565, 1.650) .1s 1 forwards;
  }
}
.step8 button{margin-left:0%;font-size:22px }
#res{margin-left: 160px;}
.center {
  position: relative;
    float: left;
    left: 15%;
}


@media screen and (min-width: 653px) {
    .restart{
         padding: 15px;
	font-size:28px;
        
    }
    .p_dispo{padding: 9px;}
    h1{font-size:28px }
    .locSelected{
        display:flex;width:90%;margin:10px auto
    }
     .step7 .submit{
        position:static;
        /*margin-left:30%;*/
        margin-top:20px
            
    }
    input{font-size: 16px}

.step3 p{margin-left: 60px;padding: 5px 42px}
.step11 p{margin-left: 60px;padding: 5px 42px}
}

@keyframes icon {
  from {
    opacity: 0;
    transform: scale(0.3);
  }
  to {
    opacity: 1;
    transform: scale(1)
  }
}

@keyframes check {
  0% {
    width: 1.5em;
    height: 1.5em;
    border-width: 5px;
  }
  10% {
    width: 1.5em;
    height: 1.5em;
    opacity: 0.1;
    background: rgba(0,0,0,0.2);
    border-width: 15px;
  }
  12% {
    width: 1.5em;
    height: 1.5em;
    opacity: 0.4;
    background: rgba(0,0,0,0.1);
    border-width: 0;
  }
  50% {
    width: 2em;
    height: 2em;
    background: #00d478;
    border: 0;
    opacity: 0.6;
  }
  100% {
    width: 2em;
    height: 2em;
    background: #00d478;
    border: 0;
    opacity: 1;
  }
}
.fa-close{
	float: right;
    font-size: 18px !important;
    margin-left: 15px;
    margin-bottom: 5px;
}

.error{
	max-width:400px;
	display:none;
	margin-right:auto;
	margin-left:auto;
	margin-top:10px;
        font-size: 18px;
        font-weight: 400;
}