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

body,h1,h2 {font-family: sans-serif}
body {margin-top: 160px;}
h1 {font-size: 64px!important;font-weight:lighter;margin-bottom: 0px;margin-top: 0px}
h2 {font-size: 30px!important;font-weight: lighter;margin-bottom: 0px; position: relative} 
h3 {font-size: 25px!important;font-weight: lighter}
	

	.text-black{color:#000!important;
				opacity: 1!important
	}
	
	.border-white{border-color:#fff!important}

	.list-nav{
		display: inline;
		font-size: 16px;
		padding: 20px;
		color: black
	}

	.list-nav:hover{border-bottom: solid; border-bottom-color: #23614E}
	.nav{margin-right: 100px; margin-top: 67px}
	.burger-nav{display: none}
	.burger-nav:hover{cursor: pointer}
	.nav-img{width: 230px}
	.burger-nav-show{display:block!important;min-height: 100%}

	.dropdown-content{
		cursor:auto;
		background-color:#fff;
		border-bottom:  9px solid #23614E;
		display:none;
		position:absolute;
		min-width: 100%;
		margin-top: 43px;
		padding:0;
		text-decoration: none;
		color: black!important;
	}

	.dropdown-button{
		font-size: 20px;
		display:inline-block;
		margin-left: 0px;
		margin-right: 10px;
		padding: 20px;
		min-width: 95%;
		overflow:hidden;
		text-decoration:none;
		color:inherit;
		background-color:inherit;
		text-align:center;
		cursor:pointer;
		border-bottom: solid 1px!important;
		border-bottom-color: lightgrey!important
	}

	.dropdown-button:hover{
	border-right: solid;
	border-right-color: #23614E
	}

	.nav-box-left{
		float: left;
		margin-top: 35px; 
		margin-left: 120px; 
		margin-bottom: 20px
	}
	
	.display-topleft{
		position: fixed;
		margin-top: 0px;
		margin-left: 0px;
		box-shadow: 0px -15px 40px grey
	}

	.display-topmiddle{
		width: 60%;
		margin-top: 0px;
		margin-bottom: 60px
	}

	.header {
   		position: fixed;
   		left: 0;
  		top: 0;
   		width: 100%;
		height: 160px;
		background-color: white;
		border-top: 9px solid #23614E;
		z-index: 1000
	}

	footer{
		position: relative;
		bottom: 0; 
		left: 0; 
		border-top: solid 9px #23614E;
		overflow: hidden
	}

	.footer{
		padding: 20px; 
		width: 100%;
		background-color: whitesmoke;
		overflow: hidden
	}

	.pfooter{
		margin-left: 60%
	}

	article{margin-bottom: 100px}

	.collapsible {
  		background-color: grey;
  		color: white;
  		cursor: pointer;
  		padding: 18px;
  		width: 100%;
  		border: none;
  		text-align: left;
  		outline: none;
  		font-size: 15px;
	}

	.active, .collapsible:hover {
 		 background-color: #555;
	}

	.col-content {
  		padding: 0 18px;
  		display: none;
  		overflow: hidden;
  		background-color: whitesmoke;
	}

	#ToTop {
  		display: none; 
  		position: fixed; 
  		bottom: 5px; 
  		right: 110px; 
  		z-index: 99; 
  		border: none; 
  		outline: none;
  		cursor: pointer; 
  		padding: 15px;
		width: 62px;
		height: 62px;
		background: url("backtotop.svg") no-repeat
	}

	#ToTop:hover {
		background: url("backtotop_hover.svg") no-repeat
	}

 .slider-container {
      min-height: 500px;
      width: 100%;
      position: relative;
      overflow: hidden;
      text-align: center;
      }
      .menu {
      position: absolute;
      left: 0;
      z-index: 900;
      width: 100%;
      bottom: 0
      }
      .menu label {
      cursor: pointer;
      display: inline-block;
      width: 16px;
      height: 16px;
      background: #fff;
      border-radius: 50px;
      margin: 0 0.2em 1em
      }
      .menu label:hover,.menu label:focus {background: #23614E}
      .slide {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 100%;
      z-index: 10;
      padding: 8em 1em 0;
      background-size: cover;
      background-position: 50% 50%;
      transition: left 0s 0.75s
      }
      [id^="slide"]:checked + .slide {
      left: 0;
      z-index: 100;
      transition: left 0.65s ease-out;
	  }
      .slide-1 {
      background-image: url("slider/1.jpg");
	  background-position: center
      }
      .slide-2 {
      background-image: url("slider/2.jpg");
	  background-position: left
      }
      .slide-3 {
      background-image: url("slider/3.jpg");
	  background-position: left
      }
	  .slide-4 {
      background-image: url("slider/4.jpg");
	  background-position: right
      }

@media only screen and (max-width: 1050px){
	
	.nav{margin-right: 10px;}
	.list-nav{display:none;}
	.burger-nav{display: inline; margin-right: 15px; margin-top: -13px}
	.nav-box-left{margin-left: 20px;}
	.nav-img{width: 170px;}
	
	.header {
   		position: fixed;
   		left: 0;
  		top: 0;
   		width: 100%;
		height: 130px;
		background-color: white;
		border-top: 9px solid #23614E;
		z-index: 1000
	}
	
	footer{left:0px;bottom:0px;position: relative}
	
	.pfooter{
		margin-left: 0%
	}
	
	.display-topmiddle{
		position: static;
		margin-top: 0px;
		margin-bottom: 75px;
		width: 90%
	}
	
	#ToTop {
  		display: none; 
  		position: fixed; 
  		bottom: 5px; 
  		right: 30px; 
  		z-index: 99; 
  		border: none; 
  		outline: none;
  		cursor: pointer; 
  		padding: 15px;
		width: 62px;
		height: 62px;
		background: url("backtotop.svg") no-repeat
	}
	
	.slider-container {
      min-height: 450px;
      width: 100%;
      position: relative;
      overflow: hidden;
      text-align: center;
      }
		
}



@media only screen and (min-width: 1700px){
	.container-left{
		float: left;
		max-width: 47%
	}
	
	.container-right{
		float: right;
		max-width: 50%
	}
}


@media only screen and (max-width: 900px){
		.slider-container {
      min-height: 385px;
      width: 100%;
      position: relative;
      overflow: hidden;
      text-align: center;
      }
}


@media only screen and (max-width: 750px){
		.slider-container {
      min-height: 321px;
      width: 100%;
      position: relative;
      overflow: hidden;
      text-align: center;
      }
}


@media only screen and (max-width: 600px){
		.slider-container {
      min-height: 257px;
      width: 100%;
      position: relative;
      overflow: hidden;
      text-align: center;
      }
}


@media only screen and (max-width: 450px){
		.slider-container {
      min-height: 192px;
      width: 100%;
      position: relative;
      overflow: hidden;
      text-align: center;
      }
}


@media only screen and (max-width: 300px){
		.slider-container {
      min-height: 128px;
      width: 100%;
      position: relative;
      overflow: hidden;
      text-align: center;
      }
}


@media only screen and (max-width: 200px){
		.slider-container {
      min-height: 85px;
      width: 100%;
      position: relative;
      overflow: hidden;
      text-align: center;
      }
}