﻿
.rectangle { border-radius: 20px; border: 1px solid #D3D3D4; padding: 20px; width: 100%; height: 100%; }
.rectangle.left { background-color:#F27405; overflow:hidden; border-radius: 20px 0px 0px 20px; border-right-width:0px; width: 40%; float:left; position:relative; background-size:cover }
.rectangle.right { border-radius: 0px 20px 20px 0px; border-left-width:0px;width: 60%; float:left }
.rectangle.portale { background-color:#EFF3F5; border-color:#EFF3F5;padding:50px; }

.start_logo { width:377px;height:214px;position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
.start_logobild { margin: 30px; }




@media screen and (max-width: 1199px) {
    .start_logo { width:189px;height:107px;position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
    
    .rectangle.portale { padding:20px }
    .start_logobild { margin: 17px; }
    .rectangle.left { width: 50% }
    .rectangle.right { width: 50% }
}


@media screen and (max-width: 1020px) {
    .rectangle.left { display:none }
    .rectangle.right { border-radius: 0px 0px 0px 0px; border-width:0px;width:100%; float:none }

}


@media screen and (max-width: 420px) {
    .rectangle.right { padding:20px 10px 10px 10px }
    .rectangle.portale { border-radius:0px;padding:0px 0px 10px 0px }
}