﻿
/*---------------------
Start page
---------------------*/
#start-slideshow            {width:100%; margin:0 auto;}
.flexslider                 {overflow:hidden; width:100%; margin:0 auto !important;}
.flexslider .slides li      {background-size:cover; background-position:center; height:auto !important; line-height:unset !important; padding-bottom:37.44%; overflow: visible !important; }
.flexslider .slides li a    {display:block; height:100%; width:100%;}

.start-text                 {background-color:#ffffff; width:100%;}
.start-text .inner          {min-height:unset; width:60%; margin:0 auto; text-align:center;}

#start-content                      {width:960px; height:225px; margin:10px auto 0 auto; padding:0;}

#start-puffs						{width:627px; height:225px; margin:0; padding:0; overflow:hidden; float:left;}
#start-puffs .puffitem				{width:48.5%; height:100%; margin:0 3% 0 0; padding:0; float:left; text-align:left; overflow:hidden; position:relative;}
#start-puffs .puffitem.last			{margin-right:0;}

#start-puffs .puffitem a                                                {display:block; width:100%; height:100%; text-decoration:none;}
#start-puffs .puffitem .rub, #start-puffs .puffitem a .rub              {transition-duration:0.2s; -webkit-transition-duration:0.2s; width:100%; display:block; margin:0 0 1% 0; padding:0; font-size:14px; font-weight:bold; color:#333; text-align:left;}
#start-puffs .puffitem .image, #start-puffs .puffitem a .image          {width:100%; height:145px; display:block; margin:0 0 2.5% 0; text-align:center; background-color:#fff; overflow:hidden;}
#start-puffs .puffitem .image img, #start-puffs .puffitem a .image img  {transition-duration:0.2s; -webkit-transition-duration:0.2s; width:100%; display:block; opacity:1.0; filter:alpha(opacity=100);}
#start-puffs .puffitem .content, #start-puffs .puffitem a .content      {transition-duration:0.2s; -webkit-transition-duration:0.2s; width:100%; /*background:rgba(0,0,0,.6); color:#fff; text-shadow:0 -1px 0 rgba(0,0,0,.3);*/}
#start-puffs .puffitem .content p, #start-puffs .puffitem a .content p  {transition-duration:0.2s; -webkit-transition-duration:0.2s; /*padding:0; margin:0;*/ line-height:16px; font-size:12px; color:#444;}

#start-puffs .puffitem:hover .rub                                               {transition-duration:0.2s; -webkit-transition-duration:0.2s; color:#000;}
#start-puffs .puffitem:hover .content, #start-puffs .puffitem:hover .content p  {transition-duration:0.2s; -webkit-transition-duration:0.2s; color:#222;}
#start-puffs .puffitem:hover img, #start-puffs .puffitem a:hover img            {transition-duration:0.2s; -webkit-transition-duration:0.2s; opacity:0.8; filter:alpha(opacity=80);}

#start-news                         {width:32.5%; height:225px; margin:0; padding:0; float:right; text-align:left; overflow:hidden;}
#start-news h3                      {padding:0 0 2.6% 0; margin:0; display:block; font-size:16px; line-height:18px;}
#start-news ul                      {list-style:none; margin:0; padding:0; width:100%; overflow:hidden;}
#start-news ul li                   {width:100%; padding:0; margin:0 0 3% 0;}
#start-news ul li a                 {transition-duration:0.2s; -webkit-transition-duration:0.2s; display:block; text-decoration:none; padding:1.5% 1.5% 1.5% 3%; margin:0; border-left:2px solid #ccc;}
#start-news ul li a .date           {display:block; font-size:10px; color:#888;}
#start-news ul li a .title          {display:block; color:#444; width:100%; max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
#start-news ul li a:hover           {transition-duration:0.2s; -webkit-transition-duration:0.2s; border-left:2px solid #2980b9; background-color:#f5f5f5;}
#start-news ul li a:hover .date     {color:#666;}
#start-news ul li a:hover .title    {color:#000;}


.PagePuffList{
    margin: 10px -10px;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
}
.PagePuffList .puffitem{
    display:inline-block;
    width: 33.3%;    
    text-align:center;
    margin-bottom:20px;
    max-width:387px;
    margin-left:auto; 
    margin-right:auto;
}
.PagePuffList .innerPuff{
    padding: 0px;
    margin: 10px;
}
.PagePuffList .innerPuff > a{
    display: block;
    text-decoration: none;
    color:#686767;
}
.PagePuffList .image{
    width:100%; 
    padding-bottom:70%;    
    overflow: hidden;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;    
    margin:0 auto;
}
.PagePuffList .image img{
    width: 100%;
}
.PagePuffList .rubText{    
    margin: 10px 0;
    text-transform:uppercase;
    font-size:19px;
    font-weight:700;
    color:#2d2d2d;
}

@media screen and (max-width: 1024px)
{   
    .PagePuffList .puffitem { width: 50%; } 
    .start-text .inner          {width:90%;}
    .flexslider .slides li      {padding-bottom:59%; }
}

@media screen and (max-width: 600px)
{
    .PagePuffList .puffitem { width: 100%; height: auto !important; }
}

@media screen and (max-width: 480px)
{
}
