html {
box-sizing: border-box;
}

*,
*:before,
*:after {
box-sizing: inherit;
}

.cf:before,
.cf:after {
content: " ";
display: table;
}

.cf:after {
clear: both;
}

.cf {
*zoom: 1;
margin:0 0 0 0;
}

img {
max-width: 100%;
height: auto;
}

figure {
margin: 0;
padding: 6px;
}

figure a {
display: block;
}

.kepek {
width: 100%;
}

.kepek img {
border:4px solid #5caf8e;
border-radius:0px;
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-ms-transition: all .3s ease;
transition: all .3s ease;
}

.kepek img:hover {
border:4px solid #275580;
}

.picture {
padding: 36px 0;
}

.picture:first-child {
padding-top: 0;
}

.pace {
pointer-events: none;
user-select: none;
}

.pace-inactive {
display: none;
}

.pace .pace-progress {
background: #f87f3f;
position: fixed;
z-index: 2000;
top: 0;
right: 100%;
width: 100%;
height: 2px;
}

.pace-running .demo-content {
opacity: 0.5;
}

.pace-running figure {
pointer-events: none;
}

header {
text-align: none;
}

header h1,
header a {
font-size: 12px;
}

header h1 {
float: left;
}

header a {
float: right;
}

.kepek {
padding: 0px;
}

.picture {
padding: 0;
border-bottom: 0;
}

.two figure {
float: left;
width: 50%;
}

.three figure {
float: left;
width: 33.33333333%;
}

.four figure {
float: left;
width: 25%;
}

.five figure {
float: left;
width: 20%;
}

.six figure {
float: left;
width: 16.66666666%;
}

@media(max-width:767px) {
.six figure {
float: left;
width: 25%;
}
}



@media(max-width:767px) {

.cf {
*zoom: 1;
margin:0 0 0 0;
}

figure {
margin: 0;
padding: 4px;
}

.kepek img {
border:2px solid #5caf8e;
border-radius:0px;
}

.kepek img:hover {
border:2px solid #275580;
border-radius:0px;
}

}