﻿/*PATOLOGIA 202205_2 HPL*/

body {
    margin: 0;
}

/* Navbar container */
.navbar {
    overflow: hidden;
    background-color: #953192;
    font-family: 'Century Gothic' !important;
    width: 100%;
    /*font-weight: bold;*/
    font-size: 15px !important;
    height: 45px !important;
}

/* Links inside the navbar */
.navbar a {
float: left;
font-size: 15px;
color: white;
text-align: center;
padding: 7px 8px;
text-decoration: none;
font-family: 'Century Gothic' !important;
/*font-weight: bold;*/
font-size: 15px !important;
}

    .navbar h3 {
        font-family: 'Century Gothic' !important;
        font-size: 15px;
    }

    .navbar h4 {
        font-family: 'Century Gothic' !important;
        font-family: 'Century Gothic' !important;
        font-size: 15px;
    }

/* The dropdown container */
.dropdown {
float: left;
overflow: hidden;
font-family: 'Century Gothic' !important;
}

/* Dropdown button */
.dropdown .dropbtn {
font-size: 16px !important;
border: none;
outline: none;
color: white;
padding: 14px 16px;
background-color: #953192 !important;
font: inherit; /* Important for vertical align on mobile phones */
margin: 0; /* Important for vertical align on mobile phones */
font-family: 'Century Gothic' !important;
font-size: 15px !important;
}

/* Add a red background color to navbar links on hover */
.navbar a:hover, .dropdown:hover .dropbtn {
background-color: #B24399 !important; 
}

/* Dropdown content (hidden by default) */
.dropdown-content {
display: none;
visibility : hidden;
position: absolute;
background-color: #f9f9f9;
/*width: 100%;*/
left: 0;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
font-family: 'Century Gothic' !important;
top: 49px !important;
}

/* Mega Menu header, if needed */
.dropdown-content .header {
background: #2B2F38;
padding: 10px;
color: white;
text-align : center;
font-family: 'Century Gothic' !important;
font-size: 15px !important;
height: 30px !important;
}

.dropdown-content .header h2 {
    font-family: 'Century Gothic' !important;
    font-size: 15px !important;
}

.dropdown-content .row {
width: 95%;
background-color: #EFEFEF !important;
height: 500px !important;
overflow: auto !important;
font-family: 'Century Gothic' !important;
/*padding-left: 20px;*/
}

        /* Show the dropdown menu on hover */
        /*.dropdown:hover .dropdown-content {
display: block;
}*/
        /* Create 4 equal columns that floats next to each other */
.column {
float: left;
width: 19% !important;
padding: 3px;
background-color: #EFEFEF !important;
/*max-height: 250px !important;*/
font-family: 'Century Gothic' !important;
/*overflow: auto !important;*/
}

/* Style links inside the columns */
.column a {
float: none;
color: black;
padding: 3px;
text-decoration: none;
/*display: block;*/
text-align: left;
font-family: 'Century Gothic' !important;
}

    .column h3 {
        font-family: 'Century Gothic' !important;
        color: #60205C !important;
        font-size: 15px;
    }

    .column h4 {
        font-family: 'Century Gothic' !important;
        color: #60205C !important;
        font-size: 15px;
        font-weight: 500 !important;
    }

.column ul {
    color: #60205C !important;
    padding-left: 20px !important;
}

.column span {
    padding-left: 18px !important;
    font-family: 'Century Gothic' !important;
    font-size: 14px !important;
    color: #953192 !important;
}

.column .a {
    background-color: transparent !important;
    font-size: 15px !important;
    color: #953192 !important;
    border: none !important;
    font-family: 'Century Gothic' !important;
    padding-left: 22px !important;
    width:100% !important;
}

    .column .a:hover {
        background-color: transparent !important;
        font-size: 15px !important;
        color: #953192 !important;
        border: none !important;
        font-family: 'Century Gothic' !important;
        padding-left: 22px !important;
        width: 100% !important;
    }

/* Add a background color on hover */
.column a:hover {
    background-color: #B24399 !important;
    color: white !important;
    width: auto !important;
    border-radius: 7px !important;
}

        

/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}

