@font-face {
    font-family: "TheinhardtHeavy";
    font-style: normal;
    src: url("../fonts/Theinhardt/TheinhardtHeavy.otf") format("opentype");
}
@font-face {
    font-family: "grt";
    font-style: normal;
    src: url('../fonts/modelica/Thin/BwModelica-Thin.eot');
	src: local('☺'), url('../fonts/modelica/Thin/BwModelica-Thin.woff') format('woff'), url('../fonts/modelica/Thin/BwModelica-Thin.ttf') format('truetype'), url('../fonts/modelica/Thin/BwModelica-Thin.svg') format('svg');
}
@font-face {
    font-family: "gr";
    font-style: normal;
    src: url('../fonts/modelica/Regular/BwModelica-Regular.eot');
	src: local('☺'), url('../fonts/modelica/Regular/BwModelica-Regular.woff') format('woff'), url('../fonts/modelica/Regular/BwModelica-Regular.ttf') format('truetype'), url('../fonts/modelica/Regular/BwModelica-Regular.svg') format('svg');
}
@font-face {
    font-family: "grb";
    font-style: normal;
    src: url('../fonts/modelica/Extrabold/BwModelica-ExtraBold.eot');
	src: local('☺'), url('../fonts/modelica/Extrabold/BwModelica-ExtraBold.woff') format('woff'), url('../fonts/modelica/Extrabold/BwModelica-ExtraBold.ttf') format('truetype'), url('../fonts/modelica/Extrabold/BwModelica-ExtraBold.svg') format('svg');
}


/* FRONTEND CSS
*********************************************/
html {/* scrollbar fix (prevent ugly left pull for lower content sites) */overflow-y: scroll;}
html,body { font-family: "gr"; background-color:#fff}
footer a.iliil { font-family: "TheinhardtHeavy"; color:#666}
a {color:#888}
h1.head {padding:6rem 0}
.mid-header {min-height:300px }
h4.sectitle {font-family: "grb";color:#999}
section {padding:3rem 0}

.modal-backdrop {z-index: auto;}
.svg-container.interact:hover svg {fill: #ff0098;}
#vida-gallery .slick-slide {opacity: .2;cursor: pointer;}
#vida-gallery .slick-current {cursor: zoom-in;}
.slick-active, #vida-gallery .slick-active {opacity: .5;}
.slick-current, #vida-gallery .slick-current {opacity: 1;}
.slick-current {cursor: move;}
.slick-slide {transition: all ease-in-out .3s;}
.img-fluid {max-width: 100%;height: auto;}
.slick-slide {transition: all ease-in-out .3s;}
.gal-item {margin: 0;display: table;}
.no-gutters {margin-right: 0;margin-left: 0;}
.d-flex {display: flex !important;}
.d-inline-block {display: inline-block !important;}
.align-self-center {align-self: center !important;}
.svg-container.interact {cursor: pointer;}
.svg-container {
    margin-top:1rem;
    display: block;
    margin-right: 12px;
    width: 3.4rem;
    height: 3.4rem;
    position: relative;
}

h1 {font-size: 46px;}
.mt-1 {margin-top:4px}
.mr-1 {margin-right:4px}
.pt-0 {padding-top:0}
.p-0 {padding:0}
.p-3 {padding: 1rem !important;}
.pr-3, .px-3 {padding-right: 1rem !important;}
.py-3 {padding-top: 1rem !important; padding-bottom: 1rem !important;}
.bcg-picture {
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
    position: absolute !important;
}
.bckgrn-layer {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    color: #fff;
    overflow: hidden;
}
.bckgrn-content {display: block;height: auto;position: absolute;color: #fff;}
.bckgrn-content-bl {bottom: 0;left: 0;right: 0;}
.lp-header-inner {position:relative;}
.lp-header-inner {height:350px; position:relative;}
.lp-header-inner-small {height:240px; position:relative;}
.lp-header-layer video {min-height:100%; min-width:100%}
.lp-header-edit {position:absolute; right:25px; top:25px;}
.lp-header-edit2 {position:absolute; right:25px; top:165px;}

/* app frameweork */
.flex-column {flex-direction: column}
.flex-row {flex-direction: row}
.py-3 {padding-top: 1rem; padding-bottom: 1rem}
.pb-1 {padding-bottom:.25rem}
.mb-3 {margin-bottom: 1rem;}
.mb-5 {margin-bottom:3rem}
.cck_page_form {max-width:600px;margin-left:auto; margin-right:auto;}
.cck_forms {margin-bottom: 2rem;}
.fileupload-buttonbar {margin-bottom: 1rem;}
.radios {display:flex}
.radios input {margin:0 1rem}
@media (min-width: 768px) {
    .flex-md-row  {flex-direction: row}
    .pr-md-1 {padding-right: .25rem}
    .pb-md-0 {padding-bottom:0}
}

@media (min-width: 768px) {
    h1 {font-size: 76px;}
    h2 {font-size: 46px;}
    .p-lg-5 {padding: 3rem !important;}
    .pl-xl-5, .px-xl-5 {padding-left: 60px !important;}
    .bckgrn-content-bl {right: 20%;}
    .lp-header-inner-small {height:180px;}
    .lp-header-inner {height:450px;}
    .story {font-size: 120%}
    .story p {margin-bottom:40px}
}
@media (min-width: 1200px) {
    .lp-header-inner {height:500px;}

}


.mgbottom25 {margin-bottom:60px;}
.login {color:#666; border:1px solid white; background-color:white;}
div.pagination {width:auto; text-align:center;display:block}
.pagination > li > a, .pagination > li > span {color:#ccc}
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
	background-color:black; border-color:black}
.rel {position:relative;} 
.abs {position:absolute;}
.fix {position:fixed;}
.no-margin {padding: 0;margin: 0;}
.mgb25 {margin-bottom:25px}
.overhide {overflow:hidden}
article {padding: 30px 0;}
.gray {background-color: #f8f8f8;}
.black {background-color: #000000;color:#fff}
.black a {color:#CCC}
.black a:hover {color:#FFF}
.dark {background-color:#666;color:white}
.newslabel {
    background-color: rgba(150, 150, 150, 0.5);
    color: #fff;
    font-size: 12px;
    height: 35px;
    margin-top: -35px;
    padding-left: 10px;
    padding-top: 5px;
    position: relative;
    text-transform: uppercase;
    width: 100%;
}
.text_h {color: #000000;font-size: 5em; font-family: "grb"; margin-bottom: 0;}
.navbar-default {border:none}
.navbar-default .navbar-nav > li > a, .navbar-default .navbar-brand {padding:0px 15px;line-height: 45px;font-size:16px;}
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover, .navbar-default  .navbar-brand:hover { background-color: transpare;color: #ccc;}
.navbar-header {height:80px;}
.navbar-toggle {margin-top:25px}
.keep-open-on-click {padding:15px}
.sslogo {font-family: "grb"; font-size:18px!important; line-height: 80px!important;}
.cantext { position:absolute;left:30%; right:30%; top:30%}
.myheader div { padding: 15% 0;}
.myheader.half div {padding: 8% 0;}
#admin-menu {padding:15px 0px; border-top: 1px solid #e7e7e7;}
.media-admin {width:400px}
.icotd {width:50px; text-align:center; vertical-align:middle!important;}
.worktypes-menu {padding-top:40px;padding-bottom:10px;}
.worktypes-menu a {display:inline-block; margin:0px 10px}
/* work*/
.dokumentace h2 {font-family: "grb";margin-bottom:25px}
.single-work {}

.single-work .work-inner {height: 420px;margin-bottom: 30px;overflow: hidden;background-color: black;position: relative;}
.single-work .work-inner .video-container {background-position: center top; background-size: cover;height: 100%; overflow: hidden;z-index:0; display:none}
.single-work .work-inner .work-img {background-position: center top; background-size: cover;height: 100%; overflow: hidden; z-index:2;}
#work-inner-play {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    width: 95px;
    height: 95px;
    margin: auto;
    z-index: 3;
    background-image: url(../images/arrow.png);
    background-repeat: no-repeat;
    cursor: pointer;
}

/* work list**/
.work-list {list-style-type: none; padding-left:0px;}
.work-list li {height: 350px;overflow: hidden;}
.work-list li a {dispay:block; }
.mosaic-holder {padding-left:15px; padding-right:15px}
.mosaic-holder .mosaic-item {
    min-height: 400px;
    position: relative;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    overflow: hidden;
}
.mosaic-holder .mosaic-item .modal { display: none;}
.mosaic-holder .mosaic-item.colored {background-color: #0f0f10;}
.mosaic-holder .mosaic-item.colored .title {color: #fef224;}
.mosaic-holder .mosaic-item.imaged .title,
.mosaic-holder .mosaic-item.imaged .short-tag { color: #fff;}
.mosaic-holder .mosaic-item.small {height: 300px; min-height: 300px;}
.mosaic-holder .mosaic-item:before {
	 -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease;transition: all 0.5s ease;
    z-index: 200;
    content: "";
    width: 100%;
    height: 100%;
    background-color: #fff;
    position: absolute;
    top: 0;
    opacity: 0;
}
.mosaic-holder .mosaic-item .meta {
	 -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 80%;
    height: 40%;
}
.mosaic-holder .mosaic-item .meta:before {
    right: 0;
    left: 0;
	-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;
    font-family: 'IcoMoon';
    top: -200%;
    content: "\e00d";
    color: #0f0f10;
    position: absolute;
    display: inline-block;
    text-align: center;
    font-size: 30px;
    line-height: 30px;
}
.mosaic-holder .mosaic-item .title { 
text-shadow: 1px 1px 1px #333;
    text-transform: capitalize;
    -webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;
	margin-top:15px;
    font-size: 28px;
    line-height: 37px;
    letter-spacing: -1px;
    font-family: "grb";
}
.mosaic-holder .mosaic-item .short-tag { 
	text-shadow: 1px 1px 1px #333;
    -webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;
    text-transform: uppercase;
    font-size: 16px;
    line-height: 16px;
    margin: 10px 0;
    
    color: #fef224;
}

.mosaic-holder .mosaic-item:hover {
    cursor: pointer;
}

.mosaic-holder .mosaic-item:hover .meta {z-index: 400;}
.mosaic-holder .mosaic-item:hover .meta:before {margin-top: -30px;top: 0;}
.mosaic-holder .mosaic-item:hover .meta:before {color: #0f0f10;}
.mosaic-holder .mosaic-item:hover .meta .title,
.mosaic-holder .mosaic-item:hover .meta .short-tag { color: #0f0f10; text-shadow: none;}
.mosaic-holder .mosaic-item:hover:before { opacity: 1;}
.mosaic-holder .mosaic-item:hover.colored:before {opacity: 1;}







/* forms*/
.cck_form_group_x .cck_form_group_x {border:1px solid#ccc; padding:15px; border-radius:7px; background-color:white; margin-bottom:15px }
.tab-content {padding:25px 0px; min-height:400px}
.form-buttons {padding:25px 0px}

.cform-message {padding: 6px 12px;border:1px solid #ccc; border-radius:4px; width:100%; margin-bottom:10px}
.cform-mail {display: inline-block; padding: 6px 12px; border:1px solid #ccc; border-radius:4px; margin-right:10px; width:70%}

/* MEDIA QUERIES
*********************************************/

/* Extra small devices (phones, less than 768px) */
/* No media query -> mobile first strategy */

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
.navbar-default .navbar-nav > li > a, .navbar-default .navbar-brand {line-height: 80px;}
.maintext p {font-size:22px;}	
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}

/* for higher resolutions (android and retina) */
@media screen and (-webkit-min-device-pixel-ratio: 1.5), screen and (max--moz-device-pixel-ratio: 1.5) {
  
}