body{
	margin: 0;
	padding: 0;
	overflow: hidden;
	font-family: 'Open Sans', sans-serif;
}
#arrow-up{
	position: absolute;
	z-index: 7;
	color: white;
	font-size: 50px;
	margin: 25vh 1vh 0 85vw;
	cursor: pointer;
}
#slidecounter{
	position: absolute;
	z-index: 8;
	color: white;
	font-size: 10px;
	margin: 45vh 1vh 0 85.5vw;
}
#arrow-down{
	position: absolute;
	z-index: 7;
	color: white;
	font-size: 50px;
	margin: 63vh 1vh 0 85vw;
	cursor: pointer;
}
.no-display{
	display: none;
}
#info-panel{
	position: absolute;
	z-index: 5;
	height: 55vh;
	width: 50vw;
	background-color: #024856;
	margin: 20vh 0 0 40vw;
	border-radius: 20px;
}
#info-panel #content{
	height: 53vh;
	margin: 2vh 9vw 2vh 15vw;
	overflow-y: scroll;
	overflow-x: hidden;
	scrollbar-width: none;
}
#content::-webkit-scrollbar { 
  	display: none;
}
#info-panel #content .content-inside{
	height: 53vh;
	color: white;
}
#info-panel #content .content-inside h2{
	margin: 0;
	padding: 0;
}
a{
	color: #d1a568;
	text-decoration: none;
}
a:hover{
	color: #d1a568;
	text-decoration: none;
}
#con-1 p{
	font-size: 15px;
}
#con-1 img{
    float: right;
    max-width: 150px;
    margin: 3px;
}
#con-2 p{
	font-size: 13px;
}
#con-2 p i{
	font-size: 15px;
}
#con-3 p{
	font-size: 12px;
}
#con-3 p i{
	font-size: 14px;
}
#con-3 img{
    float: left;
    max-width: 150px;
    margin: 15px 5px 5px 0;
}
#con-4 p{
	font-size: 14px;
}
#con-4 img{
    float: right;
    max-width: 200px;
    margin: 15px 5px 5px 5px;
}
#con-5 p{
	font-size: 12px;
}
#con-5 li{
	font-size: 11px;
}
#con-5 img{
    float: right;
    max-width: 100px;
    margin: 15px 5px 25px 5px;
}
#profile-pic{
	position: absolute;
	z-index: 6;
	margin: 15vh 0 0 24vw;
	height: 100vh;
}
#profile-pic img{
	width: 60vh;
	height: 60vh;
}
#left-panel{
	margin-left: 10vw;
	width: 40vw;
	height: 100vh;
	background-color: #b6d8c9;
	position: absolute;
	z-index: 1;
}
#contact-text{
	color: #AF843D;
	padding-left: 10vw;
	position: absolute;
	z-index: 11;
	bottom: 10vh;
}
#contact-text ul {
	list-style-type: none;
}
#contact-text a{
	color: #AF843D;
	text-decoration: none;
}
#contact-text a:hover{
	text-decoration: none;
}
#slidelogo{
	height: 40vh;
	width: 27.5vh;
}
.inside-about-text{
    padding: 50px;
}

@media (max-width: 1550px){
    #profile-pic{
	margin: 15vh 0 0 20vw;
    }
    #info-panel #content{
	margin: 2vh 9vw 2vh 14vw;
    }
}
@media (max-width: 1415px){
    #profile-pic{
	margin: 15vh 0 0 18vw;
    }
    #info-panel #content{
	margin: 2vh 9vw 2vh 13vw;
    }
    #con-5 li{
	font-size: 12px;
    }
}
@media (max-width: 1332px){
    #profile-pic{
	margin: 15vh 0 0 15vw;
    }
    #info-panel #content{
	margin: 2vh 9vw 2vh 12vw;
    }
}
@media (max-width: 1245px){
    #profile-pic{
	margin: 15vh 0 0 12vw;
    }
    #info-panel #content{
	margin: 2vh 9vw 2vh 11vw;
    }
}
@media (max-width: 1210px){
    #profile-pic{
	margin: 15vh 0 0 8vw;
    }
    #info-panel #content{
	margin: 2vh 9vw 2vh 10vw;
    }
}
@media (max-width: 1120px){
    #profile-pic{
	margin: 15vh 0 0 6vw;
        z-index: 2;
    }
    #info-panel #content{
	margin: 2vh 9vw 2vh 5vw;
    }
}
@media (max-width: 1020px){
    #profile-pic{
	margin: 15vh 0 0 6vw;
        z-index: 2;
    }
    #info-panel #content{
	margin: 2vh 9vw 2vh 5vw;
    }
    #con-1 img{
        max-width: 120px;
    }
    #con-4 img{
        max-width: 120px;
    }
}
@media (max-width: 1020px){
    #profile-pic{
	margin: 15vh 0 0 0;
        z-index: 2;
    }
    #info-panel #content{
	margin: 2vh 9vw 2vh 5vw;
    }
    #info-panel{
        width: 60vw;
        margin: 20vh 0 0 35vw;
    }
    #con-1 img{
        max-width: 120px;
    }
    #con-4 img{
        max-width: 120px;
    }
    #arrow-up{
	margin: 25vh 1vh 0 89vw;
    }
    #slidecounter{
        margin: 45vh 1vh 0 89.5vw;
    }
    #arrow-down{
        margin: 63vh 1vh 0 89vw;
    }
}
@media (max-width: 900px){
    #info-panel #content{
	margin: 2vh 9vw 2vh 3vw;
    }
}
@media (max-width: 780px){
    #profile-pic{
	margin: 15vh 0 0 -15vw;
    }
    #info-panel{
        width: 70vw;
        margin: 20vh 0 0 25vw;
    }
}
@media (max-width: 700px){
    #profile-pic{
	margin: 15vh 0 0 -20vw;
    }
    #info-panel{
        width: 75vw;
    }
    #arrow-up{
	margin: 25vh 1vh 0 93vw;
    }
    #slidecounter{
        margin: 45vh 1vh 0 93.5vw;
    }
    #arrow-down{
        margin: 63vh 1vh 0 93vw;
    }
}
@media (max-width: 600px){
    #profile-pic{
	margin: 15vh 0 0 -30vw;
    }
    #info-panel{
        width: 80vw;
        margin: 20vh 0 0 15vw;
    }
    #arrow-up{
	margin: 25vh 1vh 0 87vw;
    }
    #slidecounter{
        margin: 45vh 1vh 0 87.5vw;
    }
    #arrow-down{
        margin: 63vh 1vh 0 87vw;
    }
}
@media (max-width: 530px){
    #profile-pic{
	margin: 15vh 0 0 -40vw;
    }
    .inside-about-text{
        padding: 30px;
    }
}
@media (max-width: 450px){
    #arrow-up{
	margin: 25vh 1vh 0 86vw;
    }
    #slidecounter{
        margin: 45vh 1vh 0 86.5vw;
    }
    #arrow-down{
        margin: 63vh 1vh 0 86vw;
    }
}
@media (max-width: 450px){
    h2{
        font-size: 16px;
    }
}
@media (max-width: 430px){
    #profile-pic{
	margin: 15vh 0 0 -50vw;
    }
    .inside-about-text{
        padding: 20px;
    }
}

@media (orientation: portrait){
    @media (max-width: 1400px){
        #profile-pic{
            margin: 15vh 0 0 -20vw;
        }
        #info-panel #content{
            margin: 2vh 9vw 2vh 4vw;
        }
        #info-panel{
            width: 65vw;
            margin: 20vh 0 0 25vw;
        }
    }
    @media (max-width: 1100px){
        #profile-pic{
            margin: 15vh 0 0 -20vw;
        }
        #info-panel #content{
            margin: 2vh 9vw 2vh 4vw;
        }
        #info-panel{
            width: 70vw;
            margin: 20vh 0 0 25vw;
        }
    }
    @media (max-width: 1000px){
        #profile-pic{
            margin: 15vh 0 0 -60vw;
        }
        #info-panel #content{
            margin: 2vh 9vw 2vh 4vw;
        }
        #info-panel{
            width: 93vw;
            margin: 20vh 0 0 7vw;
        }
        #info-panel #content{
            margin: 2vh 13vw 2vh 4vw;
        }
        .inside-about-text{
        	padding: 0px;
        }
        #con-5 img{
            margin: -20px 5px 0 5px;
        }
        #arrow-up{
			margin: 25vh 1vh 0 88vw;
        }
        #slidecounter{
            margin: 45vh 1vh 0 88.5vw;
        }
        #arrow-down{
            margin: 63vh 1vh 0 88vw;
        }
    }
    @media (max-height: 700px){
        #con-1 p{
            font-size: 13px;
        }
        #con-3 p{
                font-size: 10px;
        }
        #con-4 p{
                font-size: 14px;
        }
        #con-4 img{
            max-width: 100px;
        }
        #con-5 li{
            font-size: 11px;
        }
        .inside-about-text{
            padding: -10px;
            font-size: 10px;
        }
        #con-5 p{
                font-size: 11px;
        }
        #con-5 img{
            margin: -40px 5px 0 5px;
        }
    }
    @media (max-height: 650px){
        #con-1 p{
            font-size: 13px;
        }
        #con-3 p{
                font-size: 10px;
        }
        #con-3 img{
            max-width: 100px;
        }
        #con-4 p{
                font-size: 12px;
        }
        #contact-text{
            bottom: 3vh;
        }
        #info-panel{
            height: 72vh;
            margin: 8vh 0 0 7vw;
        }
        #info-panel #content{
            margin: 2vh 13vw 2.5vw 4vw;
            height: 67vh;
        }
        #info-panel #content .content-inside{
            height: 67vh;
        }
        #arrow-up{
            margin: 22vh 1vh 0 88vw;
        }
        #slidecounter{
            margin: 42vh 1vh 0 88.5vw;
        }
        #arrow-down{
            margin: 60vh 1vh 0 88vw;
        }
    }
}