@charset "utf-8";
    body {
        margin:0;
        padding:0;
        color : #000;
        background-color : #fff;
        text-align: left;
        background-color: #E6E6E6;
        font-family: Arial, Helvetica, sans-serif;
    }

    .browserInfoButton{
        color: rgb(128, 128, 128); 
    }	
    
    #page {
        display: block;
        margin: auto;
        margin-top: 5%;
        position: relative;
        background: rgb(255,255,255);
    }
			  
    #page1 {
        text-align: center;
    }
			  
    #main {
        padding-top: 2%;
        width: 100%;
        text-align: center;
    }
       
    h2#tabheader{
        font-size: 1.0em; 
        padding-left: 2%;
        padding-right: 2%;
        position: relative;
    }

    #bkulogin {	
        min-width: 200px;
        min-height: 155px;
        margin-bottom: 5%;
    }
    
    #mandateLogin {
        display:flex;
        flex-direction: row;
        padding-bottom: 1%;
        padding-top: 2%;
        margin-left: 1%;
        position: relative;
        font-size: 0.75em;
    }

   .unvisible {
       display:none;
      }

    .OA_header {
        font-size: 2.1em;
        padding-top:1%;
        margin-bottom: 1%;
        margin-top: 1%;
    }

    #ssoSessionTransferBlock {
        font-size: 0.8em;
        margin-left: 1%;
        margin-bottom: 1%;
      }

    #processInfoArea {
        margin-bottom: 4%;
        margin-top: 4%;
    }

    #processSelectionArea {
        float:left;
        width: 100%;
    }

    .processSelectionButtonArea {
        width:100%;
    }

    .processSelectionButton {
        background: #ababab;
        cursor: pointer;
        height: 40%;
        width: 25%;
        float: right;
        padding-top: 1%;
        padding-bottom: 1%
    }

    #bkuselectionarea {
        display:flex; 
        flex-direction: row;
        margin-top: 2%;
        text-align:center;
    }

    .buttonDescription {
        width: 62%;
        margin-left: 1%;
        text-align: left;
    }
    
    #processContent {
        margin-top: 10%;
      }

    #eIDASSelection {
        width: 120px; 
        margin-right: 5px;        
      }

    .bkuimage {
        width: 50%;
    }

    input {
        cursor: pointer;  
    }

    #bkuselectionarea input[type=button],#bkuselectionarea input[type=submit]{
        font-size: 0.85em;
        width:65%;
        border:none;
        background-color: transparent;
    }

    #localBKU input {
        display: inline-block;

    }
			
    #localBKU input:hover, #localBKU input:focus, #localBKU input:active {
        /*text-decoration: underline;*/
    }

    #installJava, #BrowserNOK {
        clear:both;
        font-size:0.8em;
        padding:4px;
    }

			
    #ssoSessionTransferBlock {
        clear: both;
    }

    #stork {
        clear: both;
    }    			
      
    .mandate{
        font-size: 1.3em;
    }
      
         
    #localBKU {
        padding-bottom: 4%;
        position: relative;
        clear: both;     
        text-align: center;
    }
    
    #selectArea {
        float:left;
        width:90%;
        padding-left: 4%
    }

    .setAssertionButton {
        background: #efefef;
        cursor: pointer;
        margin-top: 15px;
        width: 70px;
        height: 25px;
    }

    #leftcontent {
        width: 70%;
        margin-bottom: 4%;
        text-align: left;
        border: 1px solid rgb(0,0,0);
        margin:auto;
    }

    .hell {
        background-color : $MAIN_BACKGOUNDCOLOR;
        color: $MAIN_COLOR;	
    }
			
    .dunkel {
        background-color: $HEADER_BACKGROUNDCOLOR;
        color: $HEADER_COLOR;
    }

@media screen and (min-width: 650px) {
			        
    #page {
        width: 660px;
        height: 460px;
    }
        
    #localBKU p {
        font-size: 0.7em;
    } 
        
    #localBKU input{
        font-size: 0.85em;
    }  

    #selectArea {
         font-size: 15px;
         padding-bottom: 65px;
    }
			      	
    #stork h2 {
        font-size: 1.0em;
        margin-bottom: 2%;
    }
        		  
    .setAssertionButton_full {
        background: #efefef;
        cursor: pointer;
        margin-top: 15px;
        width: 100px;
        height: 30px
    }
                    
    #validation {
        position: absolute;
        bottom: 0px;
        margin-left: 270px;
        padding-bottom: 10px;
    }			
}


@media screen and (max-width: 649px) {
				
    body {
        background-color:#fff;
    }
                	  
    #page {
        visibility: hidden;
        margin-top: 0%;
    }
			  
    #page1 {
        visibility: hidden;
    }
			  
    #main {
        visibility: hidden;
    }
        
    #validation {
        visibility: hidden;
        display: none;
    }
			  
    .OA_header {
        margin-bottom: 0%;
        margin-top: 0%;
        font-size: 0pt;
        visibility: hidden;
    }
			  
    #alert_area {
        visibility: visible;
        width: 250px;
    }
    
    #alert_area > p:first-child {
        display: none;
        visibility: hidden;
    }
      
    h2#tabheader{
        font-size: 1.5em;
        position: relative;
    }
    
    .mandate{
        font-size: 1.2em;
    }
        
    #leftcontent {
        width:auto;
        border:none;
        visibility:visible;
        margin-bottom: 2%;
    }
    
    .bkuimage {
        width: 40%;
    }
    		        
    .setAssertionButton_full {
        background: #efefef;
        cursor: pointer;
        margin-top: 15px;
        width: 70px;
        height: 25px;
    }
       
    input[type=button],input[type=submit] {
        width:65%;
    }
      
    #processInfoArea {
        margin-bottom: 4%;
        margin-top: 4%;
    }

    #processSelectionArea {
        flaot:left;
        width: 100%;
    }

    .processSelectionButton {
        flaot:left;
        height: 10%;
        width: 2%;
    }

    .buttonDescription {
        float: left;
        width: 70%;
        text-align: left;
    }
    
    #processContent {
        margin-top: 10%;
      }
    
}