html, body{
   width: 100%;
   height: 100%;
}

.ff1{
    font-size:60px;
}

.ff2{
    font-size:30px;
}

body{
    position:relative;
    background-color:#FFFFFF;
    margin: 0;
    padding: 0;
    font-family: 'Ubuntu', sans-serif;
    font-weight: normal;
    font-size:19px;
    line-height: 1.1875;
    color:#666666;
}

h1, h2, h3{
    color:#292929;
}

sup{
    vertical-align: super;
    font-size: smaller;
}

input, textarea{
    outline-color:#00243e;
}

.cnt{
    position:relative;
    width:1580px;
    margin:0 auto;
    z-index:20;
    display:block;
}

header{
    position:fixed;
    top:0;
    left:0;
    background-color:rgba(255, 255, 255, 1);
    width:100%;
    height:100px;
    z-index:50;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

header.home{
    background-color:rgba(255, 255, 255, 0);
}

header.home #logo img{
    opacity:0;
}

header.home #logo img:last-child{
    opacity:1;
}

header.smaller{
    height:100px;
}

header.smaller #logo img{

}

header.smaller #logo3 img{
    height:90px;
}

header.smaller nav{

}

header .cnt{
    width:calc(100% - 80px);
}

#logo{
    position:absolute;
    top:18px;
    left:-7px;
    z-index:30;
}

#logo img{
    height:65px;
    opacity:1;
    display:block;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#logo img:last-child{
    position:absolute;
    top:0;
    left:0;
    opacity:0;
}

nav{
    position:absolute;
    top:0;
    right:80px;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

nav ul li{
    margin:0 0 0 35px;
    float:left;
}

nav ul li a{
    padding-top:15px;
    border-top:10px solid rgba(255,255,255, 0);
    text-decoration:none;
    text-transform: uppercase;
    color:#292929;
    display:block;
}

nav ul li.active a{
    border-top:10px solid #00243e;
}

header.home nav ul li a{
    color:#FFFFFF;
}

#mobile{
    display:none;
}

#menu-mobile{
    display:none;
}

#clients{
    position:fixed;
    top:26px;
    right:26px;
    background-image:url(../images/user-account-invert.png);
    background-repeat:no-repeat;
    background-size:22px;
    width:22px;
    height:22px;
    display:block;
}

header.home #clients{
    background-image:url(../images/user-account.png)
}

.first{
    margin-top:120px;
}

h1.title, h2.title{
    padding:110px 0 50px 0;
    font-weight:bold;
    text-transform: uppercase;
    color:#00243e;
}

#page1{
    position:relative;
    background-color: transparent;
    background-image: url(../images/bg001.jpg);
    background-repeat: repeat;
    background-position: center center;
    background-size: cover;
    width:100%;
    height:100%;
    text-align:center;
    z-index:10;
    display:block;
}

#open{
    position:relative;
    width:100%;
    height:100%;
    z-index:20;
}

#open.min{
    height:250px;
}

#open-video{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:none;
}

#open.play #open-video{
    z-index:100;
    display:block;
}

#video-close{
    position:absolute;
    top:120px;
    right:20px;
    background-image:url(../images/close.jpg);
    background-position:center;
    background-repeat:no-repeat;
    background-size:40px;
    width:40px;
    height:40px;
    cursor:pointer;
    z-index:200;
    display:block;
}

.box{
    width:33%;
    height:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow:hidden;
    float:left;

    -webkit-transition: width 1s;
    -moz-transition: width 1s;
    -ms-transition: width 1s;
    -o-transition: width 1s;
    transition: width 1s;
}

.box#box2{
    width:34%;
    border-left:1px solid #FFFFFF;
    border-right:1px solid #FFFFFF;
}

#open.play .box{
    width:0;
}

#open.play .box#box2{
    width:100%;
    border-left:0;
    border-right:0;
}

.box > a{
    position:relative;
    background-color: rgba(0, 0, 0, 0.5);
    width:100%;
    height:100%;
    cursor:pointer;
    display:block;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.box > a > span.title{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    z-index:2;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

#open.play .box > a > span.title{
    bottom:-300px;
}

.box > a > span.title img{
    width:80%;
    margin:0 auto;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    opacity:0.9;
    display:block;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.box > a > span.title h2{
    padding-top:20px;
    padding-bottom:70px;
    color:#FFFFFF;
    text-transform: uppercase;
    font-weight:bold;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.box > a > span.title h2 span{
    display:block;
}

.box > a > span.tt{
    position:absolute;
    bottom:-300px;
    left:0;
    width:100%;
    z-index:2;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.box > a > span.tt p{
    padding:0 15% 30px 15%;
    font-weight:bold;
    color:#292929;
}

.box > a > span.tt span.btn{
    padding:15px 70px 15px 70px;
    border:1px solid #292929;
    text-transform:uppercase;
    color:#292929;
}

.box > a > span.tt span.btn:hover{
    background-color: #292929;
    color:#FFFFFF;
}

.box > a > span.theme{
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width:100%;
    height:100%;
    opacity:0;
    display:block;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.box > a > img{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    z-index:1;
    opacity:0;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.box > a:hover{
    background-color: rgba(0, 0, 0, 0);
}

.box > a:hover > span.title{
    bottom:130px;
}

.box > a:hover > span.title h2{
    color:#292929;
}

.box > a:hover > span.tt{
    bottom:70px;
}

#open.play .box > a:hover > span.tt{
    bottom:-300px;
}

.box > a:hover > span.theme, #open.play .box > a > span.theme{
    opacity:1;
}

.box > a:hover > span.theme{
    opacity:1;
}

.box a:hover > img{
    opacity:0.6;
}

.box > a:hover > span.title img{
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
    opacity:1;
}

.button{
    border:1px solid #FFFFFF;
    display:inline-block;
}

.button a{
    padding:12px 70px 12px 70px;
    text-decoration:none;
    text-transform:uppercase;
    color:#FFFFFF;
    display:block;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.button a:hover{
    background-color: #FFFFFF;
    color:#292929;
}

.button.dark{
    border:1px solid #292929;
}

.button.dark a{
    color:#292929;
}

.button.dark a:hover{
    background-color:#292929;
    color:#FFFFFF;
}

#page2{
    position:relative;
    background-color:#FFFFFF;
    width:100%;
    text-align:center;
    z-index:10;
}

#page2 h2{
    margin:40px 0 40px 0;
    font-weight:bold;
    text-transform: uppercase;
}

#page2 > p{
    width:80%;
    margin:0 auto;
    margin-bottom:100px;
    display:block;
}

.block{
    position:relative;
    width:33.3%;
    height:100%;
    margin:0 0 60px 0;
    padding-bottom:120px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float:left;
}

.block#block2{
    width:33.4%;
    border-left:1px solid #FFFFFF;
    border-right:1px solid #FFFFFF;
}

.block.nb{
    margin-bottom:40px;
    padding-bottom:0;
}

.block .image{
    position:relative;
    width:100%;
    height:500px;
    margin-bottom:50px;
    overflow:hidden;
}

/*
.block .image span{
    position:absolute;
    top:0;
    background-color: rgba(0, 0, 0, 0.5);
    width:100%;
    height:100%;
    line-height:100%;
    text-decoration:none;
    text-transform: uppercase;
    color:#FFFFFF;
    z-index:11;
    display:table;
}

.block .image span h3{
    position:relative;
    margin-bottom:30px;
    font-weight:bold;
    text-align:center;
    vertical-align:middle;
    color:#FFFFFF;
    z-index:13;
    display:table-cell;
}
*/

.block h3{
    font-weight:bold;
    text-transform:uppercase;
}

.block img{
    position:relative;
    width:100%;
    display:block;
}

.block > p{
    padding:40px;
    font-weight:lighter;
    text-align:justify;
    display:block;
}

.block .button{
    position:absolute;
    left:25%;
    right:25%;
    bottom:0;
    border:1px solid #00243e;
}

.block .button a{
    padding-left:0;
    padding-right:0;
    color:#00243e;
}

.block .button a:hover{
    background-color:#00243e;
    color:#FFFFFF;
}

#page3{
    position:relative;
    background-color: transparent;
    background-repeat: repeat;
    background-position: center;
    background-size: cover;
    width:100%;
    text-align:center;
    z-index:10;
}

#page3 h2{
    text-transform:uppercase;
}

#news-open{
    background-color: rgba(0, 0, 0, 0.5);
    padding:70px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color:#FFFFFF;
}

#news-open h2{
    margin-bottom:40px;
    font-weight:bold;
    text-transform: uppercase;
    color:#FFFFFF;

}

#news-open h3{
    margin-bottom:20px;
    font-weight:bold;
    color:#FFFFFF;
}

#news-open h3 span{
    display:block;
}

#news-open p{
    margin-bottom:50px;
    display:block;
}

#news-open p a{
    color:inherit;
}

#page4{
    position:relative;
    width:100%;
    text-align:center;
    z-index:10;
    display:block;
}

#page4 h2{
    margin:40px 0 100px 0;
    font-weight:bold;
    text-transform: uppercase;
}

.contact{
    width:50%;
    margin-bottom:50px;
    padding-bottom:50px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float:left;
}

.contact.cc3{
    width:33%;
}

.contact#merchant{
    border-right:1px solid #00243e;
}

.contact#investor{
    border-left:1px solid #00243e;
}

.contact img{
    margin-bottom:30px;
    display:inline-block;
}

.contact h3{
    margin-bottom:10px;
    font-weight:bold;
}

.contact span{
    margin-bottom:10px;
    display:block;
}

.contact span strong{
    font-weight:bold;
    color:#666666;
}

.contact span a{
    text-decoration:none;
    color:#00243e;
}

.contact span a:hover{
    text-decoration:underline;
}

#contact-form{
    padding-bottom:80px;
}

#contact-form > h3{
    margin-bottom:40px;
    font-weight:bold;
    text-transform: uppercase;
}

.form{
    width:1230px;
    margin:0 auto;
}

.form-left{
    width:50%;
    height:370px;
    padding:0 20px 40px 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow:hidden;
    float:left;
}

.form-right{
    width:50%;
    height:370px;
    padding:0 0 40px 0;
    overflow:hidden;
    float:left;
}

.form input{
    width:100%;
    margin-bottom:20px;
    padding:14px 16px 14px 16px;
    border:1px solid #666666;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size:18px;
    color:#00243e;
    display:block;
}

input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */

.form input[type=submit]{
    background-color: transparent;
    width:220px;
    margin:0 auto;
    padding:14px 20px 14px 20px;
    border:1px solid #00243e;
    font-size:18px;
    text-transform:uppercase;
    cursor:pointer;
    color:#00243e;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.form input[type=submit]:hover{
    background-color:#00243e;
    color:#FFFFFF;
}

.form textarea{
    width:100%;
    height:338px;
    margin-bottom:20px;
    padding:14px 16px 14px 16px;
    border:1px solid #666666;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size:18px;
    color:#00243e;
    display:block;
}

.form input[placeholder], .form textarea[placeholder]{
    font-family: 'Ubuntu', sans-serif;
    color:#00243e;
}

textarea:focus::-webkit-input-placeholder { color:transparent; }
textarea:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
textarea:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
textarea:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */

.agreement{
    display:block;
}

.agreement a{
    color:#671835;
}

.agreement .acheck{
    position:relative;
    top:4px;
    width:20px;
    height:20px;
    margin-right:20px;
    border:1px solid #00243e;
    cursor:pointer;
    display:inline-block;
}

.agreement .acheck > span.checked{
    position:absolute;
    top:1px;
    left:1px;
    background-color:#00243e;
    width:18px;
    height:18px;
    display:block;
}

.form .agreement{
    margin-bottom:40px;
}

#float-form{
    padding:50px;
    text-align:center;
}

#float-form .form{
    max-width:600px;
    width:100%;
}

#float-form .form p{
    margin-bottom:50px;
}

#page5{
    position:relative;
    width:100%;
    text-align:center;
    z-index:10;
    display:block;
}

#page5 > a > img{
    width:100%;
    display:block;
}

#social{
    width:285px;
    padding:71px 0 71px 0;
    margin:0 auto;
}

#social li{
    margin:0 17px 0 17px;
    float:left;
}

#social li a img{
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

#social li a:hover img{
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}

#others{
    width:620px;
    margin:0 auto;
    padding-bottom:50px;
}

#others.oo1{
    width:310px;
}

#others.oo3{
    width:930px;
}

#others.oo4{
    width:1240px;
}

.others{
    width:310px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    text-align:center;
    float:left;
}

.others h3{
    margin-bottom:20px;
    font-size:20px;
    color:#666666;
    display:block;
}

.others > a{
    width:310px;
    height:140px;
    padding:0 40px 0 40px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    vertical-align:middle;
    display:table-cell;
}

.others > a > img{
    width:100%;
    /*
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    */

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.others > a:hover > img{
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}

.others > a.max > img{
    max-width:116px;
}

.others > a.cimex > img{
    max-width:63px!important;
}

#page6{
    position:relative;
    background-color: #e9e9e9;
    width:100%;
    text-align:center;
    overflow:hidden;
    z-index:10;
    display:block;
}

#page6 h2{
    padding:71px 0 71px 0;
    font-weight:bold;
    text-transform: uppercase;
}

#projects{
    width:100%;
}

.project{
    width:20%;
    float:left;
}

.project > a{
    position:relative;
    width:100%;
    padding:0;
    overflow:hidden;
    display:block;
}

.project > a > img{
    width:100%;
    display:block;
}

.project > a span.info{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    padding:30px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-weight:lighter;
    text-align:left;
    z-index:2;
    color:#FFFFFF;
    display:block;
}

.project > a span.info span{
    font-size:30px;
    font-weight:bold;
    text-transform: uppercase;
    display:block;
}

.project > a span.detail{
    position:absolute;
    top:0;
    left:0;
    opacity:0;
    z-index:1;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s
}

.project > a:hover span.detail{
    opacity:1;
}

.project > a span.detail img{
    width:100%;
    display:block;
}

.project > a span.filter{
    position:absolute;
    top:0;
    left:0;
    background-color: rgba(0, 0, 0, 0.5);
    width:100%;
    height:100%;
    z-index:3;
    display:block;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s
}

.project > a:hover span.filter{
    opacity:0;
}

#page7{
    position:relative;
    background-color: transparent;
    background-image: url(../images/developer.jpg);
    background-repeat: repeat;
    background-position: center bottom;
    background-size: cover;
    width:100%;
    height:100%;
    text-align:center;
    z-index:10;
    display:block;
}

#company{
    position:absolute;
    top:45%;
    left:0;
    width:100%;
    margin-top:-140px;
    text-align:center;
    color:#FFFFFF;
}

#company h1{
    margin-bottom:50px;
    font-weight:bold;
    color:#FFFFFF;
}

#company ul{
    width:80%;
    margin:0 auto;
}

#company ul li{
    width:25%;
    padding:0 10px 0 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float:left;
}

#company ul li span{
    margin-bottom:30px;
    font-weight:bold;
    display:block;
}

#page7 .button{
    position:absolute;
    bottom:125px;
    left:50%;
    margin-left:-125px;
}

#page8{
    position:relative;
    width:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align:center;
    z-index:10;
    display:block;
}

#page8 h1{
    margin-bottom:40px;
    font-weight:bold;
    text-transform: uppercase;
}

#submenu{
    position:relative;
    background-color: transparent;
    background-image: url(../images/bg001.jpg);
    background-repeat: repeat;
    background-position: center;
    background-size: cover;
    width:100%;
    height:250px;
    text-align:center;
    z-index:10;
    display:block;
}

.nv{
    width:25%;
    height:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow:hidden;
    float:left;
}

.nv#nv2{
    border-left:1px solid #FFFFFF;
    border-right:1px solid #FFFFFF;
}

.nv#nv3{
    border-right:1px solid #FFFFFF;
}

.nv > a{
    position:relative;
    width:100%;
    height:100%;
    line-height:100%;
    text-decoration:none;
    text-transform: uppercase;
    color:#FFFFFF;
    z-index:11;
    display:table;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.nv > a > span.title{
    position:relative;
    background-color: rgba(0, 0, 0, 0.5);
    text-align:center;
    vertical-align:middle;
    z-index:13;
    display:table-cell;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.nv > a > span.theme{
    position:absolute;
    top:0;
    left:0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width:100%;
    height:100%;
    opacity:0;
    z-index:12;
    display:block;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.nv#nv1 > a > span.theme{
    background-image: url(../gallery/theme01.jpg);
}

.nv#nv2 > a > span.theme{
    background-image: url(../gallery/theme02.jpg);
}

.nv#nv3 > a > span.theme{
    background-image: url(../gallery/theme03.jpg);
}

.nv > a:hover > span.title, .nv.active > a > span.title{
    background-color: rgba(0, 0, 0, 0.15);
}

.nv > a:hover > span.theme, .nv.active > a > span.theme{
    opacity:1;
}

#page9{
    position:relative;
    width:100%;
    text-align:center;
    z-index:10;
}

#page9 h2{
    font-weight:bold;
    text-transform:uppercase;
}

#visual{
    position:relative;
    background-color: transparent;
    background-image: url(../images/bg001.jpg);
    background-repeat: repeat;
    background-position: center bottom;
    background-size: cover;
    width:100%;
    height:100%;
    text-align:center;
    z-index:10;
    display:block;
}

#visual-info{
    background-color: rgba(0, 0, 0, 0.5);
    width:100%;
    min-height:100%;
    padding:5% 0 5% 0;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

#visual-info p{
    width:80%;
    margin:0 auto;
    margin-bottom:50px;
    font-weight:lighter;
    color:#FFFFFF;
}

#visual-info .button{
    margin-bottom:60px;
}

.text{
    padding:30px;
    font-weight:lighter;
    text-align:left;
}

.text.center{
    text-align:center;
}

.text.right{
    text-align:right;
}

.text.bold{
    font-weight:bold;
}

.text h2{
    margin-bottom:60px;
    font-weight:bold;
}

.text h3{
    font-weight:bold;
}

.text p{
    margin-bottom:20px;
}

.text p strong{
    font-weight:normal;
    color:#e93864;
}

.text.mini p{
    margin-bottom:5px;
}

.text p strong{
    font-weight:normal;
    color:#00243e;
}

.text p em{
    font-style:italic;
}

.min{
    padding-top:30px;
}

.min p{
    font-size:16px;
}

#gallery{
    padding-bottom:50px;
}

#gallery.short{
    width:30%;
    float:left;
}

#gallery ul{

}

#gallery ul li{
    position:relative;
    width:33.3%;
    height:250px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow:hidden;
    float:left;
}


#gallery ul li.mid{
    width:33.4%;
    /*border-left:1px solid #FFFFFF;
    border-right:1px solid #FFFFFF;*/
}

#gallery.short ul li{
    width:100%;
}

#gallery ul li a{
    position:absolute;
    top:0;
    width:70%;
    height:100%;
    margin-left:15%;
    line-height:100%;

    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    color:#FFFFFF;
    display:table;
}


#gallery ul li a img{
    position:absolute;
    width:100%;
    display:block;
}

#gallery ul li a span{
    position:relative;
    background-color:rgba(0, 0, 0, 0.5);
    top:0;
    width:100%;
    height:100%;
    text-align:center;
    vertical-align:middle;
    display:table-cell;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

#gallery ul li a:hover span{
    background-color:rgba(0, 0, 0, 0);
    color:#FFFFFF;
}

#gallery-text{
    text-align:left;
}

#gallery-text h2{
    margin-bottom:30px;
    font-weight:bold;
    text-transform:uppercase;
}

img.responsive{
    width:100%;
    display:block;
}

#page12{
    position:relative;
    width:100%;
    min-height:100%;
    text-align:center;
    overflow:hidden;
    z-index:10;
    display:block;
}

#page12 .imgcover img{
    width:100vw;
    height:100vh;
    object-fit: cover;
}

#page12 .compat-object-fit{

    background-size: cover;
    background-position: center center;
    width:100vw;
    height:100vh;
    display:block;
}

#page12 .compat-object-fit img{
    display:none;
}


#project{
    position:absolute;
    left:40px;
    bottom:40px;
    width:calc(100% - 80px);
    margin:0 auto;
    text-align:left;
    z-index:1;
    color:#FFFFFF;
}

#project h1{
    background-color: rgba(73,125,54,1);
    background-color: rgba(73,125,54,0.9);
    padding:20px 30px 20px 30px;
    font-weight:bold;
    text-transform: uppercase;
    display:inline-block;
}

#project h1 span{
    font-weight:normal;
}

#project-text{
    position:relative;
    background-color: rgba(73,125,54,1);
    background-color: rgba(73,125,54,0.7);
    padding:30px 30px 70px 30px;
    line-height:1.4em;
}

#project-text.transparent{
    background-color:transparent;
}

#project-text .button{
    position:absolute;
    right:20px;
    bottom:20px;
    width:120px;
    text-align:center;
}

#project-text .button a{
    padding:10px;
}

.btn-left{
    position:absolute;
    top:50%;
    left:0;
    margin-top:-20px;
    z-index:50;
}

.btn-left a{
    background-image: url(../images/btn-left.png);
    background-size: 40px;
    width:40px;
    height:40px;
    zoom: 1;
    /*
    filter: alpha(opacity=50);
    opacity:0.5;
    */
    display:block;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.btn-left a:hover{
	filter: alpha(opacity=100);
    opacity:1;
}

.btn-right{
    position:absolute;
    top:50%;
    right:0;
    margin-top:-20px;
    z-index:50;
}

.btn-right a{
    background-image: url(../images/btn-right.png);
    background-size: 40px;
    width:40px;
    height:40px;
    zoom: 1;
    /*
	filter: alpha(opacity=50);
    opacity:0.5;
    */
    display:block;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.btn-right a:hover{
	filter: alpha(opacity=100);
    opacity:1;
}

#page13{
    position:relative;
    width:100%;
    padding-bottom:100px;
    text-align:center;
    z-index:10;
    display:block;
}

#page13 h1{
    margin-bottom:40px;
    font-weight:bold;
    text-transform:uppercase;
}

#page13 h2{
    margin-bottom:40px;
    font-weight:bold;
    text-transform:uppercase;
}

#page14{
    position:relative;
    width:100%;
    padding-bottom:100px;
    text-align:center;
    z-index:10;
    display:block;
}

#page14 > h2{
    font-weight:bold;
    text-transform:uppercase;
}

#transport{
    width:100%;
    margin:0 auto;
}

#transport ul{
    width:100%;
    display:block;
}

#transport ul li{
    width:33%;
    float:left;
}

#transport ul li img{
    width:108px;
}

#transport ul li h3{
    margin-bottom:30px;
    font-weight:bold;
}

#transport ul li span{

}

#transport .mobile{
    margin-top:50px;
    display:none;
}

#transport .mobile a:hover{
    text-decoration:underline;
}

.video-iframe{
    width:100%;
    height:100vh;
}

#dev{

}

.dev{
    width:25%;
    height:270px;
    margin-bottom:100px;
    padding:0 50px 0 50px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow:hidden;
    float:left;
}

.dev > a{
    position:relative;
    height:270px;
    overflow:hidden;
    display:block;
}

.dev > a > img{
    position:absolute;
    width:100%;
    min-width:100%;
    min-height:270px;
    object-fit:cover;
    z-index:1;
    display:block;
}

.dev > a > span.filter{
    position:relative;
    top:0;
    left:0;
    background-color:rgba(0, 0, 0, 0.5);
    width:100%;
    height:270px;
    z-index:2;
    display:block;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.dev > a > span.title{
    position:absolute;
    top:50%;
    left:50%;
    -ms-transform:translate(-50%, -50%);
    -webkit-transform:translate(-50%, -50%);
    transform:translate(-50%, -50%);
    color:#FFFFFF;
    z-index:3;
    display:block;

    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

.dev > a:hover > span.filter{
    filter: alpha(opacity=0);
    opacity:0;
}

.dev > a:hover > span.title{
    filter: alpha(opacity=0);
    opacity:0;
}

.timeline{
    width:80%;
    margin:0 auto;
}

.gallery ul{
    width:80%;
    margin:0 auto;
}

.gallery ul li{
    width:20%;
    height:200px;
    margin-bottom:100px;
    padding:0 20px 0 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow:hidden;
    display:inline-block;
}

.gallery.big ul li{
    width:33.33%;
    height:300px;
    margin-bottom:100px;
    padding:0 20px 0 20px;
}

.gallery ul li > a{
    position:relative;
    height:200px;
    overflow:hidden;
    display:block;
}

.gallery ul li > a > img{
    position:absolute;
    width:100%;
    min-width:100%;
    min-height:200px;
    object-fit:cover;
    z-index:1;
    display:block;
}

.gallery.big ul li{
    width:33.33%;
    height:350px;
    margin-bottom:40px;
}

.gallery.big ul li > a{
    height:350px;
}

.gallery.big ul li > a > img{
    min-height:350px;
}

#page14{
    position:relative;
    width:100%;
    text-align:center;
    z-index:10;
    display:block;
}

.icons{
    padding-bottom:100px;
    text-align:left;
    float:left;
}

.icons#icons1{
    width:75%;
}

.icons#icons2{
    width:25%;
}

.icons h2{
    margin-bottom:30px;
    text-transform: uppercase;
}

.icons ul{
    width:100%;
}

.icons ul li{
    width:100%;
    height:55px;
    float:left;
}

.icons#icons1 ul li{
    width:50%;
}

.icons ul.long li{
    width:100%;
}

.icons ul li img{
    width:40px;
    float:left;
}

.icons ul li strong{
    background-image: url(../images/locality/ico-blank.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40px;
    width:40px;
    height:44px;
    padding-top:8px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align:center;
    color:#FFFFFF;
    float:left;
}

.icons ul li span{
    padding:12px 0 0 12px;
    font-size:16px;
    float:left;
}

#map01{
    position:relative;
    height:610px;
    margin-bottom:50px;
    overflow:hidden;
}

#map01 iframe{
    position:absolute;
    top:-50px;
    left:0;
    border:0;
    pointer-events:none;
}

#map02{
    position:relative;
    height:610px;
    overflow:hidden;
}

#map02 iframe{
    position:absolute;
    top:-50px;
    left:0;
    border:0;
    pointer-events:none;
}

#page15{
    position:relative;
    width:100%;
    text-align:center;
    z-index:10;
    display:block
}

#bar{
    width:100%;
    height:60px;
    overflow:hidden;
}

#bar .bg{
    position:absolute;
    top:0;
    left:0;
    background-color: #292929;
    width:100%;
    height:60px;
    z-index:1;
}

#bar .bg > span{
    position:absolute;
    top:0;
    width:50%;
    height:60px;
    display:block;
}

#bar .bg > span.active{
    background-color: #00243e;
}

#bar .bg > span:first-child{
    left:0;
    background-color: #00243e;
}

#bar .bg > span:last-child{
    right:0;
}

#bar ul{
    position:relative;
    width:60%;
    margin:0 auto;
    z-index:2;
    display:block;
}

#bar ul li{
    background-color: #292929;
    width:33%;
    height:60px;
    padding-left:30px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float:left;
}

#bar ul li.active{
    background-color:#00243e;
}

#bar ul li a{
    position:relative;
    padding:15px 0 25px 0;
    text-decoration:none;
    color:#666666;
    display:block;
}

#bar ul li.active a{
    color:#FFFFFF;
}

#bar ul li a:after,
#bar ul li a:before{
    content: '';
    display: block;
    position: absolute;
    left:100%;
    width: 0;
    height: 0;
    border-style: solid;

}

#bar ul li a:before{
    top: 0px;
    border-color: transparent transparent transparent #FFFFFF;
    border-width: 30px;
}

#bar ul li a:after{
    top: 0px;
    border-color: transparent transparent transparent #292929;
    border-width: 30px;
}

#bar ul li.active a:after{
     border-color: transparent transparent transparent #00243e;
}

#bar ul li.last a:before{
    top: 0px;
    border-color: transparent transparent transparent #FFFFFF;
    border-width: 30px;

    display:none;
}

#bar ul li.last a:after{
    top: 0px;
    border-color: transparent transparent transparent #292929;
    border-width: 30px;

    display:none;
}

#project-info{
    width:100%;
    background-color: #666666;
}

#project-map{
    position:relative;
    background-color:#FFFFFF;
    width:60%;

    float:left;
}

#project-map img{
    width:100%;
    display:block;
}

.floor{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

.floor a.status3, .floor a.status3:hover > polygon.active{
    cursor:default;
}

.floor a polygon{
    background-color: rgba(73,125,54, 0);
    fill:rgba(73,125,54, 0);
    fill-rule:nonzero;
}

.floor a.status1 > polygon{
    background-color:rgba(244, 255, 0, 0.4);
    fill:rgba(244, 255, 0, 0.4);
    fill-rule:nonzero;
}

.floor a.status2 > polygon{
    background-color:rgba(255, 54, 54, 0.4);
    fill:rgba(255, 54, 54, 0.4);
    fill-rule:nonzero;
}

.floor a.status3 > polygon, .floor a.status3:hover > polygon.active, .floor a.status4 > polygon, .floor a.status4:hover > polygon.active, .floor a.status5 > polygon, .floor a.status5:hover > polygon.active{
    background-color: rgba(255, 54, 54, 0.5);
    fill:rgba(255, 54, 54, 0.5);
    fill-rule:nonzero;
}

.floor a:hover polygon.active, .floor polygon.selected{
    background-color: rgba(73,125,54, 0.5);
    fill:rgba(73,125,54, 0.7);
    fill-rule:nonzero;
    cursor:pointer;
}

.floor a.status1:hover polygon.active{
    background-color:rgba(244, 255, 0, 0.4);
    fill:rgba(244, 255, 0, 0.4);
    fill-rule:nonzero;
    cursor:pointer;
}

.floor a.status2:hover polygon.active{
    background-color:rgba(255, 54, 54, 0.4);
    fill:rgba(255, 54, 54, 0.4);
    fill-rule:nonzero;
    cursor:pointer;
}

.floor a polygon.nonactive:hover{
    background-color: rgba(255, 24, 0, 0.5);
    fill:rgba(255, 24, 0, 0.7);
    fill-rule:nonzero;
}

.floor a text{
    color:#000000;
    fill:#000000;

    paint-order: stroke;
    stroke: #FFFFFF;
    stroke-width: 0.2px;
    stroke-linecap: butt;
    stroke-linejoin: miter;
    font-weight: 800;
}

.floor a#flat25 text{
    padding-top:50px;
}

.floor a:hover text, .floor polygon.selected~text, .floor a.status2 text, .floor a.status3 text, .floor a.status1 text{
    color:#FFFFFF;
    fill:#FFFFFF;
    stroke:#000000;
}

#project-select{
    position:relative;
    width:40%;
    height:100%;
    padding:40px 60px 40px 60px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align:left;
    color:#FFFFFF;
    float:left;
}

#project-select h1, #project-select p{
    margin-bottom:20px;
    text-transform:uppercase;
    color:#FFFFFF;
}

#project-select img{
    width:80%;
}

#project-select table{
    width:80%;
    margin-bottom:40px;
}

#project-select table td{
    padding:0 10px 10px 0;
    font-weight:lighter;
}

#project-select .button{
    border:1px solid #00243e;
}

#project-select .button a{
    color:#00243e;
}

#project-select .button a:hover{
    background-color:#00243e;
    color:#FFFFFF;
}

.step2{
    display:none;
}

.step2.active{
    display:block;
}

#vis{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    padding:300px 15px 0 15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.vis{
    width:50%;
    padding:15px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    float:left;

}

.vis img{
    width:100%!important;
    border:3px solid #666666;
    display:block;
}

.vis.active img{
    border:3px solid #FFFFFF;
}

.info-floor{
    display:none;
}

.info-floor.active{
    display:block;
}

.info-floor h3{
    padding-bottom:20px;
    font-weight:bold;
    color:#FFFFFF;
}

.flat{
    display:none;
}

.flat.active{
    display:block;
}

#sale{
    padding:50px 0 50px 0;
}

#sale h2{
    margin-bottom:40px;
    font-weight:bold;
    text-transform: uppercase;
}

#filter{
    position:relative;
    background-color: #f4f4f4;
    width:100%;;
    margin-bottom:20px;
    padding-bottom:50px;
}

#filter-form{
    width:80%;
    margin:0 auto;
    padding:35px 0 35px 0;
    color:#666666;
}

.element{
    display:block;
}

.selects{
    width:15%;
    text-align:left;
    float:left;
}

.select{
    width:100%!important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display:block;
}

.selects label{
    margin-bottom:15px;
    text-transform: uppercase;
    display:block;
}

.selects select, .select select{
    width:100%!important;
    border:0;
    color:#525252;
}

.selects .ui-selectmenu-button, .select .ui-selectmenu-button{
    background-image: url(../images/d1.png);
    background-position: right;
    background-repeat: no-repeat;
    background-color: #FFFFFF;
    width:100%!important;
    margin-bottom:30px;
    padding:19px 17px 18px 17px;
    border:1px solid #666666;
    border-radius:0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color:#666666;
    display:block;
}

.selects .ui-selectmenu-button span.ui-selectmenu-text, .select .ui-selectmenu-button span.ui-selectmenu-text{
	text-align: left;
    color:#525252;
	display: block;
}

.checks{
    width:60%;
    padding:0 2.5% 0 2.5%;
    text-align:left;
    float:left;
}

.check-group{

}

.checks > label, .check-group > label{
    margin-bottom:15px;
    text-transform: uppercase;
    display:block;
}

.checks .element{
    padding-right:30px;
    padding-bottom:30px;
    float:left;
}

.check{
    position:relative;
    background-image: url(../images/check.png);
    background-position: center;
    background-repeat: no-repeat;
    width:32px;
    height:32px;
    margin-right:25px;
    cursor: pointer;
    float:left;
}

.check input{
    display:none;
}

.checked{
    position:absolute;
    bottom:5px;
    left:5px;
    background-image: url(../images/checked.png);
    background-position: center;
    background-repeat: no-repeat;
    width:40px;
    height:29px;
    display:block;
}

.slider{
    width:20%;
    text-align:left;
    float:left;
}

.slider label{
    margin-bottom:20px;
    text-transform: uppercase;
    display:block;
}

.sld{
    height:60px;
    margin-bottom:20px;
    border:1px solid #f4f4f4;
    display:block;
}

.sld span{
    display:block;
}

.sld span.ui-slider{
    background-color:#00243e;
    height:16px;
    margin:20px 0 20px 0;
    border:2px solid #FFFFFF;
}

.sld span.ui-slider .ui-slider-handle{
    top:-25px;
    background-image: url(../images/slider.png);
    background-position: center;
    background-repeat: no-repeat;
    width:60px;
    height:60px;
    border:0!important;
    border-radius:0;
    cursor:pointer;
}

.sld span.ui-slider .ui-slider-range {
    background-color:#8aa7c7;
}

.slider span.price{
    width:100%;
    text-align:center;
    display:block;
}

.controls{
    position:absolute;
    bottom:30px;
    left:0;
    width:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.controls .button, .detailbox .button{
    border:1px solid #00243e;
}

.controls .button a, .detailbox .button a{
    cursor:pointer;
    color:#00243e;
}

.controls .button a:hover, .detailbox .button a:hover{
    background-color:#00243e;
    color:#FFFFFF;
}

#pricelist{

}

#pricelist table{
    width:100%;
}

#pricelist table tbody tr:hover{
    background-color:#f4f4f4;
}

#pricelist table tbody tr.status1, #pricelist table tbody tr.status1:hover{
    background-color:rgba(244, 255, 0, 0.4);
}

#pricelist table tbody tr.status2, #pricelist table tbody tr.status2:hover{
    background-color:rgba(255, 54, 54, 0.4);
}

#pricelist table tbody tr.status3, #pricelist table tbody tr.status3:hover{
    background-color:rgba(255, 54, 54, 0.4);
}

#pricelist table tbody tr.none:hover{
    background-color:transparent;
}

#pricelist table th{
    padding:0 5px 20px 5px;
    font-weight:lighter;
    color:#00243e;

}

#pricelist table td{
    padding:10px 5px 10px 5px;
    font-weight:lighter;
    cursor:pointer;
}

#btm{
    width:100%;
    padding-top:50px;
    font-weight:lighter;
}

#btmleft{
    width:50%;
    float:left;
}

#btmleft span, #con span{
    text-transform: uppercase;
    float:left;
}

#btmleft span a, #con span a{
    background-position: top;
    background-repeat: no-repeat;
    width:125px;
    padding:50px 0 0 0;
    font-size:14px;
    font-weight:lighter;
    text-align:center;
    text-decoration:none;
    color:inherit;
    display:block;
}

#btmleft span#print a, #con span#print a{
    background-image: url(../images/print.png);
    margin-right:30px;
    cursor:pointer;
}

#con span#download a{
    background-image: url(../images/download.png)
}
span#download2{
    margin-right:50px;
    text-transform: uppercase;
    float:left;
}

span#download2 a{
    background-image: url(../images/download2.png);
    background-position: top;
    background-repeat: no-repeat;
    width:125px;
    padding:50px 0 0 0;
    font-size:14px;
    font-weight:lighter;
    text-align:center;
    text-decoration:none;
    color:inherit;
    display:block;
}

#btmleft span#send a, #con span#send a{
    background-image: url(../images/send.png);
}

#btmright{
    width:50%;
    text-align:right;
    float:left;
}

#btmright p{
    margin-bottom:5px;
    font-weight:bold;
}


#details{
    position:relative;
    padding:50px 0 50px 0;
}

#details > h2{
    margin-bottom:80px;
    font-weight:bold;
    text-transform: uppercase;
}

#detail{
    position:absolute;
    top:-100px;
    left:0;
    width:1px;
    height:1px;
    display:block;
}

.unit{
    width:calc(100% - 300px);
    float:left;
}

.unit-desc{
    width:100%;
}

.unit-text{
    width:35%;
    margin-bottom:80px;
    text-align:left;
    float:left;
}

.unit-text h2{
    margin-bottom:20px;
    text-transform: uppercase;
}

.unit-text table{
    width:100%;
    font-weight:lighter;
}

.unit-text table td{
    min-width:80px;
    padding-right:10px;
}

.unit-text table td strong{
    font-weight:bold;
}

.unit-image{
    position:relative;
    width:65%;
    margin-bottom:80px;
    overflow:hidden;
    float:left;
}

.unit-image img{
    position:relative;
    left:-15%;
    width:130%;
    display:block;
}

.unit-contact{
    width:300px;
    float:left;
}

.unit-contact .button{
    width:100%;
    margin-bottom:30px;
}

.unit-contact .button a{
    padding-left:0;
    padding-right:0;
    border:1px solid #00243e;
    text-align:center;
    cursor:pointer;
    color:#00243e;
}

.unit-contact .button a:hover{
    background-color:#00243e;
    color:#FFFFFF;
}

.detailbox{
    width:24%;
    padding-bottom:60px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align:left;
    float:left;
}

.detailbox.wide{
    width:52%;
    padding:0 5% 30px 5%;
}

.detailbox h2{
    margin-bottom:20px;
    text-transform: uppercase;
}

.detailbox table{
    width:100%;
    margin-bottom:100px;
    font-weight:lighter;
}

.detailbox.wide img{
    position:relative;
    left:-15%;
    width:130%;
}

.detailbox .button{
    width:100%;
    margin-bottom:30px;
}

.detailbox .button a{
    padding-left:0;
    padding-right:0;
    text-align:center;
}

.detailbox .mh{
    position:relative;
    width:100%;
    min-height:500px;
    overflow:hidden;
}

.detailbox .mh td{
    min-width:80px;
    padding-right:10px;
}

.detailbox .mh td strong{
    font-weight:bold;
}

#merchant2{
    width:100%;
    margin-bottom:20px;
    font-weight:lighter;
    text-align:center;
}

#merchant2 img{
    width:100%;
    max-width:239px;
    margin-bottom:20px;
    display:inline-block;
}

#merchant2 span{
    margin-bottom:5px;
    display:block;
}

#merchant2 h3{
    margin-bottom:15px;
}

#merchant2 span strong{
    font-weight:normal;
    color:#666666;
}

#merchant2 span a{
    font-weight:normal;
    text-decoration:none;
    color:#00243e;
}

#con{

}

.line1{
    background-color:#929292;
    width:100%;
    height:1px;

}

#fotogallery{
    padding:50px 0 50px 0;
}

#fotogallery h2{
    margin-bottom:40px;
    font-weight:bold;
    text-transform: uppercase;
}

#fotogallery ul{

}

#fotogallery ul li{
    width:25%;
    padding:0 2% 2% 2%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float:left;
}

#fotogallery ul li a{
    width:100%;
    display:block;
}

#fotogallery ul li a img{
    width:100%;
    display:block;
}

#finance{
    padding:60px 0 60px 0;
    text-align:center;
}

#finance ul{

}

#finance ul li{
    width:33.3%;
    padding:25px;
    border-right:1px solid #00243e;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float:left;
}

#finance ul li:last-child{
    border-right:0;
}

#finance ul li span{
    text-transform: uppercase;
    display:block;
}

#finance ul li span.num{
    padding-bottom:15px;
    color:#00243e;
}

#finance ul li strong{
    padding:15px 0 15px 0;
    font-weight:bold;
    display:block;
}

.standards{
    width:80%;
    margin:0 auto;
    margin-bottom:100px;
}

.standards-text{
    width:60%;
    padding-right:10%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align:left;
    float:left;
}

.standards-text ul{
    margin-bottom:60px;
    list-style-type: square;
}

.standards-text ul li{
    margin-bottom:20px;
}

.standards-img{
    width:30%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float:left;
}

.standards-img img{
    width:100%;
    display:block;
}

#page10{
    position:relative;
    background-color: #e5ebef;
    width:100%;
    min-height:100%;
    text-align:center;
    z-index:10;
    display:block;
}

#news{
    margin:0 0 50px 0;
}

.new{
    background-color: #FFFFFF;
    width:772px;
    height:260px;
    margin-bottom:28px;
    text-align:left;
    float:left;
}

.new.even{
    margin-right:28px;
}

.new img{
    width:260px;
    height:260px;
    float:left;
}

.new-text{
    position:relative;
    width:482px;
    height:100%;
    padding:18px 10px 12px 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float:left;
}

.new-text h3{
    font-weight:bold;
}

.new-text p{
    color:#00243e;
    display:block;
}

.new-text .vice{
    position:absolute;
    left:20px;
    bottom:20px;
}

#new-container{
    position:relative;
    width:100%;
    padding-bottom:231px;
}

#new{
    background-color: #FFFFFF;
    width:100%;
    height:100%;
    display:block;
}

#new-text{
    width:100%;
    padding-right:10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align:left;
    float:left;

}

#new-text > img{
    width:30%;
    margin-right:20px;
    float:left;
}

#new-text h2{
    margin:20px;
    font-size:25px;
    font-weight:bold;
}

#new-text h3{
    margin:20px;
    font-size:20px;
    font-weight:bold;
}

#new-text p{
    margin:20px;
    color:#00243e;
}

#new-text p img{
    width:70%;
}

#new-text a{
    color:inherit;
}

.btn-left{
    position:absolute;
    top:50%;
    left:0;
    margin-top:-20px;
    z-index:50;
}

.btn-left a{
    background-image: url(../images/btn-left.png);
    background-size: 40px;
    width:40px;
    height:40px;
    zoom: 1;
	filter: alpha(opacity=50);
    /*
    opacity:0.5;
    display:block;
    */

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.btn-left a:hover{
	filter: alpha(opacity=100);
    opacity:1;
}

.btn-right{
    position:absolute;
    top:50%;
    right:0;
    margin-top:-20px;
    z-index:50;
}

.btn-right a{
    background-image: url(../images/btn-right.png);
    background-size: 40px;
    width:40px;
    height:40px;
    zoom: 1;
    /*
	filter: alpha(opacity=50);
    opacity:0.5;
    */
    display:block;

    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.btn-right a:hover{
	filter: alpha(opacity=100);
    opacity:1;
}

#new > .btn-left, #new > .btn-right{
    display:none;
}

.bv{
    display:none;
}

.submenu{
    padding:60px 0 60px 0;
}

.submenu > li{
    margin:0 15px 0 15px;
    display:inline-block;
}

.submenu > li > a{
    text-transform:uppercase;
    cursor:pointer;
}

.submenu > li.active > a, .submenu > li > a:hover{
    text-decoration:underline;
}

#page11{
    position:relative;
    width:100%;
    min-height:100%;
    text-align:center;
    overflow:hidden;
    z-index:10;
    display:block;
}

.jcarousel {
    position: relative;
    overflow: hidden;
}

.jcarousel ul {
    width: 20000em;
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
}

.jcarousel li {
    float: left;
}

#page11 .imgcover img{
    min-width:100vw;
    /*height:calc(100vh - 100px);*/
    height:100vh;
    /*margin-top:100px;*/
    object-fit: cover;
}

#page11 .compat-object-fit{
    background-size: cover;
    background-position: center center;
    min-width:100vw;
    height:100vh;
    display:block;
}

#page11 .compat-object-fit img{
    display:none;
}

.hide{
    display:none!important;
}

.show{
    display:block!important;
}

footer{
    position:relative;
    background-color: #252525;
    width:100%;
    height:30px;
    margin:0 auto;
}

footer.bbn{
    border-top:0;
}

footer span{
    position:absolute;
    top:7px;
    font-size:14px;
    color:#FFFFFF;
}

footer span:first-child{
    left:20px;
}

footer span:last-child{
    right:20px;
    text-align:right;
}

footer span a{
    text-decoration:none;
    color:inherit;
}

#amail, .amail{
    display:none!important;
}

#dialog{
    display:none;
}

.ui-dialog{
    border-radius:0!important;
}

.ui-dialog .ui-dialog-titlebar{
    background-color:#001f3d;
    border:1px solid #001f3d;
    border-radius:0!important;
}

.ui-dialog .ui-dialog-titlebar-close {
    background-color: transparent!important;
    background-image:url(../images/close2.png);
    background-position:center;
    background-repeat:no-repeat;
    border:0!important;
}

.ui-dialog .ui-dialog-content strong{
    padding-top:10px;
    font-weight:bold;
    display:block;
}

.investor{
    width:100%;
    padding:0 20px 50px 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

}

@media (max-width: 1680px) {
        .ff1{
            font-size:50px;
        }

        #logo2 img, #logo3 img{
            height:180px;
        }

        nav{
            right:150px;
        }

        .cnt{
            width:1280px;
        }

        .project > a span.info{
            padding:20px;
        }

        #company ul{
            width:90%;
        }

        #project-select{
            padding:50px;
        }

        #filter-form{
            width:90%;
        }

        #bar ul{
            width:70%;
        }

        .block .image{
            height:260px;
        }

        #gallery ul li{
            height:250px;
        }

        #page15 .cnt{
            width:98%!important;
        }

        .vis p{
            font-size:16px;
        }

        .dev{
            height:200px;
        }

        .dev > a{
            height:200px;
        }

        .dev > a > img{
            min-height:200px;
        }

        .dev > a > span.filter{
            height:200px;
        }

        .standards-text{
            width:65%;
            padding-right:5%;
        }

        .gallery ul li{
            height:150px;
            margin-bottom:50px;
        }

        .gallery ul li > a{
            height:150px;
        }

        .gallery ul li > a > img{
            min-height:150px;
        }

        .gallery.big ul li{
            height:250px;
        }

        .gallery.big ul li > a{
            height:250px;
        }

        .gallery.big ul li > a > img{
            min-height:250px;
        }
}

@media (max-width: 1366px) {
        body{
            font-size: 18px;
        }

        .ff1{
            font-size:40px;
        }

        .ff2{
            font-size:25px;
        }

        .cnt{
            width:1080px;
        }

        header{
            height:80px;
        }

        header.smaller{
            height:80px;
        }

        header.smaller #logo img{
            height:50px;
        }

        header.smaller #logo2{
            right:0px;
        }

        header.smaller #logo2 img{
            height:70px;
        }

        header.smaller nav{
            right:50px;
        }

        #logo img{
            height:40px;
        }

        #logo2 img{
            height:120px;
        }

        #clients{
            top:14px;
            right:14px;
        }

        nav{
            right:90px;
        }

        nav ul li{
            margin:0 20px 0 0;
        }

        nav ul li a{
            padding-top:7px;
            border-top:5px solid #FFFFFF;
            font-size:18px;
        }

        nav ul li.active a{
            border-top:5px solid #00243e;
        }

        .box > a > span.title img{
            width:50%;
        }

        #news-open{
            padding:50px;
        }

        .block .image{
            height:220px;
        }

        .block .button{
            left:15%;
            right:15%;
        }

        .form{
            width:1000px;
        }

        #others.oo3{
            width:660px;
        }

        #others.oo4{
            width:880px;
        }

        #others.oo3 .others, #others.oo4 .others{
            width:220px;
            margin-bottom:30px;
        }

        #others.oo3 .others a, #others.oo4 .others a{
            width:220px;
        }

        #gallery ul li{
            height:200px;
        }

        .project{
            width:25%;
        }

        .icons{
            padding-bottom:50px;
        }

        .icons#icons1{
            width:50%;
        }

        .icons#icons2{
            width:50%;
        }

        .icons#icons1 ul li{
            width:50%;
        }

        #project-select{
            padding:30px;
        }

        .selects{
            width:25%;
        }

        .checks{
            width:40%;
        }

        .slider{
            width:30%;
        }

        #bar ul{
            width:80%;
        }

        #bar ul li a{
            padding:18px 0 30px 0;
        }

        #page11 .imgcover img{
            /*height:calc(100vh - 80px);
            margin-top:80px;*/
        }

        .detailbox.wide{
            width:50%;
            margin-bottom:50px;
            padding:0;
        }

        #vis{
            padding:250px 15px 0 15px;
        }

        .vis p{
            font-size:14px;
        }

        .dev{
            width:33%;
            height:200px;
            margin-bottom:50px;
            padding:0 25px 0 25px;
        }

        .standards{
            width:90%;
        }

        .standards-text{
            width:60%;
            padding-right:25px;
        }

        .standards-img{
            width:40%;
        }

        .gallery ul li{
            width:25%;
        }

        .gallery.big ul li{
            width:50%;
        }
}

@media (max-width: 1200px) {
        .ff1{
            font-size:30px;
        }

        .cnt{
            width:960px;
        }

        header.smaller{
            height:55px;
        }

        header.smaller #logo img{
            height:45px;
        }

        #logo{
            top:5px;
        }

        .form{
            width:800px;
        }

        .selects{
            width:25%;
        }

        .checks{
            width:50%;
        }

        .slider{
            width:20%;
        }

        #bar ul{
            width:85%;
        }

        #project-select{
            padding:20px;
        }

        .t9{
            display:none;
        }

        .block .image{
            height:180px;
        }

        /*#page11 .imgcover img{
            height:calc(100vh - 55px);
            margin-top:55px;
        }*/

        #gallery ul li{
            height:150px;
        }

        #vis{
            padding:180px 15px 0 15px;
        }

        .vis p{
            font-size:12px;
        }

        .dev{
            width:50%;
        }

        .unit-text{
            width:60%;
            margin:0 auto;
            margin-bottom:80px;
            float:none;
        }

        .unit-image{
            width:100%;
            margin-bottom:80px;
        }

        .unit-image img{
            position:relative;
            left:0;
            width:80%;
            display:block;
        }
}

@media (max-width: 1024px) {
        body{
            font-size: 16px;
        }

        .ff1{
            font-size:25px;
        }

        .ff2{
            font-size:20px;
        }

        .cnt{
            width:920px;
        }

        header.smaller #logo2 img{
            height:50px;
        }

        header.smaller #logo2{
            right:50px;
        }

        #logo2{
            right:50px;
        }

        #logo2 img{
            height:50px;
        }

        #clients{
            right:90px;
        }

        #menu-mobile{
            position:absolute;
            top:0;
            right:0;
            font-size:40px;
            cursor: pointer;
            display:block;
        }

        nav{
            position:fixed;;
            top:50px;
            left:0;
            width:100%;
            height:0;
            text-align:center;
            overflow:hidden;
            z-index:25;
            display:block;
        }

        nav.roll{
            height:100%;
        }

        nav ul{
            background-color: #00243e;
            display:block;
        }

        nav ul.roll{
            height:100%;
        }

        nav ul li{
            float:none;
            display:block;
        }

        nav ul li a{
            padding:15px 0 15px 0;
            border-top:0;
            font-size:20px;
            color:#FFFFFF;
        }

        nav ul li.active a{
            border-top:0;
        }

        .button a{
            padding:8px 40px 8px 40px;
            font-size:18px;
        }

        .box > a > span.tt p{
            font-size:14px;
        }

        #news-open{
            padding:40px;
        }

        .project{
            width:33%;
        }

        #page7 .button{
            bottom:50px;
            margin-left:-85px;
        }

        #project-select{
            padding:10px;
        }

        .selects{
            width:35%;
        }

        .checks{
            width:62.5%;
            padding-right:0;
        }

        .slider{
            width:0;
            display:none;
        }

        .controls{
            padding-right:20px;
            text-align:right;
        }

        #bar ul{
            width:100%;
        }

        .t5, .t6{
            display:none;
        }

        .detailbox{
            width:50%;
        }

        #con{
            display:none;
        }

        #vis{
            padding:150px 15px 0 15px;
        }

        .timeline{
            display:none;
        }

        .gallery ul{
            width:90%;
        }

        .gallery ul li{
            width:33.33%;
            height:140px;
            margin-bottom:20px;
            padding:0 10px 0 10px;
        }

        .gallery ul li > a{
            height:140px;
        }

        .gallery ul li > a > img{
            min-height:140px;
        }

        .gallery.big ul li{
            height:140px;
            margin-bottom:20px;
            padding:0 10px 0 10px;
        }

        .gallery.big ul li > a{
            height:140px;
        }

        .gallery.big ul li > a > img{
            min-height:140px;
        }

        .unit-text{
            width:80%;
        }

        .text h2{
            margin-bottom:30px;
        }

        .standards{
            width:90%;
        }

        .standards-text{
            width:100%;
            margin-bottom:60px;
            padding-right:0px;
        }

        .standards-img{
            width:60%;
        }
}

@media (max-width: 992px) {
        .cnt{
            width:95%;
        }

        #page2 h2{
            margin:40px 0 40px 0;
        }

        .block{
            width:100%;
            margin-bottom:30px;
            padding-bottom:40px;
        }

        .block#block2{
            width:100%;
        }

        .block .image{
            height:auto;
        }

        .block h3{

        }

        .block p{
            padding:20px;
        }

        .block .button{
            left:35%;
            right:35%;
        }

        .form{
            width:95%;
        }

        .form-left{
            width:100%;
            padding-right:0;
        }

        .form-right{
            width:100%;
        }

        .icons#icons1{
            width:100%;
        }

        .icons#icons2{
            width:100%;
        }

        #gallery ul li{
            height:120px;
        }

        #vis{
            display:none;
        }

        .unit-text{
            width:100%;
        }
}

@media (max-width: 768px) {
    body{
        font-size: 14px;
    }

    .ff1{
        font-size:18px;
    }

    .ff2{
        font-size:14px;
    }

    #page1{
        min-height:600px;
    }

    .box{
        width:100%;
        min-height:120px;
        height:33%;

        -webkit-transition: height 1s;
        -moz-transition: height 1s;
        -ms-transition: height 1s;
        -o-transition: height 1s;
        transition: height 1s;
    }

    .box#box2{
        width:100%;
        border-left:0;
        border-right:0;
        height:34%;
    }

    #open.play .box{
        width:100%;
        height:0%;
    }

    #open.play .box#box2{
        width:100%;
        height:100%;
    }

    .box > a > span.title{
        top:60px;
        bottom:auto;
    }

    .box > a > span.title img{
        width:10%;
    }

    .box > a > span.tt{
        bottom:20px;
    }

    .box > a span.title h2 span{
        display:inline;
    }

    .box > a > span.tt p{
        display:none;
    }

    .box > a > span.tt span.btn{
        padding:7px 40px 7px 40px;
        border:1px solid #FFFFFF;
        font-size:14px;
        color:#FFFFFF;
    }

    .box > a > span.tt span.btn:hover{
        background-color: #FFFFFF;
        color:#292929;
    }

    .box > a:hover{
        background-color: rgba(0, 0, 0, 0.5);
    }

    .box > a:hover > span.title{
        bottom:0px;
    }

    .box > a:hover > span.title h2{
        color:#FFFFFF;
    }

    .box > a:hover > span.tt{
        bottom:20px;
    }

    .box a:hover > img{
        opacity:0;
    }

    .block .button{
        left:15%;
        right:15%;
    }

    .contact{
        width:100%;
        padding-bottom:0;
        margin-bottom:20px;
    }

    .contact.cc3{
        width:100%;
    }

    .contact#merchant{
        border-right:0;
    }

    .contact#investor{
        border-left:0;
    }

    #others{
        width:310px;
        padding-bottom:50px;
    }

    #others.oo3, #others.oo3 .others, #others.oo3 .others a{
        width:310px;
    }

    #others.oo4, #others.oo4 .others, #others.oo4 .others a{
        width:310px;
    }

    .others{
        margin-bottom:30px;
    }

    .others a{
        height:auto;
    }

    #gallery ul li{
        height:80px;
    }


    .project{
        width:50%;
    }

    #company{
        top:15%;
        margin-top:0;
    }

    #company h1{
        margin-bottom:30px;
    }

    #company ul li{
        width:100%;
        padding:0 25px 0 25px;
    }

    #company ul li span{
        margin-bottom:10px;
    }

    #page7 .button{
        bottom:20px;
        margin-left:-57px;
    }

    #submenu{
        background-image: none;
        height:105px;
        margin-bottom:50px;
    }

    .nv{
        width:100%;
        height:35px;
    }

    .nv#nv2{
        width:100%;
        border-left:0;
        border-right:0;
    }

    .nv > a{
        position:relative;
        width:100%;
        height:100%;
        line-height:100%;
        text-decoration:none;
        text-transform: uppercase;
        color:#FFFFFF;
        z-index:11;
        display:table;

        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        -ms-transition: all 0.5s;
        -o-transition: all 0.5s;
        transition: all 0.5s;
    }

    .nv > a > span.title{
        background-color: rgba(0, 0, 0, 0.7);
    }

    .nv > a > span.theme{
        background-image: none!important;
    }

    .nv > a:hover > span.title, .nv.active > a > span.title{
        background-color: rgba(0, 0, 0, 0.5);
    }

    #page9{
        height:auto;
    }

    #visual{
        background-image: none;
    }

    #visual-info{
        background-color: transparent;
    }

    #visual-info h1{
        color:#292929;
    }

    #visual-info p{
        color:#292929;
    }

    #visual-info .button{
        border:1px solid #292929;
    }

    #visual-info .button a{
        color:#292929;
    }

    #visual-info .button a:hover{
        background-color:#292929;
        color:#FFFFFF;
    }

    #project{
        display:none;
    }

    #transport ul li{
        width:100%;
        margin-bottom:30px;
        float:left;
    }

    #transport ul li img{
        margin-bottom:15px;
    }

    #transport ul li h3{
        margin-bottom:15px;
        font-weight:bold;
    }

    #transport .mobile{
        display:block;
    }

    #project-info{
        display:none;
    }

    #sale{
        padding:0;
    }

    #details{
        padding:0 0 0 0;
    }

    #details > h2{
        margin-bottom:40px;
    }

    #bar{
        display:none;
    }

    #filter{
        display:none;
    }

    .detailbox{
        width:90%;
        margin:0 auto;
        float:none;
        display:block;
    }

    .dev{
        width:100%;
        height:300px;
    }

    .dev > a{
        height:300px;
    }

    .dev > a > img{
        min-height:300px;
    }

    .dev > a > span.filter{
        height:300px;
    }

    .unit{
        width:100%;
    }

    .unit-text{
        width:60%;
        margin-bottom:40px;
    }

    .unit-text table td{
        min-width:80px;
        padding-right:10px;
    }

    .unit-image{
        width:100%;
        margin-bottom:40px;
        float:none;
    }

    .unit-contact{
        margin:0 auto;
        float:none;
    }

    .unit-contact .button{
        width:100%;
        margin-bottom:30px;
    }

    .new{
        width:100%;
        height:auto;
        margin-bottom:15px;
        float:none;
    }

    .new.even{
        margin-right:0;
    }

    .new img{
        width:100%;
        float:none;
        display:block;
    }

    .new-text{
        position:relative;
        width:100%;
        height:auto;
        padding:15px 15px 60px 15px;
        float:none;
    }

    .new-text .vice{
        position:absolute;
        left:15px;
        bottom:15px;
    }

    #new-container{
        width:100%;
        padding-bottom:0;
    }

    #new{
        width:100%;
        height:auto;
    }

    #new-text{
        width:100%;
        padding:15px;
        float:none;

    }

    #new-text > img{
        width:100%;
        margin-right:0;
        margin-bottom:20px;
        float:none;
    }

    #new-text h2{
        margin:0;
        margin-bottom:20px;
        font-size:16px;
    }

    #new-text h3{
        margin:0;
        margin-bottom:20px;
        font-size:16px;
    }

    #new-text p{
        margin:0;
    }

    #new-text p img{
        width:100%;
    }

    .standards-img{
        width:80%;
    }
}

@media (max-width: 480px) {
        header .cnt{
            width:calc(100% - 20px);
        }

        #logo{
          left:0;
        }

        #logo img, header.smaller #logo img{
            height:35px;
        }

        #logo2{
            left:160px;
            right:auto;
        }

        #logo3{
            display:none;
        }

        #clients{
            right:50px;
        }

        .box > a > span.title img{
            width:15%;
        }

        .button a{
            padding:5px 20px 5px 20px;
            font-size:14px;
        }

        #social{
            width:61px;
            padding:30px 0 10px 0;
        }

        #social li{
            margin:0;
            margin:0 auto;
            margin-bottom:20px;
        }

        #gallery{
            padding-bottom:0;
        }

        #gallery ul li{
            width:100%;
        }

        #gallery ul li.mid{
            width:100%;
            border-left:0;
            border-right:0;
        }

        #finance ul li{
            width:100%;
            padding:15px;
            padding-bottom:25px;
            border-right:0;
            border-bottom:1px solid #723c83;
        }

        #finance ul li:last-child{
            border-bottom:0;
        }

        .icons#icons1 ul li{
            width:100%;
        }

        #others{
            width:100%;
        }

        #others.oo3, #others.oo3 .others, #others.oo3 .others a{
            width:100%;
        }

        #others.oo4, #others.oo4 .others, #others.oo4 .others a{
            width:100%;
        }

        .others{
            width:100%;
        }

        .contact img{
            width:100%;
        }

        footer span{
            position:static;
            width:100%;
            padding:5px 0 5px 0;
            display:block;
        }

        footer span:last-child{
            text-align:left;
        }

        .project{
            width:100%;
        }

        .t3{
            display:none;
        }

        .box > a > span.title img{
            width:20%;
        }

        .unit-text{
            width:90%;
        }

        .unit-image img{
            left:-30%;
            width:160%;
        }

        #pricelist{
            width:100%;
            overflow-x:visible;
        }

        #pricelist table{
            max-width:480px;
            width:100%;
        }

        .text h2{
            margin-bottom:0;
        }

        .standards-img{
            width:100%;
        }

        .gallery ul li{
            width:50%;
            height:140px;
            margin-bottom:10px;
            padding:0 5px 0 5px;
        }

        .gallery ul li > a{
            height:140px;
        }

        .gallery ul li > a > img{
            min-height:140px;
        }
}