body { width:100%;height:820px; }

/* .bt { border-radius:25px;color:darkblue;background-color:#f4a460;} */ 

/*ADDITION2*/

.app-announcement-banner {
    background-color: #1a73e8; /* Eye-catching tech blue */
    color: #ffffff;
    text-align: center;
    padding: 10px 20px;
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: bold;
    border-bottom: 2px solid #0d52b9;
}

.app-announcement-banner a {
    color: #ffd166; /* Vibrant yellow link for high contrast */
    text-decoration: underline;
    margin-left: 10px;
}

.app-announcement-banner a:hover {
    color: #ffffff;
}

/*ENDADDITION2*/


.banner {
  
  position: relative;
  width:95%;
  height:120px;
  
}

.background {
  position: relative;
  z-index: 1;
  border-radius:15px 15px 15px 15px;
  opacity:0.85;
  width:95%; 
  height:120px; 

 
}

.screensleft{
    width:100%;
    height:100%;
    /*height:auto;*/
}

.screensleft:hover {
    transform-origin:top left;
 
 transform: scale(2.5);
}

.screenscenter{
    width:100%;
    height:100%;
    /*height:auto;*/
}

.screenscenter:hover {
    transform-origin:top center;
 
 transform: scale(2.5);
}

.screensright{
    width:100%;
    height:100%;
    /*height:auto;*/
}

.screensright:hover {
    transform-origin:top right;
 
 transform: scale(2.5);
}




.column {
    border-style:solid;
    border-width:2px;
    width:30%;
    height:90%; 
    float:left;
    margin:1% 1.3%;
    
}

.row {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width:99%;
    height:250px;
    border-style:solid;
    border-width:1px;
}

.menubutton {
    border-radius:15px;
    color:black;
    width:10%;
    height:30px;
    margin:20px;
    cursor:crosshair;

}

.news {
    cursor:pointer;
    position:relative;
    z-index:2;
    float:right;
    height:120px;
    width:84px;
    border-radius:15px;
    margin-right:3%;
    
}

.news:hover {
  transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}




.bgim {
    position:relative;
    width:95%;
    height:50%;
    border-radius:15px;
    left:2.5%;   
    z-index:1;
}
.kadereromheen {
    width:100%;
    height:100%;
    
    
}
.maintext{
    position:absolute;
    top:300px;
    left:13%;
}



.textbase {
    position:relative;
    height:340%; /* was 85 pct before */
    width:70%;
    margin:auto;
    border-radius:15px;
    z-index:1;
    background-color:white;
    
    
    /*background-color:#ffffe6;*/
    opacity:0.95;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 23px; 
    /*
    font-family: Lucida Console, Lucida Sans Typewriter, monaco, Bitstream Vera Sans Mono, monospace; font-size: 16px; font-style: normal; font-variant: normal; 
    font-weight: 600; line-height: 20px;color:black;*/

}

.freightbase {
    position:relative;
    height:500%; /* was 85 pct before */
    width:85%;
    border-radius:15px;
    left:2.5%;   
    z-index:1;
    background-color:white;
    opacity:0.95;
    margin-left:3%;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 23px;

}

.glow {
  font-size: 40px;
  color: #fff;
  text-align: center;
  -webkit-animation: glow 1s ease-in-out infinite alternate;
  -moz-animation: glow 1s ease-in-out infinite alternate;
  animation: glow 1s ease-in-out infinite alternate;
}

@-webkit-keyframes glow {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
  }
  
  to {
    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
  }
}




.wiebase {
    position:relative;
    height:125%;
    width:85%;
    border-radius:15px;
    left:2.5%;   
    z-index:1;
    background-color:white;
    opacity:0.95;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 23px;
    margin-left:3%;
}


.watbase {
    position:relative;
    height:260%;
    width:85%;
    margin-left:3%;
    border-radius:15px;
    left:2.5%;   
    z-index:1;
    background-color:white;
    opacity:0.95;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 23px;
}

.howbase {
    position:relative;
    height:300%;
    width:85%;
    margin-left:3%;
    border-radius:15px;
    left:2.5%;   
    z-index:1;
    background-color:white;
    opacity:0.95;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 23px;
}


.contactbase {
    position:relative;
    height:1450px;
    width:85%;
    margin-left:3%;
    border-radius:15px;
    left:2.5%;   
    z-index:1;
    background-color:white;
    opacity:0.95;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 23px;
}




.binnentekst {
    padding:20px 100px 0px 100px; /*top right bottom left*/
}

.longtextbase {
    position:relative;
    height:100%;
    width:85%;
    margin-left:3%;
    border-radius:15px;
    left:2.5%;   
    z-index:1;
    background-color:#ffffe6;
    opacity:0.95;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 23px;
}

H2 {
    color:darkblue;
    
}




.img2 {
    border-radius:15px;
    width:100%;
    height:100%;
    opacity:0.6;
}
.logo {
  
  position: absolute;
  left:1%;
  top:10px;
  width:100%; height:118px;
  
  z-index: 2;
  
}
.logoimg {
    border-radius:15px;
    /*opacity:0.90;*/
    /* opacity:0.8;*/
    width:42%; /*WAS 40*/
    height:135px; /*was 118*/ 
}

.logomainpage {
    border-radius:15px;
    /* opacity:0.8; */
    width:40%; /*WAS 40*/
    height:117px;
}

.rooda{
    font-family: 'digital-clock-font'; font-size: 28px; font-style: normal; font-variant: normal; 
    font-weight: 700; line-height: 38px;color:red;position:absolute;top:-60px;left:4%;z-index:2;background-color:black;width:15%;
}
.roodb {
    font-family: 'digital-clock-font';font-size: 28px; font-style: normal; font-variant: normal; 
    font-weight: 700; line-height: 38px;color:red; z-index:2;position:absolute;top:-60px;right:4%;background-color:black;width:15%; 
    /*left was 64 percent before in roodb*/
}


/*
.rooda{
    font-family: Lucida Console, Lucida Sans Typewriter, monaco, Bitstream Vera Sans Mono, monospace; font-size: 18px; font-style: normal; font-variant: normal; 
    font-weight: 700; line-height: 22px;color:red;position:relative;top:-60px;left:8%;z-index:2;background-color:black;width:15%;
}
.roodb {
    font-family: Lucida Console, Lucida Sans Typewriter, monaco, Bitstream Vera Sans Mono, monospace; font-size: 18px; font-style: normal; font-variant: normal; 
    font-weight: 700; line-height: 22px;color:red; z-index:2;position:relative;top:-60px;left:67%;background-color:black;width:15%;
}
*/

.buttonline {
    margin-left:0%;
}

.pagina {

    background-image: url("pcinterior.jpg");
    /*background-repeat:no-repeat;*/
    background-size:50%;
    
    
}
.notbold {
    font-weight:normal;
    font-size:16px;
}
/* Style the video: 100% width and height to cover the entire window */
#cpu {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 80%;
  
}

@font-face {
 font-family:'digital-clock-font';
 src: url('digital-7.ttf');
}


/*Contact form */
/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
  width: 100%; /* Full width */
  padding: 12px; /* Some padding */  
  border: 1px solid #ccc; /* Gray border */
  border-radius: 4px; /* Rounded borders */
  box-sizing: border-box; /* Make sure that padding and width stays in place */
  margin-top: 6px; /* Add a top margin */
  margin-bottom: 16px; /* Bottom margin */
  /*  resize: vertical Allow the user to vertically resize the textarea (not horizontally) */
}

/* Style the submit button with a specific background color etc */
input[type=submit] {
  background-color: #4CAF50;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

/* When moving the mouse over the submit button, add a darker green color */
input[type=submit]:hover {
  background-color: #45a049;
}

/* Add a background color and some padding around the form */
.contactform {
  border-radius: 5px;
  background-color: lightblue;
  padding: 20px;
  width:50%;
}