@charset "UTF-8";
/* CSS Document */
html,body {width:100vw; height: 100vh; margin: 0; color: white!important;}
body {background-color: black!important; font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"!important; color: white;}
/*.xx{float: left;}*/
.social-icons {
    padding: 0;
    list-style: none;
    display: flex;
	text-align: center;
}

.social-icons li {
    margin: 0px;
	width: 20%;
	color: white;
}

.social-icons li a {
    border: 1px solid rgba(242,120,75,1.00);
    height: 15px;
    width: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: white;
    border-radius: 50%;
    border-right: none;
    border-top: none;
    transition: 0.3s ease;
    margin: 0px auto;
}

.social-icons li a:hover {
    border-top: 3px solid;
    border-right: 3px solid;
    transform: rotate(360deg);
    background-color: coral;
    border-color: white;
}
#soc{position: relative;
    float: inherit;
    text-align: center;
    padding: 10px 0px;    
	max-width: 600px;
    margin: 0px auto;
}
.tktk{
	width:15px;
}
.lgo{
	max-width: 800px;
	width: 100%;
	display: block;
    margin-left: auto;
    margin-right: auto;
}
#footer{
	position: fixed;
    bottom: 0px;
	left: 0px;
    width: 100%;
	height: 60px;
    text-align: center;
    padding: 10px 0px;
    margin: 0px auto;
	background-color: black;
}
.scap{font-variant: all-small-caps;}
.intro{
	padding: 0% 10%!important;
	margin-bottom: 120px!important;
    letter-spacing: 1px;
	text-align:left;
}
.mt-5 {
    margin-top: 2rem!important;
}
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
	.social-icons li a {
    height: 25px;
    width: 25px;
	}
		.tktk{
	width:20px;
}
	.lgo{
	width: 500px;
}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {	
.intro{
	padding: 0px!important;
}
	.lgo{
	width: 700px;
}
	.intro{
	padding: 0% 10%!important;
	margin-bottom: 120px!important;
    letter-spacing: 1px;
	text-align: center;
}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.lgo{
	width: 800px;
}
	.tktk{
	width:20px;
}
}
@media (orientation: landscape) and (max-width: 896px) {
#soc{max-width: 600px;position: relative; float: inherit;}
.lgo{
	width: 360px;
}
}
@media (orientation: landscape) and (max-width: 654px) {
#soc{max-width: 600px;position: relative; float: inherit;}
.lgo{
	width: 260px;
}
	.intro{
    padding: 0% 5%!important;
    font-size: 12px;
	}
	#footer {
    height: 50px;
    padding: 5px 0px;
	}
}
@media (max-aspect-ratio: 16/9) and (min-width: 992px) {
#soc{max-width: 600px;position: relative; float: inherit;}
.lgo{
	width: 600px;
}
}