/*  Hide Elements
 *
 *	Add the corresponding class to the
 *	<body> tag in template.html to activate.
 *
 *	Usage Examples:
 *
 *	<body class="hide_sitename">
 *
 *	You can apply multiple changes to the theme
 *	by using multiple classes at once. 
 *
 *	IMPORTANT: Make sure they're spaced apart like the example below.
 *
 *	<body class="right_sidebar light_sidebar hide_header hide_sitename">
--------------------------------------------- */

	/*  Use Header Style #2
	 *	
	 *	Class: show_headerstyle_2 
	------------------------------ */
	body.show_headerstyle_2 {
		
		.header-layout--default,
		.header-layout--alt2 {
			display:none!important;
		}
		.header-layout--alt1 {
			display:block;
		}
	}
	
	/*  Use Header Style #3
	 *	
	 *	Class: show_headerstyle_3
	------------------------------ */
	body.show_headerstyle_3 {
		
		.header-layout--default,
		.header-layout--alt1 {
			display:none!important;
		}
		.header-layout--alt2 {
			display:block;
		}
	}
	
	/*  Hide Footer Social Navigation
	 *
	 *	Class: hide_socialnav
	------------------------------ */
	body.hide_socialnav .site-footer .social-nav {
		display:none;
	}
	
	/*  Hide Master Header
	 *
	 *	Class: hide_masthead
	------------------------------ */
	body.hide_masthead .mast-head {
		display:none;
	}	
	body.hide_masthead .mast-head-txt {
		display:block;
		margin:0 auto 35px; 
		height:110px;
	}
	body.hide_masthead .header-content {
		margin:0 auto 15px;
	}
	@media screen and (max-width:980px) {
		body.hide_masthead .mast-head-txt {
			display:none;
		}	
	}
	
	/*  Hide Site Disclaimer
	 *
	 *	Class: hide_disclaim
	------------------------------ */
	body.hide_disclaim .disclaimer {
		display:none;
	}


/*  Turn Off Rounded Borders
 *	
 *	Class: hide_roundedborders
 *	
 *  Default 4px
 *
 *  Change to 0 or 0px to turn off.
 *
--------------------------------------------- */

	body.hide_roundedborders img,
	body.hide_roundedborders .social-nav-wrap,
	body.hide_roundedborders .header-content,
	body.hide_roundedborders input,
	body.hide_roundedborders select,
	body.hide_roundedborders button,
	body.hide_roundedborders blockquote,
	body.hide_roundedborders .nav-links a,
	body.hide_roundedborders #tooltip,
	body.hide_roundedborders .social-nav ul li a,
	body.hide_roundedborders embed,
	body.hide_roundedborders iframe,
	body.hide_roundedborders .cpg-nav,
	body.hide_roundedborders .cpg-nav a,
	body.hide_roundedborders .maintable,
	body.hide_roundedborders .stats,
	body.hide_roundedborders .tableh1-alt,
	body.hide_roundedborders .tableh1-stat,
	body.hide_roundedborders .thumb_title_views,
	body.hide_roundedborders .thumb_resolution,
	body.hide_roundedborders .tableh2,
	body.hide_roundedborders .navmenu,
	body.hide_roundedborders .tableb,
	body.hide_roundedborders .tableb_alternate,
	body.hide_roundedborders .site-footer .text,
	body.hide_roundedborders .site-footer .disclaimer,
	body.hide_roundedborders .thumb_resolution,
	body.hide_roundedborders .thumb_title_views,
	body.hide_roundedborders .navmenu-active span,
	body.hide_roundedborders .admin_menu {
		border-radius:0;
	}


/*  Change Body Font Size
 *	
 *  Default font size is 15px
 *
--------------------------------------------- */

	body,
	.listbox,
	.textinput,
	textarea,
	select,
	.statlink h2,
	td .tableh1:last-child,
	.thumb_title_title,
	.tableb {
		font-size:;
	}
	.catlink {
		font-size:;
	}
	.catrow span.cat-desc {
		font-size:;
	}


/*	HOW TO CHANGE YOUR THEME COLORS:
 *
 *	Place your color HEX code in the empty selector
 *	between the : and ; symbols. 
 *	
 *	Usage examples:
 *
 *	background-color: #ffffff;
 *	color: #ffffff;
 *	
 *	If nothing changes after refreshing your
 *	browser, clear your browser cache.
--------------------------------------------- */


/*  Theme Accent Color #1
 *	
 *	Color: #E6208B
--------------------------------------------- */

/*  Elements that use the Accent color 
	for a background color.
--------------------------------------------- */
	
	*::-webkit-scrollbar-thumb,
	*::-webkit-scrollbar-thumb:active,
	.header-layout--alt1 .top-bar .site-name h1:after,
	.header-layout--alt2  .top-bar .site-name h1,
	.site-footer .text,
	.cpg-nav a:hover,
	.cpg-nav a:focus,
	.button:hover,
	.buttonlist ul li a:hover,
	.button:focus,
	.buttonlist ul li a:focus,
	.navmenu-active span,
	.button:hover,
	.buttonlist ul li a:hover,
	.button:focus,
	.buttonlist ul li a:focus {
		background-color:#e6909c;
	}


/*  Elements that use the Accent color 
	for a text color.
--------------------------------------------- */

	a:hover,
	a:focus,
	.main-nav ul li a:hover,
	.header-layout--default .top-bar .site-name h1 span,
	.header-layout--alt1 .top-bar .site-name h1 span,
	.header-layout--alt2  .top-bar .site-name h1 span,
	.tableh1 a,
	.tableh1-alt a:hover,
	.tableh1 a:hover, 
	.tableh1 a:focus,
	.tableh1 .statlink a:hover,
	.tableh1 .statlink a:focus,
	.thumb_title_views:after,
	.cpg-nav a:hover,
	.cpg-nav a:focus {
		color:HEX_CODE;
	}
	

/*  Accent Text Color 
 *
 *	This is the color of the text for all elements 
 *	using the Accent color for a background color.
 *
 *	Choose your color wisely so text is readable.
--------------------------------------------- */
	
	.main-nav ul li a:hover,
	.header-layout--alt1 .top-bar .site-name h1:after,
	.header-layout--alt2  .top-bar .site-name h1,
	.site-footer .text,
	.site-footer .text a,
	.site-footer .text .fa,
	.button:hover,
	.buttonlist ul li a:hover,
	.button:focus,
	.buttonlist ul li a:focus,
	em, i {
		color:HEX_CODE;
	}

	.header-layout--default .top-bar .site-name h1 {
		box-shadow: 0 2px 0 HEX_CODE;
	}

	.tableh1 a:hover, 
	.tableh1 a:focus,
	.tableh1 .statlink a:hover,
	.tableh1 .statlink a:focus,
	.tableh1-alt a:hover {
		color:HEX_CODE;
		box-shadow:inset 0 -1px 0 HEX_CODE;
	}


/*  Theme Accent Color #2
 *	
 *	Color: #6E00E5
--------------------------------------------- */

/*  Elements that use the Accent color 
	for a background color.
--------------------------------------------- */
	
	.image:hover,
	.catlink b:before {
		background:HEX_CODE;
		border-color:HEX_CODE;
	}


/*  Elements that use the Accent color 
	for a text color.
--------------------------------------------- */

	.thumb_resolution:after {
		color:HEX_CODE;
	}


	.catlink b:before {
		color:HEX_CODE;
	}

/*  Header Image
 *	
 *	You can change the height and width of the
 *	header if your header is smaller or bigger.
 *	
--------------------------------------------- */

	/*  Here you can input a different filename
	 *	for your new header, otherwise leave it as
	 *	it is if your file name is the same as the
	 *	one already being used.
	 *	
	 *	You can also adjust the height and width
	 *	to accomdate your custom header if yours
	 *	is wider or shorter than the default one.
	 *	
	 *	Default height: 600px
	 *	Default Width: 1300px
	--------------------------------------------- */
	.mast-head {
		height:YOUR_NEW_HEIGHT;
		max-width:YOUR_NEW_WIDTH;
		background-image:url('./images/header.png');
		background-image:url('./images/header.jpg');
	}
	
	
/*  Mobile Layout Options
--------------------------------------------- */

	.mobile-name .overlay {
		background-color:#e6909c;
	}

	@media screen and (max-width:980px) {
		.mobile-name h1,
		.site-navigation,
		.main-nav ul li,
		.main-nav ul li a,
		.show-menu {
			color:HEX_CODE!important;
		}
	}