@charset "UTF-8";
/*------------------------------------*	$STYLE
\*------------------------------------*/
/**
	Aquí incloem tots els arxius .scs que es compilaràn en un CSS definitiu /css/style.css
*/
/*------------------------------------*    $README
\*------------------------------------*/
/**
 * Readme..................... Resume escrit de la guia
 */
/*------------------------------------*    $VARIABLES
\*------------------------------------*/
/**
 *
 * Definim i configurem les variables CSS que utilitzarem
 *
 */
/*------------------------------------*    $BREAKPOINTS
\*------------------------------------*/
/*------------------------------------*    $LAYOUT
\*------------------------------------*/
/**
 * Definim elements constants del layout
 */
/*------------------------------------*    $FONT-FACE
\*------------------------------------*/
/**
 *Definimo les fonts que utilitzarem:
 * $basefont per tots els textes inline
 * $altfont per a textes alternatius, com cites, intro etc...
 * $codefont per a codi
*/
/*------------------------------------*    $TAMANYS
\*------------------------------------*/
/**
 * Definimos el tamany de les fonts
 */
/*------------------------------------*    $COLORS
\*------------------------------------*/
/**
 * Escala de grisos
 */
/**
 * Brand stuff
 */
/*------------------------------------*    $TEXTURES
\*------------------------------------*/
/**
 * Definim Colors i elements de popups, missatges d'alerta, backgrounds, etc...
 */
/*------------------------------------*    $MIXINS
\*------------------------------------*/
/**
  * Centrar y dar un ancho máximo igual a $pagemaxwidth.
  */
/*------------------------------------*    $TIPOGRAPHY
\*------------------------------------*/
/*
 * Definim les tipografies 
 */
b, strong {
  font-weight: 600; }

em {
  font-weight: inherit !important; }

h1, h2, h3, h4, h5, h6 {
  font-weight: 100 !important; }

h1 {
  color: #E1001A !important;
  font-size: 2em !important; }

h2 {
  color: #1a1a1a !important;
  font-size: 1.8em !important; }

h3 {
  color: #6FC0BB !important; }
  h3 a {
    text-decoration: none; }
  h3 a:hover {
    transition: all 0.7s ease 0s; }
  h3 span {
    font-size: .7em !important;
    color: #404040; }

/*------------------------------------*    $LINKS
\*------------------------------------*/
/*
 * Definim els links per defecte
 */
a {
  text-decoration: none;
  color: #E1001A; }
  a:visited {
    color: #E1001A; }
  a:hover {
    text-decoration: underline;
    color: #ae0014; }
  a:focus {
    outline: thin dotted;
    color: #ae0014; }
  a:hover, a:active {
    outline: 0; }

/*------------------------------------*    $BUTTONS
\*------------------------------------*/
/*
 * Definim els botons i les seves variants
 */
/**
* btn de bootstrap
*/
.btn {
  line-height: 1em !important; }

.btn-primary {
  background-color: #ff485d !important;
  border: 1px #ff485d solid !important; }
  .btn-primary:hover {
    background-color: gray !important;
    border: 1px gray solid !important; }
  .btn-primary:visited {
    background-color: #b3b3b3 !important;
    border: 1px gray solid !important;
    color: white !important; }
  .btn-primary:active {
    background-color: #b3b3b3 !important;
    border: 1px gray solid !important; }

/**
* Inputs con estilo de botones
*/
input[type="submit"].btn:hover {
  border-color: #c80017; }

.input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group {
  margin-left: 0px !important; }

/**
* Botón no disponible
*/
.btn--disabled {
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5;
  cursor: default; }

/**
* Botón principal
*/
.btn--primary {
  background-color: #E1001A;
  color: white; }
  .btn--primary:hover {
    color: #ffaeb7; }
  .btn--primary:visited {
    color: #150002; }

/**
* Botón de OK
*/
.btn--success {
  background-color: #5bb75b; }
  .btn--success:hover {
    background-color: #6dbf6d; }

/**
* Botón de advertencia
*/
.btn--warning {
  background-color: #da4f49; }
  .btn--warning:hover {
    background-color: #de635e; }
  .btn--warning:visited {
    color: #48110f; }

/*------------------------------------*    $BOTONS-TAMANYS
\*------------------------------------*/
/**
 * Variantes de los botones por tamaño.
 *
 */
/*------------------------------------*    $TABLES
\*------------------------------------*/
/*
 * Modificacions de les tables de bootstrap
 */
.table-hover > tbody > tr > td a {
  color: black !important; }

.table-hover > tbody > tr > td a:hover {
  color: #E1001A !important; }

.table--horas {
  border-bottom: 1px #d4d4d4 solid; }

.table--height {
  max-height: 400px;
  overflow-y: scroll; }

.table--horas > tbody > tr > td, .table--horas > tbody > tr > th, .table--horas > tfoot > tr > td, .table--horas > tfoot > tr > th, .table--horas > thead > tr > td, .table--horas > thead > tr > th {
  line-height: 1em;
  padding: 6px; }

/*------------------------------------*    $ELEMENTS
\*------------------------------------*/
/*
 * Definim els elements
 */
hr {
  clear: both;
  display: block;
  margin: 2em 0;
  padding: 0;
  height: 1px;
  border: 0;
  border-top: 1px solid white; }

mark {
  background: #FFFF00; }

q {
  color: gray;
  font-style: italic; }

/*------------------------------------*    $ELEMENTS-IMATGES
\*------------------------------------*/
img {
  max-width: 100%;
  border-width: 0;
  vertical-align: middle;
  -ms-interpolation-mode: bicubic; }

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0; }

input[type=number] {
  -moz-appearance: textfield; }

textarea, select, input {
  border: 1px #e6e6e6 solid !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important; }
  textarea:focus, select:focus, input:focus {
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15) !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15) !important; }

/*------------------------------------*    $TIPOGRAPHY
\*------------------------------------*/
/*
 * Definim les tipografies 
 */
/*------------------------------------*    $NAVIGATION
\*------------------------------------*/
/*
 * Definim els elements de navegació
 */
.nav--icons {
  list-style-type: none;
  padding: 10px 10px 0 0;
  margin: 0;
  text-align: right; }

.nav--icons__items {
  display: inline-block;
  padding: .5em 1em 0 0; }
  .nav--icons__items a {
    color: #1a1a1a; }
  .nav--icons__items a:hover {
    color: #E1001A; }
  .nav--icons__items i {
    vertical-align: middle;
    margin: 0 0 5px 5px; }
  .nav--icons__items.item__padding {
    padding-right: 20px !important; }

.nav--footer {
  list-style-type: none;
  padding: 0 24px 0 24px;
  margin: 0; }

.nav--footer__items {
  display: inline-block;
  padding: .5em 0em; }
  .nav--footer__items a {
    color: #262626; }
  .nav--footer__items a:hover {
    color: #E1001A;
    text-decoration: underline; }
  .nav--footer__items img {
    vertical-align: middle;
    margin: -7px 0 0 0; }
  .nav--footer__items i {
    vertical-align: middle;
    margin: 0 2px 3px 0px; }

.nav--panel {
  list-style-type: none;
  padding: 0 0 0 20px;
  margin: 3em 0 0 0;
  height: 42px; }

.nav--panel__item {
  float: left; }
  .nav--panel__item a {
    background-color: #6FC0BB;
    font-size: 0.9em;
    color: white;
    padding: 5px 10px 5px 10px;
    margin: 11px 2px 0px 2px;
    -webkit-border-top-right-radius: 6px !important;
    -moz-border-top-right-radius: 6px !important;
    -ms-border-top-right-radius: 6px !important;
    -o-border-top-right-radius: 6px !important;
    border-top-right-radius: 6px !important;
    -webkit-border-top-left-radius: 6px !important;
    -moz-border-top-left-radius: 6px !important;
    -ms-border-top-left-radius: 6px !important;
    -o-border-top-left-radius: 6px !important;
    border-top-left-radius: 6px !important;
    float: left; }
  .nav--panel__item a:hover {
    background-color: #e6e6e6;
    text-decoration: none;
    color: white;
    padding: 5px 10px 14px 10px;
    margin: 2px 2px 0px 2px; }
  .nav--panel__item.item__active {
    background-color: gray;
    font-size: 1em;
    color: white;
    padding: 5px 10px 14px 10px;
    margin: 0px 2px 0px 2px;
    -webkit-border-top-right-radius: 6px !important;
    -moz-border-top-right-radius: 6px !important;
    -ms-border-top-right-radius: 6px !important;
    -o-border-top-right-radius: 6px !important;
    border-top-right-radius: 6px !important;
    -webkit-border-top-left-radius: 6px !important;
    -moz-border-top-left-radius: 6px !important;
    -ms-border-top-left-radius: 6px !important;
    -o-border-top-left-radius: 6px !important;
    border-top-left-radius: 6px !important; }

.dropdown-menu {
  -webkit-border-top-right-radius: 0px !important;
  -moz-border-top-right-radius: 0px !important;
  -ms-border-top-right-radius: 0px !important;
  -o-border-top-right-radius: 0px !important;
  border-top-right-radius: 0px !important;
  -webkit-border-top-left-radius: 0px !important;
  -moz-border-top-left-radius: 0px !important;
  -ms-border-top-left-radius: 0px !important;
  -o-border-top-left-radius: 0px !important;
  border-top-left-radius: 0px !important;
  -webkit-border-bottom-right-radius: 6px !important;
  -moz-border-bottom-right-radius: 6px !important;
  -ms-border-bottom-right-radius: 6px !important;
  -o-border-bottom-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
  -webkit-border-bottom-left-radius: 6px !important;
  -moz-border-bottom-left-radius: 6px !important;
  -ms-border-bottom-left-radius: 6px !important;
  -o-border-bottom-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
  -webkit-box-shadow: none;
  box-shadow: none; }

/*------------------------------------*    $PAGINATION
\*------------------------------------*/
/**
 * Definim els estils de la paginació
 */
/*------------------------------------*    $FORMS
\*------------------------------------*/
/*
 * Definim els estils dels formularis
 */
/*------------------------------------*    $SITE
\*------------------------------------*/
/*
 * Definim elemnts genèrics del site

@-webkit-viewport {
	width : device-width;
}

@-moz-viewport {
	width : device-width;
}

@-ms-viewport {
	width : device-width;
}

@-o-viewport {
	width : device-width;
}

@viewport {
	width : device-width;
}

html {
	background : $background;
	font-size : 100%;
	-webkit-overflow-scrolling : touch;
	-webkit-tap-highlight-color : lighten($basecolor, 75%);
	-webkit-text-size-adjust : 100%;
	-ms-text-size-adjust : 100%;
}
*/
body {
  margin: 0;
  padding: 0;
  width: 100%;
  background-color: #f2f2f2;
  font-family: "Open Sans", sans-serif !important;
  font-size: 14px !important;
  font-size: 0.875rem;
  line-height: 1em;
  color: #262626 !important; }

header {
  background-color: white;
  border-bottom: 1px #d9d9d9 solid;
  color: #1a1a1a;
  height: 60px; }

nav {
  background-color: #6FC0BB;
  color: white;
  font-size: 16; }

footer {
  margin: 0 0 0 0;
  font-size: 0.8em;
  text-align: center; }

article ul {
  list-style-type: none; }

.article_a, .article_b, .article_footer {
  padding: 20px; }

.article_b {
  background-color: #e6e6e6;
  margin: 15px 0 0 0; }

.article_footer {
  -webkit-border-bottom-right-radius: 6px !important;
  -moz-border-bottom-right-radius: 6px !important;
  -ms-border-bottom-right-radius: 6px !important;
  -o-border-bottom-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
  -webkit-border-bottom-left-radius: 6px !important;
  -moz-border-bottom-left-radius: 6px !important;
  -ms-border-bottom-left-radius: 6px !important;
  -o-border-bottom-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
  color: #1a1a1a;
  border-top: 1px #d4d4d4 solid; }

.login {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -180px 0 0 -265px !important; }

.margin--top10 {
  margin-top: 10px; }

.margin--bottom10 {
  margin-bottom: 10px; }

.margin-combos {
  margin-top: 3em; }

#scroll {
  overflow: hidden; }

.bold {
  font-weight: bold !important; }

.padding {
  padding: 20px; }

.padding-left-right {
  padding: 0 24px 0 24px; }

.padding_panel_body {
  padding: 0 !important; }

.padding-row {
  padding: 0 15px 0 15px; }

.padding-5 {
  padding: 5px !important; }

.padding--left0 {
  padding-left: 0 !important; }

.padding--right0 {
  padding-right: 0 !important; }

.padding--top0 {
  padding-top: 0 !important; }

.padding--bottom0 {
  padding-bottom: 0 !important; }

.container-max-login {
  margin-left: auto;
  margin-right: auto;
  max-width: 530px;
  width: 100%; }

.container--max__generic {
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  width: 100%; }

.logo {
  margin: 6px;
  width: 210px;
  height: 46px; }

.panel {
  background-color: white !important;
  -webkit-border-radius: 6px !important;
  -moz-border-radius: 6px !important;
  -ms-border-radius: 6px !important;
  -o-border-radius: 6px !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  margin-bottom: 0; }

.panel-heading {
  background-color: #e6e6e6 !important;
  border-bottom: 1px white !important solid;
  -webkit-border-top-right-radius: 5px !important;
  -moz-border-top-right-radius: 5px !important;
  -ms-border-top-right-radius: 5px !important;
  -o-border-top-right-radius: 5px !important;
  border-top-right-radius: 5px !important;
  -webkit-border-top-left-radius: 5px !important;
  -moz-border-top-left-radius: 5px !important;
  -ms-border-top-left-radius: 5px !important;
  -o-border-top-left-radius: 5px !important;
  border-top-left-radius: 5px !important; }
  .panel-heading img {
    padding: 10px 0 10px 0; }

.control-label {
  font-weight: normal; }

.modal-body {
  background-color: white !important; }

.modal-body label {
  font-weight: 100 !important; }

.modal-title {
  color: #1a1a1a !important; }

.form-group {
  margin-bottom: 5px !important; }

.h1, .h2, .h3, h1, h2, h3 {
  margin-top: 10px !important;
  margin-bottom: 10px; }

.canvas-wrapper-block {
  cursor: not-allowed;
  pointer-events: none; }

/*------------------------------------*    $TEXTURES
\*------------------------------------*/
/*
 * Definim els degradats, backgrounds que afectin a tots els components dels estils 
 */
.alert {
  -webkit-border-top-right-radius: 6px !important;
  -moz-border-top-right-radius: 6px !important;
  -ms-border-top-right-radius: 6px !important;
  -o-border-top-right-radius: 6px !important;
  border-top-right-radius: 6px !important;
  -webkit-border-top-left-radius: 6px !important;
  -moz-border-top-left-radius: 6px !important;
  -ms-border-top-left-radius: 6px !important;
  -o-border-top-left-radius: 6px !important;
  border-top-left-radius: 6px !important;
  -webkit-border-bottom-right-radius: 6px !important;
  -moz-border-bottom-right-radius: 6px !important;
  -ms-border-bottom-right-radius: 6px !important;
  -o-border-bottom-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
  -webkit-border-bottom-left-radius: 6px !important;
  -moz-border-bottom-left-radius: 6px !important;
  -ms-border-bottom-left-radius: 6px !important;
  -o-border-bottom-left-radius: 6px !important;
  border-bottom-left-radius: 6px !important;
  width: 20% !important;
  position: fixed;
  left: 50%;
  top: 13%;
  z-index: 11;
  margin: auto 0 0 -10% !important;
  text-align: center; }

.alert--fons {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
  background-color: #333;
  opacity: 0.6; }

.alert-success {
  border-color: #b4deb4; }

.alert-danger {
  border-color: #f0b5b3; }

.alert-dismissible .close {
  top: 0 !important; }

.shadow--alerts {
  -webkit-box-shadow: 4px 4px 0px rgba(0, 0, 0, 0.25) !important;
  box-shadow: 4px 4px 0px rgba(0, 0, 0, 0.25) !important; }

.panel--heading__grey {
  background-color: #e6e6e6 !important; }

.panel--heading__white {
  background-color: white !important; }

/*------------------------------------*    $BREAKPOINTS
\*------------------------------------*/
/*
 * Definim els Breakpoints
 */
@media all and (max-width: 37.5em) {
  .login {
    position: inherit;
    left: inherit;
    top: inherit;
    margin: 100px auto !important; }
  .alert {
    width: 80% !important;
    position: fixed;
    left: 20%;
    z-index: 11;
    margin: auto 0 0 -10% !important;
    text-align: center; } }

@media all and (max-width: 56.25em) {
  .alert {
    width: 80% !important;
    position: fixed;
    left: 20%;
    z-index: 11;
    margin: auto 0 0 -10% !important;
    text-align: center; }
  .padding-5 {
    padding: none !important; } }