/*
 * Project:     THE FOLKLORE STATE CENTRE OF GEORGIA
 * Author:      Giorgi Berikelashvili
 * Interfaces:  Desktop & Mobile
 * Date:        Aug, 2014
*/


/**
 * Table of Contents:
 *
 * 1.0 - Imported libraries and statics
 * 2.0 - Global wrapper styles
 * 3.0 - Header
 *   3.1 - Top Line
 *   3.2 - Primary Navigation
 * 4.0 - Pages
 *   4.1 - Home
 *   4.2 - Components
 *   4.3 - About
 *   4.4 - Events
 *   4.5 - News
 *   4.6 - Regions
 *   4.7 - Contact
 *   4.8 - Photo Gallery
 *   4.9 - Search
 * 5.0 - Footer
 * 6.0 - Hidden mobile items
 * 7.0 - Media queries

 * ----------------------------------------------------------------------------
 */

/**
 * 1.0 Imported libraries and static classes
 * ----------------------------------------------------------------------------
 */

.group:after {
  content: "";
  display: table;
  clear: both;
}

.sprite,
.sprite-after:after,
.sprite-before:before{
    background-image: url(../images/sprite.png);
    background-repeat: no-repeat;
}


.zoomable {
    -webkit-transition: all 0.5s ease;
    -moz-transition:    all 0.5s ease;
    -o-transition:      all 0.5s ease;
    -ms-transition:     all 0.5s ease;
    transition:         all 0.5s ease;  
}

.zoomable:hover {
    transform:scale(1.1);
    -ms-transform:scale(1.1); /* IE 9 */
    -moz-transform:scale(1.1); /* Firefox */
    -webkit-transform:scale(1.1); /* Safari and Chrome */
    -o-transform:scale(1.1); /* Opera */
}


.hide {
  display: none !important;
}

a {
  color: inherit;
}

a:hover {
  color: #9c1317;
}


h1.dashed{
  color: #3f3f3f;
  font-size: 22px;
  height: 40px;
  line-height: 35px;
  background: url(../images/headline-dashed-lines.png) left bottom repeat-x;
}

/**
 * 1.1 wordpress core
 * ----------------------------------------------------------------------------
 */

.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}



/**
 * 2.0 Global wrapper styles
 * ----------------------------------------------------------------------------
 */

body {
    background: #f6f4ee url(../images/background.png) 0 0;
    font-family: Arial;
}

#wrapper {
    display: block;
    position: relative;
    margin: 0 auto;
    padding: 0 15px;
    width: 1112px;
    /* min-height: 1500px; */
    background: #fff;
    box-shadow: 0 0 7px 0 rgba(0,0,0,0.2);
}

/**
 * 3.0 Header
 * ----------------------------------------------------------------------------
 */

header#masthead {
    display: block;
    height: 96px;
    border-bottom: 7px solid #8b0304;
}

header#masthead #site-logo{
    display: inline-block;
    float: left;
}

header#masthead #site-logo a{
    display: block;
    width: 226px;
    height: 96px;
    text-indent: -9999px;
    overflow: hidden;
    background: url(../images/logo_en.png) 0 0 no-repeat;
}

header#masthead .navigation-wrapper {
    /* display: inline-block; */
    /* width: 885px; */
    height: 96px;
    /* float: left; */
    border-left: 1px solid #bc9109;
    margin-right: 0;
    margin-left: 226px;
}

/**
 * 3.1 Top Line
 * ----------------------------------------------------------------------------
 */


header#masthead .navigation-wrapper .top-line {
    display: block;
    position: relative;
    height: 48px;
    border-bottom: 1px solid #bc9109;
}

header#masthead .navigation-wrapper .socials {
    display: inline-block;
    list-style-type: none;
    float: left;
}

header#masthead .navigation-wrapper .socials li {
    float: left;
}

header#masthead .navigation-wrapper .socials a{
    position: relative;
    display: block;
    width: 50px;
    height: 48px;
    background-image: none;
    background-color: #f9f5ee;
    border-right: 1px solid #bc9109;
}

header#masthead .navigation-wrapper .socials a:hover{
    background-color: #ece5d9;
}

header#masthead .navigation-wrapper .socials a:after{
    position: absolute;
    display: block;
    top: 16px;
    height: 16px;
    content: "";
}

header#masthead .navigation-wrapper .socials a.fb:after{
    left: 21px;
    width: 7px;
    background-position: 0 0;
}

header#masthead .navigation-wrapper .socials a.tw:after{
    left: 16px;
    width: 17px;
    background-position:  -11px 0;
}

header#masthead .navigation-wrapper .socials a.pn:after{
    left: 18px;
    width: 14px;
    background-position:  -30px 0;
}

header#masthead .navigation-wrapper .socials a.yt:after{
    left: 16px;
    width: 17px;
    background-position:  -48px 0;
}

header#masthead .navigation-wrapper .socials a.gp:after{
    left: 17px;
    width: 16px;
    background-position:  -68px 0;
}

header#masthead .navigation-wrapper .socials a.vm:after{
    left: 15px;
    width: 15px;
    background-position:  -88px 0;
}


header#masthead .navigation-wrapper .langs{
    display: inline-block;
    float: left;
    height: 48px;
    line-height: 48px;
    color: #bbb5aa;
    font-size: 12px;
    margin: 0 10px;
    font-family: Arial;
    font-weight: bold;
}

header#masthead .navigation-wrapper .langs a{
    display: inline-block;
    text-decoration: none;
    height: inherit;
    line-height: inherit;
    color: inherit;
    font-size: inherit;
    margin: 0 3px;
}

header#masthead .navigation-wrapper .langs a:hover,
header#masthead .navigation-wrapper .langs a.cur{
    color: #484640;
}

header#masthead .navigation-wrapper nav#secondary {
    float: right;
    display: inline-block;
}

header#masthead .navigation-wrapper nav#secondary li{
    float: left;
    display: inline-block;
}

header#masthead .navigation-wrapper nav#secondary li a{
    display: block;
    position: relative;
    height: 48px;
    line-height: 48px;
    text-decoration: none;
    padding: 0 8px;
    font-family: Arial;
    font-weight: bold;
    font-size: 12px;
    color: #84827a;
    text-align: center;
}

header#masthead .navigation-wrapper nav#secondary li a:hover,
header#masthead .navigation-wrapper nav#secondary [class*="current"] a{
    color: #bc9109;
}

header#masthead .navigation-wrapper nav#secondary li a:hover:after,
header#masthead .navigation-wrapper nav#secondary [class*="current"] a:after{
    display: block;
    position: absolute;
    margin-left: -6px;
    bottom: 0;
    left: 50%;
    width: 0px;
    height: 0px;
    content: "";
    border-style: solid;
    border-width: 6px;
    border-color: transparent transparent #bc9109 transparent;
}


header#masthead .search-bar {
  position: relative;
  display: block;
  float: right;
  width: 40px;
  height: 48px;
  line-height: 48px;
  color: #fff;
  text-align: center;
  background: #bc9109;
  font-size: 13px;
  cursor: pointer;
}

header#masthead .search-bar .submit{
  width: 40px;
  height: 48px;
  float: right;
  line-height: 48px;
}

header#masthead #query {
  display: block;
  position: absolute;
  z-index: 5;
  right: 40px;
  top: 0;
  width: 0px;
  height: 48px;
  line-height: 48px;
  color: #7e7e7e;
  background: #f9f5ee;
  font-size: 13px;
  text-indent: 10px;
  border: none;
  border-left: 1px solid #bc9109;
  outline: none;
  padding: 0;
  
  
    -webkit-transition: all 0.5s ease;
    -moz-transition:    all 0.5s ease;
    -o-transition:      all 0.5s ease;
    -ms-transition:     all 0.5s ease;
    transition:         all 0.5s ease; 
}


header#masthead .search-bar:hover #query,
header#masthead .search-bar #query.active{
  width: 240px;
}

/**
 * 3.2 Primary Navigation
 * ----------------------------------------------------------------------------
 */

header#masthead nav#mobile {
    display: none;
}

header#masthead nav#primary-navigation {
    display: block;
}

header#masthead nav#primary-navigation  ul.menu > li{
    display: inline-block;
    float: left;
}

header#masthead nav#primary-navigation  ul.menu > li > a{
    display: block;
    position: relative;
    height: 47px;
    line-height: 47px;
    padding: 0 14px;
    font-family: Arial;
    color: #453e31;
    text-decoration: none;
    font-size: 14px;
}

header#masthead nav#primary-navigation   ul.menu > li:hover > a,
header#masthead nav#primary-navigation   ul.menu > [class*="current"] > a {
    color: #8b0304;
}

header#masthead nav#primary-navigation   ul.menu > li:hover > a:after,
header#masthead nav#primary-navigation   ul.menu > [class*="current"] > a:after{
    display: block;
    position: absolute;
    margin-left: -6px;
    bottom: 0;
    left: 50%;
    width: 0px;
    height: 0px;
    content: "";
    border-style: solid;
    border-width: 6px;
    border-color: transparent transparent #8b0304 transparent;
}


header#masthead nav#primary-navigation   ul.menu > li > ul{
    position: absolute;
    z-index: 10;
    display: none;
    list-style-type: none;
    background: rgba(255,255,255,0.9);
    border: 1px solid #8b0304;
    border-top: 7px solid #8b0304;
}

header#masthead nav#primary-navigation   ul.menu > li:hover > ul{
    display: block;
}


header#masthead nav#primary-navigation   ul.menu > li > ul a{
    display: block;
    text-decoration: none;
    height: 30px;
    line-height: 30px;
    padding: 0 130px 0 17px;
    border-bottom: 1px solid #ededed;
    font-size: 12px;
    font-family: Arial;
    font-weight: bold;
    color: #5e5e5e;
}

header#masthead nav#primary-navigation   ul.menu > li > ul a:hover,
header#masthead nav#primary-navigation   ul.menu > li > ul [class*="current"] a{
    background: #f2f1f1;
    color: #8b0304;
}

/**
 * 4.0 Pages
 *   4.1 Home
 *   4.1.1 News Slider
 * ----------------------------------------------------------------------------
 */

#news-slider {
  position: relative;
    display: block;
    width: 1112px;
    height: 340px;
}

#news-slider .swiper-wrapper {
  height: 340px;
}

#news-slider .item{
    position: relative;
    width: 556px;
    height: 340px;
    float: left;    
    text-shadow: 0 1px 0 rgba(0,0,0,1);
}

#news-slider .item img.thumb{
    position: absolute;
    display: block;
    width: 556px;
    height: 340px;
    top: 0;
    left: 0;
}

#news-slider .item .caption{
    position: absolute;
    display: block;
    width: 496px;
    height: 100px;
    left: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    color: #fff;
    text-decoration: none;
    font-family: Arial;
    overflow: hidden;
    text-align: right; 
}

#news-slider .item .caption h1{
    margin: 25px 0 12px;
    display: block;    
    font-size: 14px;
    padding: 0 15px;
    text-transform: uppercase;
}

#news-slider .item .caption:hover h1{
    text-decoration: underline;
}


#news-slider .item .caption .desc{
    display: block;
    font-size: 12px;
    max-height: 45px;
    padding: 0 15px;
}


#news-slider .item:after {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 5;
    content: "";
    width: 1px;
    height: 340px;
    background: rgba(255,255,255,0.4);
}


#news-slider .arrow {
    position: absolute;
    display: block;
    width: 59px;
    height: 100px;
    line-height: 100px;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    text-align: center;
    font-size: 16px;
}

#news-slider .arrow#left {
    left: 0;
}

#news-slider .arrow#right {
    right: 0;
}

#news-slider .arrow:hover {
    background: rgba(0,0,0,0.7);
    color: #bc9109;
}

/**
 * 4.1.2 Last Items
 * ----------------------------------------------------------------------------
 */
#last-items {
  display: block;
  width: 1080px;
  margin: 50px auto;
}

#last-items .home-category{
  display: inline-block;
  float: left;
  width: 328px;
  overflow: hidden;
}

#last-items .home-category#events{
  padding: 0 24px 0 0;
  
  -webkit-box-shadow: inset -1px 0px 0px 0px #f2f2f2;
  -moz-box-shadow: inset -1px 0px 0px 0px #f2f2f2;
  box-shadow: inset -1px 0px 0px 0px #f2f2f2;  
}

#last-items .home-category#projects{
  padding: 0 24px;
}

#last-items .home-category#blog{
  padding: 0 0 0 24px;
  -webkit-box-shadow: inset 1px 0px 0px 0px #f2f2f2;
  -moz-box-shadow: inset 1px 0px 0px 0px #f2f2f2;
  box-shadow: inset 1px 0px 0px 0px #f2f2f2;  
}


#last-items .home-category h1{
  font-size: 25px;
  height: 40px;
  line-height: 35px;
  background: url(../images/headline-dashed-lines.png) left bottom repeat-x;
}

#last-items #events h1{
  color: #9c1317;
}

#last-items #events .item{
  display: block;
  height: 40px;
  margin: 15px 0;
  overflow: hidden;
}

#last-items #events .item .date{
  position: relative;
  display: inline-block;
  float: left;
  width: 40px;
  height: 40px;
}

#last-items #events .item .date:after{
  display: block;
  position: absolute;
  width: 2px;
  height: 40px;
  right: 0;
  top: 0;
  background-position: 0 -22px;
  content: "";
}

#last-items #events .item .date .num{
  display: block;
  height: 23px;
  line-height: 23px;  
  color: #9c1317;
  font-size: 18px;
}

#last-items #events .item .date .mon{
  display: block;
  height: 17px;
  line-height: 17px;  
  color: #6e6e6e;
  font-size: 11px;
}

#last-items #events .item .content{
  display: block;
  width: 268px;
  height: 40px;  
  padding: 0 0 0 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#last-items #events .item .content > h2{
  display: block;
  height: 23px;
  line-height: 23px;  
  font-size: 13px;  
}

#last-items #events .item .content > h2 > a{
  display: inline-block;
  width: 258px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
  color: #9c1317;
}

#last-items #events .item .content > h2 > a:hover{
  text-decoration: underline;
}



#last-items #events .item .content .desc{
  display: block;
  height: 17px;
  line-height: 17px;  
  color: #696969;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#last-items #projects h1{
  color: #3f3f3f;
}

#last-items #projects .item{
  display: block;
  height: 40px;
  margin: 15px 0;
  overflow: hidden;
}

#last-items #projects .item .arrow{
  position: relative;
  display: inline-block;
  float: left;
  width: 30px;
  line-height: 20px;
  height: 40px;
  font-size: 18px;
  color: #a3a3a3;
}


#last-items #projects .item .content{
  display: block;
  width: 288px;
  height: 40px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#last-items #projects .item .content > h2{
  display: block;
  height: 23px;
  line-height: 23px;    
  font-size: 13px;  
}

#last-items #projects .item .content > h2 > a{
  display: inline-block;
  width: 278px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
  color: #414141;
}

#last-items #projects .item .content > h2> a:hover{
  text-decoration: underline;
}



#last-items #projects .item .content .desc{
  display: block;
  height: 17px;
  line-height: 17px;  
  color: #696969;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#last-items #blog h1{
  color: #bc9109;
}

#last-items #blog .item{
  display: block;
  height: 84px;
  padding: 15px 0;
  overflow: hidden;
  float: left;
  border-bottom: 1px solid #ededed;
}

#last-items #blog .item .date{
  position: relative;
  display: block;
  font-size: 11px;
  color: #bc9109;
}

#last-items #blog .item .content > h2{
  display: block;
  height: 23px;
  line-height: 23px;  
  color: #414141;
  font-size: 13px;
  
}

#last-items #blog .item .content > h2> a{
  width: 295px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #414141;
  text-decoration: none;
  display: block;
}

#last-items #blog .item .content > h2 > a:hover{
  text-decoration: underline;
}

#last-items #blog .item .content .desc{
  display: block;
  line-height: 17px;  
  color: #696969;
  font-size: 12px;
  overflow: hidden;
  height: 50px;
}

/**
 * 4.1.3 Banners
 * ----------------------------------------------------------------------------
 */

#promo-banners {
  position: relative;
  display: block;
  margin: 0 auto 1px;
  height: 150px;
  text-align: center;
}

#promo-banners .container{
  position: relative;
  display: block;
  margin: 0 auto;
  max-width: 993px;
  height: 150px;
  text-align: center;
  overflow: hidden;
  margin-left: 60px;
}

#promo-banners .item{
  position: relative;
  display: inline-block;
  width: 330px;
  height: 150px;
  float: left;
  margin: 0 1px 0 0;
}


#promo-banners .item .thumb{
  position: absolute;
  top: 0;
  left: 0;
  width: 330px;
  height: 150px;
}

#promo-banners .item .title{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 300px;
  height: 45px;
  line-height: 45px;
  background: rgba(140,136,122,0.68);
  text-decoration: none;
  text-align: right;
  color: #fff;
  font-weight: bold;
  font-size: 13px;
  padding: 0 15px;
  text-shadow: 0 1px 0 rgba(0,0,0,0.5);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#promo-banners .item:hover .title{
  background: rgba(140,136,122,1);
  text-shadow: 0 1px 0 rgba(0,0,0,0.3);
}

#promo-banners .arrow {
    position: absolute;
    display: block;
    width: 59px;
    height: 150px;
    line-height: 150px;
    bottom: 0;
    background: #bc9109;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    text-align: center;
    font-size: 16px;
}

#promo-banners .arrow#left {
    left: 0;
}

#promo-banners .arrow#right {
    right: 0;
}

#promo-banners .arrow:hover {
    background: #997400;
}


/* small handmade version :( */

#promo-banners-small {
  position: relative;
  display: block;
  margin: 0 auto 30px;
  height: 109px;
  text-align: center;
}

#promo-banners-small .container{
  position: relative;
  display: block;
  margin: 0 auto;
  max-width: 993px;
  height: 109px;
  text-align: center;
  overflow: hidden;
  margin-left: 60px;
}

#promo-banners-small .item{
  position: relative;
  display: inline-block;
  width: 301px;
  height: 109px;
  margin: 0 auto;
  text-align: center;
}


#promo-banners-small .item .thumb{
  width: 301px;
  height: 109px;
}


/**
 * 4.2 Components
 *   4.2.1 Header
 * ----------------------------------------------------------------------------
 */
.page-header {
  display: block;
  position: relative;
  min-height: 55px;
  overflow: hidden;
}

.page-header img.cover{
  display: block;
  width: 100%;
  height: 270px;
}

.page-header .info-line{
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 55px;
  background: rgba(241,240,235,0.9);
}

.page-header .info-line h1{
  display: inline-block;
  float: left;
  margin: 0 0 0 255px;
  height: 55px;
  line-height: 55px;
  font-size: 26px;
  color: #515151;
  white-space: nowrap;
}

.page-header .info-line .youarehere{
  display: inline-block;
  float: right;
  margin: 0 40px 0 0;
  height: 55px;
  line-height: 55px;
  font-size: 12px;
  color: #676666;
}

.page-header .info-line .youarehere a{
  text-decoration: none;
}

.page-header .info-line .youarehere a:hover{
  color: #bc9109;
}

/**
 *   4.2.2 Sidebar
 * ----------------------------------------------------------------------------
 */
.page-sidebar {
  display: inline-block;
  float: left;
  width: 226px;
  padding-top: 20px;
}

.page-sidebar ul.leftmenu{
  list-style-type: none;
  display: block;
}

.page-sidebar ul.leftmenu > li {
  border-bottom: 1px solid #e6e4dd;
}

.page-sidebar ul.leftmenu > li > a,
.page-sidebar ul.leftmenu > li > h3{
  display: block;
  height: 40px;
  line-height: 40px;
  text-indent: 15px;
  font-size: 15px;
  font-weight: normal;
  color: #5e5e5e;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-sidebar ul.leftmenu li a:hover,
.page-sidebar ul.leftmenu li.cur a,
.page-sidebar ul.leftmenu [class*="current"]:not(.current-page-ancestor) a{
  color: #8b0304;
}

.page-sidebar ul.leftmenu > li > ul {
  padding: 0 0 15px 30px;
  list-style-type: none;
}

.page-sidebar ul.leftmenu > li > ul a{
  display: block;
  min-height: 25px;
  line-height: 25px;
  text-decoration: none;
  font-size: 14px;
  font-weight: normal;
  color: #5e5e5e;
}


/**
 *   4.2.3 Narrow Page (when sidebar)
 * ----------------------------------------------------------------------------
 */
.page-wrp-narrow {
  display: block;
  padding: 30px 25px;
  /* width: 835px; */
  min-height: 300px;
  border-left: 1px solid #e3e3e3;
  margin-left: 226px;
  overflow: hidden;
}

/**
 *   4.2.4 Wide Page (withoud sidebar)
 * ----------------------------------------------------------------------------
 */
.page-wrp-wide {
  display: block;
  padding: 30px 25px;
  min-height: 300px;
  border-left: 1px solid #e3e3e3;
  border-right: 1px solid #e3e3e3;
}


/**
 *   4.2.5 Page Constants
 * ----------------------------------------------------------------------------
 */


[class*="page-wrp"] {
  font-size: 12px;
  color: #5e5e5e;
  text-align: justify;
  line-height: 1.5em;
}

[class*="page-wrp"] p {
  padding: 0 0 10px;
}


[class*="page-wrp"] ul {
  padding: 0 0 0 30px;
}



[class*="page-wrp"] h2,
[class*="page-wrp"] h1{
  color: #515151;
  font-size: 22px;
  font-weight: normal;
  line-height: 2em;
  text-align: left;
}

[class*="page-wrp"] h1 {
  font-weight: bold;
}

[class*="page-wrp"] h2.dashed {
  height: 40px;
  line-height: 35px;
  background: url(../images/headline-dashed-lines.png) left bottom repeat-x;
  margin: 20px 0 15px;
  display: block;
  clear: both;
}



/**
 *   4.4 Events
 *     4.4.1 Events List
 * ----------------------------------------------------------------------------
 */
.events-list-item {
  display: inline-block;
  float: left;
  width: 408px;
  height: 301px;
  overflow: hidden;
  margin-bottom: 40px;
}

.events-list-item:nth-child(odd) {
  margin-right: 16px;
}

.events-list-item .date{
  display: block;
  height: 30px;
  border-bottom: 1px solid #e8e8e8;
}

.events-list-item .date span{
  display: inline-block;
  height: 30px;
  line-height: 30px;
  font-size: 17px;
  font-style: italic;
  color: #a43336;  
  -webkit-box-shadow: 0px 1px 0px 0px #a43336;
  -moz-box-shadow:    0px 1px 0px 0px #a43336;
  box-shadow:         0px 1px 0px 0px #a43336;
  white-space: nowrap;
}


.events-list-item .title{
  display: block;
  margin: 15px 0;
  font-size: 13px;
  color: #4e4e4e;
  text-decoration: none;
  line-height: 1.5em;
  height: 40px;
  overflow: hidden;
}

.events-list-item .thumb{
  display: block;
  width: 408px;
  height: 200px;
  overflow: hidden;
}

.events-list-item .thumb img{
  width: 408px;
  height: 200px; 
}

.events-list-item:hover .thumb img{
  transform:scale(1.1);
  -ms-transform:scale(1.1); /* IE 9 */
  -moz-transform:scale(1.1); /* Firefox */
  -webkit-transform:scale(1.1); /* Safari and Chrome */
  -o-transform:scale(1.1); /* Opera */
}

.events-list-item:hover .title{
  color: #000;
}


/**
 *   4.5 News
 *     4.5.1 News List
 * ----------------------------------------------------------------------------
 */
.news-list-item {
  display: inline-block;
  float: left;
  width: 830px;
  /* height: 75px; */
  overflow: hidden;
  margin-bottom: 45px;
  
}

.news-list-item .thumb{
  display: inline-block;
  float: left;
  overflow: hidden;
  width: 145px;
  height: 75px;
  margin-right: 15px;
}

.news-list-item .thumb img{
  width: 145px;
  height: 75px;
}

.news-list-item:hover .thumb img{
    transform:scale(1.1);
    -ms-transform:scale(1.1); /* IE 9 */
    -moz-transform:scale(1.1); /* Firefox */
    -webkit-transform:scale(1.1); /* Safari and Chrome */
    -o-transform:scale(1.1); /* Opera */
}



.news-list-item .bigthumb{
  display: inline-block;
  float: left;
  overflow: hidden;
  width: 250px;
  height: 123px;
  margin-right: 15px;
}

.news-list-item .bigthumb img{
  width: 250px;
  height: 123px;
}

.news-list-item:hover .bigthumb img{
    transform:scale(1.1);
    -ms-transform:scale(1.1); /* IE 9 */
    -moz-transform:scale(1.1); /* Firefox */
    -webkit-transform:scale(1.1); /* Safari and Chrome */
    -o-transform:scale(1.1); /* Opera */
}



.news-list-item .details{
  display: block;
  /* float: left; */
  /* width: 665px; */
  /* height: 75px; */
  border-left: 1px solid #bfbfbf;
  margin-left: 160px;
}

.news-list-item .bigdetails{
  display: block;
  border-left: 1px solid #bfbfbf;
  margin-left: 275px;
}


.news-list-item .details .reddetail,
.news-list-item .bigdetails .reddetail{
  -webkit-box-shadow: -1px 0px 0px 0px #a43336;
  -moz-box-shadow:    -1px 0px 0px 0px #a43336;
  box-shadow:         -1px 0px 0px 0px #a43336;
}

.news-list-item .details .date{
  display: block;
  padding-left: 15px;
  font-size: 12px;
  color: #696969;
  font-style: italic;
  height: 15px;
  line-height: 15px;
}

.news-list-item .details .title,
.news-list-item .bigdetails .title{
  display: block;
  padding-left: 15px;
  font-size: 13px;
  color: #9c1317;
  font-weight: bold;
  text-decoration: none;
  /*height: 20px;*/
  line-height: 20px;
  margin-bottom: 5px;
}

.news-list-item .details .desc,
.news-list-item .bigdetails .desc{
  display: block;
  padding-left: 15px;
  font-size: 12px;
  color: #5e5e5e;
  /* height: 35px; */
  line-height: 1.5em;
  overflow: hidden;
}

/**
 *   4.5.2 News Item
 * ----------------------------------------------------------------------------
 */
article header .attachment-post-thumbnail {
  margin: -30px -25px 25px;
}

time#post-date {
  display: block;
  font-size: 15px;
  color: #696969;
  font-style: italic;
  height: 25px;
  line-height: 25px;
}


h1#post-title {
  display: block;
  font-size: 20px;
  color: #8b0304;
  font-weight: normal;
  /* height: 30px; */
  line-height: 30px;
  margin-bottom: 15px;
}


/**
 *   4.5.3 Pagination
 * ----------------------------------------------------------------------------
 */

.pagination {
  display: inline-block;
  height: 30px;
  line-height: 30px;
  font-size: 12px;
  border-top: 2px solid #bfbfbf;
  clear: both;
  margin-bottom: 20px;
}

.pagination > *{
  padding: 0 15px;
  height: 30px;
  line-height: 30px;
  display: inline-block;
}

.pagination > .current{
  color: #a43336;
  border-top: 2px solid #a43336;
  margin-top: -2px;
}


.pagination a{
  text-decoration: none;
}


/**
 *   4.6 Regions
 * ----------------------------------------------------------------------------
 */

.region-posts {
  display: block;
  clear: both;
  
}

.region-posts .block{
  display: inline-block;
  float: left;
  width: 350px;
  margin: 30px 0;
}

.region-posts .block#news{
  margin-right: 25px;
  padding-right: 25px;
  border-right: 1px solid #f2f2f2;
}


.region-posts .block h1{
  color: #3f3f3f;
  font-size: 22px;
  font-weight: normal;
  height: 40px;
  line-height: 35px;
  background: url(../images/headline-dashed-lines.png) left bottom repeat-x;
}

.region-posts #news .item{
  display: block;
  float: left;
  height: 75px;
  margin: 10px 0;
}

.region-posts #news .item .date{
  display: block;
  font-size: 12px;
  color: #696969;
  font-style: italic;
  height: 15px;
  line-height: 15px;
}

.region-posts #news .item .title{
  display: block;
  font-size: 13px;
  color: #9c1317;
  font-weight: bold;
  text-decoration: none;
  height: 20px;
  line-height: 20px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.region-posts #news .item .title:hover{
  text-decoration: underline;
}

.region-posts #news .item .desc{
  display: block;
  font-size: 12px;
  color: #5e5e5e;
  height: 35px;
  line-height: 1.5em;
  overflow: hidden;
}



.region-posts #projects .item{
  display: block;
  height: 40px;
  margin: 15px 0;
}

.region-posts #projects .item .arrow{
  position: relative;
  display: inline-block;
  float: left;
  width: 30px;
  line-height: 20px;
  height: 40px;
  font-size: 18px;
  color: #a3a3a3;
}

.reg_proj{
  padding: 0;
}

.reg_proj > h2{
  line-height: 1.5em;
}

.reg_proj > h2 > a{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
  color: #8b0304;
  font-size: 16px;
}

.reg_proj > h2 > a:hover{
  /* text-decoration: underline; */
}

.reg_proj .desc{
  display: block; 
  color: #696969;
  font-size: 12px;
  text-indent: 25px;
}

.region-personal {
  display: block;
  clear: both;
}

.region-personal h1{
  color: #3f3f3f;
  font-weight: normal;
  font-size: 22px;
  height: 40px;
  line-height: 35px;
  background: url(../images/headline-dashed-lines.png) left bottom repeat-x;
  margin-bottom: 20px;
}

.region-personal .item{
  display: inline-block;
  float: left;
  margin: 0 30px 30px 0;
}


.region-personal .name{
  display: block;
  font-size: 12px;
  color: #606060;
  font-weight: bold;
}

.region-personal .position{
  display: block;
  font-size: 12px;
  color: #606060;
}

.region-personal .mail{
  display: block;
  font-size: 12px;
  color: #930607;
}


.proj_year {
  display: block;
  font-size: 14px;
  text-align: right;
  padding: 20px 0 10px;
  margin: 0 0 5px;
  border-bottom: 1px dashed #bfbfbf;
}

.proj_year.first {
  padding: 0px 0 10px;
}


/**
 *   4.7 Contact
 * ----------------------------------------------------------------------------
 */

.contact .block {
  display: inline-block;
  float: left;
}

.contact .block h1{
  margin-bottom: 20px;
}


.contact .block span{
  display: block;
  margin-bottom: 5px;
}

.contact .block span.content{
  font-size: 15px;
  color: #6c6c6c;
}

.contact .block span.mail{
  color: #930607;
}

.contact .block span.position{
  text-align: left;
}

.contact .block#contact-info,
.contact .block#contact-persons{
  width: 270px;
  margin-right: 20px;
  padding-right: 30px;
  border-right: 1px solid #f2f2f2;
}

.contact .block .name{
  color: #606060;
  font-weight: bold;
  font-size: 12px;
}

.contact .block#contact-persons span{
  margin-bottom: 0px;
}

.contact .block#contact-persons .item{
  margin-bottom: 10px;
}

.contact .block#contact-form {
    width: 410px;
}


.contact input[type="text"],
.contact textarea{
  display: block;
  float: left;
    width: 270px;
    height: 30px !important;
    padding: 0 10px;
    line-height: 30px;
    border: 1px solid #cacaca;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    
    margin: 0 0 12px;
    
    color: #6a6a6a;
    font-size: 12px;
    
  -webkit-box-shadow: inset 0px 2px 2px 0px rgba(240, 240, 240, 1);
  -moz-box-shadow:    inset 0px 2px 2px 0px rgba(240, 240, 240, 1);
  box-shadow:         inset 0px 2px 2px 0px rgba(240, 240, 240, 1);
}

.contact textarea {
  width: 390px;
  height: 65px !important;
  line-height: inherit;
  padding: 10px;
}

.contact .submit {  
  display: block;
  clear: both;
  width: 130px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background: #bc9109;
  font-size: 13px;
}

.contact .submit:hover {  
  background: #930607;
}

#contact-form .error {
  border: 1px solid #b11116 !important;
}

#contact-form .message {
  display: none;
  text-align: center;
  padding: 30px 0;
  background: rgb(200, 255, 200);
  color: rgb(0, 56, 0);
  font-size: 16px;
  margin: 20px 0;
}



/**
 *   4.8 Photo Gallery
 * ----------------------------------------------------------------------------
 */


article.gallery-post {
  display: block;
  margin: 0 0 40px;
}

article.gallery-post header {
  margin-bottom: 20px;
}


article.gallery-post header h1{
  display: inline-block !important;
  float: left;
  margin: 0 20px 0 0 !important;
  font-size: 16px !important;
  font-weight: normal;
  color: #515151 !important;
  height: 30px;
  line-height: 30px;
}

article.gallery-post header h1 a{
  display: block;
  font-size: 16px;
  font-weight: normal;
  color: #515151;
  text-decoration: none;
  height: 30px;
  line-height: 30px;
}

article.gallery-post header h1 a:hover{
  color: #8b0304;
  text-decoration: underline;
}

article.gallery-post header time {
  float: left;
  display: inline-block !important;
  font-size: 15px;
  font-weight: normal;
  color: #bc9109;
  height: 30px;
  line-height: 30px;
}

article.gallery-post .entry-content {
  display: block;
  clear: both;
}

article.gallery-post .gallery-item {
  display: inline-block;
  overflow: hidden;
  float: left;
  margin: 0 8px 8px;
  width: 100px;
  height: 100px;
  border: 1px solid #fff;
  box-shadow: 0 0 0 1px  #eae9e4;
}

article.gallery-post .gallery-item:hover {
  box-shadow: 0 0 0 1px  #bc9109;
}

article.gallery-post .gallery-item img {
  width: 100px;
  height: 100px;
}


/*-------------------------------------------*/

.video-list {
  display: inline-block;
  float: left;
  width: 408px;
  height: 280px;
  overflow: hidden;
  margin-bottom: 40px;
}


.video-list:nth-child(odd) {
  margin-right: 16px;
}

.video-list header{
  display: block;
  margin: 15px 0 5px;
  height: 40px;
  overflow: hidden;
}


.video-list .title a{
  display: block;
  font-size: 12px;
  color: #4e4e4e;
  text-decoration: none;
  line-height: 1.5em;
}


.video-list:hover .title{
  color: #000;
}










/* files archive */

a.file-attachment {
  position: relative;
  display: inline-block;
  height: 40px;
  line-height: 40px;
  font-size: 13px;
  color: #5e5e5e;
  text-decoration: none;
  min-width: 360px;
  border-bottom: 1px solid #f0f0f0;
  margin: 0 40px 0 0;
  float: left;
  text-indent: 28px;
  white-space: nowrap;
}

a.file-attachment:before {
  position: absolute;
  display: inline-block;
  content: "";
  background: transparent url(../images/sprite.png) -16px -26px no-repeat;
  width: 16px;
  height: 16px;
  top: 12px;
  left: 0;
}


a.file-attachment:hover {
  color: #000;
  border-color: #dbdbdb;
}


/**
 *   4.9 Search
 * ----------------------------------------------------------------------------
 */


.page-wrp-wide.search {
  
}




.pure-list-item {
  display: block;
  float: left;
  overflow: hidden;
  margin-bottom: 45px;
  width: 100%;
  
}


.pure-list-item .details{
  display: block;
}




.pure-list-item .details .reddetail,{
  -webkit-box-shadow: -1px 0px 0px 0px #a43336;
  -moz-box-shadow:    -1px 0px 0px 0px #a43336;
  box-shadow:         -1px 0px 0px 0px #a43336;
}

.pure-list-item .details .tags br{
  display: none;
}


.pure-list-item .details .date{
  display: block;
  font-size: 12px;
  color: #696969;
  font-style: italic;
  height: 15px;
  line-height: 15px;
}

.pure-list-item .details .title{
  display: block;
  font-size: 13px;
  color: #9c1317;
  font-weight: bold;
  text-decoration: none;
  height: 20px;
  line-height: 20px;
  margin-bottom: 5px;
}

.pure-list-item .details .desc{
  display: block;
  font-size: 12px;
  color: #5e5e5e;
  /* height: 35px; */
  line-height: 1.5em;
  overflow: hidden;
}




/**
 * 5.0 Footer
 * ----------------------------------------------------------------------------
 */
footer#mastfoot {
  display: block;
  clear: both;
}

footer#mastfoot #footerblock {
  display: block;
  background: #f5f3ed;
  margin-bottom: 5px;
}

ul.blocks {
  list-style-type: none;
}

ul.blocks > li{
  float: left;
  /* border-right: 1px solid #e3e1d9; */
  padding: 35px 60px 35px 25px;
}

ul.blocks > li > h3{
  font-size: 14px;
  font-weight: bold;
  color: #000;
  padding: 0 0 15px;
}

ul.blocks > li > ul.links{
  list-style-type: none;
}

ul.blocks > li > ul.links > li > a{
  color: #6c6c6c;
  font-size: 12px;
  text-decoration: none;
  display: block;
  height: 20px;
  line-height: 20px;
}

ul.blocks > li,
ul.blocks > li > a{
  color: #6c6c6c;
  font-size: 12px;
  text-decoration: none;
  line-height: 20px;
}


ul.blocks > li > ul.links > li > a:hover,
ul.blocks > li > a:hover{
  color: #000;
  text-decoration: underline;
}

ul.blocks > li.contact{
  float: right;
  border-right: none;
  padding: 35px 20px 35px 0;
}

ul.blocks > li.contact{
  float: right;
  border-right: none;
  padding: 35px 20px 35px 0;
}

ul.blocks > li.contact > ul{
  list-style-type: none;
  text-align: right;
}

ul.blocks > li.contact > ul span,
ul.blocks > li.contact > ul a{
  padding: 0 10px;
  text-align: right;
}

ul.blocks > li.contact > ul a{
  text-decoration: none;
  color: #930607;
}

footer#mastfoot #copyright {
  display: block;
  padding: 20px;
  height: 30px;
  line-height: 30px;
  font-size: 12px;
  color: #6c6c6c;
  text-align: right;
}



footer .socials a {
  display: block;
  width: 32px;
  height: 32px;
  overflow: hidden;
  text-indent: -9999px;
  float: left;
  margin: 10px 0 0 0;
  background-position: 0 0;
  background-repeat: none;
  text-decoration: none;
  background-color: transparent;
  

  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; 
  filter: alpha(opacity=60);
  opacity: 0.6;   
}

footer .socials a:hover {
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
  filter: alpha(opacity=100);
  opacity: 1;
}

footer .socials a.fb {
  background-image: url(../images/socials2/facebook.png);
}

footer .socials a.tw {
  background-image: url(../images/socials2/twitter.png);
}

footer .socials a.pi {
  background-image: url(../images/socials2/pinterest.png);
}

footer .socials a.yo {
  background-image: url(../images/socials2/youtube.png);
}

footer .socials a.go {
  background-image: url(../images/socials2/google+.png);
}

footer .socials a.vi {
  background-image: url(../images/socials2/vimeo.png);
}

footer .socials a.in {
  background-image: url(../images/socials2/instagram.png);
}



/**
 * 7.0 Media Queries
 * ----------------------------------------------------------------------------
 */

/* Hide some items under 1150 resolutions. */
@media (max-width: 1150px) {
  #wrapper {
    width: 100%;
    padding: 0;
  }
  
  #news-slider {
    width: 1000px;
    height: 306px;
    margin: 0 auto;
  }
  
  #news-slider .item {
    width: 500px;
    height: 306px;
  }
  
  #news-slider .item img.thumb {
    width: 500px;
    height: 306px;
  }
  
  #news-slider .item .caption {
    width: 440px;
  }
  
  #last-items {
    width: auto;
  }
  
  #last-items .home-category {
    width: 310px;
  }
  
  #last-items #events .item .content,
  #last-items #events .item .content > h2 > a{
    width: 250px;
  }
  
  #last-items #projects .item .content,
  #last-items #projects .item .content > h2 > a{
    width: 270px;
  }
  
  #last-items .home-category#events {
    padding: 0 10px 0 8px;
  }
  
  #last-items .home-category#projects {
    padding: 0 10px;
  }
  
  #last-items .home-category#blog {
    padding: 0 0 0 10px;
  }
  
  .region-posts .block#news {
    margin-right: 10px;
    padding-right: 10px;
  }
  
  .contact .block#contact-form {
    width: 300px;
  }
  
  .contact textarea {
    width: 270px;
  }
  
  .contact .block#contact-info, .contact .block#contact-persons {
    margin-right: 15px;
    padding-right: 25px;
  }
  
}


/* Modify for mobile version */
@media (max-width: 999px) {
  
  
  header#masthead {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    background: rgba(255,255,255,0.9);
  }
  
  #wrapper {
    padding-top: 81px;
  }
  
  header#masthead .search-bar,
  header#masthead .navigation-wrapper nav#secondary,
  header#masthead nav#primary-navigation,
  #news-slider .item .caption .desc,
  #promo-banners .arrow,
  .page-header .info-line .youarehere{
    display: none;
  }
  
  
  .page-header .info-line{
    text-align: center;
  }
  
  .page-header .info-line h1{
    text-align: center;
    line-height: 65px;
    margin: 0 !important;
    float: none;
  }
  
  h1#post-title,
  .news-list-item .details .title, .news-list-item .bigdetails .title{
    height: auto !important;
  }
  
  
  
  
  #news-slider .arrow,
  #news-slider .item .caption {
    height: 60px;
  }
  
  #news-slider .arrow {
    line-height: 60px;
  }
  
  #last-items .home-category {
    display: block;
    width: auto;
    float: none;
    padding: 0 15px !important;
  }
  
  #last-items #events .item .content, #last-items #events .item .content > h2 > a,
  #last-items #projects .item .content, #last-items #projects .item .content > h2 > a{
    width: auto;
  }
  
  #promo-banners,
  #promo-banners-small{
    display: none;
  }
  
  ul.blocks > li:not(.contact) {
    display: none;
  }
  
  footer#mastfoot #footerblock {
    margin: 0 15px 0px;
  }
  
  header#masthead #site-logo a {
    width: 190px;
    height: 81px;
    background-size: cover;
  }
  
  header#masthead .navigation-wrapper,
  header#masthead .navigation-wrapper .top-line,
  header#masthead,
  header#masthead .navigation-wrapper .socials a{
    height: 81px;
  }
  
  header#masthead .navigation-wrapper {
    margin-left: 190px;
  }
  
  header#masthead .navigation-wrapper .top-line {
    border-bottom: none;
  }
  
  header#masthead .navigation-wrapper .socials a {
    width: 30px;
  }
  
  header#masthead .navigation-wrapper .socials a:after {
    top: 30px;
  }
  
  header#masthead .navigation-wrapper .socials a.fb:after {
    left: 12px;
  }
  
  header#masthead .navigation-wrapper .socials a.tw:after {
    left: 8px;
  }
  
  header#masthead .navigation-wrapper .socials a.pn:after {
    left: 9px;
  }
  
  header#masthead .navigation-wrapper .langs {
    height: 81px;
    line-height: 81px;
  }
  
  .page-sidebar {
    display: block;
    float: none;
    padding-top: 0;
    width: auto;
    text-align: center;
  }
  
  .page-header .info-line h1 {
    margin: 0 0 0 15px;
  }
  
  .page-wrp-narrow {
    margin-left: 0;
    border-left: none;
  }
  
  .page-header img.cover {
    width: auto;
    height: 200px;
  }
  
  .contact .block {
    float: none;
    border-right: none !important;
    display: block;
    width: auto !important;
    margin: 0 0 30px !important;
    padding: 0 !important;
  }
  
  
  
  nav#mobile {
    display: block !important;
    position: absolute;
    top: 0;
    right: 0;
  }
  
  nav#mobile > #button{
    display: block;
    width: 65px;
    height: 81px;
    line-height: 81px;
    background: #8b0304;
    color: #fff;
    cursor: pointer;
    text-align: center;
    font-size: 24px;
  }
  
  nav#mobile  ul {
    list-style-type: none;
  }
  
  nav#mobile > ul {
    display: none;
    width: 0px;
    position: absolute;
    top: 81px;
    right: 0;
    background: yellow;
  }
  
  nav#mobile > ul > li > a {
    display: block;
    padding: 0 0 0 30px;
    height: 45px;
    line-height: 45px;
    background: #272727;
    color: #7a7a7a;
    font-size: 16px;
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 1px solid #212121;
  }
  
  nav#mobile > ul > li:hover > a,
  nav#mobile > ul > li.cur > a{
    color: #fff;
  }
  
  nav#mobile > ul > li > a .plus{
    padding: 0 30px 0 0;
    float: right;
    font-style: normal;
    font-size: 18px;
  }
  
  nav#mobile > ul > li > ul {
    height: 0;
    display: none;
  }
  
  nav#mobile > ul > li.cur > ul {
    height: auto;
    display: block;
  }
  
  nav#mobile > ul > li > ul > li > a {
    display: block;
    padding: 0 0 0 40px;
    height: 40px;
    line-height: 40px;
    background: #343434;
    color: #7a7a7a;
    font-size: 14px;
    text-decoration: none;
    white-space: nowrap;
  }
  
  nav#mobile > ul > li > ul > li:hover > a,
  nav#mobile > ul > li > ul > li.cur > a{
    color: #fff;
  }

}

/* Modify for mobile portrait version */
@media (max-width: 401px) {
  
  header#masthead .navigation-wrapper {
    border-color: #8b0304;
  }
  
  header#masthead .navigation-wrapper .socials {
    display: none;
  }
  
  .events-list-item,
  .vide-list{
    width: 310px;
  }
  
 
  
  .events-list-item .thumb{
    display: block;
    width: 310px;
    height: 152px;
    overflow: hidden;
  }
  
  .events-list-item .thumb img{
    width: 310px;
    height: 152px; 
  }
  
  .region-personal .item{
    display: block;
    float: none;
    margin: 30px auto;
    text-align: center;
  }

  
}