<div class="grow pic"><img alt="girl" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="shrink pic"><img alt="city" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="sidepan pic"><img alt="kick" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="tilt pic"><img alt="" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="morph pic"><img alt="" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="blur pic"><img alt="plane" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="bw pic"><img alt="sea" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="brighten pic"><img alt="sea" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="sepia pic"><img alt="people" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="contrast pic"><img alt="dog" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="invert pic"><img alt="ipad" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

<div class="opacity pic"><img alt="soccer" src="http://bildites.lv/images/w9uzjzns/86990/original.jpg" /></div>

/*Visu bilzu stils*/
.pic {
height: 188px;
width: 188px;
overflow: hidden; /*Slepj visu kas netiek bloka*/
margin: 9px;
border: 10px solid #fff; /*Visam operetajsistemam*/
border: 10px solid #eee\9; /* IE6, IE7, IE8*/
-webkit-box-shadow: 2px 3px 10px #6E6E6E;
box-shadow: 2px 3px 10px #6E6E6E;
float: left;}
.pic:hover { cursor: pointer;}
/*Visi bilzu izmeri pec noklusejuma*/
.pic img {
width: 220px;
height: 188px;}

/*Palielinasana*/

.grow img {
height: 188px;
width: 188px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;}
.grow img:hover {
width: 300px;
height: 300px;
margin-left: -50px;
margin-top: -50px;}

/*Samazinasana*/

.shrink img {
height: 200px;
width: 200px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;}
.shrink img:hover {
width: 300px;
height: 300px;}

/*Virziba pa kreisi*/

.sidepan img {
width: 250px;
height: 200px;
margin-left: 0px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;}
.sidepan img:hover {
margin-left: -50px;}

/*Nedaudz sasverta uz sanu*/

.tilt {
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;}
.tilt:hover {
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
-o-transform: rotate(-10deg);
-ms-transform: rotate(-10deg);
transform: rotate(-10deg);}

/*No kvadrata uz rinki*/

.morph {
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}
.morph:hover {
border: 10px solid #333;
border-radius: 50%;
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);}

/*Miglaina*/

.blur img {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;}
.blur img:hover {
-webkit-filter: blur(2px);}

/*Melnbalta*/

.bw {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;}
.bw:hover {
-webkit-filter: grayscale(100%);}

/*Spilgta*/

.brighten img {
-webkit-filter: brightness(100%);
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;}
.brighten img:hover {
-webkit-filter: brightness(60%);}

/*Sepija*/

.sepia img {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;}
.sepia img:hover {
-webkit-filter: sepia(100%);}

/*Kontrasts*/

.contrast img {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;}
.contrast img:hover {
-webkit-filter: contrast(185%);}

/*Inversija*/

.invert img {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;}
.invert img:hover {
-webkit-filter: invert(100%); }

/*Daudz efektu*/

.opacity img {
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.opacity img:hover {
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
-o-transform: rotate(-10deg);
-ms-transform: rotate(-10deg);
transform: rotate(-10deg);
width: 300px;
height: 300px;
margin-left: -60px;
margin-top: -10px}