/*homepage*/

div.wrapper 
	{width: 1140px; margin:0 auto}
	
/*leather background header div*/

div.headerbackground 
	{background:url("images/leather-header.jpg");}
div.headerbackground div.wrapper 
	{display:flex;}
	

	/*links and logo div*/

div.headerbackground ul li 
	a {Font-family: 'DIN Alternate';
		src: url('path/to/fonts/DIN Alternate.ttf');
		text-decoration:none; 
		display: inline-block; 
		position:relative; 
		flex-direction:column; 
		color:#e0cb0e;
		text-size:29px;
		font-weight:bold;
		background-color:#333333;
		padding:28px 30px}
li 
	{display:inline-block; 
	padding:20px 30px;}

/*div.links1 ul {margin-left: 88px; margin-top: 66px;}
div.links1 {margin-top: -100px}

div.links2 ul li { margin-right: 88px; margin-top: 66px;text-size:29px}
div.links2 {margin-top: -100px}*/

	/*Backgorund div*/

body 
	{background-image:url("images/Woman-Jumprope.jpg"); position:relative;
	margin:0px;}

			/*text for gym website*/

	/*Swolemate for gym website*/

h1
	{font-family: "Bebas Neue"; 
	font-size: 76px; 
	font-weight:bold;
	color:#f2f1f1;}

h1 shift-up 
	{position:relative;
	bottom: 70px}

	/*second header like text for gym website*/

div.header {font-family: 'DIN Alternate Light';
    src: url('path/to/fonts/DIN Alternate Light.ttf') format('truetype');
	disaply: inline-block;
	font-size:16px;
	font-style: normal; 
	color:#f2f1f1;
	text-align:left;
	padding: 0px 0px 0px 0px; 
	/*change padding to move textvleft/right*/
	position: absolute; /*put this first to let it move, otherwise it wont move. make sure its absolute to its seen as a solo item, relative will move other things also relative*/
    bottom: 235px} /*caused the text to move up as the number got bigger. the text moved dodwn as it got smaller*/

/*DONT TOUCH HEADER PART ANYMORE. DELETE THIS COMMENT LATER*/

	/*Call To Action Button*/

div.cta {font-family:'DIN Alternate';
	src: url('path/to/fonts/DIN Alternate Light.ttf')
	format('truetype');
	text-decoration: none;
	display: inline-block;
	font-size:25px;
	font-style: normal; 
	color:#333333;
	
	/*border information*/
	background-repeat: no-repeat;
	background:#e0cb0e;
	box-shadow: 0px 0px 20px 10px rgba(10,10,10,10); 
	/*ensure you put some form of color and number there to get any form of drop shadow*/
	border-width: 5px;
	border-style: solid;
	border-color: #bc1010;
	text-align: right;
	padding: 0px 0px 0px 0px;
	position: absolute;
	top: 500px}

	/*Footer div*/

h3 {font-family: 'DIN Alternate Light';
    src: url('path/to/fonts/DIN Alternate Light.ttf') 
	format('truetype');
	font-size:15px;
	font-style: normal;
	color:#f2f1f1;}

div.footer 
	{position:flex absolute;
	justify-content: space-between; /* Pushes content to the extreme ends of the container */
    align-items: bottom;
	padding: 10px 20px;} /* Adds some space on the sides */

div.left-footer 
	{text-align:left;
	position:flex;
	left:0; 
	bottom:0px;
	top:0px}

div.right-footer 
	{position:flex; 
	text-align:right; 
	right:0px;bottom:0px;top:0px;left:0px}