a{text-decoration:none;}
article{
	width:80%;
	border:thin solid black;
	border-radius:5px;
	padding: 20px 20px;
	background-color:white;
	opacity:0.9;
	margin-top:20px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:20px;
  }

#backtotop{
	position:fixed;
	bottom:10px;
	right:10px;
	width:60px;
	height:60px;
	z-index:1100;
	opacity:0.7;
}

#backtotop:hover {
	-webkit-transform: scale(1.1,1.1);
	-moz-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
}
.bg-fixed {
	background-attachment:fixed;
	background-position:0px 10px;
	background-repeat:no-repeat;
	background-size: 100% 100%;
}	


body{
	font-family: Roboto,sans-serif;
	font-size:large;
	color:black;
	line-height: 1.5;	
	margin:0px;
	padding: 0px;
	width:100%;
	background-color:black;

	}
.bigbutton  a{
	display: inline-block;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	transition: 0.5s;
}
.bigbutton a:hover {
  color: #3366cc;
  -webkit-transform: scale(1.1,1.1);
  -moz-transform: scale(1.1,1.1);
  transform: scale(1.1,1.1);
}

#BigButtons{
	top:50%;
	width:90%;
	border:none;
	margin-left:auto;
	margin-right:auto;
	margin-bottom: 10px;
	padding: 10px 10px;

}

#buttons-container{
	width:100%;
	text-align:center;
	display:block;
	margin-left:auto;
	margin-right:auto;
	padding-top:40px;
	}
.bolded{font-weight:bold;}
	
.box-shadow	{
	box-shadow:rgb(110,110,110) 3px 3px 3px;
}
	
.button-for-more {
	width: 20%;
	color:black;
	margin-top:20px;
	margin-bottom:20px;
	margin-left:auto;
	margin-right:auto;
	padding:10px;
	background-color:#FAD502;
	border-radius:10px;
	box-shadow:rgb(110,110,110) 3px 3px 3px;
	text-align:center;
}
.button-for-more  a {
	color:black;
	text-decoration:none;
}


.button-for-more:hover {
	-webkit-transform: scale(1.1,1.1);
	-moz-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
}

.Contact{
background-color:orange;
font-size:large;
width:50%;
margin-bottom:10px;
}

.center {
  text-align:center;
  display:block;
  margin-left:auto;
  margin-right:auto;
}

.flex-container {
	display: flex;
	display: -webkit-flex;
	display: -moz-flex;
	height:100%;
	justify-content:center;
	align-items:center;
	flex-wrap: wrap
}

.flex-item {
	flex:1;/*size proportional to the other items*/
	margin:10px;
	
}

.img-circle{
	border:medium solid #3366cc;
	border-radius:50%;
	box-shadow:rgba(110,110,110,0.4) 3px 3px 3px;
	text-align:center;
	width:150px;
	height:150px;
	padding:10px 10px 10px 10px;
	margin:10px;
	background-repeat:no-repeat;
	background-size:100% 100%;

}

.flex-img:hover {	
	-webkit-transform: scale(1.1,1.1);
	-moz-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);	}


footer {
  clear: both;
  font-size: small;
  padding: 10px 10px;
  border-top:thin solid white;
  color:white;
  margin-left:auto;
  margin-right:auto;
  width:90%;
}


#header{
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:50px;
  !padding: 5px 5px 0px 5px;
  background-color:black;
  border-bottom: thin solid gray;
  color:white;
  z-index:1000;
 }	

#headerM{
	display:none;
}		

	
#hero{
	width:100%;
	height:100vh;	
	background: black;
	background-repeat:no-repeat;
	background-size:100% 100%;
	margin:0px;

	
}

#hero h1{
	font: 300% Arial, sans-serif;
 	color:white;
	text-shadow:2px 2px black;

}

#hero h2{
	font: bold italic 200% Palatino Linotype;
 	color: white;
	text-shadow:2px 2px black;

}

#hero .text{
	padding-top: 10%;
	text-align:center;
}

#hero .hero-note{
	display:block;
	color:black;
	width:40%;
	margin-left:auto;
	margin-right:auto;
	background-color:white;
	opacity:0.9;
	padding:20px;
	box-shadow:rgb(110,110,110) 3px 3px 3px;

}

.impact{
	font:bold 120% Palatino Linotype;
}


.img-circle:hover {
	-webkit-transform: scale(1.1,1.1);
	-moz-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);	
}

.inline {
	display: inline-block;
	}

main{
	width:95%;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
 
}

#MB-Logo{
	vertical-align: middle;
	z-index:1001;}

.menu-label {
	background-color:#3366cc;
	border-radius:3px;
	padding:2px;
	margin-top:15px;
	cursor: pointer;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	transition: 0.5s;
}

.menu-label:hover {
	background-color:black;
	color:white;}
	
.menu-input {
    display: none;
} /*Hide input element*/

.menu-content {
    margin-top: 1.5em;
}
.menu-input:not(checked) ~ .menu-content {
    display: none;
}
.menu-input:checked ~ .menu-content {       
    display: block;
}
.menu-input:checked ~ .menu-label {       
    background-color:black;
}
	
#nav {
	position:absolute;
	top:0px;
	right:10px;
	width:40%;
	height:40px;
	!background-color:red;
	z-index:1001;
  padding-top:10px;
}

#nav a {
	display: inline-block;
	text-decoration:none;
	vertical-align: middle;
	  padding-right:15px;
	color: white;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	transition: 0.5s;
}

#nav a:hover {
  color: #3366cc;
  -webkit-transform: scale(1.1,1.1);
  -moz-transform: scale(1.1,1.1);
  transform: scale(1.1,1.1);
}

#nav li{
  display:inline;


}

.section{
	border-bottom:thin solid white;
	width: 100%;
	min-height:50vh;
	margin:0px;
	padding:10px;
}

#search{
	position:absolute;
	width:100%;
	height:40px;
	margin:0px;
	padding-top:50px;
	background-color:#c9c9c9;
	z-index:900;
}	
	
#siteInfo{

	color: #000000;
	padding: 10px 10px;
	margin-top: 0px;
	font-size: small;
	
	list-style-type: square;
 	line-height: inherit;
	}

	#siteInfo img{
	padding: 4px 4px 4px 0px;
	vertical-align: middle;
	}

	
	
	#siteInfo ul{
	
	}
	
	#siteInfo li{
	line-height: 1.1;
	display:inline;
	padding-right:10px;
	}
	
ul{
 	list-style-type: square;
	}

.Contact{
background-color:orange;
font-size:large;
width:50%;
}


.center {
  text-align:center;
  display:block;
  margin-left:auto;
  margin-right:auto;
}

.superscript {vertical-align:super;}

.subscript {vertical-align:sub;}
	
.skipLinks {display: none;}



/********************* Responsive************************************************** **********************/
/********************* Responsive************************************************** **********************/
/********************* Responsive************************************************** **********************/


@media only screen and (min-width: 150px) and (max-width: 1200px)
{
.bg-fixed {
	background-attachment:scroll;
	background-position:0px 10px;
	background-repeat:no-repeat;
	background-size: 100vw 100vh;
}	


.button-for-more {
	width: 50%;}

#header{display:none;}

#headerM{
	position:absolute;
	display:block;
	width:98%;
	background-color:white;
	color:white;
	padding: 10px 10px;
	margin:0px auto 10px auto;
	top:0px;
	left:0px;
	z-index:2000;
	}

#headerM a {
	text-decoration:none;
}	
#hero{
	height:100%;	
	}

#hero h1{
	font: 175% Arial, sans-serif;
}

#hero h2{
	font: bold italic 150% Georgia, serif;
}

#hero .text{
	padding-top:20%;
}

#hero .hero-note{
	width:90%;
}

#logo{}

#search{
	display:none;
	}
.section {
	height:auto;
}
}

	

/********************* end **********************/