html
{
	font-size: 62.5%;
}

h1, h2, h3, h4{
	margin: 0;
	padding: 0;
}

body
{
	margin: 0;
	padding: 0;
	font-size: 1.6rem;
	font-family: Arial;
	background: #353535;
}

.container
{	
	position: relative;
	width: 1100px;
	height: auto;
	overflow: none;
}

.row
{
	margin: 0;
	margin-right: -50px;
	padding: 0;
}

.logo
{
	background-image: url("");
    background-repeat: no-repeat;
	background-size: cover;
}

.mTop
{
	margin-top: -10px;
}

.top
{
	margin-top: 2rem;
}

.right
{ 
	margin-right: 2rem;
}

.bottom
{
	margin-bottom: 2rem;
}

.col-md-9
{
	flex: 42%;
    max-width: 100%;
	height: auto;
	max-height: 8rem;
	background: #e0a315;
	margin-left: 2rem;
}

.col-md-6
{
    flex: 42%;
    max-width: 42%;
	height: auto;
	max-height: 58rem;
	background: #e0a315;
	margin-top: 2rem;
}

.col-md-7
{
    flex: 55%;
    max-width: 55%;
	height: auto;
	max-height: 60rem;
	background: #e0a315;
	margin-top: 2rem;
}

.col-md-2
{
    flex: 40%;
    max-width: 90%;
	height: auto;
	max-height: 59rem;
	background: #e0a315;
	margin-top: 2rem;
}

.nobox
{
	margin-top: 2rem;
	padding: 0;
	font-size: 1.6rem;
	background: #353535;
	with: 100%;
	height: auto;
	max-height: 30.5rem;
	border-radius: 10px;
}

.container .box4
{
	position: relative;
	width: calc(825px - 30px);
	height: calc(820px - 30px);
	float: left;
	box-sizing: border-box;
	border-radius: 10px;
}

.container .box4 .icon
{
	position: absolute;
	top: 2;
	left: 0;
	width: 100%;
	height: 100%;	
	transition: 0.4s;
	z-index: 1;
    border-radius: 10px;
}

.container .box4 .icon2
{
	list-style: none;
	
}

.container .box4 .icon2 .fa
{
	font-size: 2.6em;
}

.container .box4 .icon
{
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	border-radius: 160%;
	background-size: 5%;
}

.container .box4 .content
{
	position: relative;
	right: 100%;
	height: calc(100% - 100px);
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
	transition: 0.5s;
	opacity: 0;
    overflow: auto;
}

.container .box4 .content
{
    right: 0;
	opacity: 2;
}	

.container .box4 .content h1
{
	margin: 0 0 10px;
	padding: 0;
	color: #e0a315;
	font-size: 2.4rem;
}

.container .box4 .content h2
{
	margin: 0 0 10px;
	padding: 0;
	color: #e0a315;
	font-size: 2rem;
}

.container .box4 .content p
{
    text-align: left;
    font-size: 1.8rem;
	margin: 0;
	padding: 0;
	color: #fff;
    line-height: 3.6rem;
}

.container .box4 .content a
{
    color: #e0a315;
}

.container .box4 .content a:visited
{
    color: #fff;
}

.container .box4 .content li
{
    text-align: left;
    font-size: 1.8rem;
	margin: 0;
	padding: 0;
	color: #fff;
    line-height: 3.6rem;
}

.container .box4
{
background: -moz-linear-gradient(268deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ff3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(108,121,182,1)), color-stop(1%, rgba(108,121,182,1)), color-stop(97%, rgba(53,53,53,1)), color-stop(100%, rgba(53,53,53,1))); /* safari4+,chrome */
background: -webkit-linear-gradient(268deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* safari5.1+,chrome10+ */
background: -o-linear-gradient(268deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* opera 11.10+ */
background: -ms-linear-gradient(268deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ie10+ */
background: linear-gradient(182deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* w3c */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6C79B6', endColorstr='#353535',GradientType=0 ); /* ie6-9 */; 
}

.container .box5
{
	position: relative;
	width: calc(350px - 30px);
	height: calc(300px - 30px);
	background: #fff;
	float: left;
	box-sizing: border-box;
	border-radius: 10px;
}

.container .box5 .icon
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #f00;	
	transition: 0.5s;
	z-index: 1;
}

main .dom
{
	position: fixed;
	top: 0;
    left: 0;
    margin-top: 6%;
	margin-left: 0.8%;
	font-size: 5rem;
    color: #FFF;
	z-index: 10;
}
.container .box5 .icon
{
	top: 1rem;
	left: calc(5% - 5px);
	width: 70px;
	height: 70px;
	border-radius: 50%;
}

.container .box5 .icon .fa
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	font-size: 6rem;
	transition:0.5s;
	color: #000; 
}

.container .box5 .icon .fa
{
	font-size: 4rem;
	color: #fff;
}

.container .box5 .content
{
	position: relative;
	top: 100%;
	height: calc(100% - 100px);
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
	transition: 0.5s;
	opacity: 0;
}

.container .box5 .content
{
	top: 10px;
	opacity: 2;
}	

.container .box5 .content h2
{
	margin: 0 0 10px;
	padding: 0;
	color: #fff;
	font-size: 2,3px;
}

.container .box5 .content h2.male
{
	padding-left: 25%;
}

.malaIkona
{
	margin-left: 5%;
}

.container .box5 .content p
{
	margin: 0;
	padding: 0;
	color: #fff;
}

b
{
	color: #e0a315;
}

.container .box5 .icon
{
	background-color: #e0a315;
}

.container .box5
{
background: -moz-linear-gradient(268deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ff3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(108,121,182,1)), color-stop(1%, rgba(108,121,182,1)), color-stop(97%, rgba(53,53,53,1)), color-stop(100%, rgba(53,53,53,1))); /* safari4+,chrome */
background: -webkit-linear-gradient(268deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* safari5.1+,chrome10+ */
background: -o-linear-gradient(268deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* opera 11.10+ */
background: -ms-linear-gradient(268deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ie10+ */
background: linear-gradient(182deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* w3c */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6C79B6', endColorstr='#353535',GradientType=0 ); /* ie6-9 */; 
}

.bip img{
	position: absolute;
	width: 5%;
    top:0;
    margin-left: 98%;
    margin-top: 1.8%;
	float: right;
	z-index: 2;
}


	@media (max-width: 589px) 
	{
	html
	{
	font-size: 62.5%;
	}
	
	body
	{
	margin: 0;
	padding: 0;
	font-size: 1.6rem;
	font-family: Arial;
	background: #353535;
	}

	.container
	{	
	position: relative;
	width: 340px;
	height: auto;
	margin: ;
	}
    
    main .dom
    {
    margin-top: 20%;
    margin-left: 3%;    
    }
        
	.container .box 
	{
	margin-top: 1rem;
	}
	
	h1, h2, h3, h4
	{
	margin: 0;
	padding: 0;
	}
        
	.logo
	{
	background-image: url("");
    background-repeat: no-repeat;    
	}

	.row
	{
	margin: 0;
	padding: 0; 
	}
	
	.top
	{
	margin-top: 0;
	}
	
	.right
	{ 
	margin-right: 0;
	}

	.bottom
	{
	margin-bottom: 0;
	}

	.col-md-9
    {
	flex: 100%;
    max-width: 100%;
	height: auto;
	max-height: 8rem;
	background: #e0a315;
	margin-left: 0rem;
    margin-top: 2rem;    
    }

    .col-md-6
    {
    flex: 100%;
    max-width: 100%;
	height: auto;
	max-height: 60rem;
	background: #e0a315;
	margin-top: 2rem;
    }
	
	.col-md-7
    {
    flex: 100%;
    max-width: 100%;
	height: auto;
	max-height: 60rem;
	background: #e0a315;
	margin-top: 2rem;
    }
	
    .col-md-2
    {
    flex: 100%;
    max-width: 100%;
	height: auto;
	max-height: 59rem;
	background: #e0a315;
    margin-top: 0;    
    }
	
	.nobox
	{
	background: #353535;
    margin-bottom: 2rem;
	}
    
    body .userway .userway_accessibility_icon .userway-spacer
    {    
          margin-top: 100px;      
    }
        
	.row .box5 .content h2.male
    {
    font-size: 1.5rem;
    padding-left: 3.5rem;
	
    }
    
	.container .box5 .content h2.male
	{
		padding-left: 0;
	}

	.malaIkona
	{
		margin-left: 0;
	}
	
    .row .box5{
	position: relative;
	width: calc(360px - 50px);
	height: calc(140px - 50px);
	background: #e0a315;
	float: left;
	box-sizing: border-box;
	overflow: hidden;
	border-radius: 10px;
	}

	.row .box5 .icon
	{
	position: absolute;
	font-size: 8rem;
	text-align: center;
	color: #000000;
	top: 0 ;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #e0a315;	
	transition: 0.5s;
	z-index: 1;
	}

	.row .box5 .icon
	{
	top: 5%;
	left: calc(5% - 5px);
	width: 70px;
	height: 70px;
	border-radius: 50%;
	}

	.row .box5 .icon .fa
	{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	font-size: 7rem;
	transition:0.5s;
	color: #000; 
	}

	.row .box5 .icon .fa
	{
	font-size: 4rem;
	color: #fff;
	}
    
	.row .box5 .content
	{
	position: relative;
	top: 100%;
	height: calc(100% - 100px);
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
	transition: 0.5s;
	opacity: 0;
	}

	.row .box5 .content
	{
	top: 15%;
	opacity: 2;
	}	

	.row .box5 .content h2
	{
	margin: 0 0 10px;
	padding: 0;
	color: #fff;
	font-size: 1.5rem;
	}

	.row .box5 .content h3
	{
	margin: 0 0 10px;
	padding: 0;
	color: #fff;
	font-size: 2rem;
	}

	.row .box5 .content p
	{
	margin: 0;
	padding: 0;
	color: #fff;
	}

	.row .box5 .icon
	{
	background-color: #e0a315;
	}

	.row .box5
	{
	background: -moz-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(108,121,182,1)), color-stop(1%, rgba(108,121,182,1)), color-stop(97%, rgba(53,53,53,1)), color-stop(100%, rgba(53,53,53,1))); /* safari4+,chrome */
	background: -webkit-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ie10+ */
	background: linear-gradient(89deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6C79B6', endColorstr='#353535',GradientType=1 ); /* ie6-9 */	
	}
    
    .parallax
    {
	max-height: 25rem;
    }
        
    .parallax .img1
    {
    padding-top: 20rem;
    padding-left: 5rem;
    padding-right: 5rem;    
    }   
        
    }

            @media (min-width: 590px) and (max-width: 767px)
            {
            html
            {
            font-size: 62.5%;
            }

            body
            {
            margin: 0;
            padding: 0;
            font-size: 1.6rem;
            font-family: Arial;
            background: #353535;
            }

            .container
            {	
            position: relative;
            width: 640px;
            height: auto;
            margin: ;
            }

            .container .box 
            {
            margin-top: 1rem;
            }

            h1, h2, h3, h4
            {
            margin: 0;
            padding: 0;
            }

            .bip img
            {
            width: 8%;
            }

            .logo
            {
            background-image: url("");  
            }

            .row
            {
            margin: 0;
            padding: 0; 
            }

            .top
            {
            margin-top: 0;
            }

            .right
            { 
            margin-right: 0;
            }

            .bottom
            {
            margin-bottom: 0;
            }
                
            main .dom
            {
            margin-top: 12%;
            margin-left: 1.8%;    
            }   

            .col-md-9
            {
            flex: 100%;    
            max-width: 100%;
            height: auto;
            margin-bottom: 1rem;
            margin-left: 0; 
            }

            .col-md-6
            {    
            max-width: 64rem; 
            flex: 0 0 100%;    
            }
			
			.col-md-7
            {    
            max-width: 64rem; 
            flex: 0 0 100%;    
            }
			
            .col-md-2
            {
            with: 100%;
            max-width: 64rem;
            height: auto;
            margin-bottom: 1rem;
            margin-left: 0; 
            }

            .nobox
            {
            background: #353535;
            margin-top: 1rem;
            margin-bottom: 0;
            }

            .row .box5{
            position: relative;
            width: calc(660px - 50px);
            height: calc(140px - 50px);
            background: #e0a315;
            float: left;
            box-sizing: border-box;
            overflow: hidden;
            border-radius: 10px;
            }

            .row .box5 .icon
            {
            position: absolute;
            font-size: 8rem;
            text-align: center;
            color: #000000;
            top: 0 ;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: #e0a315;	
            transition: 0.5s;
            z-index: 1;
            }

            .row .box5 .icon
            {
            top: 5%;
            left: calc(5% - 5px);
            width: 70px;
            height: 70px;
            border-radius: 50%;
            }

            .row .box5 .icon .fa
            {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            font-size: 7rem;
            transition:0.5s;
            color: #000; 
            }

            .row .box5 .icon .fa
            {
            font-size: 4rem;
            color: #fff;
            }

            .row .box5 .content
            {
            position: relative;
            top: 100%;
            height: calc(100% - 100px);
            text-align: center;
            padding: 20px;
            box-sizing: border-box;
            transition: 0.5s;
            opacity: 0;
            }

            .row .box5 .content
            {
            top: 10%;
            opacity: 2;
            }	

            .row .box5 .content h2
            {
            margin: 0 0 10px;
            padding: 0;
            color: #fff;
            font-size: 2.3rem;
            }

            .row .box5 .content h3
            {
            margin: 0 0 10px;
            padding: 0;
            color: #fff;
            font-size: 2rem;
            }
			
			.container .box5 .content h2.male
			{
				padding-left: 0;
			}

			.malaIkona
			{
				margin-left: 0;
			}
	
            .row .box5 .content p
            {
            margin: 0;
            padding: 0;
            color: #fff;
            }

            .row .box5 .icon
            {
            background-color: #e0a315;
            }

            .row .box5
            {
            background: -moz-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ff3.6+ */
            background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(108,121,182,1)), color-stop(1%, rgba(108,121,182,1)), color-stop(97%, rgba(53,53,53,1)), color-stop(100%, rgba(53,53,53,1))); /* safari4+,chrome */
            background: -webkit-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* safari5.1+,chrome10+ */
            background: -o-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* opera 11.10+ */
            background: -ms-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ie10+ */
            background: linear-gradient(89deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* w3c */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6C79B6', endColorstr='#353535',GradientType=1 ); /* ie6-9 */	
            }
            }

    @media (min-width: 768px) and (max-width: 1250px)
	{
	html
	{
	font-size: 62.5%;
	}
	
	body
	{
	margin: 0;
	padding: 0;
	font-size: 1.6rem;
	font-family: Arial;
	background: #353535;
	}

	.container
	{	
	position: relative;
	width: 640px;
	height: auto;
	margin: ;
	} 
        
	.container .box 
	{
	margin-top: 1rem;
	}
	
	h1, h2, h3, h4
	{
	margin: 0;
	padding: 0;
	}
        
    main .dom
    {
    margin-top: 9%;
    margin-left: 1%;    
    }   
        
	.logo
	{
	background-image: url("");
	}

	.row
	{
	margin: 0;
	padding: 0; 
	}
	
	.top
	{
	margin-top: 0;
	}
	
	.right
	{ 
	margin-right: 0;
	}

	.bottom
	{
	margin-bottom: 0;
	}

	.col-md-9
	{
	with: 100%;
	height: auto;
	margin-bottom: 1rem;
	margin-left: 0; 
    max-width: 84rem;
    flex: 100%;    
	}
	
    .col-md-6
    {    
    max-width: 84rem; 
    flex: 0 0 100%;    
    }
	
	.col-md-7
    {    
    max-width: 84rem; 
    flex: 0 0 100%;    
    }
	
	.col-md-2
	{
	with: 100%;
	max-width: 84rem;
	height: auto;
	margin-bottom: 1rem;
	margin-left: 0; 
    flex: 100%;    
	}
	
	.nobox
	{
	background: #353535;
    margin-top: 1rem;
    margin-bottom: 0;
	}
    
    .row .box5{
	position: relative;
	width: calc(860px - 50px);
	height: calc(140px - 50px);
	background: #e0a315;
	float: left;
	box-sizing: border-box;
	overflow: hidden;
	border-radius: 10px;
	}

	.row .box5 .icon
	{
	position: absolute;
	font-size: 8rem;
	text-align: center;
	color: #000000;
	top: 0 ;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #e0a315;	
	transition: 0.5s;
	z-index: 1;
	}

	.row .box5 .icon
	{
	top: 5%;
	left: calc(5% - 5px);
	width: 70px;
	height: 70px;
	border-radius: 50%;
	}

	.row .box5 .icon .fa
	{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	font-size: 7rem;
	transition:0.5s;
	color: #000; 
	}

	.row .box5 .icon .fa
	{
	font-size: 4rem;
	color: #fff;
	}
    
	.row .box5 .content
	{
	position: relative;
	top: 100%;
	height: calc(100% - 100px);
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
	transition: 0.5s;
	opacity: 0;
	}

	.row .box5 .content
	{
	top: 15%;
	opacity: 2;
	}	

	.row .box5 .content h2
	{
	margin: 0 0 10px;
	padding: 0;
	color: #fff;
	font-size: 2.3rem;
	}

	.row .box5 .content h3
	{
	margin: 0 0 10px;
	padding: 0;
	color: #fff;
	font-size: 2rem;
	}

	.row .box5 .content p
	{
	margin: 0;
	padding: 0;
	color: #fff;
	}
	
	.container .box5 .content h2.male
	{
		padding-left: 0;
	}

	.malaIkona
	{
		margin-left: 0;
	}
	
	.row .box5 .icon
	{
	background-color: #e0a315;
	}

	.row .box5
	{
	background: -moz-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ff3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(108,121,182,1)), color-stop(1%, rgba(108,121,182,1)), color-stop(97%, rgba(53,53,53,1)), color-stop(100%, rgba(53,53,53,1))); /* safari4+,chrome */
	background: -webkit-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* safari5.1+,chrome10+ */
	background: -o-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* opera 11.10+ */
	background: -ms-linear-gradient(1deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* ie10+ */
	background: linear-gradient(89deg, rgba(108,121,182,1) 0%, rgba(108,121,182,1) 1%, rgba(53,53,53,1) 97%, rgba(53,53,53,1) 100%); /* w3c */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6C79B6', endColorstr='#353535',GradientType=1 ); /* ie6-9 */	
	}
}

.parallax{
	background-image: url('../img/IMG_4.jpg');
	background-size: cover;
	background-attachment: fixed;
	height: 40rem;
}

.parallax .img1{
    padding-top: 15rem;
	padding-left: 2rem;
    max-width: 120%;
}

time.zegar
{
  font-size: 1em; /* change icon size */
  display: block;
  position: relative;
  width: 9em;
  height: 9em;
  background-color: #fff;
  margin: 2em auto;
  border-radius: 0.6em;
  box-shadow: 0 1px 0 #bdbdbd, 0 2px 0 #fff, 0 3px 0 #bdbdbd, 0 4px 0 #fff, 0 5px 0 #bdbdbd, 0 0 0 1px #bdbdbd;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  -webkit-transform: rotate(0deg) skewY(0deg);
  -webkit-transform-origin: 50% 10%;
  transform-origin: 50% 10%;
}

time.zegar *
{
  display: block;
  width: 100%;
  font-size: 1.4em;
  font-weight: bold;
  font-style: normal;
  text-align: center;
}

time.zegar strong
{
  position: absolute;
  top: 0;
  padding: 0.4em 0;
  color: #fff;
  background-color: #e0a315;
  border-bottom: 1px dashed #e0a315;
  box-shadow: 0 2px 0 #353535;
}

time.zegar em
{
  position: absolute;
  bottom: 0.3em;
  color: #fd9f1b;
}

time.zegar span
{
  width: 100%;
  font-size: 3em;
  letter-spacing: -0.05em;
  padding-top: 1em;
  color: #2f2f2f;
}

time.zegar:hover, time.zegar:focus
{
  -webkit-animation: swing 0.6s ease-out;
  animation: swing 0.6s ease-out;
}

@-webkit-keyframes swing {
  0%   { -webkit-transform: rotate(0deg)  skewY(0deg); }
  20%  { -webkit-transform: rotate(12deg) skewY(4deg); }
  60%  { -webkit-transform: rotate(-9deg) skewY(-3deg); }
  80%  { -webkit-transform: rotate(6deg)  skewY(-2deg); }
  100% { -webkit-transform: rotate(0deg)  skewY(0deg); }
}

@keyframes swing {
  0%   { transform: rotate(0deg)  skewY(0deg); }
  20%  { transform: rotate(12deg) skewY(4deg); }
  60%  { transform: rotate(-9deg) skewY(-3deg); }
  80%  { transform: rotate(6deg)  skewY(-2deg); }
  100% { transform: rotate(0deg)  skewY(0deg); }
}