@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.2.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

.gallery-items {font-size:0; padding:0px; text-align:center;}
.gallery-items-column{display: inline-block;}
.gallery-item {display: inline-block; vertical-align: top; -webkit-transition: height 500ms ease; -o-transition: height 500ms ease; transition: height 500ms ease;}

.gallery-expander {position: absolute; left: 0; right: 0; overflow: hidden; max-height: 0; -webkit-transition: max-height 500ms ease; -o-transition: max-height 500ms ease; transition: max-height 500ms ease;}

.gallery-contents {position: relative;}
.gallery-contents:after {display: block; position: absolute; bottom: 0px; left: 50%; margin-left: -30px; width: 0; height: 0; content: ''; border-left: 30px solid transparent; border-right: 30px solid transparent; border-bottom-style: solid; border-bottom-width: 0px; -webkit-transition: border-bottom-width 500ms ease; -o-transition: border-bottom-width 500ms ease; transition: border-bottom-width 500ms ease;}

.gallery-item.active .gallery-contents:after {border-bottom-width:10px;}
.gallery-item {text-align: left; font-size: 25px; margin: 0 2px; padding: 10px 0;}
.gallery-item .thumbnail {position: relative; width:175px; overflow: hidden; cursor: pointer; margin:0px; padding:0px; border:none; border-radius:0px;}
.gallery-item .thumbnail > img {width:100%;}
.gallery-item .title {font-family:'Quattrocento Sans', sans-serif; font-size:14px; color:#fff; width:175px; background:#262626; text-align: center; padding:15px 10px;}
.gallery-item .title span {font-size:12px; color:#0a9dd9; display:block; margin:2px 0 0; line-height:14px; min-height:28px;}
.gallery-item .title-expander {font-family:'Quattrocento Sans', sans-serif; font-size:22px; color:#1B9CD8; text-transform:uppercase;}
.gallery-item .title-expander span {font-size:16px; color:#555; display:block; margin:2px 0 0;}

.gallery-contents:after { border-bottom-color: #fff; }

.gallery-expander {background: #fff;}
.gallery-expander-contents {margin: 0 auto; width: 1000px; padding: 20px 0;}
.gallery-expander-contents div.close {top:10px; right:20px; margin-bottom:10px; margin-right:10px;}
.gallery-expander-contents div.title {font-weight: 500; color: #D28A3C;}
.gallery-expander-contents div.contents {margin-top:10px; padding:10px 0; font-size:16px; line-height:22px; color:#797262; text-align:justify;}
.gallery-expander-contents div.contents ul {padding:0 0 0 15px;}
.gallery-expander-contents div.contents ul li {list-style:none; margin:0 0 15px;}
.gallery-expander-contents div.contents ul li:before{font-family: "FontAwesome"; font-size:8px; color:#1B9CD8; content:'\f111'; vertical-align:top; position:absolute; margin:0 0 0 -15px;}
.gallery-expander-contents div.contents ul li#sub:before{font-family: "FontAwesome"; font-size:10px; color:#1B9CD8; content:'\f054'; vertical-align:top; position:absolute; margin:0 0 0 -15px;}
.gallery-expander-contents div.image > img {width: 100%; display: block;}

@media (min-width: 640px) and (max-width: 999px) {
	.gallery-expander-contents { width: 640px; }
}

@media (max-width: 639px) {
	.gallery-expander-contents { width: 100%; }
	.gallery-item .thumbnail {width:130px;}
	.gallery-item .title {width:130px;}
}

.gallery-expander-contents:after {clear: both; display: table; content: '';}
.gallery-expander-contents > div.col {float: left; width: 480px;}

@media (min-width: 640px) and (max-width: 999px) {
	.gallery-expander-contents > div.col { width: 310px; }
}

@media (max-width: 639px) {
	.gallery-expander-contents > div.col {float: none; padding: 25px 20px 0; width: auto;}
}

.gallery-expander-contents > div.col + div.col { margin-left: 40px; }

@media (min-width: 640px) and (max-width: 999px) {
	.gallery-expander-contents > div.col + div.col { margin-left: 20px; }
}

@media (max-width: 639px) {
	.gallery-expander-contents > div.col + div.col { margin-left: 0px; }
}