@charset "UTF-8";
@import url("../webfonts/ostrich_regular/stylesheet.css");
/* CSS Document */

@font-face {
    font-family: 'ostrich_sansheavy';
    src: url('../images/fonts/ostrichsans-heavy-webfont.eot');
    src: url('../images/fonts/ostrichsans-heavy-webfont.eot?#iefix') format('embedded-opentype'),
         url('../images/fonts/ostrichsans-heavy-webfont.woff2') format('woff2'),
         url('../images/fonts/ostrichsans-heavy-webfont.woff') format('woff'),
         url('../images/fonts/ostrichsans-heavy-webfont.ttf') format('truetype'),
         url('../images/fonts/ostrichsans-heavy-webfont.svg#ostrich_sansheavy') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'kefa_regular';
    src: url('../images/fonts/kefa-regular-webfont.eot');
    src: url('../images/fonts/kefa-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../images/fonts/kefa-regular-webfont.woff2') format('woff2'),
         url('../images/fonts/kefa-regular-webfont.woff') format('woff'),
         url('../images/fonts/kefa-regular-webfont.ttf') format('truetype'),
         url('../images/fonts/kefa-regular-webfont.svg#kefa_presssregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

html, body {
	margin: 0;
	padding: 0;
	height: 100%;
}


body.homepage {
	
	background-repeat: no-repeat;
	background-size: cover;
	position: fixed;
	background-attachment: fixed;
	height: 100%;
	background-image: url(../images/background.jpg)

}


body.secondpage {
	background-repeat: no-repeat;
	background-size: cover;
	position: fixed;
	background-attachment: fixed;
	height: 100%;
	background-image: url(../images/background-02.jpg)
	

}


/* start of left bar socials!! */

.menu {
	width: 78px;
	height: 100%;
	float: left;
	background-repeat: repeat-y;
	background-color: rgba(235,244,255,1.00);
	-webkit-box-shadow: 4px 0px 8px rgba(205,215,227,1.00);
	box-shadow: 4px 0px 8px rgba(205,215,227,1.00);
	position: fixed;
}

.x {
	width: 35px;
	height: 41px;
	background-repeat: no-repeat;
	float: left;
	background-image: url(../images/webdesign_x.png);
	margin-left: 23px;
	margin-top: 25px;
}

.x:hover {
	opacity: 0.57;	
}

.facebook {
	width: 19px;
	height: 37px;
	background-image: url(../images/webdesign_facebook.png);
	float: left;
	margin-top: 60px;
	margin-left: 30px;
}

.facebook:hover {
	background-image: url(../images/webdesign_facebook.png);
	opacity: 0.55;
}


.instagram {
	width: 38px;
	height: 37px;
	background-image: url(../images/webdesign_instagram.png);
	float: left;
	margin-top: 56px;
	margin-left: 22px;
}

.instagram:hover {
	background-image: url(../images/webdesign_instagram.png);
	opacity: 0.55;
}

.snapchat {
	width: 36px;
	height: 35px;
	background-image: url(../images/webdesign_snapchat.png);
	float: left;
	margin-top: 54px;
	margin-left: 22px;
}

.snapchat:hover {
	background-image: url(../images/webdesign_snapchat.png);
	opacity: 0.55;
}

.tmcclogo {
	width: 56px;
	height: 35px;
	background-image: url(../images/webdesign_tmcc_logo.png);
	float: left;
	margin-top: 60px;
	margin-left: 11px;
}


.mail {
	width: 40px;
	height: 29px;
	background-image: url(../images/webdesign_mail.png);
	float: left;
	margin-top: 62px;
	margin-left: 20px;
	opacity: 0.85;
}

.mail:hover {
	background-image: url(../images/webdesign_mail.png);
	opacity: 0.49;	
	
}

.tmcclogo:hover {
	background-image: url(../images/webdesign_tmcc_logo.png);
	opacity: 0.55;
	
}


/* end of left bar socials! */

	
		nav {
	width: 100%;
	height: 46px;
	text-align: center;
	position: fixed;
	text-decoration: none;
		}
		
		/* This styles your left button <nav> tag and tags within */
		
		.leftbutton {
	display: block;
	width: 25%;
	float: left; /* This pushes your home button to the left */
	margin: 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
		}
		
		.leftbutton li {
	display: block;
	width: 28%;
	height: 65px;
	margin-left: 98px;
		}
		
		.leftbutton li a {
			display: block;
			height: 45px;
			padding-top: 24px;
			color: rgba(0,0,0,1.00);
			text-decoration: none;
			font-family: "kefa_regular", serif;
			font-weight: bold;	
			font-size: 18px;
		}

		
				
		.leftbutton li a:hover {
	color: rgba(0,0,0,0.47);
		}

		
		.navline {
	width: 556px;
	height: 29px;
	list-style-image: none;
	list-style-type: none;
	background-image: url(../images/webdesign_navline.png);
	background-repeat: no-repeat;
	margin-left: 202px;
	position: fixed;
	margin-top: 21px;
		}
		
		/* This styles your right button <nav> tag and tags within */
		
		.rightbuttons {
	display: block;
	width: 32%; /* This pushes your other buttons to the right */
	margin: 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
	float: right;
		}
		
		.rightbuttons li {
			display: block;
			width: 33.3%;
			height: 45px;
			float: left;
		}
		
		.rightbuttons li a {
			display: block;
			height: 45px;
			font-size: 18px;
			padding-top: 24px;
			color: rgba(0,0,0,1.00);
			text-decoration: none;
			font-family: "kefa_regular", serif;
			font-weight: bold;
		}
				
		.rightbuttons li a:hover {
			color: rgba(0,0,0,0.47);
		}


/* body type and about me!!! */		
	
.headline {
	width: 477px;
	height: 114px;
	color: rgba(0,0,0,1.00);
	font-size: 95px;
	position: fixed;
	bottom: 411px;
	font-family: "ostrich_sansheavy", sans-serif;
	left: 149px;
	line-height: 95px;
}

.circle {
	width: 346px;
	height: 176px;
	background-image: url(../images/webdesign_underlines.png);
	position: fixed;
	bottom: 306px;
	left: 305px;
}

.bodycopy {
	width: 589px;
	height: 187px;
	margin-left: 147px;
	color: rgba(0,0,0,1.00);
	font-size: 23px;
	position: fixed;
	bottom: 99px;
	font-family: "kefa_regular", serif;
	font-weight: bold;
	letter-spacing: 0.5px;
	text-align: justify;
	line-height: 33px;
}

.copyright {
	height: 35px;
	width: 487px;
	margin-left: 147px;
	position: fixed;
	bottom: 0px;
	font-family: "kefa_regular", serif;
}

.headline2 {
	width: 559px;
	height: 114px;
	color: rgba(0,0,0,1.00);
	font-size: 95px;
	position: fixed;
	bottom: 405px;
	font-family: "ostrich_sansheavy", sans-serif;
	left: 149px;
	line-height: 95px;
}

.bodycopy2 {
	width: 589px;
	height: 187px;
	margin-left: 147px;
	color: rgba(0,0,0,1.00);
	font-size: 19px;
	position: fixed;
	bottom: 106px;
	font-family: "kefa_regular", serif;
	font-weight: bold;
	letter-spacing: 0.5px;
	text-align: justify;
	line-height: 28px;
}

.views-site {
	width: 99px;
	height: 26px;
	position: fixed;
	color: rgba(255,38,4,1.00);
	font-size: 21px;
	font-family: "kefa_regular", serif;
	bottom: 97px;
	left: 610px;
	font-weight: bold;
	text-decoration: none;
}

.views-site:hover {
	opacity: 0.57;	
}

.view-site-line{
	width: 66px;
	height: 2px;
	background-color: rgba(255,34,0,1.00);
	position: fixed;
	bottom: 107px;
	left: 532px;
}