@charset "UTF-8";

.icon:before,button,select {
  text-transform: none;
}

hr,img {
  border: 0;
}

body,figure {
  margin: 0;
}

.clearfix:after,.container-fluid:after,.container:after,.form-horizontal .form-group:after,.masonry:after,.masonry>div:after,.row:after {
  clear: both;
}

#about .slider.transitioned .front,.invisible {
  visibility: hidden;
}

@font-face {
  /*font-family:Roboto;font-style:normal;font-weight:100;src:local('Roboto Thin'),local('Roboto-Thin'),url(https://fonts.gstatic.com/s/roboto/v15/Jzo62I39jc0gQRrbndN6nfesZW2xOQ-xsNqO47m55DA.ttf) format('truetype');*/
}

@font-face {
  /*font-family:Roboto;font-style:normal;font-weight:400;src:local('Roboto'),local('Roboto-Regular'),url(https://fonts.gstatic.com/s/roboto/v15/zN7GBFwfMP4uA6AR0HCoLQ.ttf) format('truetype');*/
}

@font-face {
  /*font-family:Roboto;font-style:normal;font-weight:700;src:local('Roboto Bold'),local('Roboto-Bold'),url(https://fonts.gstatic.com/s/roboto/v15/d-6IYplOFocCacKzxwXSOKCWcynf_cDxXwCLxiixG1c.ttf) format('truetype');*/
}

@font-face {
  /*font-family:Roboto;font-style:italic;font-weight:400;src:local('Roboto Italic'),local('Roboto-Italic'),url(https://fonts.gstatic.com/s/roboto/v15/W4wDsBUluyw0tK3tykhXEfesZW2xOQ-xsNqO47m55DA.ttf) format('truetype');*/
}

@font-face {
  /*font-family:'Roboto Condensed';font-style:normal;font-weight:400;src:local('Roboto Condensed'),local('RobotoCondensed-Regular'),url(https://fonts.gstatic.com/s/robotocondensed/v13/Zd2E9abXLFGSr9G3YK2MsDR-eWpsHSw83BRsAQElGgc.ttf) format('truetype');*/
}

@font-face {
  /*font-family:'Roboto Condensed';font-style:normal;font-weight:700;src:local('Roboto Condensed Bold'),local('RobotoCondensed-Bold'),url(https://fonts.gstatic.com/s/robotocondensed/v13/b9QBgL0iMZfDSpmcXcE8nDokq8qT6AIiNJ07Vf_NrVA.ttf) format('truetype');*/
}

@font-face {
  font-family:'Roboto Slab';font-style:normal;font-weight:300;src:local('Roboto Slab Light'),local('RobotoSlab-Light'),url(https://fonts.gstatic.com/s/robotoslab/v6/dazS1PrQQuCxC3iOAJFEJbfB31yxOzP-czbf6AAKCVo.ttf) format('truetype');
}

@font-face {
  font-family:'Roboto Slab';font-style:normal;font-weight:700;src:local('Roboto Slab Bold'),local('RobotoSlab-Bold'),url(https://fonts.gstatic.com/s/robotoslab/v6/dazS1PrQQuCxC3iOAJFEJZ_TkvowlIOtbR7ePgFOpF4.ttf) format('truetype');
}

@font-face {
  font-family:icons;src:url(../fonts/icons-f26137dd43.eot);src:url(../fonts/icons-f26137dd43.eot?#iefix) format("embedded-opentype"),url(../fonts/icons-7d8946e02c.woff) format("woff"),url(../fonts/icons-189da1f2cd.ttf) format("truetype"),url(../fonts/icons-b093892779.svg#icons) format("svg");font-weight:400;font-style:normal;
}

/* ******************* *
/* Basier Circle font */
/* ******************* */

/* Regular */
@font-face {
  font-family: basier;
  src: url(../fonts/basiercircle-regular-webfont.eot);
  src: url(../fonts/basiercircle-regular-webfont.eot?#iefix) format("embedded-opentype"),
  url(../fonts/basiercircle-regular-webfont.woff) format("woff"),
  url(../fonts/basiercircle-regular-webfont.ttf) format("truetype");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: basier-bold-italic;
  src: url(../fonts/basiercircle-bolditalic-webfont.eot);
  src: url(../fonts/basiercircle-bolditalic-webfont.eot?#iefix) format("embedded-opentype"),
  url(../fonts/basiercircle-bolditalic-webfont.woff) format("woff"),
  url(../fonts/basiercircle-bolditalic-webfont.ttf) format("truetype");
  font-weight: 600;
  font-style: normal;
}
/* Bold  */
@font-face {
  font-family: basier-bold;
  src: url(../fonts/basiercircle-bold-webfont.eot);
  src: url(../fonts/basiercircle-bold-webfont.eot?#iefix) format("embedded-opentype"),
  url(../fonts/basiercircle-bold-webfont.woff) format("woff"),
  url(../fonts/basiercircle-bold-webfont.ttf) format("truetype");
  font-weight: 600;
  font-style: normal;
}
/* Bold Italic */
@font-face {
  font-family: basier-bold-italic;
  src: url(../fonts/basiercircle-bolditalic-webfont.eot);
  src: url(../fonts/basiercircle-bolditalic-webfont.eot?#iefix) format("embedded-opentype"),
  url(../fonts/basiercircle-bolditalic-webfont.woff) format("woff"),
  url(../fonts/basiercircle-bolditalic-webfont.ttf) format("truetype");
  font-weight: 600;
  font-style: normal;
}


.icon:before {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  content: "";
  font-family: icons;
  font-style: normal;
  font-variant: normal;
  font-weight: 400;
  line-height: 1;
  speak: none;
}

.icon.-facebook:before {
  content: "";
}
.icon.-twitter {
  display: none !important;
}
.icon.-twitter:before {
  content: "";
}

.icon.-instagram:before {
  content: "";
}

.icon.-linkedin:before {
  content: "";
}

.icon.-vimeo:before {
  content: "";
}

.icon.-mail:before {
  content: "";
}

.icon.-external:before {
  content: "";
}

.icon.-close:before {
  content: "";
}

.icon.-share:before {
  content: "";
}
.icon.-prev {
  margin-left: 20px;
}
.icon.-prev:before {
  content: "\2039";
  font-size: 50px;
  font-weight: 300;
  font-family: inherit;
  margin-top: -19px;
  margin-left: -20px;
  position: absolute;
}

.icon.-next:after {
  content: "\203A";
  font-size: 50px;
  font-weight: 300;
  margin-top: -5px;
  margin-left: 10px;
  position: absolute;
}

.icon.-menu-toggler:before {
  content: "";
}

.icon.-menu-close:before {
  content: "";
}/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
   font-family: basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
   -ms-text-size-adjust: 100%;
   -webkit-text-size-adjust: 100%;
 }

.icon.-close-btn:before{
  background-image: url("../img/close-btn.png");
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 18px 18px;
  content: "";
  display: inline-block;
  height: 18px;
  vertical-align: sub;
  width: 18px;
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
  display: block;
}

audio,canvas,progress,video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],template {
  display: none;
}

a {
  background-color: transparent;
}

a:active,a:hover {
  outline: 0;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b,optgroup,strong {
  font-family: basier-bold,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: 700;
}

dfn {
  font-style: italic;
}

h1 {
  font-size: 2em;
  margin: .67em 0;
}

mark {
  background: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub,sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

.btn,img {
  vertical-align: middle;
}

sup {
  top: -.5em;
}

sub {
  bottom: -.25em;
}

svg:not(:root) {
  overflow: hidden;
}

hr {
  box-sizing: content-box;
  height: 0;
}

pre,textarea {
  overflow: auto;
}

code,kbd,pre,samp {
  font-family: monospace,monospace;
  font-size: 1em;
}

button,input,optgroup,select,textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

button {
  overflow: visible;
}

button,html input[type=button],input[type=reset],input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer;
}

button[disabled],html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input[type=checkbox],input[type=radio] {
  box-sizing: border-box;
  padding: 0;
}

input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
  height: auto;
}

input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,th {
  padding: 0;
}/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */@media print {
  blockquote,img,pre,tr {
    page-break-inside: avoid;
  }

  *,:after,:before {
    background: 0 0!important;
    color: #000!important;
    box-shadow: none!important;
    text-shadow: none!important;
  }

  a,a:visited {
    text-decoration: underline;
  }

  a[href]:after {
    content: " (" attr(href) ")";
  }

  abbr[title]:after {
    content: " (" attr(title) ")";
  }

  a[href^="#"]:after,a[href^="javascript:"]:after {
    content: "";
  }

  blockquote,pre {
    border: 1px solid #999;
  }

  thead {
    display: table-header-group;
  }

  img {
    max-width: 100%!important;
  }

  h2,h3,p {
    orphans: 3;
    widows: 3;
  }

  h2,h3 {
    page-break-after: avoid;
  }

  .navbar {
    display: none;
  }

  .btn>.caret,.dropup>.btn>.caret {
    border-top-color: #000!important;
  }

  .label {
    border: 1px solid #000;
  }

  .table {
    border-collapse: collapse!important;
  }

  .table td,.table th {
    background-color: #fff!important;
  }

  .table-bordered td,.table-bordered th {
    border: 1px solid #ddd!important;
  }
}

.btn,.btn-danger.active,.btn-danger:active,.btn-default.active,.btn-default:active,.btn-info.active,.btn-info:active,.btn-primary.active,.btn-primary:active,.btn-success.active,.btn-success:active,.btn-warning.active,.btn-warning:active,.form-control,.open>.btn-danger.dropdown-toggle,.open>.btn-default.dropdown-toggle,.open>.btn-info.dropdown-toggle,.open>.btn-primary.dropdown-toggle,.open>.btn-success.dropdown-toggle,.open>.btn-warning.dropdown-toggle {
  background-image: none;
}

.carousel-caption,.carousel-control {
  text-shadow: 0 1px 2px rgba(0,0,0,.6);
}

.form-control,.img-thumbnail,body {
  background-color: #fff;
}

*,:after,:before {
  box-sizing: border-box;
}

html {
  font-size: 10px;
  -webkit-tap-highlight-color: transparent;
}

body {
  font-family: basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size: 14px;
  line-height: 21px;
  color: #000000;
}

button,input,select,textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

a {
  text-decoration: none;
}

a:focus,a:hover {
  color: #23527c;
  text-decoration: underline;
}

a:focus {
  outline: dotted thin;
  outline: -webkit-focus-ring-color auto 5px;
  outline-offset: -2px;
}

.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}

.img-rounded {
  border-radius: 6px;
}

.img-thumbnail {
  padding: 4px;
  line-height: 21px;
  border: 1px solid #ddd;
  border-radius: 4px;
  transition: all .2s ease-in-out;
  display: inline-block;
  max-width: 100%;
  height: auto;
}

.container-fluid:after,.container-fluid:before,.row:after,.row:before {
  display: table;
  content: " ";
}

.img-circle {
  border-radius: 50%;
}

hr {
  margin-top: 21px;
  margin-bottom: 21px;
  border-top: 1px solid #eee;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
  -webkit-clip-path: initial !important;
  clip-path: initial !important;
}

.sr-only-focusable:active,.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}

.container,.container-fluid {
  margin-right: auto;
  margin-left: auto;
}

[role=button] {
  cursor: pointer;
}

@media (min-width:768px) {
  .container {
    width: 750px;
  }
}

@media (min-width:992px) {
  .container {
    width: 970px;
  }
}

@media screen and (device-width:991px) {

    /* fix home projects */
    /* home-isglobal-ar-2018 3 cols */
    .masonry > div .col:nth-child(3) {
        width: 50% !important;
    }
    /* home-crg 3 cols */
    .masonry > div .col:nth-child(24) {
        width: 50% !important;
    }
}

@media screen and (max-width:991px) and (min-width:768px){

    /* fix home projects */
    /* home-isglobal-ar-2018 3 cols */
    .masonry > div .col:nth-child(3) {
        width: 50% !important;
    }
    /* home-crg 3 cols */
    .masonry > div .col:nth-child(24) {
        width: 50% !important;
    }
}


@media (min-width:1200px) {
  .container {
    width: 1170px;
  }
}

.container-fluid {
  padding-left: 15px;
  padding-right: 15px;
}

.row {
  margin-left: -15px;
  margin-right: -15px;
}

.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}

fieldset,legend {
  padding: 0;
  border: 0;
}

.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9 {
  float: left;
}

.col-xs-1 {
  width: 8.33333%;
}

.col-xs-2 {
  width: 16.66667%;
}

.col-xs-3 {
  width: 25%;
}

.col-xs-4 {
  width: 33.33333%;
}

.col-xs-5 {
  width: 41.66667%;
}

.col-xs-6 {
  width: 50%;
}

.col-xs-7 {
  width: 58.33333%;
}

.col-xs-8 {
  width: 66.66667%;
}

.col-xs-9 {
  width: 75%;
}

.col-xs-10 {
  width: 83.33333%;
}

.col-xs-11 {
  width: 91.66667%;
}

.col-xs-12 {
  width: 100%;
}

.col-xs-pull-0 {
  right: auto;
}

.col-xs-pull-1 {
  right: 8.33333%;
}

.col-xs-pull-2 {
  right: 16.66667%;
}

.col-xs-pull-3 {
  right: 25%;
}

.col-xs-pull-4 {
  right: 33.33333%;
}

.col-xs-pull-5 {
  right: 41.66667%;
}

.col-xs-pull-6 {
  right: 50%;
}

.col-xs-pull-7 {
  right: 58.33333%;
}

.col-xs-pull-8 {
  right: 66.66667%;
}

.col-xs-pull-9 {
  right: 75%;
}

.col-xs-pull-10 {
  right: 83.33333%;
}

.col-xs-pull-11 {
  right: 91.66667%;
}

.col-xs-pull-12 {
  right: 100%;
}

.col-xs-push-0 {
  left: auto;
}

.col-xs-push-1 {
  left: 8.33333%;
}

.col-xs-push-2 {
  left: 16.66667%;
}

.col-xs-push-3 {
  left: 25%;
}

.col-xs-push-4 {
  left: 33.33333%;
}

.col-xs-push-5 {
  left: 41.66667%;
}

.col-xs-push-6 {
  left: 50%;
}

.col-xs-push-7 {
  left: 58.33333%;
}

.col-xs-push-8 {
  left: 66.66667%;
}

.col-xs-push-9 {
  left: 75%;
}

.col-xs-push-10 {
  left: 83.33333%;
}

.col-xs-push-11 {
  left: 91.66667%;
}

.col-xs-push-12 {
  left: 100%;
}

.col-xs-offset-0 {
  margin-left: 0;
}

.col-xs-offset-1 {
  margin-left: 8.33333%;
}

.col-xs-offset-2 {
  margin-left: 16.66667%;
}

.col-xs-offset-3 {
  margin-left: 25%;
}

.col-xs-offset-4 {
  margin-left: 33.33333%;
}

.col-xs-offset-5 {
  margin-left: 41.66667%;
}

.col-xs-offset-6 {
  margin-left: 50%;
}

.col-xs-offset-7 {
  margin-left: 58.33333%;
}

.col-xs-offset-8 {
  margin-left: 66.66667%;
}

.col-xs-offset-9 {
  margin-left: 75%;
}

.col-xs-offset-10 {
  margin-left: 83.33333%;
}

.col-xs-offset-11 {
  margin-left: 91.66667%;
}

.col-xs-offset-12 {
  margin-left: 100%;
}

@media (min-width:768px) {
  .col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9 {
    float: left;
  }

  .col-sm-1 {
    width: 8.33333%;
  }

  .col-sm-2 {
    width: 16.66667%;
  }

  .col-sm-3 {
    width: 25%;
  }

  .col-sm-4 {
    width: 33.33333%;
  }

  .col-sm-5 {
    width: 41.66667%;
  }

  .col-sm-6 {
    width: 50%;
  }

  .col-sm-7 {
    width: 58.33333%;
  }

  .col-sm-8 {
    width: 66.66667%;
  }

  .col-sm-9 {
    width: 75%;
  }

  .col-sm-10 {
    width: 83.33333%;
  }

  .col-sm-11 {
    width: 91.66667%;
  }

  .col-sm-12 {
    width: 100%;
  }

  .col-sm-pull-0 {
    right: auto;
  }

  .col-sm-pull-1 {
    right: 8.33333%;
  }

  .col-sm-pull-2 {
    right: 16.66667%;
  }

  .col-sm-pull-3 {
    right: 25%;
  }

  .col-sm-pull-4 {
    right: 33.33333%;
  }

  .col-sm-pull-5 {
    right: 41.66667%;
  }

  .col-sm-pull-6 {
    right: 50%;
  }

  .col-sm-pull-7 {
    right: 58.33333%;
  }

  .col-sm-pull-8 {
    right: 66.66667%;
  }

  .col-sm-pull-9 {
    right: 75%;
  }

  .col-sm-pull-10 {
    right: 83.33333%;
  }

  .col-sm-pull-11 {
    right: 91.66667%;
  }

  .col-sm-pull-12 {
    right: 100%;
  }

  .col-sm-push-0 {
    left: auto;
  }

  .col-sm-push-1 {
    left: 8.33333%;
  }

  .col-sm-push-2 {
    left: 16.66667%;
  }

  .col-sm-push-3 {
    left: 25%;
  }

  .col-sm-push-4 {
    left: 33.33333%;
  }

  .col-sm-push-5 {
    left: 41.66667%;
  }

  .col-sm-push-6 {
    left: 50%;
  }

  .col-sm-push-7 {
    left: 58.33333%;
  }

  .col-sm-push-8 {
    left: 66.66667%;
  }

  .col-sm-push-9 {
    left: 75%;
  }

  .col-sm-push-10 {
    left: 83.33333%;
  }

  .col-sm-push-11 {
    left: 91.66667%;
  }

  .col-sm-push-12 {
    left: 100%;
  }

  .col-sm-offset-0 {
    margin-left: 0;
  }

  .col-sm-offset-1 {
    margin-left: 8.33333%;
  }

  .col-sm-offset-2 {
    margin-left: 16.66667%;
  }

  .col-sm-offset-3 {
    margin-left: 25%;
  }

  .col-sm-offset-4 {
    margin-left: 33.33333%;
  }

  .col-sm-offset-5 {
    margin-left: 41.66667%;
  }

  .col-sm-offset-6 {
    margin-left: 50%;
  }

  .col-sm-offset-7 {
    margin-left: 58.33333%;
  }

  .col-sm-offset-8 {
    margin-left: 66.66667%;
  }

  .col-sm-offset-9 {
    margin-left: 75%;
  }

  .col-sm-offset-10 {
    margin-left: 83.33333%;
  }

  .col-sm-offset-11 {
    margin-left: 91.66667%;
  }

  .col-sm-offset-12 {
    margin-left: 100%;
  }
}

@media (min-width:992px) {
  .col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9 {
    float: left;
  }

  .col-md-1 {
    width: 8.33333%;
  }

  .col-md-2 {
    width: 16.66667%;
  }

  .col-md-3 {
    width: 25%;
  }

  .col-md-4 {
    width: 33.33333%;
  }

  .col-md-5 {
    width: 41.66667%;
  }

  .col-md-6 {
    width: 50%;
  }

  .col-md-7 {
    width: 58.33333%;
  }

  .col-md-8 {
    width: 66.66667%;
  }

  .col-md-9 {
    width: 75%;
  }

  .col-md-10 {
    width: 83.33333%;
  }

  .col-md-11 {
    width: 91.66667%;
  }

  .col-md-12 {
    width: 100%;
  }

  .col-md-pull-0 {
    right: auto;
  }

  .col-md-pull-1 {
    right: 8.33333%;
  }

  .col-md-pull-2 {
    right: 16.66667%;
  }

  .col-md-pull-3 {
    right: 25%;
  }

  .col-md-pull-4 {
    right: 33.33333%;
  }

  .col-md-pull-5 {
    right: 41.66667%;
  }

  .col-md-pull-6 {
    right: 50%;
  }

  .col-md-pull-7 {
    right: 58.33333%;
  }

  .col-md-pull-8 {
    right: 66.66667%;
  }

  .col-md-pull-9 {
    right: 75%;
  }

  .col-md-pull-10 {
    right: 83.33333%;
  }

  .col-md-pull-11 {
    right: 91.66667%;
  }

  .col-md-pull-12 {
    right: 100%;
  }

  .col-md-push-0 {
    left: auto;
  }

  .col-md-push-1 {
    left: 8.33333%;
  }

  .col-md-push-2 {
    left: 16.66667%;
  }

  .col-md-push-3 {
    left: 25%;
  }

  .col-md-push-4 {
    left: 33.33333%;
  }

  .col-md-push-5 {
    left: 41.66667%;
  }

  .col-md-push-6 {
    left: 50%;
  }

  .col-md-push-7 {
    left: 58.33333%;
  }

  .col-md-push-8 {
    left: 66.66667%;
  }

  .col-md-push-9 {
    left: 75%;
  }

  .col-md-push-10 {
    left: 83.33333%;
  }

  .col-md-push-11 {
    left: 91.66667%;
  }

  .col-md-push-12 {
    left: 100%;
  }

  .col-md-offset-0 {
    margin-left: 0;
  }

  .col-md-offset-1 {
    margin-left: 8.33333%;
  }

  .col-md-offset-2 {
    margin-left: 16.66667%;
  }

  .col-md-offset-3 {
    margin-left: 25%;
  }

  .col-md-offset-4 {
    margin-left: 33.33333%;
  }

  .col-md-offset-5 {
    margin-left: 41.66667%;
  }

  .col-md-offset-6 {
    margin-left: 50%;
  }

  .col-md-offset-7 {
    margin-left: 58.33333%;
  }

  .col-md-offset-8 {
    margin-left: 66.66667%;
  }

  .col-md-offset-9 {
    margin-left: 75%;
  }

  .col-md-offset-10 {
    margin-left: 83.33333%;
  }

  .col-md-offset-11 {
    margin-left: 91.66667%;
  }

  .col-md-offset-12 {
    margin-left: 100%;
  }
}

@media (min-width:1200px) {
  .col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9 {
    float: left;
  }

  .col-lg-1 {
    width: 8.33333%;
  }

  .col-lg-2 {
    width: 16.66667%;
  }

  .col-lg-3 {
    width: 25%;
  }

  .col-lg-4 {
    width: 33.33333%;
  }

  .col-lg-5 {
    width: 41.66667%;
  }

  .col-lg-6 {
    width: 50%;
  }

  .col-lg-7 {
    width: 58.33333%;
  }

  .col-lg-8 {
    width: 66.66667%;
  }

  .col-lg-9 {
    width: 75%;
  }

  .col-lg-10 {
    width: 83.33333%;
  }

  .col-lg-11 {
    width: 91.66667%;
  }

  .col-lg-12 {
    width: 100%;
  }

  .col-lg-pull-0 {
    right: auto;
  }

  .col-lg-pull-1 {
    right: 8.33333%;
  }

  .col-lg-pull-2 {
    right: 16.66667%;
  }

  .col-lg-pull-3 {
    right: 25%;
  }

  .col-lg-pull-4 {
    right: 33.33333%;
  }

  .col-lg-pull-5 {
    right: 41.66667%;
  }

  .col-lg-pull-6 {
    right: 50%;
  }

  .col-lg-pull-7 {
    right: 58.33333%;
  }

  .col-lg-pull-8 {
    right: 66.66667%;
  }

  .col-lg-pull-9 {
    right: 75%;
  }

  .col-lg-pull-10 {
    right: 83.33333%;
  }

  .col-lg-pull-11 {
    right: 91.66667%;
  }

  .col-lg-pull-12 {
    right: 100%;
  }

  .col-lg-push-0 {
    left: auto;
  }

  .col-lg-push-1 {
    left: 8.33333%;
  }

  .col-lg-push-2 {
    left: 16.66667%;
  }

  .col-lg-push-3 {
    left: 25%;
  }

  .col-lg-push-4 {
    left: 33.33333%;
  }

  .col-lg-push-5 {
    left: 41.66667%;
  }

  .col-lg-push-6 {
    left: 50%;
  }

  .col-lg-push-7 {
    left: 58.33333%;
  }

  .col-lg-push-8 {
    left: 66.66667%;
  }

  .col-lg-push-9 {
    left: 75%;
  }

  .col-lg-push-10 {
    left: 83.33333%;
  }

  .col-lg-push-11 {
    left: 91.66667%;
  }

  .col-lg-push-12 {
    left: 100%;
  }

  .col-lg-offset-0 {
    margin-left: 0;
  }

  .col-lg-offset-1 {
    margin-left: 8.33333%;
  }

  .col-lg-offset-2 {
    margin-left: 16.66667%;
  }

  .col-lg-offset-3 {
    margin-left: 25%;
  }

  .col-lg-offset-4 {
    margin-left: 33.33333%;
  }

  .col-lg-offset-5 {
    margin-left: 41.66667%;
  }

  .col-lg-offset-6 {
    margin-left: 50%;
  }

  .col-lg-offset-7 {
    margin-left: 58.33333%;
  }

  .col-lg-offset-8 {
    margin-left: 66.66667%;
  }

  .col-lg-offset-9 {
    margin-left: 75%;
  }

  .col-lg-offset-10 {
    margin-left: 83.33333%;
  }

  .col-lg-offset-11 {
    margin-left: 91.66667%;
  }

  .col-lg-offset-12 {
    margin-left: 100%;
  }
}

fieldset {
  margin: 0;
  min-width: 0;
}

legend {
  display: block;
  width: 100%;
  margin-bottom: 21px;
  font-size: 21px;
  line-height: inherit;
  color: #000000;
  border-bottom: 1px solid #e5e5e5;
}

label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-family: basier-bold,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: 700;
}

input[type=search] {
  box-sizing: border-box;
  -webkit-appearance: none;
}

input[type=checkbox],input[type=radio] {
  margin: 4px 0 0;
  margin-top: 1px\9;
  line-height: normal;
}

.form-control,output {
  font-size: 14px;
  line-height: 21px;
  color: #555;
  display: block;
}

input[type=file] {
  display: block;
}

input[type=range] {
  display: block;
  width: 100%;
}

select[multiple],select[size] {
  height: auto;
}

input[type=checkbox]:focus,input[type=radio]:focus,input[type=file]:focus {
  outline: dotted thin;
  outline: -webkit-focus-ring-color auto 5px;
  outline-offset: -2px;
}

output {
  padding-top: 7px;
}

.form-control {
  width: 100%;
  height: 35px;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.form-control:focus {
  border-color: #66afe9;
  outline: 0;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
}

.form-control::-moz-placeholder {
  color: #999;
  opacity: 1;
}

.form-control:-ms-input-placeholder {
  color: #999;
}

.form-control::-webkit-input-placeholder {
  color: #999;
}

.has-success .checkbox,.has-success .checkbox-inline,.has-success .control-label,.has-success .form-control-feedback,.has-success .help-block,.has-success .radio,.has-success .radio-inline,.has-success.checkbox label,.has-success.checkbox-inline label,.has-success.radio label,.has-success.radio-inline label {
  color: #3c763d;
}

.form-control::-ms-expand {
  border: 0;
  background-color: transparent;
}

.form-control[disabled],.form-control[readonly],fieldset[disabled] .form-control {
  background-color: #eee;
  opacity: 1;
}

.form-control[disabled],fieldset[disabled] .form-control {
  cursor: not-allowed;
}

textarea.form-control {
  height: auto;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  input[type=date].form-control,input[type=time].form-control,input[type=datetime-local].form-control,input[type=month].form-control {
    line-height: 35px;
  }

  .input-group-sm input[type=date],.input-group-sm input[type=time],.input-group-sm input[type=datetime-local],.input-group-sm input[type=month],input[type=date].input-sm,input[type=time].input-sm,input[type=datetime-local].input-sm,input[type=month].input-sm {
    line-height: 30px;
  }

  .input-group-lg input[type=date],.input-group-lg input[type=time],.input-group-lg input[type=datetime-local],.input-group-lg input[type=month],input[type=date].input-lg,input[type=time].input-lg,input[type=datetime-local].input-lg,input[type=month].input-lg {
    line-height: 46px;
  }
}

.form-group {
  margin-bottom: 15px;
}

.checkbox,.radio {
  position: relative;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}

.checkbox label,.radio label {
  min-height: 21px;
  padding-left: 20px;
  margin-bottom: 0;
  font-weight: 400;
  cursor: pointer;
}

.checkbox input[type=checkbox],.checkbox-inline input[type=checkbox],.radio input[type=radio],.radio-inline input[type=radio] {
  position: absolute;
  margin-left: -20px;
  margin-top: 4px\9;
}

.checkbox+.checkbox,.radio+.radio {
  margin-top: -5px;
}

.checkbox-inline,.radio-inline {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  margin-bottom: 0;
  vertical-align: middle;
  font-weight: 400;
  cursor: pointer;
}

.checkbox-inline+.checkbox-inline,.radio-inline+.radio-inline {
  margin-top: 0;
  margin-left: 10px;
}

.checkbox-inline.disabled,.checkbox.disabled label,.radio-inline.disabled,.radio.disabled label,fieldset[disabled] .checkbox label,fieldset[disabled] .checkbox-inline,fieldset[disabled] .radio label,fieldset[disabled] .radio-inline,fieldset[disabled] input[type=checkbox],fieldset[disabled] input[type=radio],input[type=checkbox].disabled,input[type=checkbox][disabled],input[type=radio].disabled,input[type=radio][disabled] {
  cursor: not-allowed;
}

.form-control-static {
  padding-top: 7px;
  padding-bottom: 7px;
  margin-bottom: 0;
  min-height: 35px;
}

.form-control-static.input-lg,.form-control-static.input-sm {
  padding-left: 0;
  padding-right: 0;
}

.form-group-sm .form-control,.input-sm {
  padding: 5px 10px;
  border-radius: 3px;
  font-size: 12px;
}

.input-sm {
  height: 30px;
  line-height: 1.5;
}

select.input-sm {
  height: 30px;
  line-height: 30px;
}

select[multiple].input-sm,textarea.input-sm {
  height: auto;
}

.form-group-sm .form-control {
  height: 30px;
  line-height: 1.5;
}

.form-group-lg .form-control,.input-lg {
  border-radius: 6px;
  padding: 10px 16px;
  font-size: 18px;
}

.form-group-sm select.form-control {
  height: 30px;
  line-height: 30px;
}

.form-group-sm select[multiple].form-control,.form-group-sm textarea.form-control {
  height: auto;
}

.form-group-sm .form-control-static {
  height: 30px;
  min-height: 33px;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.5;
}

.input-lg {
  height: 46px;
  line-height: 1.33333;
}

select.input-lg {
  height: 46px;
  line-height: 46px;
}

select[multiple].input-lg,textarea.input-lg {
  height: auto;
}

.form-group-lg .form-control {
  height: 46px;
  line-height: 1.33333;
}

.form-group-lg select.form-control {
  height: 46px;
  line-height: 46px;
}

.form-group-lg select[multiple].form-control,.form-group-lg textarea.form-control {
  height: auto;
}

.form-group-lg .form-control-static {
  height: 46px;
  min-height: 39px;
  padding: 11px 16px;
  font-size: 18px;
  line-height: 1.33333;
}

.has-feedback {
  position: relative;
}

.has-feedback .form-control {
  padding-right: 43.75px;
}

.form-control-feedback {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: block;
  width: 35px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  pointer-events: none;
}

.collapsing,.embed-responsive {
  position: relative;
  overflow: hidden;
}

.form-group-lg .form-control+.form-control-feedback,.input-group-lg+.form-control-feedback,.input-lg+.form-control-feedback {
  width: 46px;
  height: 46px;
  line-height: 46px;
}

.form-group-sm .form-control+.form-control-feedback,.input-group-sm+.form-control-feedback,.input-sm+.form-control-feedback {
  width: 30px;
  height: 30px;
  line-height: 30px;
}

.has-success .form-control {
  border-color: #3c763d;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}

.has-success .form-control:focus {
  border-color: #2b542c;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #67b168;
}

.has-success .input-group-addon {
  color: #3c763d;
  border-color: #3c763d;
  background-color: #dff0d8;
}

.has-warning .checkbox,.has-warning .checkbox-inline,.has-warning .control-label,.has-warning .form-control-feedback,.has-warning .help-block,.has-warning .radio,.has-warning .radio-inline,.has-warning.checkbox label,.has-warning.checkbox-inline label,.has-warning.radio label,.has-warning.radio-inline label {
  color: #8a6d3b;
}

.has-warning .form-control {
  border-color: #8a6d3b;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}

.has-warning .form-control:focus {
  border-color: #66512c;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #c0a16b;
}

.has-warning .input-group-addon {
  color: #8a6d3b;
  border-color: #8a6d3b;
  background-color: #fcf8e3;
}

.has-error .checkbox,.has-error .checkbox-inline,.has-error .control-label,.has-error .form-control-feedback,.has-error .help-block,.has-error .radio,.has-error .radio-inline,.has-error.checkbox label,.has-error.checkbox-inline label,.has-error.radio label,.has-error.radio-inline label {
  color: #a94442;
}

.has-error .form-control {
  border-color: #a94442;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}

.has-error .form-control:focus {
  border-color: #843534;
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483;
}

.has-error .input-group-addon {
  color: #a94442;
  border-color: #a94442;
  background-color: #f2dede;
}

.has-feedback label~.form-control-feedback {
  top: 26px;
}

.has-feedback label.sr-only~.form-control-feedback {
  top: 0;
}

.help-block {
  display: block;
  margin-top: 5px;
  margin-bottom: 10px;
  color: #737373;
}

@media (min-width:768px) {
  .form-inline .form-control-static,.form-inline .form-group {
    display: inline-block;
  }

  .form-inline .control-label,.form-inline .form-group {
    margin-bottom: 0;
    vertical-align: middle;
  }

  .form-inline .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle;
  }

  .form-inline .input-group {
    display: inline-table;
    vertical-align: middle;
  }

  .form-inline .input-group .form-control,.form-inline .input-group .input-group-addon,.form-inline .input-group .input-group-btn {
    width: auto;
  }

  .form-inline .input-group>.form-control {
    width: 100%;
  }

  .form-inline .checkbox,.form-inline .radio {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    vertical-align: middle;
  }

  .form-inline .checkbox label,.form-inline .radio label {
    padding-left: 0;
  }

  .form-inline .checkbox input[type=checkbox],.form-inline .radio input[type=radio] {
    position: relative;
    margin-left: 0;
  }

  .form-inline .has-feedback .form-control-feedback {
    top: 0;
  }

  .form-horizontal .control-label {
    text-align: right;
    margin-bottom: 0;
    padding-top: 7px;
  }
}

.form-horizontal .checkbox,.form-horizontal .checkbox-inline,.form-horizontal .radio,.form-horizontal .radio-inline {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 7px;
}

.form-horizontal .checkbox,.form-horizontal .radio {
  min-height: 28px;
}

article,html {
  min-height: 100%;
}

.form-horizontal .form-group {
  margin-left: -15px;
  margin-right: -15px;
}

.form-horizontal .form-group:after,.form-horizontal .form-group:before {
  content: " ";
  display: table;
}

#menu-toggler,#socialmenu,.btn,.carousel-caption,.carousel-control {
  text-align: center;
}

.form-horizontal .has-feedback .form-control-feedback {
  right: 15px;
}

@media (min-width:768px) {
  .form-horizontal .form-group-lg .control-label {
    padding-top: 11px;
    font-size: 18px;
  }

  .form-horizontal .form-group-sm .control-label {
    padding-top: 6px;
    font-size: 12px;
  }
}

.btn {
  display: inline-block;
  margin-bottom: 0;
  font-weight: 400;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 21px;
  border-radius: 4px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.btn.active.focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn:active:focus,.btn:focus {
  outline: dotted thin;
  outline: -webkit-focus-ring-color auto 5px;
  outline-offset: -2px;
}

.btn.focus,.btn:focus,.btn:hover {
  color: #000000;
  text-decoration: none;
}

.btn.active,.btn:active {
  outline: 0;
  background-image: none;
  box-shadow: inset 0 3px 5px rgba(0,0,0,.125);
}

.btn.disabled,.btn[disabled],fieldset[disabled] .btn {
  cursor: not-allowed;
  opacity: .65;
  filter: alpha(opacity=65);
  box-shadow: none;
}

a.btn.disabled,fieldset[disabled] a.btn {
  pointer-events: none;
}

.btn-default {
  color: #000000;
  background-color: #fff;
  border-color: #ccc;
}

.btn-default.focus,.btn-default:focus {
  color: #000000;
  background-color: #e6e6e6;
  border-color: #8c8c8c;
}

.btn-default.active,.btn-default:active,.btn-default:hover,.open>.btn-default.dropdown-toggle {
  color: #000000;
  background-color: #e6e6e6;
  border-color: #adadad;
}

.btn-default.active.focus,.btn-default.active:focus,.btn-default.active:hover,.btn-default:active.focus,.btn-default:active:focus,.btn-default:active:hover,.open>.btn-default.dropdown-toggle.focus,.open>.btn-default.dropdown-toggle:focus,.open>.btn-default.dropdown-toggle:hover {
  color: #000000;
  background-color: #d4d4d4;
  border-color: #8c8c8c;
}

.btn-default.disabled.focus,.btn-default.disabled:focus,.btn-default.disabled:hover,.btn-default[disabled].focus,.btn-default[disabled]:focus,.btn-default[disabled]:hover,fieldset[disabled] .btn-default.focus,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:hover {
  background-color: #fff;
  border-color: #ccc;
}

.btn-default .badge {
  color: #fff;
  background-color: #000000;
}

.btn-primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}

.btn-primary.focus,.btn-primary:focus {
  color: #fff;
  background-color: #286090;
  border-color: #122b40;
}

.btn-primary.active,.btn-primary:active,.btn-primary:hover,.open>.btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}

.btn-primary.active.focus,.btn-primary.active:focus,.btn-primary.active:hover,.btn-primary:active.focus,.btn-primary:active:focus,.btn-primary:active:hover,.open>.btn-primary.dropdown-toggle.focus,.open>.btn-primary.dropdown-toggle:focus,.open>.btn-primary.dropdown-toggle:hover {
  color: #fff;
  background-color: #204d74;
  border-color: #122b40;
}

.btn-primary.disabled.focus,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled].focus,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary.focus,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover {
  background-color: #337ab7;
  border-color: #2e6da4;
}

.btn-primary .badge {
  color: #337ab7;
  background-color: #fff;
}

.btn-success {
  color: #fff;
  background-color: #5cb85c;
  border-color: #4cae4c;
}

.btn-success.focus,.btn-success:focus {
  color: #fff;
  background-color: #449d44;
  border-color: #255625;
}

.btn-success.active,.btn-success:active,.btn-success:hover,.open>.btn-success.dropdown-toggle {
  color: #fff;
  background-color: #449d44;
  border-color: #398439;
}

.btn-success.active.focus,.btn-success.active:focus,.btn-success.active:hover,.btn-success:active.focus,.btn-success:active:focus,.btn-success:active:hover,.open>.btn-success.dropdown-toggle.focus,.open>.btn-success.dropdown-toggle:focus,.open>.btn-success.dropdown-toggle:hover {
  color: #fff;
  background-color: #398439;
  border-color: #255625;
}

.btn-success.disabled.focus,.btn-success.disabled:focus,.btn-success.disabled:hover,.btn-success[disabled].focus,.btn-success[disabled]:focus,.btn-success[disabled]:hover,fieldset[disabled] .btn-success.focus,fieldset[disabled] .btn-success:focus,fieldset[disabled] .btn-success:hover {
  background-color: #5cb85c;
  border-color: #4cae4c;
}

.btn-success .badge {
  color: #5cb85c;
  background-color: #fff;
}

.btn-info {
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
}

.btn-info.focus,.btn-info:focus {
  color: #fff;
  background-color: #31b0d5;
  border-color: #1b6d85;
}

.btn-info.active,.btn-info:active,.btn-info:hover,.open>.btn-info.dropdown-toggle {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}

.btn-info.active.focus,.btn-info.active:focus,.btn-info.active:hover,.btn-info:active.focus,.btn-info:active:focus,.btn-info:active:hover,.open>.btn-info.dropdown-toggle.focus,.open>.btn-info.dropdown-toggle:focus,.open>.btn-info.dropdown-toggle:hover {
  color: #fff;
  background-color: #269abc;
  border-color: #1b6d85;
}

.btn-info.disabled.focus,.btn-info.disabled:focus,.btn-info.disabled:hover,.btn-info[disabled].focus,.btn-info[disabled]:focus,.btn-info[disabled]:hover,fieldset[disabled] .btn-info.focus,fieldset[disabled] .btn-info:focus,fieldset[disabled] .btn-info:hover {
  background-color: #5bc0de;
  border-color: #46b8da;
}

.btn-info .badge {
  color: #5bc0de;
  background-color: #fff;
}

.btn-warning {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-warning.focus,.btn-warning:focus {
  color: #fff;
  background-color: #ec971f;
  border-color: #985f0d;
}

.btn-warning.active,.btn-warning:active,.btn-warning:hover,.open>.btn-warning.dropdown-toggle {
  color: #fff;
  background-color: #ec971f;
  border-color: #d58512;
}

.btn-warning.active.focus,.btn-warning.active:focus,.btn-warning.active:hover,.btn-warning:active.focus,.btn-warning:active:focus,.btn-warning:active:hover,.open>.btn-warning.dropdown-toggle.focus,.open>.btn-warning.dropdown-toggle:focus,.open>.btn-warning.dropdown-toggle:hover {
  color: #fff;
  background-color: #d58512;
  border-color: #985f0d;
}

.btn-warning.disabled.focus,.btn-warning.disabled:focus,.btn-warning.disabled:hover,.btn-warning[disabled].focus,.btn-warning[disabled]:focus,.btn-warning[disabled]:hover,fieldset[disabled] .btn-warning.focus,fieldset[disabled] .btn-warning:focus,fieldset[disabled] .btn-warning:hover {
  background-color: #f0ad4e;
  border-color: #eea236;
}

.btn-warning .badge {
  color: #f0ad4e;
  background-color: #fff;
}

.btn-danger {
  color: #fff;
  background-color: #d9534f;
  border-color: #d43f3a;
}

.btn-danger.focus,.btn-danger:focus {
  color: #fff;
  background-color: #c9302c;
  border-color: #761c19;
}

.btn-danger.active,.btn-danger:active,.btn-danger:hover,.open>.btn-danger.dropdown-toggle {
  color: #fff;
  background-color: #c9302c;
  border-color: #ac2925;
}

.btn-danger.active.focus,.btn-danger.active:focus,.btn-danger.active:hover,.btn-danger:active.focus,.btn-danger:active:focus,.btn-danger:active:hover,.open>.btn-danger.dropdown-toggle.focus,.open>.btn-danger.dropdown-toggle:focus,.open>.btn-danger.dropdown-toggle:hover {
  color: #fff;
  background-color: #ac2925;
  border-color: #761c19;
}

.btn-danger.disabled.focus,.btn-danger.disabled:focus,.btn-danger.disabled:hover,.btn-danger[disabled].focus,.btn-danger[disabled]:focus,.btn-danger[disabled]:hover,fieldset[disabled] .btn-danger.focus,fieldset[disabled] .btn-danger:focus,fieldset[disabled] .btn-danger:hover {
  background-color: #d9534f;
  border-color: #d43f3a;
}

.btn-danger .badge {
  color: #d9534f;
  background-color: #fff;
}

.btn-link {
  color: #337ab7;
  font-weight: 400;
  border-radius: 0;
}

.btn-link,.btn-link.active,.btn-link:active,.btn-link[disabled],fieldset[disabled] .btn-link {
  background-color: transparent;
  box-shadow: none;
}

.btn-link,.btn-link:active,.btn-link:focus,.btn-link:hover {
  border-color: transparent;
}

.btn-link:focus,.btn-link:hover {
  color: #23527c;
  text-decoration: underline;
  background-color: transparent;
}

.btn-link[disabled]:focus,.btn-link[disabled]:hover,fieldset[disabled] .btn-link:focus,fieldset[disabled] .btn-link:hover {
  color: #777;
  text-decoration: none;
}

.btn-lg {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.33333;
  border-radius: 6px;
}

.btn-sm,.btn-xs {
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

.btn-sm {
  padding: 5px 10px;
}

.btn-xs {
  padding: 1px 5px;
}

.btn-block {
  display: block;
  width: 100%;
}

.btn-block+.btn-block {
  margin-top: 5px;
}

input[type=button].btn-block,input[type=reset].btn-block,input[type=submit].btn-block {
  width: 100%;
}

.fade {
  opacity: 0;
  transition: opacity .15s linear;
}

.fade.in {
  opacity: 1;
}

.collapse {
  display: none;
}

.collapse.in {
  display: block;
}

tr.collapse.in {
  display: table-row;
}

tbody.collapse.in {
  display: table-row-group;
}

.collapsing {
  height: 0;
  transition-property: height,visibility;
  transition-duration: .35s;
  transition-timing-function: ease;
}

.thumbnail {
  display: block;
  padding: 4px;
  margin-bottom: 21px;
  line-height: 21px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  transition: border .2s ease-in-out;
}

.thumbnail a>img,.thumbnail>img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

.thumbnail .caption {
  padding: 9px;
  color: #000000;
}

a.thumbnail.active,a.thumbnail:focus,a.thumbnail:hover {
  border-color: #337ab7;
}

.embed-responsive {
  display: block;
  height: 0;
  padding: 0;
}

.embed-responsive .embed-responsive-item,.embed-responsive embed,.embed-responsive iframe,.embed-responsive object,.embed-responsive video {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  border: 0;
}

.carousel,.carousel-inner {
  position: relative;
}

.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}

.embed-responsive-4by3 {
  padding-bottom: 75%;
}

.carousel-inner {
  overflow: hidden;
  width: 100%;
}

.carousel-inner>.item {
  display: none;
  position: relative;
  transition: .6s ease-in-out left;
}

.carousel-inner>.item>a>img,.carousel-inner>.item>img {
  display: block;
  max-width: 100%;
  height: auto;
  line-height: 1;
}

@media all and (transform-3d),(-webkit-transform-3d) {
  .carousel-inner>.item {
    transition: -webkit-transform .6s ease-in-out;
    transition: transform .6s ease-in-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000px;
    perspective: 1000px;
  }

  .carousel-inner>.item.active.right,.carousel-inner>.item.next {
    -webkit-transform: translate3d(100%,0,0);
    transform: translate3d(100%,0,0);
    left: 0;
  }

  .carousel-inner>.item.active.left,.carousel-inner>.item.prev {
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0);
    left: 0;
  }

  .carousel-inner>.item.active,.carousel-inner>.item.next.left,.carousel-inner>.item.prev.right {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    left: 0;
  }
}

.carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev {
  display: block;
}

.carousel-inner>.active {
  left: 0;
}

.carousel-inner>.next,.carousel-inner>.prev {
  position: absolute;
  top: 0;
  width: 100%;
}

.carousel-inner>.next {
  left: 100%;
}

.carousel-inner>.prev {
  left: -100%;
}

.carousel-inner>.next.left,.carousel-inner>.prev.right {
  left: 0;
}

.carousel-inner>.active.left {
  left: -100%;
}

.carousel-inner>.active.right {
  left: 100%;
}

.carousel-control {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 15%;
  opacity: .5;
  filter: alpha(opacity=50);
  font-size: 20px;
  color: #fff;
  background-color: transparent;
}

.carousel-control.left {
  background-image: linear-gradient(to right,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
}

.carousel-control.right {
  left: auto;
  right: 0;
  background-image: linear-gradient(to right,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
}

.carousel-control:focus,.carousel-control:hover {
  outline: 0;
  color: #fff;
  text-decoration: none;
  opacity: .9;
  filter: alpha(opacity=90);
}

.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next,.carousel-control .icon-prev {
  position: absolute;
  top: 50%;
  margin-top: -10px;
  z-index: 5;
  display: inline-block;
}

.carousel-control .glyphicon-chevron-left,.carousel-control .icon-prev {
  left: 50%;
  margin-left: -10px;
}

.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next {
  right: 50%;
  margin-right: -10px;
}

.carousel-control .icon-next,.carousel-control .icon-prev {
  width: 20px;
  height: 20px;
  line-height: 1;
  font-family: serif;
}

.carousel-control .icon-prev:before {
  content: '\2039';
}

.carousel-control .icon-next:before {
  content: '\203a';
}

.carousel-indicators {
  position: absolute;
  bottom: 10px;
  left: 50%;
  z-index: 15;
  width: 60%;
  margin-left: -30%;
  padding-left: 0;
  list-style: none;
  text-align: center;
}

.carousel-indicators li {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 1px;
  text-indent: -999px;
  border: 1px solid #fff;
  border-radius: 10px;
  cursor: pointer;
  background-color: #000\9;
  background-color: transparent;
}

.carousel-indicators .active {
  margin: 0;
  width: 12px;
  height: 12px;
  background-color: #fff;
}

.carousel-caption {
  position: absolute;
  left: 15%;
  right: 15%;
  bottom: 20px;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
}

#header,.affix {
  position: fixed;
}

.carousel-caption .btn,.text-hide {
  text-shadow: none;
}

@media screen and (min-width:768px) {
  .carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next,.carousel-control .icon-prev {
    width: 30px;
    height: 30px;
    margin-top: -10px;
    font-size: 30px;
  }

  .carousel-control .glyphicon-chevron-left,.carousel-control .icon-prev {
    margin-left: -10px;
  }

  .carousel-control .glyphicon-chevron-right,.carousel-control .icon-next {
    margin-right: -10px;
  }

  .carousel-caption {
    left: 20%;
    right: 20%;
    padding-bottom: 30px;
  }

  .carousel-indicators {
    bottom: 20px;
  }
}

#header,#header-push {
  height: 84px;
}

#header,nav#mainmenu {
  top: 0;
  left: 0;
  right: 0;
}

.clearfix:after,.clearfix:before {
  content: " ";
  display: table;
}

.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.pull-right {
  float: right!important;
}

.pull-left {
  float: left!important;
}

.hide {
  display: none!important;
}

.show {
  display: block!important;
}

.hidden,.visible-lg,.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block,.visible-md,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-sm,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-xs,.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block {
  display: none!important;
}

.text-hide {
  font: 0/0 a;
  color: transparent;
  background-color: transparent;
  border: 0;
}

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

@media (max-width:767px) {
  .visible-xs {
    display: block!important;
  }

  table.visible-xs {
    display: table!important;
  }

  tr.visible-xs {
    display: table-row!important;
  }

  td.visible-xs,th.visible-xs {
    display: table-cell!important;
  }

  .visible-xs-block {
    display: block!important;
  }

  .visible-xs-inline {
    display: inline!important;
  }

  .visible-xs-inline-block {
    display: inline-block!important;
  }
}



/*@media and (max-width:991px) {*/
    /**/
/*}*/
@media (min-width:768px) and (max-width:991px) {
  .visible-sm {
    display: block!important;
  }

  table.visible-sm {
    display: table!important;
  }

  tr.visible-sm {
    display: table-row!important;
  }

  td.visible-sm,th.visible-sm {
    display: table-cell!important;
  }

  .visible-sm-block {
    display: block!important;
  }

  .visible-sm-inline {
    display: inline!important;
  }

  .visible-sm-inline-block {
    display: inline-block!important;
  }




}

@media (min-width:992px) and (max-width:1199px) {
  .visible-md {
    display: block!important;
  }

  table.visible-md {
    display: table!important;
  }

  tr.visible-md {
    display: table-row!important;
  }

  td.visible-md,th.visible-md {
    display: table-cell!important;
  }

  .visible-md-block {
    display: block!important;
  }

  .visible-md-inline {
    display: inline!important;
  }

  .visible-md-inline-block {
    display: inline-block!important;
  }


}

@media (min-width:1200px) {
  .visible-lg {
    display: block!important;
  }

  table.visible-lg {
    display: table!important;
  }

  tr.visible-lg {
    display: table-row!important;
  }

  td.visible-lg,th.visible-lg {
    display: table-cell!important;
  }

  .visible-lg-block {
    display: block!important;
  }

  .visible-lg-inline {
    display: inline!important;
  }

  .visible-lg-inline-block {
    display: inline-block!important;
  }

  .hidden-lg {
    display: none!important;
  }
}

@media (max-width:767px) {
  .hidden-xs {
    display: none!important;
  }
}

@media (min-width:768px) and (max-width:991px) {
  .hidden-sm {
    display: none!important;
  }
}

@media (min-width:992px) and (max-width:1199px) {
  .hidden-md {
    display: none!important;
  }
}

.visible-print {
  display: none!important;
}

@media print {
  .visible-print {
    display: block!important;
  }

  table.visible-print {
    display: table!important;
  }

  tr.visible-print {
    display: table-row!important;
  }

  td.visible-print,th.visible-print {
    display: table-cell!important;
  }
}

.visible-print-block {
  display: none!important;
}

@media print {
  .visible-print-block {
    display: block!important;
  }
}

.visible-print-inline {
  display: none!important;
}

@media print {
  .visible-print-inline {
    display: inline!important;
  }
}

.visible-print-inline-block {
  display: none!important;
}

@media print {
  .visible-print-inline-block {
    display: inline-block!important;
  }

  .hidden-print {
    display: none!important;
  }
}

html {
  position: relative;
}

body {
  height: 100%;
}

a,a:active,a:hover {
  text-decoration: none;
  color: #000000;
}

.icon {
  font-size: 1.5em;
}

.lazy-center {
  opacity: 0!important;
  background-image: none!important;
}

.container {
  width: 100%;
  margin: 0 auto;
  padding-left: 10px;
  padding-right: 10px;
}

.container:after,.container:before {
  content: " ";
  display: table;
}


[role=button] {
  cursor: pointer;
}


/* Proyectos */

/*fondo blanco*/

#project-i2cat-ar-2015 #prev-project.white,
#project-i2cat-ar-2015 #next-project.white,
#project-ced-formacion #prev-project.white,
#project-ced-formacion #next-project.white,
#project-icrea-videos #prev-project.white,
#project-icrea-videos #next-project.white,
#project-modernismo-2016 #prev-project.white,
#project-modernismo-2016 #next-project.white {
  color: #000000;
}

.white {
  color: white;
}

.white-bg #prev-project.white,
.white-bg #next-project.white{
  color: #000000;
}

i.i-arrow-down{
  background: rgba(0, 0, 0, 0) url("../img/arrow-down.svg") no-repeat scroll 0 0 / 56px 56px;
  display: inline-block;
  height: 56px;
  width: 56px;
}

.scroll-down {
  height: 50px;
  left: calc(50% - 50px);
  margin: 0;
  padding: 0;
  position: fixed;
  right: auto;
  text-align: center;
  top: 90vh;
  width: 100px;
  z-index: 100;
}

/* excepciones color scroll down*/
#project-crg-annual-report-2015 i.i-arrow-down,
#project-icrea-15 i.i-arrow-down,
#project-icrea i.i-arrow-down,
#project-hospital-santpau i.i-arrow-down,
#project-vhir i.i-arrow-down,
#project-ced i.i-arrow-down,
#project-blog-santpau i.i-arrow-down,
#project-arvhir i.i-arrow-down,
#project-vintacap i.i-arrow-down,
#project-sant-pau-recerca i.i-arrow-down,
#project-isglobal i.i-arrow-down{
  background: url("../img/arrow-down-white-bg.svg") no-repeat scroll 0 0 / 56px 56px;
  display: inline-block;
  height: 56px;
  width: 56px;
}

#project-crg-annual-report-2015 .scroll-down,
#project-icrea-15 .scroll-down,
#project-icrea .scroll-down,
#project-hospital-santpau .scroll-down,
#project-vhir .scroll-down,
#project-ced .scroll-down,
#project-blog-santpau .scroll-down,
#project-arvhir .scroll-down,
#project-vintacap .scroll-down,
#project-sant-pau-recerca .scroll-down,
#project-isglobal .scroll-down{
  color: #fff;
}


.scroll-down > span {
  display: inline-block;
  width: 100%;
}

@media (min-width:768px) {
  .container {
    width: 768px;
  }
}

@media (min-width:992px) {
  .container {
    width: 960px;
  }
}

@-webkit-keyframes brand-animation {
  0%,5% {
    background-position: 0 0;
  }

  10%,15% {
    background-position: 0 -60px;
  }

  20%,25% {
    background-position: 0 -120px;
  }

  30%,35% {
    background-position: 0 -180px;
  }

  40%,45% {
    background-position: 0 -240px;
  }

  50%,55% {
    background-position: 0 -300px;
  }

  60%,65% {
    background-position: 0 -360px;
  }

  100%,70% {
    background-position: 0 -420px;
  }
}

@keyframes brand-animation {
  0%,5% {
    background-position: 0 0;
  }

  10%,15% {
    background-position: 0 -60px;
  }

  20%,25% {
    background-position: 0 -120px;
  }

  30%,35% {
    background-position: 0 -180px;
  }

  40%,45% {
    background-position: 0 -240px;
  }

  50%,55% {
    background-position: 0 -300px;
  }

  60%,65% {
    background-position: 0 -360px;
  }

  100%,70% {
    background-position: 0 -420px;
  }
}

#header {
  min-height: 74px;
  z-index: 100;
}

#header .container {
  position: relative;
  height: 74px;
  padding-left: 50px;
}

#header nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

#header nav li {
  display: inline;
}

#header #brand {
  display: block;
  margin: 11px auto 0;
  float: none;
  width: 208px;
  height: 64px;
  transition: all .2s;
}

body.es #header #brand {
  background-image: url(../img/brand/brand-xs-es-e50db87a53.svg);
}

.no-svg body.es #header #brand {
  background-image: url(../img/brand/brand-xs-es-9f9076d9ad.png);
}

body.ca #header #brand {
  background-image: url(../img/brand/brand-xs-ca-56b56c1fb2.svg);
}

.no-svg body.ca #header #brand {
  background-image: url(../img/brand/brand-xs-ca-96a74d697b.png);
}

body.en #header #brand {
  background-image: url(../img/brand/brand-xs-en-a08d135a7f.svg);
}

.no-svg body.en #header #brand {
  background-image: url(../img/brand/brand-xs-en-77b34bb4e5.png);
}

#header #brand h1,#header #brand h2 {
  display: none;
}

#header.affix {
  background: rgba(255,255,255,.5);
}

#header.affix #brand {
  margin-top: 19px;
  background-position: 0 -6px;
  width: 32px;
  border-radius: 50%;
  height: 40px;
}

#menu-toggler,
#m-close-btn{
  position: fixed;
  top: 6px;
  left: 5px;
  display: block;
  width: 60px;
  height: 60px;
  padding-top: 13px;
  font-size: 24px;
  z-index: 120;
}

#m-close-btn{
  display: none;
}

#menu-toggler .-menu-close {
  display: none;
  color: #b8b8b8;
}
#close.color.white {
  color: #fff !important;
}
#close.color.black {
  color: #000 !important;
}
nav#mainmenu {
  position: fixed;
  bottom: 0;
  padding: 35px 50px;
  background: #ebebeb;
  z-index: 110;
}

nav#mainmenu .brand-o {
  background-image: url(../img/brand-o-xs-445ccf2239.svg);
  display: block;
  width: 46px;
  height: 46px;
  margin: 0 auto;
}

.no-svg nav#mainmenu .brand-o {
  background-image: url(../img/brand-o-xs-b9d531f381.png);
}

nav#mainmenu ul {
  margin-top: 82px;
  border-top: 1px solid #797979;
}

nav#mainmenu ul li {
  display: block;
  border-bottom: 1px solid #797979;
}

nav#mainmenu ul a {
  display: block;
  padding: 19px 0 17px;
  font: 18px basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
}
nav#mainmenu ul a:hover {
  text-decoration: underline;
}

#langmenu,#socialmenu {
  z-index: 111;
  position: fixed;
}

#langmenu {
  top: 120px;
  font-size: 16px;
}

#langmenu li+li {
  margin-left: 10px;
}

#langmenu li.active>a {
  /*text-decoration: underline;*/
  font-weight: bold;
}

#langmenu,#langmenu a {
  color: silver;
}

#socialmenu {
  z-index: 111;
  top: 465px;
  left: 30px;
  right: 38px;
}

#socialmenu a {
  color: #797979;
}

#socialmenu .icon {
  float: left;
  display: block;
  width: 20%;
  font-size: 36px;
}

#langmenu,#mainmenu,#socialmenu {
  display: none;
}

.menu-open #langmenu,.menu-open #mainmenu,.menu-open #socialmenu {
  display: block;
}

.menu-open #menu-toggler .-menu-toggler {
  display: none;
}

.menu-open #menu-toggler .-menu-close {
  display: inline-block;
}

@media (min-width:768px) {
  #header,#header-push {
    height: 180px;
  }

  #header {
    min-height: 100px;
  }

  #header .container {
    position: absolute;
    padding: 50px 0 0;
    left: 60px;
    right: 60px;
    width: auto;
    top: 50%;
    height: 100px;
    margin-top: -50px;
    max-width: 1400px;
  }

  nav#langmenu,nav#mainmenu {
    position: absolute;
    right: 0;
  }

  #header #brand {
    display: block;
    margin: 0;
    position: absolute;
    top: 25px;
    left: 0;
    background: no-repeat;
    width: 210px;
    height: 70px;
    transition: all .2s;
  }

  #header #brand h1,#header #brand h2 {
    display: none;
  }

  #header #brand:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 60px;
    height: 55px;
    width: 600px;
    background-position: 0 -420px;
    background-image: url(../img/brand/brand-seq1-ef86b7e968.svg);
  }

  #header #brand{
    background-image: url(../img/brand/brand-seq1-ef86b7e968.svg);
  }

  .no-svg #header #brand:after {
    background-image: url(../img/brand/brand-seq1-6f56fb52a4.png);
  }

  #header #brand.anim:after {
    background-position: 0 60px;
    /*background-position: 0 0px;*/
    /*-webkit-animation: brand-animation 8s ease-out .5s forwards;*/
    /*animation: brand-animation 8s ease-out .5s forwards;*/
  }

  #header #brand.seq1:after {
    background-image: url(../img/brand/brand-seq1-ef86b7e968.svg);
  }

  .no-svg #header #brand.seq1:after {
    background-image: url(../img/brand/brand-seq1-6f56fb52a4.png);
  }

  #header #brand.seq2:after {
    background-image: url(../img/brand/brand-seq2-cff6516c42.svg);
  }

  .no-svg #header #brand.seq2:after {
    background-image: url(../img/brand/brand-seq2-625366b504.png);
  }

  #header #brand.seq3:after {
    background-image: url(../img/brand/brand-seq3-40cf4d3b60.svg);
  }

  .no-svg #header #brand.seq3:after {
    background-image: url(../img/brand/brand-seq3-183a9ec90e.png);
  }

  body.es #header #brand {
    background-image: url(../img/brand/brand-es-a3147d983e.svg);
  }

  .no-svg body.es #header #brand {
    background-image: url(../img/brand/brand-es-2fb5756ec2.png);
  }

  body.ca #header #brand {
    background-image: url(../img/brand/brand-ca-61110a2964.svg);
  }

  .no-svg body.ca #header #brand {
    background-image: url(../img/brand/brand-ca-96407254a5.png);
  }

  body.en #header #brand {
    background-image: url(../img/brand/brand-en-fffc9dacff.svg);
  }

  .no-svg body.en #header #brand {
    background-image: url(../img/brand/brand-en-d27da5b9ad.png);
  }

  #header.affix #brand {
    overflow: hidden;
    margin-top: 0;
  }

  #menu-toggler,#socialmenu {
    display: none!important;
  }

  #langmenu,#mainmenu {
    display: block;
  }

  nav#mainmenu {
    top: auto;
    left: auto;
    bottom: 45px;
    padding: 0;
    background: 0 0;
  }

  nav#mainmenu .brand-o {
    display: none;
  }

  nav#mainmenu ul {
    margin-top: 0;
    border: 0;
  }

  nav#mainmenu ul>li {
    display: inline-block;
    border: 0;
  }

  nav#mainmenu ul>li+li {
    margin-left: 26px;
  }

  nav#mainmenu ul>li>a {
    color: #000000;
    display: inline;
    padding: 0;
  }

  nav#mainmenu ul>li.active>a {
    font-family: basier-bold,"Helvetica Neue",Helvetica,Arial,sans-serif;
    color: #000000;
  }

  nav#langmenu {
    top: -33px;
    font-size: 15px;
  }

  nav#langmenu,nav#langmenu a {
    color: #000000;
    text-transform: lowercase;
  }
}

#footer,#footer-push {
  clear: both;
  display: none;
}

@media (min-width:768px) {
  #footer,#footer-push {
    height: 110px;
    display: block;
  }

  #footer .container>span,#footer .icon {
    display: inline-block;
  }

  #footer {
    padding-top: 49px;
    text-align: center;
    font-size: 11px;
  }

  #footer a:active,#footer a:focus,#footer a:hover {
    color: #858585;
  }

  #footer .container>span+span {
    margin-left: 22px;
  }

  #footer .icon {
    font-size: 1.5em;
    height: 18px;
    vertical-align: bottom;
  }

  #footer .icon+.icon {
    margin-left: 10px;
  }

  #footer-push+#footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
  }
}

.project .xs-content {
  display: block;
  width: 100%;
}

.project .frame-intro {
  background: center no-repeat;
}

.project .frame-intro .container {
  padding: 22px 50px 16px;
}

.project .frame-intro h1 {
  font: 300 18px/24px basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
  padding-bottom: 11px;
  margin-bottom: 7px;
  border-bottom: 1px solid;
}

.project .frame-intro h1+p {
  margin-top: 0;
}

.project .frame-intro ol,.project .frame-intro ul {
  padding-left: 12px;
}

.project .frame-intro .pull-left {
  font-size: 12px;
  line-height: 18px;
}

.project .frame-intro .pull-right {
  margin-top: 10px;
}

.project .vid {
  position: relative;
  width: 320px;
  height: 200px;
  margin: 0 auto;
}

.project .vid a {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: top no-repeat;
}

.project .vid a:after,.project .vid a:before {
  content: '';
  display: block;
  position: absolute;
}

.project .vid a:before {
  background: rgba(0,0,0,.3);
  top: 17px;
  left: 17px;
  right: 17px;
  bottom: 17px;
}

.project .vid a:after {
  top: 50%;
  left: 50%;
  margin-left: -44px;
  margin-top: -51px;
  border-style: solid;
  border-width: 51px 88px;
  border-color: transparent transparent transparent #fff;
}

.project .vid iframe {
  margin: 0 auto;
}

.project .vid.active a {
  display: none;
}

.project .vid.active iframe {
  display: block;
}

@media (max-width:1520px) {
  #slider .teaser.container {
    padding-left: 60px;
    padding-right: 80px;
  }
}
@media (max-width:767px) {
  .project .project-footer-inverse {
    display: none;
  }
  footer#footer{
    display: block;
  }
  footer#footer span {
    display: block;
    text-align: center;
    margin-top: 5px;
    font-size: 11px;
  }
  .project .pull-left,.project .pull-right {
    float: none!important;
  }

  .project .comp-mac,.project .comp-mac>div,.project .comp-tablet,.project .comp-tablet>div {
    background: center no-repeat;
  }

  .project .comp-mac {
    width: 320px;
    height: 260px;
    left: 50%;
    z-index: 10;
    background: url(../img/mac-xs-4e39fb00d8.png) center no-repeat;
    margin: 30px auto;
    position: static;
  }

  .project .comp-mac>div {
    position: absolute;
    width: 235px;
    height: 130px;
    left: 50%;
    margin-left: -117.5px;
    z-index: 10;
    margin-top: 51px;
  }

  .project .comp-tablet {
    width: 320px;
    height: 320px;
    left: 50%;
    z-index: 10;
    background: url(../img/tablet-xs-59e68c1026.png) center no-repeat;
    margin: 0 auto;
    position: static;
  }

  .project .comp-tablet>div {
    position: absolute;
    width: 195px;
    height: 152px;
    left: 50%;
    margin-left: -97.5px;
    z-index: 10;
    margin-top: 80px;
  }

  .project .carousel {
    margin: 30px 15px 70px;
    width: auto;
  }

  .project .carousel .carousel-indicators {
    bottom: -60px;
    opacity: .5;
  }
  
  .project .carousel .carousel-indicators li {
    width: 12px;
    height: 12px;
    border: 2px solid #000;
    margin: 0 9px;
  }

  .project .carousel .carousel-indicators li.active {
    background: #000;
  }

  .project .vid a:before {
    top: 7px;
    left: 7px;
    right: 7px;
    bottom: 7px;
  }

  .project .vid a:after {
    margin-left: -22px;
    margin-top: -25.5px;
    border-width: 25.5px 44px;
  }

  /* subscribe newsletter form   */
  #header .form-newsletter-wrapper {
    background-color: #ebebeb;
    bottom: 0;
    display: none;
    height: 600px;
    left: 0;
    padding-top: 5px;
    position: relative;
    top: 6px;
    width: 100%;
    z-index: 114;

  }

  .contentInPopup {
      padding: 2em; max-width: 40em;
  }

  /*.form-newsletter-wrapper {*/
    /*display: none;*/
    /*position: absolute;*/
    /*right: 54px;*/
    /*text-align: right;*/
    /*top: 135px;*/
  /*}*/

  #header  .form-newsletter-wrapper .invalid-message-group {
    box-sizing: border-box;
    padding: 0 2px;
    position: absolute;
    top: 290px;
    width: 100%;
  }
  #header  .form-newsletter-wrapper .invalid-message-group span{
    margin: 0;
  }



  #mc-embedded-subscribe-form > div{
    position: relative;
    width: 100%;
  }

  #header .form-newsletter-wrapper > div {
    display: block;
    margin-right: auto;
    margin-left: 0px;
    width: 320px;
  }

  #header .mc-field-group {
    display: block;
    width: 100%;
  }

  #header .mc-field-group > input {
    height: 45px;
    margin: 10px auto;
    padding: 10px 15px;
    width: 100%;
  }

  #m-close-btn {
    left: 17px;
    position: fixed;
    z-index: 199;
    color: #b8b8b8;
    display: block;
    text-align: left;
  }

  #header .message-ctn {
    display: block;
    position: absolute;
    /*top: 480px;*/
    top: 390px;
    width: 100%;
    z-index: 120;
  }



  #header .message-ctn div.message {
    border: medium none;
    background-color: transparent;
  }

  #header a.close-btn{
    display: none;
  }


  *, *::after, *::before {
    box-sizing: border-box;
  }
  *, *::after, *::before {
    box-sizing: border-box;
  }
  #header .form-newsletter-wrapper > div {
    width: 90%;
    margin-top: 0px;
  }


  /* END subscribe newsletter form   */
  #project-icrea-videos .vid img {
    width: 100%;
  }
  #project-icrea-videos .vid img {
    width: 100%;
  }
  #project-icrea-videos .frame-07 {
    padding: 0px;
    height: 0px;
  }
  #project-icrea .frame.frame-07 {
    height: auto;
    padding: 0px;
  }
}

@media (min-width:768px) {
  .project .frame-intro .clear,.project .frame:after {
    clear: both;
  }

  .project .frame.black,.project .frame.black a,.project .project-footer .ac-share>a,.project .project-footer .ac-show>a {
    color: #000000;
  }
  #project-pau-education p, #project-pau-education.project .frame.black {
    color: #000000;
  }
  .project {
    position: relative;
    overflow: hidden;
  }

  .project .xs-content {
    display: none;
  }

  .project .frame {
    background: top no-repeat;
    position: relative;
    opacity: 1;
    transition: opacity .5s;
  }

  .project .frame:after,.project .frame:before {
    content: " ";
    display: table;
  }

  .project .frame-intro {
    padding-top: 105px;
  }

  .project .frame-intro .container {
    width: 100%;
    padding: 0 100px;
  }

  .project .frame-intro .pull-left,.project .frame-intro .pull-right {
    width: 49%;
    padding: 0 20px;
  }

  .project .frame-intro h1 {
    margin: 15px 0 11px;
    padding-bottom: 3px;
    font: 300 30px/40px basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
    border-bottom: 1px solid;
  }

  .project .frame-intro h1+p {
    margin-top: 0;
  }

  .project .frame-intro ol,.project .frame-intro ul {
    padding-left: 12px;
  }

  .project .project-footer,.project .project-footer-inverse {
    position: absolute;
    bottom: 110px;
    left: 0;
    right: 0;
    font-size: 13px;
    height: 123px;
    text-align: center;
    z-index: 100;
    /*padding-top: 50px;*/
  }

  .project .project-footer .badge,.project .project-footer-inverse .badge {
    display: inline-block;
    position: absolute;
    width: 46px;
    height: 46px;
    top: 0;
    right: 0;
    padding-top: 10px;
    border-radius: 50%;
    text-align: center;
    font-size: 100%;
  }

  .project .project-footer .badge .icon,.project .project-footer-inverse .badge .icon {
    font-size: 1.9em;
  }

  .project .project-footer .badge,.project .project-footer .badge .icon,.project .project-footer-inverse .badge,.project .project-footer-inverse .badge .icon {
    transition: all .2s ease-out;
  }

  .project .project-footer .ac-share,.project .project-footer .ac-show,
  .project .project-footer-inverse .ac-share,
  .project .project-footer-inverse .ac-show {
    display: inline-block;
    position: relative;
    /*margin: 0 15px 0 28px;*/
    margin-left: -250px;
  }

  .project .project-footer .ac-share>a,.project .project-footer .ac-show>a,.project .project-footer-inverse .ac-share>a,.project .project-footer-inverse .ac-show>a {
    display: inline-block;
    height: 46px;
    padding-top: 13px;
    text-align: left;
  }

  .project .project-footer .ac-show>a,.project .project-footer-inverse .ac-show>a {
    width: 140px;
  }

  .project .project-footer .ac-share,.project .project-footer-inverse .ac-share {
    position: relative;
    display: inline-block;
  }

  .project .project-footer .ac-share:before,.project .project-footer-inverse .ac-share:before {
    background: rgba(3,2,1,0);
    content: '';
    display: none;
    width: 100px;
    height: 175px;
    position: absolute;
    right: -50px;
    top: -65px;
  }

  .project .project-footer .ac-share>a,.project .project-footer-inverse .ac-share>a {
    width: 120px;
  }

  .project .project-footer .ac-share ul,.project .project-footer-inverse .ac-share ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .project .project-footer .ac-share ul li,.project .project-footer-inverse .ac-share ul li {
    position: absolute;
    top: 0;
    right: 0;
    transition: all .3s ease-out;
  }

  .project .project-footer .ac-share ul li .badge,.project .project-footer-inverse .ac-share ul li .badge {
    width: 44px;
    height: 44px;
    top: 1px;
    right: 1px;
  }

  .project .project-footer .ac-share .-close,.project .project-footer-inverse .ac-share .-close {
    display: none;
  }

  .project .project-footer .ac-share:hover .-close,.project .project-footer-inverse .ac-share:hover .-close {
    display: block;
  }

  .project .project-footer .ac-share:hover .-share,.project .project-footer-inverse .ac-share:hover .-share {
    display: none;
  }

  .project .project-footer .ac-share:hover .share-facebook,.project .project-footer-inverse .ac-share:hover .share-facebook {
    top: -62px;
  }

  .project .project-footer .ac-share:hover .share-twitter,.project .project-footer-inverse .ac-share:hover .share-twitter {
    top: -32px;
    right: -52px;
  }

  .project .project-footer .ac-share:hover .share-linkedin,.project .project-footer-inverse .ac-share:hover .share-linkedin {
    top: 32px;
    right: -52px;
  }

  .project .project-footer .ac-share:hover .share-mail,.project .project-footer-inverse .ac-share:hover .share-mail {
    top: 62px;
  }

  .project .project-footer,.project .project-footer .ac-share:hover:before,.project .project-footer-inverse .ac-share:hover:before {
    display: block;
  }

  .project .project-footer .badge {
    background: #fff;
    color: #000000;
  }

  .project .project-footer .ac-share.active>a .badge,.project .project-footer .badge:hover,.project .project-footer a:hover .badge {
    background: #333;
    color: #fff;
  }

  .project .project-footer-inverse .ac-share>a,.project .project-footer-inverse .ac-show>a {
    color: #000000;
  }

  .project .project-footer-inverse .badge {
    background: #333;
    color: #fff;
    border: 1px solid #333;
  }

  .project .project-footer-inverse .ac-share.active>a .badge,.project .project-footer-inverse .badge:hover,.project .project-footer-inverse a:hover .badge {
    background: #fff;
    color: #000000;
  }

  .project .footer {
    background: #333;
  }

  .project .footer,.project .footer a {
    color: #fff;
  }

  .project .comp {
    position: absolute;
  }

  .project .comp-mac {
    position: absolute;
    width: 900px;
    height: 800px;
    left: 50%;
    margin-left: -450px;
    z-index: 11;
    background: url(../img/screen-752814aed6.png) top no-repeat;
  }

  .project .comp-mac>div {
    position: absolute;
    width: 674px;
    height: 370px;
    left: 50%;
    margin-left: -337px;
    z-index: 11;
    top: 153px;
    background: top no-repeat;
    background-size: cover;
  }

  .project .comp-tablet {
    position: absolute;
    width: 900px;
    height: 700px;
    left: 50%;
    margin-left: -450px;
    z-index: 11;
    background: url(../img/tablet-95ed52a702.png) top no-repeat;
  }

  .project .comp-tablet>div {
    position: absolute;
    width: 640px;
    height: 496px;
    left: 50%;
    margin-left: -320px;
    z-index: 11;
    top: 86px;
    background: center no-repeat;
  }

  .project .carousel {
    margin: 0 auto;
    width: 940px;
  }

  .project .carousel .carousel-indicators {
    bottom: -60px;
    opacity: .5;
  }

  .project .carousel .carousel-indicators li {
    width: 12px;
    height: 12px;
    border: 2px solid #000;
    margin: 0 9px;
  }

  .project .carousel .carousel-indicators li.active {
    background: #000;
  }

  .project .vid {
    position: relative;
    width: 780px;
    height: 410px;
    margin: 15px auto 68px;
  }

  .project .vid a {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: top no-repeat;
  }

  .project .vid a:after,.project .vid a:before {
    content: '';
    display: block;
    position: absolute;
  }

  .project .vid a:before {
    background: rgba(0,0,0,.3);
    top: 17px;
    left: 17px;
    right: 17px;
    bottom: 17px;
  }

  .project .vid a:after {
    top: 50%;
    left: 50%;
    margin-left: -44px;
    margin-top: -51px;
    border-style: solid;
    border-width: 51px 88px;
    border-color: transparent transparent transparent #fff;
  }

  .project .vid iframe {
    margin: 0 auto;
  }

  .project .vid.active a {
    display: none;
  }

  .project .vid.active iframe {
    display: block;
  }
}

@media (min-width:992px) {
  .project .frame-intro {
    background-size: cover;
  }

  .project .frame-intro .container {
    padding: 0 120px;
  }
}

#close,#next-project,#prev-project {
  display: none;
}

@media (min-width:768px) {
  #close,#next-project,#prev-project {
    display: block;
    z-index: 90;
  }

  #close.black,#next-project.black,#prev-project.black {
    color: #000000;
  }

  #close.white,#next-project.white,#prev-project.white {
    color: #fff;
  }

  #close {
    position: absolute;
    top: 70px;
    right: 18%;
    margin-left: 452px;
    width: 18px;
    height: 18px;
  }

  #close.affix {
    position: fixed;
    top: 150px;
    right: 60px;
    z-index: 100000;
  }


  #next-project,
  #prev-project {
    position: relative;
    top: 50%;
    width: 150px;
    height: 36px;
    margin-top: 20px;
    font-size: 8px;
    color: black !important;
    float: left;

  }

  #prev-project {
    left: calc(50% - 150px);
    /*margin-top: 0px;*/

  }

  #next-project {
    left: calc(50% - 150px);
    /*text-align: right;*/
    /*right: auto;*/
  }

  #prev-project .sr-only, #next-project .sr-only {
    position: relative;
  }
}

.masonry:after,.masonry:before,.masonry>div:after,.masonry>div:before {
  content: " ";
  display: table;
}

.masonry {
  margin: 16px 0 0;
}

.masonry .col {
  width: 100%;
  padding-bottom: 15px;
}

.home-project,.home-sn {
  position: relative;
  display: block;
  padding-top: 100%;
  height: 0;
  background: center no-repeat;
  background-size: cover;
}

.home-project .overlay,.home-sn .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.home-project h2,.home-sn h2 {
  margin: 0;
  font: 400 20px basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
}

.home-project h2,.home-project p,.home-project small,.home-sn h2,.home-sn p,.home-sn small {
  line-height: 30px;
}

.home-project {
  background-size: cover;
  position: relative;
}

.home-project .overlay {
  display: none;
  opacity: 0;
  transition: opacity .2s;
  padding: 0 20px;
  background: rgba(0,0,0,.7);
  color: #fff;
  z-index: 2;
}

.home-project .overlay>div {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

.home-project p {
  margin: 4px 0;
  font-size: 16px!important;
}

.home-project small {
  text-transform: uppercase;
  font-size: 12px!important;
}

.home-sn h2,.home-sn p {
  font-size: 16px;
}

.home-project canvas {
  position: absolute;
  top: 0;
  left: 0;
}

.home-project:hover .overlay {
  opacity: 1;
}

.home-project .view-project {
  font-size: 16px;
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  padding: 6px 0 0;
  height: 40px;
  border: 1px solid;
  text-align: center;
}

.home-sn .overlay {
  /*fb*/
  /*background: url(../img/home/fb-c08030d090.svg) left bottom no-repeat #e5e5e5;*/
  /*tw*/
  background: url(../img/home/tw.svg) left bottom no-repeat #e5e5e5;
}
.no-svg .home-sn .overlay-fb {
  /*fb*/
  /* background-image: url(../img/home/fb-bcd3c625bb.png);*/
  /*tw*/
  background-image: url(../img/home/tw.png);
}

.home-sn .overlay,.home-sn .overlay>a {
  padding: 37px 30px;
}

.home-sn .overlay>a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.home-sn h2 {
  color: #646464;
}

#home-blog-santpau .view-project,#home-cerca .view-project,#home-cierre-sacalalengua .view-project,#home-crg .view-project,#home-i2cat .view-project,#home-iciq .view-project,#home-icrea .view-project,#home-sacalalengua .view-project,#home-vhir .view-project,#home-vintacap .view-project {
  color: #fff;
}

#home-arvhir .view-project,#home-atenalia .view-project,#home-ced .view-project,#home-hospital-santpau .view-project,#home-master-vhir .view-project,#home-modernismo .view-project {
  color: #666;
}

#home-ondeuev {
  background: url(../img/home/projects/ondeuev.gif) center center no-repeat #e34244;

}
#home-isglobal-ar-2018 {
    background-image: url(../img/home/projects/isglobal-ar-2018.jpg);
}
#home-eit-health {
    background-image: url(../img/home/projects/eit-health.jpg);
}
#home-isglobal {
  background-image: url(../img/home/projects/isglobal-home.jpg);
}
#home-biocat-ar-2017 {
  background-image: url(../img/home/projects/biocat-home.gif);
}
#home-biocat-ar-2017::before {
    opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity='+$ievalue+')";
    filter: alpha(opacity=80);
    background-color: #5d27b3;
    background: -moz-linear-gradient(80deg, #5d27b3 20%, #4dc5e4 90%);
    background: -webkit-linear-gradient(80deg, #5d27b3 20%, #4dc5e4 90%);
    background: linear-gradient(80deg, #5d27b3 20%, #4dc5e4 90%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$bg-start', endColorstr='$bg-finish',GradientType=1 );
    display: inline-block;
    content: ' ';
    left: 0;
    height: 100%;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
#home-bist-ar-2017 {
  background-image: url(../img/home/projects/bist-ar-2017-home.jpg);
}
#home-bbbrc {
  background-image: url(../img/home/projects/bbbrc-home.jpg);
}
#home-isglobal-video {
  background-image: url(../img/home/projects/isglobal-video-home.jpg);
}
#home-tmc {
  background-image: url(../img/home/projects/tmc-home.jpg);
}
#home-idibell {
  background-image: url(../img/home/projects/idibell-home.jpg);
}
#home-crag {
  background-image: url(../img/home/projects/crag-home.jpg);
}
#home-bgse-ar-2017-2018 {
  background-image: url(../img/home/projects/bgse-ar-2017-2018-home.jpg);
}
#home-irta {
  background-image: url(../img/home/projects/irta-home.jpg);
}
#home-santpau-modernista {
  background-image: url(../img/home/projects/santpau-modernista-home.jpg);
}
#home-vhir-plan-estrategico {
  background-image: url(../img/home/projects/vhir-plan-estrategico-home.jpg);
}
#home-icrea-ar-2017 {
  background-image: url(../img/home/projects/icrea-ar-2017-home.jpg);
}
#home-microomics {
  background-image: url(../img/home/projects/microomics-home.jpg);
}
#home-modernsimo-2018 {
  background-image: url(../img/home/projects/modernsimo-2018-home.jpg);
}
#home-bist-conference-2018 {
  background-image: url(../img/home/projects/bist-conference-2018-home.jpg);
}
#home-cerca-conferencia-2018 {
  background-image: url(../img/home/projects/cerca-conferencia-2018-home.jpg);
}
#home-vhir-ar-2017 {
  background-image: url(../img/home/projects/vhir-ar-2017-home.jpg);
}
#home-crg-ar-2017 {
  background-image: url(../img/home/projects/crg-ar-2017-home.jpg);
}
#home-crg-ar-2018 {
    background-image: url(../img/home/projects/home-crg-ar-2018.jpg);
}

#home-i2cat-ar {
  background-image: url(../img/home/projects/I2CAT-gmxbcb4an5.gif);
}
#home-crg-ar-2015 {
  background-image: url(../img/home/projects/CRG-report.jpg);
}
#home-cierre-sacalalengua {
  background-image: url(../img/home/projects/xs/cierre-sacalalengua-3e410cf191.jpg);
}
#home-head {
  background-image: url(../img/home/projects/xs/head.jpg);
}

#home-hospital-santpau {
  background-image: url(../img/home/projects/xs/hospital-santpau-16c3be0015.jpg);
}

#home-icrea {
  background-image: url(../img/home/projects/xs/icrea-d248a1a705.jpg);
}
#home-icrea-ar-2018 {
    background-image: url(../img/home/projects/home-icrea-2018.jpg);
}

#home-vhir {
  background-image: url(../img/home/projects/xs/vhir-74283a61df.jpg);
}

#home-master-vhir {
  background-image: url(../img/home/projects/xs/master-vhir-0effac210a.jpg);
}

#home-ced {
  background-color: #fff;
  background-size: contain;
  background-image: url(../img/home/projects/ced-668fdc1549.gif);
}

#home-sacalalengua {
  background-image: url(../img/home/projects/xs/sacalalengua-cf0e36c53f.jpg);
}

#home-blog-santpau {
  background-image: url(../img/home/projects/xs/blog-santpau-110fa94f5a.jpg);
}

#home-modernismo {
  background-image: url(../img/home/projects/xs/modernismo-a5f5e40081.jpg);
}

#home-arvhir {
  background-image: url(../img/home/projects/xs/arvhir-9272d41c36.jpg);
}
#home-crg-ar-2015 {
  background-image: url(../img/home/projects/CRG-report2015.jpg);
}
#home-i2cat {
  background: #f47320;
}

#home-cerca {
  background-image: url(../img/home/projects/xs/cerca-64095570f2.jpg);
}

#home-crg {
  background-image: url(../img/home/projects/xs/crg-8f11b79352.jpg);
}

#home-iciq {
  background-image: url(../img/home/projects/xs/iciq-0f900f834c.jpg);
}

#home-atenalia {
  background-image: url(../img/home/projects/xs/atenalia-883ee68513.jpg);
}

#home-vintacap {
  background-image: url(../img/home/projects/xs/vintacap-4bac24f91e.jpg);
}

#project-icrea-videos h2 {
  /*font-weight: 100;*/
  color: #bea956;
  text-align: center;
}
#project-icrea-videos h3 {
  /*font-weight: 100;*/
  text-align: center;
}

#home-cierre-sacalalengua {
  background-image: url(../img/home/projects/cierre-sacalalengua-1c54a84b8a.jpg);
}

#home-head {
  background-image: url(../img/home/projects/head.jpg);
}

#home-hospital-santpau {
  background-image: url(../img/home/projects/hospital-santpau-fb8375dd43.jpg);
}

#home-icrea {
  background-image: url(../img/home/projects/icrea-0e92c3c1a7.jpg);
}

#home-vhir {
  background-image: url(../img/home/projects/vhir-06cea9c5a4.jpg);
}

#home-master-vhir {
  background-image: url(../img/home/projects/master-vhir-5c198ee262.jpg);
}

#home-ced {
  background-color: #fff;
  background-image: url(../img/home/projects/ced-668fdc1549.gif);
}

#home-sacalalengua {
  background-image: url(../img/home/projects/sacalalengua-7dfde1ea70.jpg) no-repeat center ;
}

#home-blog-santpau {
  background-image: url(../img/home/projects/blog-santpau-0b461d03fc.jpg);
}

#home-modernismo {
  background-image: url(../img/home/projects/modernismo-9ef268a9b2.jpg);
}

#home-arvhir {
  background-image: url(../img/home/projects/arvhir-0c47dd6884.jpg);
}

#home-i2cat-ar {
  background-image: url(../img/home/projects/I2CAT-gmxbcb4an5.gif);
}
#home-crg-ar-2015 {
  background-image: url(../img/home/projects/CRG-report2015.jpg);
}
#home-cerca {
  background-image: url(../img/home/projects/cerca-9f1f0776bb.jpg);
}

#home-crg {
  background-image: url(../img/home/projects/crg-02899eb400.jpg);
}

#home-iciq {
  background-image: url(../img/home/projects/iciq-039080c1d0.jpg);
}

#home-atenalia {
  background-image: url(../img/home/projects/atenalia-1fec2a62c0.jpg);
}

#home-vintacap {
  background-image: url(../img/home/projects/vintacap-9ab5e5ff41.jpg);
}

#home-vhirar2015 {
  background-image: url(../img/home/projects/vhir1.jpg);
}

#home-santpau-recerca {
  background-image: url(../img/home/projects/IRBsantpau3.jpg);
}
#home-ced-formacion {
  background-image: url(../img/home/projects/CEDformacion.jpg);
}
#home-icrea-videos {
  background-image: url(../img/home/projects/ICREAvideos.jpg);
}
#home-modernismo-2016 {
  background-image: url(../img/home/projects/modernismo-estatica.jpg);
}
#home-icrea-15 {
  background-image: url(../img/home/projects/15years.jpg);
}
#home-pau-education {
  background-image: url(../img/home/projects/PauEducation-videos.jpg);
}
@media (min-width:768px) {
  #home #main .container {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  .masonry>div {
    margin-left: -15px;
    margin-right: -15px;
  }

  .masonry .col {
    float: left;
    padding: 15px;
  }

  .masonry .col.col-1 {
    width: 50%;
  }

  .home-project,.home-sn {
    height: 359px;
    padding-top: 0;
  }

  .home-sn .overlay {
    padding: 40px;
  }

  .home-sn h2 {
    color: #646464;
    font-size: 18px;
  }

  .home-sn p {
    font-size: 16px;
  }

  #home-cierre-sacalalengua {
    background-image: url(../img/home/projects/cierre-sacalalengua-1c54a84b8a.jpg);
  }

  #home-head {
    background-image: url(../img/home/projects/head.jpg);
  }

  #home-hospital-santpau {
    background-image: url(../img/home/projects/hospital-santpau-fb8375dd43.jpg);
  }

  #home-icrea {
    background-image: url(../img/home/projects/icrea-0e92c3c1a7.jpg);
  }

  #home-vhir {
    background-image: url(../img/home/projects/vhir-06cea9c5a4.jpg);
  }

  #home-master-vhir {
    background-image: url(../img/home/projects/master-vhir-5c198ee262.jpg);
  }

  #home-ced {
    background-color: #fff;
    background-image: url(../img/home/projects/ced-668fdc1549.gif);
  }

  #home-sacalalengua {
    background-image: url(../img/home/projects/sacalalengua-7dfde1ea70.jpg);
  }

  #home-blog-santpau {
    background-image: url(../img/home/projects/blog-santpau-0b461d03fc.jpg);
  }

  #home-modernismo {
    background-image: url(../img/home/projects/modernismo-9ef268a9b2.jpg);
  }

  #home-arvhir {
    background-image: url(../img/home/projects/arvhir-0c47dd6884.jpg);
  }

  #home-i2cat-ar {
    background-image: url(../img/home/projects/I2CAT-gmxbcb4an5.gif);
  }
  #home-crg-ar-2015 {
    background-image: url(../img/home/projects/CRG-report2015.jpg);
  }
  #home-cerca {
    background-image: url(../img/home/projects/cerca-9f1f0776bb.jpg);
  }

  #home-crg {
    background-image: url(../img/home/projects/crg-02899eb400.jpg);
  }

  #home-iciq {
    background-image: url(../img/home/projects/iciq-039080c1d0.jpg);
  }

  #home-atenalia {
    background-image: url(../img/home/projects/atenalia-1fec2a62c0.jpg);
  }

  #home-vintacap {
    background-image: url(../img/home/projects/vintacap-9ab5e5ff41.jpg);
  }

  #home-vhirar2015 {
    background-image: url(../img/home/projects/vhir1.jpg);
  }

  #home-santpau-recerca {
    background-image: url(../img/home/projects/IRBsantpau3.jpg);
  }
  #home-ced-formacion {
    background-image: url(../img/home/projects/CEDformacion.jpg);
  }
  #home-icrea-videos {
    background-image: url(../img/home/projects/ICREAvideos.jpg);
  }
  #home-modernismo-2016 {
    background-image: url(../img/home/projects/modernismo-estatica.jpg);
  }
  #home-icrea-15 {
    background-image: url(../img/home/projects/15years.jpg);
  }
  #home-pau-education {
    background-image: url(../img/home/projects/PauEducation-videos.jpg);
  }
}

@media screen and (max-width:1200px) and (min-width: 768px){
  #home-ondeuev {
    height: 380px;
    background-size: 100%;
  }
}
@media screen and (max-width:767px) {
  /* ondeuev gif column */
  .masonry div:first-child {
    height: auto;
    margin-bottom: 15px;
  }
  #home-ondeuev {
    background: url(../img/home/projects/ondeuev.gif) center center no-repeat #e34244;
    height: 380px;
    background-size: 100%;
      padding-top: 0;
  }


}
@media (min-width:992px) {
  .masonry .col.col-1 {
    width: 33.33333%;
  }

  .masonry .col.col-2 {
    width: 66.66666%;
  }

  .home-project,.home-sn {
    height: 294px;
  }

  .home-project .overlay {
    display: table;
    opacity: 0;
    transition: opacity .2s;
  }

  .home-project:hover .overlay {
    opacity: 1;
  }

  .home-project .view-project {
    display: none;
  }
}

@media (min-width:1200px) {
  .home-project,.home-sn {
    height: 394px;
  }
}

#clients .list {
  margin: 30px 0;
  padding: 10px;
  text-align: center;
  list-style: none;
  font-size: 30px;
  line-height: 50px;
}

#clients .list span {
  display: inline;
  margin: 0 .1em;
}

#clients .list span.light {
  color: #b3b3b3;
}

#clients .list span.dark {
  color: grey;
}

@media (min-width:992px) {
  #clients .list {
    padding: 24px 10px;
    font-size: 30px;
    line-height: 50px;
  }
}

#about .slider {
  overflow: hidden;
  display: block;
  width: 100%;
  height: 0;
  padding-top: 100%;
  background: #dfe0e3;
}

#about .slider .back,#about .slider .front,#about .slider .replay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: left no-repeat;
  background-size: cover;
}

#about .slider .front {
  opacity: 1;
  transition: opacity 1s;
  z-index: 2;
}

#about .slider .back {
  z-index: 1;
}

#about .slider .replay {
  opacity: 0;
  background: rgba(0,0,0,.5);
  transition: opacity 1s;
  z-index: 3;
}

#about .slider .replay>a {
  visibility: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100px;
  height: 100px;
  margin-left: -50px;
  margin-top: -50px;
  background: url(../img/nosotros/slider/replay-9949fe6b46.svg) center no-repeat;
  transition: -webkit-transform 1s;
  transition: transform 1s;
  -webkit-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  transform: rotate(-180deg);
  outline: 0;
}

.no-svg #about .slider .replay>a {
  background-image: url(../img/nosotros/slider/replay-a9fb54abd7.png);
}

#about .slider.transitioning .front {
  visibility: visible;
  opacity: 0;
}

#about .slider.stopped .replay {
  opacity: 1;
}

#about .slider.stopped .replay a {
  visibility: visible;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

#about article {
  padding: 20px 0;
}

#about article h3,#about article p {
  font-size: 14px;
  line-height: 21px;
  margin: 0;
}

#about article h3 {
  margin: 27px 0 0;
  font-family: basier-bold,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: 700;
}

#about article h3:first-child {
  margin-top: 11px;
}

#about article p {
  margin-top: 3px;
}

@media (min-width:768px) {
  #about #header {
    background: 0 0;
  }

  #about #header.affix {
    background: rgba(255,255,255,.7);
  }

  #about #footer {
    background: rgba(255,255,255,.6);
    padding: 30px 0 110px;
  }

  #about article>.container {
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
    margin: 0;
  }

  #about .slider {
    position: fixed;
    height: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    padding-top: 0;
    width: 49%;
  }

  #about article {
    margin-left: 50%;
  }
}

@media (min-width:992px) {
  #about article>.container {
    padding-left: 70px;
    padding-right: 150px;
    padding-bottom: 50px;
    width: 100%;
  }
}

@media (max-width:767px) {
  #about #main .container {
    padding: 0 50px;
  }

  #about .slider {
    width: 100%;
    height: 0;
    padding-top: 100%;
    position: relative;
  }
}

#contact a:active,#contact a:focus,#contact a:hover {
  color: #858585;
}

@media (min-width:768px) {
  #contact article>.container>div {
    margin-left: 50%;
    padding-left: 70px;
    padding-top: 50px;
  }

  #contact article .sn {
    margin-left: -5px;
  }

  #contact article .sn .icon+.icon {
    margin-left: 16px;
  }

  #contact #map-canvas {
    background: #ddd;
    position: fixed!important;
    top: 0;
    left: 0;
    bottom: 0;
    width: 50%;
  }

  #contact #header {
    background: 0 0;
  }

  #contact #header.affix {
    background: rgba(255,255,255,.5);
  }

  #contact #footer {
    background: rgba(255,255,255,.6);
    padding: 30px 0 110px;
  }
}

@media (max-width:767px) {
  #contact #map-canvas {
    display: none;
  }

  #contact #main .container {
    max-width: 240px;
    padding-top: 50px;
  }

  #contact .sn {
    width: 100%;
    text-align: left;
    margin-left: -5px;
  }

  #contact .sn a {
    margin: 0 16px 0 0;
  }
}

@media (min-width:768px) {
  #project-icrea .frame-01 {
    height: 710px;
    background: url(../img/project/icrea/frame-01-4eb2789347.jpg) center no-repeat;
    background-size: cover;
  }

  #project-icrea .frame-02 {
    height: 800px;
    background-image: url(../img/project/icrea/frame-02-a09e0cf686.jpg);
  }

  #project-icrea .frame-03 {
    height: 850px;
    background-image: url(../img/project/icrea/frame-03-0db7f66267.jpg);
  }

  #project-icrea .frame-04 {
    height: 800px;
    background-image: url(../img/project/icrea/frame-04-e3170ea6d4.jpg);
  }

  #project-icrea .frame-04 .comp-screen {
    position: absolute;
    width: 632px;
    height: 394px;
    left: 50%;
    z-index: 10;
    background: url(../img/project/icrea/frame-04-screen-44cfa045a0.gif) center no-repeat;
    top: 119px;
    margin-left: -324px;
  }

  #project-icrea .frame-05 {
    height: 900px;
    background-image: url(../img/project/icrea/frame-05-3dd66ddcdd.jpg);
  }

  #project-icrea .frame-05 .comp-hand {
    background-image: url(../img/project/icrea/frame-05-hand-e37d10229b.png);
    width: 740px;
    height: 800px;
    bottom: 34px;
    left: 0;
  }

  #project-icrea .frame-06 {
    height: 900px;
  }

  #project-icrea .frame-06 .comp {
    top: 182px;
    left: 50%;
  }

  #project-icrea .frame-06 .comp-left {
    background-image: url(../img/project/icrea/frame-06-left-6b880afbca.jpg);
    width: 420px;
    height: 598px;
    margin-left: -410px;
  }

  #project-icrea .frame-06 .comp-right {
    background-image: url(../img/project/icrea/frame-06-right-4e10212962.jpg);
    width: 340px;
    height: 599px;
    margin-left: 70px;
  }

  #project-icrea .frame-07 {
    height: 800px;
    background-image: url(../img/project/icrea/frame-07-95fab3ad75.jpg);
  }

  #project-icrea .frame-08 {
    height: 800px;
    background-image: url(../img/project/icrea/frame-08-c66b03d2ba.jpg);
  }

  #project-icrea .frame-09 {
    height: 800px;
    background-image: url(../img/project/icrea/frame-09-31f549688a.jpg);
  }
}

@media (min-width:768px) and (max-width:991px) {
  #project-icrea .frame-02 {
    height: 625px;
    background-image: url(../img/project/icrea/sm/frame-02-6261b9f3c6.jpg);
  }

  #project-icrea .frame-04 {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 2000px;
    left: 50%;
    top: 0;
    position: relative;
    margin-left: -1000px;
    margin-top: -120px;
  }

  #project-icrea .frame-06 {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
  }
}

@media (min-width:768px) {
  #project-atenalia .frame.white {
    color: #666;
  }

  #project-atenalia .frame-01 .logo {
    position: absolute;
    width: 299px;
    height: 71px;
    left: 50%;
    margin-left: -149.5px;
    z-index: 10;
    background: url(../img/project/atenalia/frame-01-logo-c40f456371.png) center no-repeat;
    margin-top: 72px;
  }

  #project-atenalia .frame-02 {
    height: 900px;
    background-image: url(../img/project/atenalia/frame-02-6a4ca0206e.jpg);
    background-size: cover;
  }

  #project-atenalia .frame-03 {
    background-position: center;
  }

  #project-atenalia .frame-03>.container {
    padding-top: 360px;
  }

  body.es #project-atenalia .frame-03 {
    background-image: url(../img/project/atenalia/frame-03-es-7a3c70fcf3.svg);
  }

  .no-svg body.es #project-atenalia .frame-03 {
    background-image: url(../img/project/atenalia/frame-03-es-509446f983.png);
  }

  body.ca #project-atenalia .frame-03 {
    background-image: url(../img/project/atenalia/frame-03-ca-f4e2740dc5.svg);
  }

  .no-svg body.ca #project-atenalia .frame-03 {
    background-image: url(../img/project/atenalia/frame-03-ca-7dd1159301.png);
  }

  body.en #project-atenalia .frame-03 {
    background-image: url(../img/project/atenalia/frame-03-en-550a97a054.svg);
  }

  .no-svg body.en #project-atenalia .frame-03 {
    background-image: url(../img/project/atenalia/frame-03-en-760a3a73da.png);
  }

  #project-atenalia .frame-03 hr {
    height: 10px;
    border: 0;
    margin: 0;
    background: url(../img/project/atenalia/frame-03-hr-f6fa485011.svg) no-repeat;
  }

  #project-atenalia .frame-04 {
    height: 453px;
    background-image: url(../img/project/atenalia/frame-04-animg-72df516a11.gif);
  }

  #project-atenalia .frame-05 {
    height: 950px;
    background-image: url(../img/project/atenalia/frame-05-ca6e23d33d.jpg);
  }

  #project-atenalia .frame-06 {
    height: 950px;
    background-image: url(../img/project/atenalia/frame-06-38b1a5575a.jpg);
  }
}

@media (max-width:767px) {
    #project-atenalia .frame-01 {
        min-height: 423px;
        color: #000000;
    }
  #project-atenalia .frame-01 img,#project-atenalia .frame-03 img {
    width: auto;
    margin: 20px auto 0;
  }

  #project-atenalia .frame-03 .container {
    display: none;
  }

  #project-atenalia .frame-06 {
    background-color: #f3f0ee;
  }
}

@media (min-width:768px) and (max-width:991px) {
  #project-atenalia .frame-05 {
    height: 644px;
    background-image: url(../img/project/atenalia/sm/frame-04-948d6e002d.jpg);
  }

  #project-atenalia .frame-06 {
    height: 644px;
    background-image: url(../img/project/atenalia/sm/frame-05-89c9aa5585.jpg);
  }
}

@media (min-width:768px) {
  #project-vintacap .frame {
    background-color: #000;
  }

  #project-vintacap .frame-01 {
    height: 850px;
    background-image: url(../img/project/vintacap/frame-01-d07d007ef9.jpg);
    background-position: center 35px;
  }

  #project-vintacap .frame-02 {
    height: 256px;
    background-image: url(../img/project/vintacap/frame-02-a10a67a9e5.png);
    background-position: center 53px;
  }

  #project-vintacap .frame-03 {
    height: 850px;
    background-image: url(../img/project/vintacap/frame-03-0671c620e7.jpg);
  }

  #project-vintacap .frame-04 {
    height: 900px;
    background-image: url(../img/project/vintacap/frame-04-f294c68f30.jpg);
  }

  #project-vintacap .frame-05 {
    height: 1000px;
    background-image: url(../img/project/vintacap/frame-05-d217483d94.jpg);
    margin-bottom: 100px;
  }
}

@-webkit-keyframes cards-animation {
  0% {
    background-position: center top;
  }

  33% {
    background-position: center center;
  }

  66% {
    background-position: center bottom;
  }
}

@keyframes cards-animation {
  0% {
    background-position: center top;
  }

  33% {
    background-position: center center;
  }

  66% {
    background-position: center bottom;
  }
}

@media (min-width:768px) {
  #project-ced .frame-01 {
    height: 700px;
    background-image: url(../img/project/ced/frame-01-4b112ca47d.jpg);
  }

  #project-ced .frame-02 {
    height: 271px;
    background-image: url(../img/project/ced/frame-02-fe15143d30.jpg);
  }

  #project-ced .frame-03 {
    height: 470px;
    background-image: url(../img/project/ced/frame-03-668fdc1549.gif);
    background-position: center;
  }

  #project-ced .frame-04 {
    height: 580px;
    background-image: url(../img/project/ced/frame-04-c13aeec4e3.svg);
    background-position: center;
  }

  .no-svg #project-ced .frame-04 {
    background-image: url(../img/project/ced/frame-04-55a564b420.png);
  }

  #project-ced .frame-05 {
    height: 1554px;
    background-image: url(../img/project/ced/frame-05-4eae5f5867.png);
    background-position: center;
  }

  #project-ced .frame-06 {
    height: 614px;
    background-position: center;
  }

  #project-ced .frame-06 .comp-card {
    background-image: url(../img/project/ced/frame-06-6a2cda8bd7.png);
    width: 760px;
    height: 400px;
    left: 50%;
    top: 50%;
    margin-left: -380px;
    margin-top: -200px;
    -webkit-animation: cards-animation 6s infinite;
    animation: cards-animation 6s infinite;
    -webkit-animation-timing-function: steps(1,end);
    animation-timing-function: steps(1,end);
  }

  #project-ced .frame-07 {
    height: 1440px;
    background-image: url(../img/project/ced/frame-07-991ede6089.png);
    background-position: center 132px;
  }

  #project-ced .frame-07 .comp-screen {
    background-image: url(../img/project/ced/frame-07-screen-0e4a41e988.gif);
    width: 534px;
    height: 404px;
    left: 50%;
    top: 211px;
    margin-left: -267px;
    box-shadow: 0 0 1px 1px rgba(0,0,0,.2) inset,0 0 1px 1px rgba(255,255,255,.2);
    border-radius: 3px;
  }

  #project-ced .comp-bg-01,#project-ced .comp-bg-02 {
    width: 10000px;
    left: 50%;
    margin-left: -5000px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  #project-ced .comp-bg-01 {
    background: #eaebec;
    height: 660px;
    top: 2555px;
  }

  #project-ced .comp-bg-02 {
    background: url(../img/project/ced/bg-c68524363c.png) #333;
    height: 770px;
    top: 3505px;
  }



}

@media (max-width:767px) {
  #project-ced {
    overflow: hidden!important;
  }

  #project-ced .bg-comp {
    overflow: hidden;
    position: relative;
  }

  #project-ced .bg-comp .frame {
    max-width: 320px;
    margin: 0 auto;
    z-index: 1;
    position: relative;
  }
  #project-ced .frame-01 {
    color: #000000;
  }

  #project-ced .frame-05 {
    padding: 200px 0 140px;
  }

  #project-ced .frame-06 {
    height: 200px;
    background: url(../img/project/ced/xs/frame-03.jpg) bottom no-repeat;
  }

  #project-ced .frame-06 .comp-card {
    background: url(../img/project/ced/xs/frame-06-755da83d2a.png) top no-repeat;
    width: 320x;
    height: 140px;
    -webkit-animation: cards-animation 6s infinite;
    animation: cards-animation 6s infinite;
    -webkit-animation-timing-function: steps(1,end);
    animation-timing-function: steps(1,end);
  }

  #project-ced .frame-07 {
    height: 480px;
    background: url(../img/project/ced/xs/frame-07-bc082c1437.png) top no-repeat;
    position: relative;
  }

  #project-ced .frame-07>.comp-screen {
    position: absolute;
    width: 213px;
    height: 162px;
    left: 50%;
    margin-left: -106.5px;
    z-index: 10;
    background: url(../img/project/ced/xs/frame-07-screen-54f280cdfa.gif) center no-repeat;
    top: 49px;
  }

  #project-ced .bg-comp-01,#project-ced .bg-comp-02 {
    position: absolute;
    width: 10000px;
    left: 50%;
    margin-left: -5000px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  #project-ced .bg-comp-01 {
    background: #eaebec;
    height: 200px;
    top: 300px;
  }

  #project-ced .bg-comp-02 {
    background: url(../img/project/ced/bg-c68524363c.png) #333;
    height: 260px;
    top: 595px;
  }
  #project-vintacap .frame-01 {
    color: #000000;
  }


    #project-icrea .frame-01 {
        color: #000000;
    }
}

@media (min-width:768px) and (max-width:991px) {
  #project-ced .frame-04 {
    background-size: 100%;
  }

  #project-ced .frame-05 {
    height: 1000px;
    background-size: 80%;
  }

  #project-ced .frame-06 {
    height: 314px;
  }

  #project-ced .frame-06 .comp-card {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
  }

  #project-ced .frame-07 {
    height: 1170px;
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 1000px;
    margin: 0 auto 0 -500px;
    padding: 0 20px;
    left: 50%;
  }

  #project-ced .comp-bg-01,#project-ced .comp-bg-02 {
    width: 10000px;
    left: 50%;
    margin-left: -5000px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  #project-ced .comp-bg-01 {
    background: #eaebec;
    height: 550px;
    top: 2155px;
  }

  #project-ced .comp-bg-02 {
    background: url(../img/project/ced/bg-c68524363c.png) #333;
    height: 600px;
    top: 2900px;
  }
}

@media (min-width:768px) {
  #project-sacalalengua {
    overflow: hidden;
  }

  #project-sacalalengua .frame-intro {
    color: #666;
  }

  #project-sacalalengua .frame-01 {
    height: 810px;
    background-size: auto;
    background-position: bottom;
    background-image: url(../img/project/sacalalengua/frame-01-ee24814f96.jpg);
  }

  #project-sacalalengua .frame-02 {
    height: 700px;
    background: url(../img/project/sacalalengua/frame-02-0462d753b9.svg) center 247px no-repeat #333;
  }

  #project-sacalalengua .frame-03 {
    height: 1024px;
    background-image: url(../img/project/sacalalengua/frame-03-835c0b8bfe.jpg);
  }

  #project-sacalalengua .frame-04 {
    height: 1010px;
    background-image: url(../img/project/sacalalengua/frame-04.jpg);
  }

  #project-sacalalengua .frame-04 .vid-01 a {
    background-image: url(../img/project/sacalalengua/frame-04-vid1-a9afaee35f.jpg);
  }

  #project-sacalalengua .frame-04 .vid-02 a {
    background-image: url(../img/project/sacalalengua/frame-04-vid2-9c5caf86c9.jpg);
  }

  #project-sacalalengua .frame-05 {
    height: 620px;
    background-image: url(../img/project/sacalalengua/frame-05-05672a2af7.png);
  }

  #project-sacalalengua .frame-05 .comp-screen {
    background-image: url(../img/project/sacalalengua/frame-05-screen-7a64cc70e6.gif);
    width: 534px;
    height: 404px;
    left: 50%;
    top: 102px;
    margin-left: -267px;
    border-radius: 3px;
  }

  #project-sacalalengua .frame-06 {
    height: 1165px;
    background-image: url(../img/project/sacalalengua/frame-06-aecbbdd552.png);
    overflow: hidden;
  }

  #project-sacalalengua .frame-06 .comp-badge {
    background: #fed94f;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    right: -195px;
    bottom: -202px;
  }

  #project-sacalalengua>.comp {
    content: '';
    display: block;
    position: absolute;
  }

  #project-sacalalengua .comp-bar {
    background: #00bac2;
    height: 238px;
    width: 2000px;
    left: 50%;
    top: 1318px;
    margin-left: -400px;
    -webkit-transform: rotate(5.3deg);
    -ms-transform: rotate(5.3deg);
    transform: rotate(5.3deg);
    border-radius: 238px;
    z-index: 15;
  }

  #project-sacalalengua .com-bg {
    background: #ec4942;
    height: 486px;
    width: 3000px;
    left: 50%;
    top: 3730px;
    margin-left: -1500px;
    -webkit-transform: rotate(-8.1deg);
    -ms-transform: rotate(-8.1deg);
    transform: rotate(-8.1deg);
  }
}

@media (max-width:767px) {
    #project-sacalalengua .frame-intro {
        color: #000000;
    }
  #project-sacalalengua .frame-04 {
    width: 320px;
    margin: 0 auto;
  }

  #project-sacalalengua .frame-04 .vid {
    margin: 20px 0;
  }

  #project-sacalalengua .frame-04 .vid-01 a {
    background-image: url(../img/project/sacalalengua/xs/frame-04-vid1-5793d1c66a.jpg);
  }

  #project-sacalalengua .frame-04 .vid-02 a {
    background-image: url(../img/project/sacalalengua/xs/frame-04-vid2-a9e70cd12a.jpg);
  }

  #project-sacalalengua .frame-05 {
    position: relative;
    z-index: 10;
    margin-bottom: -180px;
  }

  #project-sacalalengua .frame-05 .comp-tablet>div {
    background-image: url(../img/project/sacalalengua/xs/frame-05-screen-a1041d3a08.gif);
  }
}

@media (min-width:768px) and (max-width:991px) {
  #project-sacalalengua .frame-04 .vid,#project-sacalalengua .frame-05 {
    -webkit-transform: scale(.75,.75);
    -ms-transform: scale(.75,.75);
    transform: scale(.75,.75);
  }

  #project-sacalalengua .frame-06 {
    height: 781px;
    background-image: url(../img/project/sacalalengua/sm/frame-06-6aa0caa986.png);
  }
}

@-webkit-keyframes slide-animation {
  0%,100%,35% {
    opacity: 0;
  }

  25%,5% {
    opacity: 1;
  }
}

@keyframes slide-animation {
  0%,100%,35% {
    opacity: 0;
  }

  25%,5% {
    opacity: 1;
  }
}

@-webkit-keyframes gear-left-animation {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes gear-left-animation {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes gear-right-animation {
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}

@keyframes gear-right-animation {
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}

@-webkit-keyframes plane-animation {
  0% {
    opacity: 0;
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  10% {
    opacity: 1;
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }

  90% {
    opacity: 1;
    -webkit-transform: rotate(8deg);
    transform: rotate(8deg);
  }

  100% {
    opacity: 0;
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
  }
}

@keyframes plane-animation {
  0% {
    opacity: 0;
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  10% {
    opacity: 1;
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }

  90% {
    opacity: 1;
    -webkit-transform: rotate(8deg);
    transform: rotate(8deg);
  }

  100% {
    opacity: 0;
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
  }
}

#project-i2cat .frame-02 .slide {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: center no-repeat;
  background-size: cover;
  opacity: 0;
  -webkit-animation: slide-animation 12s infinite;
  animation: slide-animation 12s infinite;
}

#project-i2cat .frame-02 .slide-01 {
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}

#project-i2cat .frame-02 .slide-02 {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}

#project-i2cat .frame-02 .slide-03 {
  -webkit-animation-delay: 6s;
  animation-delay: 6s;
}

#project-i2cat .frame-02 .slide-04 {
  -webkit-animation-delay: 9s;
  animation-delay: 9s;
}

#project-i2cat .frame-05 {
  background-color: #405a69;
}

#project-i2cat .frame-05 .gear {
  -webkit-animation: gear-left-animation 4s linear infinite;
  animation: gear-left-animation 4s linear infinite;
}

#project-i2cat .frame-05 .gear-w {
  -webkit-animation-name: gear-right-animation;
  animation-name: gear-right-animation;
}

@media (min-width:768px) {
  #project-i2cat #close {
    color: #000000;
  }

  #project-i2cat .comp-screen {
    width: 900px;
    height: 800px;
    margin-left: -450px;
    left: 50%;
    top: 113px;
    z-index: 10;
  }

  #project-i2cat .comp-screen>div {
    display: block;
    position: absolute;
    width: 696px;
    height: 385px;
    top: 140px;
    left: 50%;
    margin-left: -348px;
  }

  #project-i2cat .frame-01 {
    height: 710px;
    background: url(../img/project/i2cat/frame-01-logo-1fe7d323e0.svg) center 76% no-repeat #FCB201;
  }

  .no-svg #project-i2cat .frame-01 {
    background-image: url(../img/project/i2cat/frame-01-logo-b8d3ee6972.png);
  }

  #project-i2cat .frame-02 {
    height: 800px;
    background-color: #FCB201;
  }

  #project-i2cat .frame-02 .slide>div {
    position: absolute;
    width: 710px;
    height: 308px;
    left: 50%;
    margin-left: -355px;
    z-index: 11;
    top: 258px;
    background: top no-repeat;
  }

  #project-i2cat .frame-02 .slide-01 {
    background-image: url(../img/project/i2cat/frame-02-001-48ebf04d95.jpg);
  }

  #project-i2cat .frame-02 .slide-02 {
    background-image: url(../img/project/i2cat/frame-02-002-8d34ee920a.jpg);
  }

  #project-i2cat .frame-02 .slide-03 {
    background-image: url(../img/project/i2cat/frame-02-003-58d0410f2d.jpg);
  }

  #project-i2cat .frame-02 .slide-04 {
    background-image: url(../img/project/i2cat/frame-02-004-6de8a268f3.jpg);
  }

  #project-i2cat .frame-02 .slide-01>div {
    background-image: url(../img/project/i2cat/frame-02-slide01-09590bfbea.svg);
  }

  .no-svg #project-i2cat .frame-02 .slide-01>div {
    background-image: url(../img/project/i2cat/frame-02-slide01-81e6de3914.png);
  }

  #project-i2cat .frame-02 .slide-02>div {
    background-image: url(../img/project/i2cat/frame-02-slide02-f21f9d3e7d.svg);
  }

  .no-svg #project-i2cat .frame-02 .slide-02>div {
    background-image: url(../img/project/i2cat/frame-02-slide02-171e8d25b2.png);
  }

  #project-i2cat .frame-02 .slide-03>div {
    background-image: url(../img/project/i2cat/frame-02-slide03-e097603455.svg);
  }

  .no-svg #project-i2cat .frame-02 .slide-03>div {
    background-image: url(../img/project/i2cat/frame-02-slide03-9f60004dab.png);
  }

  #project-i2cat .frame-02 .slide-04>div {
    background-image: url(../img/project/i2cat/frame-02-slide04-11cbf16c8d.svg);
  }

  .no-svg #project-i2cat .frame-02 .slide-04>div {
    background-image: url(../img/project/i2cat/frame-02-slide04-8741e163d7.png);
  }

  #project-i2cat .frame-02 .comp-scrolldown {
    width: 84px;
    height: 32px;
    left: 50%;
    bottom: 22px;
    margin-left: -42px;
    background: url(../img/project/i2cat/frame-02-scrolldown-fef099f4c4.svg) top no-repeat;
  }

  .no-svg #project-i2cat .frame-02 .comp-scrolldown {
    background-image: url(../img/project/i2cat/frame-02-scrolldown-fe30a3c5fd.png);
  }

  #project-i2cat .frame-03 {
    height: 800px;
    background-color: #c44050;
  }

  #project-i2cat .frame-03 .comp-screen {
    top: 113px;
    background-image: url(../img/project/i2cat/frame-03-mac-a86e6191af.png);
  }

  #project-i2cat .frame-03 .comp-screen>div {
    top: 140px;
    background-image: url(../img/project/i2cat/frame-03-screen-6cd359cee8.gif);
  }

  #project-i2cat .frame-04 {
    height: 800px;
    background: url(../img/project/i2cat/frame-04-2871424c96.png) center 85px no-repeat #249843;
  }

  #project-i2cat .frame-04 .comp-plane {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
  }

  #project-i2cat .frame-04 .comp-plane>div {
    position: absolute;
    left: 50%;
    margin-left: -55px;
    width: 110px;
    height: 10000px;
    bottom: -9570px;
    -webkit-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-animation: plane-animation 8s linear infinite;
    animation: plane-animation 8s linear infinite;
    background: url(../img/project/i2cat/frame-04-plane-16ffe67274.svg) top no-repeat;
  }

  .no-svg #project-i2cat .frame-04 .comp-plane>div {
    background-image: url(../img/project/i2cat/frame-04-plane-250981d969.png);
  }

  #project-i2cat .frame-04 .comp-screen {
    top: 116px;
    background-image: url(../img/project/i2cat/frame-04-screen-250ccdf9be.png);
  }

  #project-i2cat .frame-04 .comp-screen .comp-plane>div {
    bottom: -9740px;
    background-size: 50%;
  }

  #project-i2cat .frame-05 {
    height: 700px;
  }

  #project-i2cat .frame-05 .comp-gears {
    position: absolute;
    width: 710px;
    height: 580px;
    left: 50%;
    margin-left: -355px;
    z-index: 10;
    background: url(../img/project/i2cat/frame-05-12bb9ecbb5.svg) center no-repeat;
    top: 166px;
  }

  .no-svg #project-i2cat .frame-05 .comp-gears {
    background-image: url(../img/project/i2cat/frame-05-a3289b7a57.png);
  }

  #project-i2cat .frame-05 .gear {
    position: absolute;
    width: 220px;
    height: 220px;
    background: url(../img/project/i2cat/frame-05-gears-66eb74bed4.svg) no-repeat;
  }

  .no-svg #project-i2cat .frame-05 .gear {
    background-image: url(../img/project/i2cat/frame-05-gears-2452a686e2.png);
  }

  #project-i2cat .frame-05 .gear-w {
    top: 224px;
    left: 158px;
  }

  #project-i2cat .frame-05 .gear-r {
    top: 107px;
    left: 327px;
    background-position: -220px 0;
  }

  #project-i2cat .frame-05 .gear-y {
    top: 358px;
    left: 310px;
    background-position: -440px 0;
  }

  #project-i2cat .frame-06 {
    height: 800px;
    background-image: url(../img/project/i2cat/frame-06-23e59b8de2.png);
    background-color: #b6dfd1;
  }

  #project-i2cat .frame-06 .comp-screen {
    top: 116px;
    left: auto;
    margin: 0;
    right: 0;
    background-image: url(../img/project/i2cat/frame-06-mac-e4f4d31cbf.png);
  }

  #project-i2cat .frame-06 .comp-screen>div {
    top: 140px;
    right: -144px;
    left: auto;
    background-image: url(../img/project/i2cat/frame-06-screen-6a6d11bd6c.gif);
  }

  #project-i2cat .frame-07 {
    height: 2200px;
    background-image: url(../img/project/i2cat/frame-07-d6e5185a97.jpg);
    background-position: center 37px;
  }








  #project-i2cat-ar-2015 .frame-01 {
    color: #000000;
    /*position: relative;*/
    height: 1050px;
  }

  #project-i2cat-ar-2015 .frame-01 img{
    color: #000000;
    width: 516px;
    height: 595px;
    margin: 0px auto;
    text-align: center;
    /*position: relative;*/

  }
  #project-i2cat-ar-2015 .center {
    text-align: center;
  }
  #project-i2cat-ar-2015 .frame-02 {
    /*margin-top:-700px;*/
    background-image: url(../img/project/i2cat-ar-2015/i2CAT-movil1A.png);
    height: 800px;
  }
  #project-i2cat-ar-2015 .frame-03 {
    /*margin-top:-200px;*/
    background-image: url(../img/project/i2cat-ar-2015/i2CAT-motion4.gif);
    height: 900px;
  }
  #project-i2cat-ar-2015 .frame-04 {
    background-image: url(../img/project/i2cat-ar-2015/i2CAT-movil1B.png);
    height: 900px;
  }
  #project-i2cat-ar-2015 .frame-04 {
    background-image: url(../img/project/i2cat-ar-2015/iPad-Air-2-Mockup-2.gif);
    height: 800px;
  }
  #project-i2cat-ar-2015 .frame-05 {
    background-image: url(../img/project/i2cat-ar-2015/i2CAT-memoriapapel1.jpg);
    height: 2000px;
  }

}

/** header **/
/* newsletter subscription form */
.form-newsletter-wrapper {
  display: none;
  position: absolute;
  right: 0px;
  top: 80px;
}

body#about .form-newsletter-wrapper,
body#nosaltres .form-newsletter-wrapper,
body#nosotros .form-newsletter-wrapper {
  text-align: right;
  width: 833px;
}

body#about #header .message,
body#nosaltres #header .message,
body#nosotros #header .message {
  width: 854px;
}

body#about .form-newsletter-wrapper .invalid-message-group,
body#nosaltres .form-newsletter-wrapper .invalid-message-group,
body#nosotros .form-newsletter-wrapper .invalid-message-group {
  text-align: left;
  vertical-align: text-bottom;
  width: 259px;
}

.mc-field-group {
  display: inline-block;
}

.mc-field-group > *{
  display: inline-block;
  height: 30px;
  margin-top: 0;
  vertical-align: top;
  width: 130px;
  margin-left: 10px;
}

.mc-field-group > input[type=text],
.mc-field-group > input[type=email] {
  border: 1px solid #E6E6E6;
  padding: 5px;
}


.mc-field-group > input[type=submit] {
  background-color: #333;
  /*border: 1px solid #FFCC00;*/
  border: none;
  text-transform: uppercase;
  color: #fff;
  font-size:13px

}


#header .message-ctn{
  display: none;
}

#header .message {
  border: 1px solid #bebebe;
  bottom: 3px;
  box-sizing: border-box;
  color: #646464;
  display: block;
  font-family: basier;
  font-size: 14px;
  height: 44px;
  padding: 10px 0 10px;
  position: absolute;
  right: 30px;
  text-align: center;
  width: calc(100% - 60px);
  background-color: #fff;
}

.message .hightlight {
  font-size: 18px;
  font-weight: bold;
}


#header .message .close-btn{
  float: right;
  position: absolute;
  right: 15px;
}

.icon.-close-btn::before {
  vertical-align: top;
}
#close.color.white .icon.-close {
  text-shadow: 1px 1px 1px rgb(0, 0, 0);
}
#close.color.black .icon.-close {
  text-shadow: 1px 1px 1px rgb(255, 255, 255);
}

input.invalid{
  border: 1px solid red !important;
}

.invalid-message {
  display: none;
  color: rgba(225,2,0,0.8);
  display: inline-block;
  font-family: basier;
  padding-top: 0px;
  width: 100%;
}

.privacy_label.message-magin {
  top: 70px;
}
/* end newsletter subscription form */


@media (max-width:767px) {
  #project-i2cat .frame-02 {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 0;
    padding-top: 100%;
    background-color: #FCB201;
  }

  #project-i2cat .frame-02 .slide>div {
    position: absolute;
    width: 520px;
    height: 100%;
    left: 50%;
    margin-left: -260px;
    z-index: 11;
    background: center no-repeat;
    background-size: contain;
  }

  #project-i2cat .frame-02 .slide-01 {
    background-image: url(../img/project/i2cat/xs/frame-02-001-1403cd8acf.jpg);
  }

  #project-i2cat .frame-02 .slide-02 {
    background-image: url(../img/project/i2cat/xs/frame-02-002-2ad694dfcf.jpg);
  }

  #project-i2cat .frame-02 .slide-03 {
    background-image: url(../img/project/i2cat/xs/frame-02-003-439b17e187.jpg);
  }

  #project-i2cat .frame-02 .slide-04 {
    background-image: url(../img/project/i2cat/xs/frame-02-004-d1faf25d0b.jpg);
  }

  #project-i2cat .frame-02 .slide-01>div {
    background-image: url(../img/project/i2cat/xs/frame-02-slide01-09590bfbea.svg);
  }

  .no-svg #project-i2cat .frame-02 .slide-01>div {
    background-image: url(../img/project/i2cat/xs/frame-02-slide01-81e6de3914.png);
  }

  #project-i2cat .frame-02 .slide-02>div {
    background-image: url(../img/project/i2cat/xs/frame-02-slide02-f21f9d3e7d.svg);
  }

  .no-svg #project-i2cat .frame-02 .slide-02>div {
    background-image: url(../img/project/i2cat/xs/frame-02-slide02-171e8d25b2.png);
  }

  #project-i2cat .frame-02 .slide-03>div {
    background-image: url(../img/project/i2cat/xs/frame-02-slide03-e097603455.svg);
  }

  .no-svg #project-i2cat .frame-02 .slide-03>div {
    background-image: url(../img/project/i2cat/xs/frame-02-slide03-9f60004dab.png);
  }

  #project-i2cat .frame-02 .slide-04>div {
    background-image: url(../img/project/i2cat/xs/frame-02-slide04-11cbf16c8d.svg);
  }

  .no-svg #project-i2cat .frame-02 .slide-04>div {
    background-image: url(../img/project/i2cat/xs/frame-02-slide04-8741e163d7.png);
  }

  #project-i2cat .frame-03 .comp-mac>div {
    background-image: url(../img/project/i2cat/xs/frame-03-screen-057a6e2e4f.gif);
    background-size: cover;
    background-repeat: no-repeat;
  }

  #project-i2cat .frame-04 {
    position: relative;
    overflow: hidden;
    height: 320px;
    background: url(../img/project/i2cat/xs/frame-04-2871424c96.png) center no-repeat #249843;
    background-size: cover;
  }

  #project-i2cat .frame-04 .comp-plane {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
  }

  #project-i2cat .frame-04 .comp-plane>div {
    position: absolute;
    left: 50%;
    margin-left: -55px;
    width: 110px;
    height: 4000px;
    bottom: -3770px;
    -webkit-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-animation: plane-animation 4s linear infinite;
    animation: plane-animation 4s linear infinite;
    background: url(../img/project/i2cat/xs/frame-04-plane-ca326915fa.svg) top no-repeat;
  }

  .no-svg #project-i2cat .frame-04 .comp-plane>div {
    background-image: url(../img/project/i2cat/xs/frame-04-plane-2d1817b2ee.png);
  }

  #project-i2cat .frame-04 .comp-screen {
    position: absolute;
    width: 320px;
    height: 320px;
    left: 50%;
    margin-left: -160px;
    z-index: 10;
    background: url(../img/project/i2cat/xs/frame-04-screen-4a6f300bf2.png) center no-repeat;
    padding: 53px 43px;
  }

  #project-i2cat .frame-04 .comp-screen>div {
    position: relative;
    top: 0;
    height: 130px;
    margin: 0;
    overflow: hidden;
  }

  #project-i2cat .frame-04 .comp-screen .comp-plane>div {
    position: absolute;
    bottom: -3910px;
    background-size: 40%;
  }

  #project-i2cat .frame-05 {
    position: relative;
    height: 300px;
  }

  #project-i2cat .frame-05 .comp-gears {
    position: absolute;
    width: 320px;
    height: 290px;
    left: 50%;
    margin-left: -160px;
    z-index: 10;
    background: url(../img/project/i2cat/xs/frame-05-54c3a690b9.svg) -17px 0 no-repeat;
    top: 30px;
  }

  .no-svg #project-i2cat .frame-05 .comp-gears {
    background-image: url(../img/project/i2cat/xs/frame-05-566463107f.png);
  }

  #project-i2cat .frame-05 .gear {
    position: absolute;
    width: 110px;
    height: 110px;
    background: url(../img/project/i2cat/xs/frame-05-gears-5254a65809.svg) no-repeat;
  }

  .no-svg #project-i2cat .frame-05 .gear {
    background-image: url(../img/project/i2cat/xs/frame-05-gears-0a57a33cc9.png);
  }

  #project-i2cat .frame-05 .gear-w {
    top: 112px;
    left: 62px;
  }

  #project-i2cat .frame-05 .gear-r {
    top: 54px;
    left: 147px;
    background-position: -110px 0;
  }

  #project-i2cat .frame-05 .gear-y {
    top: 179px;
    left: 138px;
    background-position: -220px 0;
  }
  #project-i2cat .frame.frame-07 {
    padding: 0px;
    height: auto;
  }
  #project-modernismo-2016 .frame-04 img {
    width: 100%;
  }
  #project-modernismo-2016 .frame-05 img {
    width: 100%;
  }

  #project-modernismo-2016 .frame-06 {
    display: none;
  }



  #project-i2cat-ar-2015 .frame-01 .lg-content {
    display: none;
  }



  #project-icrea-15 .carousel-indicators {
    visibility: hidden;
    display: none;
  }

  .privacy_label.message-magin {
    top: 0px;
  }

}



@media (min-width:768px) and (max-width:991px) {
  #project-i2cat .frame-01 {
    height: 910px;
  }

  #project-i2cat .frame-03 .comp-screen,#project-i2cat .frame-04 .comp-screen {
    -webkit-transform: scale(.9,.9);
    -ms-transform: scale(.9,.9);
    transform: scale(.9,.9);
    top: 163px;
  }

  #project-i2cat .frame-03>.comp-plane,#project-i2cat .frame-04>.comp-plane {
    display: none;
  }

  #project-i2cat .frame-07 {
    height: 1719px;
    background-image: url(../img/project/i2cat/sm/frame-07-797a655524.jpg);
    background-position: center 37px;
  }
}

@media (min-width:768px) {
  #project-arvhir .frame-01 {
    height: 695px;
    background: repeat-x #4c1d4b;
    background-image: linear-gradient(135deg,#4c1d4b,#70246d);
  }

  #project-arvhir .frame-01 .comp-mac {
    bottom: -400px;
  }

  #project-arvhir .frame-01 .comp-mac>div {
    background-image: url(../img/project/arvhir/frame-01-screen-3065e33ff5.gif);
  }

  #project-arvhir .frame-02 {
    height: 770px;
    padding-top: 360px;
  }

  #project-arvhir .frame-02 .comp {
    position: absolute;
    width: 480px;
    height: 280px;
    left: 50%;
    margin-left: -240px;
    z-index: 10;
    background: url(../img/project/arvhir/frame-02-8e24b0146b.svg) center no-repeat;
    bottom: 57px;
  }

  .no-svg #project-arvhir .frame-02 .comp {
    background-image: url(../img/project/arvhir/frame-02-f0753af9ca.png);
  }

  #project-arvhir .frame-03 {
    height: 384px;
    overflow: visible;
  }

  #project-arvhir .frame-03 .comp-tablet {
    position: absolute;
    top: 32px;
    z-index: 10;
  }

  #project-arvhir .frame-03 .comp-tablet>div {
    background-image: url(../img/project/arvhir/frame-03-screen-6c77f5074d.gif);
  }

  #project-arvhir .frame-04 {
    height: 1435px;
    background-image: url(../img/project/arvhir/frame-04-e85f24583e.jpg);
  }
}

@media (max-width:767px) {
  #project-arvhir .frame-01 {
    color: #000000;
  }

  #project-arvhir .frame-01 .comp-mac>div {
    background-image: url(../img/project/arvhir/xs/frame-01-screen-2f2e19c3c5.gif);
    background-size: cover;
  }
    #project-arvhir .frame-02 img {
        width: 320px;
        margin: 0px auto;
    }
  #project-arvhir .frame-03 .comp-tablet>div {
    background-image: url(../img/project/arvhir/xs/frame-03-screen-02dc73c7b1.gif);
  }

  #project-arvhir .frame-04 {
    background-image: url(../img/project/arvhir/xs/frame-04-42f9abf3af.jpg);
      background-repeat: no-repeat;
      background-position-x: center;
    height: 320px;
  }
}

@media (min-width:768px) and (max-width:991px) {
  #project-arvhir .frame-01 {
    height: 695px;
  }

  #project-arvhir .frame-01 .comp-mac {
    top: auto;
    bottom: -400px;
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 1000px;
    left: 50%;
    margin-left: -500px;
  }

  #project-arvhir .frame-03 .comp-tablet {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 1000px;
    left: 50%;
    margin-left: -500px;
  }

  #project-arvhir .frame-04 {
    height: 1003px;
    background-image: url(../img/project/arvhir/sm/frame-04-b98f424212.jpg);
  }

  #project-vhir .frame-01 .comp-mac {
    -webkit-transform: scale(.8,.8);
    -ms-transform: scale(.8,.8);
    transform: scale(.8,.8);
  }
}

@media (min-width:768px) {
  #project-vhir .frame-01 {
    height: 1469px;
    margin-bottom: 310px;
    background-image: url(../img/project/vhir/frame-01-8c3a6ab6c4.jpg);
  }

  #project-vhir .frame-01 .comp-mac {
    bottom: -130px;
  }

  #project-vhir .frame-01 .comp-mac>div {
    background-image: url(../img/project/vhir/frame-02-screen-f853233405.gif);
  }

  #project-vhir .frame-02 {
    height: 1169px;
    background-image: url(../img/project/vhir/frame-01-8c3a6ab6c4.jpg);
    background-position: center -777px;
  }

  #project-vhir .frame-02 .comp-mac {
    bottom: 262px;
  }

  #project-vhir .frame-02 .comp-mac>div {
    background-image: url(../img/project/vhir/frame-02-screen-f853233405.gif);
  }
}

@media (max-width:767px) {
  #project-vhir .frame-01 {
    color: #000000;
  }
  #project-vhir .frame-01 .comp-mac {
    position: relative;
    left: 0;
    z-index: 10;
    margin-top: -100px;
  }

  #project-vhir .frame-01 .comp-mac>div {
    background-image: url(../img/project/vhir/xs/frame-02-screen-1efec51334.gif);
  }
}

@media (min-width:768px) {
  #project-modernismo .comp-title {
    position: absolute;
    width: 160px;
    height: 80px;
    left: 50%;
    margin-left: -80px;
    bottom: -40px;
    padding-top: 30px;
    font-size: 40px;
    text-align: center;
    font-weight: 100;
    background: #fff;
    border: 1px solid #666;
    color: #666;
    z-index: 10;
  }

  #project-modernismo .frame-01 {
    height: 750px;
    background-size: cover;
    background-image: url(../img/project/modernismo/frame-01-e6544b9809.jpg);
  }

  #project-modernismo .frame-02 {
    height: 600px;
  }

  #project-modernismo .frame-02 .comp-left {
    position: absolute;
    width: 330px;
    height: 330px;
    left: 50%;
    z-index: 10;
    background: url(../img/project/modernismo/frame-02-left-113bf84e48.gif) center no-repeat;
    margin-left: -412px;
    top: 197px;
  }

  #project-modernismo .frame-02 .comp-right {
    position: absolute;
    width: 389px;
    height: 330px;
    left: 50%;
    z-index: 10;
    background: url(../img/project/modernismo/frame-02-right-4b169fa130.png) center no-repeat;
    margin-left: 5px;
    top: 197px;
  }

  #project-modernismo .frame-03 {
    height: 800px;
    background-image: url(../img/project/modernismo/frame-03-69803c193f.jpg);
  }

  #project-modernismo .frame-04 {
    height: 675px;
    padding-top: 64px;
  }

  #project-modernismo .frame-05 {
    height: 842px;
  }

  #project-modernismo .frame-05 .comp-mac>div {
    background-image: url(../img/project/modernismo/frame-05-screen-836faaa6a8.gif);
  }

  #project-modernismo .frame-06 {
    height: 651px;
    background-image: url(../img/project/modernismo/frame-06-0878e52cb1.gif);
    background-color: #f3f0ee;
  }

  #project-modernismo .frame-07 {
    height: 850px;
    background-image: url(../img/project/modernismo/frame-07-8606e9ad7d.jpg);
  }

  #project-modernismo .frame-08 {
    height: 846px;
    padding-top: 132px;
  }

  #project-modernismo .frame-09 {
    height: 850px;
    background-image: url(../img/project/modernismo/frame-09-e4088802c1.jpg);
  }

  #project-modernismo .frame-10 {
    height: 936px;
    padding-top: 132px;
  }

  #project-icrea-15 .comp-title {
    position: absolute;
    width: 160px;
    height: 80px;
    left: 50%;
    margin-left: -80px;
    bottom: -40px;
    padding-top: 30px;
    font-size: 40px;
    text-align: center;
    font-weight: 100;
    background: #fff;
    border: 1px solid #666;
    color: #666;
    z-index: 10;
  }
  #project-icrea-15 .frame-01 {
    height: 900px;
    background-size: cover;
    background-image: url(../img/project/icrea-15/cabecera-ICREA15.jpg);
  }
  #project-icrea-15 .frame-02 {
    height: 1000px;
    padding-top: 64px;
  }



  #project-vhir-ar-2015 .frame-01 {
    height: 1700px;
    background-size: cover;
    background-image: url(../img/project/vhir-ar-2015/portadaVHIR2015-d.jpg);
  }
  #project-vhir-ar-2015 .frame-02 {
    height: 1500px;
    background-size: cover;
    background-image: url(../img/project/vhir-ar-2015/interior-memoria1.jpg);
  }
  #project-vhir-ar-2015 .frame-03 {
    height: 1500px;
    background-size: cover;
    background-image: url(../img/project/vhir-ar-2015/interior-memoria2.jpg);
  }

  #project-vhir-ar-2015 .frame-04 {
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad1_a.png") no-repeat scroll center center / 1400px auto;
    height: 800px;
    padding-top: 64px;
    position: relative;
  }


  #project-vhir-ar-2015 .frame-04 .comp-screen{
    display: block;
    left: calc(50% - 322px);
    margin: 0;
    position: relative;
    top: 80px;
  }


  #project-vhir-ar-2015 .frame-04 .selector{
    bottom: 65px;
    display: inline-block;
    left: 0;
    position: absolute;
    text-align: center;
    width: 100%;
    top:auto;
  }

  #project-vhir-ar-2015 .frame-04 .seq{
    background-position: 49.95% -180px !important;
    background-size: 1414px auto !important;
    height: 482px;
    left: 1px;
    position: absolute;
    top: -1px;
    width: 644px;
    display: none;
  }

  #project-vhir-ar-2015 .frame-04 .seq-1{
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad1_a.png")
    no-repeat scroll center center / 1400px auto;
  }

  #project-vhir-ar-2015 .frame-04 .seq-2{
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad1_b.png")
    no-repeat scroll center center / 1400px auto;
  }

  #project-vhir-ar-2015 .frame-04 .seq-3{
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad1_c.png")
    no-repeat scroll center center / 1400px auto;
  }



  #project-vhir-ar-2015 .frame-05-b {
    height: 842px;
  }

  #project-vhir-ar-2015 .frame-05-b .selector{
       bottom: 65px;
       display: inline-block;
       left: 0;
       position: absolute;
       text-align: center;
       width: 100%;
       top:auto;
     }


  #project-vhir-ar-2015 .frame-05-b {
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad2_a.png") no-repeat scroll center center / 1400px auto;
    height: 800px;
    margin-bottom: 150px;
    padding-top: 64px;
    position: relative;
  }


  #project-vhir-ar-2015 .frame-05-b .comp-screen{
    display: block;
    left: calc(50% - 322px);
    margin: 0;
    position: relative;
    top: 80px;
  }

  #project-vhir-ar-2015 .frame-05-b .seq{
    background-position: 49.95% -180px !important;
    background-size: 1414px auto !important;
    height: 482px;
    left: 1px;
    position: absolute;
    top: -1px;
    width: 644px;
    display: none;
  }

  #project-vhir-ar-2015 .frame-05-b .seq-1{
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad2_a.png")
    no-repeat scroll center center / 1400px auto;
  }

  #project-vhir-ar-2015 .frame-05-b .seq-2{
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad2_b.png")
    no-repeat scroll center center / 1400px auto;
  }

  #project-vhir-ar-2015 .frame-05-b .seq-3{
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad2_c.png")
    no-repeat scroll center center / 1400px auto;
  }

  /*#project-vhir-ar-2015 .frame-05 .comp-mac>div {*/
    /*background-image: url(../img/project/modernismo/frame-05-screen-836faaa6a8.gif);*/
  /*}*/

  #project-vhir-ar-2015 .frame-06 {
    height: 651px;
    background-image: url(../img/project/modernismo/frame-06-0878e52cb1.gif);
    background-color: #f3f0ee;
  }

  #project-vhir-ar-2015 .frame-07 {
    height: 850px;
    background-image: url(../img/project/modernismo/frame-07-8606e9ad7d.jpg);
  }

  #project-vhir-ar-2015 .frame-08 {
    height: 846px;
    padding-top: 132px;
  }

  #project-vhir-ar-2015 .frame-09 {
    height: 850px;
    background-image: url(../img/project/modernismo/frame-09-e4088802c1.jpg);
  }

  #project-vhir-ar-2015 .frame-10 {
    height: 936px;
    padding-top: 132px;
  }


  #project-modernismo-2016 .frame-01 {
    /*background-image: url(../img/project/modernismo-2016/modernisme2016-bg-azul.jpg);*/
    /*background-position: 0px 250px;*/
    height: 350px;
  }
  #project-modernismo-2016 .frame-01 {
    color: #000000;
  }
  #project-modernismo-2016 .frame-02 {
    background-size: cover;
    background: url(../img/project/modernismo-2016/modernisme2016-movil1.jpg) center;
    height: 800px;
  }
  #project-modernismo-2016 .frame-03 {
    background: url(../img/project/modernismo-2016/iPad-MockupModernisme2016.jpg) center;
    height: 1600px;
  }
  #project-modernismo-2016 .frame-04 {
    margin-top: 120px;
    height: 620px;
  }


  #project-modernismo-2016 .frame-04,
  #project-modernismo-2016 .frame-05 {
    width: 1230px;
    margin-left: auto;
    margin-right: auto;
  }

  #project-modernismo-2016 .frame-04 .comp-left,
  #project-modernismo-2016 .frame-05 .comp-left {
    float: left;
    width: 47%;
    position: relative;
    height: auto;
    top: 30px;

  }

  #project-modernismo-2016 .frame-04 .comp-right,
  #project-modernismo-2016 .frame-05 .comp-right {
    float: left;
    width: 47%;
    position: relative;
    margin-left: 4%;
    top: 30px;
  }
  #project-modernismo-2016 .frame-05 {
    height: 800px;
  }
  #project-modernismo-2016 .frame-06 {
    height: 950px;
  }



  #project-iciq .frame-01-b .seq {
    display: none;
  }

  #project-iciq .frame-01-b .seq-1{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-1.jpg")
    no-repeat scroll center center / 672px auto;
    display: block;
  }

  #project-iciq .frame-01-b .seq-2{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-2.jpg")
    no-repeat scroll center center / 672px auto;
  }

  #project-iciq .frame-01-b .seq-3{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-3.jpg")
    no-repeat scroll center center / 672px auto;
  }

  #project-iciq .frame-01-b .seq-4{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-4.jpg")
    no-repeat scroll center center / 672px auto;
  }

  #project-iciq .frame-01-b .seq-5{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-5.jpg")
    no-repeat scroll center center / 672px auto;
  }
}


#project-vhir-ar-2015 .frame-04 {
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad1_a.png") no-repeat scroll center center / 1400px auto;
  height: 800px;
  padding-top: 64px;
  position: relative;
}


#project-vhir-ar-2015 .frame-04 .comp-screen{
  display: block;
  left: calc(50% - 322px);
  margin: 0;
  position: relative;
  top: 80px;
}


#project-vhir-ar-2015 .frame-04 .selector{
  bottom: 65px;
  display: inline-block;
  left: 0;
  position: absolute;
  text-align: center;
  width: 100%;
  top:auto;
}

#project-vhir-ar-2015 .frame.frame-04 .seq{
  background-position: 49.95% -180px ;
  background-size: 1414px auto ;
  height: 482px;
  left: 1px;
  position: absolute;
  top: -1px;
  width: 644px;
  display: none;
}

#project-vhir-ar-2015 .frame-04 .seq-1{
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad1_a.png")
  no-repeat scroll center center / 1400px auto;
}

#project-vhir-ar-2015 .frame-04 .seq-2{
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad1_b.png")
  no-repeat scroll center center / 1400px auto;
}

#project-vhir-ar-2015 .frame-04 .seq-3{
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad1_c.png")
  no-repeat scroll center center / 1400px auto;
}



#project-vhir-ar-2015 .frame-05-b {
  height: 842px;
}

#project-vhir-ar-2015 .frame-05-b .selector{
  bottom: 65px;
  display: inline-block;
  left: 0;
  position: absolute;
  text-align: center;
  width: 100%;
  top:auto;
}


#project-vhir-ar-2015 .frame-05-b {
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad2_a.png") no-repeat scroll center center / 1400px auto;
  height: 800px;
  margin-bottom: 150px;
  padding-top: 64px;
  position: relative;
}


#project-vhir-ar-2015 .frame-05-b .comp-screen{
  display: block;
  left: calc(50% - 322px);
  margin: 0;
  position: relative;
  top: 80px;
}

#project-vhir-ar-2015 .frame.frame-05-b .seq{
  background-position: 49.95% -180px;
  background-size: 1414px auto;
  height: 482px;
  left: 1px;
  position: absolute;
  top: -1px;
  width: 644px;
  display: none;
}

#project-vhir-ar-2015 .frame-05-b .seq-1{
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad2_a.png")
  no-repeat scroll center center / 1400px auto;
}

#project-vhir-ar-2015 .frame-05-b .seq-2{
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad2_b.png")
  no-repeat scroll center center / 1400px auto;
}

#project-vhir-ar-2015 .frame-05-b .seq-3{
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2015/VHIR-memoria-ipad2_c.png")
  no-repeat scroll center center / 1400px auto;
}


@media (max-width: 790px){
  #project-vhir-ar-2015 .frame.frame-04,
  #project-vhir-ar-2015 .frame.frame-05-b{
    background-size: 1000px auto;
    height: 502px;
    padding-top: 0;
    position: relative;
  }

  #project-vhir-ar-2015 .frame.frame-04 .seq,
  #project-vhir-ar-2015 .frame.frame-05-b .seq {
    background-position: -269px -125px;
    background-size: 996px auto;
    height: 343px;
    left: 92px;
    top: -12px;
    width: 458px;
  }


  #project-vhir-ar-2015 .frame-05-b .selector {
    bottom: 0;
    display: inline-block;
    left: 0;
    padding: 0;
    position: absolute;
    text-align: center;
    top: auto;
    width: 100%;
  }

}


@media (max-width: 600px){
  #project-vhir-ar-2015 .frame.frame-04,
  #project-vhir-ar-2015 .frame.frame-05-b{
    background-size: 500px auto;
    height: 280px;
    padding-bottom: 0;
    padding-top: 0;
    position: relative;
  }

  #project-vhir-ar-2015 .frame.frame-04 .seq,
  #project-vhir-ar-2015 .frame.frame-05-b .seq {
    background-position: -180px -83px;
    background-size: 561px auto;
    height: 172px;
    left: 207px;
    top: -32px;
    width: 229px;
  }

  #project-vhir-ar-2015 .frame-05-b .selector {
    bottom: 0;
    display: inline-block;
    left: 0;
    padding: 0;
    position: absolute;
    text-align: center;
    top: auto;
    width: 100%;
  }
}

@media (max-width:767px) {
  #project-modernismo .comp-title,#project-modernismo .frame-04,#project-modernismo .frame-08,#project-modernismo .frame-10 {
    display: none;
  }

  #project-modernismo .frame-01 {
    color: #000000;
  }

  #project-modernismo .frame-02 {
    background: url(../img/project/modernismo/xs/frame-02-422794a96e.svg) center no-repeat;
    width: 320px;
    height: 160px;
    margin: 0 auto;
    padding: 30px 0 0 35px;
  }

  .no-svg #project-modernismo .frame-02 {
    background-image: url(../img/project/modernismo/xs/frame-02-7d10e20384.png);
  }

  #project-modernismo .frame-02 img {
    width: auto;
  }

  #project-modernismo .frame-05 .comp-mac>div {
    background-image: url(../img/project/modernismo/xs/frame-05-screen-0ceea2107d.gif);
  }

  #project-modernismo .frame-06 {
    background-color: #f3f0ee;
  }
  #project-modernismo .frame-07 {
    height: auto;
    padding: 0px;
  }





    #project-vhir-ar-2015 .frame-01 {
       color: #000000;
    }
  .no-svg #project-vhir-ar-2015 .frame-02 {
    background-image: url(../img/project/modernismo/xs/frame-02-7d10e20384.png);
  }


  #project-vhir-ar-2015 .frame-05 .comp-mac>div {
    background-image: url(../img/project/modernismo/xs/frame-05-screen-0ceea2107d.gif);
  }

  #project-vhir-ar-2015 .frame-06 {
    background-color: #f3f0ee;
  }


  #project-modernismo-2016 .frame-06 {
    /*display: none;*/
  }

  #project-iciq .frame-01  {
    color: #000000;
  }
  #project-iciq .frame-01-b .seq {
    margin-top: 54px;
    display: none;
  }

  #project-iciq .frame-01-b .seq-1{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-1.jpg")
    no-repeat scroll center center / 238px auto;
    display: block;
  }

  #project-iciq .frame-01-b .seq-2{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-2.jpg")
    no-repeat scroll center center / 238px auto;
  }

  #project-iciq .frame-01-b .seq-3{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-3.jpg")
    no-repeat scroll center center / 238px auto;
  }

  #project-iciq .frame-01-b .seq-4{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-4.jpg")
    no-repeat scroll center center / 238px auto;
  }

  #project-iciq .frame-01-b .seq-5{
    background: rgba(0, 0, 0, 0) url("../img/project/iciq/02pantall-ICIQ-2015-5.jpg")
    no-repeat scroll center center / 238px auto;
  }

}

@media (min-width:768px) {
  #project-iciq .frame-01 {
    height: 735px;
    background: repeat-x #045d77;
    background-image: linear-gradient(-20deg,#045d77,#0c7b8c);
  }


  #project-iciq .frame-01 .comp-mac {
    top: 240px;
  }

  #project-iciq .frame-01 .comp-mac>div {
    /*background-image: url(../img/project/iciq/frame-01-screen-d85c5e6f45.gif);*/
  }

  #project-iciq .frame-02 {
    height: 920px;
    background-image: url(../img/project/iciq/frame-02-685cc737ed.svg);
    background-position: center 350px;
  }

  .no-svg #project-iciq .frame-02 {
    background-image: url(../img/project/iciq/frame-02-5e389c0d13.png);
  }

  #project-iciq .frame-03 {
    height: 820px;
    background-image: url(../img/project/iciq/frame-03-16f422ab9c.gif);
  }
}

@media (max-width:767px) {
  /*#project-iciq .frame-01 .comp-mac>div {*/
    /*background-image: url(../img/project/iciq/xs/frame-01-screen-8579e9da0d.gif);*/
  /*}*/
  /*#project-iciq div#slider-iciq {*/
    /*margin-top: 50px;*/
  /*}*/
}

@media (min-width:768px) and (max-width:991px) {
  #project-modernismo .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
  }
  #project-modernismo-2016 .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
  }
  #project-modernismo .carousel img,
  #project-modernismo-2016 .carousel img {
    width: 100%;
  }

  #project-modernismo .frame-02 {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
  }

  #project-modernismo .frame-05 .comp-mac {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
  }

  #project-modernismo .frame-05 .comp-mac img {
    width: 100%;
  }

  #project-iciq .frame-01 .comp-mac {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
  }
  #project-modernismo-2016 .frame-06 {
    height: 500px;
  }


  #project-modernismo-2016 .frame-04,
  #project-modernismo-2016 .frame-05 {
    width: 100%;
    height: auto;
  }

  #project-modernismo-2016 .frame-04 .comp-left,
  #project-modernismo-2016 .frame-05 .comp-left {
    float: left;
    width: 50%;
    position: relative;
    /*width: 600px;*/
    height: auto;
    /*left: 10%;*/
    /*z-index: 10;*/
    /*background: url(../img/project/modernismo-2016/piezas-calle-modernismo2016-3.jpg) center no-repeat;*/
    /*margin-left: -600px;*/
    top: 30px;
  }

  #project-modernismo-2016 .frame-04 .comp-right,
  #project-modernismo-2016 .frame-05 .comp-right {
    float: left;
    width: 50%;
    position: relative;
    height: auto;
    /*height: 600px;*/
    /*left: 10%;*/
    /*z-index: 10;*/
    /*background: url(../img/project/modernismo-2016/opi-bus-modernismo2016.jpg) center no-repeat;*/
    margin-left: 0px;
    top: 30px;
  }
  #project-modernismo-2016 .frame-04 .comp-left img,
  #project-modernismo-2016 .frame-04 .comp-right img,
  #project-modernismo-2016 .frame-05 .comp-left img,
  #project-modernismo-2016 .frame-05 .comp-right img {
    width:100%;
    height: auto;
  }
  #project-modernismo-2016 .frame-06 {
    /*margin-top: 180px;*/
    height: 800px;
  }


}

@media (min-width:768px) {
  #project-blog-santpau .frame-01 {
    height: 920px;
    background-image: url(../img/project/blog-santpau/frame-01-25a20f8e6f.jpg);
  }

  #project-blog-santpau .frame-02 {
    height: 837px;
  }

  #project-blog-santpau .frame-02 .comp {
    position: absolute;
    width: 814px;
    height: 568px;
    left: 50%;
    margin-left: -407px;
    z-index: 10;
    background: url(../img/project/blog-santpau/frame-02-7608dcc027.svg) center no-repeat;
    top: 128px;
  }

  .no-svg #project-blog-santpau .frame-02 .comp {
    background-image: url(../img/project/blog-santpau/frame-02-09d0d4972f.png);
  }

  #project-blog-santpau .frame-03 {
    height: 850px;
    background-image: url(../img/project/blog-santpau/frame-03-ae0fec7a9a.jpg);
  }

  #project-blog-santpau .frame-03 .comp-tablet {
    position: absolute;
    background-image: url(../img/project/blog-santpau/frame-03-tablet-3835e2f868.png);
    width: 949px;
    height: 720px;
    background-size: contain;
    top: 456px;
    z-index: 10;
  }

  #project-blog-santpau .frame-03 .comp-tablet>div {
    background-image: url(../img/project/blog-santpau/frame-03-screen-abf7a38b87.gif);
    width: 686px;
    height: 514px;
    margin-left: -343px;
  }

  #project-blog-santpau .frame-04 {
    height: 1260px;
    background-image: url(../img/project/blog-santpau/frame-04-b74ef50cbd.jpg);
    background-position: center 193px;
  }

  #project-blog-santpau .frame-04 .comp-phone {
    position: absolute;
    width: 570px;
    height: 750px;
    left: 50%;
    background: url(../img/project/blog-santpau/frame-04-phone-bae5215ce8.png) center no-repeat;
    z-index: 10;
    bottom: 0;
    margin-left: -490px;
  }

  #project-blog-santpau .frame-04 .comp-phone>div {
    position: absolute;
    width: 245px;
    height: 439px;
    left: 50%;
    z-index: 10;
    background: url(../img/project/blog-santpau/frame-04-screen-9fa76bd7b5.gif) center no-repeat;
    margin-left: -53px;
    top: 117px;
  }
}

@media (max-width:767px) {
  #project-blog-santpau .frame-01 {
    color: #000000;
  }

  #project-blog-santpau .frame-02 img.xs-content {
    width: auto;
    margin: 0 auto;
  }

  #project-blog-santpau .frame-03 {
    position: relative;
    height: 320px;
    margin-bottom: 160px;
    background-image: url(../img/project/blog-santpau/xs/frame-03-c1936dd41f.jpg);
    background-size: cover;
  }

  #project-blog-santpau .frame-03 .comp-tablet {
    top: auto;
    bottom: -160px;
    position: absolute;
    left: 50%;
    margin-left: -160px;
  }

  #project-blog-santpau .frame-03 .comp-tablet>div {
    background-image: url(../img/project/blog-santpau/xs/frame-03-screen-f933f68d2c.gif);
  }

  #project-blog-santpau .frame-04 {
    height: 320px;
    background: url(../img/project/blog-santpau/xs/frame-04-93735ca11d.jpg) right -20px no-repeat;
  }

  #project-blog-santpau .frame-04 .comp-phone {
    position: absolute;
    width: 320px;
    height: 320px;
    left: 50%;
    margin-left: -160px;
    background: url(../img/project/blog-santpau/xs/frame-04-phone-d17c2213cf.png) center no-repeat;
    z-index: 10;
    bottom: 160px;
  }

  #project-blog-santpau .frame-04 .comp-phone>div {
    position: absolute;
    width: 98px;
    height: 176px;
    left: 50%;
    z-index: 10;
    background: url(../img/project/blog-santpau/xs/frame-04-screen-ecd143ad23.gif) center no-repeat;
    margin-left: -48px;
    top: 65px;
  }
}

@media (min-width:768px) and (max-width:991px) {
  #project-blog-santpau .frame-02 .comp {
    background-size: 75%!important;
  }

  #project-blog-santpau .frame-03 .comp-tablet {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
  }
}

@media (min-width:768px) {
  #project-cerca .frame-01 {
    height: 1240px;
    height: 758px;
    position: relative;
    background-image: url(../img/project/cerca/frame-01-ad4f93e9cc.jpg);
  }

  #project-cerca .frame-01 .comp-mac {
    top: 415px;
    margin-left: -450px;
    z-index: 12;
  }

  #project-cerca .frame-01 .comp-mac>div {
    background-image: url(../img/project/cerca/frame-01-screen-fca8645204.gif);
  }

  #project-cerca .frame-01 .comp-bar {
    background: #fff;
    height: 280px;
    width: 2000px;
    left: 50%;
    bottom: -155px;
    margin-left: -1000px;
    -webkit-transform: rotate(-7.4deg);
    -ms-transform: rotate(-7.4deg);
    transform: rotate(-7.4deg);
    z-index: 11;
  }

  #project-cerca .frame-01-spacer {
    height: 482px;
  }

  #project-cerca .frame-02 {
    height: 850px;
  }

  #project-cerca .frame-02 .comp {
    top: 114px;
    left: 50%;
    width: 380px;
    height: 598px;
  }

  #project-cerca .frame-02 .comp-left {
    background-image: url(../img/project/cerca/frame-02-left-dd45cfe9d3.jpg);
    margin-left: -394px;
  }

  #project-cerca .frame-02 .comp-right {
    background-image: url(../img/project/cerca/frame-02-right-dab156ad82.jpg);
    margin-left: 45px;
  }

  #project-cerca .frame-03 {
    height: 1120px;
    background-image: url(../img/project/cerca/frame-03-63e83e5748.jpg);
    background-position: center 114px;
  }

  #project-cerca .frame-03 .comp-logo {
    position: absolute;
    width: 727px;
    height: 138px;
    left: 50%;
    margin-left: -363.5px;
    z-index: 10;
    background: url(../img/project/cerca/frame-03-logo-95c7c3153b.png) center no-repeat;
  }

  #project-cerca .frame-04 {
    height: 718px;
    padding-top: 100px;
  }

  #project-cerca .frame-05 {
    height: 930px;
    background-image: url(../img/project/cerca/frame-05-ba40cd3689.jpg);
  }

  #project-cerca .frame-05 .comp-el {
    position: absolute;
    width: 700px;
    height: 754px;
    left: 50%;
    z-index: 10;
    background: url(../img/project/cerca/frame-05-el-17d5b4f4d3.png) center no-repeat;
    top: 315px;
    margin-left: -415px;
  }

  #project-cerca .frame-06 {
    height: 840px;
    padding-top: 58px;
  }




  #project-ced-formacion .frame-01 {
    color: #000000;
    height: 2000px;
    position: relative;
    background-image: url(../img/project/ced-formacion/posterCED-b.png);
  }
  #project-ced-formacion .frame-02 {
    margin-top:-700px;
    background-image: url(../img/project/ced-formacion/mockup-CED3.png);
    height: 800px;
    z-index: 100;
  }
  #project-ced-formacion .frame-03 {
    margin-top:-200px;
    background-image: url(../img/project/ced-formacion/CED-formacio-movil2.png);
    height: 1500px;
  }
  div#video-formacion-ced {
    width: 701px;
    height: 528px;
    margin-top: 124px;
    margin-left: 121px;
    z-index: 101;
  }


}

@media (min-width:768px) and (min-width:992px) {
  #project-cerca .frame-intro .pull-right {
    padding-right: 70px;
  }
}

@media (max-width:767px) {
  #project-cerca .frame-01 {
    position: relative;
    padding-bottom: 100px;
    color: #000000;
  }

  #project-cerca .frame-01 .comp-mac {
    z-index: 1;
    position: absolute;
    margin: 0 0 0 -160px;
    bottom: 0;
  }

  #project-cerca .frame-01 .comp-mac>div {
    background-image: url(../img/project/cerca/xs/frame-01-screen-5f7586a3f8.gif);
  }

  #project-cerca .frame-05 {
    margin-bottom: 20px;
  }

    #project-cerca .frame-06 {
        margin-bottom: 100px;
    }
}

@media (min-width:768px) and (max-width:991px) {
  #project-cerca .frame-01 {
    height: 608px;
  }

  #project-cerca .frame-01 .comp-mac {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    margin-left: -450px;
    left: 50%;
  }

  #project-cerca .frame-02 {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
  }

  #project-cerca .frame-07 {
    height: 1719px;
    background-image: url(../img/project/i2cat/sm/frame-07-797a655524.jpg);
    background-position: center 37px;
  }

  #project-cerca .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
  }

  #project-cerca .carousel img {
    width: 100%;
  }
  #project-ced-formacion #video-formacion-ced {
    margin-left: 0px;
  }
  #project-ced-formacion #video-formacion-ced #video-ced-img{
    width: 730px;
    height: 528px;
  }
}

@media (min-width:768px) {
  #project-cierre-sacalalengua .frame-01 {
    height: 800px;
    background-image: url(../img/project/cierre-sacalalengua/frame-01-49bbefb3d3.jpg);
  }

  #project-cierre-sacalalengua .frame-01 .comp-mac {
    top: 584px;
  }

  #project-cierre-sacalalengua .frame-01 .comp-mac>div {
    background-image: url(../img/project/cierre-sacalalengua/frame-01-screen-ebb1243072.gif);
  }

  #project-cierre-sacalalengua .frame-02 {
    height: 645px;
  }

  #project-cierre-sacalalengua .frame-03 {
    height: 812px;
    padding-top: 150px;
  }

  #project-cierre-sacalalengua .frame-03 .vid-01 a {
    background-image: url(../img/project/cierre-sacalalengua/frame-03-vid1-13b8e01799.jpg);
  }

  #project-pau-education .frame-02 .vid-01 img{
    border: 1px solid #fff;
    position: absolute;
    z-index: 12;
  }
  #project-pau-education .frame-03 .vid-02 a {
    background-image: url(../img/project/pau-education/videos-PAU2.jpg);
    border: 1px solid #333;
  }
  #project-pau-education .frame-01 {
    height: 400px;
    background: #cee9f0;
  }
  #project-pau-education .frame-02 {
    height: 500px;
    background: #cee9f0;
  }
  #project-pau-education .frame-03 {
    height: 800px;
    background: #fff;
  }
  #project-pau-education .vid a:before {
    background: none;
  }




  #project-icrea-videos .frame-01 img {
    border: 1px solid #fff;
    position: absolute;
    z-index: 12;
  }
  #project-icrea-videos .frame-02 .vid-01 img {
    border: 1px solid #fff;
    position: absolute;
    z-index: 12;
  }
  #project-icrea-videos .frame-03 .vid-02 a {
    background-image: url(../img/project/pau-education/videos-PAU2.jpg);
  }
  #project-icrea-videos .frame-01 {
    color: #000000;
    height: 300px;
    /*background: #cee9f0;*/
  }
  #project-icrea-videos .frame-02 {
    /*height: 400px;*/
    /*background: #cee9f0;*/
  }
  #project-icrea-videos .frame-03 {
    /*height: 400px;*/
    background: #fff;
  }
  #project-icrea-videos .frame-07 {
    height: 650px !important;
    padding: 0px;
    background: #fff;
  }
  #project-icrea-videos .vid a:before {
    background: none;
  }


}

@media (max-width:767px) {
  #project-cierre-sacalalengua {
    padding-bottom: 40px;
  }

    #project-cierre-sacalalengua .frame-01 {
        color: #000000;
    }

  #project-cierre-sacalalengua .frame-01 .comp-mac {
    width: 320px;
    height: 260px;
    left: 50%;
    z-index: 10;
    background: url(../img/project/cierre-sacalalengua/xs/frame-02-mac-0db7fc057a.jpg) center no-repeat;
    margin: 30px auto;
    position: static;
  }

  #project-cierre-sacalalengua .frame-01 .comp-mac>div {
    position: absolute;
    width: 235px;
    height: 130px;
    left: 50%;
    margin-left: -117.5px;
    z-index: 10;
    background: url(../img/project/cierre-sacalalengua/xs/frame-02-screen-927091d8ea.gif) center no-repeat;
    margin-top: 22px;
  }

  #project-cierre-sacalalengua .frame-03 .vid-01 a {
    background-image: url(../img/project/cierre-sacalalengua/xs/frame-03-aa09cab436.jpg);
  }

  #project-cierre-sacalalengua .frame-03 .vid-01 a:after,#project-cierre-sacalalengua .frame-03 .vid-01 a:before {
    display: none;
  }

  #project-pau-education .frame-02 .vid-01 a {
    background-image: url(../img/project/pau-education/videos-PAU1.jpg);
  }
  #project-pau-education .frame-04 .vid-02 a {
    background-image: url(../img/project/pau-education/videos-PAU2.jpg);

  }

  #project-pau-education .vid img {
    width: 100%;
  }
  #project-pau-education .frame-03 .vid-02 a {
    background-image: url(../img/project/pau-education/videos-PAU2.jpg);
    border: 1px solid #333;
  }
  #project-pau-education .vid a:before {
    background: none;
  }

  #project-ced-formacion .frame-02 {
    background-image: url("../img/project/ced-formacion/xs/frame02.png");
    background-repeat: no-repeat;
    background-position-x: center;
    /*background-size: cover;*/
    /*width: 100%;*/
    height:300px;
  }
  #project-ced-formacion #video-formacion-ced #video-ced-img{
    width: 730px;
    height: 528px;
  }
  #project-ced-formacion #video-ced-img {
    visibility: hidden;
    display: none;

  }
  #project-ced-formacion #video-ced-img-movil {
    width: 234px;
    height: 175px;
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
  }
  #project-ced-formacion #vimeo-2 iframe {
    margin-left: auto;
    margin-right: auto;
    width: 234px;
    height: 175px;
  }
  #project-ced-formacion #video-formacion-ced {
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
    width: 234px;
    height: 175px;
  }
}

@media (min-width:768px) and (max-width:991px) {
  #project-cierre-sacalalengua .frame-01 .comp-mac {
    top: auto;
    bottom: -700px;
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 1000px;
    left: 50%;
    margin-left: -500px;
  }

  #project-cierre-sacalalengua .frame-02 {
    height: 400px;
  }

  #project-cierre-sacalalengua .frame-03 {
    -webkit-transform: scale(.75,.75);
    -ms-transform: scale(.75,.75);
    transform: scale(.75,.75);
  }
}

@media (min-width:768px) {
  #project-hospital-santpau .frame-01 {
    height: 1264px;
    height: 900px;
    background-image: url(../img/project/hospital-santpau/frame-01-7a4052639e.jpg);
  }

  #project-hospital-santpau .frame-01 .comp-mac {
    top: 588px;
  }

  #project-hospital-santpau .frame-01 .comp-mac>div {
    background-image: url(../img/project/hospital-santpau/frame-01-screen-36acf2c3fb.gif);
  }

  #project-hospital-santpau .frame-01-spacer {
    height: 364px;
  }

  #project-hospital-santpau .frame-02 {
    height: 1000px;
    background: #f0f0f0;
  }

  #project-hospital-santpau .frame-02 .comp-browser {
    top: 130px;
    position: absolute;
    width: 892px;
    height: 700px;
    left: 50%;
    margin-left: -446px;
    z-index: 11;
    background: url(../img/project/hospital-santpau/frame-02-browser-402c3383e1.png) top no-repeat;
  }

  #project-hospital-santpau .frame-02 .comp-browser>div {
    position: absolute;
    top: 45px;
    left: 1px;
    width: 889px;
    height: 654px;
    background: url(../img/project/hospital-santpau/frame-02-screen-f15fc53247.gif) center no-repeat;
  }

  #project-hospital-santpau .frame-02 .comp-arr {
    position: absolute;
    left: 50%;
    bottom: -84px;
    margin-left: -42px;
    border-style: solid;
    border-width: 42px;
    border-color: #f0f0f0 transparent transparent;
  }

  #project-hospital-santpau .frame-03 {
    height: 740px;
  }

  #project-hospital-santpau .frame-03 .comp-tablet {
    background-image: url(../img/project/hospital-santpau/frame-03-tablet-4731a661bf.png);
    position: absolute;
    width: 632px;
    height: 455px;
    left: 50%;
    margin-left: -316px;
    z-index: 11;
    top: 170px;
  }

  #project-hospital-santpau .frame-03 .comp-tablet>div {
    background-image: url(../img/project/hospital-santpau/frame-03-screen-5ee344fba9.gif);
    position: absolute;
    width: 433px;
    height: 338px;
    left: 50%;
    margin-left: -216.5px;
    z-index: 11;
    top: 54px;
  }

  #project-hospital-santpau .frame-04 {
    height: 420px;
    background-image: url(../img/project/hospital-santpau/frame-04-7f1358ee5e.jpg);
  }

  #project-hospital-santpau .frame-05 {
    height: 573px;
    background-image: url(../img/project/hospital-santpau/frame-05-2ddeef49a2.gif);
  }
}

@media (max-width:767px) {
  #project-hospital-santpau .frame-01 {
    color: #000000;
  }

  #project-hospital-santpau .frame-01 .comp-mac>div {
    background-image: url(../img/project/hospital-santpau/xs/frame-02-screen-dd1bd57661.gif);
  }

  #project-hospital-santpau .frame-03 .comp-tablet>div {
    background-image: url(../img/project/hospital-santpau/xs/frame-04-screen-d03517a772.gif);
  }
}

@media (min-width:768px) and (max-width:991px) {
  #project-hospital-santpau .frame-01 {
    height: 700px;
    margin-bottom: 300px;
  }

  #project-hospital-santpau .frame-01 .comp-mac {
    bottom: -700px;
    top: auto;
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
  }

  #project-hospital-santpau .frame-02 .comp-browser {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
  }

  #project-master-vhir .frame-01 .comp-mac {
    -webkit-transform: scale(.8,.8);
    -ms-transform: scale(.8,.8);
    transform: scale(.8,.8);
  }
}

@media (min-width:768px) {
  #project-master-vhir .frame-01 {
    height: 703px;
    background: #4cbec9;
  }

  #project-master-vhir .frame-01 .comp-mac {
    top: 313px;
  }

  #project-master-vhir .frame-01 .comp-mac>div {
    background-image: url(../img/project/master-vhir/frame-01-screen-0eff4626e3.gif);
  }

  #project-master-vhir .frame-01-spacer {
    height: 440px;
  }

  #project-master-vhir .frame-02 {
    height: 1654px;
    background-image: url(../img/project/master-vhir/frame-02-e35c77f609.jpg);
  }

  #project-master-vhir .frame-02 .comp-screen {
    position: absolute;
    width: 168px;
    height: 290px;
    left: 50%;
    z-index: 10;
    background: url(../img/project/master-vhir/frame-02-screen-c305d0051a.gif) center no-repeat;
    margin-left: -89px;
    top: 962px;
    background-size: contain;
  }
}

@media (max-width:767px) {
  #project-master-vhir .frame-01 {
    color: #000000;
  }
  #project-master-vhir .frame-01 .comp-mac>div {
    background-image: url(../img/project/master-vhir/xs/frame-01-screen-cb6e5099cc.gif);
  }
}

@media (min-width:768px) {
  #project-crg .frame-01 {
    height: 800px;
    background-image: url(../img/project/crg/frame-01-40c0b9fb61.jpg);
  }

  #project-crg .frame-02 {
    height: 770px;
  }

  #project-crg .frame-02 .comp-mac {
    height: 850px;
    background-image: url(../img/project/crg/frame-02-mac-83aef87126.jpg);
  }

  #project-crg .frame-02 .comp-mac>div {
    top: 200px;
    background-image: url(../img/project/crg/frame-02-screen-3a2bb93185.gif);
  }

  #project-crg .frame-03 {
    height: 1449px;
    background-image: url(../img/project/crg/frame-03-c11687ba4e.jpg);
  }

  #project-crg .frame-03 .comp-screen {
    position: absolute;
    width: 550px;
    height: 414px;
    left: 50%;
    z-index: 11;
    background-image: url(../img/project/crg/frame-03-screen-4b140b3bf1.gif);
    top: 518px;
    margin-left: -133px;
  }

  #project-crg .frame-04 {
    margin-top: -178px;
    margin-bottom: 150px;
  }

  #project-crg .prev {
    height: 722px;
    padding: 60px 0 0;
    position: relative;
    color: #646464;
  }

  #project-crg .prev .prev-content {
    width: 210px;
    margin-left: 2px;
  }

  #project-crg .prev .prev-content h3 {
    font: 300 20px/30px basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
    margin: 28px 0 8px;
    color: #009bce;
  }

  #project-crg .prev .prev-content p {
    margin: 0;
  }

  #project-crg .prev .prev-num {
    font: 700 110px/110px basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
    margin-left: -2px;
    color: #edebea;
  }

  #project-crg #footer,#project-crg #footer a,#project-crg .prev.prev-01 .prev-num,#project-crg .prev.prev-even .prev-num {
    color: #fff;
  }

  #project-crg .prev .comp-tablet {
    top: 15px;
    margin-left: -310px;
  }

  #project-crg .prev .comp-tablet>.vid {
    margin: 0 0 0 -272px;
    width: 550px;
    height: 420px;
    top: 125px;
  }

  #project-crg .prev .comp-tablet>.vid>a:before {
    background: 0 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }

  #project-crg .prev.prev-even {
    background: #edebea;
  }

  #project-crg .prev.prev-06 {
    height: 829px;
  }

  #project-crg .prev.prev-01 .vid {
    background-image: url(../img/project/crg/frame-04-vid01-4574a7c070.jpg);
  }

  #project-crg .prev.prev-02 .vid {
    background-image: url(../img/project/crg/frame-04-vid02-774402d1ae.jpg);
  }

  #project-crg .prev.prev-03 .vid {
    background-image: url(../img/project/crg/frame-04-vid03-16e0137b3e.jpg);
  }

  #project-crg .prev.prev-04 .vid {
    background-image: url(../img/project/crg/frame-04-vid04-570ddd2ce9.jpg);
  }

  #project-crg .prev.prev-05 .vid {
    background-image: url(../img/project/crg/frame-04-vid05-102565f3d0.jpg);
  }

  #project-crg .prev.prev-06 .vid {
    background-image: url(../img/project/crg/frame-04-vid06-5c1dcbb093.jpg);
  }

  #project-crg #footer {
    background: #333;
  }
}

@media (max-width:767px) {

  #project-crg .frame-02 .comp-mac {
    background-image: url(../img/project/crg/xs/frame-02-mac-7b9943acc2.jpg);
    height: 320px;
    margin: 0 auto;
  }

  #project-crg .frame-02 .comp-mac>div {
    background-image: url(../img/project/crg/xs/frame-02-screen-b1a1bcb0c6.gif);
    margin-top: 78px;
  }

  #project-crg .frame-03 {
    /*background: rgba(0, 0, 0, 0) url("../img/project/crg/xs/frame03.png") no-repeat scroll center top;*/
    height: auto;
    margin-top: 0;
    padding-bottom: 0px;
  }

  #project-crg .frame-03  .xs-mobiles{
    /*background-image: url("../img/project/crg/xs/frame03.png"), url("../img/project/crg/xs/fondo-madera.jpg");*/
    background-image: url("../img/project/crg/xs/frame03.png");
    background-repeat: no-repeat;
    background-size: auto auto;
    background-position: center;
    height: 1565px;
  }

  #project-crg .frame-03 >  img {
    position: relative;
    top: -200px;
  }

  #project-crg .frame-03 .comp-tablet {
    margin-top: -150px;
    margin-bottom: 50px;
  }

  #project-crg .frame-03 .comp-tablet>div {
    background-image: url(../img/project/crg/xs/frame-03-02-screen-bc3203e866.gif);
  }

  #project-crg .frame-04 {
    margin-top: -100px;
  }

  #project-crg .frame-04 .container {
    padding: 0;
  }

  #project-crg .prev {
    position: relative;
    color: #646464;
  }

  #project-crg .prev .prev-content {
    padding: 0 55px 40px;
  }

  #project-crg .prev .prev-content h3 {
    font: 300 20px/30px basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
    margin: 50px 0 8px;
    color: #009bce;
  }

  #project-crg .prev .prev-content p {
    margin: 0;
  }

  #project-crg .prev .prev-num {
    font: 700 110px/71px basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
    margin-left: 10px;
    color: #edebea;
  }

  #project-crg .prev .comp-tablet {
    background-image: url(../img/project/crg/xs/frame-04-tablet-30c13619bd.png);
    background-position: top;
    width: 320px;
    height: 290px;
  }

  #project-crg .prev .comp-tablet>div {
    width: 213px;
    height: 158px;
    margin-left: -105px;
    margin-top: 77px;
  }

  #project-crg .prev.prev-even {
    background: #edebea;
  }

  #project-crg .prev.prev-even .prev-num {
    color: #fff;
  }

  #project-crg .prev .vid {
    background-size: cover;
  }

  #project-crg .prev.prev-01 .vid {
    background-image: url(../img/project/crg/xs/frame-04-vid01-480f114b09.jpg);
  }

  #project-crg .prev.prev-02 .vid {
    background-image: url(../img/project/crg/xs/frame-04-vid02-164fb71a0a.jpg);
  }

  #project-crg .prev.prev-03 .vid {
    background-image: url(../img/project/crg/xs/frame-04-vid03-5b5902adc4.jpg);
  }

  #project-crg .prev.prev-04 .vid {
    background-image: url(../img/project/crg/xs/frame-04-vid04-535810569c.jpg);
  }

  #project-crg .prev.prev-05 .vid {
    background-image: url(../img/project/crg/xs/frame-04-vid05-8c3f3ab105.jpg);
  }

  #project-crg .prev.prev-06 .vid {
    background-image: url(../img/project/crg/xs/frame-04-vid06-696bbf24b8.jpg);
  }
}

@media (min-width:768px) and (max-width:991px) {
  #project-crg .frame-02,#project-crg .frame-03 {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1500px;
    left: 50%;
    position: relative;
    margin-left: -750px;
  }

  #project-crg .frame-02 {
    height: 308px;
  }

  #project-crg .frame-03 {
    height: 1308px;
  }

  #project-crg .frame-04 .prev {
    padding: 0 50px;
    height: 420px;
  }

  #project-crg .frame-04 .comp-tablet {
    margin-top: -150px;
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
  }

  #project-crg .prev.prev-01 .prev-num {
    color: #edebea;
  }
}








/* CRG Annual Report 2015*/
#project-crg-annual-report-2015 .frame-01{
  background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2015/crg-annual-report-2015.jpg") no-repeat scroll center top / auto 800px;
  height: 800px;
}

#project-crg-annual-report-2015 .frame-intro h1,
#project-crg-annual-report-2015 .frame-intro p{
  color: #fff;
}

#project-crg-annual-report-2015 .frame-intro p {
  color: #fff;
  font-family: basier;
  font-size: 14px;
  line-height: 21px;
}


/*@media (min-width:768px) {*/

#project-crg-annual-report-2015 .frame-02 {
  height: 770px;
  position: relative;
}

#project-crg-annual-report-2015 .frame-02 .comp-mac {
  height: 850px;
  /*background-image: url(../img/project/crg/frame-02-mac-83aef87126.jpg);*/
}

#project-crg-annual-report-2015 .frame-02 .comp-mac > div {
  background-image: url("../img/project/crg-ar-2015/desktop-animation.gif");
  left: 49.8%;
  top: 159px;
  width: 683px;
}

#project-crg-annual-report-2015 .frame-03 {
  background: url("../img/project/crg-ar-2015/ipad.png") no-repeat scroll calc(50% + 20px) 0 / 1936px auto, rgba(0, 0, 0, 0) url("../img/project/crg-ar-2015/03-fondo-degradadoCRG.jpg") no-repeat scroll center center;
  height: 720px;
  position: relative;
}

#project-crg-annual-report-2015 .frame-03 .comp-screen {
  background-position: 50% 45%;
  background-repeat: no-repeat;
  background-size: 1200px auto;
  height: 397px;
  left: calc(50% - 254px);
  position: absolute;
  top: 112px;
  width: 550px;
  z-index: 17;
}

.selector {
  display: inline-block;
  left: 0;
  position: absolute;
  text-align: center;
  top: 590px;
  width: 100%;
}

.selector > li {
  display: inline-block;
}

.selector > li > a {
  background-image: url("../img/project/crg-ar-2015/option.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 15px 15px;
  display: inline-block;
  height: 15px;
  width: 32px;
}

.selector > li > a.active {
  background-image: url("../img/project/crg-ar-2015/active-option.png");
  background-position: center center;
  background-repeat: no-repeat;
}

#project-crg-annual-report-2015 .frame-03 .comp-screen .seq {
  background-position: 50% 45%;
  background-repeat: no-repeat;
  background-size: 1200px auto;
  height: 406px;
  left: calc(50% - 277px);
  position: absolute;
  top: 1px;
  width: 550px;
  z-index: 7;
  /*display: none;*/
}

#project-crg-annual-report-2015 .frame-03 .comp-screen .seq-1 {
  background-image: url("../img/project/crg-ar-2015/fondo-ipadCRG-1.png");
}

#project-crg-annual-report-2015 .frame-03 .comp-screen .seq-2 {
  background-image: url("../img/project/crg-ar-2015/fondo-ipadCRG-2.png");
}

#project-crg-annual-report-2015 .frame-03 .comp-screen .seq-3 {
  background-image: url("../img/project/crg-ar-2015/fondo-ipadCRG-3.png");
}

#project-crg-annual-report-2015 .frame-03 .comp-screen .seq-4 {
  background-image: url("../img/project/crg-ar-2015/fondo-ipadCRG-4.png");
}

#project-crg-annual-report-2015 .frame-04 {
  box-sizing: border-box;
  height: auto;
  padding-bottom: 50px;
  padding-top: 80px;
  position: relative;
}

#project-crg-annual-report-2015 .mobile {
  background-attachment: scroll;
  background-clip: border-box;
  background-color: rgba(0, 0, 0, 0);
  background-image: url("../img/project/crg-ar-2015/moviles.jpg");
  background-origin: padding-box;
  background-repeat: no-repeat;
  background-size: 1218px auto;
  display: inline-block;
  height: 530px;
  margin-left: 144px;
  width: 214px;
}

#project-crg-annual-report-2015 .mobile-1 {
  background-position: -215px 0;
  margin-left: 0;
}

#project-crg-annual-report-2015 .mobile-2 {
  background-position: -499px 0;
}

#project-crg-annual-report-2015 .mobile-3 {
  background-position: -783px 0;
}

#project-crg-annual-report-2015 .frame-05 {
  background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2015/montaje-papel-crg1.jpg") no-repeat scroll center center;
  height: 1000px;
}

#project-crg-annual-report-2015 .frame-06 {
  background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2015/montaje-papel-crg2.jpg") no-repeat scroll center center;
  height: 1000px;
}

#project-crg-annual-report-2015 .tablet {
  background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2015/ipad-videos.png") no-repeat scroll center center;
}

.frame.frame-07 {
  height: 1000px;
  padding: 140px;
}

#project-crg-annual-report-2015 .text-container {
  position: relative;
}

#project-crg-annual-report-2015 .text-seq {
  left: 0;
  position: absolute;
  top: 10px;
  display: none;
}

#project-crg-annual-report-2015 .text-seq.seq-1 {
  display: inline-block;
}

#project-crg-annual-report-2015 .tablet {
  background-attachment: scroll;
  background-clip: border-box;
  background-image: url("../img/project/crg-ar-2015/ipad-videos.png");
  background-origin: padding-box;
  background-position: -498px -49px;
  background-repeat: no-repeat;
  background-size: 1508px auto;
  height: 415px;
  width: 580px;
}

#project-crg-annual-report-2015 .frame-07 .left {
  float: left;
  width: 30%;
}

#project-crg-annual-report-2015 .frame-07 .right {
  display: inline-block;
  float: right;
  width: 70%;
}

#project-crg-annual-report-2015 .tablet {
  background-attachment: scroll;
  background-clip: border-box;
  background-image: url("../img/project/crg-ar-2015/ipad-videos.png");
  background-origin: padding-box;
  background-position: -563px -49px;
  background-repeat: no-repeat;
  background-size: 1730px auto;
  float: right;
  height: 545px;
  width: 640px;
}

#project-crg-annual-report-2015 .frame-07 .vid
{
  height: 380px;
  margin-left: 60px;
  margin-top: 32px;
  width: 485px;
  position: relative;
}

#project-crg-annual-report-2015 .frame-07 .vid  .play-video{
  z-index: 7;
}

#project-crg-annual-report-2015 .frame-07 .frame-video-container {
  display: block;
  height: 380px;
  position: absolute;
  width: 485px;
  z-index: 5;
}

#project-crg-annual-report-2015 .frame-07 .vid .bg{
  height: 380px;
  left: 0;
  position: absolute;
  top: 0;
  width: 485px;
  display:block;
}



#project-crg-annual-report-2015 .vid a::before {
  background: rgba(0, 0, 0, 0.3) none repeat scroll 0 0;
  bottom: -1px;
  left: -1px;
  right: -1px;
  top: -2px;
}


#project-crg-annual-report-2015 .frame-07 .vid .seq-1 {
  background: url("../img/project/crg-ar-2015/video1-CRG.jpg");
}

#project-crg-annual-report-2015 .frame-07 .vid .seq-2 {
  background: url("../img/project/crg-ar-2015/video2-CRG.jpg");
}

#project-crg-annual-report-2015 .frame-07 .vid .seq-3 {
  background: url("../img/project/crg-ar-2015/video3-CRG.jpg");
}

#project-crg-annual-report-2015 .frame-07 .vid .seq-4 {
  background: url("../img/project/crg-ar-2015/video4-CRG.jpg");
}

#project-crg-annual-report-2015 .frame-07 .vid .seq-5 {
  background: url("../img/project/crg-ar-2015/video5-CRG.jpg");
}

#project-crg-annual-report-2015 .frame-07 .vid .seq-6 {
  background: url("../img/project/crg-ar-2015/video6-CRG.jpg");
}

.video-selector .video-option {
  border: 1px solid transparent;
  box-sizing: border-box;
  color: #646464;
  display: inline-block;
  height: 36px;
  padding-top: 7px;
  text-align: center;
  width: 36px;
  text-decoration: none;
}

.video-selector .video-option.active {
  color: #00A0FF;
  border: 1px solid #009CCE;

}

.frame-07 .hightlight {
  color: #009cce;
  font-family: basier;
  font-size: 20px;
  line-height: 30px;
  font-weight: lighter;
}

.frame-07 p {
  color: #646464;
  font-size: 14px;
  font-family: basier;
  line-height: 21px;
}

#project-iciq .frame-03 #slider-iciq {
  display: table-cell;
  vertical-align: middle;
}
.css-slideshow{
  position: relative;
  max-width: 672px;
  height: 374px;
  /*margin: 5em auto .5em auto;*/
}
.css-slideshow figure{
  margin: 0;
  position: absolute;
}
.css-slideshow figcaption{
  position: absolute;
  top: 0;
  color: #fff;
  background: rgba(0,0,0, .3);
  font-size: .8em;
  padding: 8px 12px;
  opacity: 0;
  transition: opacity .5s;
}
.css-slideshow:hover figure figcaption{
  transition: opacity .5s;
  opacity: 1;
}
.css-slideshow figure{
  opacity:0;
}
figure:nth-child(1) {
  animation: xfade 25s 0s infinite;
}
figure:nth-child(2) {
  animation: xfade 25s 5s infinite;
}
figure:nth-child(3) {
  animation: xfade 25s 10s infinite;
}
figure:nth-child(4) {
  animation: xfade 25s 15s infinite;
}
figure:nth-child(5) {
  animation: xfade 25s 20s infinite;
}
/*figure:nth-child(6) {*/
/*animation: xfade 48s 12s infinite;*/
/*}*/
/*figure:nth-child(7) {*/
/*animation: xfade 48s 6s infinite;*/
/*}*/
/*figure:nth-child(8) {*/
/*animation: xfade 48s 0s infinite;*/
/*}*/
@keyframes xfade{
  0%{
    opacity: 1;
  }
  10.5% {
    opacity: 1;
  }
  20%{
    opacity: 0;
  }
  98% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@media(min-width: 768px) and (max-width: 995px) {
  #project-crg-annual-report-2015 .mobile {
    margin-left: 46px;
  }
  #project-crg-annual-report-2015 .mobile-1 {
    margin-left: 0;
  }

  #project-crg-annual-report-2015 .frame.frame-07 {
    padding: 100px 0 0;
    height: 1200px;
  }


}

@media(min-width: 768px) and (max-width: 995px) {
  #project-crg-annual-report-2015 .frame-07 .right {
    display: block;
    float: right;
    left: 16%;
    margin: 0;
    width: 100%;
  }

  #project-crg-annual-report-2015 .frame-07 .left {
    clear: both;
    display: block;
    float: none;
    height: 365px;
    margin: 0 auto 2px;
    padding: 20px 19px 20px 94px;
    position: inherit;
    width: 82%;
  }


  #project-crg-annual-report-2015 .frame-07  .video-selector .video-option {
    width: 75px;
  }

  #project-crg-annual-report-2015 .frame-07 .hightlight,
  #project-crg-annual-report-2015 .frame-07  p{
    width: 100% ;
  }
}

@media(min-width: 768px) {

}
@media(min-width: 1281px){

}
@media(min-width: 768px) and (max-width: 1280px){
    #project-crg-annual-report-2015 .frame-05 {
        background-size: 1600px;
        height: 830px;
    }
    #project-crg-annual-report-2015 .frame-06 {
        margin-top: 100px;
        background-size: 1600px;
        height: 830px;
    }
}
@media(max-width: 767px){



  #project-crg-annual-report-2015 .frame{
    display: block;
    position: inherit;
    clear: both;
  }

  #project-crg-annual-report-2015 .frame::before,
  #project-crg-annual-report-2015 .frame::after{
    content: "";
    display: table;
    clear: both;
  }


  #project-crg-annual-report-2015 .frame-01 {
    height: auto;
    min-height: 369px;
    padding-bottom: 20px;
  }

  #project-crg-annual-report-2015 .frame-02 .comp-mac > div {
    background-size: 295px auto;
    height: 159px;
    left: calc(50% - 43px);
    top: -4px;
    width: 320px;
  }

  #project-crg-annual-report-2015 .frame-02 {
    height: 360px;
    position: relative !important;
  }

  .project .comp-mac {
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
    background-image: url("../img/mac-xs-4e39fb00d8.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: auto auto;
    height: 260px;
    left: 47%;
    position: static;
    width: 320px;
  }

  #project-crg-annual-report-2015 .frame-02 .comp-mac {
    background-position: center center;
    background-size: 120% auto;
    height: 290px;
    width: 320px;
  }


  #project-crg-annual-report-2015 .frame-03{
    background-position: center center, 0 0;
    background-size: 240% auto, 220% auto;
    height: 550px;
    position: relative;
  }



  #project-crg-annual-report-2015 .frame-03 .comp-screen  {
    height: 100%;
    left: 13.2%;
    position: relative;
    top: 0;
    width: 75%;
  }


  #project-crg-annual-report-2015 .frame-03 .comp-screen .seq {
    background-position: 50% 46%;
    background-size: 203% auto;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
  }

  #project-crg-annual-report-2015 .frame-03 .selector {
    bottom: 10px;
    display: block;
    padding: 0;
    position: absolute;
    text-align: center;
    top: auto;
    width: 100%;
    z-index: 17;
  }


  #project-crg-annual-report-2015 .mobile {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }


  #project-crg-annual-report-2015 .frame-04 {
    height: auto;
    padding-bottom: 50px;
  }
    #project-crg-annual-report-2015 .frame-05 {
        background-size: 770px;
        height: 400px;
    }
    #project-crg-annual-report-2015 .frame-06 {
        background-size: 770px;
        height: 400px;
    }

  #project-crg-annual-report-2015 .frame-07 {
    padding: 0;
      height: 800px;
  }

  #project-crg-annual-report-2015 .frame-07 .container{
    padding: 0;
  }


  #project-crg-annual-report-2015 .frame-07 .left,
  #project-crg-annual-report-2015 .frame-07 .right
  {
    width: 100%;
    display: block;
  }

  #project-crg-annual-report-2015 .frame-07 .frame-video-container {
    display: block;
    height: 186px;
    position: absolute;
    top: -3px;
    width: 235px;
    z-index: 5;
  }

  #project-crg-annual-report-2015 .frame-07 .vid .bg {
    background-position: center center;
    background-size: 234px 184px;
    height: 184px;
    top: -2px;
    width: 234px;
  }


  #project-crg-annual-report-2015  .frame-07 .tablet {
    background-attachment: scroll;
    background-clip: border-box;
    background-image: url("../img/project/crg-ar-2015/ipad-videos.png");
    background-origin: padding-box;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 280% auto;
    display: block;
    float: initial;
    height: 300px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    width: 300px;
  }

  #project-crg-annual-report-2015 .frame-07 .vid {
    background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2015/video1-CRG.jpg") repeat scroll 0 0;
    height: 181px;
    left: -26px;
    top: 52px;
    width: 233px;
  }

  #project-crg-annual-report-2015 .video-selector {
    display: block;
    margin: 0 auto;
    position: unset;
    text-align: center;
    width: 300px;
  }

  #project-crg-annual-report-2015 .text-seq {
    display: none;
    left: calc(50% - 116px);
    position: absolute;
    top: 10px;
    width: 300px;
  }

    #project-iciq .css-slideshow img {
      width: 100%;
    }
}


@media(max-width:600px){

  #project-crg-annual-report-2015 .frame-07 .vid .bg {
    background-position: center center;
    background-size: 235px auto;
    display: block;
    height: 184px;
    left: 0;
    position: absolute;
    top: -2px;
    width: 235px;
  }

  #project-crg-annual-report-2015 .frame-05 {
    /*background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2015/montaje-papel-crg1.jpg") no-repeat scroll 37% 50% / 1500px auto;*/
    /*height: 520px;*/
  }

  /*#project-crg-annual-report-2015 .frame-06 {*/
    /*background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2015/montaje-papel-crg2.jpg") no-repeat scroll 64% 50% / 1500px auto;*/
    /*height: 520px;*/
  /*}*/
}

@media(max-width: 500px){
  #project-crg-annual-report-2015 .frame.frame-03 {
    height: 400px ;
    overflow: hidden;

  }
}

@media(max-width: 400px){
  #project-crg-annual-report-2015 .frame.frame-03 {
    height: 370px ;
    overflow: hidden;
  }
}

/* END CRG Annual Report 2015*/


/* Sant Pau Recerca */

#project-sant-pau-recerca{

}

#project-sant-pau-recerca .frame-1{
  background: url("../img/project/sant-pau-recerca/01-portadaIRB-santpau.jpg");
}


 #project-sant-pau-recerca  .frame-01 {
    height: 676px;
   background: url("../img/project/sant-pau-recerca/01-portadaIRB-santpau.jpg");
   background-repeat: no-repeat ;
  }

 #project-sant-pau-recerca  .frame-02 {
    height: 850px;
    /*background-image: url(../img/project/blog-santpau/frame-03-ae0fec7a9a.jpg);*/
    background-image: url("../img/project/sant-pau-recerca/iPad-IRBSantPau-2.jpg");
   padding-top: 1px;
 }

 #project-sant-pau-recerca  .frame-02 .comp-tablet {
   /*background-image: url("../img/project/sant-pau-recerca/iPad-IRBSantPau-2.jpg");*/
   background-image: none;
   background-size: contain;
   display: block;
   height: 720px;
   position: inherit;
   width: 949px;
   z-index: 10;
  }

 #project-sant-pau-recerca  .frame-02 .comp-tablet>div {
   background-image: url("../img/project/sant-pau-recerca/iPad-IRBSantPau-2_OK.gif");
   background-size: 100% auto;
   display: block;
   height: 443px;
   margin: 188px auto 0 155px;
   padding: 0;
   position: static;
   width: 588px;
  }

 #project-sant-pau-recerca  .frame-03 {
   background: rgba(0, 0, 0, 0) url("../img/project/sant-pau-recerca/iPhone-Mockup-SantPau1.jpg") no-repeat scroll center 0;
   height: 898px;
   margin: 0;
  }

 #project-sant-pau-recerca  .frame-03 .comp-phone {
    position: absolute;
    width: 570px;
    height: 750px;
    left: 50%;
    background: url(../img/project/blog-santpau/frame-04-phone-bae5215ce8.png) center no-repeat;
    z-index: 10;
    bottom: 0;
    margin-left: -490px;
  }

 #project-sant-pau-recerca  .frame-03 .comp-phone > div {
    position: absolute;
    width: 245px;
    height: 439px;
    left: 50%;
    z-index: 10;
    background: url(../img/project/blog-santpau/frame-04-screen-9fa76bd7b5.gif) center no-repeat;
    margin-left: -53px;
    top: 117px;
  }

  #project-sant-pau-recerca  .frame-04 {
    background-image: url("../img/project/sant-pau-recerca/macbook-Mockup-SantPau1.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    height: 1198px;
  }

  #project-sant-pau-recerca .slide-ctn{
      display: block;
      left: calc(50% - 409px);
      margin: 0;
      position: relative;
      top: 100px;
  }

  #project-sant-pau-recerca .slide{
    height: 995px;
    left: 0;
    margin-left: 3px;
    position: absolute;
    top: 0;
    width: 814px;
    display: block;
    z-index: 8;
  }


  #project-sant-pau-recerca .seq-1{
    background:url("../img/project/sant-pau-recerca/macbook-screen-SantPau1A.png") center no-repeat;
  }

  #project-sant-pau-recerca .seq-2{
    background:url("../img/project/sant-pau-recerca/macbook-screen-SantPau1B.png") center no-repeat;
  }

  #project-sant-pau-recerca .seq-3{
    background:url("../img/project/sant-pau-recerca/macbook-screen-SantPau1C.png") center no-repeat;
  }



@media (max-width:767px) {
  #project-sant-pau-recerca  .frame-01 {
     height: 360px;
  }

  #project-sant-pau-recerca  .frame-02 {
    height: 600px;
  }

 #project-sant-pau-recerca  .frame-02 {
   background-position: center center;
   background-repeat: no-repeat;
   background-size: 1400px auto;
   width: 100%;
  }

 #project-sant-pau-recerca  .frame-02 .comp-tablet {
    width: 100%;
  }

 #project-sant-pau-recerca  .frame-02 .comp-tablet > div {
   background-image: url("../img/project/sant-pau-recerca/iPad-IRBSantPau-2_OK.gif");
   background-position: 0 0;
   background-size: 430px auto;
   display: block;
   height: 326px;
   margin: 112px auto;
   padding: 0;
   position: unset;
   width: 430px;
 }

  #project-sant-pau-recerca .frame-03 {
    background-position: center center;
    height: 800px;
  }

  #project-sant-pau-recerca .frame-04 {
    background-position: center center;
    background-size: 1200px auto;
    height: 748px;
    overflow: hidden;
  }

  #project-sant-pau-recerca .slide-ctn {
    display: block;
    height: auto;
    left: calc(50% - 259px);
    margin: 0;
    position: relative;
    top: 61px;
    width: auto;
  }

  #project-sant-pau-recerca .slide {
    background-size: 1190px auto !important;
    display: block !important;
    height: 622px;
    left: 0;
    margin-left: 3px;
    position: absolute;
    top: 0;
    width: 512px;
    z-index: 1;
  }


}

@media (max-width:600px) {

  #project-sant-pau-recerca  .frame-01 {
    min-height: 440px;
    height: auto;
    background: none;
      color: #000000;
  }

  #project-sant-pau-recerca  .frame-02 {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 790px auto;
    height: 360px;
    width: 100%;
  }

  #project-sant-pau-recerca  .frame-02 .comp-tablet {
    width: 100%;
  }

  #project-sant-pau-recerca  .frame-02 .comp-tablet > div {
    background-image: url("../img/project/sant-pau-recerca/iPad-IRBSantPau-2_OK.gif");
    background-position: 0 0;
    background-size: 245px auto;
    display: block;
    height: 187px;
    margin: 70px auto 0;
    padding: 0;
    position: unset;
    width: 245px;
  }
}
.vid iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/* END CRG Sant Pau Recerca */









/* ISGlobal */
#project-isglobal .frame-01{
  background: rgba(0, 0, 0, 0) url("../img/project/isglobal/isglobal-background-2018.jpg") no-repeat scroll center -150px / auto 850px;
  height: 700px;
}
#project-isglobal .frame-02 {
  height: 800px;
  position: relative;
}
#project-isglobal .frame-02 .comp-mac > div {
  background-image: url("../img/project/isglobal/isglobal-monografic-imac-content.gif");
  left: 49.8%;
  top: 159px;
  width: 683px;
}
#project-isglobal .frame-03 {
  height: 450px;
  position: relative;
}
#project-isglobal .frame-03 > div {
  background-image: url("../img/project/isglobal/isglobal-indice.jpg");
  background-repeat: no-repeat;
  background-position-x: center;
  height: 204px;
  position: relative;
}
#project-isglobal .frame-03 h3 {
  text-align: center;
  font-size: 48px;
}

#project-isglobal .frame-04 {
  height: 800px;
  position: relative;
}
#project-isglobal .frame-04 > div {
  background: url("../img/project/isglobal/isglobal-mockup-mobile.jpg") no-repeat center;
  height: 672px;
  position: relative;
}
/*#project-isglobal .frame-05 {*/
  /*height: 800px;*/
  /*position: relative;*/
/*}*/


#project-isglobal .frame-05 {
  background: url("../img/project/isglobal/ipad.png") no-repeat scroll calc(50% + 42px) 0 / 1936px auto, #e85d6a  no-repeat scroll center center;
  height: 850px;
  position: relative;
}

#project-isglobal .frame-05 .comp-screen {
  background-position: 50% 45%;
  background-repeat: no-repeat;
  background-size: 1200px auto;
  height: 478px;
  left: calc(50% - 160px);
  position: absolute;
  top: 124px;
  width: 358px;
  z-index: 17;
}


#project-isglobal .frame-05 .comp-screen .seq {
  background-position: 50% 45%;
  background-repeat: no-repeat;
  background-size: 358px auto;
  height: 478px;
  left: calc(50% - 180px);
  position: absolute;
  top: 1px;
  width: 358px;
  z-index: 7;
  /*display: none;*/
}

#project-isglobal .selector {
  top: 690px;
}

#project-isglobal .frame-05 .comp-screen .seq-1 {
  background-image: url("../img/project/isglobal/isglobal-ipad-01.jpg");
}

#project-isglobal .frame-04 img {
  display: none;
}
#project-isglobal .frame-05 .comp-screen .seq-2 {
  /*background-image: url("../img/project/isglobal/isglobal-ipad-01.jpg");*/
}

#project-isglobal .frame-05 .comp {
  width: 100% !important;
}
#project-isglobal .frame-05 .comp-ipad > div {
  background-image: url("../img/project/isglobal/isglobal-ipad-02.gif");
  background-size: 100%;
  margin-left: calc(50% - 160px);
  margin-top: 124px;
  width: 357px;
  height: 480px;
}


#project-isglobal .frame-06 {
  height: 950px;
  position: relative;
}
#project-isglobal .frame-06 .comp-mac > div {
  background-image: url("../img/project/isglobal/isglobal-monografic-imac-content-2.gif");
  left: 49.8%;
  top: 159px;
  width: 683px;
}
/* DESKTOP: 769px to 1280px*/
@media screen and (min-width: 1281px) {
  #project-isglobal .frame-03 img {
    display: none;
  }
}
@media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-isglobal .frame-03 > div {
    background-image: url("../img/project/isglobal/isglobal-indice.jpg");
    height: 204px;
    position: relative;
    background-size: 100%;
    background-repeat: no-repeat;
  }
  #project-isglobal .frame-03 {
    height: auto;
  }
  #project-isglobal .frame-03 img {
    display: block;
    width: 100%;
  }
  #project-isglobal .frame-04 {
    margin-top: 100px;
    height: auto;
  }
  #project-isglobal .frame-04 > div {
    background: none;
    height: auto;
    position: relative;
    background-size: 100%;
  }

  #project-isglobal .frame-04 img {
    display: block;
    width: 100%;
  }

  #project-isglobal .frame-05 {
    margin-top: 100px;
  }
}


/*IPAD*/


@media screen and (device-width: 768px) {


  #project-isglobal .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/isglobal/isglobal-background-2018.jpg") no-repeat scroll left top / 200%;
    height: 660px;
  }

  #project-isglobal .frame-03 {
    height: 330px;
  }
  #project-isglobal .frame-03 > div {
    background: none;
  }
  #project-isglobal .frame-03 img {
    display: block;
    width: 100%;
  }
}


@media screen and (max-width: 767px) {
  #project-isglobal .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/isglobal/isglobal-background-2018.jpg") no-repeat scroll center bottom / auto 768px;
    height: 700px;
  }
  #project-isglobal .frame-02 {
    height: 300px;
  }
  #project-isglobal .frame-02 .comp-mac > div {
    background-image: url("../img/project/isglobal/isglobal-monografic-imac-content.gif");
    background-size: 100%;
    left: 49.8%;
    top: 0px;
    width: 237px;
  }
  #project-isglobal .frame-03 {
    height: auto;
  }
  #project-isglobal .frame-03 h3 {
    text-align: center;
    font-size: 30px;
    line-height: 36px;
  }
  #project-isglobal .frame-03 > div {
    background: none;
    height: auto;
  }

  #project-isglobal .frame-03 img {
    display: block;
    width: 80%;
      max-width: 446px;
      margin: 0px auto;
  }


  #project-isglobal .frame-04 {
    height: auto;
    margin-top: 50px;
  }
  #project-isglobal .frame-04 > div {
    background: none;
    height: auto;
  }
  #project-isglobal .frame-04 img {
    display: block;
    width: 100%;
  }

  #project-isglobal .frame-05 {
    margin-top: 50px;
  }


  #project-isglobal .frame-05 .comp-ipad > div {
    background-position-y: 90px;
    background-repeat: no-repeat;
    margin-left: calc(50% - 135px);
    margin-top: auto;
    width: 260px;
    height: 437px;
  }

}










/* Metastasis challenge IRB */
#project-irb-metastasis .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/irb-metastasis/irb-metastasis-background.jpg") no-repeat scroll center top / cover;
  height: 505px;
}

#project-irb-metastasis .frame-02 > div {
  background-image: url("../img/project/irb-metastasis/irb-metastasis-logo.gif") ;
  background-position: center -100px ;
  background-size: 100% auto;
  width: 900px;
  height: 550px;
  position: relative;
  margin: 0px auto;
}

#project-irb-metastasis .frame-03  {
  background-color: #4473F5;
}
#project-irb-metastasis .frame-03 > div {
  background-image: url("../img/project/irb-metastasis/irb-metastasis-art.jpg");
  background-size: 1440px;
  background-repeat: no-repeat;
  background-position-x: center;
  height: 1559px;
  position: relative;
}
#project-irb-metastasis .frame-03 > div img{
  visibility: hidden;
  display: none;
}

#project-irb-metastasis .frame-04 {
  margin-top: 120px;
  height: 770px;
  position: relative;
}

/* DESKTOP: 769px to 1280px*/
@media screen and (min-width: 1281px) {



}

@media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-irb-metastasis .frame-03 > div {
    background-image: none;
    height: auto;
    position: relative;
  }
  #project-irb-metastasis .frame-03 > div img {
    display: block;
    height: auto;
    width: 100%;
    visibility: visible;
  }

  #project-irb-metastasis .carousel {
    -webkit-transform: scale(0.7,0.7);
    -ms-transform: scale(0.7,0.7);
    transform: scale(0.7,0.7);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
  }
  #project-irb-metastasis .carousel img {
    width: 100%;
  }
  #project-irb-metastasis .frame-04 {
    top: 0px;
    height: 840px;
    position: relative;
  }

}


/*IPAD*/
@media screen and (device-width: 768px) {

  #project-irb-metastasis .frame-02 > div {
    background: url("../img/project/irb-metastasis/irb-metastasis-logo.gif") no-repeat -60px -100px / 100%
  }

  #project-irb-metastasis .frame-03 > div {
    background: url("../img/project/irb-metastasis/irb-metastasis-art.jpg") no-repeat top / 100%;
    height: 833px;
    position: relative;
  }

  #project-irb-metastasis .frame-04 {
    top: 0px;
    height: 800px;
  }

  #project-irb-metastasis .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
  }
  #project-irb-metastasis .carousel img {
    width: 100%;
  }
}


@media screen and (min-width: 768px) {
  #project-irb-metastasis .frame-02 img {
    display: none;
  }
}


@media screen and (max-width: 767px) {
  #project-irb-metastasis .frame-02 > div {
    width: 100%;
    height: auto;
    background-image: none;
  }
  #project-irb-metastasis .frame-02 img {
    width: 100%;
    display: block;
  }
  #project-irb-metastasis .frame-04 {
    top: 50px;
    height: auto;
    margin-bottom: 100px;
  }

  #project-irb-metastasis .frame-03 > div {
    background-image: none;
    height: auto;
    position: relative;
  }
  #project-irb-metastasis .frame-03 > div img {
    display: block;
    height: auto;
    width: 100%;
    visibility: visible;
  }
}


@media screen and (max-width: 767px) {
  #project-isglobal .frame-05 {
    background: url("../img/project/isglobal/ipad.png") no-repeat scroll calc(50% + 12px) 0 / 1400px auto, #e85d6a no-repeat scroll center center;
    height: 600px;
  }

  #project-isglobal .frame-05 .comp-screen {
    width: 258px;
    height: 348px;
    left: calc(50% - 133px);
    top: 90px;
  }
  #project-isglobal .frame-05 .comp-screen .seq {
    background-position: top left;
    background-size: 100%;
    width: 100%;
    height: 378px;
    left: 0;
  }

  #project-isglobal .selector {
    top: 510px;
    padding: 0;
  }

  #project-isglobal .frame-06 {
    height: 300px;
  }
  #project-isglobal .frame-06 .comp-mac > div {
    top: 0;
    width: 240px;
    margin-left: 0;
    background-size: 100% auto;
    left: calc(50% - 120px);
    background-position: 0 0;
  }

}












/* BIST AR 2017  */
#project-bist-ar-2017 .frame-01 {
  height: 1469px;
  background-image: url("../img/project/bist-ar-2017/bist-report-2017-01.jpg");
}

#project-bist-ar-2017 .frame-02 {
  height: 900px;
  background:  url("../img/project/bist-ar-2017/bist-report-2017-02.jpg") no-repeat center -50px / 1440px, #e8c372;
}
#project-bist-ar-2017 .frame-03 {
  height: 900px;
  background:  url("../img/project/bist-ar-2017/bist-report-2017-03.jpg") no-repeat center -50px / 1440px, #cac5db;
}
#project-bist-ar-2017 .frame-04 {
  height: 900px;
  background:  url("../img/project/bist-ar-2017/bist-report-2017-04.jpg") no-repeat center -50px / 1440px, #eedec4;
}
#project-bist-ar-2017 .frame-05 {
  height: 900px;
  background:  url("../img/project/bist-ar-2017/bist-report-2017-05.jpg") no-repeat center -50px / 1440px, #56a0a1;
  margin-bottom: 200px;
}

#project-bist-ar-2017 .frame-02  img {
  visibility: hidden;
  height: auto;
  width: 100%;
}
#project-bist-ar-2017 .frame-03 img {
  visibility: hidden;
  height: auto;
  width: 100%;
}
#project-bist-ar-2017 .frame-04 img {
  visibility: hidden;
  height: auto;
  width: 100%;
}
#project-bist-ar-2017 .frame-05 img {
  visibility: hidden;
  height: auto;
  width: 100%;
}

/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-bist-ar-2017 .frame-02 {
    height: auto;
    background: url("../img/project/bist-ar-2017/bist-report-2017-02.jpg") no-repeat center 0px / 100%, #e8c372;
  }


  #project-bist-ar-2017 .frame-03 {
    height: auto;
    background: url("../img/project/bist-ar-2017/bist-report-2017-03.jpg") no-repeat center 0px / 100%, #cac5db
  }

  #project-bist-ar-2017 .frame-04 {
    height: auto;
    background: url("../img/project/bist-ar-2017/bist-report-2017-04.jpg") no-repeat center 0px / 100%, #eedec4;
  }

  #project-bist-ar-2017 .frame-05 {
    height: auto;
    background: url("../img/project/bist-ar-2017/bist-report-2017-05.jpg") no-repeat center 0px / 100%, #56a0a1;
    margin-bottom: 230px;
  }

}

@media screen and (max-width: 991px)  {

  #project-bist-ar-2017 .frame-01 {
    background-size: 1500px;
    height: 1059px;
  }

  #project-bist-ar-2017 .frame-02 {
    background: url("../img/project/bist-ar-2017/bist-report-2017-02.jpg") no-repeat center 0px / 900px, #e8c372;
    height: 650px;
  }
  #project-bist-ar-2017 .frame-03 {
    background: url("../img/project/bist-ar-2017/bist-report-2017-03.jpg") no-repeat center 0px / 900px, #cac5db;
    height: 650px;
  }
  #project-bist-ar-2017 .frame-04 {
    background: url("../img/project/bist-ar-2017/bist-report-2017-04.jpg") no-repeat center 0px / 900px, #eedec4;
    height: 650px;
  }
  #project-bist-ar-2017 .frame-05 {
    background: url("../img/project/bist-ar-2017/bist-report-2017-05.jpg") no-repeat center 0px / 900px, #56a0a1;
    height: 650px;
  }
}


@media screen and (device-width: 768px) {

  #project-bist-ar-2017 .frame-01 {
    height: 970px;
    background-color: #5AAC95;
    background-position-y: 150px;
  }

  #project-bist-ar-2017 .frame-02 {
    background-size: 100%;
    height: 560px;
  }

  #project-bist-ar-2017 .frame-03 {
    background-size: 100%;
    height: 560px;
  }

  #project-bist-ar-2017 .frame-04 {
    height: 560px;
    background-size: 100%;
  }
  #project-bist-ar-2017 .frame-05 {
    height: 560px;
    background-size: 100%;
  }

}

@media screen and (max-width: 767px) {

  #project-bist-ar-2017 .frame-01 {
    background-position-y: 150px;
    background-size: 670px;
    background-color: #5aac95;
    height: 650px;
  }
  #project-bist-ar-2017 .frame-02 {
    background: none;
    height: auto;
  }
  #project-bist-ar-2017 .frame-02 img ,
  #project-bist-ar-2017 .frame-03 img ,
  #project-bist-ar-2017 .frame-04 img ,
  #project-bist-ar-2017 .frame-05 img {
     width: 100%;
     height: auto;
    visibility: visible;
   }

  #project-bist-ar-2017 .frame-03 {
    background: none;
    height: auto;
  }

  #project-bist-ar-2017 .frame-04 {
    height: auto;
    background: none;
  }
  #project-bist-ar-2017 .frame-05 {
    height: auto;
    background: none;
    margin-bottom: 100px;
  }
}

/* ISGLOBAL Video */
#project-isglobal-video .frame-01 {
  height: 1200px;
  background: #f5a623;
}
#project-isglobal-video .frame-02 {
  height: 1200px;
}

#project-isglobal-video .frame-01 .comp-mac {
  top: 230px;
}

#project-isglobal-video .project .vid {
  position: relative;
  width: 674px;
  height: 370px;
  margin: 0px auto 0px;
}

#project-isglobal-video.project .vid a:before {
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
}


#project-isglobal-video .frame-01 .vid-01 a {
  background-image: url("../img/project/isglobal-video/isglobal-video.jpg");
  background-size: 100%;
}

@media screen and (max-width: 991px)  {
  #project-isglobal-video .frame-01 {
    height: 1000px;
    margin-bottom: 100px;
  }
}



@media screen and (max-width: 767px) {
    #project-isglobal-video .frame-01 {
        height: 700px;
    }
}




/* crag identidad 2018 */
#project-crag-identidad-2018 .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/crag-identidad-2018/crag-identidad-2018.jpg") no-repeat scroll center top / cover ;
  height: 700px;

  color: #000000;
}

#project-crag-identidad-2018 .frame-02 img{
  display: none;
}
#project-crag-identidad-2018 .frame-02 {
  background: url("../img/project/crag-identidad-2018/crag-logo-construccion.gif") no-repeat center / 900px;
  height: 510px;
  position: relative;
  /*background-size: cover;*/
}
#project-crag-identidad-2018 .frame-03 {
  height: 770px;
  background-size: 1140px;
  background-image: url("../img/project/crag-identidad-2018/crag-mockup.jpg");
    margin-top: 150px;
}
#project-crag-identidad-2018 .frame-03 img {
  visibility: hidden;
  width: 100%;
  height: auto;
}
#project-crag-identidad-2018 .frame-04 {
  margin-top: 150px;
  height: 800px;
  background-size: 1140px;
  background-image: url("../img/project/crag-identidad-2018/crag-poster.jpg");
}
#project-crag-identidad-2018 .frame-04 img {
  visibility: hidden;
  width: 100%;
  height: auto;
}
#project-crag-identidad-2018 .frame-05 {
  margin-top: 120px;
  height: 890px;
}
#project-crag-identidad-2018 .frame-06 {
  margin-top: 0px;
  height: 640px;
  background-size: 1140px;
  background-image: url("../img/project/crag-identidad-2018/crag-mockup-web.jpg");
}
#project-crag-identidad-2018 .frame-06 img {
  display: none;
}

/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {

  #project-crag-identidad-2018 .frame-03 {
    height: auto;
    background-size: 100%;
  }
  #project-crag-identidad-2018 .frame-04 {
    height: auto;
    background-size: 100%;
  }

  #project-crag-identidad-2018 .carousel {
    -webkit-transform: scale(0.7,0.7);
    -ms-transform: scale(0.7,0.7);
    transform: scale(0.7,0.7);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
  }
  #project-crag-identidad-2018 .carousel img {
    width: 100%;
  }
  #project-crag-identidad-2018 .frame-04 {
    top: 0px;
    height: auto;
    position: relative;
  }
  #project-crag-identidad-2018 .frame-05 {
    margin-top: 0px;
    height: 820px;
  }
  #project-crag-identidad-2018 .frame-06 {
    height: auto;
    background-image: none;
  }
  #project-crag-identidad-2018 .frame-06 img {
    display: block;
    width: 100%;
    height: auto;
  }

}


@media screen and (max-width: 768px) {
  #project-crag-identidad-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/crag-identidad-2018/crag-identidad-2018.jpg") no-repeat scroll center top / auto 900px;
    height: 390px;
    color: #000000;
  }
  #project-crag-identidad-2018 .frame-02 {
    height: auto;
    background-size: 100%;
    background-image: none;
      margin-top: 50px;
  }
  #project-crag-identidad-2018 .frame-02 img{
    display: block;
    width: 100%;
  }
  #project-crag-identidad-2018 .frame-03 {
    height: auto;
    background-size: 100%;
    background-image: none;
      margin-top: 50px;
  }
  #project-crag-identidad-2018 .frame-03 img {
    visibility: visible;
  }
  #project-crag-identidad-2018 .frame-04 {
    margin-top: 50px;
    height: auto;
    background-size: 100%;
    background-image: none;
  }
  #project-crag-identidad-2018 .frame-04 img {
    visibility: visible;
  }

  #project-crag-identidad-2018 .carousel {
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1);
    width: 100%;
    left: 0;
    position: relative;
    margin-left: 0px;
    margin-top: 0px;
  }
  #project-crag-identidad-2018 .carousel img {
    width: 100%;
  }
  #project-crag-identidad-2018 .frame-05 {
    margin-top: 50px;
    margin-bottom: 100px;
    height: auto;
  }
  #project-crag-identidad-2018 .frame-06 {
    height: auto;
    background-image: none;
  }
  #project-crag-identidad-2018 .frame-06 img {
    display: block;
    width: 100%;
    height: auto;
  }

}





/* bist conferencia 2018 */
#project-bist-conferencia-2018 .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/bist-conferencia-2018/bist-cabecera.jpg") no-repeat scroll center top / cover ;
  height: 1300px;

  /*color: #000000;*/
}

#project-bist-conferencia-2018 .frame-02 {
  margin-top: -220px;
  height: 890px;
}
#project-bist-conferencia-2018 .frame-02,
#project-bist-conferencia-2018 .frame-03 {
  font-family: basier;
  text-align: center;
}
#project-bist-conferencia-2018 .frame-02 h3 ,
#project-bist-conferencia-2018 .frame-03 h3 {
  font-size: 3.5em;
  /*line-height: 1em;*/
  margin-block-end: 0.3em;
  font-weight: 300;
}
#project-bist-conferencia-2018 .frame-02 h4,
#project-bist-conferencia-2018 .frame-03 h4 {
  font-weight: 300;
  font-size: 2.3em;
  margin-block-start: 0.33em;
  margin-block-end: 0.5em;
}
#project-bist-conferencia-2018 .frame-02 h5,
#project-bist-conferencia-2018 .frame-03 h5 {
  font-weight: 300;
  font-size: 2em;
  margin-block-start: 0.8em;
}
#project-bist-conferencia-2018 .frame-02 .underline ,
#project-bist-conferencia-2018 .frame-03 .underline {
  width: 340px;
  border-top: 1px solid #979797;
}

#project-bist-conferencia-2018 .frame-02 {
  height: 1017px;
}

#project-bist-conferencia-2018 .frame-03 {
  height: 1200px;
  background-position-y: 20px;
  background-size: 1920px 1139px;
  background-image: url("../img/project/bist-conferencia-2018/bist-carrusel-2017-background.jpg");
}
#project-bist-conferencia-2018 .frame-04 {
  height: 700px;
}
#project-bist-conferencia-2018 .frame-02 .carousel-indicators{
   margin-left: auto;
  left: auto;
  right: auto;
  width: 100%;
}
@media screen and (max-width: 991px) {
  .project .carousel {
    width: 100%;
    margin: 0px;
  }
  #project-bist-conferencia-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/bist-conferencia-2018/bist-cabecera.jpg") no-repeat scroll -180px top / 1200px;
    /*background-size: auto;*/
    height: 880px;
  }
  #project-bist-conferencia-2018 .frame-02 {
    height: auto;
  }

  #project-bist-conferencia-2018 .frame-03 {
    margin-top: 100px;
    margin-bottom: 200px;
    height: auto;
  }


  #project-bist-conferencia-2018 .carousel .carousel-indicators {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 200vw;
    left: 0;
    margin-left: -50%;
  }

  #project-bist-conferencia-2018 .frame-02 h4, #project-bist-conferencia-2018 .frame-03 h4 {
    line-height: 1em;
  }
}
@media screen and (device-width: 768px) {

  #project-bist-conferencia-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/bist-conferencia-2018/bist-cabecera.jpg") no-repeat scroll 0px 0px / 100%;
    height: 650px;
  }

  #project-bist-conferencia-2018 .frame-02 {
    height: 687px;
  }

  #project-bist-conferencia-2018 .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
    margin-top: -140px;
  }

  #project-bist-conferencia-2018 .carousel img {
    width: 100%;
  }

  #project-bist-conferencia-2018 .frame-03 {
    height: 750px;
    background-position-y: 100px;
    background-size: 140%;
    background-image: url("../img/project/bist-conferencia-2018/bist-carrusel-2017-background.jpg");
  }




}

@media screen and (max-width: 767px) {
  #project-bist-conferencia-2018 .frame-03 {
    margin-bottom: 100px;
  }
  #project-bist-conferencia-2018 .carousel .carousel-indicators {
    width: 100%;
    margin-left: 0%;
  }
  #project-bist-conferencia-2018 .frame-02 .underline,
  #project-bist-conferencia-2018 .frame-03 .underline {
    width: 70%
  }
}




/* vhir plan estrategico 2018 */
#project-vhir-plan-2018 {
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-plan-estrategico-2018/vhir-background.jpg");
  background-repeat: no-repeat;
  background-size: auto;
  background-position-y: 740px;
}
#project-vhir-plan-2018 .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-plan-estrategico-2018/vhir-plan-estrategico-2018-cabecera.jpg") no-repeat scroll center top / 1920px ;
  height: 740px;
}
#project-vhir-plan-2018 .frame-02 {
  height: 400px;
  background-size: 640px ;
  background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-01.png");
  top: -150px;
}
#project-vhir-plan-2018 .frame-03 {
  height: 450px;
  background-size: 800px ;
  background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-02.png");
  top: -150px;
}
#project-vhir-plan-2018 .frame-03 img {
  visibility: hidden;
  width: 100%;
}
#project-vhir-plan-2018 .frame-04 {
  height: 450px;
  background-size: 800px ;
  background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-03.png");
  top: -150px;
}

#project-vhir-plan-2018 .frame-04 img {
  visibility: hidden;
  width: 100%;
}
#project-vhir-plan-2018 .frame-05 img {
  visibility: hidden;
  width: 100%;
}
#project-vhir-plan-2018 .frame-05 {
  height: 450px;
  background-size: 800px ;
  background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-04.png");
  top: -150px;
}
#project-vhir-plan-2018 .frame-06 {
  height: 450px;
  background-size: 800px ;
  background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-05.png");
  top: -150px;
}
#project-vhir-plan-2018 .frame-06 img {
  visibility: hidden;
  width: 100%;
}
#project-vhir-plan-2018 .frame-07 {
  background: url("../img/project/vhir-plan-estrategico-2018/vhir-plan-iconos.gif") no-repeat top center / 800px, #fff;
  height: 400px;
  position: relative;
  /*background-size: cover;*/
  top: -150px;
  padding: 0px !important;
}

/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-vhir-plan-2018 .frame-03 {
    height: auto;
    background-size: 80%;
    top: -150px;
  }
  #project-vhir-plan-2018 .frame-04 {
    height: auto;
    background-size: 80%;
    top: -150px;
  }
  #project-vhir-plan-2018 .frame-05 {
    height: auto;
    background-size: 80%;
    top: -150px;
  }
  #project-vhir-plan-2018 .frame-06 {
    height: auto;
    background-size: 80%;
    top: -150px;
  }
}

@media screen and (device-width: 768px) {
  #project-vhir-plan-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-plan-estrategico-2018/vhir-plan-estrategico-2018-cabecera.jpg") no-repeat scroll center top / 170%;
    height: 630px;
  }

  #project-vhir-plan-2018 .frame-02,
  #project-vhir-plan-2018 .frame-03,
  #project-vhir-plan-2018 .frame-04,
  #project-vhir-plan-2018 .frame-05,
  #project-vhir-plan-2018 .frame-06{
    background-size: 80%;
  }

}

@media screen and (max-width: 767px) {
  #project-vhir-plan-2018 .frame-02 img{
    margin-top: -150px;
  }

  #project-vhir-plan-2018 .frame-03 img,
  #project-vhir-plan-2018 .frame-04 img,
  #project-vhir-plan-2018 .frame-05 img,
  #project-vhir-plan-2018 .frame-06 img {
    visibility: visible;
    width: 80%;
    margin: 0 auto;
  }


  #project-vhir-plan-2018 .frame-02,
  #project-vhir-plan-2018 .frame-03,
  #project-vhir-plan-2018 .frame-04,
  #project-vhir-plan-2018 .frame-05,
  #project-vhir-plan-2018 .frame-06{
    background-image: none;
    top: 0px;
    background-size: 80%;
    background-repeat: no-repeat;
    background-position-x: 50%;
    height: auto;
  }
  #project-vhir-plan-2018 .frame-07{
    top: 0px;
    background: url("../img/project/vhir-plan-estrategico-2018/vhir-plan-iconos.gif") no-repeat top center / 600px, #fff;
    height: 300px;
  }
}





/* irta  2018 */
#project-irta-30-2018 .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/irta-30-2018/irta-cabecera.jpg") no-repeat scroll center top / 100%;
  height: 1100px;
  color: #000000;
}
#project-irta-30-2018 .frame-01 #carousel01 {
  top: 70px;
}

#project-irta-30-2018 .frame-02 {
  height: 740px;
}
#project-irta-30-2018 .frame-02 .vid {
  width: 870px;
  height: 490px;
}
#project-irta-30-2018 .frame-02 .vid-01 a {
  background-image: url("../img/project/irta-30-2018/irta-video.jpg");
}

/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-irta-30-2018 .frame-01  {
    height: 840px;
  }
  #project-irta-30-2018 .frame-01 #carousel01 {
    top: 0px;
  }

  #project-irta-30-2018 .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
    /*margin-top: -100px;*/
  }

  #project-irta-30-2018 .carousel img {
    width: 100%;
  }


}

@media screen and (max-width: 991px) {

  #project-irta-30-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/irta-30-2018/irta-cabecera-movil.jpg") no-repeat scroll center -100px / 990px;
    /*height: 500px;*/
    color: #000000;
  }

  #project-irta-30-2018 .frame-02 {
    height: auto;
    margin-bottom: 130px;
  }
  #project-irta-30-2018 .frame-02 img {
    visibility: hidden;
    width: 100%;
  }
  #project-irta-30-2018 .frame-02 .vid {
    width: 100%;
    height: auto;
  }
  #project-irta-30-2018 .frame-02 .vid-01 a {
    background-size: 100%;
  }
}


@media screen and (device-width: 768px) {
  #project-irta-30-2018 .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
    margin-top: -140px;
  }

  #project-irta-30-2018 .carousel img {
    width: 100%;
  }

  #project-irta-30-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/irta-30-2018/irta-cabecera-movil.jpg") no-repeat scroll center -100px / 950px;
    height: 910px;
    color: #000000;
  }

  /*#project-irta-30-2018 .frame-01 {*/
    /*background: rgba(0, 0, 0, 0) url("../img/project/irta-30-2018/irta-cabecera.jpg") no-repeat scroll center top / 100%;*/
    /*height: 910px;*/
    /*color: #000000;*/
  /*}*/
  #project-irta-30-2018 .frame-02 .vid {
    width: 870px;
    height: 490px;
  }
  #project-irta-30-2018 .frame-02 .vid {
    width: 100%;
    height: 490px;
  }
}

@media screen and (max-width: 767px) {
  #project-irta-30-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/irta-30-2018/irta-cabecera-movil.jpg") no-repeat scroll center -50px / 900px;
    height: auto;
    color: #000000;
  }

  #project-irta-30-2018 .frame-02 {
    margin-top: 150px;
    margin-bottom: 100px;
  }



}

@media screen and (max-width: 480px) {
  #project-irta-30-2018 .frame-01 #carousel01 .carousel-indicators {
    -webkit-transform: scale(.5,.5);
    -ms-transform: scale(.5,.5);
    transform: scale(.5,.5);
    width: 100%;
    margin-left: -50%;
  }
}

/* cerca conferencia  2018 */
#project-cerca-conferencia-2018 .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/cerca-conferencia-2018/cerca-conferencia-2018-header.jpg") no-repeat scroll center top / 100% ;
  height: 600px;
  /*color: #000000;*/
}
#project-cerca-conferencia-2018 .frame-01 img {
  visibility: hidden;
  width: 100%;
  margin-top: -228px;
}
#project-cerca-conferencia-2018 .frame-02 {
  height: 1020px;
  background-position-y: 0px;
  background-size: cover;
  background-image: url("../img/project/cerca-conferencia-2018/cerca-conferencia-2018-slider-bg.jpg");
  margin-top: 0px;
  /*color: #fff;*/
}

#project-cerca-conferencia-2018 .frame-02,
#project-cerca-conferencia-2018 .frame-03,
#project-cerca-conferencia-2018 .frame-04 {
  font-family: basier;
  text-align: center;
}
#project-cerca-conferencia-2018 .frame-02 h3,
#project-cerca-conferencia-2018 .frame-03 h3,
#project-cerca-conferencia-2018 .frame-04 h3 {
  font-size: 3.5em;
  /*line-height: 1em;*/
  margin-block-end: 0.3em;
  font-weight: 300;
}
#project-cerca-conferencia-2018 .frame-02 h4,
#project-cerca-conferencia-2018 .frame-03 h4,
#project-cerca-conferencia-2018 .frame-04 h4 {
  font-weight: 300;
  font-size: 2.3em;
  margin-block-start: 0.33em;
  margin-block-end: 0.5em;
}
#project-cerca-conferencia-2018 .frame-02 h5,
#project-cerca-conferencia-2018 .frame-03 h5,
#project-cerca-conferencia-2018 .frame-04 h5 {
  font-weight: 300;
  font-size: 2em;
  margin-block-start: 0.8em;
}
#project-cerca-conferencia-2018 .frame-02 .underline {
  width: 340px;
  border-top: 1px solid #fff;
  margin-top: 50px;
}
#project-cerca-conferencia-2018 .frame-03 .underline {
  width: 340px;
  border-top: 1px solid #333;
}
#project-cerca-conferencia-2018 .frame-04 .underline {
  width: 340px;
  border-top: 1px solid #333;
}
#project-cerca-conferencia-2018 .frame-03 {
  margin-top: 50px;
  height: 1180px;
}
#project-cerca-conferencia-2018 .frame-04 {
    height: 1000px;
}

/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-cerca-conferencia-2018 .frame-01 {
    width: 100%;
    height: auto;
  }
  #project-cerca-conferencia-2018 .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
    margin-top: -140px;
  }

  #project-cerca-conferencia-2018 .carousel img {
    width: 100%;
  }
  #project-cerca-conferencia-2018 .frame-02 {
    height: 700px;
  }

  #project-cerca-conferencia-2018 .frame-03 {
    height: 900px;
  }

    #project-cerca-conferencia-2018 .frame-04 {
        height: 750px;
    }

}

@media screen and (max-width: 992px) {
  #project-cerca-conferencia-2018 .frame-01 {
    background-size: 942px;
    height: 450px;
  }

  #project-cerca-conferencia-2018 .frame-02 {
    background-size: 992px;
    background-repeat: no-repeat;
    background-position: center top;
    padding-bottom: 100px;
    height: auto;
  }

  #project-cerca-conferencia-2018 .frame-03 {
    height: auto;
    margin-bottom: 100px;
  }

  #project-cerca-conferencia-2018 .frame-04 {
    background-size: 992px;
    background-repeat: no-repeat;
    background-position: center top;
    padding-bottom: 100px;
    height: auto;
  }


}
@media screen and (device-width: 768px) {
  #project-cerca-conferencia-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/cerca-conferencia-2018/cerca-conferencia-2018-header.jpg") no-repeat scroll center 20px / 100%;
    height: 393px;

  }
  #project-cerca-conferencia-2018 .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
    margin-top: -140px;
  }

  #project-cerca-conferencia-2018 .carousel img {
    width: 100%;
  }
  #project-cerca-conferencia-2018 .frame-02 {
    height: 701px;
    background-position-y: 0px;
    background-size: 115%;
    background-image: url("../img/project/cerca-conferencia-2018/cerca-conferencia-2018-slider-bg.jpg");
    margin-top: 0px;

  }
  #project-cerca-conferencia-2018 .frame-03 {
    margin-top: 50px;
    height: 750px;
  }

}









/* modernisme  2018 */
#project-modernismo-2018 .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/modernismo-2018/modernismo-cabecera.jpg") no-repeat scroll right top / 894px;
  height: 551px;
  color: #000000;
}
#project-modernismo-2018 .frame-02 {
  background-color: #d3ece8;
}
#project-modernismo-2018 .frame-02 > div {
  background-size: cover;
  background: url("../img/project/modernismo-2018/modernismo-2018-movil1.png") center top no-repeat;
  
  background-position-y: 100px;
  height: auto;
  margin-top: -309px;
}
#project-modernismo-2018 .frame-02 img {
  visibility: hidden;
  width: 100%;
  margin-top: 100px;
  max-width: 937px;
}
#project-modernismo-2018 .frame-03 {
  background-size: cover;
  background: url("../img/project/modernismo-2018/modernismo-ipad.jpg") center top;
  height: 1550px;
  margin-top: 0px;
}
#project-modernismo-2018 .frame-04,
#project-modernismo-2018 .frame-06 {
  height: 950px;
  margin-top: 0px;
  width: 1230px;
  margin-left: auto;
  margin-right: auto;
}

#project-modernismo-2018 .frame-04 h3 ,
#project-modernismo-2018 .frame-06 h3 {
  font-family: basier;
  text-align: center;
  font-size: 3.5em;
  font-weight: 300;
  width: 315px;
  margin-left: auto;
  margin-right: auto;
  border: 1px solid #979797;
  padding: 40px 30px;


}

#project-modernismo-2018 .frame-04 .comp-left,
#project-modernismo-2018 .frame-06 .comp-left {
  float: left;
  width: 47%;
  position: relative;
  height: auto;
  top: 30px;
}
#project-modernismo-2018 .frame-04 .comp-right,
#project-modernismo-2018 .frame-06 .comp-right {
  float: left;
  width: 47%;
  position: relative;
  margin-left: 4%;
  top: 30px;
}
#project-modernismo-2018 .frame-05 {
  height: 780px;
}

#project-modernismo-2018 .frame-06 {
  height: 860px;
}
#project-modernismo-2018 .frame-07 {
    height: 700px;
  padding: 0px;
  margin-top: 100px;
  margin-bottom: 100px;
}

/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-modernismo-2018 .frame-04 {
    height: auto;
  }
  #project-modernismo-2018 .frame-04, #project-modernismo-2018 .frame-06 {
    width: 100%;
  }
  #project-modernismo-2018 .frame-04 .comp-left, #project-modernismo-2018 .frame-06 .comp-left {
    float: left;
    margin-left: 1.5%;
  }
  #project-modernismo-2018 .frame-04 .comp-right, #project-modernismo-2018 .frame-06 .comp-right {
    float: right;
    margin-left: 0;
    margin-right: 1.5%;
  }
  #project-modernismo-2018 .frame-04 .comp-left img, #project-modernismo-2018 .frame-06 .comp-left img {
    width: 100%;
  }
  #project-modernismo-2018 .frame-04 .comp-right img, #project-modernismo-2018 .frame-06 .comp-right img {
    width: 100%;
  }
  #project-modernismo-2018 .frame-05 {
    height: 520px;
  }
  #project-modernismo-2018 .frame-06 {
    height: auto;
  }
  #project-modernismo-2018 .frame-07 {
    height: auto;
    margin-bottom: 0px;
  }

  #project-modernismo-2018 .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
    margin-top: -140px;
  }

  #project-cerca-conferencia-2018 .carousel img {
    width: 100%;
  }
}

@media screen and (max-width: 991px) {
  #project-modernismo-2018 .frame-02 > div {
    background-size: 97% !important;
  }

}

@media screen and (device-width: 768px) {
  #project-modernismo-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/modernismo-2018/modernismo-cabecera.jpg") no-repeat scroll right top / 700px;
    height: 563px;
    color: #000000;
  }
  #project-modernismo-2018 .frame-02 {
    background: url("../img/project/modernismo-2018/modernismo-movil.png") no-repeat center top / 150%;
    height: 600px;
    margin-top: -251px;

  }
  #project-modernismo-2018 .frame-02 img {
    display: none;
  }
  #project-modernismo-2018 .frame-04,
  #project-modernismo-2018 .frame-06 {
    width: 100%;
  }

  #project-modernismo-2018 .frame-04 .comp-right,
  #project-modernismo-2018 .frame-06 .comp-right {
    float: right;
  }

  #project-modernismo-2018 .frame-04 .comp-left img,
  #project-modernismo-2018 .frame-06 .comp-left img,
  #project-modernismo-2018 .frame-04 .comp-right img,
  #project-modernismo-2018 .frame-06 .comp-right img{
    width: 100%;
  }
  #project-modernismo-2018 .frame-04,
  #project-modernismo-2018 .frame-06 {
    height: 700px;
  }
  #project-modernismo-2018 .carousel {
    -webkit-transform: scale(.6,.6);
    -ms-transform: scale(.6,.6);
    transform: scale(.6,.6);
    width: 1000px;
    left: 50%;
    position: relative;
    margin-left: -500px;
    margin-top: -140px;
  }
  #project-modernismo-2018 .carousel img {
    width: 100%;
  }
  #project-modernismo-2018 .frame-05 {
    height: 480px;
  }
  #project-modernismo-2018 .frame-07 {
    padding: 0;
    margin-top: 50px;
  }
}
@media screen and (max-width: 767px) {

  #project-modernismo-2018 .frame-01 img {
    margin-top: 100px;
    display: block;
  }
  #project-modernismo-2018 .frame-02 {
    /*background-color: #fff;*/
    background: linear-gradient(0deg, #c9ede9 83.7%, #fff 16.3%);
  }
  #project-modernismo-2018 .frame-02 div {
    margin-top: 0px;
    background: none;
  }
  #project-modernismo-2018 .frame-02 img {
    visibility: visible;
    width: 320px;
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
  }
  #project-modernismo-2018 .frame-03 {
    background: url("../img/project/modernismo-2018/modernismo-ipad.jpg")  no-repeat center top / 630px, #d3ece8;
    height: 770px;
  }

  #project-modernismo-2018 .frame-04 {
    width: 100%;
  }
  #project-modernismo-2018 .frame-04 img {
    width: 100%;
  }
  #project-modernismo-2018 .frame-04 .comp-right,
  #project-modernismo-2018 .frame-06 .comp-right {
    float: right;
  }

  #project-modernismo-2018 .frame-04, #project-modernismo-2018 .frame-06 {
    height: auto;
  }
  #project-modernismo-2018 .frame-05 {
    margin-top: 100px;
    height: auto;
  }

  #project-modernismo-2018 .frame-06 {
    width: 100%;
  }
  #project-modernismo-2018 .frame-06 img {
    width: 100%;
  }
    #project-modernismo-2018 .frame-07 {
        height: auto;
    }
}






/* sant pau recinto modernista  2018 */
#project-sant-pau-recinto-modernista .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-cabecera.jpg") no-repeat scroll center top / 100%;
  height: 623px;
  color: #000000;
}

#project-sant-pau-recinto-modernista .frame-02 {
  background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-bg.svg") no-repeat center top / 100%;
  height: 2000px;
}
#project-sant-pau-recinto-modernista .frame-02 div{
  background-size: cover;
  background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-tablet.png") center top no-repeat;
  height: 1550px;
  margin-top: -335px;
}

#project-sant-pau-recinto-modernista .frame-03 {
  background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-movil.png") no-repeat center top / 100%;
  width: 1160px;
  height: 1400px;
  margin-top: -1400px;
  margin-left: auto;
  margin-right: auto;
}

#project-sant-pau-recinto-modernista .frame-04 {
  background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-iphone.jpg") no-repeat center top / 100%;
  height: 950px;
  width: 1082px;
  margin-top: -630px;
  margin-left: auto;
  margin-right: auto;
}

#project-sant-pau-recinto-modernista .frame-05 {
  background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-pie.jpg") no-repeat center top / 100%;
  height: auto;
  margin-top: -110px;
  margin-bottom: 200px;
}

#project-sant-pau-recinto-modernista .frame-03 .img-2 {
  width: 100%;
  display: none;
}


@media screen and (min-width: 1201px) {
  #project-sant-pau-recinto-modernista .frame-05 img {
    visibility: hidden;
    width: 100%;
  }
  #project-sant-pau-recinto-modernista .frame-03 img {
    display: none;
  }
  #project-sant-pau-recinto-modernista .frame-04 img {
    /*display: none;*/
  }




}
@media screen and (max-width: 1200px) {

  #project-sant-pau-recinto-modernista .frame-01 {
    background-size: 1200px auto;
  }

  #project-sant-pau-recinto-modernista .frame-03 {
    width: 100%;
    margin-top: -1500px;
    background-image: none;
    height: auto;
  }
  #project-sant-pau-recinto-modernista .frame-03 .img-1,
  #project-sant-pau-recinto-modernista .frame-03 .img-1 img {
    width: 100%;
    display: block;
  }

  #project-sant-pau-recinto-modernista .frame-04 {
    width: 100%;
    height: auto;
    margin-top: 100px;
    background: none;
  }
  #project-sant-pau-recinto-modernista .frame-04 img {
    width: 100%;
    display: block;
  }
  #project-sant-pau-recinto-modernista .frame-05 {
    margin-top: 50px
  }
  #project-sant-pau-recinto-modernista .frame-05 img {
    visibility: visible;
    width: 100%;
  }

}

@media screen and (device-width: 768px) {
  #project-sant-pau-recinto-modernista .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-cabecera.jpg") no-repeat scroll center top / 200%;
    height: 427px;
    color: #000000;
  }
  #project-sant-pau-recinto-modernista .frame-02 {
    background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-bg.svg") no-repeat right 0px / 100%;
    height: 1360px;
    padding-top: 230px;
  }
  #project-sant-pau-recinto-modernista .frame-02 div {
    /*background-size: cover;*/
    background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-tablet.png") calc(50% + 35px) top no-repeat;
    height: 1550px;
    margin-top: -335px;
  }
  #project-sant-pau-recinto-modernista .frame-03 {
    background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-movil.png") no-repeat center top / 768px;
    width: 768px;
    height: 490px;
    margin-top: -660px;
    margin-left: auto;
    margin-right: auto;
  }
  #project-sant-pau-recinto-modernista .frame-04 {
    margin-top: 0;
    height: auto;
  }

  #project-sant-pau-recinto-modernista .frame-05 {
    background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-pie.jpg") no-repeat center top / 100%;
    height: auto;
    margin-top: 90px;
  }
}
@media screen and (max-width: 767px) {
  #project-sant-pau-recinto-modernista .frame-01 {
    height: 500px;
  }
  #project-sant-pau-recinto-modernista .frame-02 {
    background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-bg.svg") no-repeat center 100px / 100%;
    height: 1000px;

  }
  #project-sant-pau-recinto-modernista .frame-02 div{
     background: url("../img/project/sant-pau-recinto-modernista/sant-pau-recinto-modernista-tablet.png") center top / 320px no-repeat;
    height: 750px;
     margin-top: -100px;
  }
  #project-sant-pau-recinto-modernista .frame-03 .img-2 img {
    max-width: 320px;
    width: 70%;
  }
  #project-sant-pau-recinto-modernista .frame-03 {
    margin-top: -490px;
  }

  #project-sant-pau-recinto-modernista .frame-03 .img-1 img {
    display: none;
  }
  #project-sant-pau-recinto-modernista .frame-03 .img-2 {
    display: block;

  }
  #project-sant-pau-recinto-modernista .frame-03 .img-2 img{
    margin: 0px auto;
    display: block;
  }

  #project-sant-pau-recinto-modernista .frame-05 {
    margin-bottom: 100px;
  }

}



/* microomics */
#project-microomics .frame-01 {
  background: url("../img/project/microomics/microomics-cabecera-01.jpg") no-repeat scroll center 0px / 1440px auto, url("../img/project/microomics/background-header.jpg") no-repeat scroll center 0px;
  height: 1000px;

  /*background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-cabecera-1.jpg") no-repeat scroll center top / 100%;*/
  /*height: 60vw;*/
  /*color: #000000;*/
}

#project-microomics .frame-02 {
  margin-top: 100px;
  height: 790px;
  background: transparent;
  color: #000000;
  text-align: center;
}
#project-microomics .frame-03 {
  background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-mobile.jpg") no-repeat scroll center top / 100%;
  margin-top: 130px;
  height: 970px;
  color: #000000;
}

  @media screen and (min-width: 1281px) {

    #project-microomics .frame-03 {
      width: 1190px;
      margin: 150px auto;
      padding: 0px;
    }

    #project-microomics .frame-03 img {
      display: block;
      width: 100%;
    }

  }
  @media screen and (max-width: 1280px) {
    #project-microomics .frame-03 {
      background: none;
      width: 100%;
      height: auto;
      margin-bottom: 200px;
    }
    #project-microomics .frame-03 img {
      display: block;
      width: 100%;
    }
  }

  /* DESKTOP: 769px to 1280px*/
  /*@media screen and (max-width: 1600px) {*/
    /*#project-microomics .frame-01  {*/
      /*background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-cabecera-1.jpg") no-repeat scroll center top / 1650px;*/
      /*height: 980px;*/
    /*}*/

  /*}*/

  @media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-microomics .frame-01  {
    /*background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-cabecera.jpg") no-repeat scroll center top / 100%;*/
    /*height: 840px;*/
  }
  #project-microomics .frame-02 {
    /*height: 740px;*/
    background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-table.jpg") no-repeat scroll center top / 100%;
    /*height: 1100px;*/
    color: #000000;
  }


  #project-microomics .frame-01 #carousel01 {
    top: 0px;
  }
  #project-microomics .lg-content {
    display: none;
  }


}

@media screen and (max-width: 991px) {
  #project-microomics .frame-01 {
    background: url("../img/project/microomics/microomics-cabecera-01.jpg") no-repeat scroll center 0px / 1000px auto;
    height: 700px;
  }

  #project-microomics .frame-02 {
    height: 60vh;
    /*margin-bottom: 130px;*/
  }
  #project-microomics .frame-03 {
    margin-top: 100px;
  }

}

@media screen and (device-width: 768px) {
  #project-microomics .frame-01 {
    background: url("../img/project/microomics/microomics-cabecera-01.jpg") no-repeat scroll center 0px / 1000px auto;
    height: 700px;
    color: #000000;
  }
  #project-microomics .frame-02 {
    /*height: 740px;*/
    background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-table.jpg") no-repeat scroll center top / 100%;
    /*height: 1100px;*/
    color: #000000;
  }
  #project-microomics .frame-03 {
    margin-top: 0px;
    margin-bottom: 200px;
  }
  #project-microomics .lg-content {
    display: none;
  }
  #project-microomics .frame-02 {
    margin-top: 40px;
  }
}

@media screen and (max-width: 767px) {
  #project-microomics .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-cabecera-movil.jpg") no-repeat scroll center top / 830px;
    height: 460px;
    color: #000000;
  }
  #project-microomics .frame-01 img {
    display: none;
  }
  #project-microomics .frame-02 {
    /*height: 740px;*/
    background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-table.jpg") no-repeat scroll center top / 100%;
    /*height: 1100px;*/
    color: #000000;
  }
  #project-microomics .lg-content {
    display: none;
  }
  #project-microomics .frame-02 {
    margin-top: 40px;
    height: 75vw;
  }

  #project-microomics .frame-03 {
    margin-top: 0px;
    margin-bottom: 100px;
  }
}






/* idibell */
#project-idibell .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/idibell/idibell-cabecera.jpg") no-repeat scroll center top / 100%;
  height: 35vw;
  /*color: #000000;*/
}

#project-idibell .frame-02 {
  background: rgba(0, 0, 0, 0) url("../img/project/idibell/idibell-construccio-logo.gif") no-repeat scroll center top;
  margin-top: 100px;
  height: 350px;
  color: #000000;
  text-align: center;
}
#project-idibell .frame-03 {
  /*background: rgba(0, 0, 0, 0) url("../img/project/idibell/idibell-desktop.jpg") no-repeat scroll center top / 100%;*/
  width: 1190px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 130px;
  height: 870px;
  color: #000000;
}
#project-idibell .frame-03 img {
  width: 100%;
}
#project-idibell .frame-04 {
  height: 880px;
  margin-top: 50px;
}
#project-idibell .frame-04 .comp-tablet{
  background: url("../img/project/idibell/idibell-ipad.gif") top no-repeat;
  height: 1200px;
  background-size: 1300px auto;

}

#project-idibell .frame-05 {
  /*margin-top: 100px;*/
  width: 1190px;
  margin: 0px auto;
}
#project-idibell .frame-05 img {
  width: 100%;
}

#project-idibell .frame-06 {
  margin: 100px auto 0px;
  width: 1190px;
}
#project-idibell .frame-06 img {
  width: 100%;
}


/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-idibell .frame-01  {
    /*background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-cabecera.jpg") no-repeat scroll center top / 100%;*/
    /*height: 840px;*/
  }
  #project-idibell .frame-02 {
    /*height: 740px;*/
    /*background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-table.jpg") no-repeat scroll center top / 100%;*/
    /*height: 1100px;*/
    color: #000000;
  }
  #project-idibell .frame-03 {
    width: 100%;
    height: 80vw;
  }
  #project-idibell .frame-03 img {
    width: 100%;
  }
  #project-idibell .frame-04 {
    margin-top: 0px;
  }
  #project-idibell .frame-04 .comp-tablet {
    /*width: 900px;*/
    background: url("../img/project/idibell/idibell-ipad.gif") top no-repeat;
    background-size: 1300px auto;
    height: 1200px;
  }

  #project-idibell .lg-content {
    display: none;
  }
  /*#project-irta-30-2018 .frame-02 .vid {*/
  /*width: 100%;*/
  /*}*/
  #project-idibell .frame-05 {
    width: 100%;
    margin: 0px auto;
  }
  #project-idibell .frame-06 {
    margin: 100px auto 0px;
    width: 100%;
  }
}

@media screen and (max-width: 991px)  and (min-width: 769px) {
  #project-idibell .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/idibell/idibell-cabecera.jpg") no-repeat scroll center top / 1200px;
    height: 500px;
  }
  #project-idibell .frame-02 {
    height: 50vh;
    background-size: 100%;
    /*margin-bottom: 130px;*/
  }
  #project-idibell .frame-03 {
    margin-top: 50px;
  }

}

@media screen and (device-width: 768px) {
  #project-idibell .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/idibell/idibell-cabecera.jpg") no-repeat scroll center top / 1200px;
    height: 500px;
  }
  #project-idibell .frame-02 {
    /*height: 740px;*/
    /*background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-table.jpg") no-repeat scroll center top / 100%;*/
    /*height: 1100px;*/
    color: #000000;
  }
  #project-idibell .frame-03 {
    margin-top: 0px;
    margin-bottom: 0px;
    width: 100%;
    height: 600px;
  }
  #project-idibell .frame-03 img {
    width: 100%;
  }
  #project-idibell .lg-content {
    display: none;
  }
  #project-idibell .frame-02 {
    margin-top: 40px;
  }

  #project-idibell .frame-05 {
    width: 100%;
    margin: 0px auto;
  }

  #project-idibell .frame-06 {
    margin: 100px auto 0px;
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  #project-idibell .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/idibell/idibell-cabecera.jpg") no-repeat scroll center top / 800px;
    height: 300px;
  }

  #project-idibell .frame-02 {
    /*height: 740px;*/
    /*background: rgba(0, 0, 0, 0) url("../img/project/microomics/microomics-table.jpg") no-repeat scroll center top / 100%;*/
    /*height: 1100px;*/
    color: #000000;
  }
  #project-idibell .frame-03 {
    /*background: rgba(0, 0, 0, 0) url("../img/project/idibell/idibell-desktop.jpg") no-repeat scroll center top / 100%;*/
    /*height: 100px;*/
    height: 80vw;
  }
  #project-idibell .lg-content {
    display: none;
  }
  #project-idibell .frame-02 {
    margin-top: 40px;
    height: 35vw;
    background-size: 90%;
  }

  #project-idibell .frame-03 {
    margin-top: 0px;
    margin-bottom: 0px;
    width: 100%;
  }
  #project-idibell .frame-03 img {
    width: 100%;
  }

  #project-idibell .frame-04  {
    height: 520px;
  }
  #project-idibell .frame-04 .comp-tablet {
    /*width: 900px;*/
    background: url("../img/project/idibell/idibell-ipad.gif") top no-repeat;
    background-size: 790px auto;
    height: 1200px;

  }
  #project-idibell .frame-05 {
    /*background: rgba(0, 0, 0, 0) url("../img/project/idibell/idibell-desktop.jpg") no-repeat scroll center top / 100%;*/
    /*height: 100px;*/
    margin-top: 100px;
    width: 100%;
    height: 90vw;
  }
  #project-idibell .frame-06 {
    /*background: rgba(0, 0, 0, 0) url("../img/project/idibell/idibell-desktop.jpg") no-repeat scroll center top / 100%;*/
    /*height: 100px;*/
    width: 100%;
    height: 70vw;
  }


}







/* biocat */
#project-biocat .frame-01{
  background: rgba(0, 0, 0, 0) url("../img/project/biocat/biocat-background.jpg") no-repeat scroll center top / auto 800px;
  height: 600px;
  border-color: #000;
}

#project-biocat .frame-02 {
  height: 1050px;
  background-size: cover;
  background-image: url(../img/project/biocat/biocat-ipad-iphone.jpg);
}
#project-biocat .frame-intro h1,
#project-biocat .frame-intro p{
  color: #fff;
}

#project-biocat .frame-intro p {
  color: #fff;
  font-family: Roboto;
  font-size: 14px;
  line-height: 21px;
}

#project-biocat .frame-02 .comp-mac {
  height: 850px;
  /*background-image: url(../img/project/crg/frame-02-mac-83aef87126.jpg);*/
}

#project-biocat .frame-02 .comp-mac > div {
  background-image: url("../img/project/crg-ar-2015/desktop-animation.gif");
  left: 49.8%;
  top: 159px;
  width: 683px;
}


#project-biocat .frame-03 {
  margin: 150px 0px 150px 0px;
}

#project-biocat .frame-04 {
  background: url("../img/project/biocat/biocat-macbook.png") no-repeat scroll calc(50% + 20px) 170px / 1200px auto, rgba(0, 0, 0, 0) url("../img/project/biocat/biocat-background-pc.png") no-repeat scroll center center;
  height: 860px;
  position: relative;
}

#project-biocat .frame-04 .comp-screen {
  background-position: 50% 45%;
  background-repeat: no-repeat;
  background-size: 1200px auto;
  height: 397px;
  left: calc(50% - 281px);
  position: absolute;
  top: 205px;
  width: 550px;
  z-index: 17;
}

.selector {
  display: inline-block;
  left: 0;
  position: absolute;
  text-align: center;
  top: 730px;
  width: 100%;
}

.selector > li {
  display: inline-block;
}

.selector > li > a {
  background-image: url("../img/project/crg-ar-2015/option.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 15px 15px;
  display: inline-block;
  height: 15px;
  width: 32px;
}

.selector > li > a.active {
  background-image: url("../img/project/crg-ar-2015/active-option.png");
  background-position: center center;
  background-repeat: no-repeat;
}

#project-biocat .frame-04 .comp-screen .seq {
  background-position: 50% 45%;
  background-repeat: no-repeat;
  background-size: 700px auto;
  height: 433px;
  left: calc(50% - 277px);
  position: absolute;
  top: 1px;
  width: 696px;
  z-index: 7;
  /*display: none;*/
}

#project-biocat .frame-04 .comp-screen .seq-1 {
  background-image: url("../img/project/biocat/biocat-slideshow-01.jpg");
}

#project-biocat .frame-04 .comp-screen .seq-2 {
  background-image: url("../img/project/biocat/biocat-slideshow-02.jpg");
}

#project-biocat .frame-04 .comp-screen .seq-3 {
  background-image: url("../img/project/biocat/biocat-slideshow-03.jpg");
}

#project-biocat .frame-04 .comp-screen .seq-4 {
  background-image: url("../img/project/biocat/biocat-slideshow-04.jpg");
}

#project-biocat .frame-04 .comp-screen .seq-5 {
  background-image: url("../img/project/biocat/biocat-slideshow-05.jpg");
}

#project-biocat .frame-04 .comp-screen .seq-6 {
  background-image: url("../img/project/biocat/biocat-slideshow-06.jpg");
}

#project-biocat .frame-04 .comp-screen .seq-7 {
  background-image: url("../img/project/biocat/biocat-slideshow-07.jpg");
}

#project-biocat .frame-04 .comp-screen .seq-8 {
  background-image: url("../img/project/biocat/biocat-slideshow-08.jpg");
}

#project-biocat .frame-04 {
  box-sizing: border-box;
  /*height: auto;*/
  padding-bottom: 50px;
  padding-top: 80px;
  position: relative;
  margin-top: 100px;
}

#project-biocat .mobile {
  background-attachment: scroll;
  background-clip: border-box;
  background-color: rgba(0, 0, 0, 0);
  background-image: url("../img/project/crg-ar-2015/moviles.jpg");
  background-origin: padding-box;
  background-repeat: no-repeat;
  background-size: 1218px auto;
  display: inline-block;
  height: 530px;
  margin-left: 144px;
  width: 215px;
}

#project-biocat .frame-06 {
  /*background: rgba(0, 0, 0, 0) url("../img/project/biocat/biocat-grafica-1.jpg") no-repeat scroll center center;*/

  background: rgba(0, 0, 0, 0) url("../img/project/biocat/biocat-grafica-1.jpg") no-repeat scroll center top / 100%;
  margin-top: 0px;
  height: 65vw;
  color: #000000;

}

#project-biocat .frame-07 {
  height: 1300px;
  background: url("../img/project/biocat/biocat-grafica-2.svg") no-repeat scroll calc(50% + 20px) 170px / 1000px auto, rgba(0, 0, 0, 0) url("../img/project/biocat/biocat-background-pc.png") no-repeat scroll top center ;
  background-color: #c0d3f1;
  position: relative;
  margin-bottom: 150px;
}

#project-biocat .tablet {
  background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2015/ipad-videos.png") no-repeat scroll center center;
}

.frame.frame-07 {
  height: 1000px;
  padding: 140px;
}

#project-biocat .text-container {
  position: relative;
}

#project-biocat .text-seq {
  left: 0;
  position: absolute;
  top: 10px;
  display: none;
}

#project-biocat .text-seq.seq-1 {
  display: inline-block;
}

#project-biocat .tablet {
  background-attachment: scroll;
  background-clip: border-box;
  background-image: url("../img/project/crg-ar-2015/ipad-videos.png");
  background-origin: padding-box;
  background-position: -498px -49px;
  background-repeat: no-repeat;
  background-size: 1508px auto;
  height: 415px;
  width: 580px;
}

#project-biocat .tablet {
  background-attachment: scroll;
  background-clip: border-box;
  background-image: url("../img/project/crg-ar-2015/ipad-videos.png");
  background-origin: padding-box;
  background-position: -563px -49px;
  background-repeat: no-repeat;
  background-size: 1730px auto;
  float: right;
  height: 545px;
  width: 640px;
}
@media(min-width: 1201px) {
  #project-biocat .frame-02 {
    width: 1140px;
    height: 700px;
    margin-left: auto;
    margin-right: auto;
  }
  #project-biocat .frame-06 {
    width: 1140px;
    height: 750px;
    margin-left: auto;
    margin-right: auto;
  }

}

@media(max-width: 1200px) {
  #project-biocat .frame-02 {
    background: transparent;
    height: auto;
  }
  #project-biocat .frame-02 img {
    display: block;
    width: 100%;
  }
  #project-biocat .frame-03 #carousel01 {
    display: block;
    width: 100%;
  }
  #project-biocat .frame-03 #carousel01 img {
    width: 100%;
  }
  #project-biocat .frame-04 {
    background: url("../img/project/biocat/biocat-macbook.png") no-repeat scroll calc(50% - 30px) 170px / 800px auto, rgba(0, 0, 0, 0) url("../img/project/biocat/biocat-background-pc.png") no-repeat scroll center center;
    height: 700px;
  }

  #project-biocat .frame-04 .comp-screen .seq {
    width: 460px;
    height: 300px;
    left: calc(50% - 282px);
    background-position: left top;
    background-size: 100% auto;
  }
  #project-biocat .frame-04 .comp-screen {
    background-position: 0;
    background-repeat: no-repeat;
    background-size: 100% auto;
    height: 297px;
    left: calc(50% - 184px);
    position: absolute;
    top: 193px;
    width: 470px;
    z-index: 17;
  }
  #project-biocat .frame-04 .selector {
    position: absolute;
    margin-left: 0;
    padding-left: 0;
    top: auto;
    bottom: 50px;
  }

  #project-biocat .frame.frame-07 {

  }

  #project-biocat .frame-07 {
    background-image: url("../img/project/biocat/biocat-grafica-2.svg"), url("../img/project/biocat/biocat-background-pc.png");
    background-repeat: no-repeat;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: 1300px;
    padding: 0;
  }


}
@media(min-width: 768px) and (max-width: 995px) {
  #project-biocat .mobile {
    margin-left: 46px;
  }
  #project-biocat .mobile-1 {
    margin-left: 0;
  }

  /*#project-biocat .frame.frame-07 {*/
    /*padding: 100px 0 0;*/
    /*height: 1200px;*/
  /*}*/


}



@media(max-width: 991px){
  #project-biocat .frame-07 {
    background-image: url("../img/project/biocat/biocat-grafica-2.svg");
    background-repeat: no-repeat;
    background-color: #c0d3f1;
    background-size: 90%;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: 990px;
    padding: 0;
  }



  /*#project-biocat .frame-07 {*/
    /*height: 1300px;*/
    /*background: url("../img/project/biocat/biocat-grafica-2.svg") no-repeat scroll calc(50% + 20px) 170px / 1000px auto, rgba(0, 0, 0, 0) url("../img/project/biocat/biocat-background-pc.png") no-repeat scroll top center ;*/
    /**/
    /*position: relative;*/
    /*margin-bottom: 150px;*/
  /*}*/
}
@media(max-width: 767px){



  #project-biocat .frame{
    display: block;
    position: inherit;
    clear: both;
  }

  #project-biocat .frame::before,
  #project-biocat .frame::after{
    content: "";
    display: table;
    clear: both;
  }


  #project-biocat .frame-01 {
    height: auto;
    min-height: 369px;
    padding-bottom: 20px;
  }

  #project-biocat .frame-02 .comp-mac > div {
    background-size: 295px auto;
    height: 159px;
    left: calc(50% - 43px);
    top: -4px;
    width: 320px;
  }

  #project-biocat .frame-02 {
    height: auto;
    position: relative !important;
  }

  .project .comp-mac {
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
    background-image: url("../img/mac-xs-4e39fb00d8.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: auto auto;
    height: 260px;
    left: 47%;
    position: static;
    width: 320px;
  }

  #project-biocat .frame-02 .comp-mac {
    background-position: center center;
    background-size: 120% auto;
    height: 290px;
    width: 320px;
  }


  #project-biocat .frame-03 {
    background-position: center center, 0 0;
    background-size: 240% auto, 220% auto;
    height: auto;
    position: relative;
    margin: 50px 0px 50px 0px;
  }

  #project-biocat .frame-03 .carousel{
    margin: 0;
  }


  #project-biocat .frame-03 .comp-screen  {
    height: 100%;
    left: 13.2%;
    position: relative;
    top: 0;
    width: 75%;
  }


  #project-biocat .frame-03 .comp-screen .seq {
    background-position: 50% 46%;
    background-size: 203% auto;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
  }

  #project-biocat .frame-03 .selector {
    bottom: 10px;
    display: block;
    padding: 0;
    position: absolute;
    text-align: center;
    top: auto;
    width: 100%;
    z-index: 17;
  }




  #project-biocat .mobile {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }


  #project-biocat .frame-04 {
    background: url("../img/project/biocat/biocat-macbook.png") no-repeat scroll calc(50% - 20px ) 170px / 420px auto, rgba(0, 0, 0, 0) url("../img/project/biocat/biocat-background-pc.png") no-repeat scroll center center;

    padding-bottom: 100px;
    height: 550px;

  }

  #project-biocat .frame-04 .comp-screen .seq {
    width: 100%;
    left: 0px;
  }

  #project-biocat .frame-04 .comp-screen {
    position: relative;
    top: 101px;
    width: 240px;
    left: calc(50% - 125px);
    height: 157px;
  }
  #project-biocat .frame-04 .selector {
    top: auto;
    bottom: auto;
    margin-top: 160px;
  }





  #project-biocat .frame-07 {
    background-image: none;
    background-color: #c0d3f1;
    height: auto;
    padding-bottom: 100px;
    margin-bottom: 100px;
  }

  #project-biocat .frame-07 img {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 150px;
  }

  #project-biocat .video-selector {
    display: block;
    margin: 0 auto;
    position: unset;
    text-align: center;
    width: 300px;
  }

  #project-biocat .text-seq {
    display: none;
    left: calc(50% - 116px);
    position: absolute;
    top: 10px;
    width: 300px;
  }

  #project-iciq .css-slideshow img {
    width: 100%;
  }
}


@media(max-width:600px){


}

@media(max-width: 500px){
  #project-biocat .frame.frame-03 {
    height: auto;
    overflow: initial;
  }

}














/* icrea ar 2018  */
#project-icrea-ar-2018 .frame-01 {

  /*border: 1px solid black;*/

}
/* biocat */
#project-icrea-ar-2018 .frame-01 .mackbook {
  margin-top: 114px;
  height: 600px;
  background: url("../img/project/icrea-ar-2018/macbook-mockup.png") no-repeat scroll calc(50% + 20px) 0px / 1200px auto;
}

#project-icrea-ar-2018 .frame-02 {
  height: 1050px;
  background-size: cover;
  background-image: url(../img/project/icrea-ar-2018/icrea2018-mockup-iphone.jpg);
}
#project-icrea-ar-2018 .frame-intro h1,
#project-icrea-ar-2018 .frame-intro p{
  color: #fff;
}

#project-icrea-ar-2018 .frame-intro p {
  color: #fff;
  font-family: Roboto;
  font-size: 14px;
  line-height: 21px;
}

#project-icrea-ar-2018 .frame-02 .comp-mac {
  height: 850px;
  /*background-image: url(../img/project/crg/frame-02-mac-83aef87126.jpg);*/
}

#project-icrea-ar-2018 .frame-02 .comp-mac > div {
  background-image: url("../img/project/crg-ar-2015/desktop-animation.gif");
  left: 49.8%;
  top: 159px;
  width: 683px;
}


#project-icrea-ar-2018 .frame-03 {
  margin: 150px 0px 150px 0px;
}

#project-icrea-ar-2018 .frame-01 {
  background-image: url("../img/project/icrea-ar-2018/icrea2018-header.jpg");
  background-position-y: -350px;
  height: 1000px;
  position: relative;
}


#project-icrea-ar-2018 .frame-02 {
  background-image: url("../img/project/icrea-ar-2018/icrea2018-mockup-iphone.jpg");
  background-size: 100%;
  position: relative;
}



#project-icrea-ar-2018 .frame-03 {
  background-image: url("../img/project/icrea-ar-2018/icrea2018-mockup-01.jpg");
  background-size: 100%;
  position: relative;
}



#project-icrea-ar-2018 .frame-04 {
  background-image: url("../img/project/icrea-ar-2018/icrea2018-mockup-02.jpg");
  background-size: 100%;
  position: relative;
}

#project-icrea-ar-2018 .frame-01 .comp-screen {
  background-position: 50% 45%;
  background-repeat: no-repeat;
  background-size: 1200px auto;
  background-color: #fff;
  height: 437px;
  left: calc(50% - 282px);
  position: absolute;
  top: 360px;
  width: 690px;
  z-index: 17;
}

.selector {
  display: inline-block;
  left: 0;
  position: absolute;
  text-align: center;
  top: auto;
  width: 100%;
  bottom: 40px;
}

.selector > li {
  display: inline-block;
}

.selector > li > a {
  background-image: url("../img/project/crg-ar-2015/option.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 15px 15px;
  display: inline-block;
  height: 15px;
  width: 32px;
}

.selector > li > a.active {
  background-image: url("../img/project/crg-ar-2015/active-option.png");
  background-position: center center;
  background-repeat: no-repeat;
}

#project-icrea-ar-2018 .frame-01 .comp-screen .seq {
  background-position: 50% 45%;
  background-repeat: no-repeat;
  background-size: 700px auto;
  height: 433px;
  left: calc(50% - 343px);
  position: absolute;
  top: 1px;
  width: 690px;
  z-index: 7;
  /*display: none;*/
}

#project-icrea-ar-2018 .frame-01 .comp-screen .seq-1 {
  background-image: url("../img/project/icrea-ar-2018/icrea2018-imac-01.jpg");
}

#project-icrea-ar-2018 .frame-01 .comp-screen .seq-2 {
  background-image: url("../img/project/icrea-ar-2018/icrea2018-imac-02.jpg");
}

#project-icrea-ar-2018 .frame-01 .comp-screen .seq-3 {
  background-image: url("../img/project/icrea-ar-2018/icrea2018-imac-03.jpg");
}

#project-icrea-ar-2018 .frame-01 .comp-screen .seq-4 {
  background-image: url("../img/project/icrea-ar-2018/icrea2018-imac-04.jpg");
}

#project-icrea-ar-2018 .frame-01 .comp-screen .seq-5 {
  background-image: url("../img/project/icrea-ar-2018/icrea2018-imac-05.jpg");
}


#project-icrea-ar-2018 .frame-01 {
  box-sizing: border-box;
  /*height: auto;*/
  padding-bottom: 50px;
  /*padding-top: 80px;*/
  position: relative;
  /*margin-top: 100px;*/
}



#project-icrea-ar-2018 .text-container {
  position: relative;
}

#project-icrea-ar-2018 .text-seq {
  left: 0;
  position: absolute;
  top: 10px;
  display: none;
}

#project-icrea-ar-2018 .text-seq.seq-1 {
  display: inline-block;
}


@media(min-width: 1201px) {
  #project-icrea-ar-2018 .frame-02 {
    width: 1140px;
    height: 800px;
    margin-left: auto;
    margin-right: auto;
  }
  #project-icrea-ar-2018 .frame-03 {
    width: 1140px;
    height: 800px;
    margin-left: auto;
    margin-right: auto;
  }
  #project-icrea-ar-2018 .frame-04 {
    width: 1140px;
    height: 1000px;
    margin-left: auto;
    margin-right: auto;
  }

}

@media(max-width: 1200px) {

  #project-icrea-ar-2018 .frame-01 .mackbook {
    background: none;
  }
  #project-icrea-ar-2018 .frame-02 {
    background: transparent;
    height: auto;
  }
  #project-icrea-ar-2018 .frame-02 img {
    display: block;
    width: 100%;
  }

  #project-icrea-ar-2018 .frame-03 {
    background: transparent;
    height: auto;
  }
  #project-icrea-ar-2018 .frame-03 img {
    display: block;
    width: 100%;
  }


  #project-icrea-ar-2018 .frame-04 {
    background: transparent;
    height: auto;
  }
  #project-icrea-ar-2018 .frame-04 img {
    display: block;
    width: 100%;
  }

  #project-icrea-ar-2018 .frame-01 {
    background: url("../img/project/icrea-ar-2018/macbook-mockup.png") no-repeat scroll calc(50% - 30px) 370px / 800px auto,
    rgba(0, 0, 0, 0) url("../img/project/icrea-ar-2018/icrea2018-header.jpg") no-repeat scroll 50% 0px / 1280px auto;
    height: 900px;
  }

  #project-icrea-ar-2018 .frame-01 .comp-screen .seq {
    width: 464px;
    height: 300px;
    left: calc(50% - 233px);
    background-position: left top;
    background-size: 100% auto;
  }
  #project-icrea-ar-2018 .frame-01 .comp-screen {
    background-position: 0;
    background-repeat: no-repeat;
    background-size: 100% auto;
    height: 297px;
    left: calc(50% - 233px);
    position: absolute;
    top: 393px;
    width: 463px;
    z-index: 17;
  }
  #project-icrea-ar-2018 .frame-01 .selector {
    position: absolute;
    margin-left: 0;
    padding-left: 0;
    top: auto;
    bottom: 50px;
  }


}




@media(max-width: 767px){


  #project-icrea-ar-2018 .frame{
    display: block;
    position: inherit;
    clear: both;
  }

  #project-icrea-ar-2018 .frame::before,
  #project-icrea-ar-2018 .frame::after{
    content: "";
    display: table;
    clear: both;
  }




  #project-icrea-ar-2018 .frame-02 .comp-mac > div {
    background-size: 295px auto;
    height: 159px;
    left: calc(50% - 43px);
    top: -4px;
    width: 320px;
  }

  #project-icrea-ar-2018 .frame-02 {
    height: auto;
    position: relative !important;
  }

  .project .comp-mac {
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
    background-image: url("../img/mac-xs-4e39fb00d8.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: auto auto;
    height: 260px;
    left: 47%;
    position: static;
    width: 320px;
  }

  #project-icrea-ar-2018 .frame-02 .comp-mac {
    background-position: center center;
    background-size: 120% auto;
    height: 290px;
    width: 320px;
  }


  #project-icrea-ar-2018 .frame-03 {
    background-position: center center, 0 0;
    background-size: 240% auto, 220% auto;
    height: auto;
    position: relative;
    margin: 50px 0px 50px 0px;
  }






  #project-icrea-ar-2018 .mobile {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }


  #project-icrea-ar-2018 .frame-01 {
    background: url("../img/project/icrea-ar-2018/macbook-mockup.png") no-repeat scroll calc(50% - 20px ) 370px / 420px auto,
    rgba(0, 0, 0, 0) url("../img/project/icrea-ar-2018/icrea2018-header.jpg") no-repeat scroll 50% 0px / 1000px auto;

    padding-bottom: 100px;
    height: 700px;

  }

  #project-icrea-ar-2018 .frame-01 .comp-screen .seq {
    width: 100%;
    left: 0px;
  }

  #project-icrea-ar-2018 .frame-01 .comp-screen {
    position: absolute;
    top: 465px;
    width: 244px;
    left: calc(50% - 126px);
    height: 157px;
  }
  #project-icrea-ar-2018 .frame-01 .comp-screen .seq {
    height: 190px;
  }
  #project-icrea-ar-2018 .frame-01 .selector {
    top: auto;
    bottom: auto;
    margin-top: 230px;
  }



  #project-icrea-ar-2018 .text-seq {
    display: none;
    left: calc(50% - 116px);
    position: absolute;
    top: 10px;
    width: 300px;
  }

  #project-iciq .css-slideshow img {
    width: 100%;
  }
}

@media(max-width: 500px){
  #project-icrea-ar-2018 .frame.frame-03 {
    height: auto;
    overflow: initial;
  }

}




/* icrea ar 2017 */
#project-icrea-ar-2017 .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/icrea-ar-2017/icrea-ar-2017-bakground-header.jpg") no-repeat scroll center bottom / 1920px ;
  height: 600px;
}
#project-icrea-ar-2017 .frame-02 {
  background-image: url("../img/project/icrea-ar-2017/icrea-ipad-bg.jpg");
  background-size: 100% 1030px;
  background-repeat: repeat-x;
}
#project-icrea-ar-2017 .frame-02 div {
  /*height: auto;*/
  background-size: 1920px ;
  background-image: url("../img/project/icrea-ar-2017/icrea-ar-2017-ipad.jpg");
}
#project-icrea-ar-2017 .frame-02 img {
  display: none;
}
#project-icrea-ar-2017 .frame-03 {
  margin-top: 100px;
  height: auto;
  background-size: 1080px ;
  background-image: url("../img/project/icrea-ar-2017/icrea-ar-2017-iphone.jpg");
}
#project-icrea-ar-2017 .frame-03 img {
  visibility: hidden;
  width: 100%;
}
#project-icrea-ar-2017 .frame-04{
  /*height: 950px;*/
  margin-top: 100px;
  width: 1125px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 25px;
  margin-bottom: 200px;
}
#project-icrea-ar-2017 .frame-04 .comp-left {
  float: left;
  width: 47%;
  position: relative;
  height: auto;
  top: 30px;
}
#project-icrea-ar-2017 .frame-04 .comp-right {
  float: left;
  width: 47%;
  position: relative;
  margin-left: 4%;
  top: 30px;
}
#project-icrea-ar-2017 .frame-04 .comp-left img ,
#project-icrea-ar-2017 .frame-04 .comp-right img {
  width: 100%;
}


#project-icrea-ar-2017 .frame-05 {
  height: 640px;
  background-size: 1920px ;
  background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-04.jpg");
}
#project-icrea-ar-2017 .frame-06 {
  height: 640px;
  background-size: 1920px ;
  background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-05.jpg");
}
#project-icrea-ar-2017 .frame-06 img {
  visibility: hidden;
  width: 100%;
}
#project-icrea-ar-2017 .frame-07 {
  background: url("../img/project/vhir-plan-estrategico-2018/vhir-plan-iconos.gif") no-repeat top center / 1350px;
  height: 700px;
  position: relative;
  /*background-size: cover;*/
}

@media screen and (min-width: 1281px) {
  #project-icrea-ar-2017 .frame-02 {

  }
  #project-icrea-ar-2017 .frame-02 div {
    width: 1086px;
    height: 1030px;
    margin: 0px auto;
    background-size: 100%;
  }
  #project-icrea-ar-2017 .frame-03 {
    height: 800px;
  }
}
  /* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {
  #project-icrea-ar-2017 .frame-02 div {
    height: auto;
    background-size: 1920px ;
    background-image: none;
  }
  #project-icrea-ar-2017 .frame-02 img {
    width: 100%;
    display: block;
  }
  #project-icrea-ar-2017 .frame-03 {
    height: auto;
    background: transparent;
  }
  #project-icrea-ar-2017 .frame-03 img {
    width: 100%;
    display: block;
    visibility: visible;
  }
  #project-icrea-ar-2017 .frame-04 {
    height: auto;
    background-size: 100%;
  }
  #project-icrea-ar-2017 .frame-05 {
    height: auto;
    background-size: 100%;
  }
  #project-icrea-ar-2017 .frame-06 {
    height: auto;
    background-size: 100%;
  }
}

@media screen and (device-width: 768px) {
  #project-icrea-ar-2017 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/vhir-plan-estrategico-2018/vhir-plan-estrategico-2018-cabecera.jpg") no-repeat scroll center top / 170%;
    height: 630px;
  }

  #project-icrea-ar-2017 .frame-02 {
    height: 385px;
    background-size: 150%;
    background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-01.png");
  }

  #project-icrea-ar-2017 .frame-03 {
    height: auto;
    background: transparent;
  }
  #project-icrea-ar-2017 .frame-03 img {
    width: 100%;
    display: block;
    visibility: visible;
  }
  #project-icrea-ar-2017 .frame-04 {
    height: 295px;
    background-size: 100%;
    background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-03.jpg");
  }
  #project-icrea-ar-2017 .frame-05 {
    height: 288px;
    background-size: 100%;
    background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-04.jpg");
  }
  #project-icrea-ar-2017 .frame-06 {
    height: 307px;
    background-size: 100%;
    background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-05.jpg");
  }
  #project-icrea-ar-2017 .frame-07 {
    background: url("../img/project/vhir-plan-estrategico-2018/vhir-plan-iconos.gif") no-repeat top center / 1200px;
    height: 550px;
    position: relative;
    background-size: cover;
  }

}
@media screen and (min-width: 767px)  and (max-width: 1200px) {
  #project-icrea-ar-2017 .frame-04 {
    width: 100%;
    padding: 0px;
  }
  #project-icrea-ar-2017 .frame-04 .comp-left,
  #project-icrea-ar-2017 .frame-04 .comp-right {
    width: 50%;
    margin: 0;
  }
}
@media screen and (max-width: 767px) {
  #project-icrea-ar-2017 .frame-01 {
    height: 300px;
  }
  #project-icrea-ar-2017 .frame-02 {
    background: transparent;
    height: auto;
    margin-top: 0px;
  }
  #project-icrea-ar-2017 .frame-02 img {
    width: 100%;
    display: block;
  }

  #project-icrea-ar-2017 .frame-03 {
    height: auto;
    background: transparent;
    margin-top: 50px;
  }
  #project-icrea-ar-2017 .frame-03 img {
    width: 100%;
    display: block;
    visibility: visible;
  }

  #project-icrea-ar-2017 .frame-04 {
    width: 100%;
    padding: 0px;
    margin-top: 50px;
    margin-bottom: 100px;
    overflow: auto;
  }

  #project-icrea-ar-2017 .frame-04 .comp-left,
  #project-icrea-ar-2017 .frame-04 .comp-right {
    top: 0;
    width: 100%;
    margin: 0;
  }


}



/* barcelona beta */

#project-barcelona-beta .frame-01 {
  background: url("../img/project/barcelona-beta/barcelona-beta-background-header.jpg") no-repeat scroll center top / 1920px;
  height: 690px;
}
#project-barcelona-beta .frame-02 {
  background: linear-gradient(#c9f795, #f0fedf);
  height: 700px;
}
#project-barcelona-beta .frame-02 div {
  height: 860px;
  background-size: 1200px ;
  background-image: url("../img/project/barcelona-beta/barcelona-beta-imac.png");
  background-repeat: no-repeat;
  margin-top: -200px;
  width: 1240px;
  margin-left: calc(1240px - 50%);
}
#project-barcelona-beta .frame-03 {
  height: auto;
  background-size: 100% ;
  background-image: url("../img/project/barcelona-beta/barcelona-beta-mockup.jpg");
  /*top: -150px;*/
}
#project-barcelona-beta .frame-03 img {
  visibility: hidden;
  width: 100%;
}
#project-barcelona-beta .frame-04 {
  height: 640px;
  margin-bottom: 200px;
  background-size: 1200px ;
  background-image: url("../img/project/barcelona-beta/barcelona-beta-iphone.jpg");
}
#project-barcelona-beta .frame-04 img {
  visibility: hidden;
  width: 100%;
}
.color.white {
  color: white !important;
}



@media screen and (min-width: 1281px) {

  #project-barcelona-beta .frame-03 {
    width: 1140px;
    height: 900px;
    background-size: 1100px ;
    margin-top: 0px;
    margin-left: calc(50% - 570px);
  }

  #project-barcelona-beta .frame-04 {
    width: 1140px;
    height: 750px;
    background-size: 1100px ;
    margin-top: -150px;
    margin-left: calc(50% - 570px);
  }


}


/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1600px) and (min-width: 769px) {

  #project-barcelona-beta .frame-02 {
    height: calc(50vw + 50px);
  }

  /*#project-barcelona-beta .frame-03 {*/
    /*height: 70vw;*/
    /*background-size: cover;*/
    /*background-image: url("../img/project/barcelona-beta/barcelona-beta-mockup.jpg");*/
    /*!*top: -150px;*!*/
  /*}*/
  #project-barcelona-beta .frame-03 img {
    visibility: hidden;
    width: 100%;
  }

}
@media screen and (max-width: 1920px) and (min-width: 1281px) {

  #project-barcelona-beta .frame-02 div {
    width: 1100px;
    height: 900px;
    background-size: 1100px ;
    margin-top: -200px;
    margin-left: calc(50% - 650px);
  }


}
/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {

  #project-barcelona-beta .frame-02 {
    height: 600px;
  }

  #project-barcelona-beta .frame-02 div {
    width: 800px;
    height: 900px;
    background-size: 800px ;
    margin-top: -200px;
    margin-left: calc(50% - 500px);
  }

  #project-barcelona-beta .frame-03 {
    /*height: auto;*/
    background-size: 100%;
    top: -150px;
  }
  #project-barcelona-beta .frame-04 {
    height: auto;
    background-size: 100%;
  }
  #project-barcelona-beta .frame-05 {
    height: auto;
    background-size: 100%;
  }
  #project-barcelona-beta .frame-06 {
    height: auto;
    background-size: 100%;
  }
}

@media screen and (device-width: 768px) {

  #project-barcelona-beta .frame-02 {
    height: 500px;
  }
  #project-barcelona-beta .frame-02 div {
    width: 700px;
    height: 500px;
    background-size: 700px ;
    margin-top: -200px;
    margin-left: calc(50% - 450px);
  }

  #project-barcelona-beta .frame-03 {
    height: auto;
    background-size: 100%;
    background-image: none;
    /*top: -157px;*/
  }
  #project-barcelona-beta .frame-03 img {
    visibility: visible;
    display:  block;
  }
  #project-barcelona-beta .frame-04 {
    height: 295px;
    background-size: 100%;
    /*background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-03.jpg");*/

  }
  #project-barcelona-beta .frame-05 {
    height: 288px;
    background-size: 100%;
    /*background-image: url("../img/project/vhir-plan-estrategico-2018/vhir-mockup-04.jpg");*/
    top: -158px;
  }


}

@media screen and (max-width: 767px) {
  #project-barcelona-beta .frame-01 {
    background: url("../img/project/barcelona-beta/barcelona-beta-background-header.jpg") no-repeat scroll center top / auto 380px,#c9f795;
    height: 550px;
    position: relative;
  }


  #project-barcelona-beta .frame-01 img {
    width: 320px;
    margin-top: auto;
    bottom: 80px;
    margin-bottom: 0px;
    position: absolute;
    left: calc(50% - 210px);
  }
  #project-barcelona-beta .frame-02 {
    display: none;
  }

  #project-barcelona-beta .frame-02 div {
    width: 100%;
    margin-left: 0;
    background: none;
    height: auto;
  }

  #project-barcelona-beta .frame-03 {
    height: auto;
    background-size: 100%;
    background-image: none;
  }
  #project-barcelona-beta .frame-03 img,
  #project-barcelona-beta .frame-04 img {
    visibility: visible;
    display:  block;
  }
  #project-barcelona-beta .frame-04 {
    margin-top: 50px;
    margin-bottom: 100px;
    background: none;
    height: auto;
  }
}



/************************* bgse ***************************************/

#project-bgse .frame-02 img {
  visibility: hidden;
  width: 100%;
}
#project-bgse .frame-02 {
  height: 640px;
  background-size: 1200px ;
  background-image: url("../img/project/bgse/bgse-ipad-mockup.jpg");
  margin-top: 130px;

}
#project-bgse .frame-03 {
  /*height: 100vw;*/
  background-size: 100%;
  background-image: url("../img/project/bgse/bgse-iphone-mockup.jpg");
  top: 150px;
  margin-bottom: 100px;
}
#project-bgse .frame-03 img {
  display: none;
}


@media screen and (max-width: 1920px) and (min-width: 1281px) {

  #project-bgse .frame-02 div {
    width: 1100px;
    height: 900px;
    background-size: 1100px ;
    margin-top: -200px;
    margin-left: calc(50% - 650px);
  }

}

@media screen and (min-width: 1281px) {

  #project-bgse .frame-03 {
    height: 890px;
    background-size: 1190px auto;
    margin-bottom: 350px
  }

}
@media screen and (max-width: 1600px) and (min-width: 769px) {

  /*#project-bgse .frame-03 img {*/
    /*visibility: hidden;*/
    /*width: 100%;*/
  /*}*/

}



@media screen and (max-width: 1280px) and (min-width: 769px) {

  #project-bgse .frame-02 {
    height: auto;
    background-size: 100%;

  }
  #project-bgse .frame-03 {
    height: auto;
    background-size: 100%;
    background-image: none;
    margin-bottom: 350px;
  }
  #project-bgse .frame-03 img {
    width: 100%;
    display: block;
  }


  #project-bgse .frame-01 .comp-mac>div {
    /*content*/
    background-image: url(../img/project/bgse/bgse-macbook-mockup.gif);

    position: absolute;
    width: 711px;
    height: 435px;
    left: 50%;
    margin-left: -278px;
    z-index: 11;
    top: 39px;
  }


}


@media screen and (device-width: 768px) {

  #project-barcelona-beta .frame-02 {
    height: 295px;
    background-size: 100%;
  }
}
@media (min-width:768px) {
  #project-bgse.project .comp-mac {
    position: absolute;
    width: 1200px;
    height: 800px;
    left: 50%;
    margin-left: -650px;
    z-index: 11;
    background: url(../img/macbook-mockup.png) top no-repeat !important;
  }
  #project-bgse .frame-01 {
    height: 1100px;
    background:  #43afb8;
  }

  #project-bgse .frame-01 .comp-mac {
    bottom: -100px;
  }

  #project-bgse .frame-01 .comp-mac>div {
    /*content*/
    background-image: url(../img/project/bgse/bgse-macbook-mockup.gif);

    position: absolute;
    width: 711px;
    height: 435px;
    left: 50%;
    margin-left: -278px;
    z-index: 11;
    top: 39px;
  }
}

@media (max-width:767px) {

  #project-bgse .frame-01 {
    height: 500px;
    background: #43afb8;
  }

  #project-bgse.project .comp-mac {

    position: relative;
    width: 400px;
    height: 200px;
    left: 0;
    margin-left: calc(50% - 230px);
    z-index: 11;
    background: url(../img/macbook-mockup.png) top no-repeat !important;
    background-size: 100% !important;

  }

  #project-bgse .frame-01 .comp-mac>div {
    background-image: url(../img/project/bgse/bgse-macbook-mockup.gif);
    position: absolute;
    width: 220px;
    height: 135px;
    left: 50%;
    margin-left: -86px;
    z-index: 11;
    top: -39px;
    background-size: 100%;
  }

  #project-bgse .frame-02 img {
    visibility: visible;
    display:  block;
  }
  #project-bgse .frame-02 {
    margin-top: 60px;
    background: none;
    height: auto;
  }

  #project-bgse .frame-03 {
    height: auto;
    background-size: 100%;
    background-repeat: no-repeat;
    margin-top: 60px;
    margin-bottom: 100px;
  }

  #project-bgse .frame-03 img {
    width: 100%;
    display: block;
  }


}

@media (min-width:768px) and (max-width:991px) {
  #project-bgse .frame-01 {
    height: 750px;
  }

  #project-bgse .frame-01 .comp-mac {
    top: auto;
    bottom: -300px;
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 1000px;
    left: 50%;
    margin-left: -500px;
    background-size: 100% !important;
  }

  #project-bgse .frame-03 .comp-tablet {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 1000px;
    left: 50%;
    margin-left: -500px;
  }

  #project-bgse .frame-01 .comp-mac>div {
    /*content*/
    background-image: url(../img/project/bgse/bgse-macbook-mockup.gif);

    position: absolute;
    width: 548px;
    height: 335px;
    left: 50%;
    margin-left: -214px;
    z-index: 11;
    top: 30px;
  }

}

@media (max-width:440px) {
  #project-bgse .frame-01 {
    height: 550px;
  }
}


/************************* crg-ar-2017 ***************************************/

#project-crg-ar-2017 .frame-02 img {
  visibility: hidden;
  width: 100%;
}

#project-crg-ar-2017 .frame-02 {
  height: 800px;
  background-size: 1140px;
  background-image: url("../img/project/crg-ar-2017/crg-ar-2017-responsive-mockup.jpg");
  top: 150px;
}

#project-crg-ar-2017 .frame-03 img {
  visibility: hidden;
  width: 100%;
  display: none;
}
#project-crg-ar-2017 .frame-03 {
  height: 1100px;
  background-size: 1140px ;
  background-image: url("../img/project/crg-ar-2017/crg-ar-2017-iphone-mockup.jpg");
  margin-top: 130px;
}
#project-crg-ar-2017 .frame-04 {

}

#project-crg-ar-2017 .frame-04 img {
  visibility: hidden;
  width: 100%;
  display: none;
}

#project-crg-ar-2017 .frame-04 {
  height: auto;
  background: url("../img/project/crg-ar-2017/crg-ar-2017-print-1.png") no-repeat center 150px, url("../img/project/crg-ar-2017/crg-print-report-background.png");
  top: 150px;
}

#project-crg-ar-2017 .frame-05 img {
  visibility: hidden;
  width: 100%;
  display: none;
}

#project-crg-ar-2017 .frame-05 {
  height: auto;
  background: url("../img/project/crg-ar-2017/crg-ar-2017-print-2.png") no-repeat center 150px, url("../img/project/crg-ar-2017/crg-print-report-background.png");
  top: 150px;
  margin-bottom: 100px;
}

@media screen and (min-width: 1281px) {

  #project-crg-ar-2017 .frame-04 {
    height: 890px;
    background-size: 999px auto;
    top: 150px;
  }

  #project-crg-ar-2017 .frame-05 {
    height: 1000px;
    background-size: 999px auto;
    top: 150px;

  }



}



@media screen and (max-width: 1600px) and (min-width: 769px) {

  #project-crg-ar-2017 .frame-02 img {
    visibility: hidden;
    width: 100%;
    display: none;
  }

  /*#project-crg-ar-2017 .frame-03 {*/
    /*height: auto;*/
    /*background-size: 100%;*/
  /*}*/

  /*#project-crg-ar-2017 .frame-04 img {*/
    /*visibility: hidden;*/
    /*width: 100%;*/
    /*display: none;*/
  /*}*/
  /*#project-crg-ar-2017 .frame-05 img {*/
    /*visibility: hidden;*/
    /*width: 100%;*/
    /*display: none;*/
  /*}*/
}

@media screen and (max-width: 1280px) {
    #project-crg-ar-2017 .frame-02 {
        margin-top: 100px;
        background-image: none;
        height: auto;
        top: 0px;
    }
    #project-crg-ar-2017 .frame-02 img {
        display: block;
        visibility: visible;
    }
    #project-crg-ar-2017 .frame-03 {
        background-image: none;
        margin-top: 100px;
        height: auto;
    }

    #project-crg-ar-2017 .frame-03 img {
        display: block;
        visibility: visible;
        width: 100%;
    }

  #project-crg-ar-2017 .frame-04 {
    background: url("../img/project/crg-ar-2017/crg-print-report-background.png");
    height: auto;
  }

  /*#project-crg-ar-2017 .frame-04 {*/
    /*height: auto;*/
    /*background: url("../img/project/crg-ar-2017/crg-ar-2017-print-1.png") no-repeat center 150px, url("../img/project/crg-ar-2017/crg-print-report-background.png");*/
    /*top: 150px;*/
  /*}*/

  #project-crg-ar-2017 .frame-04 img{
    background: transparent;
    visibility: visible;
    display:  block;
    width: 80%;
    margin: 100px auto;
  }
  #project-crg-ar-2017 .frame-05 {
    background: url("../img/project/crg-ar-2017/crg-print-report-background.png");
    height: auto;

  }
  #project-crg-ar-2017 .frame-05 img{
    background: transparent;
    visibility: visible;
    display:  block;
    width: 80%;
    margin: 100px auto;
  }
}

@media screen and (max-width: 1280px) and (min-width: 769px) {

  /*#project-crg-ar-2017 .frame-02 {*/
    /*height: auto;*/
    /*background-size: 100%;*/
  /*}*/
  #project-crg-ar-2017 .frame-02 {
    /*height: 70vw;*/
    background-size: 100%;
  }

  /*#project-crg-ar-2017 .frame-04 {*/
    /*height: 70vw;*/
    /*background-size: 100%;*/
  /*}*/

  /*#project-crg-ar-2017 .frame-05 {*/
    /*height: 90vw;*/
    /*background-size: 100%;*/
  /*}*/


  #project-crg-ar-2017 .frame-01 .comp-mac>div {
    /*content*/
    background-image: url(../img/project/bgse/bgse-macbook-mockup.gif);

    position: absolute;
    width: 711px;
    height: 435px;
    left: 50%;
    margin-left: -278px;
    z-index: 11;
    top: 39px;
  }


}


@media screen and (device-width: 768px) {

  #project-crg-ar-2017 .project-footer-inverse {
      bottom: 0;
  }

}
@media (min-width:768px) {
  #project-crg-ar-2017.project .comp-mac {
    position: absolute;
    width: 1200px;
    height: 800px;
    left: 50%;
    margin-left: -600px;
    z-index: 11;
    background-position-y: -100px;
    /*background: url(../img/macbook-mockup.png) top no-repeat !important;*/
  }
  #project-crg-ar-2017 .frame-01 {
    height: 1100px;
    background: #4DD56B;
  }

  #project-crg-ar-2017 .frame-01 .comp-mac {
    bottom: 0px;
  }

  #project-crg-ar-2017 .frame-01 .comp-mac>div {

    /*content*/
    background-image: url(../img/project/crg-ar-2017/crg-ar-2017-imac.gif);
    position: absolute;
    width: 681px;
    height: 385px;
    left: 50%;
    margin-left: -339px;
    z-index: 11;
    top: 48px;
    background-size: 100%;
  }

  #project-crg-ar-2017 .frame-05 {
    margin-bottom: 200px;
  }

}

@media (max-width:767px) {

  #project-crg-ar-2017 .frame-01 {
    height: 600px;
    background: #4DD56B;
  }

  #project-crg-ar-2017.project .comp-mac {

    position: relative;
    width: 340px;
    height: 340px;
    left: 0;
    margin-left: calc(50% - 170px);
    z-index: 11;
    /*background: url(../img/macbook-mockup.png) top no-repeat !important;*/
    background-size: 100% !important;

  }

  #project-crg-ar-2017 .frame-01 .comp-mac>div {
    background-image: url(../img/project/crg-ar-2017/crg-ar-2017-imac.gif);
    position: absolute;
    width: 260px;
    height: 150px;
    left: 50%;
    margin-left: -130px;
    z-index: 11;
    top: -2px;
    background-size: 100%;
  }
    #project-crg-ar-2017 .frame-04 {
      margin-top: 100px;
      position: relative;
      top: 0px;
      padding: 50px;
    }
  #project-crg-ar-2017 .frame-04 img {
    margin-top: 100px;
    width: 100%;
  }
  #project-crg-ar-2017 .frame-05 {
    margin-top: 0px;
    position: relative;
    top: 0px;
    padding: 50px;
    margin-bottom: 100px;
  }
  #project-crg-ar-2017 .frame-05 img {
    margin-top: 0px;
    width: 100%;
  }




}

@media (min-width:768px) and (max-width:991px) {
  #project-crg-ar-2017 .frame-01 {
    height: 750px;
  }

  #project-crg-ar-2017 .frame-01 .comp-mac {
    background-position-y: 0px;
    top: auto;
    bottom: -200px;
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 1000px;
    left: 50%;
    margin-left: -500px;
    background-size: 100% !important;
  }

  #project-crg-ar-2017 .frame-02 .comp-tablet {
    -webkit-transform: scale(.7,.7);
    -ms-transform: scale(.7,.7);
    transform: scale(.7,.7);
    width: 1000px;
    left: 50%;
    margin-left: -500px;
  }

  #project-crg-ar-2017 .frame-01 .comp-mac>div {
    /*content*/
    background-image: url(../img/project/crg-ar-2017/crg-ar-2017-imac.gif);

    position: absolute;
    width: 754px;
    height: 415px;
    left: 50%;
    margin-left: -377px;
    z-index: 11;
    top: 170px;
  }

}




/************************* isglobal-ar-2018 ***************************************/


#project-isglobal-ar-2018 .frame-01 {
  background-image: url("../img/project/isglobal-ar-2018/isglobal-ar-2018-header.jpg");
  background-position-y: -50px;
  height: 700px;
}
#project-isglobal-ar-2018 .frame-01 .comp-mac>div {
    /*content*/
    background-image: url("../img/project/isglobal-ar-2018/isglobal-mackbook.gif");

    position: absolute;
    width: 711px;
    height: 435px;
    left: 50%;
    margin-left: -278px;
    z-index: 11;
    top: 39px;
}

#project-isglobal-ar-2018 .frame-02 {
    height: 1270px;
    background-size: 1200px ;
    background-image: url("../img/project/isglobal-ar-2018/isglobal-mobile.png");
    background-color: #F27E1B;
    background-position-y: 100px;
    margin-top: 510px;

}
#project-isglobal-ar-2018 .frame-02 img {
    visibility: hidden;
    width: 100%;
}
#project-isglobal-ar-2018 .frame-03 {
    /*height: 100vw;*/
    background-size: 100%;
    background-image: url("../img/project/isglobal-ar-2018/isglobal-print-01.jpg");
    top: 100px;
    margin-bottom: 100px;
}
#project-isglobal-ar-2018 .frame-03 img {
    display: none;
}

#project-isglobal-ar-2018 .frame-04 {
    /*height: 100vw;*/
    background-size: 100%;
    background-image: url("../img/project/isglobal-ar-2018/isglobal-print-02.jpg");
    top: 100px;
    margin-bottom: 100px;
}
#project-isglobal-ar-2018 .frame-04 img {
    display: none;
}

#project-isglobal-ar-2018 .frame-05 {
    /*height: 100vw;*/
    background-size: 100%;
    background-image: url("../img/project/isglobal-ar-2018/isglobal-print-03.jpg");
    top: 100px;
    margin-bottom: 100px;
}
#project-isglobal-ar-2018 .frame-05 img {
    display: none;
}


@media screen and (max-width: 1920px) and (min-width: 1281px) {

    #project-isglobal-ar-2018 .frame-02 div,
    #project-isglobal-ar-2018 .frame-03 div,
    #project-isglobal-ar-2018 .frame-04 div,
    #project-isglobal-ar-2018 .frame-05 div {
        width: 1100px;
        height: 900px;
        background-size: 1100px ;
        margin-top: -200px;
        margin-left: calc(50% - 650px);
    }

}

@media screen and (min-width: 1281px) {

    #project-isglobal-ar-2018 .frame-03 {
        height: 613px;
        background-size: 1190px auto;
        margin-bottom: 0px
    }
    #project-isglobal-ar-2018 .frame-04 {
        height: 593px;
        background-size: 1190px auto;
        margin-bottom: 0px
    }
    #project-isglobal-ar-2018 .frame-05 {
        height: 613px;
        background-size: 1190px auto;
        margin-bottom: 300px
    }

}
@media screen and (max-width: 1600px) and (min-width: 769px) {

    /*#project-isglobal-ar-2018 .frame-03 img {*/
    /*visibility: hidden;*/
    /*width: 100%;*/
    /*}*/

}



@media screen and (max-width: 1280px) and (min-width: 769px) {

    #project-isglobal-ar-2018 .frame-02 {
        height: auto;
        background-size: 100%;
        padding-bottom: 150px;
    }
    #project-isglobal-ar-2018 .frame-03 {
         height: auto;
         background-size: 100%;
         background-image: none;
         margin-bottom: 0px;
     }
    #project-isglobal-ar-2018 .frame-03 img {
        width: 100%;
        display: block !important;
    }

    #project-isglobal-ar-2018 .frame-04 {
        height: auto;
        background-size: 100%;
        background-image: none;
        margin-bottom: 0px;
    }
    #project-isglobal-ar-2018 .frame-04 img {
        width: 100%;
        display: block !important;
    }

    #project-isglobal-ar-2018 .frame-05 {
        height: auto;
        background-size: 100%;
        background-image: none;
        margin-bottom: 300px;
    }
    #project-isglobal-ar-2018 .frame-05 img {
        width: 100%;
        display: block !important;
    }

    #project-isglobal-ar-2018 .frame-01 .comp-mac>div {
        /*content*/
        background-image: url(../img/project/isglobal-ar-2018/isglobal-mackbook.gif);

        position: absolute;
        width: 711px;
        height: 435px;
        left: 50%;
        margin-left: -278px;
        z-index: 11;
        top: 39px;
    }


}


@media (min-width:768px) {
    #project-isglobal-ar-2018.project .comp-mac {
        position: absolute;
        width: 1200px;
        height: 800px;
        left: 50%;
        margin-left: -650px;
        z-index: 11;
        background: url(../img/macbook-mockup.png) top no-repeat !important;
    }


    #project-isglobal-ar-2018 .frame-01 .comp-mac {
        bottom: -620px;
    }

    #project-isglobal-ar-2018 .frame-01 .comp-mac>div {
        /*content*/
        background-image: url(../img/project/isglobal-ar-2018/isglobal-mackbook.gif);

        position: absolute;
        width: 711px;
        height: 435px;
        left: 50%;
        margin-left: -278px;
        z-index: 11;
        top: 39px;
    }





    #project-isglobal-ar-2018 .frame-03 img {
        display: none;
    }
    #project-isglobal-ar-2018 .frame-04 img {
        display: none;
    }
    #project-isglobal-ar-2018 .frame-05 img {
        display: none;
    }




}



@media screen and (device-width: 768px) {
  #project-isglobal-ar-2018 .frame-02 {
    background-size: 700px;
    height: 830px;
  }




  #project-isglobal-ar-2018 .frame-02 img {
    visibility: visible;
    display:  block;
  }
  #project-isglobal-ar-2018 .frame-02 {
    margin-top: 60px;
    padding: 50px 0px;
    background: #F27E1B;
    height: auto;
  }

  #project-isglobal-ar-2018 .frame-03 {
    height: auto;
    background-size: 100%;
    background-repeat: no-repeat;
    margin-top: 60px;
    margin-bottom: 0px;
  }

  #project-isglobal-ar-2018 .frame-03 img {
    width: 100%;
    display: block;
  }

  #project-isglobal-ar-2018 .frame-04 {
    height: auto;
    background-size: 100%;
    background-image: none;
    margin-bottom: 0px;
  }
  #project-isglobal-ar-2018 .frame-04 img {
    width: 100%;
    display: block;
  }

  #project-isglobal-ar-2018 .frame-05 {
    height: auto;
    background-size: 100%;
    background-image: none;
    margin-bottom: 60px;
  }
  #project-isglobal-ar-2018 .frame-05 img {
    width: 100%;
    display: block;
  }

}

@media (max-width:767px) {



    #project-isglobal-ar-2018 .frame-01 {
      background: rgba(0, 0, 0, 0) url("../img/project/isglobal-ar-2018/isglobal-ar-2018-header.jpg") no-repeat scroll 25% 0px / 1000px auto;
      padding-bottom: 100px;
      height: 420px;
    }

    #project-isglobal-ar-2018.project .comp-mac {

        position: relative;
        width: 400px;
        height: 200px;
        left: 0;
        margin-left: calc(50% - 230px);
        z-index: 11;
        background: url(../img/macbook-mockup.png) top no-repeat !important;
        background-size: 100% !important;
        margin-top: 170px;

    }

    #project-isglobal-ar-2018 .frame-01 .comp-mac>div {
        background-image: url(../img/project/isglobal-ar-2018/isglobal-mackbook.gif);
        position: absolute;
        width: 220px;
        height: 135px;
        left: 50%;
        margin-left: -86px;
        z-index: 11;
        top: -39px;
        background-size: 100%;
    }

    #project-isglobal-ar-2018 .frame-02 img {
        visibility: visible;
        display:  block;
    }
    #project-isglobal-ar-2018 .frame-02 {
        margin-top: 230px;
        padding: 50px 0px;
        background: #F27E1B;
        height: auto;
    }

    #project-isglobal-ar-2018 .frame-03 {
        height: auto;
        background-size: 100%;
        background-repeat: no-repeat;
        margin-top: 60px;
        margin-bottom: 0px;
    }

    #project-isglobal-ar-2018 .frame-03 img {
        width: 100%;
        display: block;
    }

    #project-isglobal-ar-2018 .frame-04 {
        height: auto;
        background-size: 100%;
        background-image: none;
        margin-bottom: 0px;
    }
    #project-isglobal-ar-2018 .frame-04 img {
        width: 100%;
        display: block;
    }

    #project-isglobal-ar-2018 .frame-05 {
        height: auto;
        background-size: 100%;
        background-image: none;
        margin-bottom: 60px;
    }
    #project-isglobal-ar-2018 .frame-05 img {
        width: 100%;
        display: block;
    }


}

@media (min-width:768px) and (max-width:991px) {
    /*#project-isglobal-ar-2018 .frame-01 {*/
        /*height: 750px;*/
    /*}*/


  #project-isglobal-ar-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/isglobal-ar-2018/isglobal-ar-2018-header.jpg") no-repeat scroll 50% 0px / 1280px auto;
    height: 900px;
  }

    #project-isglobal-ar-2018 .frame-01 .comp-mac {
        top: auto;
        bottom: -300px;
        -webkit-transform: scale(.9,.9);
        -ms-transform: scale(.9,.9);
        transform: scale(.9,.9);
        width: 1000px;
        left: 50%;
        margin-left: -550px;
        background-size: 100% !important;
    }

    #project-isglobal-ar-2018 .frame-02 {
      margin-top: 30px;
    }

    #project-isglobal-ar-2018 .frame-03 .comp-tablet {
        -webkit-transform: scale(.7,.7);
        -ms-transform: scale(.7,.7);
        transform: scale(.7,.7);
        width: 1000px;
        left: 50%;
        margin-left: -500px;
    }

    #project-isglobal-ar-2018 .frame-01 .comp-mac>div {
        /*content*/
        background-image: url(../img/project/isglobal-ar-2018/isglobal-mackbook.gif);

        position: absolute;
        width: 548px;
        height: 335px;
        left: 50%;
        margin-left: -214px;
        z-index: 11;
        top: 30px;
    }

}

@media (max-width:440px) {
    #project-isglobal-ar-2018 .frame-01 {
        height: 550px;
    }


  #project-isglobal-ar-2018 .frame-02 {
    margin-top: 100px;
    padding: 50px 0px;
    background: #F27E1B;
    height: auto;
  }
}


/************************* eit-health ***************************************/


#project-eit-health .frame-01 {
  background-image: url("../img/project/eit-health/eit-health-header.jpg");
  background-position-y: -50px;
  height: 700px;
}
#project-eit-health .frame-01 .comp-mac>div {
  /*content*/
  background-image: url(../img/project/eit-health/eit-health-mac-content.jpg);

  position: absolute;
  width: 711px;
  height: 435px;
  left: 50%;
  margin-left: -278px;
  z-index: 11;
  top: 39px;
}

#project-eit-health .frame-02 {
  height: 960px;
  background-size: 1200px ;
  background-image: url("../img/project/eit-health/eit-health-mobile.jpg");
  background-position-y: 100px;
  margin-top: 330px;

}
#project-eit-health .frame-02 img {
  visibility: hidden;
  width: 100%;
}
#project-eit-health .frame-03 {
  /*height: 100vw;*/
  background-size: 100%;
  background-image: url("../img/project/eit-health/eit-health-brochure-01.jpg");
  top: 100px;
  margin-bottom: 100px;
}
#project-eit-health .frame-03 img {
  display: none;
}

#project-eit-health .frame-04 {
  /*height: 100vw;*/
  background-size: 100%;
  background-image: url("../img/project/eit-health/eit-health-brochure-02.jpg");
  top: 100px;
  margin-bottom: 100px;
}
#project-eit-health .frame-04 img {
  display: none;
}

#project-eit-health .frame-05 {
  /*height: 100vw;*/
  background-size: 100%;
  background-image: url("../img/project/eit-health/eit-health-brochure-03.jpg");
  top: 100px;
  margin-bottom: 100px;
}
#project-eit-health .frame-05 img {
  display: none;
}

@media screen and (max-width: 1920px) and (min-width: 1281px) {

  #project-eit-health .frame-02 div,
  #project-eit-health .frame-03 div,
  #project-eit-health .frame-04 div,
  #project-eit-health .frame-05 div {
    width: 1100px;
    height: 900px;
    background-size: 1100px ;
    margin-top: -200px;
    margin-left: calc(50% - 650px);
  }

}

@media screen and (min-width: 1281px) {

  #project-eit-health .frame-03 {
    height: 940px;
    background-size: 1190px auto;
    margin-bottom: 0px
  }
  #project-eit-health .frame-04 {
    height: 910px;
    background-size: 1190px auto;
    margin-bottom: 60px;
  }
  #project-eit-health .frame-05 {
    height: 920px;
    background-size: 1190px auto;
    margin-bottom: 300px
  }

}
@media screen and (max-width: 1600px) and (min-width: 769px) {

  /*#project-eit-health .frame-03 img {*/
  /*visibility: hidden;*/
  /*width: 100%;*/
  /*}*/

}



@media screen and (max-width: 1280px) and (min-width: 769px) {

  #project-eit-health .frame-02 {
    height: auto;
    background-size: 100%;
    padding-bottom: 150px;
  }
  #project-eit-health .frame-03 {
    height: auto;
    background-size: 100%;
    background-image: none;
    margin-bottom: 0px;
  }
  #project-eit-health .frame-03 img {
    width: 100%;
    display: block !important;
  }

  #project-eit-health .frame-04 {
    height: auto;
    background-size: 100%;
    background-image: none;
    margin-bottom: 100px;
    margin-top: 100px;
  }
  #project-eit-health .frame-04 img {
    width: 100%;
    display: block !important;
  }

  #project-eit-health .frame-05 {
    height: auto;
    background-size: 100%;
    background-image: none;
    margin-bottom: 300px;
  }
  #project-eit-health .frame-05 img {
    width: 100%;
    display: block !important;
  }

  #project-eit-health .frame-01 .comp-mac>div {
    /*content*/
    background-image: url(../img/project/eit-health/eit-health-mac-content.jpg);

    position: absolute;
    width: 711px;
    height: 435px;
    left: 50%;
    margin-left: -278px;
    z-index: 11;
    top: 39px;
  }


}


@media (min-width:768px) {
  #project-eit-health.project .comp-mac {
    position: absolute;
    width: 1200px;
    height: 800px;
    left: 50%;
    margin-left: -650px;
    z-index: 11;
    background: url(../img/macbook-mockup.png) top no-repeat !important;
  }


  #project-eit-health .frame-01 .comp-mac {
    bottom: -470px;
  }

  #project-eit-health .frame-01 .comp-mac>div {
    /*content*/
    background-image: url(../img/project/eit-health/eit-health-mac-content.jpg);

    position: absolute;
    width: 711px;
    height: 435px;
    left: 50%;
    margin-left: -278px;
    z-index: 11;
    top: 39px;
  }





  #project-eit-health .frame-03 img {
    display: none;
  }
  #project-eit-health .frame-04 img {
    display: none;
  }
  #project-eit-health .frame-05 img {
    display: none;
  }




}



@media screen and (device-width: 768px) {
  #project-eit-health .frame-02 {
    background-size: 700px;
    height: 830px;
  }




  #project-eit-health .frame-02 img {
    visibility: visible;
    display:  block;
  }
  #project-eit-health .frame-02 {
    margin-top: 60px;
    padding: 50px 0px;
    height: auto;
  }

  #project-eit-health .frame-03 {
    height: auto;
    background-size: 100%;
    background-repeat: no-repeat;
    margin-top: 60px;
    margin-bottom: 0px;
  }

  #project-eit-health .frame-03 img {
    width: 100%;
    display: block;
  }

  #project-eit-health .frame-04 {
    height: auto;
    background-size: 100%;
    background-image: none;
    margin-bottom: 300px;
    margin-top: 100px;
  }
  #project-eit-health .frame-04 img {
    width: 100%;
    display: block;
  }





}

@media (max-width:767px) {



  #project-eit-health .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/eit-health/eit-health-header.jpg") no-repeat scroll 25% 0px / 1000px auto;
    padding-bottom: 100px;
    height: 420px;
  }

  #project-eit-health.project .comp-mac {

    position: relative;
    width: 400px;
    height: 200px;
    left: 0;
    margin-left: calc(50% - 230px);
    z-index: 11;
    background: url(../img/macbook-mockup.png) top no-repeat !important;
    background-size: 100% !important;
    margin-top: 170px;

  }

  #project-eit-health .frame-01 .comp-mac>div {
    background-image: url(../img/project/eit-health/eit-health-mac-content.jpg);
    position: absolute;
    width: 220px;
    height: 135px;
    left: 50%;
    margin-left: -86px;
    z-index: 11;
    top: -39px;
    background-size: 100%;
  }

  #project-eit-health .frame-02 img {
    visibility: visible;
    display:  block;
  }
  #project-eit-health .frame-02 {
    background: transparent;
    margin-top: 230px;
    padding: 50px 0px;
    height: auto;
  }

  #project-eit-health .frame-03 {
    background: transparent;
    height: auto;
    background-size: 100%;
    background-repeat: no-repeat;
    margin-top: 60px;
    margin-bottom: 0px;
  }

  #project-eit-health .frame-03 img {
    width: 100%;
    display: block;
  }

  #project-eit-health .frame-04 {
    background: transparent;
    height: auto;
    background-size: 100%;
    background-image: none;
    margin-bottom: 0px;
    margin-top: 100px;
  }
  #project-eit-health .frame-04 img {
    width: 100%;
    display: block;
  }



  #project-eit-health .frame-05 {
    height: auto;
    background-size: 100%;
    background-image: none;
    margin-bottom: 50px;
    margin-top: 100px;
  }
  #project-eit-health .frame-05 img {
    width: 100%;
    display: block;
  }


}

@media (min-width:768px) and (max-width:991px) {
  /*#project-eit-health .frame-01 {*/
  /*height: 750px;*/
  /*}*/


  #project-eit-health .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/eit-health/eit-health-header.jpg") no-repeat scroll 50% 0px / 1280px auto;
    height: 900px;
  }

  #project-eit-health .frame-01 .comp-mac {
    top: auto;
    bottom: -300px;
    -webkit-transform: scale(.9,.9);
    -ms-transform: scale(.9,.9);
    transform: scale(.9,.9);
    width: 1000px;
    left: 50%;
    margin-left: -550px;
    background-size: 100% !important;
  }


  #project-eit-health .frame-01 .comp-mac>div {
    /*content*/
    background-image: url(../img/project/eit-health/eit-health-mac-content.jpg);

    position: absolute;
    width: 548px;
    height: 335px;
    left: 50%;
    margin-left: -214px;
    z-index: 11;
    top: 30px;
  }


  #project-eit-health .frame-02 {
    margin-top: 30px;
  }



}

@media (max-width:440px) {
  #project-eit-health .frame-01 {
    height: 550px;
  }


  #project-eit-health .frame-02 {
    margin-top: 100px;
    padding: 50px 0px;
    height: auto;
  }
}

/************************* VHIR AR 2017 ***************************************/

/* vhir-ar-2017 */
#project-vhir-ar-2017 .frame-01 {
  background: rgba(0, 0, 0, 0) url("../img/project/vhir-ar-2017/vhir-ar-2017-mockup-all.png") no-repeat scroll center 150px / 1200px;
  background-color: #fde8fe;
  /*background-position-y: 100px;*/
  height: 900px;
  color: #000000;
}

#project-vhir-ar-2017.project .comp-ipad {

  position: relative;
  width: 800px;
  height: 550px;
  left: 0;
  margin-top: 130px;
  margin-left: calc(50% - 400px);
  z-index: 11;
  background: url(../img/project/vhir-ar-2017/vhir-ar-2017-ipad-mockup.png) top no-repeat !important;
  background-size: 100% !important;

}

#project-vhir-ar-2017 .frame-02.comp-ipad>div {
  background-image: url(../img/project/vhir-ar-2017/vhir-ar-2017-ipad-content.gif);
  position: absolute;
  width: 620px;
  height: 465px;
  left: 0;
  margin-left: 95px;
  z-index: 11;
  top: 35px;
  background-size: 100%;
}

.slider-control {
  position: relative;
  max-width: 1400px;
  margin: auto;
  top: 200px;
}
@media (max-width:1520px) {
  .slider-control {
    margin-left: 60px;
    margin-right: 60px;
  }
}

#project-vhir-ar-2017 .frame-03 {
  height: 1120px;
  background-size: 1140px;
  background-image: url("../img/project/vhir-ar-2017/vhir-ar-2017-iphone-mockup.jpg");
  margin-top: 150px;
}
#project-vhir-ar-2017 .frame-03 div {
  display: none;
  visibility: hidden;
}

@media screen and (min-width: 1281px) {
  #project-vhir-ar-2017 .frame-01 {
    background: #fde8fe url("../img/project/vhir-ar-2017/vhir-ar-2017-mockup-all.png") no-repeat scroll center 100px / 1440px auto;
    height: 1000px;
  }
  /*background-position-y: 0px;*/
}


/* DESKTOP: 769px to 1280px*/
@media screen and (max-width: 1280px) and (min-width: 769px) {

  #project-vhir-ar-2017 .lg-content {
    display: none;
  }

  #project-vhir-ar-2017 .frame-03 {
    background: none;
    width: 100%;
    height: auto;
    margin-bottom: 300px;
  }

  #project-vhir-ar-2017 .frame-03 div {
    display: block;
    visibility: visible;
  }
  #project-vhir-ar-2017 .frame-03 img {
    width: 100%;
    display: block;
    visibility: visible;
  }

}

@media screen and (max-width: 991px) {

  #project-vhir-ar-2017 .frame-01 {
    background: #fde8fe url("../img/project/vhir-ar-2017/vhir-ar-2017-mockup-all.png") no-repeat scroll center 250px / 1000px auto;
    height: 850px;
  }
  #project-vhir-ar-2017 .frame-03 {
    background: transparent;
  }

  #project-vhir-ar-2017 .frame-03 div {
    display: block;
    visibility: visible;
  }
  #project-vhir-ar-2017 .frame-03 div img {
    width: 100%;
  }

  #project-vhir-ar-2017.project .comp-ipad {
    position: relative;
    width: 700px;
    height: 490px;
    left: 0;
    margin-top: 130px;
    margin-left: calc(50% - 360px);
    z-index: 11;
    background: url(../img/project/vhir-ar-2017/vhir-ar-2017-ipad-mockup.png) top no-repeat !important;
    background-size: auto;
    background-size: 100% !important;
  }
  #project-vhir-ar-2017 .frame-02.comp-ipad > div {
    background-image: url(../img/project/vhir-ar-2017/vhir-ar-2017-ipad-content.gif);
    position: absolute;
    width: 543px;
    height: 406px;
    left: 0;
    margin-left: 83px;
    z-index: 11;
    top: 31px;
    background-size: 100%;
  }
}

@media screen and (device-width: 768px) {
  #project-vhir-ar-2017 .frame-01 {
    /*background: rgba(0, 0, 0, 0) url("../img/project/irta-30-2018/irta-cabecera.jpg") no-repeat scroll center top / 100%;*/
    color: #000000;
  }
  #project-vhir-ar-2017 .frame-03 {
    margin-top: 0px;
    margin-bottom: 200px;
    height: 750px;
  }
  #project-vhir-ar-2017 .lg-content {
    display: none;
  }
}

@media screen and (max-width: 767px) {

  #project-vhir-ar-2017 .frame-01 {
    background: #fde8fe;
    background-position-y: 190px;
    height: auto;

  }

  #project-vhir-ar-2017.project .comp-ipad {
    position: relative;
    width: 300px;
    height: 200px;
    left: 0;
    margin-top: 60px;
    margin-left: calc(50% - 150px);
    z-index: 11;
    background: url(../img/project/vhir-ar-2017/vhir-ar-2017-ipad-mockup.png) top no-repeat !important;
    background-size: auto;
    background-size: 100% !important;
  }
  #project-vhir-ar-2017 .frame-02.comp-ipad > div {
    background-image: url(../img/project/vhir-ar-2017/vhir-ar-2017-ipad-content.gif);
    position: absolute;
    width: 232px;
    height: 175px;
    left: 0;
    margin-left: 36px;
    z-index: 11;
    top: 13px;
    background-size: 100%;
  }

  #project-vhir-ar-2017 .lg-content {
    display: none;
  }

  #project-vhir-ar-2017 .frame-03 {
    margin-top: 60px;
    margin-bottom: 100px;
    height: auto;
  }
}





/* CRG AR 2108 */
#project-crg-ar-2018 .frame-01{
  background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2018/crg-ar-2018-header.jpg") no-repeat scroll center -150px / auto 850px;
  height: 1060px;
}

#project-crg-ar-2018 .frame-01 .comp-mac > div {
  background-image: url("../img/project/crg-ar-2018/crg-ar-2018-imac-content.png");

}
#project-crg-ar-2018 .frame-02 {
  background-image: url("../img/project/crg-ar-2018/crg-ar-2018-mockup-ipad.jpg");
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 1140px;
  height: 760px;
  position: relative;
}
#project-crg-ar-2018 .frame-03 {
  margin-top: 100px;
  background: url("../img/project/crg-ar-2018/crg-ar-2018-iphone-background.png") no-repeat center;
}
#project-crg-ar-2018 .frame-03 div {
  background-image: url("../img/project/crg-ar-2018/crg-ar-2018-mockup-iphone.png");
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 1140px;
  height: 1020px;
  position: relative;
}

#project-crg-ar-2018 .frame-04 {
  margin-top: 100px;
  height: 990px;
  position: relative;
}
#project-crg-ar-2018 .frame-04 {
  padding-bottom: 100px;
  background: url("../img/project/crg-ar-2018/crg-ar-2018-print-report-background.png") center;
}

#project-crg-ar-2018 .frame-04 > div {
  margin-top: 150px;
  background: url("../img/project/crg-ar-2018/crg-ar-2018-print-report-01.png") no-repeat center;
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 1140px;
  height: 860px;
  position: relative;
}
#project-crg-ar-2018 .frame-05 {
  padding-top: 100px;
  margin-bottom: 200px;
  background: url("../img/project/crg-ar-2018/crg-ar-2018-print-report-background.png") center;
}
#project-crg-ar-2018 .frame-05 div {
  background: url("../img/project/crg-ar-2018/crg-ar-2018-print-report-02.png") no-repeat center;
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 1140px;
  height: 860px;
  position: relative;
}


#project-crg-ar-2018 .frame-02 img {
  display: none;
}
#project-crg-ar-2018 .frame-03 img {
  display: none;
}
#project-crg-ar-2018 .frame-04 img {
  display: none;
}
#project-crg-ar-2018 .frame-05 img {
  display: none;
}


/********************/
/* newsletter form */
/*******************/
.privacy_container {
  margin-left: 24px;
  width: 0;
}
.privacy_label {
  font-family: basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: 400;

  position: absolute;
  left: 10px;
  top: 40px;
}
.privacy_label a {
  text-decoration: underline;
}
#privacy.invalid {
  -webkit-box-shadow: 0px 0px 0px 1px rgba(255,0,0,1);
  -moz-box-shadow: 0px 0px 0px 1px rgba(255,0,0,1);
  box-shadow: 0px 0px 0px 1px rgba(255,0,0,1);
}
.invalid-message-group {
  display: none;
}

/* HOME SLIDER CARROUSEL*/
.slider {
  position: relative;
}
#slider {
  position: relative;
  overflow: hidden;
  width: 100% !important;
}
#slider ul {
  position: relative;
  margin: 0;
  padding: 0;
  height: 100vh;
  width: 99999px;
  overflow: hidden;
  list-style: none;
}
#slider ul li {
  position: relative;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
  width: 100vw;
  height: 100vh;
  text-align: center;
}
#slider ul li .slide {
  background-size: cover;
  height: 100vh;
}

.control_prev,
.control_next {
  top: 40%;
  z-index: 10;
  position: absolute;
  display: block;
  margin: 30px auto;
  width: 2em;
  height: 2em;
  
}
.control_prev:focus,
.control_next:focus {
  outline: none;
  /* border: 1px rgba(255, 255, 255, 0.5) solid; */
}
.control_prev:hover,
.control_next:hover {
  /* opacity: 1;
  -webkit-transition: all 0.2s ease; */
}
.control_prev {
  left: -6px;
  /* transform: rotate(-45deg); */
}

.control_next {
  right: -6px;
  /* transform: rotate(135deg); */
}
.arrow {
  cursor: pointer;
  padding: 50px;
  display: inline-block;
  height: 12px;
  /* position: relative; */
  width: 12px;
}
.arrow::after {
  border-bottom-style: solid;
  border-bottom-width: 2px;
  border-right-style: solid;
  border-right-width: 2px;
  content: "";
  display: inline-block;
  height: 30px;
  position: absolute;
  width: 30px;
}
.arrow.is-right {
  -moz-transform: rotate(315deg);
  -ms-transform: rotate(315deg);
  -webkit-transform: rotate(315deg);
  transform: rotate(315deg);
}
.arrow.is-left {
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}
.arrow .arrow::after {
  border-color: red;
}
.arrow .arrow::before {
  background-color: red;
}
.progress {
  position: absolute;
  background: rgba(255, 255, 255, 0.3);
  height: 0.5rem;
  width: 100%;
  bottom: 0;
  border-top: 1px rgba(0, 0, 0, 0.15) solid;
}
.progress .bar {
  height: 100%;
  width: 0%;
  background: #fff;
}

.teaser.container {
  padding-left: 0px ;
  padding-right: 0px ;
}
.teaser {
  position: absolute;
  bottom: 0px;
  text-align: left;
  width: 100%;
  color: #fff;

  max-width: 1400px;
  height: 310px;
  left: 0;
  margin: auto;
  top: auto;
  right: 0;
}
.teaser h2 {
  font-size: 5em;
  text-transform: uppercase;
  line-height: 1.5em;
  color: #fff;
}
.teaser p {
  font-size: 1.3em;
  line-height: 1.3em;
  border-top: 2px #fff solid;
  /* width: 33%; */
  min-width: 25rem;
  margin: 0rem auto;
  /* padding: 1.5rem 0; */
}
.teaser h3 {
  border-bottom: 2px #fff solid;
  /* width: 33%; */
  padding: 1.5rem 0;
  margin: 0rem auto;
  min-width: 25rem;
}
.teaser a {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
/* HOME SLIDER CARROUSEL*/

/* DESKTOP: 769px to 1280px*/
@media screen and (min-width: 1281px) {
  #project-crg-ar-2018 .frame-03 img {
    display: none;
  }
}
@media screen and (max-width: 1280px) {
  #project-crg-ar-2018 .frame-02 {
    background: none;
    height: auto;
    margin-top: 50px;
  }
  #project-crg-ar-2018 .frame-02 img {
    display: block;
    width: 100%;
  }
  #project-crg-ar-2018 .frame-03 > div {
    background-image: none;
    height: auto;
    position: relative;
    background-size: 100%;
    background-repeat: no-repeat;
  }
  #project-crg-ar-2018 .frame-03 {
    height: auto;
  }
  #project-crg-ar-2018 .frame-03 img {
    display: block;
    width: 100%;
  }
  #project-crg-ar-2018 .frame-04 {
    margin-top: 100px;
    height: auto;
  }
  #project-crg-ar-2018 .frame-04 > div {
    background: none;
    height: auto;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
  }

  #project-crg-ar-2018 .frame-04 img {
    display: block;
    width: 100%;
  }

  #project-crg-ar-2018 .frame-05 {
    padding-top: 0px;
    padding-bottom: 100px;
  }
  #project-crg-ar-2018 .frame-05 > div {
    background: none;
    height: auto;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
  }
  #project-crg-ar-2018 .frame-05 img {
    display: block;
    width: 100%;
  }
}


/*IPAD*/
@media screen and (device-width: 768px) {


  #project-crg-ar-2018 .frame-01 {

    background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2018/crg-ar-2018-header.jpg") no-repeat scroll left top / 200%;
    height: 800px;

  }
  #project-crg-ar-2018 .frame-01 .comp-mac{
    width: 580px;
    background-size: 100%;
    margin-left: calc(50% - 290px);
    left: auto;
  }

  #project-crg-ar-2018 .frame-01 .comp-mac div{
    width: 434px;
    height: 245px;
    left: 50%;
    margin-left: -217px;
    top: 93px;
  }
  #project-crg-ar-2018 .frame-02 {
    margin-top: 100px;
  }

  #project-crg-ar-2018 .frame-03 > div {
    background: none;
  }
  #project-crg-ar-2018 .frame-03 img {
    display: block;
    width: 100%;
  }
}


@media screen and (max-width: 767px) {

  .privacy_container {
    margin-left: 0px;
    width: auto;
  }
  .privacy_label {
    font-family: basier,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 400;
  
    position: relative;
    left: 0px;
    top: 00px;
  }
  .privacy_label a {
    text-decoration: underline;
  }

  #project-crg-ar-2018 .frame-01 {
    background: rgba(0, 0, 0, 0) url("../img/project/crg-ar-2018/crg-ar-2018-header.jpg") no-repeat scroll right top / 1000px;
    height: auto;
  }
  #project-crg-ar-2018 .frame-02 {
    margin-top: 50px;
    /*height: 300px;*/
  }
  #project-crg-ar-2018 .frame-01 .comp-mac > div {
    background-size: 235px;
  }
  #project-crg-ar-2018 .frame-03 {
    margin-top: 50px;
  }
  #project-crg-ar-2018 .frame-03 > div {
    background: none;
    height: auto;
  }

  #project-crg-ar-2018 .frame-03 img {
    display: block;
    width: 80%;
    margin: 0px auto;
  }


  #project-crg-ar-2018 .frame-04 {
    height: auto;
    margin-top: 50px;
    padding-bottom: 0px;
  }
  #project-crg-ar-2018 .frame-04 > div {
    background: none;
    height: auto;
    margin-top: 0px;
    padding-top: 50px;
  }
  #project-crg-ar-2018 .frame-04 img {
    display: block;
    width: 100%;
  }

  #project-crg-ar-2018 .frame-05 {
    margin-top: 0px;
    padding-top: 50px;
    padding-bottom: 50px;
    margin-bottom: 100px;
  }


  #project-crg-ar-2018 .frame-05 .comp-ipad > div {
    background-position-y: 90px;
    background-repeat: no-repeat;
    margin-left: calc(50% - 135px);
    margin-top: auto;
    width: 260px;
    height: 437px;
  }

}


/* END Proyectos */

/* Lightbox */
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:url(images/overlay.png) repeat 0 0; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(images/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(images/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}
































/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  z-index: 1000;
}

/* Modal Content/Box */
.modal-content {
  padding: 20px;
  position: relative;
  background-color: #fefefe;
  margin: auto;
  border: 1px solid #888;
  width: 80%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}

.modal-body {padding: 2px 16px;}

.modal-footer {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}