.font1{
  font-family: 'GoogleSans-Bold';
  font-weight: 700;
}

.font2{
  font-family: 'GoogleSans-Medium';
  font-weight: 400;
}

.font3{
  font-family: 'GoogleSans-Regular';
  font-weight: 300;
}

.hvr-float {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-float:hover, .hvr-float:focus, .hvr-float:active {
  -webkit-transform: translateY(-12px);
  transform: translateY(-12px);
}


.btn-primary-2 {
  color: #fff !important;
  background-color: #91E2AB;
  border-color: #91E2AB; }
  .btn-primary-2:hover,
  .btn-primary-2:active,
  .btn-primary-2:focus
   {
    color: #fff !important;
    background-color: #6DE192;
    border-color: #6DE192; }

.btn-primary-2.light {
  color: #fff !important;;
  background-color: #FD7474;
  border-color: #FD7474;
  transition: .5s; }
  .btn-primary-2.light:hover,
  .btn-primary-2.light:active,
  .btn-primary-2.light:focus {
    color: #fff !important;;
    background-color: #FF6262;
    border-color: #FF6262;
    transition: .5s; }

@font-face {
    font-weight: normal;
    font-style: normal;
    font-family: 'GoogleSans-Bold';
    src: url('fonts/GoogleSans-Bold.ttf') format('truetype');
 
}


@font-face {
    font-weight: normal;
    font-style: normal;
    font-family: 'GoogleSans-Medium';
    src: url('fonts/GoogleSans-Medium.ttf') format('truetype');
 
}

@font-face {
    font-weight: normal;
    font-style: normal;
    font-family: 'GoogleSans-Regular';
    src: url('fonts/GoogleSans-Regular.ttf') format('truetype');
 
}


html {
    width: 100%;
    height: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body
{
	margin: 0;
	padding: 0;
	font-family: sans-serif;
	transition: .5s;
	background: #020122;
}

body.light
{
	margin: 0;
	padding: 0;
	font-family: sans-serif;
	transition: .5s;
	background: #ffffff;
}



dt,dl{
	font-family: 'GoogleSans-Medium';
    color: #ffffff !important;
    transition: .5s; 
}

.link{

	color: #91E2AB !important;
	transition: .5s; 

}

.link.light{

	color: #FF6262 !important;
	transition: .5s; 
	
}

dt.light,
dl.light{
	font-family: 'GoogleSans-Medium';
    color: #020122 !important;
    transition: .5s; 
}
.bg-primary-2 {
    background-color: #91E2AB !important;
    transition: .5s; 
}

.bg-primary-2.light {
    background-color: #FD7474 !important;
    transition: .5s; 
}

.bg-primary-3 {
    background-color: #020122 !important;
    transition: .5s; 
}

.filt{
     color: #fff;
     transition: .5s;
}

.filt.light{
	color:# 020122;
	transition: .5s;
}


.bg-primary-3.light {
    background-color: #ffffff !important;
    transition: .5s; 
}

.bg-primary-4 {
    background-color: #020122 !important;
    transition: .5s; 
}


.bg-primary-4.light {
    background-color: #020122 !important;
    transition: .5s; 
}

.nav-link {
	font-family: 'GoogleSans-Medium';
    color: #ffffff !important;
    transition: .5s; 
}


.nav-link.light {
	font-family: 'GoogleSans-Medium';
    color: #ffffff !important;
    transition: .5s; 
}

.hero-image {
  background-image: url("https://afernandezgarcia.com/new/assets/img/logo-white.png");
  background-color: #cccccc;
  width: : 50px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.mode
{
	position: fixed;
	bottom: 23px;
	right: 45px;
	color: #fff;
	font-size: 11px;
	transition: .5s;
	font-weight: 400;
	z-index: 99;
	font-family: 'GoogleSans-Bold';
}

.mode.light
{
	position: fixed;
	bottom: 23px;
	right: 45px;
	color: #000;
	font-size: 11px;
	transition: .5s;
	font-family: sans-serif;
	font-weight: 400;
	z-index: 99;
	font-family: 'GoogleSans-Bold';
}

.toggle
{
	position: fixed;
	bottom: 40px;
	right: 30px;
	z-index: 9999;
}


/*.toggle
{
	position: fixed;
	bottom: 40px;
	right: 30px;
	background: transparent;
	border: 2px solid #fff; 
	width: 49px;
	height: 24px;
	cursor: pointer;
	border-radius: 20px;
	transition: .5s;
	z-index: 99;
}

.toggle.active
{
	background: #fff;
	border: 2px solid #00151f;

}

.toggle:before
{
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	width: 16px;
	height: 16px;
	background: #91E2AB;
	border-radius: 50%;
	transition: .5s;
	z-index: 99;
}

.toggle.active:before
{
	left: 27px;
	background: #FD7474;
	width: 16.45px;
	height: 16.45px;

}*/

.content
{
	width: 100%;
}

.badge-primary{

	font-family: 'GoogleSans-Medium';
}

.content h1
{
	margin: 0 0 20px;
	padding: 0;
	color: #fff;
	transition: .15s; 
	font-weight: 800;
	transition: .5s;
	font-family: 'GoogleSans-Bold';

}

.content h4
{
	margin: 0 0 20px;
	padding: 0;
	color: #fff;
	transition: .15s; 
	font-weight: 800;
	transition: .5s;
	font-family: 'GoogleSans-Bold';

}

.content h6
{
	margin: 0;
	padding: 0;
	color: #fff;
	transition: .15px;
	font-size: 15px;
	font-family: sans-serif;
	font-weight: 400;
	transition: .5s;
	font-family: 'GoogleSans-Medium';
}

.content h5
{
	margin: 0;
	padding: 0;
	color: #fff;
	transition: .15px;
	font-size: 20px;
	font-family: sans-serif;
	font-weight: 800;
	letter-spacing: .3px;
	transition: .5s;
	font-family: 'GoogleSans-Medium';
}

.content p
{
	margin: 0;
	padding: 0;
	color: #fff;
	transition: .15px;
	font-size: 18px;
	font-family: sans-serif;
	font-weight: 400;
	transition: .5s;
	font-family: 'GoogleSans-Medium';
}

 .darkmode{display: none;}
  #hide{ transition: .5s;}
  #show{ transition: .5s;}

 .normalmode.light{
 	display: none;

 }

 .darkmode.light{
 	display: inherit;
 }

 button{
 	background: transparent;
 	border: none;
 	transition: .5s;
 }

  button:hover,
  button:active,
  button:focus {
 	background: transparent;
 	border: none;
 	transition: .5s;
 	outline: 0px !important;
 	-webkit-appearance: none;
 }

.copy
{
	margin: 0;
	padding: 0;
	color: #fff;
	transition: .15px;
	font-size: 14px;
	font-family: sans-serif;
	font-weight: 400;
	transition: .5s;
	font-family: 'GoogleSans-Medium';
}

.top-port{
	margin-top: 50px;
}



.copy.light
{
	margin: 0;
	padding: 0;
	color: #020122;
	transition: .15px;
	font-size: 14px;
	font-family: sans-serif;
	font-weight: 400;
	transition: .5s;
	font-family: 'GoogleSans-Medium';
}

.bg-primary-3.light h1,
.bg-primary-3.light h4,
.bg-primary-3.light h5,
.bg-primary-3.light h6,
.bg-primary-3.light p
{
	color: #020122;
	transition: .5s;
}


@media (max-width: 992px) {

.title{
	margin-top: -50px;
}

}