/*!
 *
 *	Project:	FOX GALLERY
 *	Author:		Petr Urbanek - www.r4ms3s.cz
 *	Twitter:	@r4ms3scz
 *
 */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
    display: block;
}
audio, canvas, video {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}
audio:not([controls]) {
    display: none;
}
html, body {
    margin: 0;
    padding: 0;
}
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    line-height: 1;
    font-family: inherit;
}
html {
    font-size: 62.5%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%}
a:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}
a:hover, a:active {
    outline: 0;
}
sub, sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}
img {
    -ms-interpolation-mode: bicubic;
}
button, input, select, textarea {
    margin: 0;
    font-size: 100%;
    vertical-align: middle;
}
button, input {
    *overflow: visible;
    line-height: normal;
}
button::-moz-focus-inner, input::-moz-focus-inner {
    padding: 0;
    border: 0;
}
button, input[type="button"], input[type="reset"], input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button;
}
input[type="search"] {
    -webkit-appearance: textfield;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
}
textarea {
    overflow: auto;
    vertical-align: top;
}
p {
    margin: 0;
    font-size: 14px;
    font-size: 1.4pxrem;
    line-height: 20px;
    letter-spacing: 1px;
}
h1, h2, h3, h4, h5, h6 {
    margin: 0;
    padding: 0;
    font-weight: normal;
    text-rendering: optimizelegibility;
}
ul, ol {
    padding: 0;
    margin: 0;
}
ul ul, ul ol, ol ol, ol ul {
    margin-bottom: 0;
}
ul {
    list-style: none;
}
ol {
    list-style: none;
}
dl {
    margin-bottom: 0;
}
hr {
    margin: 0;
    border: 0;
}
strong {
    font-weight: bold;
}
em {
    font-style: italic;
}
abbr {
    font-size: 90%;
    text-transform: uppercase;
    border-bottom: 1px dotted #ddd;
    cursor: help;
}
small {
    font-size: 100%}
cite {
    font-style: normal;
}
* {
    -webkit-box-sizing: border-box;
    -khtml-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    *behavior: url(js/libs/boxsizing.htc);
}
html, body {
    height: 100%}
body {
    background: url(../img/footer-bg.png) center center repeat #5e5f5e;
    margin: 0;
    font-size: 14px;
    font-size: 1.4pxrem;
    line-height: 1;
    font-family: 'jaf-domus-titling-web', 'Arial CE', Arial, sans-serif;
    color: #555454;
}
a {
    color: #555454;
    text-decoration: none;
}
a:hover {
    color: #000;
}
.in {
    position: relative;
    margin: 0 auto 0;
    width: 960px;
    text-align: left;
}
.in-orange {
    background: #fdf3e9;
}
.page-magazine header {
    background: #8e83c8;
}
.page-magazine header h1 a {
    background-image: url(../img/logo-white.png);
}
.page-magazine header h1 a:hover {
    background-position: 0 -134px;
}
.page-magazine header nav>ul>li>a {
    color: #fff;
}
.page-magazine header nav>ul>li>a:hover, .page-magazine header nav>ul>li>a.act {
    font-weight: bold;
    color: #fff;
}
.page-gallery header {
    background: #fac063;
}
.page-gallery header h1 a {
    background-image: url(../img/logo-white.png);
}
.page-gallery header h1 a:hover {
    background-position: 0 -134px;
}
.page-gallery header nav>ul>li>a {
    color: #fff;
}
.page-gallery header nav>ul>li>a:hover, .page-gallery header nav>ul>li>a.act {
    font-weight: bold;
    color: #fff;
}
.page-gallery .gallery-list .gallery a:hover {
    background: #fff2d7;
}
.page-gallery .gallery-list .gallery span {
    color: #fac063;
}
.page-gallery .gallery-list .gallery i {
    background-image: url(../img/gallery-ico.orange.png);
}
header {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 162px;
    background: url(../img/header-white-bg.png) center center repeat #fafcfa;
    z-index: 15;
    text-align: center;
}
header h1 {
    position: absolute;
    left: 50%;
    top: 17px;
    margin: 0 0 0 -47px;
    width: 97px;
    height: 134px;
    vertical-align: top;
}
header h1 a {
    *display: inline;
    *zoom: 1;
    border: 0;
    font: 0/0 a;
    text-shadow: none;
    color: transparent!important;
    display: inline-block;
    width: 97px;
    height: 134px;
    background: url(../img/logo-black.png) 0 0 no-repeat;
    vertical-align: top;
}
header nav {
    margin: 0 auto 0;
    padding: 60px 0 0 0;
    width: 960px;
    height: auto;
    *zoom: 1;
}
header nav:before, header nav:after {
    display: table;
    content: ""}
header nav:after {
    clear: both;
}
header nav>ul {
    width: 100%;
    height: auto;
    *zoom: 1;
}
header nav>ul:before, header nav>ul:after {
    display: table;
    content: ""}
header nav>ul:after {
    clear: both;
}
header nav>ul>li>a {
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 1;
    font-weight: 300;
    color: #000;
    text-decoration: none;
    letter-spacing: 2px;
}
header nav>ul>li>a:hover {
    color: #555454;
}
header .gallery {
    float: left;
    padding: 0 0 0 93px;
}
header .magazine {
    float: right;
     padding:  0 90px 0 0;
}
header .submenu {
    display: none;
    position: absolute;
    left: 0;
    bottom: -68px;
    width: 100%;
    height: 68px;
    background: url(../img/header-submenu-bg.png) 0 0 repeat #a09fa7;
    text-align: center;
    *zoom: 1;
}
header .submenu:before, header .submenu:after {
    display: table;
    content: ""}
header .submenu:after {
    clear: both;
}
header .submenu.act {
    display: block;
}
header .submenu ul {
    position: relative;
    margin: 0 auto;
    display: inline-block;
    height: 68px;
    text-align: left;
    *zoom: 1;
}
header .submenu ul:before, header .submenu ul:after {
    display: table;
    content: ""}
header .submenu ul:after {
    clear: both;
}
header .submenu li {
    float: left;
    padding: 0 0 0 25px;
    height: 68px;
    *zoom: 1;
}
header .submenu li:before, header .submenu li:after {
    display: table;
    content: ""}
header .submenu li:after {
    clear: both;
}
header .submenu li:first-child {
    padding-left: 0;
}
header .submenu a {
    float: left;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 68px;
    font-weight: 300;
    color: #d2d2d2;
}
header .submenu a:hover, header .submenu a.act {
    color: #fff;
}
header .submenu a.act {
    background: url(../img/sub-menu-act.png) center -10px no-repeat;
}
footer {
    padding: 25px 0 150px 0;
}
footer .in {
    font-size: 10px;
    font-size: 1rem;
    line-height: 1;
    text-align: center;
    letter-spacing: 1px;
}
footer ul {
    padding: 0 0 10px 0;
    text-align: center;
}
footer li {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    padding: 0 6px;
}
footer .cz {
    padding-right: 1px;
}
footer .en {
    padding-left: 1px;
}
footer a {
    color: #b8b8b8;
    text-decoration: none;
}
footer a:hover {
    color: #fff;
    text-decoration: none;
}
footer a.act {
    font-weight: bold;
    color: #b8b8b8;
}
footer a.act:hover {
    color: #b8b8b8;
}
footer p {
    font-size: 10px;
    font-size: 1rem;
    line-height: 1;
    color: #999;
    letter-spacing: 1px;
}
section {
    padding: 162px 0 120px 0;
    background: url(../img/header-white-bg.png) center center repeat #fafcfa;
}
section .desc {
    padding: 80px 0 90px 0;
    background: url(../img/desc-bg.png) center bottom no-repeat;
}
section p {
    text-align: center;
    text-transform: uppercase;
}
section .contact {
    padding: 80px 0 0 0;
    *zoom: 1;
}
section .contact:before, section .contact:after {
    display: table;
    content: ""}
section .contact:after {
    clear: both;
}
section .contact li {
    float: left;
    width: 300px;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 17px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
}
section .contact .maps {
    width: 360px;
}
section .contact h2 {
    margin: 0 0 33px 0;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1;
    color: #c0c2c5;
}
section .contact img {
    margin: 0 0 20px 0;
}
section .image-bottom-line {width: 100%; min-width: 960px; overflow: hidden;}
section .img-workshopy {
    display: block;
    width: 5000px;
    height: 260px;
    background: url(../img/workshopy-bg.jpg) center center repeat;
}
section .img-klubfox {
    display: block;
    width: 8000px;
    height: 260px;
    background: url(../img/klubfox-bg.jpg) center center repeat;
}
section .img-foxpr {
    display: block;
    width: 3810;
    height: 260px;
    background: url(../img/fotopas-pr.jpg) center center repeat;
}
section .img-foxpr.img-flowers {
    display: block;
    width: 3810;
    height: 260px;
    background: url(../img/fotopas-flora.jpg) center center repeat;
}
section .img-foxpr.img-art-camp {
    display: block;
    width: 3810;
    height: 348px;
    background: url(../img/art-camp-bg.jpg) center center repeat;
}
.home-img {
    position: relative;
    width: 100%;
    height: 618px;
    text-align: center;
    overflow: hidden;
}
.home-img .img-list {
    position: relative;
    width: 100%;
    height: 618px;
}
.home-img .img-list li {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 618px;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: 1;
}
.home-img .img-list .next {
    opacity: 1;
    filter: alpha(opacity=100);
    z-index: 5;
}
.home-img .img-list .act {
    opacity: 1;
    filter: alpha(opacity=100);
    z-index: 10;
}
.home-img .navigation {
    position: absolute;
    left: 0;
    bottom: 78px;
    width: 100%;
    height: 23px;
    text-align: center;
    z-index: 10;
}
.home-img .navigation li {
    display: inline-block;
    width: 46px;
    height: 23px;
    border-right: 1px solid #fff;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
.home-img .navigation li:first-child {
    border-left: 1px solid #fff;
}
.home-img .navigation a {
    display: block;
    width: 100%;
    height: 100%}
.home-img .navigation a:hover, .home-img .navigation a.act {
    background: #fff;
    background: rgba(255, 255, 255, 0.3);
}
.home-img img {
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 1;
}
.home-img .img-1040 {
    margin-left: -520px;
}
.home-img .img-1500 {
    margin-left: -750px;
}
.home-img .img-1920 {
    margin-left: -960px;
}
.home-img h2 {
    position: relative;
    top: 50%;
    display: inline-block;
    *display: inline;
    *zoom: 1;
    margin: -90px 0 0 0;
    padding: 20px 40px 35px 40px;
    font-size: 42px;
    font-size: 4.2rem;
    line-height: 60px;
    font-weight: normal;
    color: #fff;
    background: #000;
    background: rgba(0, 0, 0, 0.2);
    letter-spacing: 3px;
    white-space: nowrap;
    z-index: 5;
}
.home-img h2 p {font-size: 42px;
    font-size: 4.2rem;
    line-height: 60px;
    font-weight: normal;}
.home-img #img-1 h2 {
    margin-top: -200px;
    background: #000;
    background: rgba(0, 0, 0, 0.5);
}
.home-img #img-5 h2 {
    margin-top: -200px;
}
.home-img #img-6 h2 {
    margin-top: -150px;
}
.gallery-list {
    margin: 0 auto 0;
    padding: 36px 0 0 0;
    width: 1022px;
    height: auto;
}
.gallery-list .gallery {
    position: relative;
    width: 1022px;
    height: 565px;
}
.gallery-list .gallery li {
    position: absolute;
}
.gallery-list .gallery .img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
    background-position: 0 0;
    background-repeat: no-repeat;
}
.gallery-list .gallery a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    text-decoration: none;
}
.gallery-list .gallery a:hover {
    background: #e9e8f2;
}
.gallery-list .gallery a:hover .img {
    background-position: 0 bottom;
}
.gallery-list .gallery span {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 0 35px 0 15px;
    width: 100%;
    height: 30px;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 25px;
    color: #8e83c8;
    text-decoration: none;
}
.gallery-list .gallery i {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 20px;
    height: 20px;
    background: url(../img/gallery-ico.png) 0 0 no-repeat;
}
.gallery-list .style {
    left: 0;
    top: 0;
    width: 250px;
    height: 193px;
}
.gallery-list .style .img {
    height: 132px;
    background-image: url(../img/img-style.jpg);
}
.gallery-list .design {
    left: 269px;
    top: 0;
    width: 233px;
    height: 361px;
}
.gallery-list .design .img {
    height: 298px;
    background-image: url(../img/img-design.jpg);
}
.gallery-list .housing {
    left: 522px;
    top: 0;
    width: 233px;
    height: 361px;
}
.gallery-list .housing .img {
    height: 295px;
    background-image: url(../img/img-housing.jpg);
}
.gallery-list .talks {
    right: 0;
    top: 0;
    width: 249px;
    height: 193px;
}
.gallery-list .talks .img {
    height: 193px;
    background-image: url(../img/img-talks.jpg);
}
.gallery-list .archi {
    left: 0;
    bottom: 0;
    width: 249px;
    height: 353px;
}
.gallery-list .archi .img {
    height: 296px;
    background-image: url(../img/img-archi.jpg);
}
.gallery-list .life {
    left: 269px;
    bottom: 0;
    width: 488px;
    height: 187px;
}
.gallery-list .life .img {
    height: 130px;
    background-image: url(../img/img-life.jpg);
}
.gallery-list .efox {
    right: 0;
    bottom: 0;
    width: 249px;
    height: 352px;
}
.gallery-list .efox .img {
    height: 352px;
    background-image: url(../img/img-efox.jpg);
}
.gallery-list .efox-orange {
    left: 0;
    top: 0;
    width: 251px;
    height: 192px;
}
.gallery-list .efox-orange .img {
    height: 155px;
    background-image: url(../img/img-efox-orange.jpg);
}
.gallery-list .expo {
    left: 269px;
    top: 0;
    width: 233px;
    height: 361px;
}
.gallery-list .expo .img {
    height: 320px;
    background-image: url(../img/img-expo.jpg);
}
.gallery-list .czech {
    left: 522px;
    top: 0;
    width: 233px;
    height: 361px;
}
.gallery-list .czech .img {
    height: 299px;
    background-image: url(../img/img-czech.jpg);
}
.gallery-list .pr {
    right: 0;
    top: 0;
    width: 251px;
    height: 192px;
}
.gallery-list .pr .img {
    height: 155px;
    background-image: url(../img/img-pr.jpg);
}

.gallery-list .pr a:hover .img{
    background-position: 0 -158px;
}

.gallery-list .camp {
    left: 0;
    bottom: 0;
    width: 249px;
    height: 353px;
}
.gallery-list .camp .img {
    height: 298px;
    background-image: url(../img/img-camp.jpg);
}
.gallery-list .workshop {
    left: 269px;
    bottom: 0;
    width: 488px;
    height: 187px;
}
.gallery-list .workshop .img {
    height: 131px;
    background-image: url(../img/img-workshop.jpg);
}
.gallery-list .kids {
    right: 0;
    bottom: 0;
    width: 249px;
    height: 351px;
}
.gallery-list .kids a:hover {
    background: #fae8d0!important;
}
.gallery-list .kids .img {
    height: 300px;
    background-image: url(../img/img-kids.jpg);
}
.article {
    padding: 330px 0 0 0;
    color: #6c6c6c;
    text-align: center;
    *zoom: 1;
}

.article.article-klubfox {padding: 0 0 100px 0;}

.article:before, .article:after {
    display: table;
    content: ""}
.article:after {
    clear: both;
}
.article h1 {
    margin: 0 0 20px 0;
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 1;
    font-weight: normal;
    text-transform: uppercase;
}
.article .big {
    font-size: 30px;
    font-size: 3rem;
    line-height: 1;
}
.article h2 {
    margin: 0 0 20px 0;
    font-size: 24px;
    font-size: 2.4rem;
    line-height: 1;
    font-weight: normal;
    color: #c0c2c5;
    text-transform: uppercase;
    text-align: center;
}
.article h3 {
    margin: 0 0 10px 0;
    font-size: 20px;
    font-size: 2rem;
    line-height: 1;
    font-weight: normal;
    color: #fac063;
    text-transform: uppercase;
    text-align: left;
}
.article p {
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 24px;
}
.article .orange {
    color: #fac063;
}
.article .small {
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 20px;
}
.article .small a {
    text-decoration: underline;
}
.article .small a:hover {
    text-decoration: none;
}
.article .hr {
    display: block;
    margin: 0 0 20px 0;
    width: 100%;
    height: 31px;
    background: url(../img/article-cross-hr.png) center 0 no-repeat;
}
.article .img-hr {
    position: relative;
    display: block;
    margin: 100px 0 90px 0;
    width: 100%;
    height: 1px;
    *zoom: 1;
}
.article .img-hr:before, .article .img-hr:after {
    display: table;
    content: ""}
.article .img-hr:after {
    clear: both;
}
.article .img-hr:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 1px;
    background: url(../img/article-onas-top-hr.png) center center no-repeat;
}
.article .img-hr img {
    position: absolute;
    left: 50%;
    top: -70px;
    margin: 0 0 0 -78px;
}
.article .img-hr-2 {
    margin-top: 200px;
    margin-bottom: 70px;
}
.article .img-hr-2:before {
    top: -5px;
}
.article .img-hr-2 img {
    top: -130px;
    margin-left: -68px;
}
.article .img-hr-3 img {
    margin-left: -67px;
}
.article p {
    margin: 0 0 20px 0;
    color: #6c6c6c;
}
.article .img-logo {
    vertical-align: middle;
}
.article .img-logo img {
    vertical-align: middle;
}
.article .in-article {
    margin: 0 auto 0;
    width: 700px;
    text-align: left;
    color: #6c6c6c;
}
.article .in-article h2 {
    margin: 0 0 20px 0;
}
.article .in-article p {
    font-family: 'jaf-facitweb', 'Arial CE', Arial, sans-serif;
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 22px;
    color: #6c6c6c;
    text-align: left;
    text-transform: none;
}
.article .in-article ul {
    margin: 0 0 20px 0;
}
.article .in-article li {
    font-family: 'jaf-facitweb', 'Arial CE', Arial, sans-serif;
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 22px;
    color: #6c6c6c;
    text-align: left;
    text-transform: none;
}
.article .in-article span {
    color: #796ac6;
}
.article .in-article strong {
    color: #000;
    font-weight: normal;
}
.article .in-article a {
    color: #796ac6;
    text-decoration: underline;
}
.article .in-article a:hover {
    text-decoration: none;
}
.article .in-article .perex {
    margin-bottom: 10px;
    font-family: 'jaf-domus-titling-web', 'Arial CE', Arial, sans-serif;
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 20px;
    text-transform: uppercase;
}
.article .in-article .center {
    text-align: center;
}
.article .in-article .orange {
    color: #fac063;
}
.article .in-article .img {
    margin: 0 0 60px 0;
    text-align: center;
}
.article .in-article table {
    width: 100%}
.article .in-article tr {
    vertical-align: top;
}
.article .in-article th {
    width: 120px;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 24px;
    font-weight: normal;
    text-transform: uppercase;
    text-align: left;
    vertical-align: top;
}
.article .in-article th strong {
    color: #000;
}
.article .in-article td {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 24px;
    text-transform: uppercase;
    text-align: left;
    vertical-align: top;
}
.article .in-article td strong {
    color: #000;
}
.article .people {
    padding: 35px 0 20px 0;
    background: #fbf8f7;
}
.article .people ul {
    margin: 0 auto 0;
    width: 720px;
    *zoom: 1;
}
.article .people ul:before, .article .people ul:after {
    display: table;
    content: ""}
.article .people ul:after {
    clear: both;
}
.article .people li {
    float: left;
    padding: 0 60px 0 0;
    width: 33.3%;
    text-align: center;
}
.article .people img {
    margin: 0 auto 45px;
}
.article .people h2 {
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1;
    color: #6c6c6c;
    text-align: left;
}
.article .people p {
    margin: 0 0 20px 0;
    font-size: 11px;
    font-size: 1.1rem;
    line-height: 18px;
    color: #6c6c6c;
    text-align: left;
    text-transform: none;
}
.article .people .gray {
    color: #c0c2c5;
}
.article .contact {
    padding-top: 40px;
    padding-bottom: 110px;
}
.article .contact h2 {
    color: #6c6c6c;
}
.pull-right {
    float: right;
}
.pull-left {
    float: left;
}
.hide {
    display: none;
}
.show {
    display: block;
}
.invisible {
    visibility: hidden;
}
.c {
    *zoom: 1;
}
.c:before, .c:after {
    display: table;
    content: ""}
.c:after {
    clear: both;
}
.vh {
    border: 0;
    clip: rect(0 0 0 0);
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    height: 1px;
}
.vh.focusable:active, .vh.focusable:focus {
    clip: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
    height: auto;
}
.log {
    background: rgba(0, 0, 0, 0.8);
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 1000;
    color: #fff;
    font-weight: bold;
    padding: 10px;
    font-size: 25px;
}

.fancybox-slide--iframe .fancybox-content {
    width  : 800px;
    height : 600px;
    max-width  : 80%;
    max-height : 80%;
    margin: 0;
}