body {
	font-family: 'Open Sans', sans-serif;
	font-size: 17px;
	font-weight: lighter;
	line-height: 1.5;
	color: #052129;
	background: #c4ddc2;
	letter-spacing: 1px;
	/*background: url(../images/top-img.jpg); 
    background-size: cover;
  background-position: center;
  background-attachment: fixed;
  background-repeat: no-repeat;*/
}

.container-all
{
	visibility: hidden;
}

.top-img
{
  height: 100vh;
  z-index:-1;
  background: url(../images/kwiatys1.jpg); 
  background-size: cover;
  overflow:hidden;
  background-position: center;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

.slogan
{
	padding-top: 10vh;
	text-shadow: 0px 1px 1px rgba(0,0,0,0.5);
}

.body-pad-up
{
	margin-top: 60px;
}

.body-pad-down
{
	margin-bottom: 60px;
}

.body-pad-up2
{
	margin-top: 160px;
}

.body-pad-down2
{
	margin-bottom: 120px;
}

h1
{
	font-size: 40px;
	font-weight: bold;
}

h2
{
	font-size: 30px;
}

h3
{
	font-size: 25px;
	padding: 15px;
	margin-top: 0;
}

h4
{
	font-size: 22px;
}

h2 .partners
{
	font-weight: bold;
}

.portfolio
{
	background-color: #21454f;
	color: #c4ddc2;
}

.contact-img
{
   z-index:-1;
   background: url(../images/kwiatys2.jpg) no-repeat center fixed; 
   background-size: cover;
   overflow:hidden;
}

.jumbotron
{
	background: rgba(255, 255, 255, 0.6);
}

.jumbotron h3
{
	font-weight: bold;
}

.no-pad
{
	padding: 5px;
}

.no-pad img:hover
{
	opacity: 0.3;
}

.site-menu{position:fixed;top:0;left:-25%;width:25%;height:100%;background:#21454f;padding-top:25px;z-index:999;-webkit-transition:left .2s ease-in-out;transition:left .2s ease-in-out}

@media (max-width: 420px){
.site-menu{left:-80%;width:80%}
}

@media (min-width: 420px) and (max-width: 602px){
.site-menu{left:-60%;width:60%}
}
.site-menu--fly{left:0}

.site-menu__trigger{position:absolute;top:0;right:-80px;width:30px;height:20px;margin:30px;cursor:pointer;-webkit-transition:.3s;transition:.3s}

.site-menu__list
{
list-style:none;
padding:5px 25px;
}

.site-menu__link
{
text-decoration:none;
font-size:24px;
color: #c4ddc2;
-webkit-transition:color .3s;
transition:color .3s;
}

.site-menu__link:hover
{
text-decoration:none;
color: #c4ddc2;
}

.text-portfolio1, .text-portfolio2, .text-portfolio3, .text-portfolio4
{
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	color: #000;
	visibility: hidden;
	font-size: 20px;
	font-weight: bold;
}

.modal-header, .close 
{
    background-color: #21454f;
    color: #c4ddc2 !important;
    text-align: center;
	font-size: 30px;
}

.modal-footer
{
	background-color: #21454f;
    color: #c4ddc2 !important;
	font-size: 30px;
}

.portfolio1id, .portfolio2id, .portfolio3id, .portfolio4id
{
	cursor: pointer;
}

hr.double {
	width: 20vw;
	border-top: 1px solid;
	border-bottom: 1px solid;
}

.slidedown {
    -webkit-animation-name: slidedown-ex; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 1s; /* Chrome, Safari, Opera */
    -webkit-animation-iteration-count: infinite; /* Chrome, Safari, Opera */
	-webkit-animation-timing-function: ease;
    animation-name: slidedown-ex;
    animation-duration: 1s;
    animation-iteration-count: infinite;
	animation-timing-function: ease;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes slidedown-ex {
    0%   {margin-top: 0;}
    50%  {margin-top: 5vh;}
}

/* Standard syntax */
@keyframes slidedown-ex {
    0%   {margin-top: 0;}
    50%  {margin-top: 5vh;}
}

.slideup
{
	visibility: hidden;
	position: fixed;
    bottom: 30px;
    right: 30px; 
	cursor: pointer;
}

.slideup:hover
{
	opacity: .5;
}

.loader
{	
	  visibility: visible;
	  position: absolute;
	  left: 50%;
	  top: 50%;
	  z-index: 1;
	  width: 100px;
	  height: 100px;
	  margin: -75px 0 0 -75px;
	  border: 5px solid #c4ddc2;
	  border-radius: 50%;
	  border-top: 5px solid #21454f;
	  width: 90px;
	  height: 90px;
	  -webkit-animation: spin 2s linear infinite;
	  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
