/*Guides*/

/*Work Area*/
/*////////////////////////////////////////////////////////////////*/


/*-----Setup Page-----*/
	:root {
		--Ticket-Height: 300px;
		--EventTicket-Height: 700px;
		--Gallery-Height: 600px;
		--Homepage_Top_Banner: 30vw;
		--Menu-Height: 54px;
		--Video-Dimensions_W: 100%;
		--Video-Dimensions_H: calc(var(--Video-Dimensions_W)*.56);
	}
	:focus {
		outline: none;
		border: none;
	}

	@media (max-width:700px) {
		:root {
			--Homepage_Top_Banner: 55vw;
		}
	}


	* {
		margin: 0px;
		padding: 0px;
		/*overscroll-behavior: none;*/
	}

	img {vertical-align: middle;}

	html {
		background-color: black;
		/*background-color: #00101e;*/
		min-height: 100%;
	}

/*-----Scrollbars-----*/
	::-webkit-scrollbar {
		width: .5em;
	}

	body::-webkit-scrollbar {
		width: 1em;
	}
	 
	::-webkit-scrollbar-track {
		border-radius: 5px;
		/*-webkit-box-shadow: inset 0 0 6px rgba(0,150,200,.1);*/
	}
	 
	::-webkit-scrollbar-thumb {
		border-radius: 5px;
		background-color: rgb(0,100,150);
		outline: 1px solid #001c28;
	}
html {
		scrollbar-color: rgb(0,100,150) #001c28;
		scrollbar-width: .5em;
		scrollbar-radius: 5px;
	}



@media (max-width:700px) {
	::-webkit-scrollbar {
		width: 1em;
	}
	body::-webkit-scrollbar {
		width: 1em;
	}
	 
	::-webkit-scrollbar-track {
		border-radius: 5px;
/*		-webkit-box-shadow: inset 0 0 6px rgba(0,150,200,.1);*/
	}
	 
	::-webkit-scrollbar-thumb {
		border-radius: 5px;
		background-color: rgb(0,100,150);
		outline: 1px solid #001c28;
	}
}





/*-----Colors-----*/
	.ADAC-Blue {
		background-color: #001c28;
	}
	.ADAC-OffBlue {
		background-color: #062c3d;
	}
	.ADAC-DarkBlue {
		background-color: #00101e;
	}
	.ADAC-InactiveBlue {
		background-color: #5f879c;
	}
	.ADAC_BlueWhite{
		color: #b2e7ff;
	}
	.Blue_Dark{
		background-color: #00101e;
	}
	.ADAC-Gradient {
		background-image: linear-gradient(black, #003d58);
	}

	.ADAC-Gradient2 {
		background-image: linear-gradient(to right, black, #003d58);
	}
	.Black_50_Per {
		background-color: rgba(0,0,0,.7);
	}
	.White_50_Per {
		background-color: rgba(255,255,255,.5);
	}
	.Blue_Fade {
		background-color: rgba(10,38,70,.5);
	}
    .ADAC-Gray {
    background-color: #444444;
	}
	.ADAC-LightBlue {
		background-color: #005f88;
	}
	.Glow {
		box-shadow: 0px 0px 45px rgba(0,150,255,.7);
	}
	.Glow_Hover {
		/*box-shadow: 0px 0px 0px rgba(0,150,255,.7);*/
		transition: .25s;
	}
	.Glow_Hover:hover {
		box-shadow: 0px 0px 45px rgba(0,150,255,.7);
	}

/*-----Scaling-----*/
	.Width_100 {
		position: absolute;
		width: 100%;
	}
/*-----Z-Index-----*/
	.Z-Hidden {
		z-index: -1;
	}
	.Z-Background {
		z-index: -1;
	}
	.Z-Midground {
		z-index: 30;
	}
	.Z-Foreground {
		z-index: 50;
	}
	.Z-Image {
		z-index: 70;
	}
	.Z-Text {
		z-index: 80;
	}
	.Z-Menu {
		z-index: 100;
	}
	.Z-TopMenu {
		z-index: 110;
	}
/*-----Background-----*/
	.Background_Extend-1 {
		display: block;
	}

	.Background_Extend-2 {
		display: block;
	}

	.Background_Extend-3 {
		display: block;
	}

	.Text_Gradient_Background {
		position: relative;
		display: flex;
		height: 100%;
		top: 0;
		/*background-color: red;*/
		background-image: url("../Media/2-Ready/2-Images/Backgrounds/Text_Background_Gradient.jpg");
		background-repeat: no-repeat;
		background-size: contain;
		background-position: left; 
	}

/*-----Utilities-----*/
	/*.StretchDiv {
		display: inline-block;
		position: relative;
	}*/
	/*.Center-Width_50_Per {
		width: 50%;
		margin-left: 25%;
		margin-right: 25%;
	}*/
	#Scroll_Stopper {}
	.Circle {
		border-radius: 100%;
		overflow: hidden;
	}
	.Hide {
 		display: none !important;
 	}

 	.GHOST {
 		opacity: 0.01 !important;
 	}

	.Header_Padding {
		padding: 7px;
	}

	.Verticle_Break {
		display: block;
		float: left;
		position: absolute;
		height: .5px;
		width: 80px;
		transform: rotate(90deg);
		margin-top: 10%;
		margin-bottom: 10%;
		background-color: gray;

	}
	.Padding_Bottom_0 {
		padding-bottom: 0px !important;
	}
	.Padding_10 {
		padding: 10px;
	}
	.Padding_25 {
		padding: 25px;
	}
	.Padding_25_Flat {
		padding: 0 25px;
	}
	



/*-----Parent Divs-----*/
	.Homepage_Top_Div {
		display: inline-block;
		position: relative;
		float: left;
		width: 70%;
		/*height: var(--Homepage_Top_Banner);*/
		margin-top: 54px;
	}

	.contentNew_Projects{
	line-height: 
	}

	.Homepage_MainContent {
		display: flex;
		position: relative;
		float: left;
		margin-bottom: -50px;
		top: 0px;
		width: 100%;
	}


	.Div-Shadow {
		box-shadow: 0px 10px 15px black;
	}

	.Div-InnerShadow {
		box-shadow: inset 0px -70px 50px -50px #062c3d;
	}

	

	.Content_Holder {
		position: absolute;
		display: inline-block;
		width: 100%;
		margin-top: calc(var(--Homepage_Top_Banner)*1.2);
		z-index: 50;
	}
	.Info_Block_Content_Margin {
		margin: 5%;
		width: 90%;
		height: content;
	}

/*-----Block Divs-----*/
	.Homepage_TopBanner_Span_Div {
		display: inline-block;
		position: relative;
		float: left;
		width: 100%;
		height: calc(var(--Homepage_Top_Banner)*.5);
		margin-top: calc(var(--Homepage_Top_Banner)*.125);
		margin-bottom: calc(var(--Homepage_Top_Banner)*.125);
	}

	.Homepage_TopBanner_Welcome {
		position: absolute;
		width: 50%;
		left: 50%;
		height: 70%;
		top: 12%;
		display: block;
		justify-content: center;
		align-items: center;
	}

	.Span_80_per {
		width: 80%;
		margin-left: 10%;
	}
	.Span_Standard {
		width: 90%;
		margin-left: 5%;
	}

	.Div-Block_Graphic {
		width: 100%;
		height: 250px;
		object-fit: cover;	
	}
	.Div-Block_Graphic_Small_Faded {
		width: 100%;
		height: 250px;
		object-fit: cover;
	    -webkit-mask-image: -webkit-linear-gradient(rgba(0,0,0,1) 50%,  rgba(0,0,0,0) 100%);
	    mask-image: -o-linear-gradient(rgba(0,0,0,1) 50%,  rgba(0,0,0,0) 100%);
	    mask-image: linear-gradient(rgba(0,0,0,1) 50%,  rgba(0,0,0,0) 100%);
	}
	.Div-Block_Graphic_Wide {
		display: block;
		position: relative;
		/*width: calc(100% + 30px);
		left: -15px;*/
		width: 100%;
		object-fit: cover;	
	}
	.Content_Block {
		display: block;
		position: relative;
		width: calc(100% - 30px) !important;
		margin: 15px;
	}


/*-----Page Headers-----*/
.SubPage_Header {
	width: 50vw;
	height: content;
	margin-left: 2vw;
	margin-top: calc(var(--Menu-Height)* 1.25);
	margin-bottom: 25px;
	padding: 25px;

}
/*-----Div Content-----*/
	.Content_Table {
		display: inline-block;
	}
	.Weather {
		position: absolute;
		left: 0;
		width: 25%;
		top: var(--Menu-Height);
		height: var(--Homepage_Top_Banner);
		overflow: hidden;
	}

	.SocialMedia_Big {
		display: inline-block;
		position: relative;
		margin-bottom: 25px;
		margin-top: 25px;
		z-index: 50;
	}
	.SocialMedia_Small {
		display: none;
	}





/*EventTicket*/
	.Selection_Holder {
		width: 90%;
		margin: 0 5%;
		height: 1000px;
		
	}
	.Selection_Holder_v2 {
		width: content;
		height: 1000px;
		padding: 25px 0px;
		align-content: center;
		overflow-x: hidden;
	}
	
	/*.EventTicket_Holder_Tall:hover {
	}

	.Ticket_Grow {
		transform: scale(1.5);
	}
	.Ticket_Shrink {
		transform: scale(.5);
	}*/


	#TicketContent {
		width: 200%;
		background-color: teal;
		z-index: 500;
		height: 500px;
	}
	.TicketContent_Block{
		width: 50%;
		height: 100%;
		background-color: red;
		float: left;
	}
	.TicketContent_Block_Right{
		float: left;
		width: 50%;
		height: 100%;
		background-color: green;
	}
	#ContentRight {
		left:-100%;
	}





	.EventTicket_Image_Holder {
		
		top: 0;
		width: 100%;
		height: calc(var(--EventTicket-Height)*.3);
		object-fit: cover;
	}
	.EventTicket_Image_Holder_v2 {
		top: 0;
		width: 100%;
		object-fit: cover;
	}
	.EventTicket_Text_Holder {
		margin: 15px;
		height: calc(var(--EventTicket-Height)*.7 - 30px);
	}
	.EventTicket_Text_Holder_Tall {
		position: relative;
		margin: 15px;
		/*height: calc(var(--EventTicket-Height)*.7 - 30px);*/
	}
	.EventTicket_Text_Description {
		display: block;
		width: 65%;
		height: calc(var(--EventTicket-Height)*.7 - 30px);
		float: left;
		left: 0;
	}
	.EventTicket_Text_Description_Tall {
		display: block;
		width: 100%;
		height: calc(var(--EventTicket-Height)*.5 - 30px);
		float: left;
		left: 0;
	}
	.EventTicket_Links_Holder {
		width: 34%;
		height: calc(var(--EventTicket-Height)*.7);
		float: right;
	}
	.EventTicket_Links_Holder_Tall {
		width: 100%;
		height: calc(var(--EventTicket-Height)*.2);
		float: right;
		margin: 5px;
	}
	.EventTicket_Left_Cover {
		position: relative;
		top:-100%;
		width: 30%;
		height: 100%;
	}
	.EventTicket_Left_Cover_Text {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
	}
	.EventTicket_Left_Cover_Image {
		position: absolute;
		left: 0;
		height: 100%;
	}


/*-----Registration Link-----*/
.Registration {
	display: inline-block;
	position: relative;
	float: left;
	width: 80%;
	height: content;
	left: 10%;
	margin-top: 50px;
	margin-bottom: 25px;
}


/*-----Image Holders-----*/


	.SideImage {
		position: absolute;
		height: 100%;
		width: 100%;
		object-fit: cover;
		right: 0;
		top: 0;
		object-position: 100% 0%;
	}
	.Homepage_ADAC_MapIcon{
		width: 25vw;
	}
	.TopImage_Holder {
		width: 100%;
	}
	.TopImage {
		width: 100%;
	}
	.TopImage_LeftCorner {
		width: 30%;
	}
	.TopImage_Bubbles {
		background-image: url('../Media/2-Ready/2-Images/Homepage_TopImage_v1.4_Bubbles_Seamless.png');
		background-repeat: repeat-y;
		background-size: 1000px 524px;
		width: 1000px;
		height: 1920px;
		animation-name: Bubbles;
		animation-duration: 20s;
		animation-timing-function: linear;
		animation-iteration-count: infinite;
	}
	@keyframes Bubbles{
		0% {transform: translateY(0px);}
		100% {transform: translateY(-524px);}
	}

	.Content_Background_RightImage {
		display: inline-block;
		position: relative;
		float: right;
		right:0px;
		width: 150%;
		height: content;
		object-fit: cover;
		overflow-x: hidden;
		margin-bottom: -150px;
		z-index: 2;
	}

	.TopImage_Container {
		width: 100%;
		overflow-x: hidden;
	}
	.Video_Holder {
		position: relative;
		width: 100%;
		padding-bottom: 56.25%;
		height: 0;
	}
	.Video_Scale {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;	
	}
	.Content_L1 {
		display: inline-block;
		position: relative;
		height: content;
		padding: 10px;
	}
	.Div_Content_Holder {
		display: inline-block;
		position: relative;
		height: content;
		width: 100%;
		/*padding: 15px 2%;*/
		float: left;
	}
	.Static_Holder_520px {
		display: inline-block;
		position: relative;
		height: content;
		width: 520px;
		padding: 15px 2%;
		float: left;
	}
	.Div_Content_Holder_NoPadding {
		display: inline-block;
		position: relative;
		height: content;
		width: 96%;
		padding-left: 15px;
		padding-right: 15px;
		padding-bottom: 15px;
		float: left;
	}
	.Portrait_1_Per{
		display: block;
		width: 48%;
		padding: 1%;
		position: relative;
		height: content;
		float: left;
		opacity: 1;
	}
	.Portrait_2_Per{
		display: block;
		width: 48%;
		padding: 1%;
		position: relative;
		height: content;
		float: left;
		opacity: 1;
	}
	.Portrait_3_Per{
		display: block;
		width: 31.33%;
		padding: 1%;
		position: relative;
		height: content;
		/*overflow-x: hidden;*/
		float: left;
		opacity: 1;
	}
	.Portrait_4_Per{
		display: block;
		width: 23%;
		padding: 1%;
		position: relative;
		height: content;
		float: left;
		opacity: 1;
	}
	.Portrait_100_Per{
		position: absolute;
		display: block;
		width: 100%;
		height: 100%;
		opacity: 1;
	}
	.Portrait_Image_Holder{
		/*width: 100%;*/
		height: 250px;
		/*height: 100%;*/
		object-fit: cover;
	}
	.Portrait_Image_Holder_W{
		width: 100%;
		height: auto;
		object-fit: cover;
	}
	.Portrait_Name{
		position: absolute;
		bottom:0;
		width: 100%;
		height: content;
	}
	.Portrait_Name p {
		margin: 5px;
	}
	.Logo_Center {
		width: 100%;
		height: 100%;
		align-content: center;
		padding: 50px;
	}
	.Logo_Partner_Farm {
		position: relative;
		float: left;
	}
	.Logo_Partner_Holder_Full{
		height: 200px;
		object-fit: cover;
		margin: 5px 25px;
	}
	.Logo_Partner_Holder_Half{
		position: relative;
		height: 100px;
		padding-top: 40px;
		object-fit: cover;
		margin: 5px 25px;
	}

	.Resource_Page_Logo {
		width: 200px;
		float: left;
	}
	.Resource_Page_TitleBlock {
		width: calc(100% - 250px);
		margin: 25px;
		float: left;
	}

/*Basic Layout*/

	/*-------->>>>>>>>>>>>>*/
		body {
			height: auto;
			min-height: 80vh;
		}
		.Body {
			background-image: url("../../Media/2-Ready/2-Images/Site Background_v1.0.jpg");
			background-position: center center;
			background-repeat:  no-repeat;
			background-attachment: fixed;
			background-size:  cover;
			margin: 0px;
			padding: 0px;
			z-index: 99;
			top: -50px;
			margin: 15px;
			background-color: rgba(0,0,0,.1);
			display: block;
			overflow: auto;
		}




		.TopSlideShow {
			overflow: auto;
			display: block;
			position: relative;
			top: 70px;
			width: 75%;
			height: 500px;
			background-color: rgba(0,22,32,.5);
			margin: auto;
			margin-bottom: 15px;
			z-index: 51;
			border-radius: 7px;
		}

		.Project_Cycle {
			position: absolute;
			width: 80%;
			left: 10%;
			height: 90%;
			top: 0;
			color: blue;
			z-index: 900;
		}

		.Project-Chooser {
			width: 100%;
			height: 100%;
			float: left;
			background-color: red;
			overflow: hidden;
		}

		.Controls {
			z-index: 90;
		}

		.Index_Image {
			z-index: 70;
		}

	/* Spacing, Padding, and Margins -------->>>>>>>>>>>>>*/


		.Margin_10px{
			margin: 10px;
		}
		.Margin_20px{
			margin: 20px;
		}
		.Margin_Offset_20px{
			margin: 10px 0px 5px 20px;
		}
		.Margin_Top{
			height: var(--Menu-Height);
		}
		
		.DividingLine {
			display: inline-block;
			position: relative;
			height: 1px;
			width: 100%;
			background-color: gray;
			margin-top: 5px;
		}
		.PaddingDiv {
			position: relative;
			width: 100%;
			height: 25px;
			float: left;
		}
		.PaddingNormal {
			padding: 2vw;
		}
		.PaddingSmall {
			padding: 1vw;
		}
		.RoundCorners {
			border-radius: 15px;
			overflow: hidden;
		}
		.RoundSitLeft {
			border-radius: 0 7px 7px 0;
		}
		.RoundSitRight {
			border-radius: 7px 0 0 7px;
		}

		.DropShadow {
			text-shadow: 0px 2px 2px black;
		}

/*-----Screen Scaling-----*/
	@media (max-width:1800px) {
		:root {
			--Gallery-Height: 450px;
		}
		.Background_Extend-1 {
			display: block;
		}
	}
	@media (max-width:1400px) {
		:root {
			--Gallery-Height: 375px;
		}
	}
	@media (max-width:1200px) {
		:root {
			--Gallery-Height: 300px;
		}
		.Background_Extend-2 {
			display: block;
		}
		.Portrait_Image_Holder{
			height: 180px;
		}
		.SocialMedia_Big {
			display: none;
		}
		.SocialMedia_Small {
			display: inline-block;
			position: relative;
			margin-bottom: 25px;
			margin-top: 25px;
			z-index: 50;
		}
		.ColumnLayout_2 {
			width: 100%;
			left: 0%;
		}
		.ColumnLayout_2_Margin {
			width: 95%;
			margin: 0 2.5%;
		}
		.ColumnLayout_2_Big_L {
			width: 100%;
			left: 0%;
		}
		.ColumnLayout_2_Small_R {
			width: 100%;
			left: 0%;
		}
		.Content_Background_RightImage {
			display: none;
		}
		.Width_80_Per_Center {
			width: 40%;
			margin: 5%;
		}
		.Width_90_Per_Center {
			width: 95%;
			margin: 2.5%;
		}
		
	}

	@media (max-width:950px) {
		.Background_Extend-3 {
			display: block;
		}
		.Portrait_3_Per{
			width: 90%;
			padding: 10px 0 10px 5%;
		}
		.Content_Holder {
			position: absolute;
			display: inline-block;
			width: 100%;
			margin-top: calc(var(--Homepage_Top_Banner)*1.7);
			z-index: 50;
		}
		.ColumnLayout_3_Margin {
			width: 100%;
			left: 0%;
		}
		.ColumnLayout_3_Margin_Line {
			width: 100%;
			left: 0%;
			border-left: 0px none white;
			border-top: 1px solid white;
		}
		
	}
	@media (max-width:800px) {
		:root {
			--Gallery-Height: 200px;
		}
		
		.Portrait_Image_Holder{
			height: 100px;
		}
	}
	
	@media (max-width:700px) {
		:root {
			--Gallery-Height: 150px;
		}
		.ColumnLayout_EducationContent {
			width: 85%;
			left: 19%;
			padding: 2%;
		}
		.TopImage_Holder {
			width: 1000px;
			right: 0;
		}
		.Content_Background_RightImage {
			display: none;
		}
		.Div-Block_Graphic {
			width: 100%;
			height: 200px;
			object-fit: cover;
		}
		
		.Width_80_Per_Center {
			width: 80%;
			margin: 10%;
		}
		.Content_Holder {
			position: absolute;
			display: inline-block;
			width: 100%;
			margin-top: calc(var(--Homepage_Top_Banner)*1.1);
			z-index: 50;
		}
		.Homepage_TopBanner_Welcome {
			width: 75%;
			left: 5%;
			height: 70%;
			top: 12%;
			display: block;
			justify-content: center;
			align-items: center;
		}
		.ColumnLayout {
			display: inline-block;
			position: relative;
			float: left;
			width: 100%;
			left: 0%;
		}	
		.Width_80_Per {
			width: 80%;
		}
		.Width_90_Per {
			width: 90%;
		}
		.Width_100_Per {
			width: 80%;
		}
		.Homepage_ADAC_MapIcon{
			width: 30vw;
		}
		

		.Info_Block {
			display: inline-block;
			position: relative;
			margin-bottom: 25px;
			margin-top: 25px;
			z-index: 50;
		}

		.IB_Left-Center {
			float: left;
			left: 10%;
		}
		.IB_Left-Edge {
			float: left;
			left: 10%;
		}
		.IB_Right-Center {
			float: right;
			right: 10%;
		}
		.IB_Right-Edge {
			float: right;
			right: 10%;
		}
		.Info_Block h2{
			padding: 15px;
		}
		.Info_Block p{
			padding-left: 15px;
			padding-right: 15px;
			padding-bottom: 15px;
		}
		.Portrait_Image_Holder{
			height: 150px;
		}
		.SubPage_Header {
			width: 96%;
			margin-left: 2%;
			margin-top: 25px;
			margin-bottom: 25px;
		}
	}

/*-----Old Divs-----*/
	/*.CornerImage_Holder {
		width: 100%;
		height: var(--Homepage_Top_Banner);
		position: absolute;
		left: 0;
		top: 0;
		z-index: 500;
	}

	.CornerImage_Left_Holder{
		position: absolute;
		left: 0;
		height: 100%;
		width: 800px;
	}

	.CornerImage_Left {
		position: absolute;
		right: 0;
		clip-path: polygon(80% 0%, 100% 50%, 80% 100%, 0 100%, 0 0);
		opacity: .5;
	}
	.CornerImage_Left_Solid {
		position: absolute;
		right: 0;
		display: block;
		clip-path: polygon(80% 0%, 94% 35%, 60% 100%, 0 100%, 0 0);
		opacity: 1;
	}

	.CornerImage_Right_Holder{
		position: absolute;
		right: 0;
		height: 100%;
		width: 800px;
	}

	.CornerImage_Right {
		position: absolute;
		left: 0;
		clip-path: polygon(20% 100%, 0% 50%, 20% 0%, 100% 0%, 100% 100%);
		opacity: .5;
	}
	.CornerImage_Right_Solid {
		position: absolute;
		left: 0;
		clip-path: polygon(20% 0%, 6% 35%, 40% 100%, 100% 100%, 100% 0%);
		opacity: 1;
	}

	.Ghost_Image {
		position: absolute;
		display: block;
		opacity: .25;
		bottom: 0;
		z-index: 1;
	}

	.Edge_Top {
		display: block;
		position: absolute;
		width: 100%;
		bottom: 0;
		z-index: 500;
	}
	*/




/*////////////////////////////////////////////////////////////////*/

/*-----Save for Other Pages-----*/

/*////////////////////////////////////////////////////////////////*/









	/*Textures*/
	.Snow_Top-Texture{
		position: absolute;
		top:-10px;
		left: 0;
		width: 100%;
		z-index: 51;
	}

	/*Icons*/

	.Section_Homepage-Top {
		display: inline-block;
		position: relative;
		/*background-color: rgba(255,0,0,.25);*/
		width: 80%;
		left: 10%;
		height: 200px;
		margin-top: 5px;
		margin-bottom: 5px;
		padding: 10px;
		top:70px;
	}

	.Section_Homepage-ADAC-Projects {
		display: inline-block;
		position: relative;
		background-color: #9c9c9c;
		width: 80%;
		left: 10%;
		height: 150px;
		margin-top: 5px;
		margin-bottom: 5px;
		padding: 10px;
		top:70px;
	}

	.Project_Selection {
		display: block;
		position: relative;
		width: 80%;
		left: 10%;
		margin-top: 5px;
		margin-bottom: 5px;
		padding: 50px;
		top:70px;
		background-color: purple;
	}

	.Project-Icon_Holder {
	  background-color: red;
	  white-space: nowrap;
	  display: inline-flex;
	  overflow: hidden;
	  flex-direction: row;
	  width: 50px;
	  height: 50px;
	}

	.Project-Icon {
		width: 100px;	
		height: auto;
		margin: 10%;
		background-color: green;
	}






@media only screen and (min-width: 2000px) {
    /* for sumo sized (mac) screens */
}
@media only screen and (max-device-width: 480px) {
   /* styles for mobile browsers smaller than 480px; (iPhone) */
	
}
@media only screen and (device-width: 768px) {
   /* default iPad screens */

}
@media only screen and (min-device-width: 100px) and (max-device-width: 480px)	{

}
/* different techniques for iPad screening */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */

}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */

}