$(function() {
var $window = $(window);
var hasPrepended = false;
var portDivs = ['<div class="port6"></div>','<div class="port5"></div>','<div class="port4"></div>',
     '<div class="port3"></div>','<div class="port2"></div>','<div class="port1"></div>'];
function portraits() {
    if (($window.width() >= 440) && ($window.width() <= 640)){//start if
      if ( hasPrepended === true ) {
           return;
           }
           
       hasPrepended = true;
       var portrait_C = $('<div class="portrait-C"></div>');
       $( ".page-id-28 .inhalt, .page-id-45 .inhalt" ).prepend(portrait_C).hide().fadeIn('slow');
    for (var portIdx = 0; portIdx <= portDivs.length; portIdx++)// start for
    {
        var div = portDivs[portIdx];
        $( ".portrait-C" ).prepend(div);
    }//end for
    }//end if
    else{
        hasPrepended = false;
        $('.portrait-C').fadeOut('fast', function(){
            $('.portrait-C').remove()});
            //$('.portrait-C').remove();
        }
    }//end function portraits

$window.load(function() { portraits(); });
$window.resize(function() { portraits(); });
});

.portrait-C {
    max-width: 100%;
    height: 125px;
    -webkit-transition: height 0.3s ease-in;
    -o-transition: height 0.3s ease-in;
    transition: height 0.3s ease-in;
    background-color: #FFFFFF;
}
.port1, .port2, .port3, .port4, .port5, .port6 {
    width: 16.6666667%;
    height: 100%;
    float: left;
    display: inline-block;
    background-size: 106px 125px;
}
.port1 {
    background-image: url(../../uploads/2014/07/port1-ret.jpg);
}
.port2 {
    background-image: url(../../uploads/2014/07/port2-ret.jpg);
}
.port3 {
    background-image: url(../../uploads/2014/07/port3-ret.jpg);
}
.port4 {
    background-image: url(../../uploads/2014/07/port4-ret.jpg);
}
.port5 {
    background-image: url(../../uploads/2014/07/port5-ret.jpg);
}
.port6 {
    background-image: url(../../uploads/2014/07/port6-ret.jpg);
}