@import url(https://fonts.googleapis.com/css?family=Lato);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.css);

@media all 
{
	body, html 
	{
		background-image: url("/images/Steel-Background.jpg");
		
	}
	
	body
	{  
		height:100%;
		margin:0;
		padding:0;
	
	}
/* ------------------------------------------------------------- */
.container
{
	 min-height:100%;
	
	display: grid;
		grid-template-columns: max-content;
		grid-template-rows:  auto 50px 200px  125px 200px  75px 700px 50px; 
		
		column-gap: 5px;
		-moz-column-gap: 5px;
		-ms-column-gap: 5px;
		-webkit-column-gap: 5px;
		
		-moz-row-gap: 30px;
		-ms-row-gap: 30px;	
		-webkit-row-gap: 30px;	
					
}

header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}

aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}

aside.quick-newsletter-signups
{
    grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5; 
}
aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}

main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}

.fade-out-borders-top-to-bottom
{
	-webkit-border-image: -webkit-gradient(linear, 0 0, 0 50%, from(black), to(rgba(0, 0, 0, 0))) 1 100%;
	-webkit-border-image: -webkit-linear-gradient(black, rgba(0, 0, 0, 0) 50%) 1 100%;
	-moz-border-image: -moz-linear-gradient(black, rgba(0, 0, 0, 0) 50%) 1 100%;
	-o-border-image: -o-linear-gradient(black, rgba(0, 0, 0, 0) 50%) 1 100%;
	border-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0) 50%) 1 100%;
}

.fade-out-borders-bottom-to-top
{
	-webkit-border-image: -webkit-gradient(linear, 0 0, 0 50%, from(black), to(rgba(0, 0, 0, 0))) 1 100%;
	-webkit-border-image: -webkit-linear-gradient(bottom, black, rgba(0, 0, 0, 0) 50%) 1 100%;
	-moz-border-image: -moz-linear-gradient(bottom, black, rgba(0, 0, 0, 0) 50%) 1 100%;
	-o-border-image: -o-linear-gradient(bottom, black, rgba(0, 0, 0, 0) 50%) 1 100%;
	border-image: linear-gradient(to top, black, rgba(0, 0, 0, 0) 50%) 1 100%;
}

.fade-out-borders-left-to-right
{
	-webkit-border-image: -webkit-gradient(linear, 0 0, 0 50%, from(black), to(rgba(0, 0, 0, 0))) 1 100%;
	-webkit-border-image: -webkit-linear-gradient(right, black, rgba(0, 0, 0, 0) 50%) 1 100%;
	-moz-border-image: -moz-linear-gradient(right, black, rgba(0, 0, 0, 0) 50%) 1 100%;
	-o-border-image: -o-linear-gradient(right, black, rgba(0, 0, 0, 0) 50%) 1 100%;
	border-image: linear-gradient(to right, black, rgba(0, 0, 0, 0) 50%) 1 100%;
}

.fade-out-borders-right-to-left
{
	-webkit-border-image: -webkit-gradient(linear, 0 0, 0 50%, from(black), to(rgba(0, 0, 0, 0))) 1 100%;
	-webkit-border-image: -webkit-linear-gradient(left, black, rgba(0, 0, 0, 0) 50%) 1 100%;
	-moz-border-image: -moz-linear-gradient(left, black, rgba(0, 0, 0, 0) 50%) 1 100%;
	-o-border-image: -o-linear-gradient(left, black, rgba(0, 0, 0, 0) 50%) 1 100%;
	border-image: linear-gradient(to left, black, rgba(0, 0, 0, 0) 50%) 1 100%;
}


/* ------- NAVIGATION ROW-------------------------------------------------- */
aside.hot-fitness-news
{
	width: 100%;
	position: relative;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

a.nav-button:hover 
{
	background-image: url("/images/cream-granite-small.jpg");
	border-radius: 4px;
	color: #000000;	
}
	
nav ul
{
	display: block;
	width: 100%;
	text-align: center;
	margin: auto;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

nav ul li
{
	white-space: nowrap;
	text-decoration: none;
	width: auto;
	display: inline-block;
	margin-left:10px;
	margin-right:10px;
	padding-left:5px;
	padding-right: 5px;	
	
}
	
nav ul li a 
{
	float: center;
	font-size: 24px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding: 4px;
	margin: 1px;
	text-shadow: 5px 5px 5px rgba(163, 179, 179, 0.8);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

/* ---------INTRO SECTION ---------------------------------------------------- */
	

section.intro .hidepic 
{
    display: unset;    
}

.eliminate
{
    display: unset;
}


section.intro
{
	display: block;
	position: relative;
	text-align: center;
	color:white;
	align-items: center;
}

section.intro img
{
	display: inline-block;  
}


.thumbnail2
{
	display: inline-block;
	width: 200px;
	height: 200px;
	border-width: 3px;
	border-style: solid;
	object-fit: cover;
	box-shadow: 200px 200px 10px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
}


.thumbnail2 img 
{
    max-width: 100%;
    max-height: 100%;
}
	
.bottom-left 
{
    position: absolute;
    bottom: -50px;
    left: 68px;
}


.top-left 
{
    position: absolute;
    top: -57px;
    left: 68px;
}


.top-right 
{
    position: absolute;
    top: -55px;
    right: 76px;
}


.bottom-right 
{
    position: absolute;
    bottom: -55px;
    right: 80px;
}


.centered 
{
     position: absolute;
    top: 40px;
    right: 485px;
}	

#first-word h1 
{
    -webkit-animation: fadein 3s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 3s; /* Firefox < 16 */
        -ms-animation: fadein 3s; /* Internet Explorer */
         -o-animation: fadein 3s; /* Opera < 12.1 */
            animation: fadein 3s;	 		
}

#second-word h2 
{ 
    -webkit-animation: fadein 5s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 5s; /* Firefox < 16 */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera < 12.1 */
            animation: fadein 5s;	   
}

#third-word h2 
{ 
    -webkit-animation: fadein 7s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 7s; /* Firefox < 16 */
        -ms-animation: fadein 7s; /* Internet Explorer */
         -o-animation: fadein 7s; /* Opera < 12.1 */
            animation: fadein 7s;	   
}

#fourth-word h2 
{
    -webkit-animation: fadein 9s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 9s; /* Firefox < 16 */
        -ms-animation: fadein 9s; /* Internet Explorer */
         -o-animation: fadein 9s; /* Opera < 12.1 */
            animation: fadein 9s;	   
}

#fifth-word h2 
{  
    -webkit-animation: fadein 11s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 11s; /* Firefox < 16 */
        -ms-animation: fadein 11s; /* Internet Explorer */
         -o-animation: fadein 11s; /* Opera < 12.1 */
            animation: fadein 11s;	   
}

@keyframes fadein
{
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein 
{
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein 
{
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein 
{
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein 
{
    from { opacity: 0; }
    to   { opacity: 1; }
}

/********************* aside for social mediam icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
}

div.footer-social-icons 
    {
        
    font-family: 'Arial', sans-serif;
    color: #FFF;
    background: #322f30;
    -webkit-font-smoothing: antialiased;
     width: 1000px;
     height: 120px;
    display:block;
    text-align: center;
    margin: 0 auto;
}
a.social-icon
{
    text-decoration: none;
    color: #fff;
    background-image: url("/images/white-granite-small.jpg");
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

h4._14
{
    margin:  1% 0 1% 0;
}
._12
{
    font-size: 1.2em;
}
._14 
{
    font-size: 1.4em;
}
ul.social-icons 
{
    padding:0;
    list-style: none;
    margin-top: 10px;
}
.footer-social-icons
{
    font-family: 'Arial', sans-serif;
    color: #FFF;
    background: #322f30;
    -webkit-font-smoothing: antialiased;
    width: 500px;
    display:block;
    margin: 0 auto;
}
.social-icon
{
    color: #fff;
}

.social-icons li 
{
    vertical-align: top;
    display: inline-block;
    height: 100px;
}
.social-icons a 
{
    color: #fff;
    text-decoration: none;
}
.fa-facebook
{
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}


.fa-youtube 
{
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-google-plus 
{
    padding:10px 9px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

/* --------------- QUICK NEWLETTER SIGNUPS ASIDE ------------------------------ */

aside.quick-newsletter-signups
{
		text-align: center;
		width: 95%;
}

#success
{
    color: yellow;
}

div.inner-wrap
{
	display: block;
	align-self:center;
	padding: 10px;
	background-image: url("/images/green-metal-small.jpg");
	border-radius: 6px;
	font-size: calc(15px + 1vw);
	font-weight: 700;
	color: white;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

.inner-wrap label
{
	display: block;
	font: calc(8px + 1vw) Arial, Helvetica, sans-serif;
	font-weight: 700;
	color: white;
	margin-bottom: 5px;
	width: 20%;
}

.error 
{
	display: block;
	font: 16px Arial, Helvetica, sans-serif;
	color: #ffea05;
	padding: 2px;
	margin-bottom:6px;

	
}

.button-section
{
  display: block;  
}

/*styling for each form input type */
.inner-wrap input[type="text"],
.inner-wrap input[type="email"],
.inner-wrap input[type="number"],
.inner-wrap textarea,
.inner-wrap select 
{
	display: block;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
    width: 100%;
   
	font: calc(12px + .5vw) Arial, Helvetica, sans-serif;
	margin-bottom: 0px;
	border-radius: 6px;
	-webkit-border-radius:6px;
	-moz-border-radius:6px;
	border: 2px solid #fff;
	box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.33);
	-moz-box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.33);
	-webkit-box-shadow: inset 2px 2px 2px rgba(0, 0, 0, 0.33);
}

/* button styling */
.button-section input[type="button"], 
.button-section input[type="submit"],
.button-section input[type="reset"] 
{
	background-image: url("/images/blue-metal-dark-small.jpg");
	padding: 8px 20px 8px 20px;
	margin-bottom: 3px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
	font: normal 30px 'Bitter', serif;
	-moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	-webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	border: 1px solid #257C9E;
	font-size: calc(12px + 1vw);
}

.button-section input[type="button"]:hover, 
.button-section input[type="submit"]:hover,
.button-section input[type="reset"]:hover
{
	background: #2A6881;
	-moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
	-webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
	box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
}

#reset-button
{
	float: right;
}

/* ---------ASIDE SECTION ---------------------------------------------------- */
aside.hot-fitness-news
{
		display: block;
		text-align: center;
}

aside.hot-fitness-news ul
{	display: block;
	text-align: center;
	margin: auto auto auto auto;
	margin-top: 10px;
	margin-left: -50px;	
}

aside.hot-fitness-news ul li
{
	white-space: nowrap;
	text-decoration: none;
	width:22%;
	display: inline-block;
	text-align: center;
	align-top: center;
	padding: 0px 68px 0px 60px;	
}

aside.hot-fitness-news ul li a.aside-button:hover 
{
	background-image: url("/images/black-granite-small.jpg");
	border-radius: 4px;
	color: #fcf9f9;	
}
	
aside.hot-fitness-news ul li a.aside-button 
{
	font-size: 18px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	text-align:center;
	display: inline-block;
	width: 100%;
	background-image: url("/images/white-granite-small.jpg");
	padding: 4px;
	margin: 1px;
	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

/*---------- MAIN SECTION -----------------------------------------------------------------------------------*/
main
{
	
}
/* ---------------ARTICLES AND TOOLS SECTIONS ------------------------------------------------------------------------------------------ */	

section.articleslisting, section.toolslisting
{
	align-items: center;
	vertical-align: top;
	margin-bottom: 10px;
	margin-top:0px;
	display: block;
}


a {
text-decoration: none;
}


section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
{
	width: 300px;
	height: 300px;
	display: inline-block; 
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	box-shadow: 20px 20px 10px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
	position: relative;
	margin: 40px 40px 40px 40px;
	vertical-align:top;
	text-align: center;	
}

	.articleblurb 
	{
        white-space: normal;
        width: 285px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 18px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 285px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 19px;
    }
	
	 .articleblurb3 
	{
        white-space: normal;
        width: 290px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 17px;
    }


.grey
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}

section.articlesummary 
{
	background-image: url("/images/white-granite-small.jpg");
	margin-top: -15px;
}

.thumbnail
{
	display: inline-block;
	width: 200px;
	height: 175px;
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	margin-top: -15px;
	object-fit: cover;
}

.toolssummary1
{		
	vertical-align:top;
	background-image: url("/images/blue-metal-dark-small.jpg");
	background-size: contain;
}	

.toolssummary2
{		
	vertical-align:top;
	background-image: url("/images/brown-metal-small.jpg");
	background-size: contain;
}	

.toolssummary3
{
	vertical-align:top;
	background-image: url("/images/green-metal-small.jpg");
	background-size: contain;	
}	
	

.whiten
{
	text-shadow: 4px 2px 2px rgba(255, 255, 255, 0.8);
}

 a:link
{
color: black;
}
 a:visited 
{
color: black;
}

/* -----------FOOTER SECTION -------------------------------------------------- */
	
footer 
{
	font-size: 20px;
	font-weight: 900;
	color: #fcfcfc;
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}

div.footer-links a:link
{
color: #fcfcfc;
}
div.footer-links a:visited 
{
color: #fcfcfc;
}
div.footer-links a:hover 
{
color: #aa5858;
}

div.footer-links
{
    font-size: 12px;
}
/* --------- -H TAGS --------------------------------------------------- */
	
h1 , h2 , H3
{
	text-shadow: 8px 5px 5px rgba(163, 179, 179, 0.8);
}
	
h2
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
	font-size: 60px;
	font-weight: 900;
}
	
h1 
{
	font-size: 80px;
	font-weight: 900;
	margin-top: 0px;
	margin-bottom: 0px;
}
	
h3 
{
	font-size: 24px;
	font-weight: 900;
	margin-top: -3px;
}
	
h3.bct
{
	font-size: 22px;
	font-weight: 900;
}

} /* END OF MEDIA ALL SECTION ----------------------------------------------------*/






	
/* ------------------------   MEDIA  QUERIES ------------------------------------ */
/*--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------*/

/*---------------------------------- iPhone 4  and 5  ------------------------------------*/

@media only screen and (min-width : 320px) 
{
	.container
	{
		 min-height:100%;
		 width: 320px;
		 margin:  0 auto;
		
		display: grid;
			grid-template-columns: 	317px;
			grid-template-rows:  auto; 
			-moz-row-gap: 5px;	
			row-gap: 5px;			
	}
	
	header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 3;
	grid-row-end: 3;
}

aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}

aside.quick-newsletter-signups
{
    grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5; 
}
aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}

main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}
	
/*-------------- GRID LAYOUT -----------------------------------------*/

  main 
  { 
    max-width: 100%;
    margin: 0;
  }
 
  .header-grid2 
  {
    max-width: 100%;
    margin: 0;
    margin-bottom: 1rem;
    font-family: Avenir, Roboto, Helvetica, san-serif; 
  }

 
.grid-part2
{
  padding: 0rem;
  align-self: center;
  text-align: center;
}

.grid-part2 > h1 
{
  font-size:60px;
  line-height: .9em;
  margin-left: -20px;
}

/*------------------- nav area --------------------*/
	
		nav ul
	{
	display: block;
	width: 100%;
	text-align: center;
	margin: auto;
	position: relative;
	}
	
	nav ul li
	{
	margin-left:8px;
	margin-right:8px;
	padding-left:4px;
	padding-right: 4px;		
	}

	nav ul li
	{
	white-space: nowrap;
	text-decoration: none;
	width: 90%;
	display: block;
	margin-left:-15px;
	margin-right:0px;
	margin-bottom: 12px;
	padding-left:2px;
	padding-right: 2px;	
	
	}
	
	nav ul li a, .nav-button 
	{
	font-size: 	24px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 3px;
	border-style: solid;
	border-radius: 10px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	background-color: white;
	padding:2px;
	margin:1px;
	
	}	
/* -------- intro area --------------------*/
	.eliminate
	{
		display: none;
	}

	section.intro
	{
		display: block;
		position: relative;
		text-align: left;	
		align-items: left;
		margin:auto;
		margin-left: 5px;
	}
	.thumbnail2
	{
		width: 285px;
		height: 285px;
		box-shadow: 8px 8px 5px rgba(155, 155, 155, .6);
	}
	
	h2
	{
		text-shadow: 7px 4px 4px rgba(163, 179, 179, .5);
		font-size: 30px;
		font-weight: 2000;
	}

	h1.centered
	{
		font-size: 50px;
	}
	.bottom-left 
	{
		bottom: -20px;
		left: 6px;
	}

	.top-left 
	{
		top: -25px;
		left: 11px;
	}

	.top-right 
	{
		top: -25px;
		right: 4px;
	}

	.bottom-right 
	{
		bottom: -20px;
		right: 4px;
	}

	.centered 
	{
		top: 90px;
		right: 45px;
	}	

	h1.centered
	{
		font-size: 72px;
	}
	/********************* aside for social media icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
		margin-left: -30px;
		height: 50px;
}

div.footer-social-icons 
{
    background: transparent;
     width: 100%;
     height: 55px;
     text-align: center;
}
a.social-icon
{
    width: 35px;
    height: 35px;
	border-width: 1px;360
	border-style: solid;
	border-radius: 5px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding:1px;
	margin: 1px;
	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.8);
	box-shadow: 6px 6px 3px rgba(155, 155, 155, .6);
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

ul.social-icons 
{
    padding:0;
    list-style: none;
}

ul.social-icons li 
{
    vertical-align: center;
    display: inline-block;
    height: 50px;
    width: auto;
    margin-right: 14px;
    
}

.fa-facebook
{
    padding:10px 12px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}

.fa-youtube 
{
    padding:10px 10px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-instagram 
{
    padding:9px 10px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    margin: auto;
}
.fa-instagram:hover 
{
     background-color: #3d5b99;
}


.fa-google-plus 
{
    padding:9px 6px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

div.google-plus-icon
{
    height: 25px;
    width: 25px;
    overflow: hidden;
    position: absolute;
    z-index: 1; 
    opacity: .01;
}

.my-custom-googleplusone
{
    overflow: hidden;
    background-image: url("/images/plus-one-icon-for-google-plus.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 40px;
    width: 40px;
    margin-top: 1px;
    margin-left: -3px;
    position: absolute;
    pointer-events: none;
    box-shadow: 5px 5px 4px rgba(155, 155, 155, 0.6);
}

/*----- QUICK NEWSLETTER SIGNUPS --------------------------------------------*/
aside.quick-newsletter-signups
{
		display: block;
		text-align: center;
		width: 95%;
}

/*styling for each form input type */
.inner-wrap input[type="text"],
.inner-wrap input[type="email"],
.inner-wrap input[type="number"],
.inner-wrap textarea,
.inner-wrap select 
{
	font: calc(9px + .5vw) Arial, Helvetica, sans-serif;
	width: 100%;
}


div.inner-wrap
{
	text-align: center;
	font-size: calc(13px + 1vw);
	font-weight: 600;

    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 5px 5px 3px rgba(155, 155, 155, .4);
}

.inner-wrap label
{
	margin: auto;
	display:block;
	font: calc(12px + 1vw) Arial, Helvetica, sans-serif;
	font-weight: 700;
	color: white;
	margin-top: 10px;
	width: 75%;
}

/* button styling */
.button-section input[type="button"], 
.button-section input[type="submit"],
.button-section input[type="reset"] 
{
	background-image: url("/images/blue-metal-dark-small.jpg");
	padding: 4px 8px 4px 8px;
	margin-bottom: 3px;
	margin-left: -11px;
	margin-right: 8px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
	font: normal 30px 'Bitter', serif;
	-moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	-webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	border: 1px solid #257C9E;
	font-size: calc(12px + 1vw);
	font-weight: 700;
}



/* ---------  aside section ------------------------------------*/

	aside.hot-fitness-news ul
	{	
		margin-top: 20px;
		margin-left: -57px;	
	}

	aside.hot-fitness-news ul li
	{
		width:90%;
		padding: 2px 0px 2px 0px;	
		margin-bottom: 15px;
	}
	
	aside.hot-fitness-news ul li a.aside-button, .aside-button
	{
    	font-size: 19px;
    	font-weight: 900;
    	color: #565252;
    	text-decoration: none;
    	border-width: 4px;
    	border-style: solid;
    	border-radius: 10px;
    	text-align:center;
    	display: block;
    	width: 95%;
    	background-image: url("/images/white-granite-small.jpg");
    	padding:2px;
    	margin:1px;
    	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
    	box-shadow: 8px 8px 5px rgba(155, 155, 155, .4);
	}

    a.aside-button 
    {
    	font-size: 19px;
    	font-weight: 900;
    	color: #565252;
    	text-decoration: none;
    	border-width: 4px;
    	border-style: solid;
    	border-radius: 10px;
    	text-align:center;
    	display: block;
    	width: 95%;
    	background-image: url("/images/white-granite-small.jpg");
    	padding:2px;
    	margin:1px;
    	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
    	box-shadow: 8px 8px 5px rgba(155, 155, 155, .4);
	}

/*--------------- articles and tools section -------------------*/

	section.articleslisting, section.toolslisting
	{
		margin-bottom: 4px;
		margin-left: -10px;
	}

	section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
	{
		width: 285px;
		height: 285px; 
		box-shadow: 10px 10px 6px rgba(155, 155, 155, .4);
		margin-left: 15px;
		margin-bottom: 20px;
		display: block;
	}

	section.articlesummary 
	{
		margin-top: 0px;
	}
	
	.thumbnail
	{
		width: 225px;
		height: 150px;
		margin-top: -20px;
	}

	.articleblurb 
	{
        white-space: normal;
        width: 265px;
		margin-top: 0px;
		font-weight: 700;
		font-size: 17px;
		margin-top: 3px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 265px;
		font-weight: 700;
		font-size: 18px;
		margin-top: 2px;
    }
	
	.articleblurb3 
	{
        white-space: normal;
        width: 265px;
		font-weight: 700;
		font-size: 16px; 
    }
	
		
	h3 
	{
		font-size: 24px;
		font-weight: 900;
		margin-top: -3px;
	}
		
	h3#bct
	{
		font-size: 20px;
		font-weight: 900;
	}
	
	
	/* ------------ footer section ---------------- */
	
	.footer
	{
		margin-left: 25px;
	}
	
}

/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/*---------------------------------- iPhone 6 ------------------------------------*/
@media only screen and (min-width: 375px)/*- and (-webkit-device-pixel-ratio: 2) */

{
	.container
	{
		 min-height:100%;
		 width: 375px;
		 margin: 0 auto;
		
		display: grid;
			grid-template-columns: 	373px;
			grid-template-rows:  auto;
			-moz-row-gap: 5px;	
			row-gap: 5px;			
	}
	
	
header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 3;
	grid-row-end: 3;
}

aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}

aside.quick-newsletter-signups
{
    grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5; 
}
aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}

main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}

	
	
/*-------------- GRID LAYOUT -----------------------------------------*/

  main 
  { 
    max-width: 100%;
    margin: 0;
  }
 
  .header-grid2 
  {
    max-width: 100%;
    margin: 0;
    margin-bottom: 1rem;
    font-family: Avenir, Roboto, Helvetica, san-serif; 
  }

 
.grid-part2
{
  padding: 0rem;
  align-self: center;
  text-align: center;
}

.grid-part2 > h1 
{
  font-size:85px;
  line-height: .9em;
  margin-left: -20px;
}

/*------------------- nav area --------------------*/
	
		nav ul
	{
	display: block;
	width: 100%;
	text-align: center;
	margin: auto;
	position: relative;
	}
	
	nav ul li
	{
	margin-left:8px;
	margin-right:8px;
	padding-left:4px;
	padding-right: 4px;		
	}


	nav ul li
	{
	white-space: nowrap;
	text-decoration: none;
	width: 90%;
	display: block;
	margin-left:-20px;
	margin-right:0px;
	margin-bottom: 18px;
	padding-left:2px;
	padding-right: 2px;	
	
	}
	
	nav ul li a 
	{
	font-size: 	24px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 3px;
	border-style: solid;
	border-radius: 10px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding:2px;
	margin:1px;
	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.8);
	box-shadow: 6px 6px 3px rgba(155, 155, 155, .6);
	}	
/* -------- intro area --------------------*/
	.eliminate
	{
		display: none;
	}

	section.intro
	{
		display: block;
		position: relative;
		text-align: left;
		color:white;
		align-items: left;
		margin-top: 15px;
		margin-left: 12px;
	}
	.thumbnail2
	{
		width: 310px;
		height: 310px;
		box-shadow: 8px 8px 5px rgba(155, 155, 155, .6);
	}
	
	h2
	{
		text-shadow: 7px 4px 4px rgba(163, 179, 179, .5);
		font-size: 35px;
		font-weight: 2000;
	}

	h1.centered
	{
		font-size: 50px;
	}
	.bottom-left 
	{
		bottom: -20px;
		left: 6px;
	}

	.top-left 
	{
		top: -25px;
		left: 9px;
	}

	.top-right 
	{
		top: -25px;
		right: 10px;
	}

	.bottom-right 
	{
		bottom: -20px;
		right: 10px;
	}

	.centered 
	{
		top: 140px;
		right: 65px;
	}	

	h1.centered
	{
		font-size: 72px;
	}
	/********************* aside for social media icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
		margin-left: -40px;
		height: 50px;
}

div.footer-social-icons 
{
    background: transparent;
     width: 100%;
     height: 55px;
     text-align: center;
}
a.social-icon
{
    width: 35px;
    height: 35px;
    margin-right: 10px;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.6);
	box-shadow: 6px 6px 3px rgba(155, 155, 155, 0.6);
	text-align: center;
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

ul.social-icons 
{
    padding:0;
    list-style: none;
}

ul.social-icons li 
{
    vertical-align: center;
    display: inline-block;
    height: 50px;
    width: auto;
    margin-right: 10px;
    
}

.fa-facebook
{
    padding:10px 12px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}

.fa-youtube 
{
    padding:10px 10px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-instagram 
{
    padding:9px 10px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    margin: auto;
}
.fa-instagram:hover 
{
     background-color: #3d5b99;
}


.fa-google-plus 
{
    padding:9px 6px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

div.google-plus-icon
{
    height: 40px;
    width: 40px;
    overflow: hidden;
    position: absolute;
    z-index: 1;
    opacity: .01;
    
}

.my-custom-googleplusone
{
    overflow: hidden;
    background-image: url("/images/plus-one-icon-for-google-plus.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 40px;
    width: 40px;
    margin-top: 2px;
    margin-left: -3px;
    position: absolute;
    pointer-events: none;
    	box-shadow: 3px 3px 2px rgba(155, 155, 155, 0.6);
}


/*----- QUICK NEWSLETTER SIGNUPS --------------------------------------------*/
aside.quick-newsletter-signups
{
		display: block;
		text-align: center;
		width: 95%;
}

/*styling for each form input type */
.inner-wrap input[type="text"],
.inner-wrap input[type="email"],
.inner-wrap input[type="number"],
.inner-wrap textarea,
.inner-wrap select 
{
	font: calc(12px + .5vw) Arial, Helvetica, sans-serif;
	width: 100%;
}


div.inner-wrap
{
	text-align: center;
	font-size: calc(13px + 1vw);
	font-weight: 600;

    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

.inner-wrap label
{
	margin: auto;
	display:block;
	font: calc(12px + 1vw) Arial, Helvetica, sans-serif;
	font-weight: 700;
	color: white;
	margin-top: 10px;
	width: 75%;
}

/* button styling */
.button-section input[type="button"], 
.button-section input[type="submit"],
.button-section input[type="reset"] 
{
	background-image: url("/images/blue-metal-dark-small.jpg");
	padding: 4px 8px 4px 8px;
	margin-bottom: 3px;
	margin-left: -11px;
	margin-right: 8px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
	font: normal 30px 'Bitter', serif;
	-moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	-webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	border: 1px solid #257C9E;
	font-size: calc(14px + 1vw);
	font-weight: 700;
}



/* ---------  aside section ------------------------------------*/

	aside.hot-fitness-news ul
	{	
		margin-top: 20px;
		margin-left: -57px;	
	}

	aside.hot-fitness-news ul li
	{
		width:90%;
		padding: 2px 0px 2px 0px;	
		margin-bottom: 18px;
	}
	
	aside.hot-fitness-news ul li a.aside-button 
	{
    	font-size: 25px;
    	font-weight: 900;
    	color: #565252;
    	text-decoration: none;
    	border-width: 4px;
    	border-style: solid;
    	border-radius: 10px;
    	text-align:center;
    	display: block;
    	width: 95%;
    	background-image: url("/images/white-granite-small.jpg");
    	padding:2px;
    	margin:1px;
    	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
    	box-shadow: 8px 8px 5px rgba(155, 155, 155, .4);
	}

/*--------------- articles and tools section -------------------*/

	section.articleslisting, section.toolslisting
	{
		margin-bottom: 4px;
		margin-left:7px;
	}

	section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
	{
		width: 315px;
		height: 315px; 
		box-shadow: 10px 10px 6px rgba(155, 155, 155, .4);
		margin-left: 5px;
		margin-bottom: 30px;
		display: block;
	}

	section.articlesummary 
	{
		margin-top: 0px;
	}
	
	.thumbnail
	{
		width: 255px;
		height: 175px;
		margin-top: -20px;
	}

	.articleblurb 
	{
        white-space: normal;
        width: 305px;
		margin-top: 0px;
		font-weight: 700;
		font-size: 20px;
		margin-top: 3px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 305px;
		font-weight: 700;
		font-size: 22px;
		margin-top: 5px;
    }
	
	.articleblurb3 
	{
        white-space: normal;
        width: 305px;
		font-weight: 700;
		font-size: 19px; 
    }
	
		
	h3 
	{
		font-size: 28px;
		font-weight: 900;
		margin-top: -3px;
	}
		
	h3#bct
	{
		font-size: 22px;
		font-weight: 900;
	}
	
	
	/* ------------ footer section ---------------- */
	
	.footer
	{
		margin: auto;
	}
	
}

/*-------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------*/
/* ---------------------------------------iphone 6+, 6s+, 7+, 8+ ----------------------------*/


@media only screen and (min-width: 411px) 

{
	
	.container
	{
		 min-height:100%;
		 width: 410px;
		 margin:  0 auto;
		
		display: grid;
			grid-template-columns: 	408px;
			grid-template-rows:  auto;
			-moz-row-gap: 5px;	
			row-gap: 5px;			
	}
	

header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 3;
	grid-row-end: 3;
}

aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}

aside.quick-newsletter-signups
{
    grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5; 
}
aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}

main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}
	
	
/*-------------- GRID LAYOUT -----------------------------------------*/

  main 
  { 
    max-width: 100%;
    margin: 0;
  }
 
  .header-grid2 
  {
    max-width: 100%;
    margin: 0;
    margin-bottom: 1rem;
    font-family: Avenir, Roboto, Helvetica, san-serif; 
  }

 
.grid-part2
{
  padding: 0rem;
  align-self: center;
  text-align: center;
}

.grid-part2 > h1 
{
  font-size:85px;
  line-height: .9em;
  margin-left: -20px;
}

/*------------------- nav area --------------------*/
	
		nav ul
	{
	display: block;
	width: 100%;
	text-align: center;
	margin: auto;
	position: relative;
	}
	
	nav ul li
	{
	white-space: nowrap;
	text-decoration: none;
	width: 90%;
	display: block;
	margin-left:-15px;
	margin-right:0px;
	margin-bottom: 15px;
	padding-left:2px;
	padding-right: 2px;	
	
	}
	
	nav ul li a 
	{
	font-size: 	24px;
	font-weight: 900;
	color: #565252;
	height: 30px;
	text-decoration: none;
	border-width: 3px;
	border-style: solid;
	border-radius: 10px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding:2px;
	margin:1px;
	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.8);
	box-shadow: 6px 6px 3px rgba(155, 155, 155, .6);
	}	
/* -------- intro area --------------------*/
	.eliminate
	{
		display: none;
	}

	section.intro
	{
		display: block;
		position: relative;
		text-align: left;
		color:white;
		align-items: left;
		margin:auto;
	}
	.thumbnail2
	{
		width: 350px;
		height: 350px;
		box-shadow: 8px 8px 5px rgba(155, 155, 155, .6);
		margin-left: -17px;
	}
	
	h2
	{
		text-shadow: 7px 4px 4px rgba(163, 179, 179, .5);
		font-size: 35px;
		font-weight: 2000;
	}

	h1.centered
	{
		font-size: 50px;
	}
	.bottom-left 
	{
		bottom: -20px;
		left: 6px;
	}

	.top-left 
	{
		top: -25px;
		left: 0px;
	}

	.top-right 
	{
		top: -25px;
		right: 4px;
	}

	.bottom-right 
	{
		bottom: -20px;
		right: 4px;
	}

	.centered 
	{
		top: 120px;
		right: 75px;
	}	

	h1.centered
	{
		font-size: 72px;
	}
	/********************* aside for social media icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
		margin-left: -50px;
		height: 50px;
}

div.footer-social-icons 
{
    background: transparent;
     width: 100%;
     height: 55px;
     text-align: center;
}
a.social-icon
{
    width: 40px;
    height: 40px;
    margin-right: 15px;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.6);
	box-shadow: 6px 6px 3px rgba(155, 155, 155, 0.6);
	text-align: center;
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

ul.social-icons 
{
    padding:0;
    list-style: none;
}

ul.social-icons li 
{
    vertical-align: center;
    display: inline-block;
    height: 50px;
    width: auto;
    
}

.fa-facebook
{
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}

.fa-youtube 
{
    padding:10px 11px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-instagram 
{
    padding:10px 10px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    margin: auto;
}
.fa-instagram:hover 
{
     background-color: #3d5b99;
}


.fa-google-plus 
{
    padding:10px 6px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

div.google-plus-icon
{
    height: 30px;
    width: 30px;
    overflow: hidden;
    position: absolute;
    z-index: -1; 
}

.my-custom-googleplusone
{
    overflow: hidden;
    background-image: url("/images/plus-one-icon-for-google-plus.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 50px;
    width: 50px;
    margin-top: 3px;
    margin-left: 0px;
    position: absolute;
    pointer-events: none;
}

.my-custom-googleplusone
{
     width: 40px;
    height: 40px;
	box-shadow: 5px 5px 3px rgba(155, 155, 155, 0.6);
}

/*----- QUICK NEWSLETTER SIGNUPS --------------------------------------------*/
aside.quick-newsletter-signups
{
		display: block;
		text-align: center;
		width: 95%;
}

/*styling for each form input type */
.inner-wrap input[type="text"],
.inner-wrap input[type="email"],
.inner-wrap input[type="number"],
.inner-wrap textarea,
.inner-wrap select 
{
	font: calc(12px + .5vw) Arial, Helvetica, sans-serif;
	width: 100%;
}


div.inner-wrap
{
	text-align: center;
	font-size: calc(13px + 1vw);
	font-weight: 600;

    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

.inner-wrap label
{
	margin: auto;
	display:block;
	font: calc(12px + 1vw) Arial, Helvetica, sans-serif;
	font-weight: 700;
	color: white;
	margin-top: 10px;
	width: 75%;
}

/* button styling */
.button-section input[type="button"], 
.button-section input[type="submit"],
.button-section input[type="reset"] 
{
	background-image: url("/images/blue-metal-dark-small.jpg");
	padding: 4px 8px 4px 8px;
	margin-bottom: 3px;
	margin-left: -11px;
	margin-right: 8px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
	font: normal 30px 'Bitter', serif;
	-moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	-webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	border: 1px solid #257C9E;
	font-size: calc(18px + 1vw);
	font-weight: 700;
}


/* ---------  aside section ------------------------------------*/

	aside.hot-fitness-news ul
	{	
		margin-top: 10px;
		margin-left: -63px;	
	}

	aside.hot-fitness-news ul li
	{
		width:90%;
		padding: 0px 0px 0px 0px;	
		margin-bottom: 15px;
	}
	
	aside.hot-fitness-news ul li a.aside-button 
	{
	font-size: 28px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	text-align:center;
	display: block;
	width: 100%;
	background-image: url("/images/white-granite-small.jpg");
	padding:2px;
	margin:1px;
	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 8px 8px 5px rgba(155, 155, 155, .4);
	}

/*--------------- articles and tools section -------------------*/

	section.articleslisting, section.toolslisting
	{
		margin-bottom: 4px;
	}

	section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
	{
		width: 325px;
		height: 325px; 
		box-shadow: 10px 10px 6px rgba(155, 155, 155, .4);
		margin-left: 25px;
		margin-bottom: 30px;
		display: block;
	}

	section.articlesummary 
	{
		margin-top: 0px;
	}
	
	.thumbnail
	{
		width: 265px;
		height: 185px;
		margin-top: -20px;
	}

	.articleblurb 
	{
        white-space: normal;
        width: 310px;
		margin-top: 0px;
		font-weight: 700;
		font-size: 20px;
		margin-top: 3px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 310px;
		font-weight: 700;
		font-size: 22px;
		margin-top: 5px;
    }
	
	.articleblurb3 
	{
        white-space: normal;
        width: 315px;
		font-weight: 700;
		font-size: 19px; 
    }
	
		
	h3 
	{
		font-size: 32px;
		font-weight: 900;
		margin-top: -3px;
	}
		
	h3#bct
	{
		font-size: 26px;
		font-weight: 900;
	}
	
	
	/* ------------ footer section ---------------- */
	
	.footer
	{
		margin: auto;
	}
	
} /* end of this size --- */

/*-----------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
/*------------------------- Extra Small Devices and Phones ---------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 799px)

{
	
	.container
	{
		 min-height:100%;
		 width: 480px;
		 margin:  0 auto;
		
		display: grid;
			grid-template-columns: 	470px;
			grid-template-rows:  auto; 
			-moz-row-gap: 5px;	
			row-gap: 5px;			
	}
	

header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 3;
	grid-row-end: 3;
}

aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}

aside.quick-newsletter-signups
{
    grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5; 
}
aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}

main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}

/*-------------- GRID LAYOUT -----------------------------------------*/

  main 
  { 
    max-width: 100%;
    margin: 0;
  }
 
  .header-grid2 
  {
    max-width: 100%;
    margin: 0;
    margin-bottom: 1rem;
    font-family: Avenir, Roboto, Helvetica, san-serif; 
  }

 
.grid-part2
{
  padding: 0rem;
  align-self: center;
  text-align: center;
}

.grid-part2 > h1 
{
  font-size:85px;
  line-height: .9em;
}

/*------------------- nav area --------------------*/
	
		nav ul
	{
	display: block;
	width: 100%;
	text-align: center;
	margin: auto;
	position: relative;
	}
	
	nav ul li
	{
	margin-left:8px;
	margin-right:8px;
	padding-left:4px;
	padding-right: 4px;		
	}



	nav ul li
	{
	white-space: nowrap;
	text-decoration: none;
	width: 90%;
	display: block;
	margin-left:-10px;
	margin-right:0px;
	margin-bottom: 20px;
	padding-left:2px;
	padding-right: 2px;	
	
	}
	
	nav ul li a 
	{
	font-size: 	28px;
	font-weight: 900;
	color: #565252;
	height: 30px;
	text-decoration: none;
	border-width: 3px;
	border-style: solid;
	border-radius: 10px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding:2px;
	margin:1px;
	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.8);
	box-shadow: 6px 6px 3px rgba(155, 155, 155, .6);
	}	
/* -------- intro area -----------------------------------------*/
	.eliminate
	{
		display: none;
	}

	section.intro
	{
		display: block;
		position: relative;
		text-align: left;
		color:white;
		align-items: left;
		margin:auto;
	}
	.thumbnail2
	{
		width: 425px;
		height: 425px;
		box-shadow: 8px 8px 5px rgba(155, 155, 155, .6);
		margin-left: -30px;
	}
	
	h2
	{
		text-shadow: 7px 4px 4px rgba(163, 179, 179, .5);
		font-size: 50px;
		font-weight: 2000;
	}

	h1.centered
	{
		font-size: 90px;
	}
	.bottom-left 
	{
		bottom: -30px;
		left: -20px;
	}

	.top-left 
	{
		top: -40px;
		left: -20px;
	}

	.top-right 
	{
		top: -40px;
		right: 4px;
	}

	.bottom-right 
	{
		bottom: -30px;
		right: 4px;
	}

	.centered 
	{
		top: 180px;
		right: 115px;
	}	

	h1.centered
	{
		font-size: 72px;
	}
	
	/********************* aside for social media icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
		margin: auto;
		height: 70px;
}

div.footer-social-icons 
{
    background: transparent;
     width: 100%;
     height: 65px;
     text-align: center;
}
a.social-icon
{
    width: 50px;
    height: 50px;
    margin-right: 20px;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.6);
	box-shadow: 6px 6px 3px rgba(155, 155, 155, 0.6);
	text-align: center;
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

ul.social-icons 
{
    padding:0;
    list-style: none;
    margin-right: 60px;
}

ul.social-icons li 
{
    vertical-align: center;
    display: inline-block;
    height: 50px;
    width: auto;
    
}

.fa-facebook
{
    padding:16px 16px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}

.fa-youtube 
{
    padding:16px 15px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-instagram 
{
    padding:16px 16px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    margin: auto;
}
.fa-instagram:hover 
{
     background-color: #3d5b99;
}


.fa-google-plus 
{
    padding:16px 12px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

div.google-plus-icon
{
    height: 30px;
    width: 30px;
    overflow: hidden;
    position: absolute;
   z-index: 1;
    opacity: .01;
}

.my-custom-googleplusone
{
    overflow: hidden;
    background-image: url("/images/plus-one-icon-for-google-plus.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 50px;
    width: 50px;
    margin-top: 5px;
    margin-left: 0px;
    position: absolute;
    pointer-events: none;
}

.my-custom-googleplusone
{
     width: 50px;
    height: 50px;
	box-shadow: 3px 3px 2px rgba(155, 155, 155, 0.6);
}

/*----- QUICK NEWSLETTER SIGNUPS --------------------------------------------*/
aside.quick-newsletter-signups
{
		display: block;
		text-align: center;
		width: 95%;
}

/*styling for each form input type */
.inner-wrap input[type="text"],
.inner-wrap input[type="email"],
.inner-wrap input[type="number"],
.inner-wrap textarea,
.inner-wrap select 
{
	font: calc(14px + .5vw) Arial, Helvetica, sans-serif;
	width: 100%;
}


div.inner-wrap
{
	text-align: center;
	font-size: calc(13px + 1vw);
	font-weight: 600;

    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

.inner-wrap label
{
	margin: auto;
	display:block;
	font: calc(12px + 1vw) Arial, Helvetica, sans-serif;
	font-weight: 700;
	color: white;
	margin-top: 10px;
	width: 50%;
}

/* button styling */
.button-section input[type="button"], 
.button-section input[type="submit"],
.button-section input[type="reset"] 
{
	background-image: url("/images/blue-metal-dark-small.jpg");
	padding: 4px 8px 4px 8px;
	margin-bottom: 3px;
	margin-left: -11px;
	margin-right: 8px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
	font: normal 30px 'Bitter', serif;
	-moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	-webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	border: 1px solid #257C9E;
	font-size: calc(14px + 1vw);
}

/* ---------  aside section ------------------------------------*/

	aside.hot-fitness-news ul
	{	
		margin-top: 20px;
		margin-left: -63px;	
	}

	aside.hot-fitness-news ul li
	{
		width:90%;
		padding: 0px 0px 0px 0px;	
		margin-bottom: 30px;
	}
	
	aside.hot-fitness-news ul li a.aside-button 
	{
	font-size: 28px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	text-align:center;
	display: block;
	width: 100%;
	background-image: url("/images/white-granite-small.jpg");
	padding:2px;
	margin:1px;
	text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 8px 8px 5px rgba(155, 155, 155, .4);
	}

/*--------------- articles and tools section -------------------*/

	section.articleslisting, section.toolslisting
	{
		margin-bottom: 4px;
	}

	section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
	{
		width: 425px;
		height: 425px; 
		box-shadow: 12px 12px 8px rgba(155, 155, 155, .6);
		margin-left: 5px;
		margin-bottom: 50px;
		display: block;
	}

	section.articlesummary 
	{
		margin-top: 0px;
	}
	
	.thumbnail
	{
		width: 325px;
		height: 250px;
		margin-top: -20px;
	}

	.articleblurb 
	{
        white-space: normal;
        width: 410px;
		margin-top: 0px;
		font-weight: 700;
		font-size: 26px;
		margin-top: 3px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 410px;
		font-weight: 700;
		font-size: 30px;
		margin-top: 5px;
    }
	
	.articleblurb3 
	{
        white-space: normal;
        width: 410px;
		font-weight: 700;
		font-size: 24px; 
    }
	
		
	h3 
	{
		font-size: 36px;
		font-weight: 900;
		margin-top: -3px;
	}
		
	h3#bct
	{
		font-size: 26px;
		font-weight: 900;
	}
	
	
	/* ------------ footer section ---------------- */
	
	.footer
	{
		margin: auto;
		font-size: 30px;
		
	}
	
}

/*---  done with this size ------------------------*/

/*------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------*/
/*------------------------- Extra Small Devices and Phones ---------------------------------------*/
@media only screen and (min-width: 800px) and (max-width: 1023px)

{
	
	.container
	{
		 min-height:100%;
		 width: 790px;
		 margin:  0 auto;
		
		display: grid;
			grid-template-columns: 	790px;
			grid-template-rows:  auto 70px 175px  95px  auto 50px 550px 10px; 
			-moz-row-gap: 10px;	
			row-gap: 10px;			
	}
	
	/*--- header area -------*/
	header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 3;
	grid-row-end: 3;
}

aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}

aside.quick-newsletter-signups
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5;
}


aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}


main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}

/*------GRID LAYOUT ----------------------------*/

@supports (display: grid) 
{
  main 
  { 
    max-width: 100%;
    margin: 0;
  }
 
  .header-grid 
  {
    max-width: 90%;
    margin: 0;
    margin-bottom:.5rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    grid-gap: .5rem;
    font-family: Avenir, Roboto, Helvetica, san-serif; 
  }
}
  
.grid-part
{
  display: flex;
  flex-flow: column;
  padding: 0rem;
  align-self: center;
  text-align: center;
}

.grid-part > h1 
{
  margin: 1rem 1rem 0;
  font-size:calc(16px + 3vw);
  line-height: .9em;
}

.grid-part > img 
{
  max-width: calc(70% + 1vw);
  max-height: calc(70% + 1vw) ;
}

.grid-part  .main-heading-pic
{
  max-width: calc(80% + 3.0vw); 
  margin-left:-50px;
}

#quote
{
	font-size: calc(10px + 1vw);;
	color: white;
	font-weight: 600;
	font-style: italic;
	text-shadow: 8px 5px 5px rgba(163, 179, 179, .8);
	padding: 3px;
}

/* ------- NAVIGATION ROW-------------------------------------------------- */
nav, aside.hot-fitness-news
{
	width: 100%;
	position: relative;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
	
a.nav-button:hover 
{
	background-image: url("/images/cream-granite-small.jpg");
	border-radius: 4px;
	color: #000000;	
}
	
nav ul
{
	display: block;
	width: 100%;
	text-align: center;
	margin: auto;
	position: absolute;
    top: 50%;
    left: 45%;
	
    transform: translate(-50%, -50%);
}

nav ul li
{
	white-space: nowrap;
	text-decoration: none;
	width: 29%;
	display: inline-block;
	margin-left:10px;
	margin-right:10px;
	padding-left:2px;
	padding-right: 2px;	
	
}
	
nav ul li a 
{
	font-size: 20px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding:1px;
	margin:1px;
	text-shadow: 5px 5px 5px rgba(163, 179, 179, 0.8);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

/* ---------INTRO SECTION ---------------------------------------------------- */
	
.eliminate
{
		display: unset;
}
	
section.intro
{
	display: block;
	position: relative;
	text-align: center;
	color:white;
	align-items: center;
	margin-left: -5px;
}

section.intro img
{
	display: inline-block;  
}


.thumbnail2
{
	display: inline-block;
	width: 148px;
	height: 148px;
	border-width: 2px;
	border-style: solid;
	object-fit: cover;
	margin:0px 1px 0px 1px;
	box-shadow: 8px 8px 4px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
	
}


.thumbnail2 img 
{
    max-width: 100%;
    max-height: 100%;
}
	
h2
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
	font-size: 40px;
	font-weight: 900;
}	
	
.bottom-left 
{
    position: absolute;
    bottom: -27px;
    left: 10px;
}


.top-left 
{
    position: absolute;
    top: -37px;
    left: 10px;
}


.top-right 
{
    position: absolute;
    top: -37px;
    right: 16px;
}


.bottom-right 
{
    position: absolute;
    bottom: -27px;
    right: 10px;
}


.centered 
{
     position: absolute;
    top: 50px;
    right: 295px;
}	

/********************* aside for social media icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
		margin: auto;
		height: 70px;
}

div.footer-social-icons 
{
    background: transparent;
     width: 100%;
     height: 65px;
     text-align: center;
}
a.social-icon
{
    width: 50px;
    height: 50px;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.6);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, 0.6);
	text-align: center;
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

ul.social-icons 
{
    padding:0;
    list-style: none;
}

ul.social-icons li 
{
    vertical-align: center;
    display: inline-block;
    height: 50px;
    width: auto;
    
}

.fa-facebook
{
    padding:13px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}

.fa-youtube 
{
    padding:14px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-instagram 
{
    padding:14px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    margin: auto;
}
.fa-instagram:hover 
{
     background-color: #3d5b99;
}


.fa-google-plus 
{
    padding:14px 12px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

div.google-plus-icon
{
    height: 30px;
    width: 30px;
    overflow: hidden;
    position: absolute;
    z-index: 1;
    opacity: .01;
}

.my-custom-googleplusone
{
    overflow: hidden;
    background-image: url("/images/plus-one-icon-for-google-plus.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 50px;
    width: 50px;
    margin-top: 1px;
    margin-left: 0px;
    position: absolute;
    pointer-events: none;
}

.my-custom-googleplusone
{
     width: 50px;
    height: 50px;
	box-shadow: 3px 3px 2px rgba(155, 155, 155, 0.6);
}

/*----- QUICK NEWSLETTER SIGNUPS --------------------------------------------*/
aside.quick-newsletter-signups
{
		display: block;
		text-align: center;
		width: 100%;
}

/*styling for each form input type */
.inner-wrap input[type="text"],
.inner-wrap input[type="email"],
.inner-wrap input[type="number"],
.inner-wrap textarea,
.inner-wrap select 
{
	font: calc(8px + .5vw) Arial, Helvetica, sans-serif;
}

div.inner-wrap
{
	display: block;
	align-self:center;
	padding: 10px;
	background-image: url("/images/green-metal-small.jpg");
	border-radius: 6px;
	font-size: calc(15px + 1vw);
	font-weight: 700;
	color: white;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

.inner-wrap label
{
	display:inline-block;
	font: calc(8px + 1vw) Arial, Helvetica, sans-serif;
	font-weight: 700;
	color: white;
	margin-bottom: 5px;
	width: 20%;
}

.error 
{
	display: inline-block;
	font: 16px Arial, Helvetica, sans-serif;
	color: #ffea05;
	padding: 2px;
	margin-bottom:6px;

	
}

/* button styling */
.button-section input[type="button"], 
.button-section input[type="submit"],
.button-section input[type="reset"] 
{
	background-image: url("/images/blue-metal-dark-small.jpg");
	padding: 4px 8px 4px 8px;
	margin-bottom: 3px;
	margin-left: -11px;
	margin-right: 8px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
	font: normal 30px 'Bitter', serif;
	-moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	-webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	border: 1px solid #257C9E;
	font-size: calc(9px + 1vw);
}


/* ---------ASIDE SECTION ---------------------------------------------------- */
aside.hot-fitness-news
{
		display: block;
	    text-align: center;
}

aside.hot-fitness-news ul
{	display: block;
	text-align: center;
	margin: auto auto auto auto;
	margin-top: 10px;
	margin-left: -90px;	
}

aside.hot-fitness-news ul li
{
	white-space: nowrap;
	text-decoration: none;
	width:26%;
	display: inline-block;
	text-align: center;
	align-top: center;
	padding: 0px 10px 0px 35px;	
}

aside.hot-fitness-news ul li a.aside-button:hover 
{
	background-image: url("/images/black-granite-small.jpg");
	border-radius: 4px;
	color: #fcf9f9;	
}
	
aside.hot-fitness-news ul li a.aside-button 
{
	font-size: 18px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	text-align:center;
	display: inline-block;
	width: 100%;
	background-image: url("/images/white-granite-small.jpg");
	padding:1px;
	margin:1px;
	text-shadow: 4px 4px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 12px 12px 8px rgba(155, 155, 155, .4);
}


/* ---------------ARTICLES AND TOOLS SECTIONS ------------------------------------------------------------------------------------------ */	

section.articleslisting, section.toolslisting
{
	align-items: center;
	vertical-align:top;
	margin-bottom: 10px;
	margin-top:20px;
	display: block;
}


section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
{
	width: 215px;
	height: 215px;
	display: inline-block; 
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	box-shadow: 20px 20px 10px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
	position: relative;
	margin: 15px 15px 15px 15px;
	vertical-align:top;
	text-align: center;	
}

	.articleblurb 
	{
        white-space: normal;
        width: 205px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 15px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 205px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 17px;
    }
	
	 .articleblurb3 
	{
        white-space: normal;
        width: 205px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 15px;
    }


.grey
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}

section.articlesummary 
{
	background-image: url("/images/white-granite-small.jpg");
	margin-top: -15px;
}

.thumbnail
{
	display: inline-block;
	width: 170px;
	height: 110px;
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	margin-top: -15px;
	object-fit: cover;
}

.toolssummary1
{		
	vertical-align:top;
	background-image: url("/images/blue-metal-dark-small.jpg");
	background-size: contain;
}	

.toolssummary2
{		
	vertical-align:top;
	background-image: url("/images/brown-metal-small.jpg");
	background-size: contain;
}	

.toolssummary3
{
	vertical-align:top;
	background-image: url("/images/green-metal-small.jpg");
	background-size: contain;	
}	
	
	
section.articlesummary:hover, section.toolssummary1:hover, section.toolssummary2:hover,  section.toolssummary3:hover
{
		animation: pulse 2s linear infinite;
		-webkit-animation: pulse 1.0s linear infinite;
		-moz-animation: pulse 1.0s linear infinite;
		-ms-animation: pulse 1.0s linear infinite;
		-o-animation: pulse 1.0s linear infinite;		
}

.zoom 
{
	transition: transform .5s;  
}

.zoom:hover 
{
    -ms-transform: scale(1.2); /* IE 9 */
    -webkit-transform: scale(1.2); /* Safari 3-8 */
    transform: scale(1.2);
} 	
	
@keyframes pulse {
    0% { box-shadow: 0 0 5px 10px rgba(155,155,155, 0.6); }
    50% { box-shadow: 0 0 10px 10px rgba(155,155,155, 0.6);}
    100% { box-shadow: 0 0 15px 10px rgba(155,155,155, 0.6); }
}	
	
@-webkit-keyframes pulse {
    0% { box-shadow: 0 0 5px 10px rgba(155,155,155, 0.6); }
    50% { box-shadow: 0 0 10px 10px rgba(155,155,155, 0.6); }
    100% { box-shadow: 0 0 15px 10px rgba(155,155,155, 0.6); }
}	
	h3 
	{
		font-size: 24px;
		font-weight: 900;
		margin-top: -3px;
	}
		
	h3#bct
	{
		font-size: 18px;
		font-weight: 900;
	}
	
	
	/* ------------ footer section ---------------- */
	
	.footer
	{
		margin: auto;
		font-size: 24px;
		
	}
	
}

/*------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------*/
/*------------------------- Extra Small Devices and Phones ---------------------------------------*/
@media only screen and (min-width: 1024px)

{
	
	.container
	{
		 min-height:100%;
		 width: 1020px;
		 margin:  0 auto;
		
		display: grid;
			grid-template-columns: 1020px;
			grid-template-rows:  auto 100px 195px 65px auto 65px 720px 10px; 
			-moz-row-gap: 10px;	
			row-gap: 10px;			
	}
	
	/*--- header area -------*/
	header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 3;
	grid-row-end: 3;
}


aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}


aside.quick-newsletter-signups
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5;
}


aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}


main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}

/*------GRID LAYOUT ----------------------------*/

@supports (display: grid) 
{
  main 
  { 
    max-width: 100%;
    margin: 0;
  }
 
  .header-grid 
  {
    max-width: 90%;
    margin: 0;
    margin-bottom:.5rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    grid-gap: .5rem;
    font-family: Avenir, Roboto, Helvetica, san-serif; 
  }
}
  
.grid-part
{
  display: flex;
  flex-flow: column;
  align-self: center;
  text-align: center;
}

.grid-part > h1 
{
  margin: 1rem 1rem 0;
  font-size:calc(22px + 3.6vw);
  line-height: .9em;
}

.grid-part > img 
{
  max-width: calc(70% + 3vw);
  max-height: calc(70% + 3vw);
}

.grid-part  .main-heading-pic
{
  max-width: calc(80% + 4.0vw); 
  margin-left:-30px;
}

#quote
{
	font-size: calc(14px + 1vw);;
	color: white;
	font-weight: 600;
	font-style: italic;
	text-shadow: 8px 5px 5px rgba(163, 179, 179, .8);
	padding: 3px;
}

/* ------- NAVIGATION ROW-------------------------------------------------- */
nav, aside.hot-fitness-news
{
	width: 100%;
	position: relative;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
	
a.nav-button:hover 
{
	background-image: url("/images/cream-granite-small.jpg");
	border-radius: 4px;
	color: #000000;	
}
	
nav ul
{
	display: block;
	width: 100%;
	text-align: center;
	margin: auto;
	position: absolute;
    top: 50%;
    left: 45%;
	
    transform: translate(-50%, -50%);
}

nav ul li
{
	white-space: nowrap;
	text-decoration: none;
	width: 25%;
	display: inline-block;
	margin-left:10px;
	margin-right:10px;
	padding-left:2px;
	padding-right: 2px;	
	
}
	
nav ul li a 
{
	font-size: 22px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding:2px;
	margin:1px;
	text-shadow: 5px 5px 5px rgba(163, 179, 179, 0.8);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

/* ---------INTRO SECTION ---------------------------------------------------- */
	
.eliminate
{
		display: unset;
}
	
section.intro
{
	display: block;
	position: relative;
	text-align: center;
	color:white;
	align-items: center;
	margin-left: 7px;
}

section.intro img
{
	display: inline-block;  
}


.thumbnail2
{
	display: inline-block;
	width: 185px;
	height: 185px;
	border-width: 3px;
	border-style: solid;
	object-fit: cover;
	margin:0px 0px 0px 1px;
	box-shadow: 10px 10px 6px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
	
}


.thumbnail2 img 
{
    max-width: 100%;
    max-height: 100%;
}
	
h2
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
	font-size: 40px;
	font-weight: 900;
}	
	
.bottom-left 
{
    position: absolute;
    bottom: -27px;
    left: 10px;
}


.top-left 
{
    position: absolute;
    top: -37px;
    left: 10px;
}


.top-right 
{
    position: absolute;
    top: -37px;
    right: 16px;
}


.bottom-right 
{
    position: absolute;
    bottom: -27px;
    right: 10px;
}


.centered 
{
     position: absolute;
    top: 60px;
    right: 395px;
}	
/********************* aside for social media icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
		margin: auto;
		height: 70px;
}

div.footer-social-icons 
{
    background: transparent;
     width: 100%;
     height: 65px;
     text-align: center;
}
a.social-icon
{
    width: 50px;
    height: 50px;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.6);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, 0.6);
	text-align: center;
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

ul.social-icons 
{
    padding:0;
    list-style: none;
}

ul.social-icons li 
{
    vertical-align: center;
    display: inline-block;
    height: 50px;
    width: auto;
    
}

.fa-facebook
{
    padding:16px 15px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}

.fa-youtube 
{
    padding:16px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-instagram 
{
    padding:16px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    margin: auto;
}
.fa-instagram:hover 
{
     background-color: #3d5b99;
}


.fa-google-plus 
{
    padding:16px 12px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

div.google-plus-icon
{
    height: 30px;
    width: 30px;
    overflow: hidden;
    position: absolute;
    z-index: 1;
    opacity: .01;
}

.my-custom-googleplusone
{
    overflow: hidden;
    background-image: url("/images/plus-one-icon-for-google-plus.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 50px;
    width: 50px;
    margin-top: 3px;
    margin-left: 0px;
    position: absolute;
    pointer-events: none;
}

.my-custom-googleplusone
{
     width: 50px;
    height: 50px;
	box-shadow: 3px 3px 2px rgba(155, 155, 155, 0.6);
}

/*----- QUICK NEWSLETTER SIGNUPS --------------------------------------------*/


aside.quick-newsletter-signups
{
		display: block;
		text-align: center;
		width: 95%;
}

/*styling for each form input type */
.inner-wrap input[type="text"],
.inner-wrap input[type="email"],
.inner-wrap input[type="number"],
.inner-wrap textarea,
.inner-wrap select 
{
	font: calc(8px + .5vw) Arial, Helvetica, sans-serif;
}


div.inner-wrap
{
	display: block;
	align-self:center;
	padding: 10px;
	background-image: url("/images/green-metal-small.jpg");
	border-radius: 6px;
	font-size: calc(15px + 1vw);
	font-weight: 700;
	color: white;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

.inner-wrap label
{
	display:inline-block;
	font: calc(8px + 1vw) Arial, Helvetica, sans-serif;
	font-weight: 700;
	color: white;
	margin-bottom: 5px;
	width: 20%;
}

.error 
{
	display: inline-block;
	font: 16px Arial, Helvetica, sans-serif;
	color: #ffea05;
	padding: 2px;
	margin-bottom:6px;
}


/* button styling */
.button-section input[type="button"], 
.button-section input[type="submit"],
.button-section input[type="reset"] 
{
	background-image: url("/images/blue-metal-dark-small.jpg");
	padding: 5px 10px 5px 10px;
	margin-bottom: 3px;
	margin-left: -20px;
	margin-right: 10px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
	font: normal 30px 'Bitter', serif;
	-moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	-webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
	border: 1px solid #257C9E;
	font-size: calc(10px + 1vw);
}

/* ---------ASIDE SECTION ---------------------------------------------------- */
aside.hot-fitness-news
{
		display: block;
	    text-align: center;
}

aside.hot-fitness-news ul
{	display: block;
	text-align: center;
	margin: auto auto auto auto;
	margin-top: 10px;
	margin-left: -50px;	
}

aside.hot-fitness-news ul li
{
	white-space: nowrap;
	text-decoration: none;
	width:27%;
	display: inline-block;
	text-align: center;
	align-top: center;
	padding: 0px 35px 0px 25px;	
}

aside.hot-fitness-news ul li a.aside-button:hover 
{
	background-image: url("/images/black-granite-small.jpg");
	border-radius: 4px;
	color: #fcf9f9;	
}
	
aside.hot-fitness-news ul li a.aside-button 
{
	font-size: 23px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	text-align:center;
	display: inline-block;
	width: 100%;
	background-image: url("/images/white-granite-small.jpg");
	padding:4px;
	margin:1px;
	text-shadow: 4px 4px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 12px 12px 8px rgba(155, 155, 155, .4);
}



/* ---------------ARTICLES AND TOOLS SECTIONS ------------------------------------------------------------------------------------------ */	

section.articleslisting, section.toolslisting
{
	align-items: center;
	vertical-align:top;
	margin-bottom: 10px;
	margin-top:40px;
	display: block;
}


section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
{
	width: 290px;
	height: 290px;
	display: inline-block; 
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	box-shadow: 15px 15px 7px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
	position: relative;
	margin: 15px 15px 0px 15px;
	vertical-align:top;
	text-align: center;	
}

	.articleblurb 
	{
        white-space: normal;
        width: 280px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 20px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 280px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 21px;
    }
	
	 .articleblurb3 
	{
        white-space: normal;
        width: 280px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 19px;
    }


.grey
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}

section.articlesummary 
{
	background-image: url("/images/white-granite-small.jpg");
	margin-top: -15px;
}

.thumbnail
{
	display: inline-block;
	width: 240px;
	height: 150px;
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	margin-top: -15px;
	object-fit: cover;
}

.toolssummary1
{		
	vertical-align:top;
	background-image: url("/images/blue-metal-dark-small.jpg");
	background-size: contain;
}	

.toolssummary2
{		
	vertical-align:top;
	background-image: url("/images/brown-metal-small.jpg");
	background-size: contain;
}	

.toolssummary3
{
	vertical-align:top;
	background-image: url("/images/green-metal-small.jpg");
	background-size: contain;	
}	
	
	
section.articlesummary:hover, section.toolssummary1:hover, section.toolssummary2:hover,  section.toolssummary3:hover
{
		animation: pulse 2s linear infinite;
		-webkit-animation: pulse 1.0s linear infinite;
		-moz-animation: pulse 1.0s linear infinite;
		-ms-animation: pulse 1.0s linear infinite;
		-o-animation: pulse 1.0s linear infinite;		
}

.zoom 
{
	transition: transform .5s;  
}

.zoom:hover 
{
    -ms-transform: scale(1.2); /* IE 9 */
    -webkit-transform: scale(1.2); /* Safari 3-8 */
    transform: scale(1.2);
} 	
	
@keyframes pulse {
    0% { box-shadow: 0 0 5px 10px rgba(155,155,155, 0.6); }
    50% { box-shadow: 0 0 10px 10px rgba(155,155,155, 0.6);}
    100% { box-shadow: 0 0 15px 10px rgba(155,155,155, 0.6); }
}	
	
@-webkit-keyframes pulse {
    0% { box-shadow: 0 0 5px 10px rgba(155,155,155, 0.6); }
    50% { box-shadow: 0 0 10px 10px rgba(155,155,155, 0.6); }
    100% { box-shadow: 0 0 15px 10px rgba(155,155,155, 0.6); }
}

	
	h3 
	{
		font-size: 28px;
		font-weight: 900;
		margin-top: -3px;
	}
		
	h3#bct
	{
		font-size: 24px;
		font-weight: 900;
		margin-bottom: 30px;
	}
	
	
	/* ------------ footer section ---------------- */
	
	.footer
	{
		margin: auto;
		font-size: 24px;
		
	}
	
}

/*------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------*/
/*------------------------- Extra Small Devices and Phones ---------------------------------------*/
@media only screen and (min-width: 1440px) 

{
    	body, html 
	{
		background-image: url("/images/Steel-Background.jpg");
		background-size: cover;
		
	}
	
	body
	{  
		height:100%;
		
		margin:0;
		padding:0;
	
	}
/* ------------------------------------------------------------- */
.container
{
	 min-height:100%;
	 width: 1435px;
	
	display: grid;
		grid-template-columns: 1435px;
		grid-template-rows:  auto 30px auto  100px auto 100px 700px 50px; 
		-moz-row-gap: 10px;	
		row-gap: 10px;			
}

header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 3;
	grid-row-end: 3;
}

aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}

aside.quick-newsletter-signups
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5;
}

aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}

main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}

/*------GRID LAYOUT ----------------------------*/

@supports (display: grid) 
{
  main 
  { 
    max-width: 100%;
    margin: 0;
  }
 
  .header-grid 
  {
    max-width: 90%;
    margin: 0;
    margin-bottom:.5rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    grid-gap: .5rem;
    font-family: Avenir, Roboto, Helvetica, san-serif; 
  }
}
  
.grid-part
{
  display: flex;
  flex-flow: column;
  padding: 0rem;
  align-self: center;
  text-align: center;
}

.grid-part > h1 
{
  margin: 1rem 1rem 0;
  font-size:calc(36px + 3.6vw);
  line-height: .9em;
}

.grid-part > img 
{
  max-width: calc(70% + 3.2vw);
  max-height: calc(70% + 3.2vw) ;
}

.grid-part  .main-heading-pic
{
  max-width: calc(80% + 3.0vw); 
  margin-left:-50px;
}

#quote
{
	font-size: calc(20px + 1vw);;
	color: white;
	font-weight: 600;
	font-style: italic;
	text-shadow: 8px 5px 5px rgba(163, 179, 179, .8);
	padding: 3px;
}

/* ------- NAVIGATION ROW-------------------------------------------------- */
aside.hot-fitness-news
{
	width: 100%;
	position: relative;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
	
a.nav-button:hover 
{
	background-image: url("/images/cream-granite-small.jpg");
	border-radius: 4px;
	color: #000000;	
}
	
nav ul
{
	display: block;
	width: 100%;
	text-align: center;
	margin-left: 35px;
}

nav ul li
{
	white-space: nowrap;
	text-decoration: none;
	width: auto;
	display: inline-block;
	margin-left:10px;
	margin-right:10px;
	padding-left:5px;
	padding-right: 5px;	
	
}
	
nav ul li a 
{
	float: center;
	font-size: 18px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 8px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding:3px;
	margin:1px;
	text-shadow: 5px 5px 5px rgba(163, 179, 179, 0.8);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

/* ---------INTRO SECTION ---------------------------------------------------- */
	

section.intro
{
	display: block;
	position: relative;
	text-align: center;
	color:white;
	align-items: center;
}

section.intro img
{
	display: inline-block;  
}


.thumbnail2
{
	display: inline-block;
	width: 265px;
	height: 265px;
	border-width: 3px;
	border-style: solid;
	object-fit: cover;
	box-shadow: 16px 16px 80px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
}


.thumbnail2 img 
{
    max-width: 100%;
    max-height: 100%;
}
	
.bottom-left 
{
    position: absolute;
    bottom: -50px;
    left: 30px;
}


.top-left 
{
    position: absolute;
    top: -57px;
    left: 30px;
}


.top-right 
{
    position: absolute;
    top: -55px;
    right: 16px;
}


.bottom-right 
{
    position: absolute;
    bottom: -55px;
    right: 16px;
}


.centered 
{
     position: absolute;
    top: 90px;
    right:530px;
}	

/********************* aside for social media icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
		margin: auto;
		height: 100px;
}

div.footer-social-icons 
{
    background: transparent;
     width: 100%;
     height: 95px;
     text-align: center;
   
}
a.social-icon
{
    width: 80px;
    height: 80px;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.6);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, 0.6);
	text-align: center;
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

ul.social-icons 
{
    padding:0;
    list-style: none;
}

ul.social-icons li 
{
    vertical-align: center;
    display: inline-block;
    height: 50px;
    width: auto;
    margin-right: 145px;
    
}

.fa-facebook
{
    padding:15px 22px;
    -o-transition:.5s;
    font-size: 50px;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}

.fa-youtube 
{
    padding:14px 17px;
    font-size: 50px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-instagram 
{
    padding:14px 17px;
    font-size: 50px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    margin: auto;
}
.fa-instagram:hover 
{
     background-color: #3d5b99;
}


.fa-google-plus 
{
    padding:13px 5px;
    font-size: 50px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

div.google-plus-icon
{
    height: 30px;
    width: 30px;
    overflow: hidden;
    position: absolute;
   z-index: 1;
    opacity: .01;
}

.my-custom-googleplusone
{
    overflow: hidden;
    background-image: url("/images/plus-one-icon-for-google-plus.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 80px;
    width: 80px;
    margin-top: 4px;
    margin-left: 0px;
    position: absolute;
    pointer-events: none;
    box-shadow: 6px 6px 4px rgba(155, 155, 155, 0.6);
}

/*----- QUICK NEWSLETTER SIGNUPS --------------------------------------------*/
aside.quick-newsletter-signups
{
		display: block;
		text-align: center;
		width: 94%;
		margin-left: 50px;
}
/* ---------ASIDE SECTION ---------------------------------------------------- */
aside.hot-fitness-news
{
		display: block;
	    text-align: center;
}

aside.hot-fitness-news ul
{	display: block;
	text-align: center;
	margin: auto auto auto auto;
	margin-top: 10px;
	margin-left: -100px;	
}

aside.hot-fitness-news ul li
{
	white-space: nowrap;
	text-decoration: none;
	width:19%;
	display: inline-block;
	text-align: center;
	align-top: center;
	padding: 0px 40px 0px 0px;	
}

aside.hot-fitness-news ul li a.aside-button:hover 
{
	background-image: url("/images/black-granite-small.jpg");
	border-radius: 4px;
	color: #fcf9f9;	
}
	
aside.hot-fitness-news ul li a.aside-button 
{
	font-size: 22px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	text-align:center;
	display: inline-block;
	width: 100%;
	background-image: url("/images/white-granite-small.jpg");
	padding:4px;
	margin:1px;
	text-shadow: 4px 4px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 12px 12px 8px rgba(155, 155, 155, .4);
}

/*---------- MAIN SECTION -----------------------------------------------------------------------------------*/
main
{
	
}
/* ---------------ARTICLES AND TOOLS SECTIONS ------------------------------------------------------------------------------------------ */	

section.articleslisting, section.toolslisting
{
	align-items: center;
	vertical-align: top;
	margin-bottom: 10px;
	margin-top:0px;
	display: block;
	margin-left: 50px;
}


section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
{
	width: 300px;
	height: 300px;
	display: inline-block; 
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	box-shadow: 15px 15px 7px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
	position: relative;
	margin: 30px 100px 30px 30px;
	vertical-align:top;
	text-align: center;	
}

	.articleblurb 
	{
        white-space: normal;
        width: 290px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 22px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 290px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 23px;
    }
	
	 .articleblurb3 
	{
        white-space: normal;
        width: 290px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 20px;
    }


.grey
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}

section.articlesummary 
{
	background-image: url("/images/white-granite-small.jpg");
	margin-top: -15px;
}

.thumbnail
{
	display: inline-block;
	width: 280px;
	height: 170px;
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	margin-top: -30px;
	object-fit: cover;
}

.toolssummary1
{		
	vertical-align:top;
	background-image: url("/images/blue-metal-dark-small.jpg");
	background-size: contain;
}	

.toolssummary2
{		
	vertical-align:top;
	background-image: url("/images/brown-metal-small.jpg");
	background-size: contain;
}	

.toolssummary3
{
	vertical-align:top;
	background-image: url("/images/green-metal-small.jpg");
	background-size: contain;	
}	
	

.whiten
{
	text-shadow: 4px 2px 2px rgba(255, 255, 255, 0.8);
}

/* -----------FOOTER SECTION -------------------------------------------------- */
	
footer 
{
	font-size: 20px;
	font-weight: 900;
	color: #fcfcfc;
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}
/* --------- -H TAGS --------------------------------------------------- */
	
h1 , h2 , H3
{
	text-shadow: 8px 5px 5px rgba(163, 179, 179, 0.8);
}
	
h2
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
	font-size: 70px;
	font-weight: 2000;
}
	
h1 
{
	font-size: 120px;
	font-weight: 2000;
	margin-top: 0px;
	margin-bottom: 0px;
}
	
h1.centered
{
    font-size: 120px;
}

h3 
{
	font-size: 28px;
	font-weight: 2000;
	margin-top: -3px;
}
	
h3#bct
{
	font-size: 22px;
	font-weight: 2000;
}

}
/*------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------------------*/
/*------------------------- Extra Small Devices and Phones ---------------------------------------*/
@media only screen and (min-width: 1680px) 


{
    	body, html 
	{
		background-image: url("/images/Steel-Background.jpg");
		background-size: cover;
		
	}
	
	body
	{  
		height:100%;
		margin:0;
		padding:0;
	
	}
/* ------------------------------------------------------------- */
.container
{
	 min-height:100%;
	
	display: grid;
		grid-template-columns: max-content;
		grid-template-rows:  auto 50px 330px  100px auto 120px 1100px 50px; 
		-moz-row-gap: 20px;	
		row-gap: 20px;			
}

header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 3;
	grid-row-end: 3;
}

aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}


aside.quick-newsletter-signups
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5;
}

aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}

main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}

/*------GRID LAYOUT ----------------------------*/

@supports (display: grid) 
{
  main 
  { 
    max-width: 100%;
    margin: 0;
  }
 
  .header-grid 
  {
    max-width: 90%;
    margin: 0;
    margin-bottom:.5rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    grid-gap: .5rem;
    font-family: Avenir, Roboto, Helvetica, san-serif; 
  }
}
  
.grid-part
{
  display: flex;
  flex-flow: column;
  padding: 0rem;
  align-self: center;
  text-align: center;
}

.grid-part > h1 
{
  margin: 1rem 1rem 0;
  font-size:calc(40px + 3.6vw);
  line-height: .9em;
}

.grid-part > img 
{
  max-width: calc(70% + 3.2vw);
  max-height: calc(70% + 3.2vw) ;
}

.grid-part  .main-heading-pic
{
  max-width: calc(80% + 3.0vw); 
  margin-left:-50px;
}

#quote
{
	font-size: calc(16px + 1vw);;
	color: white;
	font-weight: 600;
	font-style: italic;
	text-shadow: 8px 5px 5px rgba(163, 179, 179, .8);
	padding: 3px;
}


/* ------- NAVIGATION ROW-------------------------------------------------- */
aside.hot-fitness-news
{
	width: 100%;
	position: relative;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
	
a.nav-button:hover 
{
	background-image: url("/images/cream-granite-small.jpg");
	border-radius: 4px;
	color: #000000;	
}
	
nav ul
{
	display: block;
	width: 100%;
	text-align: center;
	margin: auto;
	position: absolute;
    top: 50%;
    left: 45%;
    transform: translate(-50%, -50%);
}

nav ul li
{
	white-space: nowrap;
	text-decoration: none;
	width: auto;
	display: inline-block;
	margin-left:10px;
	margin-right:10px;
	padding-left:5px;
	padding-right: 5px;	
	
}
	
nav ul li a 
{
	float: center;
	font-size: 28px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding:4px;
	margin:1px;
	text-shadow: 5px 5px 5px rgba(163, 179, 179, 0.8);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

/* ---------INTRO SECTION ---------------------------------------------------- */
	

section.intro
{
	display: block;
	position: relative;
	text-align: center;
	color:white;
	align-items: center;
}

section.intro img
{
	display: inline-block;  
}


.thumbnail2
{
	display: inline-block;
	width: 325px;
	height: 325px;
	border-width: 3px;
	border-style: solid;
	object-fit: cover;
	box-shadow: 16px 16px 80px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
}


.thumbnail2 img 
{
    max-width: 100%;
    max-height: 100%;
}
	
.bottom-left 
{
    position: absolute;
    bottom: -50px;
    left: 30px;
}


.top-left 
{
    position: absolute;
    top: -57px;
    left: 30px;
}


.top-right 
{
    position: absolute;
    top: -55px;
    right: 16px;
}


.bottom-right 
{
    position: absolute;
    bottom: -55px;
    right: 16px;
}


.centered 
{
     position: absolute;
    top: 120px;
    right: 755px;
}	

/********************* aside for social media icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
		margin: auto;
		height: 100px;
}

div.footer-social-icons 
{
    background: transparent;
     width: 100%;
     height: 95px;
     text-align: center;
}
a.social-icon
{
    width: 90px;
    height: 90px;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.6);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, 0.6);
	text-align: center;
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

ul.social-icons 
{
    padding:0;
    list-style: none;
}

ul.social-icons li 
{
    vertical-align: center;
    display: inline-block;
    height: 95px;
    width: auto;
    
}

.fa-facebook
{
    padding:15px 23px;
    font-size:60px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}

.fa-youtube 
{
    padding:14px 18px;
    font-size:60px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-instagram 
{
    padding:14px 19px;
    font-size:60px;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    margin: auto;
}
.fa-instagram:hover 
{
     background-color: #3d5b99;
}


.fa-google-plus 
{
    padding:13px 6px;
    font-size:60px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

div.google-plus-icon
{
    height: 30px;
    width: 30px;
    overflow: hidden;
    position: absolute;
    z-index: 1;
    opacity: .01;
}

.my-custom-googleplusone
{
    overflow: hidden;
    background-image: url("/images/plus-one-icon-for-google-plus.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 90px;
    width: 90px;
    margin-top: 1px;
    margin-left: 0px;
    position: absolute;
    pointer-events: none;
    box-shadow: 3px 3px 2px rgba(155, 155, 155, 0.6);
}

/*----- QUICK NEWSLETTER SIGNUPS --------------------------------------------*/
aside.quick-newsletter-signups
{
		display: block;
		text-align: center;
		width: 95%;
}

/* ---------ASIDE SECTION ---------------------------------------------------- */
aside.hot-fitness-news
{
		display: block;
	    text-align: center;
}

aside.hot-fitness-news ul
{	display: block;
	text-align: center;
	margin: auto auto auto auto;
	margin-top: 10px;
	margin-left: -90px;	
}

aside.hot-fitness-news ul li
{
	white-space: nowrap;
	text-decoration: none;
	width:24%;
	display: inline-block;
	text-align: center;
	align-top: center;
	padding: 0px 60px 0px 80px;	
}

aside.hot-fitness-news ul li a.aside-button:hover 
{
	background-image: url("/images/black-granite-small.jpg");
	border-radius: 4px;
	color: #fcf9f9;	
}
	
aside.hot-fitness-news ul li a.aside-button 
{
	font-size: 36px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	text-align:center;
	display: inline-block;
	width: 100%;
	background-image: url("/images/white-granite-small.jpg");
	padding:4px;
	margin:1px;
	text-shadow: 4px 4px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 12px 12px 8px rgba(155, 155, 155, .4);
}

/*---------- MAIN SECTION -----------------------------------------------------------------------------------*/
main
{
	
}
/* ---------------ARTICLES AND TOOLS SECTIONS ------------------------------------------------------------------------------------------ */	

section.articleslisting, section.toolslisting
{
	align-items: center;
	vertical-align: top;
	margin-bottom: 10px;
	margin-top:0px;
	display: block;
}


section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
{
	width: 500px;
	height: 500px;
	display: inline-block; 
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	box-shadow: 20px 20px 10px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
	position: relative;
	margin: 40px 40px 40px 40px;
	vertical-align:top;
	text-align: center;	
}

	.articleblurb 
	{
        white-space: normal;
        width: 475px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 35px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 475px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 37px;
    }
	
	 .articleblurb3 
	{
        white-space: normal;
        width: 475px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 33px;
    }


.grey
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}

section.articlesummary 
{
	background-image: url("/images/white-granite-small.jpg");
	margin-top: -15px;
}

.thumbnail
{
	display: inline-block;
	width: 350px;
	height: 280px;
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	margin-top: -30px;
	object-fit: cover;
}

.toolssummary1
{		
	vertical-align:top;
	background-image: url("/images/blue-metal-dark-small.jpg");
	background-size: contain;
}	

.toolssummary2
{		
	vertical-align:top;
	background-image: url("/images/brown-metal-small.jpg");
	background-size: contain;
}	

.toolssummary3
{
	vertical-align:top;
	background-image: url("/images/green-metal-small.jpg");
	background-size: contain;	
}	
	

.whiten
{
	text-shadow: 4px 2px 2px rgba(255, 255, 255, 0.8);
}

/* -----------FOOTER SECTION -------------------------------------------------- */
	
footer 
{
	font-size: 20px;
	font-weight: 900;
	color: #fcfcfc;
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}
/* --------- -H TAGS --------------------------------------------------- */
	
h1 , h2 , H3
{
	text-shadow: 8px 5px 5px rgba(163, 179, 179, 0.8);
}
	
h2
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
	font-size: 70px;
	font-weight: 2000;
}
	
h1 
{
	font-size: 120px;
	font-weight: 2000;
	margin-top: 0px;
	margin-bottom: 0px;
}
	
h1.centered
{
    font-size: 120px;
}

h3 
{
	font-size: 40px;
	font-weight: 2000;
	margin-top: -3px;
}
	
h3#bct
{
	font-size: 40px;
	font-weight: 2000;
}

}

/*************************************************************************************/
/*************************************************************************************/
/*************************************************************************************/
/*------------------------- Very large screens --------------------------------------*/
@media only screen and (min-width: 1920px) 

{
    	body, html 
	{
		background-image: url("/images/Steel-Background.jpg");
		background-size: cover;
		
	}
	
	body
	{  
		height:100%;
		margin:0;
		padding:0;
	
	}
/* ------------------------------------------------------------- */
.container
{
	 min-height:100%;
	 width: 1910px;
	display: grid;
		grid-template-columns: 1910px;
		grid-template-rows:  auto 50px 360px 100px auto 120px 1100px 50px; 
		-moz-row-gap: 20px;	
		row-gap: 20px;			
}

header
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 1;
	grid-row-end: 1;
}	

nav
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 2;
	grid-row-end: 2;
}	

section.intro
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 3;
	grid-row-end: 3;
}

aside.social-media-icons
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 4;
	grid-row-end: 4;
}

aside.quick-newsletter-signups
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 5;
	grid-row-end: 5;
}

aside.hot-fitness-news
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 6;
	grid-row-end: 6;
}

main
{
	grid-column-start: auto;
	grid-column-end: auto;
	grid-row-start: 7;
	grid-row-end: 7;
}

footer 
{
    grid-column-start: auto;
    grid-column-end: auto;
    grid-row-start: 8;
    grid-row-end: 8;
}

/*------GRID LAYOUT ----------------------------*/

@supports (display: grid) 
{
  main 
  { 
    max-width: 100%;
    margin: 0;
  }
 
  .header-grid 
  {
    max-width: 90%;
    margin: 0;
    margin-bottom:0rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    grid-gap: .5rem;
    font-family: Avenir, Roboto, Helvetica, san-serif; 
  }
}
  
.grid-part
{
  display: flex;
  flex-flow: column;
  padding: 0rem;
  align-self: center;
  text-align: center;
}

.grid-part > h1 
{
  margin: 1rem 1rem 0;
  font-size:calc(34px + 3.6vw);
  line-height: .9em;
}

.grid-part > img 
{
  max-width: calc(70% + 3.2vw);
  max-height: calc(70% + 3.2vw) ;
}

.grid-part  .main-heading-pic
{
  max-width: calc(80% + 3.0vw); 
  margin-left:-50px;
}

#quote
{
	font-size: calc(18px + 1vw);;
	color: white;
	font-weight: 600;
	font-style: italic;
	text-shadow: 8px 5px 5px rgba(163, 179, 179, .8);
	padding: 3px;
}


/* ------- NAVIGATION ROW-------------------------------------------------- */
aside.hot-fitness-news
{
	width: 100%;
	position: relative;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
	
a.nav-button:hover 
{
	background-image: url("/images/cream-granite-small.jpg");
	border-radius: 4px;
	color: #000000;	
}
	
nav ul
{
	display: block;
	width: 100%;
	text-align: center;
	margin: auto;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

nav ul li
{
	white-space: nowrap;
	text-decoration: none;
	width: auto;
	display: inline-block;
	margin-left:10px;
	margin-right:10px;
	padding-left:5px;
	padding-right: 5px;	
	
}
	
nav ul li a 
{
	float: center;
	font-size: 28px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	width:100%;
	text-align:center;
	display: block;
	background-image: url("/images/white-granite-small.jpg");
	padding:4px;
	margin:1px;
	text-shadow: 5px 5px 5px rgba(163, 179, 179, 0.8);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, .4);
}

/* ---------INTRO SECTION ---------------------------------------------------- */
	

section.intro
{
	display: block;
	position: relative;
	text-align: center;
	color:white;
	align-items: center;
}

section.intro img
{
	display: inline-block;  
}


.thumbnail2
{
	display: inline-block;
	width: 350px;
	height: 350px;
	border-width: 3px;
	border-style: solid;
	object-fit: cover;
	box-shadow: 20px 20px 10px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
}


.thumbnail2 img 
{
    max-width: 100%;
    max-height: 100%;
}
	
.bottom-left 
{
    position: absolute;
    bottom: -50px;
    left: 30px;
}


.top-left 
{
    position: absolute;
    top: -57px;
    left: 30px;
}


.top-right 
{
    position: absolute;
    top: -55px;
    right: 16px;
}


.bottom-right 
{
    position: absolute;
    bottom: -55px;
    right: 16px;
}


.centered 
{
     position: absolute;
    top: 120px;
    right: 755px;
}	

/*----- QUICK NEWSLETTER SIGNUPS --------------------------------------------*/
aside.quick-newsletter-signups
{
		display: block;
		text-align: center;
		width: 95%;
}

/********************* aside for social media icons **************************/
aside.social-media-icons 
{
		display: block;
		text-align: center;
		margin: auto;
		height: 100px;
}

div.footer-social-icons 
{
    background: transparent;
     width: 100%;
     height: 95px;
     text-align: center;
}
a.social-icon
{
    width: 90px;
    height: 90px;
    text-shadow: 3px 3px 3px rgba(163, 179, 179, 0.6);
	box-shadow: 10px 10px 5px rgba(155, 155, 155, 0.6);
	text-align: center;
}

p > a.social-icon:hover
{
    color: #d9d9d9;
    text-decoration:  underline;
}

ul.social-icons 
{
    padding:0;
    list-style: none;
}

ul.social-icons li 
{
    vertical-align: center;
    display: inline-block;
    height: 95px;
    width: auto;
    
}

.fa-facebook
{
    padding:15px 23px;
    font-size:60px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-facebook:hover 
{
    background-color: #3d5b99;
}

.fa-youtube 
{
    padding:14px 18px;
    font-size:60px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-youtube:hover 
{
    background-color: #e64a41;
}

.fa-instagram 
{
    padding:14px 19px;
    font-size:60px;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
    margin: auto;
}
.fa-instagram:hover 
{
     background-color: #3d5b99;
}


.fa-google-plus 
{
    padding:13px 6px;
    font-size:60px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: #322f30;
}
.fa-google-plus:hover 
{
    background-color: #e25714;
}

div.google-plus-icon
{
    height: 120px;
    width: 100px;
   margin-left: -20px;
   margin-top: 3px;
    overflow: hidden;
    position: absolute;
    z-index: 1;
    opacity: .01;
}

div[id^="___plusone_"] 
{
    /* Cross browser support for transform */
    -moz-transform: scale(2.25);
    -webkit-transform: scale(2.25);
    -o-transform: scale(2.25);
    -ms-transform: scale(2.25);
    transform: scale(2.25);

    
    /* Cross browser support for transform origin */
    -moz-transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;

    /* Margin right is used here since origin is set to bottom left */
   
}

.my-custom-googleplusone
{
    overflow: hidden;
    background-image: url("/images/plus-one-icon-for-google-plus.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 90px;
    width: 90px;
    margin-top: 1px;
    margin-left: 0px;
    position: absolute;
    pointer-events: none;
    box-shadow: 3px 3px 2px rgba(155, 155, 155, 0.6);
}

/*------ASIDE SECTION ---------------------------------------------------- */
aside.hot-fitness-news
{
		display: block;
	    text-align: center;
}

aside.hot-fitness-news ul
{	display: block;
	text-align: center;
	margin: auto auto auto auto;
	margin-top: 10px;
	margin-left: -90px;	
}

aside.hot-fitness-news ul li
{
	white-space: nowrap;
	text-decoration: none;
	width:24%;
	display: inline-block;
	text-align: center;
	align-top: center;
	padding: 0px 60px 0px 80px;	
}

aside.hot-fitness-news ul li a.aside-button:hover 
{
	background-image: url("/images/black-granite-small.jpg");
	border-radius: 4px;
	color: #fcf9f9;	
}
	
aside.hot-fitness-news ul li a.aside-button 
{
	font-size: 36px;
	font-weight: 900;
	color: #565252;
	text-decoration: none;
	border-width: 4px;
	border-style: solid;
	border-radius: 10px;
	text-align:center;
	display: inline-block;
	width: 100%;
	background-image: url("/images/white-granite-small.jpg");
	padding:4px;
	margin:1px;
	text-shadow: 4px 4px 3px rgba(163, 179, 179, 0.5);
	box-shadow: 12px 12px 8px rgba(155, 155, 155, .4);
}

/*---------- MAIN SECTION -----------------------------------------------------------------------------------*/
main
{
	
}
/* ---------------ARTICLES AND TOOLS SECTIONS -------------------------------------------------------------- */	

section.articleslisting, section.toolslisting
{
	align-items: center;
	vertical-align: top;
	margin-bottom: 10px;
	margin-top:0px;
	display: block;
}


section.articlesummary ,  section.toolssummary1 , section.toolssummary2 , section.toolssummary3
{
	width: 500px;
	height: 500px;
	display: inline-block; 
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	box-shadow: 20px 20px 10px rgba(155, 155, 155, .4);
	transition: box-shadow 0.3s ease-in-out;
	position: relative;
	margin: 40px 40px 40px 40px;
	vertical-align:top;
	text-align: center;	
}

	.articleblurb 
	{
        white-space: normal;
        width: 475px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 35px;
    }
	
	 .articleblurb2 
	{
        white-space: normal;
        width: 475px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 37px;
    }
	
	 .articleblurb3 
	{
        white-space: normal;
        width: 475px;
		margin-top: -5px;
		font-weight: 800;
		font-size: 33px;
    }


.grey
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}

section.articlesummary 
{
	background-image: url("/images/white-granite-small.jpg");
	margin-top: -15px;
}

.thumbnail
{
	display: inline-block;
	width: 350px;
	height: 280px;
	border-width: 5px;
	border-style: solid;
	border-radius: 10px;
	margin-top: -30px;
	object-fit: cover;
}

.toolssummary1
{		
	vertical-align:top;
	background-image: url("/images/blue-metal-dark-small.jpg");
	background-size: contain;
}	

.toolssummary2
{		
	vertical-align:top;
	background-image: url("/images/brown-metal-small.jpg");
	background-size: contain;
}	

.toolssummary3
{
	vertical-align:top;
	background-image: url("/images/green-metal-small.jpg");
	background-size: contain;	
}	
	

.whiten
{
	text-shadow: 4px 2px 2px rgba(255, 255, 255, 0.8);
}

/* -----------FOOTER SECTION -------------------------------------------------- */
	
footer 
{
	font-size: 20px;
	font-weight: 900;
	color: #fcfcfc;
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
}
/* --------- -H TAGS --------------------------------------------------- */
	
h1 , h2 , H3
{
	text-shadow: 8px 5px 5px rgba(163, 179, 179, 0.8);
}
	
h2
{
	text-shadow: 7px 4px 4px rgba(163, 179, 179, 0.8);
	font-size: 70px;
	font-weight: 2000;
}
	
h1 
{
	font-size: 120px;
	font-weight: 2000;
	margin-top: 0px;
	margin-bottom: 0px;
}
	
h1.centered
{
    font-size: 120px;
}

h3 
{
	font-size: 40px;
	font-weight: 2000;
	margin-top: -3px;
}
	
h3#bct
{
	font-size: 40px;
	font-weight: 2000;
}

}