﻿/*---------------------
Start page
---------------------*/
#start-slideshow            {width:100%; margin:0 auto;}
.flexslider                 {overflow:hidden; width:100%; margin:0 auto !important;}
/*.flexslider .slides         {padding-bottom:56%; display: block; width: 100%; height: auto; position: relative; overflow: hidden; max-height:1080px;}*/
.flexslider .slides li {padding-bottom:56%; display: block; width: 100%; height: auto; position: relative; overflow: hidden; max-height:1080px;}
.flexslider .slides li .image  {background-size:cover; background-position:center;max-height:1080px; display: block; max-width: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity:0.5; margin:auto;}

.flexslider .slides li .image {
filter: brightness(50%);
}
/*
.flexslider .slides li img  {opacity:0.5; }
.flexslider .slides li a    {display:block; height:100%; width:100%;}*/

#start-content              {margin:0 auto;}


.starttext                  {padding:92px 0; background-image:url('/gfx/start-bg.png'); /*background-size:cover;*/ background-repeat:no-repeat; background-position:left -800px center; display:flex;}
.start-left                 {width:44%; float:left; padding:0 20px 0 0;  margin-left:6%; position:relative;}
.start-right                {width:44%; float:right; padding:0 0 0 20px; margin-right:6%;}

.start-left .innerText      {max-width:800px; float:right; padding:0px 0; font-size:30px; position:absolute; top: 50%; transform: translateY(-50%);}
.start-right img            {max-width:100%; max-width:800px; float:left; width:100%; padding:0;}

.puffitem                   {width:33.33%; display:inline-block; }

.puffContent                {overflow: hidden; padding-top: 100%; position: relative; background-color:#212121;}
.puffContent .image         {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: transparent; background-position:0% 0%; background-repeat:no-repeat; opacity: 0.66; width:100%; background-size:contain;}

.puffContent .header        {width:100%; height:100%; text-align:center;}
.header .rub                {top: 50%; transform: translateY(-50%); position:relative; font-size:42px; color:#ffffff; text-transform:uppercase; }
.header a                   {display:block; text-decoration:none; color:#ffffff;}

.fbNews h2                  {text-align:center; font-size:42px; text-transform:uppercase; font-weight:800;}

.facebook-posts{
    padding-top:35px;
    margin: 10px -10px;
    overflow: hidden;
}
.facebook-posts .fb-item{
    float: left;
    width: 33.3%;
}
.facebook-posts .fb-item-inner{
    padding: 10px;
    margin: 10px;
    position:relative;
}

.fb-item-inner .image
{
    overflow: hidden; padding-top: 75%; position: relative; background-color:#c7c7c7;
}

    .fb-item-inner .image > a
    {
        position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: #c7c7c7; /*background-position:0% 0%;*/ background-repeat:no-repeat; /*opacity: 0.66;*/ width:100%; /*background-size:cover;*/ width:100%; height:100%; margin:auto; background-position:center;
    }

        .fb-item-inner .image > a.smallImage
        {
            background-size:initial;
        }

.fb-item-inner .message
{
    margin-top:40px;
    font-size:22px;
    font-weight:300;
}

    .fb-item-inner .message a
    {
        text-decoration:none;
        font-weight:500;
    }

    .fb-item-inner .date a
    {
        font-size:16px;
        font-weight:700;    
    }



@media screen and (max-width: 860px)
{
    .start-left .innerText
    {
        font-size:22px;
    }

    .header .rub
    {
        font-size:30px;
    }

}

@media screen and (max-width: 600px)
{
    .flexslider .slides li
    {
        min-height:400px;
    }
    .facebook-posts .fb-item-inner, .facebook-posts
    {
        margin:0;
        padding:0;
    }

    .fbNews h2                  {font-size:32px; padding-bottom:45px;}

    .facebook-posts .fb-item
    {
        width:100%;        
        float:none;
        margin:0 auto 20px auto;
    }

    .fb-item-inner .message
    {
        margin-top:20px;
        font-size:16px;
    }
    
    .header .rub
    {
        font-size:32px;
    }
}

@media screen and (max-width: 480px)
{
}
