@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300&family=Titillium+Web:wght@300;600;700&display=swap');
::-moz-selection { /* Code for Firefox */
	background: rgba(63,73,117,.8);
	color: #CFD8DC;
	text-shadow: none !important;
}
::selection {
	background: rgba(63,73,117,.8);
	color: #CFD8DC;
	text-shadow: none !important;
}
/* BODY */
html{
  font-size: 16px;
}
html,
body,
body > div{
  height: 100%;
	position: relative;
}
body{
  background-color: #141f2d;
  color: #CFD8DC;
  font-family: 'Kanit', sans-serif;
  font-size: 1rem;
  font-weight: 300;
  overflow-y: scroll;
}
.div-100{
  height: 100%;
}
.section-content{
  padding-bottom: 6rem;
  padding-top: 6rem;
}
.over-particles{
  position: relative;
  z-index: 2;
}
.col-email-contact .list-group,
.col-social-contact .list-group{
  padding-bottom: 18px;
  position: relative;
}
.col-email-contact .list-group:after,
.col-social-contact .list-group:after{
  border-left: 1px solid #0097A7;
  bottom: 0;
  content: "";
  height: 18px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  width: 1px;
}
.col-email-contact .list-group-item,
.col-social-contact .list-group-item{
  background-color: transparent;
  border: none;
}
.col-social-contact .list-group-item{
	padding: 0;
}
.col-social-contact .list-group-item a{
	display: block;
	padding: .5rem;
}
.col-email-contact,
.col-social-contact{
	bottom: 0;
  left: 0;
  text-align: center;
  position: fixed;
  z-index: 2;
}
.col-social-contact{
  left: auto;
  right: 0;
}
.col-email-contact .email-contact{
  color: #B0BEC5;
  display: block;
  font-family: 'Titillium Web', sans-serif;
  font-weight: 300;
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	padding-left: 1rem;
	position: relative;
}
hr{
	background: rgba(69, 90, 100, .3);
	opacity: 1;
}
.prev-section{
	margin-bottom: 1rem;
}
.next-section{
	margin-top: 1rem;
}
#work .next-section{
	margin-top: 2rem;
}
#sections-content{
	position: relative;
}
/* / BODY */
/* TEXT */
h1,
h2.main-title{
  color: #00BCD4;
  font-family: 'Titillium Web', sans-serif;
  font-size: 5.25rem;
  font-weight: 700;
  line-height: 1;
  margin: 0 0 3rem;
  text-transform: uppercase;
}
h2.main-title{
	display: inline-block;
}
.text-outline{
  color: #141f2d;
  text-shadow: -1px -1px 0 #B0BEC5, 1px -1px 0 #B0BEC5, -1px 1px 0 #B0BEC5, 1px 1px 0 #B0BEC5;
}
.text-filled{
  color: #ECEFF1;
}
h3,h4,h5,h6{
  font-family: 'Titillium Web', sans-serif;
  font-weight: 600;
	margin-bottom: 1.5rem;
}
h3{
  color: #CFD8DC;
  font-size: 1.5rem;
}
h3.subtitle{
	color: #00BCD4;
	font-size: 2rem;
	font-weight: 600;
	text-transform: uppercase;
}
h4,
.accordion-button{
  color: #B0BEC5;
  font-size: 1.3125rem;
}
h5{
  color: #B0BEC5;
  font-size: 1.125rem;
}
p{
  color: #CFD8DC;
  font-family: 'Kanit', sans-serif;
  font-weight: 300;
  font-size: 1rem;
	margin-bottom: 1.5rem;
}
.text-important{
  font-size: 1.3125rem;
}
.text-highlighted{
  color: #00BCD4;
  font-style: italic;
}
.text-highlighted-2{
  color: #0097A7;
  font-style: normal;
}
.extra-big-text{
	font-size: 12rem;
}
.icon-default{
  color: #B0BEC5;
}
.readless{
	display: none;
}
.readless::before{
	content: "...";
}
.readmore{
	display: inline;
	margin: 0;
}
.readmore::before{
	color: #CFD8DC;
	content: "...";
	font-family: 'Kanit', sans-serif;
	font-weight: 300;
}
/* / TEXT */
/* BUTTONS & LINKS */
a{
  color: #FBC02D;
  font-family: 'Titillium Web', sans-serif;
  font-weight: 600;
  text-decoration: none;
}
a.a-secundary{
	font-weight: 300;
}
a:hover,
.btn-link:hover{
    color: #F9A825;
}
.btn{
  border-radius: 12px!important;
  font-family: 'Titillium Web', sans-serif;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.btn.btn-lg{
	border-radius: 1.125rem;
}
.btn-primary {
  background-color: #FBC02D;
  border-color: #FBC02D;
  color: #141f2d;
}
.btn-outline-primary {
  color: #CFD8DC;
  border-color: #FBC02D;
}
.btn-link{
  color: #FBC02D;
  text-decoration: none;
}
.btn-primary:hover,
.btn-outline-primary:hover,
.btn-check:focus+.btn-primary,
.btn-primary:focus,
.btn-outline-primary:focus{
  background-color: #F9A825;
  border-color: #F9A825;
	box-shadow: none;
  color: #141f2d;
}
.btn-primary.disabled,
.btn-primary:disabled,
.btn-outline-primary.disabled,
.btn-outline-primary:disabled{
  background-color: #37474F;
  border-color: #37474F;
  color: #607D8B;
}
.prev-section span{
  display: inline-block;
  margin-bottom: 1.125rem;
  padding-right: 108px;
  position: relative;
}
.next-section span{
  display: inline-block;
  margin-top: 1.125rem;
  padding-left: 108px;
  position: relative;
}
.prev-section span::before,
.next-section span::before{
  background-color: #607D8B;
  bottom: 0;
  content: "";
  height: 1px;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  width: 96px;
}
.prev-section span::before{
  left: auto;
  right: 0;
}
.btn-close{
	background-image: none;
	height: 36px;
	opacity: 1;
	padding: 0 !important;
	width: 36px;
}
.btn-close::before{
	color: #FBC02D;
	content: "\f00d";
	font-family: "Font Awesome 5 Free";
	font-size: 1.5rem;
	font-weight: 900;
}
/* / BUTTONS & LINKS */
/* FORM */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: none;
	border-bottom: 1px solid #FBC02D;
  -webkit-text-fill-color: #B0BEC5;
  -webkit-box-shadow: 0 0 0px 1000px rgba(33,58,87,1) inset;
  transition: background-color 5000s ease-in-out 0s;
}
.form-control {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-clip: padding-box;
  background-color: rgba(33,58,87,.1) !important;
  backdrop-filter: blur(3px);
  border-radius: 0;
  border: none;
  border-bottom: 1px solid #FBC02D;
  color: #B0BEC5;
  display: block;
  font-family: 'Kanit', sans-serif;
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.5;
  padding: .375rem .75rem;
  width: 100%;
}
.form-control:focus{
  border: none;
  border-bottom: 1px solid #00BCD4;
  box-shadow: none;
  color: #ECEFF1;
}
.form-floating>.form-control:focus~label,
.form-floating>.form-control:not(:placeholder-shown)~label,
.form-floating>.form-select~label{
  color: #90A4AE;
  opacity: 1;
}
.form-floating>.form-control:focus~label, .form-floating>.form-control:not(:placeholder-shown)~label, .form-floating>.form-select~label{
	transform: scale(.75) translateY(-.5rem) translateX(.15rem);
}
/* / FORM */
/* TABS */
.nav-tabs{
  border-bottom: none;
}
.nav-tabs .nav-link{
  padding: .6rem 1.5rem;
}
.special-nav-tabs.nav .nav-link{
	border: none;
	border-bottom: 1px solid rgba(69, 90, 100, .3) !important;
	text-align: left;
	text-transform: uppercase;
	width: 100%;
}
.special-nav-tabs.nav.nav-pills .nav-link{
	border-bottom: none !important;
	text-align: center;
}
.special-nav-tabs.nav .nav-link h3{
	color: #141f2d;
	font-size: 2rem;
	text-shadow: -1px -1px 0 rgba(251, 192, 45, .3), 1px -1px 0 rgba(251, 192, 45, .3), -1px 1px 0 rgba(251, 192, 45, .3), 1px 1px 0 rgba(251, 192, 45, .3);
	margin-bottom: 0;
}
.special-nav-tabs.nav .nav-link:hover h3{
	text-shadow: -1px -1px 0 rgba(251, 192, 45, .3), 1px -1px 0 rgba(251, 192, 45, .3), -1px 1px 0 rgba(251, 192, 45, .3), 1px 1px 0 rgba(251, 192, 45, .3);
}
.nav-tabs .nav-link h3{
  color: #FBC02D;
  margin: 0;
}
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active{
  background-color: rgba(55,71,79,.5);
  backdrop-filter: blur(3px);
	border-color: rgba(69, 90, 100, .3);
  border-bottom-color: transparent;
  border-radius: 18px 18px 0 0;
  position: relative;
  z-index: 1;
}
.special-nav-tabs.nav .nav-item.show .nav-link,
.special-nav-tabs.nav .nav-link.active{
	backdrop-filter: none;
	background-color: transparent;
	border: none;
	border-bottom: 1px solid rgba(69, 90, 100, .3);
	text-transform: uppercase;
}
.nav .nav-link.active h3,
.nav .nav-link.active:hover h3{
  color: #00BCD4;
}
.special-nav-tabs.nav .nav-link.active h3,
.special-nav-tabs.nav .nav-link.active:hover h3{
  text-shadow: none;
}
.nav-tabs .nav-link:not(.active):focus,
.nav-tabs .nav-link:not(.active):hover,
.special-nav-tabs .nav-item:last-child .nav-link{
  border-color: transparent !important;
}
#about .special-nav-tabs.nav .nav-link{
	padding-right: 36px;
	position: relative;
}
#about .special-nav-tabs.nav .nav-link::after,
#about .special-nav-tabs.nav .nav-link.active::before{
	bottom: 0;
	color: #FBC02D;
	content: "\f30b";
	font-family: "Font Awesome 5 Free";
	font-size: 24px;
	font-weight: 900;
	line-height: 58px;
	left: auto;
	margin: auto;
	position: absolute;
	right: 0;
	top: 0;
}
#about .special-nav-tabs.nav .nav-link.active::before{
	bottom: -36px;
	content: "\f0d7";
	display: none;
	left: 0;
	right: 0;
	text-align: center;
	top: auto;
	width: 100%;
}
#about .special-nav-tabs.nav .nav-link.active::after,
#about .special-nav-tabs.nav .nav-link.active::before{
	color: #00BCD4;
}
.nav .nav-link:not(.active):hover h3{
  color: #FBC02D;
	text-shadow: none;
}
.tab-content:not(.pills-content,.special-tab-content){
  background-color: rgba(55,71,79,.5);
  backdrop-filter: blur(3px);
  border: 1px solid rgba(69, 90, 100, .5);
  border-top: none;
  border-radius: 0 0 18px 18px;
  padding: 1.875rem;
}
.special-tab-content.pills-content .tab-pane{
	padding: 0 4rem;
}
/*.tab-content.special-tab-content #pills-uxui,
#AboutTabContent{
	padding: 0 1.875rem;
}*/
.special-tab-content.pills-content #pills-brands{
	padding: 1.875rem;
}
#pills-brands img,
#carouselWorkUXUI .carousel-inner:hover,
a,button,.form-floating,
#scroll-down{
	transition: all .2s ease-in-out;
	transform: scale(1);
}
a,button{
	display: inline-block;
}
#pills-brands img:hover,
#carouselWorkUXUI .carousel-inner:hover,
a:hover,
.form-floating:hover,
.accordion-header button:hover,
.nav-tabs button:hover,
.modal-footer button:hover{
	transform: scale(1.025);
}
.next-section a:hover,
.prev-section a:hover,
button:hover,
#scroll-down:hover{
	transform: scale(1.1);
}
.col-social-contact a:hover{
	transform: scale(1.25);
}
.carousel-item a,
.carousel-item a:hover{
	display: block;
	transform: none;
}
#carouselWorkUXUI .carousel-inner:hover .client-name{
	color: #FBC02D;
}
/* .nav-pills{
	margin-bottom: 1.125rem;
} */
.nav-pills .nav-link{
	border: 2px solid #141f2d;
	border-radius: 18px;
	color: #FBC02D;
	font-family: 'Titillium Web', sans-serif;
  font-weight: 700;
	letter-spacing: 2px;
	margin-right: 1rem;
	text-transform: uppercase;
}
.nav-pills .nav-link:hover{
	color: #F9A825;
}
.special-nav-tabs.nav-pills .nav-link{
	border: none;
}
.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
  background-color: #141f2d;
	border-color: #37474F;
  color: #00BCD4;
}
/* / TABS */
/* ACCORDION */
.accordion-item {
	background-color: rgba(55,71,79,.5);
	backdrop-filter: blur(3px);
	border: 1px solid rgba(69, 90, 100, .5);
}
.accordion-button{
	background-color: transparent;
	color: #CFD8DC;
}
.accordion-button:hover{
	background-color: rgba(55,71,79,.5);
}
.accordion-button::after{
	background-image: none;
	color: #FBC02D;
	content: "\f067";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}
.accordion-button:hover::after{
	color: #F9A825;
}
.accordion-button:not(.collapsed)::after{
	background-image: none;
	color: #FBC02D;
	content: "\f068";
}
.accordion-button:not(.collapsed){
	background: transparent;
	box-shadow: none;
	color: #00BCD4;
}
.accordion-button:not(.collapsed) i{
	color: #00BCD4;
}
.accordion-button:focus{
	box-shadow: none;
	border-bottom: none;
}
.accordion-item:first-of-type,
.accordion-item:first-of-type .accordion-button{
	border-radius: 18px 18px 0 0;
}
.accordion-item:last-of-type,
.accordion-item:last-of-type .accordion-button.collapsed{
	border-radius: 0 0 18px 18px;
}
.special-accordion .accordion-item{
	background-color: transparent;
	backdrop-filter: none;
	border: none;
	border-bottom: 1px solid rgba(69, 90, 100, .3) !important;
}
.special-accordion .accordion-item:first-of-type,
.special-accordion .accordion-item:first-of-type .accordion-button{
	border-radius: 0;
}
.special-accordion .accordion-item:first-of-type .accordion-button{
	padding-top: 0;
}
.special-accordion .accordion-item:last-of-type,
.special-accordion .accordion-item:last-of-type .accordion-button.collapsed{
	border-radius: 0;
}
.special-accordion .accordion-item:last-child{
	border-bottom: none !important;
}
.special-accordion .accordion-button{
	color: #141f2d;
	font-size: 2rem;
	font-weight: 600;
	margin-bottom: 0;
	text-shadow: -1px -1px 0 rgba(251, 192, 45, .3), 1px -1px 0 rgba(251, 192, 45, .3), -1px 1px 0 rgba(251, 192, 45, .3), 1px 1px 0 rgba(251, 192, 45, .3);
	text-transform: uppercase;
}
.special-accordion .accordion-button::after{
	font-size: 24px;
	text-shadow: none;
}
.special-accordion .accordion-button:hover{
	background-color: transparent;
	color: #FBC02D;
	text-shadow: none;
}
.special-accordion .accordion-button:not(.collapsed){
	color: #00BCD4;
	text-shadow: none;
}
/* / ACCORDION */
/* CAROUSEL */
.carousel-control-next,
.carousel-control-prev{
	opacity: 1;
	width: 48px;
}
#carouselWorkUXUI .carousel-control-prev{
	left: -48px;
}
#carouselWorkUXUI .carousel-control-next{
	right: -48px;
}
.carousel-control-next-icon,
.carousel-control-prev-icon{
	height: auto;
	width: auto;
}
.carousel-control-next-icon,
.carousel-control-prev-icon{
	background-color: #141f2d;
	background-image: none;
	border-radius: 18px;
	text-align: center;
}
.carousel-control-prev-icon::before,
.carousel-control-next-icon::before{
	background-color: transparent;
	background-image: none;
	border: none;
	border-radius: 0;
	color: #FBC02D;
	display: block;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 1.5rem;
	line-height: 32px;
	height: 36px;
	width: 36px;
}
#carouselWorkUXUI .carousel-control-prev-icon::before,
#carouselWorkUXUI .carousel-control-next-icon::before{
	height: 48px;
	font-size: 2.25rem;
	padding-top: 7px;
	width: 48px;
}
.carousel-control-prev-icon::before{
	content: "\f053";
}
.carousel-control-next-icon::before{
	content: "\f054";
}
.carousel-control-prev:hover .carousel-control-prev-icon::before,
.carousel-control-next:hover .carousel-control-next-icon::before{
  color: #F9A825;
}
.carousel-indicators{
	bottom: -2.5rem;
	display: flex;
	justify-content: center;
	left: 0;
	list-style: none;
	margin-bottom: auto;
	margin-left: auto;
	margin-right: 0;
	padding: 0;
  position: absolute;
  right: 0;
	top: auto;
	z-index: 2;
}
.carousel-indicators [data-bs-target]{
	background-color: #FBC02D;
	border-radius: 4px;
	height: 4px;
	margin-left: 7px;
	margin-right: 7px;
	opacity: .5;
	width: 36px;
}
.carousel-indicators [data-bs-target]:hover{
	opacity: 1;
}
.carousel-indicators .active{
	background-color: #00BCD4;
	opacity: 1;
}
.carousel-item{
	padding-top: 1.5rem;
}
/* / CAROUSEL */
/* MODAL */
.modal-content{
	background-color: rgba(20,31,45,.8) !important;
  backdrop-filter: blur(10px);
}
.modal-header{
	border: none;
}
.modal-body .carousel-item {
    padding-top: 0;
}
.modal-body .carousel-control-prev-icon::before,
.modal-body .carousel-control-next-icon::before{
	background-color: transparent;
	background-image: none;
	border-color: transparent;
	color: #FBC02D;
  padding-top: 2px;
}
.modal-body .carousel-control-prev:hover .carousel-control-prev-icon::before,
.modal-body .carousel-control-next:hover .carousel-control-next-icon::before{
	background-color: transparent;
  border-color: transparent;
  color: #F9A825;
}
.modal-footer{
	border-top: 1px solid rgba(69, 90, 100, .3);
	justify-content: space-between;
}
.modal .client-card{
	margin-bottom: 1rem;
}
.modal .accordion-button{
	font-size: 1.125rem;
}
.modal .accordion-body{
	padding-top: 0;
}
.modal .accordion-body p{
	margin: 0;
}
.modal-body .client-card .client-name,
.modal-body .client-card .client-info{
	margin-left: 0;
}
.client-solution-image img{
	border-radius: 24px;
}
.modal-body .accordion-item{
	background-color: transparent;
	backdrop-filter: none;
	border: none;
	border-radius: 0;
}
.modal-body .accordion-button:hover{
	background-color: transparent;
	color: #FBC02D;
}
.modal-body .accordion-item:first-child{
	border-bottom: 1px solid rgba(69, 90, 100, .3);
}
/* .modal-footer{
	display: none !important;
} */
.modal.fade .modal-dialog {
    transform: translate(0,50px);
}
.modal.show .modal-dialog {
    transform: none;
}
/* / MODAL */
/* HEADER */
#header{
	position: fixed;
	width: 100%;
	z-index: 1030;
}
#header .navbar{
  background-color: transparent !important;
  padding-bottom: 1.125rem;
  padding-top: 1.125rem;
	position: relative;
	z-index: 2;
}
#header.fixed::before{
  background-color: rgba(20,31,45,.75) !important;
  backdrop-filter: blur(7px);
  border-bottom: 1px solid rgba(33, 58, 87, .3);
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 1;
}
#header .navbar>.container-fluid{
  display: block;
}
#header .navbar-brand{
  display: inline-block;
  margin: 0;
  padding: 0;
}
#header .navbar-collapse{
  display: block !important;
  flex-basis: auto;
  flex-grow: 0;
}
#navbar-main .nav-link{
  color: #FBC02D;
  font-size: 1rem;
	font-weight: 600;
  letter-spacing: 1px;
	padding-left: 1rem;
	padding-right: 1rem;
  text-transform: uppercase;
}
#navbar-main .nav-link.active{
  color: #00BCD4;
}
#navbar-main .nav-link.active:hover{
  color: #0097A7;
}
#navbar-main .nav-link:hover{
  color: #F9A825;
}
/* #header .col-language a{
	display: none;
} */
#header .col-language .btn.disabled{
	background: #101924;
	border-color: transparent;
	color: #00BCD4 ;
	opacity: 1;
}
#header .col-language .btn-es{
	border-radius: 0 12px 12px 0 !important;
}
#header .col-language .btn-en{
	border-radius: 12px 0 0 12px !important;
}
#header .col-language .btn:not(.disabled){
	background-color: #213a57;
  border-color: #213a57;
	color: #FBC02D;
}
#header .col-language .btn:not(.disabled):hover{
	background-color: #F9A825;
  border-color: #F9A825;
	box-shadow: none;
  color: #141f2d;
}
/* / HEADER */
/* COVER */
#cover{
  padding-bottom: 0;
  padding-top: 0;
}
#cover span{
	display: block;
}
#cover h2.main-title{
  margin: 0;
}
#cover p{
	margin: 0;
}
#cover #frame-jpg img{
	border-radius: 100%;
}
/* / COVER */
/* ABOUT */
#personal-stuff{
	border-bottom: 1px solid rgba(69, 90, 100, .3);
  border-top: 1px solid rgba(69, 90, 100, .3);
  margin-top: 3rem;
	padding: 1rem 0;
  position: relative;
  overflow: hidden;
  width: 100%;
}
#personal-stuff .row:first-child{
	margin-bottom: 2rem;
}
#personal-stuff i{
	margin-right: 1rem;
}
/* skill */
#skills .progress-skill{
	margin-bottom: 24px;
}
#skills .progress-skill .skill-name{
	padding-left: 2.5rem;
}
#skills .progress-skill .fa-ul{
	margin: 0 0 7px;
	padding: 0;
}
#skills .progress-skill .fa-li{
	left: 0;
}
#skills .progress-skill .progress{
	background-color: #607D8B;
	height: 5px;
}
#skills .progress-skill .progress .progress-bar.bg-master{
	background-color: #0097A7;
}
#skills .progress-skill .progress .progress-bar.bg-expert{
	background-color: #2AA876;
}
#skills .progress-skill .progress .progress-bar.bg-competent{
	background-color: #FFD265;
}
#skills .progress-skill .progress .progress-bar.bg-acquainted{
	background-color: #F19C65;
}
#skills .progress-skill .progress .progress-bar.bg-beginner{
	background-color: #CE4D45;
}
#pills-tabContent-skills{
	background-color: transparent;
	backdrop-filter: none;
	border: none;
	padding: 1rem;
}
#pills-tab-skills button.nav-link{
	background-color: transparent;
	border-radius: 0;
	border-left: none;
	border-right: none;
	border-top: none;
}
/* / skill */
/* trajectory */
#trajectory{
	border-bottom: 1px solid rgba(69, 90, 100, .3);
	height:450px;
	overflow: hidden;
	overflow-y: scroll;
}
.timeline-calendar i.fas{
    -webkit-animation: timeline-arrow 1s infinite  alternate;
    animation: timeline-arrow 1s infinite  alternate;
}
@-webkit-keyframes timeline-arrow {
    0% { transform: translateY(0); }
    100% { transform: translateY(5px); }
}
@keyframes timeline-arrow {
    0% { transform: translateY(0); }
    100% { transform: translateY(5px); }
}
.timeline > li > .timeline-panel{
	background-color: rgba(55,71,79,.5);
  backdrop-filter: blur(3px);
  border: 1px solid rgba(69, 90, 100, .5);
	border-radius: 18px;
}
.timeline > li > .timeline-panel:after{
	border-left-color: rgba(55,71,79,.6);
  border-right-color: rgba(55,71,79,.6);
}
.timeline-logo-img{
	background-color: #fff;
	border-radius: 30%;
	padding: 5px;
	text-align: center;
}
.timeline-info{
	border-left: 1px solid rgba(69, 90, 100, .3);
}
.timeline-title{
	font-size: 1.125rem;
	margin: 0 0 5px;
}
span.timeline-company{
	display: block;
	margin: 0;
}
.timeline-activity,
span.timeline-company{
	color: #90A4AE;
  font-size: 0.75rem;
}
.timeline-activity .col-12{
	width: auto;
}
/*.timeline-activity i.fa-spinner{
	color: #757575;
}*/
/* / trajectory */
/* / ABOUT */
/* WORK */
#accordionKnowHow .accordion-body{
	padding-top: 0;
}
#accordionKnowHow .accordion-body h4{
	margin-bottom: 0.5rem;
}
#accordionKnowHow .accordion-body h5,
#accordionKnowHow .accordion-body p{
	margin: 0;
}
.client-card .client-logo img{
	border-radius: 18px;
	max-width: 60px;
}
.client-testimony-card .client-logo img{
	border-radius: 50%;
	max-width: 48px;
}
.client-card .client-name,
.client-card p.client-info{
	margin: 0 !important;
}
.client-card .client-name{
	margin-bottom: 0.25rem !important;
}
.client-card p.client-info{
	color: #90A4AE;
	font-size: 0.75rem;
	margin-bottom: 0 !important;
}
#carouselWorkUXUI .client-card{
	background-color: #141f2d;
	margin-top: 1rem;
}
#carouselWorkUXUI .client-card,
#pills-brands .col-brand a{
	position: relative;
}
#carouselWorkUXUI .client-card .view-project,
#pills-brands .col-brand a .view-project{
	left: 0;
	margin: auto;
	position: absolute;
	right: 0;
	top: -44px;
	width: 96px;
}
#pills-brands .col-brand a .view-project{
	bottom: -12px;
	top: auto;
	z-index: 2;
}
#carouselWorkUXUI .carousel-item:hover .view-project,
#pills-brands .col-brand a:hover .view-project{
	background-color: #F9A825;
	border-color: #F9A825;
}
.view-project strong{
	/* display: none !important; */
	font-weight: 600;
}
.client-card p.client-info span{
	display: inline-block;
}
.client-logo,
.client-info{
	width: auto;
}
.client-card .client-info .client-solution-type{
	border-left: 1px solid #90A4AE;
	margin-left: 15px;
	padding-left: 15px;
}
.modal .client-card.client-testimony-card{
	margin-bottom: 0;
}
.client-testimony-card{
	padding: 0 15px;
}
.client-testimony-card .client-testimony-text{
	padding: 15px 15px 0;
}
.client-testimony-card .client-testimony-text p{
	font-size: 0.875rem;
	font-style: italic;
	margin-bottom: 0;
}
.project-column-info{
	border-right: 1px solid rgba(69, 90, 100, .3);
}
/*.col-work{
	padding-top: 1.5rem;
}*/
.made-with h6{
	color: #90A4AE;
	margin-bottom: 0.75rem;
}
.made-with .list-group .list-group-item{
	background: transparent;
	border: none;
	padding: 0 6px;
}
.made-with img{
	border-radius: 6px;
	height: 36px;
	width: auto;
}
#pills-brands .col-brand{
	margin-bottom: 1.3rem;
}
#pills-brands .col-brand img{
	border-radius: 18px;
}
.btn-escribeme{
	display: none;
}
#work-selected .col-12 div{
	min-height: 80px;
	margin: 1.5rem 0 0;
	padding: 0;
	position: relative;
	text-align: center;
}
#work-selected .col-12 div::before{
	background-color: rgba(69, 90, 100, .3);
	bottom: 0;
	content: "";
	height: 1px;
	left: 0;
	margin: auto;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 0;
}
#work-selected .col-12 div span{
	background-color: #141f2d;
	display: block;
	padding: 0 15px;
	z-index: 1;
}
#work-selected .work-selected-txt{
	letter-spacing: .5rem;
	text-transform: uppercase;
}
.row-proyecto-de{
	margin: 0;
}
.row-proyecto-de span{
	display: inline-block;
	list-style: 36px;
	vertical-align: middle;
}
.row-proyecto-de span.proyecto-de-logo{
	margin-right: 15px;
}
.row-proyecto-de span.proyecto-de-logo img{
	border-radius: 18px;
	height: 36px;
}
/* / WORK */
/* FOOTER */
#footer{
	/* background-color: rgba(38,50,56,.5) !important;
	backdrop-filter: blur(5px);
	border: 1px solid rgba(69, 90, 100, .5);
	border-radius: 18px 18px 0 0; */
	padding: 1.5rem;
}
#footer .made-with h6{
	margin: 0 15px 0 0;
}
#copyright,#terms{
	display: block;
	font-size: 0.75rem;
	text-align: right;
}
/* / FOOTER */
/* MOBILE */
.navbar-toggler{
	border: none;
	height: 48px;
	padding: 0;
	position: relative;
	width: 48px;
}
.navbar-toggler:focus{
	box-shadow: none;
}
.navbar-toggler .navbar-toggler-icon{
	background-image: none;
}
.navbar-toggler .navbar-toggler-icon::before{
	color: #FBC02D;
	content: "\f0c9";
	font-family: "Font Awesome 5 Free";
	font-size: 1.5rem;
	font-weight: 900;
	height: 48px;
	left: 0;
	line-height: 48px;
	position: absolute;
	top: 0;
	width: 48px;
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before{
	content: "\f00d";
}
/* --- */
@media screen and (max-width: 991px){
	#particles-js{
		display: none !important;
	}
	html{
		font-size: 15px;
	}
	body > div{
		height: auto;
		overflow-x: hidden;
	}
	#header .navbar-collapse{
		display: none !important;
	}
	#header .navbar-collapse.show{
		background-color: rgba(20,31,45,.75) !important;
	  	backdrop-filter: blur(7px);
		display: flex !important;
		height: 100%;
		justify-content: center;
		align-items: center;
		left: 0;
		position: fixed;
		top: 76px;
		width: 100%;
		text-align: center;
	}
	#header .navbar-collapse.show .navbar-nav{
		display: block;
		margin: -76px 0 0 !important;
	}
	#navbar-main .nav-link{
		font-size: 2.5rem;
	}
	#header .col-brand,
	#header .col-menu,
	#header .col-language{
		width: auto;
	}
	.col-email-contact,
	.col-sections-content,
	.col-social-contact,
	.col-email-contact .list-group-item,
	.col-social-contact .list-group-item{
		padding-left: 0;
		padding-right: 0;
	}
	#cover .row{
		position: relative;
	}
	.col-img-rb{
		display: none !important;
		position: fixed;
    right: -50%;
	}
	#cover{
		padding-bottom: 7rem;
		padding-top: 7rem;
	}
	#scroll-down{
		bottom: auto;
		left: auto;
		margin: 24px 0 0;
		position: relative;
		right: auto;
	}
	.scroll:after{
		display: none;
	}
	.special-accordion .accordion-item:first-of-type .accordion-button{
		padding-top: 1rem;
	}
	.col-work {
    padding-top: 1.5rem;
	}
	.tab-content.special-tab-content #pills-uxui{
		padding: 0;
	}
	.section-content {
    padding-bottom: 5rem;
    padding-top: 5rem;
	}
	.navbar-brand img{
		height: 36px;
	}
	#header .navbar{
		padding-bottom: 1rem;
		padding-top: 1rem;
	}
	.scroll{
		border-radius: 11px;
		height: 34px;
		width: 22px;
	}
	.nav-tabs .nav-link:not(.active):focus, .nav-tabs .nav-link:not(.active):hover, .special-nav-tabs .nav-item:last-child .nav-link{
		border-color: rgba(69, 90, 100, .3) !important;
	}
	#header .col-brand{
		padding: 0;
	}
	#header .col-menu{
		padding-left: 0;
	}
	.special-tab-content.pills-content #pills-brands{
		padding-left: 0;
		padding-right: 0;
	}
	.timeline-activity, span.timeline-company,
	.client-card p.client-info{
		font-size: .9rem;
	}
	#copyright, #terms{
		display: block;
		padding: 18px 18px 0 0;
    text-align: center;
		width: 100%;
  }
	#footer .made-with h6{
		margin-bottom: .8rem;
	}
	.a-selected-work{
		display: none !important;
	}
}
@media screen and (max-width: 767px){
	html{
		font-size: 14px;
	}
	.personal-stuff-col{
		margin-bottom: 1rem;
	}
	#personal-stuff .row:first-child{
		margin-bottom: 0;
	}
	#AboutTabContent{
		padding: 1.875rem 0;
	}
	#about .special-nav-tabs.nav .nav-link::after{
		display: none;
	}
	.special-nav-tabs.nav .nav-item.show .nav-link, .special-nav-tabs.nav .nav-link.active{
		border-color: transparent !important;
	}
	.marquee p {
	  animation: marquee 30s linear infinite;
	}
	.marquee2 p {
	  animation-delay: 15s;
	}
	.project-column-gallery{
		padding: 0;
		margin-bottom: 1.5rem;
	}
	.project-column-info{
		border: none;
	}
	#cover {
    padding-bottom: 6rem;
    padding-top: 8rem;
	}
	.section-content{
		padding-bottom: 4rem;
		padding-top: 6rem;
	}
	.client-card .client-logo img{
		max-width: 48px;
	}
	.modal-body{
		padding-top: 0;
	}
	.view-project strong{
		display: none;
	}
	#carouselWorkUXUI .client-card .view-project,
	#pills-brands .col-brand a .view-project{
		width: 48px;
	}
	.scroll{
		border: none;
	}
	.scroll::before{
		bottom: 9px;
		height: 9px;
		top: 0;
		width: 9px;
	}
	@keyframes scroll {
		0% {
			opacity: 1;
			transform: translateY(9px);
		}
		20% {
			opacity: 1;
		}
		40% {
			opacity: 0;
		}
		100% {
			opacity: 0;
			transform: translateY(0);
		}
	}
	#personal-stuff {
		border-top: none;
		margin-top: 0;
	}
}
@media screen and (max-width: 700px){
	h3.subtitle.d-sm-none{
		display: block !important;
	}
	#about .special-nav-tabs.nav .nav-link::after{
		display: block;
		font-size: 2rem;
	}
	#AboutTab.special-nav-tabs.nav .nav-link{
		height: 48px;
		padding: 1rem 2rem;
		width: 48px;
	}
	#AboutTab.special-nav-tabs.nav .nav-link h3{
		display: none;
	}
	#AboutTab.special-nav-tabs.nav .nav-link::after{
		left: 0;
		line-height: 48px;
		text-align: center;
	}
	#AboutTab.special-nav-tabs .nav-item .nav-link:not(.active)::after{
		color: #141f2d;
		text-shadow: -1px -1px 0 rgba(251, 192, 45, .3), 1px -1px 0 rgba(251, 192, 45, .3), -1px 1px 0 rgba(251, 192, 45, .3), 1px 1px 0 rgba(251, 192, 45, .3);
	}
	#AboutTab.special-nav-tabs.nav li:nth-child(1) .nav-link::after{
		content: "\f007";
	}
	#AboutTab.special-nav-tabs.nav li:nth-child(2) .nav-link::after{
		content: "\f5da";
	}
	#AboutTab.special-nav-tabs.nav li:nth-child(3) .nav-link::after{
		content: "\f501";
	}
	#about #AboutTab.special-nav-tabs.nav .nav-link.active::before{
		display: block;
	}
}
@media screen and (max-width: 576px){
	h1,h2.main-title{
	  font-size: 3rem;
	}
	#cover h2.main-title{
		margin-bottom: 3rem;
	}
	.slider-wrapper-text{
		font-size: 1.25rem;
		height: 24px;
		overflow-y: hidden;
		white-space: nowrap;
	}
	.slider-text{
		padding-left: 7px;
	}
	.slider-text div{
		padding: 0 7px;
	}
	.accordion-button::after{
    height: 28px;
    width: 1px;
	}
	.accordion-button:not(.collapsed)::after{
		transform: none;
	}
	.timeline > li > .timeline-panel{
		padding: 7px;
	}
	.timeline-item{
		margin: 0;
	}
	.timeline-logo{
		padding-left: 0;
	}
	.timeline-info{
		padding-right: 0;
	}
	.section-content{
		padding-bottom: 0;
	}
	.col-email-contact .email-contact{
		padding-left: 9px;
	}
	#footer{
		margin-top: 4rem;
	}
	#pillsWork-tab.nav-pills .nav-link{
		padding-left: 0;
		padding-right: 0;
	}
	#carouselWorkUXUI .carousel-control-prev{
		left: -18px;
	}
	#carouselWorkUXUI .carousel-control-next{
		right: -18px;
	}
	#trajectory,
	#skills,
	#profile{
		border-bottom: 1px solid rgba(69, 90, 100, .9);
		height: 360px;
		overflow: hidden;
		overflow-y: scroll;
	}
	.client-logotipo{
		width: 25%;
	}
	div.client-info{
		white-space: nowrap;
		width: 75%;
	}
	#pills-brands .col-brand a .view-project{
		bottom: -18px;
	}
	#carouselWorkUXUI .client-card .view-project{
		top: -32px;
	}
	#pills-brands .col-brand {
    margin-bottom: 2rem;
	}
	#work-selected .col-12 div span.work-selected-icon{
		display: none;
	}
}
@media screen and (max-width: 359px){
	.navbar-toggler{
		width: 40px;
	}
	.navbar-brand img {
    height: 36px;
	}
	#header .col-menu{
		padding-right: 7px;
	}
	#header .container-fluid,
	#header .col-language .btn-es,
	#header .col-language .btn-es{
		padding-left: 7px;
		padding-right: 7px;
	}
	#header .col-language{
		padding-left: 0;
	}
	#cover h2.main-title{
		margin-bottom: 1rem !important;
	}
}
/* devices */
@media (max-height: 830px) and (max-width: 415px) {
	#cover {
		padding-bottom: 12rem;
    padding-top: 12rem;
	}
	#cover .txt-hola{
		margin-bottom: 3rem;
	}
}
@media (max-height: 1024px) and (max-width: 768px){
	#cover {
		padding-bottom: 15rem;
    padding-top: 15rem;
	}
	#cover .txt-hola,
	#cover h2.main-title{
		margin-bottom: 3rem;
	}
}
@media (max-height: 736px) and (max-width: 415px){
	#cover {
		padding-bottom: 10rem;
    padding-top: 11rem;
	}
}
@media (max-height: 720px) and (max-width: 390px) {
	#cover {
		padding-bottom: 6rem;
    padding-top: 8rem;
	}
	#cover .txt-hola{
		margin-bottom: 0rem;
	}
}
@media (max-height: 540px) and (max-width: 720px) {
	h1,h2.main-title{
	  font-size: 4rem;
	}
	#cover {
		padding-bottom: 2rem;
    padding-top: 6rem;
	}
	#cover .txt-hola,
	#cover h2.main-title{
		margin-bottom: 0rem;
	}
}
/* / devices */
/* / MOBILE */
/* #header .col-language .btn-en,
#header .col-language .btn-en:hover{
	background-color: transparent !important;
	border-color: transparent !important;
	color: #607D8B !important;
	cursor: not-allowed;
	opacity: .5;
} */
#missing-page h1{
	line-height: .8;
	margin: 0 0 1rem;
}
#missing-page img{
	max-width: 340px;
}