/*==========  Desktop First Method  ==========*/


/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
	
	/*Disable Animation on Mobile Devices*/
	.animated {
		/*CSS transitions*/
		-o-transition-property: none !important;
		-moz-transition-property: none !important;
		-ms-transition-property: none !important;
		-webkit-transition-property: none !important;
		transition-property: none !important;
		/*CSS transforms*/
		-o-transform: none !important;
		-moz-transform: none !important;
		-ms-transform: none !important;
		-webkit-transform: none !important;
		transform: none !important;
		/*CSS animations*/
		-webkit-animation: none !important;
		-moz-animation: none !important;
		-o-animation: none !important;
		-ms-animation: none !important;
		animation: none !important;
	}

}
/*==========  Desktop First Method  ==========*/

main>div.text h1 {
	font-size: 5em;
	margin-top: 2em;
}

@media screen and (orientation:portrait) {
	main {
		display: flex;
		flex-direction: column;
		color: black;
		align-items: center;
		padding: 30px;
		flex-wrap: nowrap;
		justify-content: center;
		align-content: space-around;
	}
	.landscape {
		display: none;
	}
	.portrait img {
		/* width: 100%; */
	}
 p.manual>a {
  margin-top: unset;
}
	.portrait {
		display: flex;
		font-size: 2.6em;
		margin-bottom: 0;
		margin-top: 0;
		/* flex: 1 1 auto; */
	}

	main>div {
		display: block;
		position: relative;
		height: 70%;
		width: 100%;
		text-align: center;
		/* flex: 2; */
	}
.prod{
	
		flex-grow: 1;
  flex-shrink: 2;
  flex-basis: auto;
}
	main>div.text h1 {
		font-size: 12vw;
		margin: 0.3em 0 0 0;
	}
}

@media screen and (orientation:landscape) {
	main {
		color: black;
		flex-direction: row;
	}

	.landscape {
		display: flex;
		font-size: 1.4em;
	}

	.portrait {
		display: none;
	}
	main>div.text h1 {
		font-size: 6vw;
		margin: 0;
	}

	main>div.text {
		height: 100%;
		width: 50%;
		padding-left: 60px;
		align-items: center;
		justify-content: center;
	}

	main>div.prod {
		height: 100%;
		width: 50%;
	}

	main>div.prod {
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		align-content: center;
		justify-content: center;
		align-items: center;
	}
}