/*!
 *  
 * Apart 2015
 *  
 * for reinig.lu/
 */
/* @import "reset.less"; */
/*---------------------------------------------------
    LESS Prefixer
  ---------------------------------------------------
    
    All of the CSS3 fun, none of the prefixes!

    As a rule, you can use the CSS properties you
    would expect just by adding a '.':

    box-shadow => .box-shadow(@args)

    Also, when shorthand is available, arguments are
    not parameterized. Learn CSS, not LESS Prefixer.

    -------------------------------------------------
    TABLE OF CONTENTS
    (*) denotes a syntax-sugar helper
    -------------------------------------------------

        .animation(@args)
            .animation-delay(@delay)
            .animation-direction(@direction)
            .animation-duration(@duration)
            .animation-iteration-count(@count)
            .animation-name(@name)
            .animation-play-state(@state)
            .animation-timing-function(@function)
        .background-size(@args)
        .border-radius(@args)
        .box-shadow(@args)
            .inner-shadow(@args) *
        .box-sizing(@args)
            .border-box() *
            .content-box() *
        .columns(@args)
            .column-count(@count)
            .column-gap(@gap)
            .column-rule(@args)
            .column-width(@width)
        .gradient(@default,@start,@stop) *
            .linear-gradient-top(@default,@color1,@stop1,@color2,@stop2,[@color3,@stop3,@color4,@stop4])*
            .linear-gradient-left(@default,@color1,@stop1,@color2,@stop2,[@color3,@stop3,@color4,@stop4])*
        .opacity(@factor)
        .transform(@args)
            .rotate(@deg)
            .scale(@factor)
            .translate(@x,@y)
            .translate3d(@x,@y,@z)
            .translateHardware(@x,@y) *
        .text-shadow(@args)
        .transition(@args)
            .transition-delay(@delay)
            .transition-duration(@duration)
            .transition-property(@property)
            .transition-timing-function(@function)



    Credit to LESS Elements for the motivation and
    to CSS3Please.com for implementation.

    Copyright (c) 2012 Joel Sutherland
    MIT Licensed:
    http://www.opensource.org/licenses/mit-license.php

-----------------------------------------------------*/
/* Animation */
/* Background Size */
/* Border Radius */
/* Box Shadows */
/* Box Sizing */
/* Columns */
/* Gradients */
/* Opacity */
/* Text Shadow */
/* Transforms */
/* Transitions */
html {
  height: 100%;
}
html body {
  margin: 0;
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.6;
  background-color: #000000;
  color: #FFFFFF;
  height: 100%;
}
html body .container-fluid {
  height: 100%;
}
html body .container-fluid .row {
  height: 100%;
}
html body .container-fluid .row .col-sm-6 {
  height: 50%;
  padding: 0px;
}
html body .container-fluid .row .col-sm-6 a {
  height: 100%;
  display: block;
}
html body .container-fluid .row .col-sm-6 a .wrapper {
  overflow: hidden;
  position: absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
  right: 0px;
}
html body .container-fluid .row .col-sm-6 a .wrapper .mhvl,
html body .container-fluid .row .col-sm-6 a .wrapper .villa {
  height: 100%;
  background-repeat: no-repeat;
  text-align: center;
  padding: 40px;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
  background-color: red;
}
html body .container-fluid .row .col-sm-6 a .wrapper .villa {
  background: url("../img/villa.jpg");
  background-size: cover;
  background-position: center center;
}
html body .container-fluid .row .col-sm-6 a .wrapper .mhvl {
  background: url("../img/mhvl.jpg");
  background-size: cover;
  background-position: center center;
}
html body .container-fluid .row .col-sm-6 a .inner {
  position: absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
  right: 0px;
}
html body .container-fluid .row .col-sm-6 a .inner .logo-mhvl {
  position: absolute;
  z-index: 10;
  width: 150px;
  height: auto;
  left: 50%;
  margin-left: -75px;
  top: 50px;
}
html body .container-fluid .row .col-sm-6 a .inner .logo-villa {
  position: absolute;
  z-index: 10;
  width: 100px;
  height: auto;
  left: 50%;
  margin-left: -50px;
  top: 50px;
}
html body .container-fluid .row .col-sm-6 a .inner .fader {
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0px;
  top: 0px;
  background: #000000;
  opacity: .3;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}
html body .container-fluid .row .col-sm-6 a .inner .link {
  position: absolute;
  bottom: 60px;
  left: 0px;
  right: 0px;
  text-align: center;
}
html body .container-fluid .row .col-sm-6 a .inner .link .btn-custom {
  font-size: 14px;
  color: #FFFFFF;
  border: 2px solid #FFFFFF;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  text-transform: uppercase;
  padding: 7px 16px;
  font-weight: 700;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}
html body .container-fluid .row .col-sm-6 a .inner .link .btn-custom .glyphicon {
  margin-left: -14px;
  line-height: 16px;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
  opacity: 0;
  color: #FFFFFF;
}
html body .container-fluid .row .col-sm-6 a .inner .link .btn-custom.no-border {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
}
html body .container-fluid .row .col-sm-6 a:hover .wrapper .villa,
html body .container-fluid .row .col-sm-6 a:hover .wrapper .mhvl {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
}
html body .container-fluid .row .col-sm-6 a:hover .inner .fader {
  opacity: 0;
}
html body .container-fluid .row .col-sm-6 a:hover .inner .link .btn-custom {
  color: #FFFFFF;
}
html body .container-fluid .row .col-sm-6 a:hover .inner .link .btn-custom .glyphicon {
  color: #FFFFFF;
  margin-left: 10px;
  opacity: 1;
}
html body .container-fluid .footer {
  padding: 20px 0px;
  text-align: right;
}
html body .container-fluid .footer .logo-2m {
  width: 240px;
  height: auto;
  margin-bottom: 30px;
}
html body .container-fluid .footer a {
  color: #FFFFFF;
  text-decoration: underline;
}
@media (min-width: 767px) {
  html body .container-fluid .row .col-sm-6 {
    height: 100%;
  }
  html body .container-fluid .footer {
    text-align: center;
  }
}
