#outerholder {   
   max-width: 600px;
}

#imgholder img {
    position: absolute;
    width: auto;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.arrright, .arrleft {
    visibility: hidden;
}


.transR {
    transform: translateX(-100%);
    transition: transform 0.5s ease;
}

.transL {
    transition: transform 0.5s ease;
    transform: translateX(100%);
}

.transN {
    transform: translateX(0%);
    transition: transform 0s;
}

.midnotrans {
    transform: translateX(0);
    transition: transform 0s;
}

.midtrans {
    transform: translateX(0);
    transition: transform 0.5s ease;
}

.leftnotrans {
    transform: translateX(-100%);
    transition: transform 0s;
}

.lefttrans {
    transform: translateX(-100%);
    transition: transform 0.5s ease;
}

.rightnotrans {
     transform: translateX(100%);
     transition: transform 0s;
}

.righttrans {
     transform: translateX(100%);
    transition: transform 0.5s ease;
}

div, #imgholder {
    overflow: hidden;
}