body, html {
  padding : 0px;
  margin : 0px;
  background : #fff;
  color : #2a2a2a;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  font-smoothing: antialiased;
  font-smooth: antialiased;
  font-family: open sans;
  font-weight: 300;
  box-sizing : border-box;
}

@font-face { font-family: georgia italic; src: url(fonts/GeorgiaItalic.ttf); }
@font-face { font-family: Brandon regular; src: url(fonts/brandon_re.ttf); }
@font-face { font-family: Brandon bold; src: url(fonts/Brandon_bld.otf); }
@font-face { font-family: Brandon medium; src: url(fonts/Brandon_med.otf); }
@font-face { font-family: miller display italic; src: url(fonts/millerdisplayitalic.ttf); }
@font-face { font-family: mark pro; src: url(fonts/MarkPro.otf); font-weight: 300; }
@font-face { font-family: mark pro; src: url(fonts/MarkPro-Bold.otf); font-weight: 500; }
@font-face { font-family: times new roman; src: url(fonts/Times New Roman.ttf); }

/* @font-face { font-family: Cinzel; src: url(fonts/TrajanPro-Regular.ttf); } */


input:focus, select:focus, textarea:focus, button:focus {
  outline: none;
}

a, a:visited, a:hover, a:active {
  color: inherit;
  text-decoration: none;
}

.clear {
  clear : both;
}

.master-body {
  width : 100%;
  height : 100%;
  max-width : 100%;
  overflow : hidden;

  min-width : 300px;
  position : relative;
  background : #fff;
}

.master-body#index {
  background : ;
}

.master-body#index-home {
  background : #fff;}



/* ----------------- MAIN MENU CSS ---------------- */


.frame-master {
  width : 100%;
  position : relative;
}

.master-body .index-logo {
  position : fixed;
  z-index : 999;
  width : 110px;
  text-align : center;
  left : calc((100% - 150px) / 2);
  padding : 10px 15px;
  background : rgba(255,255,255,0.9);
  top : 0px;
}

.master-body .index-logo img{
  width : 100%;
}


/* ----------------- INDEX CSS ---------------- */


.section-frame {
  position : absolute;
  height: 84vh;
  width: 88vw;
  margin: 8vh 6vw;
  z-index : 1;

  background-size : cover;
  background-position : bottom center;
}

.cd-section .text-overlay {
  font-family : mark pro;
  font-weight : 500;
  position : absolute;
  display : inline-block;
  width : 150px;
  right : 0px;
  bottom : -130px;
}

.cd-section .text-overlay #frame {
  position : relative;
  display : inline-block;
  transform : rotate(-90deg);
  transform-origin: center left;

  visibility : hidden;
}

.cd-section .title-frame-master {
  position : relative;
}

.cd-section .title-frame-master .text-frame {
  position : relative;
}

.cd-section .title-frame-master .title-big, 
.cd-section .title-frame-master .title-big-beranda{
  font-family : mark pro;
  display : inline;
  font-weight : 500;
}

.cd-section .title-frame-master .title-big #roman-info{
  font-family : times new roman;
  font-style : italic;
  font-size : 17px;
  font-weight : 300;
  position : absolute;
  line-height : 100%;
}

.cd-section .title-frame-master .desc{
  position : relative;
  font-family : open sans;
  font-weight : 500;
  font-size: 14px;
  line-height: 160%;
}

.cd-section .title-frame-master .line-frame {
  float : left;
  margin : 0 20px;
}

.cd-section .title-frame-master .line-frame .line{
  height : 4px;
  background : #54b0ff;
}


.cd-section .explore-frame{
  position : relative;
}

.cd-section .explore-frame .explore-button{
  background : #2d3033;
  padding : 14px 25px;
  font-family : brandon regular;
  text-transform : uppercase;
  letter-spacing : 3px;
  font-size : 13px;
  color : #fff;
  cursor : pointer;
  transition: all 400ms cubic-bezier(0.86, 0, 0.07, 1); 
}

.cd-section .explore-frame i{
  margin-right : 5px;

  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
}

.cd-section .explore-frame .explore-button span{
  font-family : brandon bold;
  display : inline-block;
  transition: all 700ms cubic-bezier(0.86, 0, 0.07, 1); 
}

.cd-section .explore-frame .explore-button:hover span{
  transform: translate(5px, 0px);
}

.cd-section:hover .explore-frame .explore-button i{
  -webkit-animation-name: bounce;
  animation-name: bounce;
}

@-webkit-keyframes bounce {
  0%, 100% {
    -webkit-transform: translateX(0);
  }
  50% {
    -webkit-transform: translateX(-5px);
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(-5px);
  }
}


@-webkit-keyframes bounce2 {
  0%, 100% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-5px);
  }
}
@keyframes bounce2 {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

/*
@media only screen and (min-width: 1100px) {

  .cd-section .text-overlay {
    opacity : 0;
    transform: translateY(-40px);
    transition : all .8s ease-in-out;
  }
  .visible.cd-section .text-overlay {
    opacity : 1;
    transform: translateY(0px);
    transition-delay: 0.4s;
  }

  .cd-section .explore-frame {
    opacity : 0;
    transform: translateX(-40px);
    transition : all .8s ease-in-out;
  }
  .visible.cd-section  .explore-frame {
    opacity : 1;
    transform: translateX(0px);
    transition-delay: 0.6s;
  }

  .cd-section .title-frame-master .title-big{
    opacity : 0;
    transform: translateY(-40px);
    transition : all .8s ease-in-out;
  }
  .visible.cd-section .title-frame-master .title-big {
    opacity : 1;
    transform: translateY(0px);
    transition-delay: 0.8s;
  }
  .cd-section .title-frame-master .title-big #roman-info{
    opacity : 0;
    transform: translateX(-40px);
    transition : all .8s ease-in-out;
  }
  .visible.cd-section .title-frame-master .title-big #roman-info{
    opacity : 1;
    transform: translateX(0px);
    transition-delay: 1s;
  }

  .cd-section .title-frame-master .desc {
    opacity : 0;
    transform: translateX(40px);
    transition : all .8s ease-in-out;
  }
  .visible.cd-section  .title-frame-master .desc{
    opacity : 1;
    transform: translateX(0px);
    transition-delay: 1.2s;
  }

  .cd-section .title-frame-master .desc::after {
    opacity : 0;
    transform: translateX(-100px);
    transition : all .8s ease-in-out;
  }
  .visible.cd-section  .title-frame-master .desc::after{
    opacity : 1;
    transform: translateX(0px);
    transition-delay: 1.2s;
  }
  .cd-section .prolog-frame {
    opacity : 0;
    transform: translateY(40px);
    transition : all .8s ease-in-out;
  }
  .visible.cd-section .prolog-frame {
    opacity : 1;
    transform: translateY(0px);
    transition-delay: 0.4s;
  }
  .visible.picture-frame#prolog{
    opacity : 1;
    transform: scale(1.1);
    transition : all 5s linear;
  }

}

*/


/* B E R A N D A */

/*
.cd-scroll-down {
  position: absolute;
  left : 50%;
  right: auto;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: 0px;
  width : 140px;
  padding : 15px 20px;
  font-family : brandon bold;
  text-transform : uppercase;
  letter-spacing : 2px;
  font-size : 11px;
  text-align : center;
}

.cd-scroll-down i{
  margin-top : 10px;
  -webkit-animation-name: bounce2;
  animation-name: bounce2;
  -webkit-animation-duration: 1.2s;
  animation-duration: 1.2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
}
*/

.cd-section .text-overlay#beranda {
  right : 0%;
  color : rgba(29,178,255,0.5);
  font-size : 166px;
  user-select: none;
}

.cd-section .picture-frame{
  max-width : 100%;
  min-width : 100%;
  height : 100%;
  position : absolute;
  overflow : hidden;
  top : 0;
  left : 0;
  z-index : 0;
  opacity : 1;
  transition : all .4s ease-in-out;
}

.cd-section .picture-frame video {

  width : 100%;
  margin-top : 0vh;
  z-index : 1;
}

.cd-section .visible .picture-frame {
  opacity : 1;
  transition : all .8s ease-in-out;
}

.cd-section .title-frame-master#beranda {
  position : absolute;
  width : calc(100%);
  margin-top : 30vh;
  user-select: none;
}

.cd-section .title-frame-master#beranda .text-frame{
  float : left;
  width : 510px;
  margin-left : -16px;
  color : #2d3033;
}

.cd-section .title-frame-master#beranda .text-frame .text-small{
  font-family : mark pro;
  letter-spacing : -1.5px;
  font-weight : 300;
  font-size : 32px;
}

.cd-section .title-frame-master#beranda .text-frame .text-small#top{
  margin-left : 50px;
  float : left;
}

.cd-section .title-frame-master#beranda .text-frame .text-small#bottom{
  margin-top : 20px;
  margin-left : 50px;
  line-height : 90%;
  float : left;
}

.cd-section .title-frame-master#beranda .text-frame .text-small#bottom #pgnmas{
  font-size : 22px;
  display : inline;
}
.cd-section .title-frame-master#beranda .text-frame .text-small#bottom #pgnmas span{
  color : #54b0ff;
}


.cd-section .title-frame-master#beranda .title-big-beranda{
  font-size : 70px;
  line-height : 80%;
}

.cd-section .title-frame-master#beranda .line-frame .line {
  width : 100px;
  margin-top : 70px;
}


.cd-section .title-frame-master#beranda .explore-frame{
  float : right;
  margin-top : 60px;
  margin-right : -6vw;
}

.cd-section .title-frame-master#beranda .explore-frame:hover{
  float : right;
  margin-top : 60px;
  margin-right : -6vw;
}

.cd-section .title-frame-master#beranda .explore-frame .explore-button{
  padding-right : 12vh;
  margin-right : 12vh;
}

.cd-section:hover .title-frame-master#beranda .explore-frame .explore-button:hover{
  transform: translate(-20px, 0px);
  box-shadow : 0 10px 35px rgba(29,178,255,0.5);
}
.cd-section:hover .title-frame-master#beranda .explore-frame .explore-button{
  transform: translate(-20px, 0px);
}

.cd-section .title-frame-master#beranda .explore-frame .explore-button span{
  color : #54b0ff;
}


/* P R O L O G */

.cd-section .picture-frame#prolog {
  background-image : url(images/home-transparent-bg.png);
  background-position: bottom center;
  background-size: cover;
}

.cd-section .prolog-frame{
  position : relative;
  min-width : 600px;
  width : 60%;
  margin : 0 auto;
  margin-top : 20vh;
  color : #2d3033;
}

.cd-section .prolog-frame #center-content {
  position : relative;
  text-align : justify;
  font-family : mark pro;
  font-size : 17px;
  line-height : 180%;
}

.cd-section .picture-frame#prolog {
  margin-top : 0px;
  transition : all .4s ease-in-out;
}

.cd-section .visible .picture-frame2 {
  opacity : 1;
  transition : all .8s ease-in-out;
}



/* L I V I N G */

.cd-section#section3 .section-frame{
  background-image : url(images/index-bg2.jpg);
}
.cd-section#section4 .section-frame{
  background-image : url(images/index-bg3.jpg);
  background-position : center center;
}
.cd-section#section5 .section-frame{
  background-image : url(images/index-bg4.jpg);
}
.cd-section#section6 .section-frame{
  background-image : url(images/index-bg6.jpg);
}
.cd-section#section8 .section-frame{
  background-image : ;
}


.cd-section .text-overlay#living {
  bottom : -120px;
  left : 20%;
  color : rgba(222,259,39,0.5);
  font-size : 160px;
}

.cd-section .title-frame-master#living {
  position : absolute;
  width : calc(400px);
  color : #fff;
  top : 36vh;
  right : 20px;
}

.cd-section .title-frame-master#living .title-big{
  font-size : 115px;
  margin-left : 10px;
  color : #Fff;
  line-height : 80%;
}

.cd-section .title-frame-master#living #roman-info{
  top : 0px;
  right : 50px;
}

.cd-section .title-frame-master#living .desc{
  margin-top : 20px;
  width : 250px;
  float : right;
  margin-right : 100px;
}
.cd-section .title-frame-master#living .desc::after{
  content : '';
  position : absolute;
  left : -160px;
  top : 35px;
  width : 140px;
  height : 5px;
  background : #54b0ff;
}

.cd-section .explore-frame#living{
  position : absolute;
  margin-top : 22vh;
  margin-left : -6vw;
}

.cd-section .explore-frame#living .explore-button{
  padding-left : 18vh;
}

.cd-section:hover .explore-frame#living .explore-button:hover{
  transform: translate(20px, 0px);
  box-shadow : 0 10px 35px rgba(222,259,39,0.6);
}
.cd-section:hover .explore-frame#living .explore-button{
  transform: translate(20px, 0px);
}

.cd-section .explore-frame#living .explore-button span{
  color : #deff27;
}



/* W E L L N E S S */


.cd-section .text-overlay#wellness {
  bottom : -120px;
  right : -8.5vw;
  color : rgba(255,234,0,0.5);
  font-size : 142px;
}

.cd-section .title-frame-master#wellness {
  position : absolute;
  width : 90%;
  color : #fff;
  bottom : 14vh;
  left : 6%;
}

.cd-section .title-frame-master#wellness .title-big{
  font-size : 106px;
  margin-left : 0px;
  color : #Fff;
  line-height : 80%;
}

.cd-section .title-frame-master#wellness #roman-info{
  top : -5px;
  left : 240px;
}

.cd-section .title-frame-master#wellness .desc{
  margin-top : 20px;
  width : 380px;
  float : right;
  font-weight : 500;
  font-size : 15px;
  padding-right : 60px;
  color : #2a2a2a;
  padding : 20px;
  background : rgba(255,255,255,.8);
}

.cd-section .title-frame-master#wellness .desc::after{
  content : '';
  position : absolute;
  left : -70px;
  top : 32px;
  width : 50px;
  height : 5px;
  background : #54b0ff;
}

.cd-section .explore-frame#wellness{
  position : absolute;
  bottom : -20px;
  right : calc(6vw + 180px);
}

.cd-section .explore-frame#wellness .explore-button{
  padding : 32px 30px;
}

.cd-section:hover .explore-frame#wellness .explore-button:hover{
  transform: translate(20px, 0px);
  box-shadow : 0 10px 45px rgba(255,234,0,0.6);
}
.cd-section:hover .explore-frame#wellness .explore-button{
  transform: translate(20px, 0px);
}

.cd-section .explore-frame#wellness .explore-button span{
  color : #fff21a;
}


/* I N S P I R A T I O N */


.cd-section .text-overlay#inspiration {
  bottom : -90px;
  right : 0;
  color : rgba(39,255,217,0.5);
  font-size : 110px;
}

.cd-section .title-frame-master#inspiration {
  position : absolute;
  width : 600px;
  color : #2e3338;
  top : 26vh;
  left : 14vw;
}

.cd-section .title-frame-master#inspiration .title-big{
  font-size : 100px;
  margin-left : -20px;
  line-height : 80%;
}

.cd-section .title-frame-master#inspiration #roman-info{
  top : -5px;
  right : 200px;
}

.cd-section .title-frame-master#inspiration .desc{
  margin-top : 20px;
  width : 380px;
  float : right;
  font-weight : 500;
  font-size : 15px;
  padding-right : 0px;
}

.cd-section .title-frame-master#inspiration .desc::after{
  content : '';
  position : absolute;
  left : -100px;
  top : 32px;
  width : 80px;
  height : 5px;
  background : #54b0ff;
}

.cd-section .explore-frame#inspiration{
  position : absolute;
  bottom : 15vh;
  right : -6vw;
}

.cd-section .explore-frame#inspiration .explore-button{
  padding-right : 11vw;
}

.cd-section:hover .explore-frame#inspiration .explore-button:hover{
  transform: translate(20px, 0px);
  box-shadow : 0 10px 45px rgba(39,255,217,0.6);
}
.cd-section:hover .explore-frame#inspiration .explore-button{
  transform: translate(20px, 0px);
}

.cd-section .explore-frame#inspiration .explore-button span{
  color : #3cffd5;
}

/* S O C I A L */


.cd-section .text-overlay#social {
  bottom : -90px;
  right : 0;
  color : rgba(39,255,217,0.5);
  font-size : 110px;
}

.cd-section .title-frame-master#social {
  position : absolute;
  width : 600px;
  color : #2a2a2a;
  top : 26vh;
  right : 5vw;
}

.cd-section .title-frame-master#social .title-big{
  font-size : 100px;
  margin-left : 100px;
  line-height : 80%;
}

.cd-section .title-frame-master#social #roman-info{
  top : -20px;
  left : 160px;
}

.cd-section .title-frame-master#social .desc{
  margin-top : 20px;
  width : 500px;
  float : right;
  font-weight : 500;
  font-size : 15px;
  padding-right : 0px;
  padding : 20px;
  background : rgba(255,255,255,.8);
  color : #2a2a2a;
  font-weight : 500;
}

.cd-section .title-frame-master#social .desc::after{
  content : '';
  position : absolute;
  left : -100px;
  top : 32px;
  width : 80px;
  height : 5px;
  background : #54b0ff;
}

.cd-section .explore-frame#social{
  position : absolute;
  bottom : 15vh;
  right : -6vw;
}

.cd-section .explore-frame#social{
  position : absolute;
  bottom : -20px;
  right : calc(12vw + 180px);
}

.cd-section .explore-frame#social .explore-button{
  padding : 32px 30px;
}

.cd-section:hover .explore-frame#social .explore-button:hover{
  transform: translate(20px, 0px);
  box-shadow : 0 10px 45px rgba(255,234,0,0.6);
}
.cd-section:hover .explore-frame#social .explore-button{
  transform: translate(20px, 0px);
}

.cd-section .explore-frame#social .explore-button span{
  color : #fff21a;
}



/* A N D R A - M A T I N */


.cd-section .text-overlay#andra-matin {
  bottom : -100px;
  left : 9vh;
  color : rgba(255,255,255,0.5);
  line-height : 70%;
  font-size : 135px;
}

.cd-section .title-frame-master#andra-matin {
  position : absolute;
  width : 400px;
  color : #fff;
  top : 24vh;
  right : 0vw;
}

.cd-section .title-frame-master#andra-matin .title-big{
  font-size : 100px;
  line-height : 80%;
  text-align : left;
}

.cd-section .title-frame-master#andra-matin #roman-info{
  top : -5px;
  left : 0px;
}

.cd-section .title-frame-master#andra-matin .desc{
  margin-top : 20px;
  width : 70%;
  margin-left : 20%;
  float : left;
  font-weight : 500;
  font-size : 15px;
}

.cd-section .title-frame-master#andra-matin .desc::after{
  content : '';
  position : absolute;
  left : -120px;
  top : 34px;
  width : 100px;
  height : 5px;
  background : #54b0ff;
}



/* T I P E  -  R U M A H */


.cd-section .section-frame#tipe-rumah {
  
}

.cd-section .section-frame#tipe-rumah #title {
  font-size: 25px;
  font-weight: 300;
  ;
  float: left;
  margin-top : 10vh;
  margin-left: 5%;
  z-index: 1;
  position: relative;
}

.cd-section .section-frame#tipe-rumah #title::after {
  content: '';
  position: absolute;
  right: -140px;
  top: 52px;
  width: 100px;
  height: 4px;
  background: #54b0ff;
}

.cd-section .section-frame#tipe-rumah #box-master {
  position : relative;
  height : 50vh;
  width : 100%;
  margin : 0 auto;
  padding-top : 50px;
}

.cd-section .section-frame#tipe-rumah #box-master #box{
  width : 20%;
  height : 100%;
  margin : 0 2vw;
  position : relative;
  float : left; 
  transition : all .4s ease-in-out;
  cursor : pointer;
}

.cd-section .section-frame#tipe-rumah #box-master #box:nth-child(odd){
  margin-top : 60px;
}


.cd-section .section-frame#tipe-rumah #box-master #box:hover #shadow{
  box-shadow : 0 15px 30px rgba(57,122,169,0.4);
  transform : translateY(-15px);
  transition : all .4s ease-in-out;
}

.cd-section .section-frame#tipe-rumah #box-master #box:hover #image{
  transform : scale(1.05);
  transition : all .2s ease-in-out;
}

.cd-section .section-frame#tipe-rumah #box-master #box #shadow{
  width : 100%;
  height : 100%;
  overflow : hidden;
  position : relative;
  transition : all .4s ease-in-out;
}

.cd-section .section-frame#tipe-rumah #box-master #box #image{
  width : 100%;
  height : 100%;
  position : relative;
  background-size : cover;
  background-position : center center;
  transition : all .4s ease-in-out;
}

.cd-section .section-frame#tipe-rumah #box-master #box:nth-child(1) #image {
  background-image : url(images/index-box-type-tanagi.jpg);
}
.cd-section .section-frame#tipe-rumah #box-master #box:nth-child(2) #image {
  background-image : url(images/index-box-type-banu.jpg);
}
.cd-section .section-frame#tipe-rumah #box-master #box:nth-child(3) #image {
  background-image : url(images/index-box-type-anila.jpg);
}
.cd-section .section-frame#tipe-rumah #box-master #box:nth-child(4) #image {
  background-image : url(images/index-box-type-adanu.jpg);
}

.cd-section .section-frame#tipe-rumah #box-master #box #content{
  font-size : 15px;
  margin-top : 20px;
  font-family : brandon regular;
  letter-spacing : 2px;
  text-transform : uppercase;
}


.master-body#index-home .footer-master {
  margin-top : 200px;
}

.cd-section #location #right {
  width : 60vw;
  float : right;
  text-align : right;
}
.cd-section #location #right img{
  width : 95%;
}
.cd-section #location #left {
  width : 30vw;
  float : left;
  position : relative;
}
.cd-section #location #left #text{
  position : absolute;
  width : 100%;
  top : 300px;
  text-align : right;
  line-height: 180%;
  font-size: 25px;
  font-family : mark pro;
}

.site-plan-overlay {
  position : fixed;
  top : 0;
  left : 0;
  z-index : 99;
  background : #fff;
  width : 100%;
  height : 85vh;
  opacity : 0;
  padding : 7.5vh 0;
  text-align : center;
  visibility : hidden;
  transform : scale(0.8);
  transition : all .4s ease-in-out;
}

.site-plan-overlay img{
  height : 100%;
}

.site-plan-overlay i{
  position : absolute;
  right : 200px;
  top : 50px;
  cursor : pointer;
  font-size : 30px;
}

.site-plan-overlay.active {
  visibility : visible;
  transform : scale(1);
  opacity : 1;
  transition : all .32 ease-in-out;
}

.site-overplan-trigger {
  cursor : pointer;
}

/* ----------------- END INDEX CSS ---------------- */






.frame-master#index-header{
  margin-top : 0px;
}

.frame-master#index-header #image-background{
  width : calc(100%);
  height : calc(110vh);
  position : relative;
  float : left;
  right : 0px;
  top : 0px;
  background : url(images/index-background-1.jpg);
  background-position : center;
  background-size : cover;
  z-index : 1;
}

.frame-master#index-header #image-background #fade{
  position : absolute;
  bottom : 0px;
  left : 0px;
  z-index : 2;
  width : 100%;
  height : 300px;
}

.frame-master#index-header #text{
  position : absolute;
  right : 0;
  top : 32%;
  width : 600px;
  margin-top : 0%;
  z-index : 2;
  font-family : nunito;
}

.frame-master#index-header #text #big{
  font-weight : 300;
  font-size : 50px;
  width : 100%;
  line-height : 115%;
}

.frame-master#index-header #text #line{
  width : 100%;
  height : 4px;
  display : inline-block;
  background : #54b0ff;
}

.frame-master#index-header #text #small{
  font-size : 16px;
  padding-top : 10px;
  letter-spacing : 8px;
  font-family : brandon bold;
  text-transform : uppercase;
}

.master-body#index #trigger-frame{
  position : absolute;
  z-index : 999;
  top : 50px;
  left: 50px;
  width : 200px;
  height : 70px;
}

.master-body#index #trigger-frame #menu-trigger{
  float : left;
  padding : 22px 30px;
}

.master-body#index #trigger-frame #menu-trigger{
  text-align : center;
}

.master-body#index #trigger-frame #menu-trigger #text{
  float : left;
  margin-left : 10px;
  margin-top : 8px;
  font-weight : 300;
  font-family: mark pro;
  font-size : 12px;
  letter-spacing : 2px;
  text-transform : uppercase;
}

.master-body#index #trigger-frame #menu-trigger #icon{
  width : 22px;
  height : 25px;
  float : left;
}

.master-body#index #trigger-frame #menu-trigger #iconi{
  font-size : 18px;
  float : center;
  line-height : 170%;
}


.master-body#index #trigger-frame #logo{
  float : left;
  width : 120px;
  position : relative;
}

.master-body#index #trigger-frame #logo img{
  width : 100%;
}

.frame-master#index-2 {
  z-index : 2;
  background-image : ;
  background-position : top;
  background-size : 100%;
  background-repeat : no-repeat;
  padding-top : 150px;
}

.frame-master#index-2 #content-1{
  width : 650px;
  margin : 0 auto;
  padding : 0px;
  margin-top : 0px;
  font-family : nunito;
  font-size : 16px;
}

.frame-master#index-2 #content-1 #title{
  font-size : 36px;
  line-height : 120%;
  padding-bottom : 40px;
  width : 500px;
}

.frame-master#index-2 #content-1 #text-big{
  font-weight : 700;
  display :;
  padding :;
}

.frame-master#index-2 #content-2{
  width : 48%;
  margin-top : 150px;
  float : left;
}

.frame-master#index-2 #content-2 img{
  width : 100%;
}

.frame-master#index-2 #content-2 #title{
  bottom : 100px;
  left : 44%;
  width : 400px;
  position : absolute;
}

.frame-master#index-2 #content-2 #title #line{
  width : 140px;
  height : 4px;
  background : #54b0ff;
  position : relative;
  float : left;
  margin-right : 20px;
  margin-top : 10px;
}

.frame-master#index-2 #content-2 #title #text{
  width : 200px;
  float : left;
  font-family : nunito;
  font-weight : 300;
  text-transform : ;
  letter-spacing : 2px;
  text-align : left;
}


.frame-master#index-2 #content-3{
  width : 50%;
  margin-top : 180px;
  float : right;
  position : relative;
}

.frame-master#index-2 #content-3 img:after{
  position : absolute;
  content : '';
  top : -300px;
  width : 4px;
  height : 500px;
  background : #54b0ff;
}


.frame-master#index-2 #content-3 #inner{
  width : 70%;
  margin : 0 auto;
  position : relative;
  font-family : nunito;
  font-size : 18px;
  line-height : 170%;
  font-weight : 300;
}

.frame-master#index-2 #content-3 #slider{
  width : 100%;
  position : relative;
  margin-top : 200px;
  margin-bottom : 50px;
}

.frame-master#index-2 #content-3 #slider ul{
  margin : 0;
  padding : 0;
}

.frame-master#index-2 #content-3 #slider img{
  width : 100%;
}

.frame-master#index-2 #content-3 #slider ul li{
  margin-bottom : 40px;
}


.frame-master#index-3{
  margin-top : 0px;
  height : 820px;
}

.frame-master#index-3 #background{
  width : 100%;
  position : absolute;
  bottom : 0;
  left : 0;
  height : 130vh;
  background-position : center;
  background-image : url(images/index-frame3-pict.jpg);
  background-repeat : no-repeat;
  background-size : 100%;
}

.frame-master#index-3 #content-1{
  width : 700px;
  margin : 0 auto;
  padding-top : 160px;
  position : relative;
  font-family : nunito;
  text-align : center;
}

.frame-master#index-3 #content-1 #big{   
  font-weight : 300;
  letter-spacing : 0px;
  padding-bottom : 30px;
  font-size : 38px;
}

.frame-master#index-3 #content-1 #small{   
  font-size : 18px;
}

.frame-master#index-4 {   
  margin-top : 100px;
  font-family : nunito;
}

.frame-master#index-4 #content-1{   
  width : 400px;
  position : relative;
  float : left;
  padding-top : 100px;
  margin-left : 10%;
  z-index : 2;
}

.frame-master#index-4 #content-1 #text{
  position : relative;
  font-size : 30px;
  margin-bottom : 40px;
}   

.frame-master#index-4 #content-1 #text:after{   
  position : absolute;
  content : '';
  left : -220px;
  width : 200px;
  height : 4px;
  top : 17px;
  background : #54b0ff;
}

.frame-master#index-4 #content-1 #desc{
  margin-left : -40px;
  width : 120%;
  padding : 40px;
  font-size : 16px;
  line-height : 160%;
  background : #464648;
  color : #Fff;
}   


.frame-master#index-4 #content-2{   
  float : left;
  margin : ;
  width : 50%;
  position : relative;
}

.frame-master#index-4 #content-2 img{   
  width : 100%;
}

.frame-master#index-4 #content-3{   
  float : left;
  margin : ;
  width : 400px;
  position : relative;
  margin-top : 100px;
  margin-left : 10%;
}

.frame-master#index-4 #content-3 ul{   
  margin : 0;
  padding : 0;
}

.frame-master#index-4 #content-3 img{   
  width : 100%;
}

.frame-master#index-4 #content-4 {   
  float : left;
  width : 400px;
  margin-top : 250px;
  margin-left : 100px;
  background : #fff;
  position : relative;
  z-index : 2;
  line-height : 180%;
  font-size : 18px;
}

.frame-master#index-4 #content-5 {   
  float : right;
  margin-top : 100px;
  width : 50%;
  z-index : 1;
  position : relative;
}

.frame-master#index-4 #content-5 img {   
  width : 100%;
}

.frame-master#index-4 #content-3 ul li {   
  margin-right : 40px;
}


.frame-master#index-4 #content-5 #title{
  bottom : 150px;
  left : -300px;
  width : 400px;
  position : absolute;
}

.frame-master#index-4 #content-5 #title #line{
  width : 140px;
  height : 4px;
  background : #54b0ff;
  position : relative;
  float : left;
  margin-right : 20px;
  margin-top : 10px;
}

.frame-master#index-4 #content-5 #title #text{
  width : 200px;
  float : left;
  font-family : nunito;
  font-weight : 300;
  text-transform : ;
  letter-spacing : 2px;
  text-align : left;
}

.frame-master#map-type {
  margin-top : 100px;
  margin-bottom : 100px;
  font-family : nunito;
}

.frame-master#map-type #content-1 {
  width : 80%;
  margin : 0 auto;
  position : relative;
  font-family : nunito;
  margin-bottom : 50px;
}

.frame-master#map-type #content-1 img{
  width : 60%
}


.frame-master#map-type #content-1 #text{
  width : 450px;
  top : 200px;
  position : absolute;
  right : 0%;
  font-size : 18px;
  line-height: 170%;
}

.frame-master#map-type #content-1 #text #big{
  padding-bottom : 38px;
  font-size : 30px;
  line-height: 140%;
  position : relative;
  width : 90%;
}

.frame-master#map-type #content-1 #text #big:after{
  position : absolute;
  background : #54b0ff;
  width : 80px;
  height : 5px;
  left : -120px;
  content : '';
  top : 26%;
}

.frame-master#map-type #content-1 #type-box{
  margin-top : 50px;
  font-size : 16px;
}

.frame-master#map-type #content-1 #type-box .box{
  width : 15px;
  height : 15px;
  margin-left : 20px;
  margin-right : 10px;
  margin-top : 10px;
  display : inline-block;
  position : relative;
}

.frame-master#map-type #content-1 #type-box .box#tanagi{
  background-color : #d88c50;
}
.frame-master#map-type #content-1 #type-box .box#banu{
  background-color : #cd4643;
}
.frame-master#map-type #content-1 #type-box .box#anila{
  background-color : #ca69a6;
}
.frame-master#map-type #content-1 #type-box .box#adanu{
  background-color : #e3e355;
}
.frame-master#map-type #content-1 #type-box .box#fasos{
  background-color : #54a05f;
}



.frame-master#index-5 {
  margin-top : 50px;
  font-family : nunito;

}

.frame-master#index-5 #content-1 {
  width : 80%;
  margin : 0 auto;
  font-size : 35px;
  font-family : nunito;
  margin-bottom : 50px;
}

.frame-master#index-5 #content-2 {
  width : 80%;
  margin : 0 auto;
}

.frame-master#index-5 #content-2 img{
  width : 100%;
  z-index : 1;
}

.frame-master#index-5 #content-2 #title{
  width : 200px;
  float : left;
  font-family : nunito;
  font-weight : 300;
  padding-top : 80px;
  border-right : 4px solid #54b0ff;
  letter-spacing : 2px;
  margin-top : -40px;
  margin-left : 10%;
  z-index : 2;
  position : relative;
}

.frame-master#index-5 #content-2 #desc{
  width : 400px;
  position : relative;
  line-height : 160%;
  float : right;
  margin-top : 40px;
  margin-right : 40px;
  padding : 40px;
  z-index : 2;
}

.frame-master#index-6 {
  margin-top : 200px;
  height : 850px;
  font-family : nunito;
}

.frame-master#index-6 #content-1{
  font-size : 38px;
  font-weight : 300;
  width : 700px;
  float : left;
  margin-left : 15%;
  z-index : 1;
  position : relative;
  margin-top : -100px;
}

.frame-master#index-6 #content-2{
  font-size : 16px;
  width : 40%;
  float : left;
  margin-left : 15%;
  z-index : 1;
  position : relative;
  margin-top : 50px;
}

.frame-master#index-6 #background{
   width : 100%;
  position : absolute;
  bottom : 0;
  left : 0;
  height : 1000px;
  background-position : center;
  background-image : url(images/footer.jpg);
  background-repeat : no-repeat;
  background-size : 100%;
  z-index : 0;
}

.frame-master#index-7 {
  width : 100%;
  padding-top : 100px;
  padding-bottom : 100px;
}

.frame-master#index-7 #content-1{
  margin-left : 10%;
  width : 80%;
  position : relative;
  height : 500px;
}

.frame-master#index-7 #content-1 #map{
  width : 100%;
  height : 100%;
}

.frame-master#index-7 #content-1 #title{
  width : 160px;
  font-family : nunito;
  font-weight : 300;
  padding-bottom : 70px;
  border-right : 4px solid #54b0ff;
  letter-spacing : 2px;
  top : -50px;
  right : 100px;
  z-index : 2;
  position : absolute;
}

.frame-master#index-7 #content-2{
  margin-left : 10%;
  margin-top : 40px;
  width : 80%;
  position : relative;
  float : left;
  font-family : nunito;
}

.frame-master#index-7 #content-2 #box {
  float : left;
  width : ;
  margin-right : 2%;
  font-size : 18px;
}

.frame-master#index-7 #content-2 #box:nth-child(3) {
  width : 400px;
}

.frame-master#index-7 #content-2 #padding{
  padding : 40px;
}

.frame-master#index-7 #content-2 #padding #icon{
  font-size : 25px;
  padding-bottom : 30px;
}

.frame-master#index-7 #content-2 #box a {
  color : #54b0ff;
  background : #;
}



/* ----------------------------------------------- */
/* ------------- F O O T E R R R ----------------- */
/* ----------------------------------------------- */


.footer-master {
  width : 100%;
  position : relative;
}

.footer-master .inside {
  width : calc(85% - 20px);
  background : #dee4ea;
  color : #;
  float : right;
  padding : 80px 0px;
  padding-bottom : 0;
}

.footer-master .inside .box{
  float : left;
  position :relative;
}
.footer-master .inside .box:first-child{
  width : 18%;
}
.footer-master .inside .box:nth-child(2),
.footer-master .inside .box:nth-child(3){
  width : 25%;
}
.footer-master .inside .box:nth-child(4){
  width : calc(32% - 50px);
  padding-right : 50px;
}

.footer-master .inside .box #center{
  line-height : 160%;
  font-family : open sans;
  font-weight : 300;
  font-size : 18px;
  margin : 0 auto;
  text-align : left;
}

.footer-master .inside .box:nth-child(1){
  font-family : brandon bold;
  letter-spacing : 2px;
  text-transform : uppercase;
  font-size : 11px;
}

.footer-master .inside .box:nth-child(1) #pull{
  margin-top : 10px;
  margin-left : -120px;
  padding-right : 120px;
  position : relative;
}

.footer-master .inside .box:nth-child(1) img{
  padding : 0px;
  border-radius : 0px;
  box-shadow : 0 10px 25px rgba(22,22,22,0.2);
  background : #fff;
  width : 240px;
  margin-top : 10px;
}

.footer-master .inside .box:nth-child(4){
  font-family : ;
  font-weight : 500;
  font-size : 18px;
  text-align : ;

  font-family : mark pro;
  font-weight : 300;
}

.footer-master .inside .box:nth-child(4) #email-box{
  position :relative;
  margin-top : 20px;
  background : #eef2f5;
}

.footer-master .inside .box:nth-child(4) #email-box input{
  position :relative;
  margin-top : 0px;
  background : #eef2f5;
  border: none;
  font-size : 18px;
  font-family : open sans;
  text-align : left;
  padding : 9px 15px;
  width : 70%;
}

.footer-master .inside .box:nth-child(4) #email-box button {
  border: none;
  outline: none;
  background: transparent;
  font-size: 16px;
  line-height : 40px;
  vertical-align : middle;
  width: 42px;
  height: 42px;
  position: absolute;
  top: 0px;
  right: 0px;
  color: #fff;
  background : #54b0ff;
  text-align : center;
}



.footer-master .bottom{
  padding : 35px 0;
  margin-top : 50px;
  width : 100%;
  background : #2d3033;
  color : #9d9d9d;
  text-align : right;
  font-size : 14px;
}

.footer-master .bottom #margin{
  width : 90%;
  margin : 0 auto;
}

.footer-master .bottom .social-media{
  float : left;
  width : 500px;
  position : relative;
  color : #fff;
}

.footer-master .bottom .social-media a{
  cursor : pointer;
}

.footer-master .bottom .social-media #box{ 
  float : left;
  text-align : left;
  margin-right : 30px;
  font-size : 16px;
}

.footer-master .bottom .social-media i{
  font-size : 18px;
  margin-right : 5px;
}