/*****************************************************************************************
* Application: AstroWolfpack Trivia Website                                              *
*                                                                                        *
* Page name:   style.css                                                                 *
*                                                                                        *
* Programmer:  Timothy D. Johnson                                                        *
*                                                                                        *
* Version:     1.0                                                                       *
*                                                                                        *
* Description: Provides the formatting script for the AstroWolfpack Trivia Website.      *
*                                                                                        *
* Date:        04/12/2018                                                                *
******************************************************************************************
*                                      FILE UPDATES                                      *
******************************************************************************************
* Programmer:                                                                            *
*                                                                                        *
* Version:                                                                               *
*                                                                                        *
* Changes:                                                                               *
*                                                                                        *
* Date:                                                                                  *
*****************************************************************************************/

/****************************************
* Font family provided by google fonts. *
****************************************/
body
{
	font-family: 'Kameron', serif;
	color: #003b6f;
}

/****************************************
* Font family provided by google fonts. *
****************************************/
@font-face
{
	font-family: Aclonica;
	src: url(../fonts/Aclonica.ttf);
	url(../fonts/Aclonica.ttf) format('truetype');
}

@font-face
{
	font-family: Kameron;
	src: url(../fonts/Kameron-Regular.ttf);
	url(../fonts/Kameron-Regular.ttf) format('truetype');
}

a.menu
{
	font-family: 'Aclonica', serif;
}

.page_header
{
	font-family: 'Aclonica', serif;
	font-size: 32px;
	text-align: center;
}

.page_subtitle
{
	font-family: 'Aclonica', serif;
	font-size: 20px;
	text-align: center;
}

h2
{
	font-family: 'Aclonica', serif;
}

/****************************************
* Font family provided by google fonts. *
****************************************/
.page_content
{
	font-family: 'Kameron', serif;
	font-size: 16px;
	text-align: left;
	line-height: 1.5;
}

/* All Anchor Items */
#menu a
{
	display: block;
}

/* All Unordered Lists */
#menu ul
{
	padding: 0px;
	margin: 0px;
	list-style: none;
}

/* All Sub Menu Items */
#topMenu li ul
{
	position: absolute; 
	left: -999em;
}

#topMenu li:hover ul, #topMenu li.showMenu ul
{
	left: auto;
}

/* Menu Customization */
#menu
{
	background-color: #2b6396;
	font-family: Aclonica;
	font-size: 13px;
	height: 50px;
	line-height: 50px;
	margin: auto;
	width: 800px;
}

#menu li
{
	float: left;
}

#topMenu a
{
	text-decoration: none;
	width: 200px;
}

.topMenuLink a
{
	color: #b2c4d3;
	text-align: center;
}

.topMenuLink a:hover
{
	color: #003b6f;
	background-color: #b2c4d3;
}

.subMenu
{
	background-color: #d8e1e9;
	width: 200px;
}

.subMenu a
{
	color: #003b6f;
	font-weight: normal;
	height: 50px;
	line-height: 20px;
	margin-top: 0px;
	padding: 17px;
}

.subMenu a:hover
{
	background-color: #f0f0f5;
	color: #000000;
}

.trivia_season
{
	width: 150px;
	height: 150px;
	text-align: center;
	padding: 0px;
}

.trivia_standing
{
	width: 600px;
	height: 150px;
	text-align: left;
	padding-left: 20px;
	font-family: 'Kameron', serif;
	font-size: 16px;
	color: #003b6f;
}

.score_images
{
	width: 150px;
	height: 150px;
}

#outerdiv
{
	width: 425px;
	height: 185px;
	overflow: hidden;
	position: relative;
	margin: auto;
}

#innerdiv
{
	position: absolute;
	top: -36px;
	width: 425px;
	height: 190px;
}

.large_fields
{
	width: 100%;
	box-sizing: border-box;
	font-family: Helvetica;
}

.blog_titles
{
	font-family: Kameron, serif;
	font-size: 18px;
}