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

@media (min-width: 320px) {

#braille-logo {height: auto;width: 50%;position: fixed;top: 40px;left: 45px;z-index: 4;display: block;}
h1{font-size: 36pt; font-weight: 400; line-height: 52pt; text-transform: uppercase;} 
h2{font-size: 34pt; font-weight: 700; line-height: 44pt; text-transform: uppercase;}
h3{font-size: 30pt; font-weight: 600; line-height: 40pt; text-transform: uppercase;}
h4{font-size: 24pt; font-weight: 500; line-height: 36pt; text-transform: uppercase;}
h5{font-size: 22pt; font-weight: 400; line-height: 32pt; text-transform: uppercase;}
h6{font-size: 18pt; font-weight: 300; line-height: 28pt; text-transform: uppercase;}
h7{font-size: 16pt; font-weight: 500; line-height: 22pt; text-transform: uppercase;}
h8{font-size: 14pt; font-weight: 600; line-height: 18pt; text-transform: uppercase;}
p{font-size: 14pt; font-weight: 500; line-height: 18pt; text-transform: none;}	

.spacer10{width: 100%; height: 0px;}
	
.sides{padding: 0 2%; text-align: center;}	
	
.website-wrap{width:95%; margin-left:auto; margin-right:auto; min-height:100%; margin-top:10%;}

#video-panel{width: 100%;}
	
.videoblocks{display:block; width: 100%; height: auto; margin-bottom: 20px; filter: brightness(80%); transition: 0.3s; margin-left: -20px;}
.videoblocks:hover {filter: brightness(100%)}
	
.footer-right{text-align: left;}
	
}
@media (min-width: 600px) {

	
}
@media (min-width: 768px) {

#braille-logo {height: auto;width: 20%;position: fixed;top: 40px;left: 45px;z-index: 4;}	

h1{font-size: 48pt; font-weight: 400; line-height: 52pt; text-transform: uppercase;} 
h2{font-size: 40pt; font-weight: 700; line-height: 44pt; text-transform: uppercase;}
h3{font-size: 36pt; font-weight: 600; line-height: 40pt; text-transform: uppercase;}
h4{font-size: 32pt; font-weight: 500; line-height: 36pt; text-transform: uppercase;}
h5{font-size: 28pt; font-weight: 400; line-height: 32pt; text-transform: uppercase;}
h6{font-size: 24pt; font-weight: 300; line-height: 28pt; text-transform: uppercase;}
h7{font-size: 18pt; font-weight: 500; line-height: 22pt; text-transform: uppercase;}
h8{font-size: 14pt; font-weight: 600; line-height: 18pt; text-transform: uppercase;}
p{font-size: 14pt; font-weight: 500; line-height: 18pt; text-transform: none;}

.spacer10{width: 100%; height: 200px;}	
	
.sides{padding: 0 14%; text-align: center;}	
.website-wrap{width:93%; margin-left:auto; margin-right:auto; min-height:100%; margin-top:10%;}	
	
.videoblocks{
display:inline-block;
width: 45%;
height: auto;
margin: 5px;
 filter: brightness(60%);
  transition: 0.3s;
}	
	
}

@media (min-width: 960px) {

#braille-logo {height: auto;width: 10%;;position: fixed;top: 40px;left: 45px;z-index: 4;}	

.videoblocks{
display:inline-block;
width: 300px;
height: auto;
margin-bottom: 5px;
 filter: brightness(50%);
  transition: 0.3s;
}
.videoblocks:hover {filter: brightness(100%)}
	
.footer-right{text-align: right;}	
	
	
}


@media (min-width: 1280px) {

	
	
	
	
	
	
}

@media (min-width: 1400px) {

	
	
	
	
}