/* ----------------------------------------------------- */
/* ----------------     small scherm     ------------    */
/* ----------------------------------------------------- */

    
 .infosessie { 
   display:grid;
	 width: 92%; height:auto;
	 margin: 5vw 4% 1vw 4%;
	 grid-template-columns: auto  1fr;
	 grid-template-rows: auto auto auto repeat(30 , auto ) ;;
	 justify-content:center; align-content: start; 
   justify-items:start; align-items: center; 
   grid-row-gap: 0px; grid-column-gap:2vw; }
    
   
 .infosessie label {   
   grid-column: 1 / span 2;
   display:flex; margin: 0 auto;
   text-align: center; 
	 width:100%; height: auto;
	 justify-content: center;  
	 align-items: center;
	 font-weight:bold; color: var(--colorRed); }
 
  .infosessie label:nth-child(1) { font-size:1.3em; font-weight:bold; color: var(--colorRed); }
  .infosessie label:nth-child(2) {font-size:1.15em; font-weight:normal; color: var(--colorRed); }
  
  .infosessieImg {  
    grid-row: 3  ; grid-column: 1 / span 2 ; 
	  align-self: start; 
	  display:flex;  
	  margin: 0 0 2vw 0;
	  justify-content: center; 
	  align-content:flex-start;
	  justify-items: center; }	
   
   .infosessieImg img {
     border:1vw transparent solid;
	   outline:1px var(--pgColor) solid; outline-offset:-2px;
	   width: calc(100% - 8vw); height: auto; }
	 
   .msgAfgesloten { 
     grid-column: 1 / 3 ; 
	   position:relative;
	   width:100%; height:0px;
	   overflow-x:visible; overflow-y:visible;} 
      
   .msgAfgesloten div {  
     display:none; position: absolute;
     left: 40%; top: 50%; padding:0.4vw 3vw;
     border:1px #ff0000 solid;  
     background-color:#ff8c00; color:#ffffff;
     border-radius: 1vw; 
     font-size:1.25em;
     transform: translate(-50%, -50%) rotate(-15deg) ; } 
   
   .colFixed { grid-column: 1 / span 2;  }
  
   .emptyspace {
     display:block; 
     width:100%; height:5vw; 
     background-color: transparent;  }
   
  .samenwerking { 
    display: grid;
	  width: 92%; height:auto;
	  margin: 4vw 4% 4vw 4%;
    background-color:transparent;
    grid-template-columns: 1fr 1fr 1.75fr;
	  grid-template-rows: auto auto;
	  justify-content: center; align-content:start;
	  justify-items: center; align-items: center;
	  grid-row-gap: 0.5vw; grid-column-gap: 5vw;} 
	
  .samenwerking div { 
    text-align:center;
	  grid-column: 1 / span 3 ;
	  justify-self: center; }

  .samenwerking img { width:100%; height:auto; } 
  
  .txtBlock {
    width: 92%; height:auto;
	  margin: 1vw 4% 1vw 4%;
    background-color:transparent; 
    text-align:left;
	  }
  
	 

  /* -------------------------------------------------------- */
  /*  --------------     medium scherm     --------------    */
  /* -------------------------------------------------------- */
  @media only screen and (min-width: 768px) and ( orientation: landscape)   {  
  
  .infosessie { grid-template-columns: 35%  auto 1fr;}
 
  .infosessie label { grid-column: 1 / span 3; }
	
  .infosessie label:nth-child(1) {  }
  .infosessie label:nth-child(2) {  }
 
  .infosessieImg {  
    grid-column: 1 ; grid-row: 3 / -1;  
  	margin: 0 0 0 0; }	
   
  .infosessieImg img {
    border:0.8vw transparent solid;
	  width: calc(100% - 1.6vw); height: auto; }
	 
  .infosessie div { white-space:nowrap; overflow:visible; }
  
  .msgAfgesloten { 
    grid-column: 2 / 4 ; 
	  width:100%; height:0px;} 
      
  .msgAfgesloten div {  
    left: 50%; top: 50%; padding:0 2vw;
    border-radius: 0.8vw;} 
  
  .colFixed { grid-column: 2 / 4; }

  .emptyspace {  }
   
  .samenwerking {  }
	
  .samenwerking div {   }
  
  .txtBlock {  }
  
  }
	
  /* -------------------------------------------------------- */
  /*  --------------     large scherm     ----------------    */
  /* -------------------------------------------------------- */
  @media only screen and (min-width: 1280px) {  
  
  .infosessie { grid-template-columns: 40%  auto 1fr;  font-size:1.5vw; }
     
  .infosessie label { grid-column: 1 / span 3;}
	
  .infosessie label:nth-child(1) {  }
  .infosessie label:nth-child(2) {  }
   
  .infosessieImg {  
    grid-column: 1 ; grid-row: 3 / -1;  
	  margin: 0 0 0 0; }	
      	
   .infosessieImg img {
     border:0.5vw transparent solid;
	   width: calc(100% - 1vw); height: auto; }
	 
   .msgAfgesloten { grid-column: 2 / 4 ; } 
      
   .msgAfgesloten div {border-radius: 0.8vw; } 
  
   .colFixed { grid-column: 2 / 4;  } 
  
   .emptyspace { height:4vw; }
       
  .samenwerking {  }
		
  .samenwerking div {   }

  .samenwerking img {  } 
  	 
  .txtBlock {	 } 
     
  }