websegura/assets/sass/main.scss

@import "libs/vars";
@import "libs/functions";
@import "libs/mixins";
@import "libs/vendor";
@import "libs/breakpoints";
@import "libs/html-grid";
@import "fontawesome-all.min.css";

/*
	Phantom by HTML5 UP
	html5up.net | @ajlkn
	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

// Breakpoints.

@include breakpoints(
  (
    xlarge: (
      1281px,
      1680px,
    ),
    large: (
      981px,
      1280px,
    ),
    medium: (
      737px,
      980px,
    ),
    small: (
      481px,
      736px,
    ),
    xsmall: (
      361px,
      480px,
    ),
    xxsmall: (
      null,
      360px,
    ),
  )
);

// Base.

@import "base/reset";
@import "base/page";
@import "base/typography";

// Component.

@import "components/row";
@import "components/section";
@import "components/icon";
@import "components/list";
@import "components/actions";
@import "components/icons";
@import "components/form";
@import "components/box";
@import "components/image";
@import "components/table";
@import "components/button";
@import "components/tiles";

// Layout.

@import "layout/header";
@import "layout/menu";
@import "layout/main";
@import "layout/footer";
@import "layout/wrapper";

// Custom styles

h1 {
  color: rgb(100, 149, 237);
  text-align: center;
}

small {
  font-size: 0.85em;
}

#main p.button {
  display: block;
  max-width: 390px;
  margin: 3em auto;
}

#main p.button a {
  color: rgb(255, 67, 67);
}

button.provincia {
  margin-bottom: 9px;
}

tr.danger {
  background-color: #d9534f6e;
}

tr.severe {
  background-color: #d9534f45;
}

tr.moderate {
  background-color: #f0ad4e45;
}

tr.safe {
  background-color: #3fad4645;
}

tr.unknown {
  background-color: #eee8e8;
}

span.emoticon {
  font-size: 2em;
}

ul.iconify li {
  list-style: none;
  margin: 1em 0;
  line-height: 1.7em;
}

p.subtitle {
  margin: 2em 0;
  font-size: 1.1em;
}

p.featured {
  font-weight: bold;
  text-align: center;
}

p.featured .emoticon {
  display: block;
}

#resultados table {
  table-layout: fixed;
  word-wrap: break-word;
}

#resultados table th#nota {
  width: 65px;
}

#resultados table th#share {
  width: 30%;
}

p.tablefooter {
  float: right;
  font-size: 0.8em;
  font-style: italic;
}

#score {
  color: #FFF;
  font-weight: bold;
  font-size: 80px;
  width: 128px;
  border-radius: 12px;
  display: inline-block;
  height: 128px;
  padding: 0;
  text-align: center;
  float: right;
  border: 6px solid;
}

@include breakpoint('<=small') {
  #score {
    width: 80px;
    height: 80px;
    font-size: 45px;
  }
}

#score.danger {
  border-color: #801515;
  background: #aa3939;
}

#score.severe {
  border-color: #801515;
  background: #aa3939;
}

#score.moderate {
  border-color: #64482145;
  background: #f0ad4eb3;
}

#score.safe {
  border-color: #2d882d;
  background: #161;
}

#score.unknown {
  background: #eee8e8;
}