html, body {margin:0; padding:0; height:100%; font-family:Arimo;}
body {margin:0; padding:0; background:#fff;}
.wrapper {position:relative; float:left; min-height:100%; width:100%; font-size:14px; line-height:1.4; color:#000;}
.container {position:relative; float:left; width:100%;}
.contain {position:relative; width:1200px; margin:0 auto;}
.relative {position:relative; float:left; width:100%;}
.editable {min-height:20px; width:100%; line-height:1.6;}
.editable p {padding:0; margin:0; line-height:1.6;}
a {text-decoration:none; cursor:pointer;}
a.lightbox {width:auto;}
table {width:100%;}
table, tr, td {border-spacing:0; margin:0; padding:0;}

@font-face {
    font-family: 'ariasolidRegular';
    src: url('fonts/ariasolidRegular.eot');
    src: url('fonts/ariasolidRegular.eot') format('embedded-opentype'),
         url('fonts/ariasolidRegular.woff2') format('woff2'),
         url('fonts/ariasolidRegular.woff') format('woff'),
         url('fonts/ariasolidRegular.ttf') format('truetype'),
         url('fonts/ariasolidRegular.svg#ariasolidRegular') format('svg');
}


/* HEADER MENU */
.logo {position:relative; float:left; width:100%; text-align:center; padding:40px 0 20px 0;}
.logo a {font-family:'ariasolidRegular'; font-size:26px; color:#000; font-weight:bold;}

.menu {position:relative; float:left; width:100%; text-align:center; padding-bottom:40px;}
.menu ul {padding:0; margin:0; list-style:none; display: inline-block;}
.menu ul li {padding:0; margin:0; float:left;}
.menu ul li a {padding:0 10px; font-size:20px; font-family:'Muli'; color:#000;}
.menu ul li a:hover {border-bottom:1px solid #000;}
.menu ul li a.active {}

.home {position:relative; float:left; width:100%; text-align:center;}
.home .image {position:relative; float:left; display:inline-block; width:800px; margin-left:200px; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.home .txt {position:relative; float:left; width:800px; margin-left:200px; margin-top:10px; text-align:center; padding:5px 20px 20px 20px; background-color:#fff; box-sizing:border-box;}
.home_title {position:relative; float:left; width:800px; margin-left:200px; margin-top:20px; font-family:'ariasolidRegular'; font-size:14px; color:#000; font-weight:bold; text-align:center;}

.expander {position:relative; float:left; margin-left:50px; width:1100px; border:1px solid #000; background-color:#fff; box-sizing:border-box; display:none;}
.expander .slider {position:relative; float:left; padding:20px 0 160px 20px; width:549px; box-sizing:border-box;}
.expander .slider ul.bxslider {margin:0; padding:0;}

.expander .slider .bx-viewport, .expander .slider .bx-viewport li {height:529px !important; width:529px !important;}

.expander .slider ul.bxslider li {width:100%; background-size:contain; background-position:center center; background-repeat:no-repeat;}
.expander .details {position:relative; float:right; width:549px; padding:20px 20px 160px 20px; box-sizing: border-box;}
.expander .close {position:absolute; width:40px; height:40px; top:10px; right:10px; cursor:pointer; background:#fff; z-index:1;}

.expander .close::before,
.expander .close::after {content: ''; position:absolute; width:100%; top:0%; height:1px; margin-top:20px; background:#555; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); transform:rotate(45deg);}
.expander .close::after {-webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); transform:rotate(-45deg);}
.expander .close:hover::before,
.expander .close:hover::after {background:#000;}

.expander .details .title {position:relative; float:left; width:100%; margin:40px 0 10px 0; font-family:'Muli'; font-size:28px; color:#000;}
.expander .details .text {position:relative; float:left; width:100%; font-size:16px; font-family:'Muli'; color:#000;}

.expander .bxpager {position:absolute; float:left; clear:left; bottom:0; width:100%; margin:0 20px 20px 20px; box-sizing:border-box;}
.expander .bxpager a {position:relative; float:left; display:inline-block; width:10%; margin-right:.8%; margin-top:.8%; background-size:cover; background-position:center center;}

.gal {position:relative; float:left; width:100%; box-sizing:border-box;}
.gal .image {position:relative; float:left; width:31%; margin:1%; background-size:cover; background-position:center center; cursor:pointer;}

.editable {font-size:16px; font-family:'Muli'; color:#000;}
.txt_title {position:relative; float:left; width:100%; margin-bottom:20px; font-family:'ariasolidRegular'; font-size:20px; color:#000; font-weight:bold; text-align:center;}


/* MOBILE CSS */
@media screen and (max-width: 1320px) {
    
    .wrapper {min-width:1000px;}
	.contain {width:920px;}
    
    .home .image {margin-left:60px;}   
    .home .txt {margin-left:60px;}
    .home_title {margin-left:60px;}
    
    .expander {width:900px; margin-left:10px;}
    .expander .slider {width:449px; padding-bottom:140px;}
    .expander .slider .bx-viewport, .expander .slider .bx-viewport li {height:429px !important; width:429px !important;}
    .expander .details {width:449px; padding-bottom:140px;}
    .expander .details .title {margin:40px 0 30px 0; font-size:20px;}
    .expander .bxpager a {margin-right:.7%; margin-top:.7%;}
}

@media screen and (max-width: 1024px) {

    .wrapper {min-width:700px;}
	.contain {width:680px;}

    .expander {width:680px; margin-left:0px;}
    .expander .slider {width:339px; padding-bottom:120px;}
    .expander .slider .bx-viewport, .expander .slider .bx-viewport li {height:319px !important; width:319px !important;}
    .expander .details {width:339px; padding-bottom:120px;}
    .expander .bxpager a {margin-right:.6%; margin-top:.7%;}
    
    .home .image {width:600px; margin-left:40px;}   
    .home .txt {width:600px; margin-left:40px;}
    .home_title {width:600px; margin-left:40px;}
}

@media screen and (max-width: 768px) {
    
    .wrapper {min-width:420px;}
	.contain {width:400px;}
    
    .home .image {width:400px; margin-left:0px;}   
    .home .txt {width:400px; margin-left:0px;}
    .home_title {width:400px; margin-left:0px;}
    
    .menu {padding-bottom:20px;}
    .menu ul {border-top:1px solid #000; border-bottom:1px solid #000; padding:10px 0;}
    .menu ul li {width:100%; margin:5px 0;}
    .menu ul li a {font-size: 24px;}
    .menu ul li a:hover {text-decoration:none;}
    
    .expander {width:400px;}
    .expander .slider {width:378px; margin-top:40px; padding-bottom:5px;}
    .expander .slider .bx-viewport, .expander .slider .bx-viewport li {height:359px !important; width:359px !important;}
    .expander .details {float:left; width:358px; box-sizing:initial; padding-bottom:20px;}
    .expander .details .title {width:378px; margin:0 0 20px 0;}
    
    .expander .bxpager {position:relative; margin:0 20px;}
    .expander .bxpager a {width:28.7%; margin-right:2%; margin-top:.5%;}
}

@media screen and (max-width: 480px) { 
    .wrapper {min-width:300px;}
	.contain {width:280px;}

    .home .image {width:280px;}   
    .home .txt {width:280px;}
    .home_title {width:280px;}
    
    .expander {width:280px;}
    .expander .slider {width:258px; margin-top:40px; padding-bottom:5px;}
    .expander .slider .bx-viewport, .expander .slider .bx-viewport li {height:239px !important; width:239px !important;}
    .expander .details {width:238px; float:left; box-sizing:initial; padding-bottom:20px;}
    .expander .details .title {width:258px; margin:0 0 20px 0;}
    
    .expander .bxpager {position:relative; margin:0 20px;}
    .expander .bxpager a {width:27%; margin-right:2%; margin-top:.5%;}
}