/* ==========================================================================
   Colors
   ========================================================================== */
/* ==========================================================================
   Fonts
   ========================================================================== */
@font-face {
  font-family: 'robotoregular';
  src: url("fonts/Roboto-Regular-webfont.eot");
  src: url("fonts/Roboto-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/Roboto-Regular-webfont.woff") format("woff"), url("fonts/Roboto-Regular-webfont.ttf") format("truetype"), url("fonts/Roboto-Regular-webfont.svg#robotoregular") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'robotomedium';
  src: url("fonts/Roboto-Medium-webfont.eot");
  src: url("fonts/Roboto-Medium-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/Roboto-Medium-webfont.woff") format("woff"), url("fonts/Roboto-Medium-webfont.ttf") format("truetype"), url("fonts/Roboto-Medium-webfont.svg#robotomedium") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'robotolight';
  src: url("fonts/Roboto-Light-webfont.eot");
  src: url("fonts/Roboto-Light-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/Roboto-Light-webfont.woff") format("woff"), url("fonts/Roboto-Light-webfont.ttf") format("truetype"), url("fonts/Roboto-Light-webfont.svg#robotolight") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'robotobold';
  src: url("fonts/Roboto-Bold-webfont.eot");
  src: url("fonts/Roboto-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/Roboto-Bold-webfont.woff") format("woff"), url("fonts/Roboto-Bold-webfont.ttf") format("truetype"), url("fonts/Roboto-Bold-webfont.svg#robotobold") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'robotoitalic';
  src: url("fonts/Roboto-Italic-webfont.eot");
  src: url("fonts/Roboto-Italic-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/Roboto-Italic-webfont.woff") format("woff"), url("fonts/Roboto-Italic-webfont.ttf") format("truetype"), url("fonts/Roboto-Italic-webfont.svg#robotoitalic") format("svg");
  font-weight: normal;
  font-style: normal; }
/* ==========================================================================
   Author's custom styles
   ========================================================================== */
body {
  font-family: robotolight; }

.row {
  margin-left: 0;
  margin-right: 0; }

.vcontainer {
  position: relative; }

.vcenter {
  position: absolute;
  top: 50%;
  transform: translateY(-50%); }

.inverse {
  color: #999999; }

.container {
  max-width: 1200px; }

.nav li {
  cursor: pointer; }

.navbar {
  margin-bottom: 0; }

.homeImg1 {
  position: absolute;
  width: 40%;
  z-index: 0;
  top: 50em;
  left: 10%;
  opacity: 0; }

.homeImg2 {
  position: absolute;
  width: 40%;
  z-index: 1;
  top: 50em;
  left: 40%;
  opacity: 0; }

.homeTitle {
  margin-bottom: 2em; }

.featured {
  padding-top: 0;
  position: relative; }
  .featured .title {
    margin-top: 10em; }
    .featured .title h1 {
      font-size: 4em;
      font-family: robotolight;
      margin-bottom: 0.5em; }
      .featured .title h1 span {
        color: #1DC0DC; }
    .featured .title .btn {
      margin-top: 1em; }

.solutions {
  z-index: 10;
  background-image: url(../img/swirl_pattern_2.png);
  background-color: #1DC0DC;
  padding-top: 5em;
  padding-bottom: 5em; }
  .solutions .solutionsItem {
    text-align: center; }
    .solutions .solutionsItem .icon {
      font-size: 7em; }

.offer {
  background-color: #444;
  padding-top: 5em;
  padding-bottom: 5em; }
  .offer .offerItem {
    margin-bottom: 2em; }
    .offer .offerItem .offerTitle {
      margin-bottom: 1em; }
      .offer .offerItem .offerTitle .offerTitleIcon {
        width: 3em;
        height: 3em;
        background: #1DC0DC;
        padding: 0.10em;
        border-radius: 100%;
        color: white;
        text-align: center; }
        .offer .offerItem .offerTitle .offerTitleIcon .icon {
          font-size: 2em; }
      .offer .offerItem .offerTitle .offerTitleTxt {
        font-family: robotoregular;
        font-size: 1.2em; }
  .offer .centralGfx {
    position: relative; }
    .offer .centralGfx .iphone {
      position: absolute;
      top: -10em;
      z-index: 0;
      width: 80%; }
    .offer .centralGfx .watch {
      position: absolute;
      top: 25em;
      left: 10em;
      z-index: 1;
      width: 70%; }

.method {
  padding-top: 5em;
  padding-bottom: 5em; }

.philosophy {
  padding-top: 5em;
  padding-bottom: 5em;
  background-color: #f0f0f0; }
  .philosophy .homeTitle {
    color: #2B3E50; }
  .philosophy .content {
    display: table; }
    .philosophy .content .iconContainer {
      display: table-cell;
      vertical-align: middle;
      width: 30%;
      text-align: center;
      font-size: 15em;
      color: #1DC0DC; }
    .philosophy .content .texto {
      display: table-cell;
      vertical-align: middle;
      width: 60%;
      font-size: 1.2em;
      color: #2B3E50; }

.recent {
  padding-top: 5em;
  padding-bottom: 5em; }
  .recent .item {
    position: relative;
    padding: 0 !important; }
    .recent .item .itemData {
      position: absolute;
      bottom: 0;
      background: rgba(255, 255, 255, 0.8);
      padding: 1em 0;
      width: 100%;
      opacity: 0;
      height: 10em;
      transition-property: opacity, height;
      transition-duration: 0.3s;
      transition-timing-function: ease out; }
      @media (max-width: 768px) {
        .recent .item .itemData {
          height: 5em;
          opacity: 1;
          padding: 0; } }
      .recent .item .itemData:hover {
        opacity: 1;
        height: 11em; }
      .recent .item .itemData .itemPlatforms {
        font-size: 3.5em;
        color: #2B3E50;
        padding-left: 0.7em; }
        @media (max-width: 768px) {
          .recent .item .itemData .itemPlatforms {
            font-size: 2em; } }
      .recent .item .itemData .itemTitle {
        font-family: robotoregular;
        font-size: 1.5em;
        color: #2B3E50;
        padding: 0 1em;
        line-height: 1em; }
        @media (max-width: 768px) {
          .recent .item .itemData .itemTitle {
            font-size: 1em; } }

.customers {
  background-color: #f0f0f0;
  padding-top: 5em;
  padding-bottom: 5em; }
  .customers .items {
    text-align: center;
    opacity: 0.7; }
    .customers .items .item {
      display: inline-block;
      width: 16%;
      min-width: 150px;
      padding: 1em;
      padding-top: 0;
      vertical-align: middle; }
      .customers .items .item img {
        margin: 1em auto;
        vertical-align: middle; }

.quotation .buttonContainer {
  height: 10em; }

.footer {
  padding-top: 5em;
  padding-bottom: 5em; }
  .footer .social .icon {
    font-size: 2.5em;
    margin-right: 0.5em;
    opacity: 0.5; }
  .footer address .icon {
    font-size: 1.5em;
    margin-right: 0.5em; }

.modal .modal-dialog {
  z-index: 10000; }

@media (min-width: 1200px) {
  .homeImg2 {
    top: 60em; }

  .featured {
    min-height: 800px; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .homeImg2 {
    top: 60em; }

  .featured {
    min-height: 700px; } }
@media (min-width: 768px) and (max-width: 991px) {
  .featured {
    min-height: 600px; } }
@media (max-width: 768px) {
  .philosophy .texto {
    width: 100%; } }

/*# sourceMappingURL=main.css.map */