/***************************************************Global Settings***************************************************/
body
{
display:block;
height:100%;width:100%;max-width:100vw;overflow-x:hidden;margin:0 0 0 0;padding:0 0 0 0;font-family: 'Lexend Peta', sans-serif;
}
/***************************************************Typography Controls***************************************************/
h1
{
}

h2
{
}

h3
{
}
h4
{
}

h5
{
font-size:12px;
letter-spacing:0.4em;
text-transform:uppercase;
}
h5.read-more a
{
color: #5a5a5a;
padding: 8px 36px 8px 0px;
background: url(../images/right_arrow.png) no-repeat;
background-size: 20px;
background-position: 95% 5px;
}
h5.back-button a
{
color: #5a5a5a;
padding: 8px 0px 8px 36px;
background: url(../images/left_arrow.png) no-repeat;
background-size: 20px;
background-position: 3% 5px;
}
h5.read-more a:hover
{
opacity:0.6;
text-decoration:none;
}
h6
{
font-size:12px;

}
p 
{
}
a, a:visited
{
}
a:hover
{
}
/***************************************************Menu Block*****************************************************/
div.Menu-Block
{
height:60px;
max-height:60px;
overflow:hidden;
position:fixed;
top:0px;
left:0px;
z-index:10000;
right:0;
background:#fff;
}
div.Menu-Block div.inner-wrap
{
margin:0 0 0 0;
}
div.Menu-Block ul
{
margin:0 0 0 0;
padding:0 0 0 0;
list-style-type:none;
width:100%;
display:inline-block;
}
div.Menu-Block ul li
{
margin:0 0 0 0;
padding:0 0 0 0;
list-style-type:none;
display:inline-block;
width:16.666%;
float:left;
text-align:center;
}
div.Menu-Block ul li:hover
{
background:#ececec;
}
div.Menu-Block ul li:hover a
{
color:#9292de;
text-decoration:none;
}
div.Menu-Block ul li a
{
display:block;
margin:0;
padding:20px 0px 20px 0px;
width:100%;
height:auto;
}
div.Mobile_Menu_Button
{
width: 100%;
height: 60px;
display:none;
margin: 0;
padding: 0;
z-index: 10001;
float: right;
position:fixed;
background:#fff;
top:0;
}
div.Mobile_Menu_Button.toggle-off
{
z-index: 10002;
display:none;
}
div.Mobile-Menu-Block.mobile-menu-active div.Mobile_Menu_Button.toggle-off
{
display:inline-block;
}
div.Mobile_Menu_Button.toggle-off
{
z-index: 10002;
}
div.Mobile_Menu_Button img
{width: 30px;
height: 30px;
float: right;
margin: 15px 30px 15px 0px;
}
div.Mobile-Menu-Block
{
display:none;
position:fixed;
background:#fff;
top:60px;
z-index:10001;
}
/***************************************************Title Block***************************************************/
div.Title-Block
{
height:100vh;
width:100%;
display:inline-block;
margin:0 0 0 0;
padding:25vh 0 0 0;
text-align:center;
background:url(../images/TomBrady1920x10801.jpg) no-repeat;
background-size:cover;
background-position:50% 50%;
position:relative;
}

div.Title-Block div.inner-wrap {text-align:center;}

div.Title-Block h1{color:#ffffff;}
div.Title-Block h3{color:#fff;}
div.Content-Block h2
{margin-top:60px;}
div.Content-Block
{height:100%;width:100%;display:inline-block;margin:0 0 0 0;padding:0 0 0 0;text-align:center;}
div.inner-wrap
{display:inline-block;width:80%;height:100%;margin:0 0 30px 0;padding:0 10% 0 10%;max-width:1200px;text-align:left;	}
a
{color:#666;text-decoration:none;}
h6 a:hover
{
color:#982d2d;
text-decoration:underline;
}
div.photo-credits
{
position: absolute;
right: 5vw;
bottom: 3vw;
color: white;
}
/***************************************************Homepage***************************************************/


/***************************************************HTML Page***************************************************/
body.HTML-Definition div.Title-Block
{background:url(../images/black_hole.jpg) no-repeat;
background-size:cover;
background-position:50% 50%;
}
/***************************************************CSS Page***************************************************/
body.CSS-Definition div.Title-Block
{background:url(../images/waterfall.jpg) no-repeat;
background-size:cover;
background-position:50% 50%;
}
/*************************************************PHP Page*****************************************************/
body.PHP-Definition div.Title-Block
{background:url(../images/landscapes.jpg) no-repeat;
background-size:cover;
background-position:50% 50%;
}
/************************************************Javascript****************************************************/
body.Javascript-Definition div.Title-Block
{background:url(../images/coffee_mug.jpg) no-repeat;
background-size:cover;
background-position:50% 50%;
}
/*************************************************************************************************************/
/***************************************************Mobile Responsiveness*************************************/
/*************************************************************************************************************/

/*************  max-width: 960px *************/
@media(max-width:960px){
div.Menu-Block
{
display:none;
}
div.Mobile_Menu_Button
{
display: inline-block;
}
div.Mobile-Menu-Block
{
width:100%
}
div.Mobile-Menu-Block ul li
{
list-style-type:none;
width:80%;
padding:0 10% 0 10%;
margin: 0;
text-align:left;
border-top-width: 1px;
border-top-style:solid;
border-top-color:#0c0c0c;
height:52px;
line-height:52px;
font-size:14px;
}
div.Mobile-Menu-Block div.inner-wrap 
{
display: inline-block;
width: 100%;
margin: 0 0 0 0;
padding: 0 0 0 0;
max-width:100%;
}
div.Mobile-Menu-Block.mobile-menu-active
{
display:inline-block !important;
}
div.Mobile-Menu-Block ul
{
display: block;
margin-block-start: 0em;
margin-block-end: 0em;
margin-inline-start: 0px;
margin-inline-end: 0px;
padding-inline-start:0px;
border-bottom:solid 1px #0c0c0c;
}









}


