.w3-content{max-width:980px;margin:auto}
.w3-section{
	margin-top:50px!important;
margin-bottom:50px!important;
	margin-right:10vw;
	width:40%;
	height:60%;}

.w3-section2{
	margin-top:50px!important;
margin-bottom:50px!important;
	margin-right:10vw;
	width:40%;
	height:60%;}

.w3-section3{
	margin-top:50px!important;
margin-bottom:50px!important;
	margin-right:10vw;
	width:40%;
	height:90%;}

.w3-section4{
	margin-top:50px!important;
margin-bottom:50px!important;
	margin-right:10vw;
	width:40%;
	height:60%;}



div#topdiv {
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
        height:1%;
	color:#CCC;
	background:green;
	padding:0px;
z-index: 4;
}

div#dosdiv {
/*	position:absolute;*/
float: top;
	top:0px;
	left:0px;
margin-top: -3%;
	width:100%;
	height:9%;
	color:#CCC;
	background:orange;
	padding:0px;
z-index: 2;
}

div#botdiv {
	position:fixed;
	bottom:0px;
	left:0px;
	width:100%;
        height:5%;
	color:#CCC;
	background:black;
	padding:0px;
z-index: 2;
}



p.header {
    line-height: 0vw;
    display: block;
    font-size: 5vw;
    font-style: italic;
    color: white;
background-color:gray;
    font-weight: bold;

    text-align: right;
    position:  fixed;
    top: 6vw;
    right: 0;

z-index: 2;
}

p.texto {
    font-size: 18px;
    color: white;
    margin-top: 12px;
    margin-bottom: 50px;
    margin-left: 0vw;
    margin-right: 2vw;
    text-align: justify;
z-index: 1;
}

p.header3 {
    color: white;  
/*    margin-top: 11vw;  */
    margin-top: 1vw;
    text-align: left;
    position:  fixed;
    top: 0;
    left: 0;

    right: 0;
    background:transparent;
z-index: 4;
}


a:link, #promenu {
    line-height: 0vw;
    font-size: 1,7vw;
    font-weight: bold;
    text-decoration: underline;
    color: white;    
    background-color: transparent;
    padding: 0px 6px;
  margin-top: 0%;
  position:  static;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

a:visited, #promenu, #promenu2 {
    color: white;
}
a:hover:not(.active), #promenu:hover:not(.active), #promenu2:hover:not(.active), {
    color: yellow;
    background-color: green;
    font-style: italic;
    text-decoration: underline;
    cursor:pointer;
}
a.active, #promenu.active, #promenu2.active {
    color: yellow;
    background-color: transparent;
    text-decoration: underline;
    font-style: italic;
}

#algo {
    color: navy;
    background-color: transparent;
}

#algo:hover {
    color: yellow;
    background-color: transparent;
    font-style: italic;
    text-decoration: underline;
    cursor:pointer;
}

#img3 {
    z-index: 2;
}

#img4 {
    width: 40%;
    height: auto;
    position:  fixed;
    top: 35%;
    left: 87%;
    z-index: -3;
}

/*_________Hiden Hamburger Menu Starts____________*/
.dropbtn {
position: fixed;
top:0vw;
right:1vw;

    background-color: transparent;
    color: white;
    font-size: 26px;
    border: none;
    cursor: pointer;
z-index: 6;
}


.dropbtn:hover, .dropbtn:focus {
    background-color: #3e8e41;
}

.dropdown {
/*    float: right;*/
    display: inline-block;
    text-align: left;
    position:  fixed;
    top: 2%;
    right: 13%;
    margin-top:0vw;
    background:transparent;
z-index: 5;
}

.dropdown-content {
    display: none;
    background-color: #3e8e41;
    min-width: 60px;
    overflow: auto;
    position: fixed;
    top: 4%;
    right: 30%;
    margin-right: 0vw;
/*    margin-top: 0vw;*/
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    right: 0;
z-index: 5;
}

.dropdown-content a, .dropdown-content #promenu2 {
    color: white;
    padding: 12px 3px;
    text-decoration: underline;
    text-align: left;
    font-size: 14px;
    display: block;
z-index: 5;
}

.dropdown a:hover {background-color: green}
.dropdown-content a.active {color: yellow}

.show {display:block;}
/*_________Hiden Hamburger Menu Starts____________*/



/*_________Main Share Menu Starts____________*/
.dropbtn2 {
position: fixed;
top:1vw;
right:1vw;
width: 70px;
height: auto;
    background-color: transparent;
    color: white;
    font-size: 26px;
    border: none;
    cursor: pointer;
z-index: 6;
}

.dropbtn2: hover  {
     background: rgba(76, 175, 80, 0.3)
} 

.dropbtn2:focus {
     background: rgba(76, 175, 80, 0.3)
}

.dropdown2 {
position: fixed;
top:5vw;
right:1vw;
    font-size: 12px;
    text-align: center;
    color:white;
z-index: 5;
    
}

.dropdown2-content {
    display: none;
    position: absolute;
    background-color: #3e8e41;
    min-width: 10px;
    overflow: auto; 
    right: 8vw;
    top: 1vw;
z-index: 5;
}

.dropdown2-content a {
    color: white;
    padding: 6px 6px;
    text-decoration: underline;
    text-align: center;
    font-size: 18px;
    display: block;
z-index: 5;
}

.dropdown2:hover { background: rgba(76, 175, 80, 0.3)}
.dropdown2-content a:hover {background-color: yellow}


.show2 {display:block;}

/*_________Main Share Menu Ends____________*/


/*_________Share Menu Starts____________*/

.dropdown3 {
position: fixed;
bottom:0;
left:1vw;
margin-left:0vw;
margin-bottom:0vw;
    font-size: 12px;
    text-align: center;
    color:white;
z-index: 6;
    
}

.dropdown3-content {
/*    display: none;*/
display: inline;
/*    background-color: #3e8e41;*/
    background-color: transparent;
    position: fixed;
/*    min-width: 10px;*/
    width: 10px
    overflow: auto; 
    left: 1vw;
    bottom:0;
    margin-bottom:0vw;
z-index: 5;
}
.dropdown3-content a {
    color: transparent;
    padding: 6px 6px;
/*    text-decoration: underline;*/
    text-align: center;
    font-size: 18px;
    display: inline;
z-index: 3;
}

.dropdown3:hover {background-color: #3e8e41}
.dropdown3-content a:hover {background-color: yellow}

/*_________Share Menu Ends____________*/

/*_________Prof Menu popup Starts____________*/
.dropbtn4, .dropbtn5 {
position: fixed;
/*top:1vw;*/
  
top:11vw;

right:10vw;
width: 70px;
height: auto;
    background-color: transparent;
    color: white;
    font-size: 26px;
    border: none;
    cursor: pointer;
z-index: 5;
}

.dropbtn4: hover, .dropbtn5: hover  {
     background: rgba(76, 175, 80, 0.3)
} 

.dropbtn4:focus, .dropbtn5:focus {
     background: rgba(76, 175, 80, 0.3)
}

.dropdown4, .dropdown5 {
position: fixed;
top:5vw;
right:1vw;
    font-size: 12px;
    text-align: center;
    color:white;
z-index: 5;
    
}

.dropdown4-content, .dropdown5-content {
    display: none;
    position: fixed;
    background-color: transparent;
/*    min-width: 100%; */
/*    overflow: auto; */
    left: 0vw;
/*    top: 1vw;*/
border: 2px solid yellow;
 top: 4.2vw;
margin-top:0;
z-index: 5;
}

.dropdown4-content a, .dropdown5-content a {
    color: white;
    padding: 1px 3px;
    background-color: #3e8e41
    text-decoration: underline;
    text-align: center;
    font-size: 1.7vw;

    display: inline-block;
line-height: 2.7vw;
z-index: 5;
}

.dropdown4:hover { background: rgba(76, 175, 80, 0.3)}
.dropdown4-content a:hover {background-color: #3e8e41}


.dropdown5:hover { background: rgba(76, 175, 80, 0.3)}
.dropdown5-content a:hover {background-color: #3e8e41}

.show4 {display:block;}
.show5 {display:block;}

/*_________Prof Menu Ends____________*/

/*_________prof & Pers Small Menu Starts____________*/

.dropbtn6 {
    color: white;
    background-color: #3e8e41
    text-decoration: underline;
   padding: 12px 3px;
    margin-top:-10px;
    margin-bottom:-15px;
    text-align: left;
    font-size: 14px;
    display: block;
font-weight: bold;
z-index: 3;
}

.dropbtn7 {
color: white;
    background-color: #3e8e41
    text-decoration: underline;
   padding: 12px 3px;
    margin-top:-10px;
    margin-bottom:-15px;
    text-align: left;
    font-size: 14px;
    display: block;
font-weight: bold;
z-index: 3;
}


.dropbtn6: hover, .dropbtn7: hover  {
     background: rgba(76, 175, 80, 0.3)
} 

.dropbtn6:focus, .dropbtn7:focus {
     background: rgba(76, 175, 80, 0.3)
}

.dropdown6, .dropdown7 {
position: fixed;
top:5vw;
right:1vw;
    font-size: 12px;
    text-align: center;
    color:white;
z-index: 3;
    
}

.dropdown6-content {
    display: none;
font-size: 10vw; /*will define the line separation..OJO*/
    position: fixed;
    background-color: gray;
    min-width: 20%;
    max-width: 100%;
    padding: 0px 10px;
    overflow-y: hidden; 
    left: 0vw;
    top: 0vw;
    margin-top:0;
/*    border: 2px solid navy;  */
z-index: 6;
}


.dropdown7-content {
    display: none;
font-size: 10vw; /*will define the line separation..OJO*/
    position: fixed;
    background-color: gray;
    min-width: 20%;
    max-width: 100%;
    padding: 0px 10px;
    overflow-y: hidden; 
    left: 0vw;
    top: 0vw;
    margin-top:0;
/*    border: 2px solid navy;  */
z-index: 6;
}


.dropdown6-content a  {
    color: navy;
    padding: 0px 0px;
    background-color: #3e8e41
    text-decoration: underline;
/*border: 1px solid yellow;*/
    text-align: left;
    font-size: 18px;
    display: inline;
z-index: 3;
}


.dropdown7-content a {
    color: navy;
    padding: 0px 0px;
    background-color: #3e8e41
    text-decoration: underline;
/*border: 1px solid yellow;*/
    text-align: left;
    font-size: 18px;
    display: inline;
z-index: 3;
}

.dropdown6:hover { background: rgba(76, 175, 80, 0.3)}
.dropdown6-content a:hover:not(.active) {
		background-color: green;
		color:yellow;
		font-style: italic;
    		text-decoration: underline;
    		cursor:pointer;
		}

.dropdown6-content a:visited {
    color: blue;
}


.dropdown7:hover { background: rgba(76, 175, 80, 0.3)}
.dropdown7-content a:hover:not(.active) {
		background-color: green;
		color:yellow;
		font-style: italic;
    		text-decoration: underline;
    		cursor:pointer;
		}

.dropdown7-content a:visited {
    color: blue;
}


.show6 {display:block;}
.show7 {display:block;}

/*_________prof & Pers Small Menu Ends____________*/

/*_________Mid prof Menu Starts____________*/
.dropbtn6mid {
    color: white;
    background-color: #3e8e41
    text-decoration: underline;
   padding: 12px 3px;
    margin-top:-10px;
    margin-bottom:-15px;
    text-align: left;
    font-size: 14px;
    display: block;
font-weight: bold;
z-index: 3;
}


.dropbtn6mid: hover  {
     background: rgba(76, 175, 80, 0.3)
} 

.dropbtn6mid:focus {
     background: rgba(76, 175, 80, 0.3)
}

.dropdown6mid {
position: fixed;
top:5vw;
right:1vw;
    font-size: 12px;
    text-align: center;
    color:white;
z-index: 3;
    
}

.dropdown6mid-content {
    display: none;
font-size: 4.5vw; /*will define the line separation..OJO*/
    position: fixed;


    background-color: transparent;
    min-width: 20%;
    max-width: 100%;
    overflow-y: hidden; 
    left: 0vw;
    top: 1vw;
margin-top:0;
z-index: 6;
}

.dropdown6mid-content a {
    color: white;
    padding: 0px 0px;
    background-color: #3e8e41

    text-decoration: underline;
border: 1px solid yellow;
    text-align: left;
    font-size: 12px;
    display: inline;
z-index: 3;
}


.dropdown6mid:hover { background: rgba(76, 175, 80, 0.3)}
.dropdown6mid-content a:hover {background-color: #3e8e41}


.show6mid {display:block;}

/*_________Mid prof Menu Ends____________*/


/*_______ToolTip starts___________*/

/*_________Mid pers Menu Starts____________*/
.dropbtn5mid {
    color: white;
    background-color: #3e8e41
    text-decoration: underline;
   padding: 12px 3px;
    margin-top:-10px;
    margin-bottom:-15px;
    text-align: left;
    font-size: 14px;
    display: block;
font-weight: bold;
z-index: 3;
}


.dropbtn5mid: hover  {
     background: rgba(76, 175, 80, 0.3)
} 

.dropbtn5mid:focus {
     background: rgba(76, 175, 80, 0.3)
}

.dropdown5mid {
position: fixed;
top:5vw;
right:1vw;
    font-size: 12px;
    text-align: center;
    color:white;
z-index: 3;
    
}

.dropdown5mid-content {
    display: none;
font-size: 4.5vw; /*will define the line separation..OJO*/
    position: fixed;
border: 1px solid yellow;

    background-color: transparent;
    min-width: 20%;
    max-width: 100%;
    overflow-y: hidden; 
    left: 0vw;
    top: 0vw;
margin-top:0;
z-index: 6;
}

.dropdown5mid-content a {
    color: white;
    padding: 0px 0px;
    background-color: #3e8e41

    text-decoration: underline;

    text-align: left;
    font-size: 12px;
    display: inline;
z-index: 3;
}


.dropdown5mid:hover { background: rgba(76, 175, 80, 0.3)}
.dropdown5mid-content a:hover {background-color: #3e8e41}


.show5mid {display:block;}

/*_________Mid prof Menu Ends____________*/

.tooltip:hover:after{
    background: #333;
    background: rgba(0,0,0,.8);
    border-radius: 5px;
    bottom: 26px;
    color: #fff;
    content: attr(title);
    left: 20%;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 220px;
}


/*_______ToolTip ends___________*/