/* video, embed, object */

.responsive { position:relative; padding-bottom:56.25%; height:0; overflow:hidden; }                                 
.responsive iframe, .video-responsive object, .video-responsive embed { position:absolute; top:0; left:0; width:100%; height:100%; }

/* clear */

.clear:after {content: ".";	display: block; height: 0; clear: both; visibility: hidden;	}
.clear {display: inline-block;}
/* Hide from IE Mac \*/
.clear {display: block;}
* html .clear {height: 1px;}
/* End hide from IE Mac */

/* doclist */

.doclist {margin: 1em 0em;}
.doclist li {margin: .3em 0em; padding-left: 30px;}
.doclist .docnote {color: gray; padding-left: 5px; font-size:.8em;}
.doclist .docpdf {background: url("img/icons/ico-pdf.png") no-repeat; line-height: 22px;}
.doclist .docdoc {background: url("img/icons/ico-doc.png") no-repeat; line-height: 22px;}
.doclist .docxls {background: url("img/icons/ico-xls.png") no-repeat; line-height: 22px;}
.doclist .docrtf {background: url("img/icons/ico-rtf.png") no-repeat; line-height: 22px;}
.doclist .doctxt {background: url("img/icons/ico-txt.png") no-repeat; line-height: 22px;}

/* errors */

#alerts {margin-bottom: 1em;}
#alerts .alert ul li {background: none; padding: 0px;}
.alert {padding: 0.5em 1em; color: #fff;}
.error {background: red;}
.msg {background: green;}
.clause {border-top: 1px solid tomato; padding-top: 0.5em;}
.clauseData {background: tomato; padding: 0.5em 1em; font-size: 0.8em; color: #ffcccc;}

#dbg {position: fixed; right: 10px; top: 10px; font-size: 11px; font-family: Courier; background: #ffff99; padding: 15px; text-align: left; z-index: 999; max-width: 500px; max-height: 100vh; overflow: auto; color: #333;}
#dbg a {position: absolute; text-decoration: none; height: 20px; line-height: 22px; width: 20px; text-align: center; background: darkorange; color: #fff; font-weight: bold; font-size: 20px; right: 0px; top: 0px; z-index: 1000; color: #333;}
#dbg a:hover {background: transparent; color: #333;}

/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{outline:0; font-size: 13px;}
    #cboxContent{margin-top:20px;background:#000; margin-bottom: 40px;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{border:5px solid #000; background:transparent; padding: 28px;}
        #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc; line-height: 1.4em;}
        #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc; line-height: 1.4em;}
        #cboxLoadingGraphic{background:url(img/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
        
        #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}                                                                        
        #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(img/controls.png) no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:bottom left;}
        #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(img/controls.png) no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
        #cboxNext:hover{background-position:bottom right;}
        #cboxClose{position:absolute; top:10px; right:0px; display:block; background:url(img/controls.png) no-repeat top center; width:38px; height:19px; text-indent:-9999px;}
        #cboxClose:hover{background-position:bottom center;}
		
/* tabs */

.tabs { padding-top: 41px; position: relative; margin: 20px 0px;}
.t-hide { display: none; }
.t-panel { border-top: 1px solid #ddd; padding: 0em 0em; padding-top: .5em}                                                                  
.t-active .t-nav {height: 42px; position: absolute; top: 0px; margin: 0px; z-index: 20;}
.t-nav {list-style-type: none; margin: 0px;}
.t-nav li {float: left; margin: 0px; margin-right: 1px; border: 1px solid #ddd; background: #efefef; padding: 0px;}
#page .t-nav li:before {content: "";}
.t-nav a {float: left; padding: 0em 1em; line-height: 40px; text-decoration: none; color: #333;}
.t-nav a:hover {background: #fff;}
.t-disabled a {color: silver;}
.t-disabled a:hover {background: #efefef;}
.tabs .selected, .fake-tabs .selected {border-bottom: 1px solid #fff; background: #fff;}

#page .fake-tabs {border-bottom: 1px solid #dcdcdc; position: relative; margin-left: 0px;}
#page .fake-tabs li {float: left; background: none; height: 60px; overflow: visible; padding: 0px; border: 1px solid #dcdcdc; margin-right: 1px; position: relative; margin-bottom: -1px;}
#page .fake-tabs li:before {content: "";}
#page .fake-tabs a {display: block; line-height: 20px; padding: 10px 15px 0px 15px;}
#page .fake-tabs li.active {border-bottom: 1px solid #fff;}
#page .fake-tabs li.active a {text-decoration: none; color: #333; font-weight: bold;}

/* .t-panel { border: 1px solid #ddd; padding: 1.5em 1.5em;} pro full framed panel */

#page .t-nav li {background: none; padding: 0px;}

/* counter */

.counter {margin-bottom: 30px; }

.counter a {text-decoration: none;}
	.cnt-all {font-size: 0.9em; color: #808080; float: right; height: 30px; line-height: 30px; background: #efefef; padding: 0px 15px;}
	.cnt-line {float: right; height: 30px;}
	.cnt-num, .cnt-button {background: #efefef; float: left; height: 30px; line-height: 30px; width: 30px; padding: 0px; margin-right: 5px; 
		text-align: center; color: #808080; position: relative;}
	.cnt-num:hover, .cnt-button:hover {background: transparent; color: #000;}
	.cnt-division {float: left; display: none;}
	
	.cnt-tail {display: none;}
	.cnt-fake {background: transparent;}
	.cnt-fake-next {width: 7px;}
	.cnt-fake-nextnext {width: 14px;}

	.cnt-stepper:after {position: absolute; top: 0; right: 0; width: 100%; height: 100%; text-align: center; font-size: .8em; opacity: .5; background-repeat: no-repeat; background-position: center center;}
	
	.cnt-line .cnt-back:after {content: "◄"; }
	.cnt-line .cnt-backback:after {content: "◄◄"; letter-spacing: -4px; margin-right: 4px;}
	.cnt-line .cnt-next:after {content: "►"; }
	.cnt-line .cnt-nextnext:after {content: "►►"; letter-spacing: -4px; margin-left: 4px;}
	
	.cnt-emph {background:#9CC801; color: #fff;}
	.cnt-emph:hover {background: #ddd; color: #aaa;}
	
	

/* buttons */

.btn, .button, .submit {background: #333;  }
input.btn, input.button, input.submit { width: auto; overflow: visible; border: 0px solid;}
#page .btn, #page .button, #page .submit {padding: 0em 1em; line-height: 34px; display: inline-block; text-decoration: none; font-size: 12px; text-transform: uppercase; letter-spacing: .1rem; color: #fff; font-weight: bold; margin: 0px 2px 2px 0px; vertical-align: top; margin-right: 5px;}
#page .btn:hover, #page .button:hover, #page .submit:hover, #page .top-slide .btn:hover {cursor: pointer; background: transparent; color: #333;}

#page .top-slide .btn {color: #bca082;}

/* gallery */

.gal {display: grid; grid-template-columns: repeat(5, 1fr); margin: 1.5rem 0rem;}
.gal > a {border: 2px solid transparent; position: relative; }
.gal > a:hover {border-color: #8e9ea8;}
.gal > a img {display: block; width: 100%; height: auto;}

/* cols */

.cols {display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap; box-sizing: border-box;}
.cols > * {box-sizing: border-box; padding: 0; margin-bottom: 15px;}

.col1  {flex: 1  8.33%; max-width:  8.33% }
.col2  {flex: 1 16.66%; max-width: 16.66% }
.col3  {flex: 1 24.99%; max-width: 24.99% }
.col4  {flex: 1 33.32%; max-width: 33.32% }
.col5  {flex: 1 44.65%; max-width: 44.65% }
.col6  {flex: 1 49.98%; max-width: 49.98% }
.col7  {flex: 1 58.31%; max-width: 58.31% }
.col8  {flex: 1 66.64%; max-width: 66.64% }
.col9  {flex: 1 74.97%; max-width: 74.97% }
.col10 {flex: 1 83.30%; max-width: 83.30% }
.col11 {flex: 1 91.63%; max-width: 91.63% }
.col12 {flex: 1   100%; max-width:   100% }

.cols-stack {width: 100%; display: block;}
#page .cols-stack > * {display: inline-block; flex: none; vertical-align: top; margin: 15px 0;}

.cols-stack .col1  {width:  8.33%; max-width:  8.33% }
.cols-stack .col2  {width: 16.66%; max-width: 16.66% }
.cols-stack .col3  {width: 24.99%; max-width: 24.99% }
.cols-stack .col4  {width: 33.32%; max-width: 33.32% }
.cols-stack .col5  {width: 44.65%; max-width: 44.65% }
.cols-stack .col6  {width: 49.98%; max-width: 49.98% }
.cols-stack .col7  {width: 58.31%; max-width: 58.31% }
.cols-stack .col8  {width: 66.64%; max-width: 66.64% }
.cols-stack .col9  {width: 74.97%; max-width: 74.97% }
.cols-stack .col10 {width: 83.30%; max-width: 83.30% }
.cols-stack .col11 {width: 91.63%; max-width: 91.63% }
.cols-stack .col12 {width:   100%; max-width:   100% }

.col-inner {background: #fff; padding: 30px 5%;}


.w-slide {position: relative; min-height: 100vh; overflow: hidden; }

.w-slide {display: grid; grid-template-columns: 1fr 1fr; position: relative;}
.w-slide .top {position: relative; line-height: 0px;}
.w-slide .top img {object-fit: cover; object-position: 50% 50; height: 100%; width: 100%; position: absolute;}
.w-slide .top .copy {font-size: 10px; position: absolute; bottom: 10px; color: #fff; left: 50%; transform: translateX(-50%); opacity: .6; letter-spacing: .02rem;}
.w-slide--rtl .top {grid-area: 1 / 2 / 1 / 2;}
.w-slide--rtl .w-slide__pg {grid-area: 1 / 1 / 1 / 1;}
.w-slide__pg {box-sizing: border-box; padding: 10% 17% 10% 17%; }

.btn-line img {height: 36px; width: auto;}
.btn-line .logo-big img {height: 100px; width: auto;}

@media all and (max-height: 800px) {
	html {font-size: 16px;}
	.w-slide {grid-template-columns: 1fr 1fr 1fr; border-bottom: 1px solid #dcdcdc;}
	.w-slide--ltr .top {grid-area: 1 / 1 / 1 / 1;}
	.w-slide--ltr .w-slide__pg {grid-column: 2 / span 2;}
	.w-slide--rtl .top {grid-area: 1 / 3 / 1 / 3;}
	.w-slide--rtl .w-slide__pg {grid-column: 1 / span 2;}
	.w-slide__pg {box-sizing: border-box; padding: 6% 12% 6% 12%; }
}

@media all and (max-width: 800px) {
	html {font-size: 16px;}
	.w-slide {min-height: 0; grid-template-columns: 1fr; border-bottom: 0px solid;}
	.w-slide--ltr .top {grid-area: 1 / 1 / 1 / 1;}
	.w-slide--ltr .w-slide__pg {grid-area: 2 / 1 / 2 / 1;}
	.w-slide--rtl .top {grid-area: 1 / 1 / 1 / 1;}
	.w-slide--rtl .w-slide__pg {grid-area: 2 / 1 / 2 / 1;}
	.w-slide__pg {box-sizing: border-box; padding: 2.5% 8.5% 2.5% 8.5%; }
	
}

.w-quote {position: relative; overflow: hidden; box-sizing: border-box; padding: 5% 8.5%; background: url("/img/bg-bot.jpg") no-repeat center center; background-size: cover;}
.text .w-quote blockquote {margin: 0; padding: 0; background: transparent; column-count: 3; column-gap: 3%;}

@media all and (max-width: 800px) {
	.text .w-quote blockquote {column-count: 1}
	.w-quote {background: url("/img/bg-tile.jpg") repeat;}
}

@keyframes fadein {
	from {opacity: 0;}
	to {opacity: 1}
}

.w-cat {position: relative; overflow: hidden; box-sizing: border-box; padding: 5% 8.5% 6%; background: url("/img/bg-top-tile.jpg") repeat; display: none;}
.w-cat > h2 {margin-top: 0;}
.w-cat:target {display: block; animation: fadein 1s;}
.text .w-cat__list { padding: 0; margin: 0; display: grid; grid-template-columns: repeat(5, 1fr); grid-column-gap: 3%; grid-row-gap: 1rem; grid-auto-rows: 1fr; }
.text .w-cat__listitem:before {content: "";}

.w-cat__listitem {text-align: center; background: rgba(0,0,0,.1); border-radius: 10px; display: flex;}
.w-cat__content {margin: auto;}
.w-cat__title {text-align: center;}
.w-cat__subtitle {display: block; font-weight: normal; opacity: .5; font-size: .75rem}
.w-cat__link {font-size: .75rem; display: block; border-top: 1px solid rgba(0,0,0,.1)}

.w-cat__list::before {
  content: '';
  width: 0;
  padding-bottom: 60%;
  grid-row: 1 / 1;
  grid-column: 1 / 1;
}

.w-cat__list > *:first-child {
  grid-row: 1 / 1;
  grid-column: 1 / 1;
}