/* --------------------------------------- */
/*                                         */
/*           startstyles.css               */
/*                                         */
/*       Style dla pliku start.html        */
/*                                         */
/* --------------------------------------- */

div.sname1 {
	font-family: Tahoma;
	font-size: 28px;
	font-style: none;
	color: #003399;
	text-decoration: none;
	font-weight: bold;
	padding-bottom: 3px;
	text-shadow: 
	            1px -1px 0 #000033,
	            -1px 2px 1px #777777,
	            -2px 4px 1px #BBBBBB,
	            -3px 6px 1px #CCCCCC;
}

div.sname2 {
	font-family: Impact;
	font-size: 42px;
	font-weight: bold;
	color: #003399;
	text-decoration: none;
	background-color: none;
	text-shadow: 
	            1px -1px 0 #009999, 
                -1px 2px 1px #006666, 
                -2px 4px 1px #336666, 
                -3px 6px 1px #787777, 
                -4px 8px 1px #7b7a7a;
}

td.std1 {
	font-family: Arial;
	font-size: 15px;
	font-weight: bold;
	color: #003333;
	text-decoration: none;
	text-shadow: 1px -1px 0 #66FF00;
	text-align: center;
}

td.std2 {
	font-family: Helvetica;
	font-size: 15px;
	font-weight: bold;
	color: #000022;
	text-shadow: 1px -1px 0 #FFFF66;
}

td.std3 {
	font-family: Arial;
	font-size: 15px;
	font-weight: bold;
	color: #000066;
	text-align: center;
	text-shadow: 1px -1px 0 #00CC55;
}

div.snews1 {
	font-family: Helvetica;
	font-size: 20px;
	color: #000066;
	font-weight: bold;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
	background-color: #336699;
	text-shadow: 2px -1px 1px #00FF00;
	background: #336699; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#336699, #DDDDDD); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient (#336699, #DDDDDD); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#336699, #DDDDDD); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#336699, #DDDDDD); /* Standard syntax */
}

/*
--------------- sButton1 ------------------
*/
a.sButton1 {
	background-color:#44c767;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:17px;
	padding:6px 32px;
	text-decoration:none;
	text-shadow:0px 1px 0px #2f6627;
}
a.sButton1:hover {
	background-color:#5cbf2a;
}
a.sButton1:active {
	position:relative;
	top:1px;
}

/*
--------------- sButton2 ------------------
*/
a.sButton2 {
	background-color: #ff3333;
	display: inline-block;
	cursor: pointer;
	color: #ffffff;
	font-family: Arial;
	font-size: 17px;
	padding: 6px 32px;
	text-decoration: none;
	text-shadow: 0px 1px 0px #2f6627;
}
a.sButton2:hover {
	background-color: #cc0000;
	color: #ffff33;
}
a.sButton2:active {
	position: relative;
	top: 1px;
}

/*
--------------- sButton3 ------------------
*/
a.sButton3 {
	background-color: #0066CC;
	display: inline-block;
	cursor: pointer;
	color: #ffffff;
	font-family: Comic Sans MS;
	font-size: 18px;
	padding: 6px 32px;
	font-weight: bold;
	text-decoration: none;
	text-shadow: 0px 1px 0px #2f6627;
}
a.sButton3:hover {
	background-color: #0099FF;
	color: #ffff99;
}
a.sButton3:active {
	position: relative;
	top: 1px;
}

/*
--------------- Image Overlay ------------------
*/

.image_container {
	position: relative;
	width: 100%;
	height: 100%;
}

.image_one {
	width: 98%;
	height: 98%;
}

.image_overlay {
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	top: 0;
	overflow: hidden;
	width: 100%;
	height: 100%;
	transform: scale(0);
	transition: .3s ease;
}

.image_container:hover .image_overlay {
	transform: scale(1);
}

.image_two {
	position: absolute;
	width: 100%;
	height: 100%;
}