@charset "utf-8";
/* CSS Document */

.portrait1 .top, 
.portrait1 .bottom
{

    display:none;

}

.portrait1 .image-block {

    left:0;
    top:0;

}

.portrait1.centre-align .left {
 
    width:29%;
    height:100%;

}

.portrait1.centre-align .centre {
 
    width:calc(71% - 40px);
    height:100%;

}

.portrait1.centre-align .image-con {

    height:100%;
    width:61%;

}

.portrait1.centre-align .text-con {

    height:100%;
    width:39%;
    
}

.portrait1.centre-align .text-block {
    
    bottom:140px;
    left:20px;
    
}

.portrait1.centre-align .right {
 
    width:40px;
    height:100%;

}

.portrait1.left-align .left {
 
    width:10%;
    height:100%;

}

.portrait1.left-align .centre {
 
    width:calc(90% - 40px);
    height:100%;

}

.portrait1.left-align .image-con {

    width:48%;
    height:100%;

}

.portrait1.left-align .text-con {

    height:100%;
    width:52%;
    
}

.portrait1.left-align .text-block {
    
    bottom:140px;
    right:60px;
    
}

.portrait1.left-align .right {
 
    width:40px;
    height:100%;

}

.portrait1.right-align .left {
 
    width:40px;
    height:100%;

}

.portrait1.right-align .centre {
 
    width:calc(90% - 40px);
    height:100%;

}

.portrait1.right-align .image-con {

    width:48%;
    height:100%;

}

.portrait1.right-align .text-con {

    height:100%;
    width:52%;
    
}

.portrait1.right-align .text-block {
    
    bottom:140px;
    left:195px;
    
}

.portrait1.right-align .right {

    width:10%;
    height:100%;

}

@media only screen and (max-width: 1919px) {
 
    .portrait1.centre-align .left {

        width:20%;

    }
    
    .portrait1.centre-align .centre {

        width:calc(80% - 40px);
        height:100%;

    }
    
    .portrait1.centre-align .image-con {

        width:77.5%;

    }

    .portrait1.centre-align .text-con {

        width:22.5%;

    }
    
    .portrait1.left-align .text-block {

        right:75px;

    }
    
    .portrait1.right-align .text-block {

        left:155px;

    }
    

}



@media only screen and (max-width: 1439px), screen and (max-height: 767px) {
 
    .portrait1 .top, .portrait1 .bottom, .portrait1.centre-align .centre {

        height:90px;
        display: block;
        width:100%;

    }
    
    .portrait1 .left, .portrait1 .right {

        display:none!important;

    } 
    
    .portrait1 .centre {

        width:100%!important;
        height:calc(100% - 180px)!important;;

    }
    
    .portrait1 .image-con {

        width:100%!important;

    }
    
    .portrait1 .top.full-screen-mobile, 
    .portrait1 .bottom.full-screen-mobile,
    .portrait1 .left.full-screen-mobile, 
    .portrait1 .right.full-screen-mobile
    {

        display:none!important;

    }
    
    .portrait1 .centre.full-screen-mobile {
        
        width:100%!important;
        height:100%!important;

    }

    .portrait1.inset-on-mobile .left, .portrait1.inset-on-mobile .right {

        height:calc(100% - 180px)!important;
        display: block!important;
        width:20px!important;

    }
    
    .portrait1.inset-on-mobile .centre {
        
        width:calc(100% - 40px)!important;
        height:calc(100% - 180px)!important;

    }

 
}


@media only screen and (max-width: 767px), screen and (max-height: 767px) {
    
    .portrait1 .top, .portrait1 .bottom {

        height:70px;

    }
    
    .portrait1 .left, .portrait1 .right {

        display:none;

    } 
    
    .portrait1 .centre {

        height:calc(100% - 140px)!important;

    }    
    
    .portrait1.inset-on-mobile .left, .portrait1.inset-on-mobile .right {

        height:calc(100% - 140px)!important;

    }
    
    .portrait1.inset-on-mobile .centre {

        height:calc(100% - 140px)!important;

    }    
    
}


