﻿#start-slideshow    {height: 80vh; width:100%; margin:0 0 0 0; min-height:200px; display:block; margin:0 auto !important; position:relative;  margin: 0 0 -96px 0; z-index:88;}

#start-puffs                        {width:1100px; height:auto; display:block; margin:-6em auto 0 auto; position:absolute; z-index:99; clear:left; bottom: 50px; left: 0; right: 0; }
#start-puffs .puffitem              {width:24.0625%; height:300px; margin:0 1.25% 0 0; padding:1%; float:left; box-sizing:border-box; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; text-align:center; font:200 1em/1.5em "nimbus-sans", arial, verdana, sans-serif;}
#start-puffs .puffitem.last         {margin-right:0;}

#start-puffs .puffitem a            {display:block; height:100%; width:100%; text-decoration:none; color:inherit;}
#start-puffs .puffitem span         {display:block;}
#start-puffs .puffitem .image       {width:100%; height:136px; text-align:center; margin-bottom:2em;}
#start-puffs .puffitem .image img   {width:136px; height:136px; margin:0 auto;}
#start-puffs .puffitem .rub         {color:#fff; text-transform:uppercase; padding:0; margin:0; font:700 1.75em "futura-pt", Arial, Verdana, Sans-serif;}
#start-puffs .puffitem .cntnt       {color:#fff; margin-top:0.5em; margin-bottom:1em; font:200 1.1em "futura-pt", Arial, Verdana, Sans-serif;}
#start-puffs .puffitem .link        {padding:0.85em 1.65em 0.6em 1.55em; background-color:#b7b7b7; color:#fff; text-transform:uppercase; border-bottom:5px solid #9a9a9a; display:inline-block; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; display:none;}
#start-puffs .puffitem .link span   {padding-right:23px; background:url(/gfx/startpage-puff-button-bg.png) 100% 40% no-repeat; line-height:20px; height:20px; font-size:1em;}

#start-content                      {width:100%; display:block; margin-top:-105px;}
#start-content-inner                {max-width:1100px; display:block; margin:0 auto 2em auto;}
#start-content-inner p              {margin-bottom:0; padding-bottom:0;}
#start-content-inner iframe         {width:99%; padding:0.5%; background-color:rgba(255,255,255,0.3); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}



@media screen and (max-width: 1100px)
{
    #start-puffs            {position:relative; bottom:initial; left:initial; right:initial;}

    #start-puffs            {width:96%; height:auto; margin:2em auto 2em auto;}
    #start-puffs .puffitem  {width:24.0625%; height:370px;}
    
    #start-slideshow        {max-width:100%; margin: 0; min-height:200px; display:block; margin:0 auto; overflow:hidden; position:relative; z-index:88;}
    
    #start-content          {margin-top:-76px;}
}

@media screen and (max-width: 860px)
{
    #start-slideshow                    {width:100%; min-height:100px;}
    #start-slideshow .flexslider img    {width:120% !important; height:auto !important; display:block; margin-left:-10% !important;}
    
    #start-puffs                        {width:600px; margin:2em auto 0 auto;}
    #start-puffs .puffitem              {width:45.5%; height:300px; margin:0 2.25% 90px 2.25%;}
    
    #start-content                      {width:100%;}
    #start-content-inner                {width:570px; height:auto; clear:left; display:block; margin:0 auto; padding:3em 0 2em 0;}
    
    #start-content-inner a              {/*background-image:none; background-color:#fc622f;*/ width:auto; height:auto; line-height:1.75em; padding:2em; /*-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; border:1px solid #da4818;*/}
    #start-content-inner a span         {padding-right:23px; background:url(/gfx/startpage-puff-button-bg.png) 100% 40% no-repeat; font-size:1.2em; text-transform:uppercase;}
}

@media screen and (max-width: 600px)
{
    #start-slideshow    {position:relative; top: 0px; margin: 0; }

    #start-slideshow .flexslider img    {width:150% !important; height:auto !important; display:block; margin-left:-25% !important;}

    /*#start-puffs .puffitem          {min-height:320px; height:auto;}
    #start-puffs .puffitem .rub     {font-weight:700; font-size:1.5em;}
    #start-puffs .puffitem .content {margin-top:1em; font-size:1em;}*/
    
    #start-puffs                {width:280px; margin:-1em auto 0 auto;}
    #start-puffs .puffitem      {width:100%; height:auto; margin:0 0 90px 0; padding:1.5em;}
    
    #start-content          {width:100%; margin-top:0px;}
    #start-content-inner    {width:90%; height:auto; clear:left; display:block; margin:0 auto; padding:0.75em 0 2em 0; overflow:auto;}
    
    #start-content-inner-text       {width:100%;}
    #start-content-inner-image      {float:none; width:60%; height:auto; display:block; margin:1em auto;}
}

@media screen and (max-width: 430px)
{
    /*#start-slideshow img    {width:200% !important; margin-left:-50% !important;}*/
    
    #start-puffs                        {margin:4em auto 0 auto;}
    /*#start-puffs .puffitem              {width:100%; height:auto; margin:0 0 1em 0; padding:10% 3%;}
    #start-puffs .puffitem .image img   {height:180px; width:auto;}
    #start-puffs .puffitem .rub         {font-size:1.75em;}
    #start-puffs .puffitem .content     {font-size:1.25em;}*/
    
    #contact        {padding:20px 0 5px 0;}
    #contact a      {padding:5px 20px; margin:0 10px 0 0; display:inline-block;}
    #contact span   {padding:15px 0; display:inline-block; width:100%; line-height:1em;}
    
    /*#start-content          {width:100%; margin-top:2em;}
    #start-content-inner    {width:90%; height:auto; clear:left; display:block; margin:0 auto; padding:2em 5%; overflow:auto;}
    
    #start-content-inner-text       {width:100%;}
    #start-content-inner-image      {float:none; width:80%; height:auto; display:block; margin:1em auto;}*/
}