@import url('https://fonts.googleapis.com/css?family=Nunito:400,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Lato:400,700&display=swap');

:root {
	/* Color */
	--clr-blue: #6AC9F2;
	--clr-black: #202020;
	/* Font */
	--font-nunito: 'Nunito', sans-serif;
	--font-lato: 'Lato', sans-serif;
	/* Dekstop Text */
	--txt-headline: normal bold 40px/48px var(--font-nunito);
	--txt-title: normal normal 24px/40px var(--font-nunito);
	--txt-subtitle: normal normal 18px/28px var(--font-lato);
	--txt-callout: normal bold 16px/19px var(--font-lato);
	--txt-body: normal normal 16px/28px var(--font-lato);
}

@font-face {
	font-family: 'Glyphicons Halflings';
	src: url('http://netdna.bootstrapcdn.com/bootstrap/3.0.3/fonts/glyphicons-halflings-regular.eot');
	src: url('http://netdna.bootstrapcdn.com/bootstrap/3.0.3/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('http://netdna.bootstrapcdn.com/bootstrap/3.0.3/fonts/glyphicons-halflings-regular.woff') format('woff'), url('http://netdna.bootstrapcdn.com/bootstrap/3.0.3/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('http://netdna.bootstrapcdn.com/bootstrap/3.0.3/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}


body {
	background: linear-gradient(to left, #dd2476, #ff512f);
}

@media (min-width: 993px) {
	.img-vector {
		width: 500px;
		padding-right: 50px;
	}

	section.intro .container {
		padding: 8.125rem 1rem;
	}
}

@media (min-width: 769px) and (max-width:992px) {
	.img-vector {
		width: 400px;
		padding-right: 50px;
	}

	section.intro .container {
		padding: 8.125rem 1rem;
	}
}

@media (min-width: 577px) and (max-width:768px) {
	.img-vector {
		width: 300px;
		padding-bottom: 2rem;
	}

	.btn-hireme, .btn-seecv {
		width: 100%;
	}

	.col-hire, .col-cv {
		padding-top: .5rem;
		padding-bottom: .5rem;
	}

	section.intro .container {
		padding: 8.125rem 1rem;
	}
}

@media (min-width: 361px) and (max-width:576px) {
	.img-vector {
		width: 300px;
		padding-bottom: 2rem;
	}

	.btn-hireme, .btn-seecv {
		width: 100%;
	}

	.col-hire, .col-cv {
		padding-top: .5rem;
		padding-bottom: .5rem;
	}

	section.intro .container {
		padding: 4rem 1rem!important;
	}
}

@media (max-width:360px) {
	.img-vector {
		width: 300px;
	}
}

.footer-dark {
	background: white!important;
}

.footer-dark p {
	color: #ff512f;
	opacity: 0.8!important;
}

.separator-hr-orange {
	background-color: #ff512f;
	height: 1px;
	width: 35px;
}



section.intro strong {
	font-size: 3rem;
	color: white!important;
}

.sticky {
	position: fixed;
	top: 0;
	width: 100%;
}

@-webkit-keyframes fadein-down {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-20px);
	}
	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@keyframes fadein-down {
	0% {
		opacity: 0;
		transform: translateY(-20px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.fadein-down {
	-webkit-animation-name: fadein-down;
	animation-name: fadein-down;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

/* Components - Card */

.card {
	box-shadow: 0px 8px 16px rgba(201, 216, 223, 0.32);
	position: relative;
	margin-bottom: 1.5rem;
	width: 100%;
	transition: .3s width ease-in-out;
}

.card-header {
	background: transparent;
	border-bottom: 0;
	padding-top: 1rem;
	padding-bottom: 1rem;
	cursor: pointer;
}

/* Component - Text */

.port-text-title {
	font: var(--txt-title);
	color: var(--clr-black);
}

.port-text-subtitle {
	font: var(--txt-subtitle);
	color: var(--clr-black);
}

.port-text-callout {
	font: var(--txt-callout);
	color: var(--clr-black);
}

.port-text-body {
	font: var(--txt-body);
	color: var(--clr-black);
}

p {
	margin-bottom: unset;
	color: var(--clr-black)!important;
}

.menu-bottom-list {
	text-align: center;
	display: flex;
	flex-direction: unset;
}

.menu-bottom-list .list-group-item:last-child {
	border-radius: unset;
}

.menu-bottom-list a {
	font: var(--txt-callout);
	color: var(--clr-black);
}

.menu-bottom-list .list-group-item {
	background-color: unset;
	border: unset;
	margin-bottom: unset;
}

.menu-bottom-list .active {
	color: var(--clr-blue);
	border-bottom: 2px solid var(--clr-blue);
}

.btn-hireme, .btn-seecv {
	border-radius: 2rem;
}

.btn-seecv:hover {
	background-color: rgba(0, 0, 0, 0.040)
}

.skill-icon {
	height: 6rem;
}

/* Component - Navbar */

.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link {
	font-weight: 600;
}

section.intro, section nav li a{
	color: white!important;
}

.nav-dark {
	background: linear-gradient(to left, #dd2476, #ff512f);
}