.box-title { font-weight: bold; background-color: var(--main-color); color: #333; font-size: 1em; padding: 8px 10px 6px; box-shadow: 0 0 3px #BBB; margin-top: 10px; }
.box-title.solar-menu { padding: 6px 10px; }
.box-title.smaller { margin-top: 20px; display: inline-block; float: left; position: relative; box-shadow: unset; text-transform: uppercase; }
.box-title.smaller:after { content: ""; display: inline-block; height: 100%; position: absolute; top: 0; right: -18px; width: 18px; background: transparent url("../images/topic-title-right.gif") no-repeat top left; background-size: 100% 100%; }

.post-content, .post-detail { border-collapse: separate; border-spacing: 0; width: 94%; margin: 0 auto; }
.post-content .main-content .box-title { text-transform: uppercase; font-size: 1.2em; padding: 10px; }
.post-content .main-content .box-title a { color: inherit; }
/* .post-content .col { background-color: #DDD; } */
.post-content .col.min-hide { background-color: transparent; padding: 0; }
.post-content .basic .col { text-align: left; padding: 5px; }
.post-content .basic h3 { margin-bottom: 10px; padding-bottom: 10px; text-transform: uppercase; }
.post-content .basic .price { background-color: var(--main-color); font-weight: bold; padding: 7px 20px; box-shadow: 0 0 2px #333; }
.post-content label { font-weight: bold; font-size: 1.1em; min-width: 100px; }
.post-content .basic label { margin: 0; }
.post-content .basic table { border: 0; }
.post-content .basic tr td { padding: 10px 0; border: 0; vertical-align: top; }
.post-content .basic tr td:last-child { text-align: right; width: 70%; }
.post-content .basic .slider-container { width: 100%; position: relative; overflow: hidden; }
.post-content .basic .slider-container:before { display: block; content: ""; padding-top: 66.666%; }
.post-content .basic .main-image { position: absolute; top: 0; left: 0; width: 100%; height: 100% !important; }
.post-content .basic .main-image .square-image:before { padding-top: 66.666%; }
.post-content .basic .main-image ul li { height: 100% !important; background-color: #000; }
.post-content .basic .main-image iframe { width: 100% !important; height: 100% !important ; border: 0; }
.post-content .basic .main-image video { width: 100%; height: 100%; outline: 0; }

.post-content .basic .slider-container .controls { position: absolute; top: 5px; right: 5px; }
.post-content .basic .slider-container .controls .prevBtn, .post-content .basic .slider-container .controls .nextBtn { display: inline-block; background-color:  var(--main-color); color: #333; text-indent: -9999px; position: relative; width: 20px; height: 20px; text-align:center; margin-left: 5px; box-shadow: 0 0 3px #333; }
.post-content .basic .slider-container .controls .prevBtn:before, .post-content .basic .slider-container .controls .nextBtn:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 1em; content: "\f104"; color: #333; text-indent: 0; line-height: 20px; }
.post-content .basic .slider-container .controls .nextBtn:before { content: "\f105"; }

.post-content .basic .slider-thumbs { width: 100%; display: block; margin-top: 10px; }
.post-content .basic .slider-thumbs .thumb { display: inline-block; width: 18%; margin-right: 1%; height: auto; position: relative; overflow: hidden; }
.post-content .basic .slider-thumbs .thumb:before { content: ""; display: block; padding-top: 100%; }
.post-content .basic .slider-thumbs .thumb:hover { cursor: pointer; }
.post-content .basic .slider-thumbs .thumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.post-content .basic .slider-thumbs .thumb i { position: absolute; top: 0; left: 0; background-color: #CCC; color: #FFF; width: 100%; height: 100%; display: block; }
.post-content .basic .slider-thumbs .thumb i:before { font-size: 2em; line-height: 2.3em; text-align: center; display: inline-block; width: 100%; }

.box-content { padding: 10px 10px 0; background-color: #FAFAFA; border:2px solid var(--main-color); border-top: 0; box-shadow: 0 2px 3px #DDD; word-break:break-word; }
.box-content.ultilities a { width: 100%; font-size: 1.1em; padding: 10px 15px; text-align: center; white-space: nowrap; }
.box-content.table { border: 2.5px solid var(--main-color); box-sizing: border-box; }
table.box-content { border: 2.5px solid var(--main-color) !important; border-top: 0 !important;  }

.post-detail .col { text-align: left; padding: 0; }
.post-detail .table .col-lg-6 { padding: 0; }
.post-detail .table .box-content, .post-detail .table .box-content tr td { border: 2px solid var(--main-color); border-top: 0; }
.post-detail .table .box-content tr td { padding: 5px; text-align: right; }
.post-detail .table .box-content tr td label { width: 100%; text-align: left; font-weight: bold; }

.post-detail .table .box-content.contact { background: unset; margin-top: -1px; }
.post-detail .table .box-content.contact tbody { background-color: #FAFAFA; }
.post-detail .table .box-content.contact label { width: auto; min-width: unset; float: left; }
.post-detail .table .box-content.contact tr td { border-bottom: 2px solid transparent; border-top: 2px solid transparent; }
.post-detail .table .box-content.contact tr td.hover { text-align: center; padding: 7.5px; border-bottom:2px solid  var(--main-color); }
.post-detail .table .box-content.contact tr td.hover {  }
.post-detail .table .box-content.contact tr:last-child td {  border-bottom:1px solid var(--main-color); border-top:2px solid var(--main-color); }
.post-detail .table .box-content.contact tr:nth-last-child(2) td {  border-bottom:1px solid var(--main-color); } 
.post-detail .table .box-content.contact a { font-weight: bold; color: #333; }
.post-detail .table .box-content.contact a.phone { font-size: 1.2em; }
.post-detail .table .box-content.contact a.phone:hover { color:  var(--main-color); text-shadow: 0 0 1px #DDD; }
.post-detail .table .box-content.contact td.hover:hover {background-color:  var(--main-color); color: #333; }

.post-detail .map { border: 2.5px solid var(--main-color); border-top: 0; box-sizing:border-box; }

table.right-small-box { background-color: #333; border-collapse: separate; border: 0; margin-bottom: 1px; }
.right-small-box tr td { padding: 5px 5px 5px 10px; vertical-align: top; border: 0; position: relative; }
.right-small-box tr td:first-child { padding: 0; width: 30%; }
.right-small-box h5 { text-align: left; line-height: 1.5em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color:#FFF; overflow: hidden; margin: 0; text-transform: uppercase; }
.right-small-box .price { position: absolute; bottom: 5px; right: 5px; padding: 3px 5px; background-color: var(--main-color); color: #000; font-weight: bold; }
.right-small-box .square-image { border: 0; }
.right-small-box .square-image:before { padding-top: 80%; }

.img-checkbox { width: 20px; margin-top: -5px; vertical-align: middle; margin-right: 5px; }

.table.ultilities .col-sm-6 { text-align: left; line-height: 1.5em; padding: 5px; }
.table.ultilities .col-sm-6 span { font-weight: bold; font-size: 0.8em; display: block; margin-left: 28px; }
.map { width: 100%; height: 300px; }

.related { padding: 10px 0 0; border-top: 1px solid var(--main-color); }
.related table { border-collapse: collapse; margin: 0 0  5px; }
.related table tr td { padding: 0; background-color: #333; border: 0; color: #FFF; vertical-align: top; position: relative; z-index: 0; }
.related table tr td .square-image { border: 0; height: 100%; position:absolute; z-index: -1; }
.related table tr td:last-child { padding: 0 5px 0 10px; }
.related table tr td h2, .related table tr td h3 { font-size: 0.9em; }
.related table tr td h2 a, .related table tr td h3 a { color: var(--main-color); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-align: left; text-transform: uppercase; line-height: 1.3em; padding-top: 5px; font-size: 1em; }
.related table tr td h2:hover a, .related table tr td h3:hover a { color: var(--f-color); }
/* .related table tr td h2 a, .related table tr td h3 a { color: inherit; } */
.related table tr td .table { margin-top: 0; }
.related table tr td .table .col { padding: 0; }
.related table tr td .table .col:first-child { padding-right: 20px; }
.related table tr td .table .col:last-child { line-height: 2em; color: #BBB; }
.related table tr td .table .col.note div { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; line-height: 1.3em; word-break:break-word; }
.related table tr td .description { margin: 5px 0 0 0; font-size: 1em; display: none; }
.related table tr td .table .col .description.min-show { display: inline-block; }
.related table tr td .table .col .address { line-height: 1.5em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; }
.related table tr td .table .col .price { padding: 0 10px; background-color: var(--main-color); color: #333; font-weight: bold; }
.related table tr td .table .col .price.min-show { display: inline-block; padding: 0 3px; float: right; margin: 5px 0; font-weight: normal; line-height: 1.5em; }
.related table tr td .table .col a { color: var(--main-color); float: right; margin: 10px 10px 0 0; }
.related table tr td .table .col a:hover { color: var(--f-color); }
.related table tr td .table .col .min-hide, .related table tr td .table .col a { display: none; }

.post-content .col-lg-3 .box-title.facebook, .post-content .col-lg-3 .box-content.facebook { display: none; }

@media screen and (min-width: 568px){
	.table.ultilities .col-sm-6 { text-align: left; line-height: 2em; padding: 10px 20px; }
	
	.post-content .basic h2 { line-height: 1.3em; }
	
	.box-title { font-size: 1.2em; }
	.box-title.smaller { font-size: 1.1em; margin-top: 20px; margin-bottom: 0; }
	
	.related table { border-collapse: separate; border-spacing: 5px; margin-bottom: -5px; }
	.related table tr td .table .col .min-hide { display: inline-block; margin-right: 5px; }
	.related table tr td .table .col .min-hide i { margin-right: 5px; }
	.related table tr td .table .col .price.min-show { display: none; }
	.related table tr td .table .col .square { display: block !important; }
	.related table tr td .table .col a { display: inline-block; }
	.related table tr td .table { margin-top: 10px; }
	.related table tr td h3 { font-size: 1.2em; }
}

@media screen and (min-width: 768px){
	.post-content .basic h3 { font-size: 1.5em; border: 0; line-height: 1.3em; }
	
	.box-title.smaller { float: unset; display: block; }
	.box-title.smaller:after { display: none; }
	
	.related { border-top: 0; background-color: #ddd; padding: 7px 7px 5px; }
	.related table tr td h2 { font-size: 1.2em; }
	.related table tr td:last-child { padding: 8px; }
	.related table tr td .table .col .min-hide { margin-right: 10px; }
	.related table tr td .table .col.note.min-hide { display: block; margin-bottom: 10px; }
	.related table tr td .description { display: block; font-style: italic; color: #BBB; text-align: left; }
	.related table tr td .description a { float: right; color: var(--main-color); font-style: normal; }
	.related table tr td .description a:hover { color: var(--f-color); }
	.related table tr td .table .col .description.min-show { display: none; }
	.related table tr td .table .col .address { margin-left: 10px; display: inline-block; }
	.related table tr td .table .col .address i { display: inline-block; }
	
	.box-content.ultilities a { text-align: left; }
	
	.table.ultilities .col-sm-6 span { float: right; display: inline-block; }
}

@media screen and (min-width: 1020px){
	.post-content, .post-detail { border-spacing: 10px 0; width: 100%; }
	
	.post-detail .table .col-lg-6 { padding: 0 5px 0 0; }
	.post-detail .table .col-lg-6:last-child { padding: 0 0 0 5px; }
	
	.right-small-box .square-image:before { padding-top: 120%; }
	
	.related { padding-bottom: 12px; }
	.related table tr td .table .col .address { margin-left: 0; }
	
	
	.post-content .col-lg-3 .box-title.facebook, .post-content .col-lg-3 .box-content.facebook { display: block; }
}
