@import "desktop.css"(min-width: 901px);
@import "mobile.css"(min-width: 0px) and (max-width: 900px);


@font-face {
  font-family: 'Glacial Indifference';
  src: url('../fonts/GlacialIndifference-Regular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Glacial Indifference';
  src: url('../fonts/GlacialIndifference-Bold.otf') format('opentype');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Glacial Indifference';
  src: url('../fonts/GlacialIndifference-Italic.otf') format('opentype');
  font-weight: normal;
  font-style: italic;
}

h1
{
  font-family: 'Glacial Indifference';
  font-weight: 100;
  font-size: 48px;
  color: #363636;
  text-align: center;
}

h2
{
  font-family: 'Glacial Indifference';
  font-weight: bold;
  font-size: 30px;
  color: #363636;
  text-align: center;
}

footer {
  margin: 25% 0 2% 0;
  font-family: 'Glacial Indifference';
  font-weight: 100;
  font-size: 20px;
  color: #363636;
  text-align: center;
}

footer a {
  color: #363636;
  text-decoration: underline;
}

p {
  margin: 2% 2% 2% 2%;
  font-family: 'Glacial Indifference';
  font-size: 20px;
  color: #363636;
  text-align: justify;
}

p a {
  color: #00b3ff;
  text-decoration:underline;
  text-decoration-style: dotted;
}

h2 a {
  color: #363636;
  text-decoration: none;
}

a>span {
  color: #00b3ff;
  text-decoration: underline;
  text-decoration-style: dotted;
  transition: all 0.5s ease-out;
}

a>span:hover {
  color: #363636;
  transition: all 0.5s ease-out;
}

span {
  color: #363636;
  text-decoration: underline;
  text-decoration-style: dotted;
  transition: all 0.5s ease-out;
}

span:hover {
  color: #00b3ff;
  transition: all 0.5s ease-out;
}

main {
  margin: 0 0 10% 0;
}

/* MODELS' GRID */
#models_grid .model {
  background-color: #d7d7d7;
}

#models_grid .model-environment {
  background-color: #b4ffc3;
}

#models_grid .model-environment:hover {
  background-color: #83da95;
  color: white;
  transition: all 0.3s ease-out;
}

#models_grid .model:hover {
  background-color: #bbb8b8;
  color: white;
  transition: all 0.3s ease-out;
}

#models_grid a {
  text-decoration: none;
}

hr {
  border: none;
  background-color: #878787;
  color: #878787;
  height: 1px;
}

.model h2, .model-environment h2 
{
  font-weight: 100;
  font-size: 20px;
  font-style: italic;
  text-align: center;
}

.file-size
{
  display: block;
  text-align: center;
  margin: 2% 0;
  font-size: 20px;
}

.file-size span 
{
  text-decoration: none;
  text-decoration-style: none;
}