@font-face {
 font-family: "ProbaNav2Regular";
 src: url("/fonts/ProbaNav2Regular.woff") format("woff");
}
body {
	margin: 0;
	padding: 0;
    font-family: ProbaNav2Regular;
	font-size: 1vw;
	color: #646464;
	background-color: #fafaff;
}
header {
width: 100%;
height: auto;
background-color: #323237;
text-align: center;
position: sticky;
top: 0;
}
header ul {
    margin: 0;
    padding: 0;
}
header a {
	color: #fff;
}
header a:hover {
    background: #fff;
    color: #000;
}
header li {
	display: inline-block;
	list-style: none;
	font-size: 0.8vw;
	padding: 1% 1.5%;
}
h1 {
	text-transform: uppercase;
	font-size: 3vw;
	color: #323232;
	letter-spacing: 0.1em;
}
h2{
	text-transform: uppercase;
	font-size: 2.8vw;
	color: #323232;
	margin: 0 0 1%;
}
h3{
	text-transform: uppercase;
	font-size: 1.8vw;
	color: #323232;
}
h4{
	text-transform: uppercase;
	font-size: 1.2vw;
	color: #323232;
}
p {
	text-align: justify;
	margin-bottom: 2.4vw;
}
a {
	text-decoration: none;
	color: #323232;
	font-weight: bold;
}
figure {
	display: inline-block;
	text-align: center;
}
table {
	margin: 0 auto;
}
th {
	padding: 2%;
    width: 15vw;
}
.olodiums {
	padding: 0;
	margin: 0;
}
img {
    max-width: 100%;
    height: auto;
}
iframe {
	width: 100%;
	border: 0;
}
#main {
	background-image: url('/imgs/goldolodium.png');
	background-repeat: no-repeat;
	background-position: right top;
	background-size: 53%;
}
#main img {
	width: 2.07vw;
	height: auto;
}
#about {
	background-color: #f5f5ff;
	background-image: url('/imgs/olodiums.png');
	background-repeat: no-repeat;
	background-position: left top;
	background-attachment: fixed;
	background-size: contain;
}
#pros {
	padding: 5% 0;
	text-align: center;
}
#tech {
	background-color: #0a0906; 
	background-image: url('/imgs/goldblk.png');
	background-repeat: no-repeat;
	background-position: right top;
	background-attachment: fixed;
	background-size: contain;
	color: #fff;
}
#tech h4 {
	color: #fff;
}
#properties {
	display: inline-block;
	padding: 0 0 0 18%;
}
#properties img {
	width: 14.2vw;
	height: auto;
}
#contact {
	background-color: #f5f5ff;
	display: inline-block;
    width: 100%;
}
.left {
	padding: 0 26% 0 4%;
}
.bleft {
	float: left;
    margin: 14% 8% 10% 0;
}
.bright {
    padding: 14% 0 10% 0;
}
.text {
	padding: 12% 0 16% 23%;
}
.textl {
	padding: 15% 53.5% 15% 16.5%;
}
.textr {
	padding: 10% 16.5% 10% 54%;
}
.textr2 {
	padding: 10% 0 10% 0;
	float: left;
}
.margin {
	margin: 0;
}
.tcontact {
	line-height: 1.7;
}
.btns {
	display: grid;
    margin: 13.5% 4% 0 22%;
    float: left;
}
a.button{
width: 14%;
color: #fff;
text-decoration: none;
font-size: 1vw;
letter-spacing: 0.1em;
background: #323237;
padding: 1.6% 4.5%;
margin: 0 0 1% 0;
text-align: center;
}
a.button:hover{
color: #323237;
background: #fff;
}
a.button2 {
    color: #fff;
    text-decoration: none;
    font-size: 1vw;
    letter-spacing: 0.1em;
    background: #323237;
    padding: 8% 9%;
    margin: 0 0 7% 0;
    width: 100%;
    text-align: center;
}
a.button2:hover{
color: #323237;
background: #fff;
}
a:hover {
 cursor:pointer;
}
ul.pros{
color: #4b4b4b;
font-size: 14pt;
font-weight: 500;
line-height: 110%;
list-style: none;
}
li.i1{
background: url(/imgs/i1.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i2{
background: url(/imgs/i2.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i3{
background: url(/imgs/i3.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i4{
background: url(/imgs/i4.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i5{
background: url(/imgs/i5.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i6{
background: url(/imgs/i6.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li {
	text-align: justify;
}

/* MOBILE */
@media only screen and (max-width: 1280px) {
body {
	margin: 0;
	padding: 0;
    font-family: ProbaNav2Regular;
	font-size: 2.15vw;
	color: #646464;
	background-color: #fafaff;
}
header {
width: 100%;
height: auto;
background-color: #323237;
text-align: center;
}
header ul {
    margin: 0;
    padding: 0;
}
header a {
	color: #fff;
}
header a:hover {
    background: #fff;
    color: #000;
}
header li {
	display: inline-block;
	list-style: none;
	font-size: 2vw;
	padding: 1.5% 1.5%;
}
h1 {
	text-transform: uppercase;
	font-size: 3.3vw;
	color: #323232;
	letter-spacing: 0.1em;
}
h2{
	text-transform: uppercase;
	font-size: 6vw;
	color: #323232;
	margin: 0 0 1%;
}
h3{
	text-transform: uppercase;
	font-size: 3vw;
	color: #323232;
}
h4{
	text-transform: uppercase;
    font-size: 2.4vw;
	color: #323232;
}
p {
	text-align: justify;
	margin-bottom: 2.4vw;
}
a {
	text-decoration: none;
	color: #323232;
	font-weight: bold;
}
figure {
    display: block;
	text-align: center;
}
table {
	margin: 0 auto;
}
th {
	padding: 0;
    width: 26vw;
}
.olodiums {
	padding: 0;
	margin: 0;
}
img {
    max-width: 100%;
    height: auto;
}
iframe {
	width: 100%;
	border: 0;
}
#main {
	background-image: url('/imgs/goldolodium.png');
	background-repeat: no-repeat;
	background-position: right center;
    background-size: 50%;
}
#main img {
	width: 2.5vw;
	height: auto;
}
#about {
	background-color: #f5f5ff;
	background-image: url('/imgs/olodiums.png');
	background-repeat: no-repeat;
    background-position: left center;
    background-attachment: inherit;
    background-size: 50%;
}
#pros {
	padding: 5% 0;
	text-align: center;
}
#pros img {
	max-width: 50%;
}
#tech {
	background-color: #0a0906; 
	background-image: url('/imgs/goldblk.png');
	background-repeat: no-repeat;
    background-position: right bottom;
    background-attachment: inherit;
    background-size: 50%;
	color: #fff;
}
#tech h4 {
	color: #fff;
}
#properties {
	display: inline-block;
	padding: 0 0 0 3%;
}
#properties img {
	width: 14.2vw;
	height: auto;
}
#contact {
	background-color: #f5f5ff;
	display: inline-block;
    width: 100%;
}
.left {
	padding: 0 20% 0 4%;
}
.bleft {
	float: left;
    margin: 10% 5% 10% 0;
}
.bright {
	padding: 16% 5% 10% 0;
}
.text {
	padding: 10% 0 15% 10%;
}
.textl {
    padding: 3% 49% 5% 5%;
}
.textr {
    padding: 10% 5% 10% 50%;
}
.textr2 {
    padding: 5% 10% 5% 10%;
	float: left;
}
.margin {
	margin: 0;
}
.btns {
	display: block;
    margin: 10% 5% 0 10%;
	float: unset;
}
a.button{
width: 14%;
color: #fff;
text-decoration: none;
font-size: 2vw;
letter-spacing: 0.1em;
background: #323237;
padding: 1.6% 4.5%;
margin: 0 0 1% 0;
text-align: center;
}
a.button:hover{
color: #323237;
background: #fff;
}
a.button2 {
width: 14%;
color: #fff;
text-decoration: none;
font-size: 2vw;
letter-spacing: 0.1em;
background: #323237;
padding: 1.6% 4.5%;
margin: 0 0 1% 0;
text-align: center;
}
a.button2:hover{
color: #323237;
background: #fff;
}
a:hover {
 cursor:pointer;
}
ul.pros{
color: #4b4b4b;
font-size: 14pt;
font-weight: 500;
line-height: 110%;
list-style: none;
}
li.i1{
background: url(/imgs/i1.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i2{
background: url(/imgs/i2.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i3{
background: url(/imgs/i3.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i4{
background: url(/imgs/i4.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i5{
background: url(/imgs/i5.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li.i6{
background: url(/imgs/i6.png) no-repeat left center;
background-position-x: 13%;
height: 65px;
padding-left: 33%;
padding-bottom: 2.5%;
}
li {
	text-align: justify;
}
}