.team-screen{
width:90%;
height:200px;
border: 2px solid #00d;
border-radius: 20px;
}

@media (max-width:600px)
{
.team-phone{
display: block;
width:50%;
height:auto;
margin: auto;
}
.text_phone{
font-size:0.5vw;
}  
.w3-qquarter{
width:100%;
opacity:0.25;
}
}


.w3-hover-opoff:hover{
opacity:1; 
color:#fff;
font-weight:bold;
background:#0000ff;
font-size:16px;
}

@media screen and (min-width:601px){  
.w3-qquarter{
width:24.89999%;
opacity:0.25;
}
.w3-rrow-padding{
display:flex;
}  
}

@media (max-width:601px){
.w3-bar-item{
  padding:0px 0px;
  float:left;
  width:auto;
  border:none;
  display:block;
  font-size:12px;
  color:#fff;
  font-weight:bold;
}
.w3-button{
width:100%;
text-align:left;
padding:0px 0px;
//height:24px;
}  

.w3-col.l3{width:100%}
html,body{font-size:12px;font-weight:bold;line-height:1.}
html{overflow-x:hidden}
}
.els-header {
        position:relative;
        //top:0;
        //width: 100%;
        //height: 15%;
        margin: 0 auto;
        padding: 0px 2px 0px 2px;
        background:#18079c;// #00ffff;//#87CEEB;//#ffc107;// #0055ee;
        font-weight: bold;
        color:#fff;//#aa4400;
        font-size:2vw;
       //      text-align:center;
       // content: center;
        justify-content: center;
        display: flex;
        z-index: 2;
}
.openml {
  //cursor: pointer;
  position: absolute;
  top: 0%;
  left: 0%;
  //padding: 12px 16px;
  //transform: translate(0%, -50%);
}
.openmr {
  //cursor: pointer;
  position: absolute;
  bottom: 0%;
  right: 0%;
  //padding: 12px 16px;
  //transform: translate(0%, -50%);
}

  @keyframes float {
            0%, 100% { transform: translateY(0) rotate(0deg); }
            50% { transform: translateY(-30px) rotate(180deg); }
        }     

 @keyframes pulse {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.1); }
        }
.features {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 25px;
            margin-top: 30px;
        }

 .feature-card {
            background: white;//linear-gradient(180deg, #fff 0%, #18079c 100%);
            padding: 30px;
            border-radius: 15px;
            text-align: left;
            color: blue;
            transition: transform 0.3s, box-shadow 0.3s;
            cursor: pointer;
	    box-shadow: 0px 20px 20px 0px #18079c;

        }

        .feature-card:hover {
           // transform: translateY(-10px);
            box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4);
        }

        .feature-icon {
            font-size: 3em;
            margin-bottom: 15px;
            display: block;
        }
 .feature-card h3 {
            font-size: 1.3em;
            margin-bottom: 10px;
	    font-weight:bold;
        }

        .feature-card p {
            font-size: 0.95em;
            opacity: 1;
        }

        .welcome-text {
            text-align: center;
            margin-bottom: 30px;
        }

        .welcome-text h3 {
            color: #667eea;
            font-size: 2em;
            margin-bottom: 15px;
        }
 @keyframes bounce {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-15px); }
        }
	

@media (max-width:601px){

.feature{
display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 20px;
}
  
.feature-card {
width:100%;
}  

}


/*grid patern*/
.grid12 {
  display: grid;
  grid-template-areas:
    "header header"
    "menu content";
  grid-template-columns: 33% 66%;
  gap: 20px;
  //background-color: dodgerblue;
  padding:20px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}
.grid12 div {
  background-color: white;
  padding: 10px;
  //box-shadow: 0px 20px 20px 0px #18079c;
}
.grid12 div.header {
  grid-area: header;
  box-shadow: 0px 20px 20px 0px #18079c;
  text-align: center;
}
.grid12 div.menu {
  grid-area: menu;
  box-shadow: 0px 20px 20px 0px #18079c;
}
.grid12 div.content {
  grid-area: content;
  box-shadow: 0px 20px 20px 0px #18079c;
}

/*grid patern*/
.grid-r12 {
  display: grid;
  grid-template-areas:
    "header header"
    "left right";
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  background-color: dodgerblue;
  padding:20px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-r12 div {
  background-color: white;
  padding: 10px;
  //box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-r12 div.header {
  grid-area: header;
  //box-shadow: 0px 20px 20px 0px #18079c;
  text-align: center;
  border-radius: 15px;
}
.grid-r12 div.left {
  grid-area: left;
  border-radius: 15px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-r12 div.right {
  grid-area: right;
  border-radius: 15px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-r13 {
  display: grid;
  grid-template-areas:
    "header header header"
    "left midlle right";
  grid-template-columns: 1fr 1fr 1fr;
  gap: 5px;
  background-color: dodgerblue;
  padding:20px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-r13 div {
  background-color: white;
  padding: 10px;
  //box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-r13 div.header {
  grid-area: header;
  //box-shadow: 0px 20px 20px 0px #18079c;
  text-align: center;
  border-radius: 15px;
}
.grid-r13 div.left {
  grid-area: left;
  border-radius: 15px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-r13 div.midlle {
  grid-area: midlle;
  border-radius: 15px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}

.grid-r13 div.right {
  grid-area: right;
  border-radius: 15px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}



@media (max-width:760px){
  .grid-r12 {
   grid-template-areas:
    "header"
    "left"
    "right";
  grid-template-columns:100%
  }
.grid-r13 {
   grid-template-areas:
    "header"
    "left"
    "midlle"
    "right";
  grid-template-columns:100%
  }
}

.grid-rr13 {
  display: grid;
  grid-template-areas:
    "header header header"
    "left midlle right";
  grid-template-columns: 30% 40% 30%;
  gap: 5px;
  background-color: dodgerblue;
  padding:20px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-rr13 div {
  background-color: white;
  padding: 10px;
  //box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-rr13 div.header {
  grid-area: header;
  //box-shadow: 0px 20px 20px 0px #18079c;
  text-align: center;
  border-radius: 15px;
}
.grid-rr13 div.left {
  grid-area: left;
  border-radius: 15px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}
.grid-rr13 div.midlle {
  grid-area: midlle;
  border-radius: 15px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}

.grid-rr13 div.right {
  grid-area: right;
  border-radius: 15px;
 // box-shadow: 0px 20px 20px 0px #18079c;
}



@media (max-width:760px)
{
/*
{
  .grid-r12 {
   grid-template-areas:
    "header"
    "left"
    "right";
  grid-template-columns:100%
  }
*/
.grid-rr13 {
   grid-template-areas:
    "header"
    "left"
    "midlle"
    "right";
  grid-template-columns:100%
  }
}


span.mail-rb:before {
content: "e-mail:romai.board@gmail.com";
content: "e-mail:romai.board@gmail.com";
font: 100%;
color:blue;
}

span.mail-si:before {
content: "e-mail:ro_diff@yahoo.com";
content: "e-mail:ro_diff@yahoo.com";
font: 100%;
color:blue;
}

span.mail-avi:before {
content: "e-mail: anca.veronica.ion@gmail.com";
content: "e-mail: anca.veronica.ion@gmail.com";
font: 100%;
color:blue;
}

span.mail-rj:before {
content: "e-mail: rj.romai@gmail.com";
content: "e-mail: rj.romai@gmail.com";
font: 100%;
color:blue;
}