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


	h1 {font-family: 'oswald', sans-serif; color: #fff; line-height:1.2em; font-weight:900; font-size:60px; text-shadow:1px 1px #000; letter-spacing: -1px; text-transform:uppercase;}
	
	h2 {font-family: 'oswald', sans-serif; font-size:36px; color: #3e3e3e; margin-bottom:20px;  line-height:1.3em; font-weight:900 !important; text-transform:uppercase; }

h3 {font-family: 'oswald', sans-serif; font-size:30px;  color:#277c78; margin-bottom:20px;  line-height:1.3em; font-weight:900 !important; text-transform:uppercase !important; }
.logotext {font-family: 'Roboto', sans-serif;  font-size:22px; color: fff; font-weight:900 !important; margin-top:30px;  line-height:1em;  } 


	.stat {font-weight:900;  font-family: 'roboto', sans-serif; font-size:52px; text-shadow:1px 1px #000;}	
.partner {text-align:center; padding:10px;}
.image {max-width:90%; text-align:center;}
.image2 {max-width:70%; text-align:center;}
.line::before {
	content: "";
width: 20%;
height: 10px;
background: #e74d4f;
display: block;
margin: 0 10px 20px 0;
}


		.source {font-family: 'oswald', sans-serif; font-size:14px; color: #3e3e3e; margin-bottom:10px; font-weight:900; line-height:1.3em; }
		.orangecolor {color: #1a72af; font-weight:800;}

.yellow {color:#e7bd02; font-size:14px; font-weight:800}
	p, li {font-family: 'montserrat', sans-serif; font-size: 18px; color:#000; font-weight:400; line-height:1.8em; }
.shade {
	
	color: white;
	font-size:24px;
	
	
}

.shade span {
	
	background-color: #3e3e3e;
	padding: 8px;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	line-height:2em;
	
}

.tools {
  position: relative;
  display: inline-block;
 color:#f56725 !important;
}

.tools .toolstext {
  visibility: hidden;
  width: 400px;
  background-color: black;
  color: #fff;
  text-align: left;
  border-radius: 0px;
  padding: 8px 10px 8px 10px;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  margin-left: -60px;
	font-size:12px; 
	line-height:1.4em;
}

.tools .toolstext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 25%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}


.tools:hover .toolstext {
  visibility: visible;
}

.footer {font-size: 12px;}
.footer a {color:#173842;}

.boybackground {background-image:url(boy_smoke.jpg); background-repeat: no-repeat; background-size: cover; } 
.buttonlink {color:#fff !important;  font-size:18px !important; padding:10px; text-align:left !important; font-family:roboto; }

.intro {background-image:url(''); background-repeat: no-repeat; background-position: top right; } 
.hero {width:50%;}
.slide { padding: 20px;}
.slidetext {font-size:16px;}
.slide img {width:90%;  }

.icon {font-style: normal; float:left;margin:0 20px 40px 0px; color:#011c50;}

	
.bw {
  -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
  filter: grayscale(0%);
}

.navbar {padding-top:20px !important; padding-bottom:20px !important;}
.nav-link  {color:#000 !important;   font-size:18px !important; font-weight:400 !important; text-align: right !important;  font-family: oswald !important;} 

.navbar-toggler {color:#000 !important;}
.nav-item {line-height:1.3em !important; text-transform: uppercase; margin-left:20px; }

a.nav-link:hover {color:#173842 !important;}

.btn {font-family:oswald; font-size:22px; font-weight:800; text-align:left;}
.btn-danger {background-color: #e74d4f;}
.btn-danger:hover  {background-color: #e74d4f; opacity: 80%;}
.btn-dark {font-family:montserrat; font-weight:600;}
.quote2 {margin-left:10px; font-size:16px; }

a {color:#173842;}
a:hover {color:#ccc;}
.quote::before {
		content: "";
		width: 20%;
		height: 10px;
		background: orange;
	display:block;
		margin: 0 10px 20px 0;
	}
.quote {font-size:22px; font-weight:300; font-family: 'roboto', sans-serif;}





.quote2::before {
content: '\201C';
background: transparent;
position:relative;
top:30px;
left:-10px;
float:left;
color: #f3c000;
font-size: 200px;
z-index: 9;
font-family:georgia;}


header {
  position: relative;
  height: 75vh;
  min-height: 50rem;
  width: 100%;
  overflow: hidden;
}

header video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

header .container {
  position: relative;
  z-index: 3;
}

header .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
 
 background-color:#000;
 opacity: 0.6; /* Standard compliant browsers */
   -moz-opacity: 0.6; /* Firefox and Mozilla browsers */
   -webkit-opacity: 0.6; /* WebKit browser e.g. Safari */
   filter: alpha(opacity=60); /* For IE8 and earlier */
  z-index: 1;
}


.collapsible {



  font-weight:900;



  color: #fff; 





background-color: #e74d4f;







  padding:6px 8px 6px 8px;







  cursor: pointer;







 font-family:oswald;















  border: none;







  text-align: left;







  outline: none;







  font-size: 15px;







  display:inline;







  margin-top:20px;







  







}















.collapsible:hover {







  background-color: #ccc;







  















}



	  a.backbutton {color:#fff; text-decoration: none;}

	  a.backbutton:hover {color:#000; text-decoration: none;}











.collapsible:after {







  content: '\SOURCE';







  color: white;







  font-weight: bold;







  float: right;















}


















.active  {







  color: #821c1e;















}















.hidebutton.active {







	display:none;}













.morebio p {font-size:14px;}

	.morebio {







  margin-top:20px;







  display: none;







  overflow: hidden;







  







}












/* 
 ##Device = Low Resolution Tablets, Mobiles (Landscape)
 ##Screen = B/w 481px to 767px
*/
	
@media (min-width: 1101px) and (max-width: 2000px) {
		.bubble { display: flex; flex-direction: row-reverse ;}
			.mobile {display:none;}
		
		}


@media (min-width: 768px) and (max-width: 1100px) {
		.bubble { display: flex; flex-direction: row-reverse ;}
			.hero {width:70%;}
			
					h1 {font-size:50px !important;}
		
			.mobile {display:none;}
		
		}


	@media (min-width: 481px) and (max-width: 767px) {
		

			hero {width:85%;}
			h1 {font-size:50px !important;}
			.desktop {display:none;}
				.orange2 {font-size:22px;}
				.mobilereport {padding-top:40px;}
		.social {display:none;}
		}
	
	/* 
 ##Device = Most of the Smartphones Mobiles (Portrait)
 ##Screen = B/w 320px to 479px
*/
	
	@media (min-width: 300px) and (max-width: 480px) {

	.desktop {display:none;}
		.hero {width:85%;}
	h1 {font-size:50px !important;}
		.orange2 {font-size:22px;}
			.mobilereport {padding-top:40px;}
		.social {display:none;}
	}