:root{
	--nutbook-azul: #195ba4;
}
@font-face {
	font-family: "vartek-bold";
	src:
		url("../fonts/Vartek-Bold.woff2") format("woff2"),
		url("../fonts/Vartek-Bold.woff") format("woff"),
		url("../fonts/Vartek-Bold.otf") format("otf");
	font-weight: bold;
	font-style: normal;
}

.vartek{
	font-family: "vartek-bold";
}
.azul{
	color: var(--nutbook-azul);
}
.caracteristica{
	width: 50px;
	min-height: 50px;
	color: #fff;
	font-size: 150%;
	background-color: var(--nutbook-azul);
}
.title-dot::before{
	content: '';
	position: absolute;;
	left: 15px;
	height: 3px;
	width: 100px;
	top: 2px;
	background-color: var(--nutbook-azul);
}
.title-dot::after{
	content: '';
	position: absolute;
	right: 15px;
	height: 3px;
	width: 100px;
	top: 2px;
	background-color: var(--nutbook-azul);
}
.title-dot{
	border-radius: 50%;
	height: 8px;
	width: 8px;
	display: inline-block;;
	position: relative;
	background-color: var(--nutbook-azul);
}
section#descargar, section#buy .title-dot::before{
	background-color: #fff;
}
section#descargar, section#buy .title-dot::after{
	background-color: #fff;
}
section#descargar, section#buy .title-dot{
	background-color: #fff;
}
.bg-body-nutbook{
	--bs-bg-opacity: 1;
	background-color: var(--nutbook-azul);
}
.bg-body-nutbook a.navbar-brand{
	color: #fff !important;
}

h1.title{
	font-size: 9rem;
}
section{
	padding: 50px 0px;
}
section#header, section#descargar, section#buy, footer{
	background-color: var(--nutbook-azul);
	color: #fff;
}
footer a{
	text-decoration: none;
	color: #fff;
}

@media screen and (max-width: 767px){
	h1.title{
		font-size: 4.5rem;
	}
}