* {
			box-sizing: border-box;
			}
			
			body{
                background-color:black;
            }
            
			.info{
				width: 1024px;
                margin-left: auto;
                margin-right: auto;
			}
			a:link{
				text-decoration: none; 
			}
			
			.info-animate-opacity{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}}
			.info-animate-bottom{position:relative;animation:animatebottom 0.4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
			
			.info-text{
				color:#e5e5e5;
				font-size: 16pt;
				font-family: "Roboto", sans-serif;
				font-weight: 300;
				font-style: normal;
			}
			.info-text a:active {
				color:#007eff;
				font-style: normal;
			}
			.info-text a:visited {
				color:#007eff;
				font-style: normal;
			}
			.sign{
					text-align:right;
					color:#00fe42;
				}
			
			@media only screen and (min-width: 768px) {
				.flex-container {
					display: flex;
					flex-direction: row;
					font-size: 30px;
					text-align: left;
					justify-content: center;
				}
				.info-text{
					padding: 10px;
					font-size: 14pt;
					order: 1;
					padding-top:5%;
					width:25%;
					text-align:justify;
				}
				.info-avatar{
					padding: 10px;
					width:25%;
					order: 2;
				}
				.info-avatar img{
					width:100%;
				}
				
			}

			/*tablet*/
			@media only screen and (min-width: 600px) {

			}

			/*Phone*/
			@media only screen and (max-width: 600px) {
				.flex-container {
					display: flex;
					flex-direction: column;
					font-size: 30px;
					text-align: left;
					justify-content: center;
				}
				.info-text{
					padding-left: 20px;
					padding-right: 20px;
					font-size: 14pt;
					order: 2;
					width:100%;
					padding-top:50px;
					text-align:justify;
				}
				.info-avatar{
					padding: 10px;
					width:100%;
					order: 1;
					text-align:center;
				}
				.info-avatar img{
					width:90%;
				}
				

			}