.navButton {
    color: #fff !important;	
}

.navSelected {
    font-weight:bold;
    background-color:#26C6DA;
    color: #fff !important;
}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
    background-color: #26C6DA;
}    

.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
    background-color: #26C6DA;
    color: #fff !important;
}    

body {
    font-family: 'Abel', 'Open Sans', sans-serif;
}

.btn {
    margin-top: 4px;
    border: 1px solid #d3d3d3;
    border-radius: 4px;
    padding: 8px 14px;
    background-color: #fff;
}

.thumbnail {
    padding: 12px;
    text-align: center;
}

#id_bg_body {
    background-color:#eee;
}

#id_news_model_sel {
    background-color:#f9f9f9;
    padding: 35px 30px;
    border-bottom: 1px solid #eaeaea;
    border-left: 1px solid #eaeaea;
}

.news_model_sel_form {
    text-align:left;
    padding:10px;
    font-size:12pt;
}

#id_custom_header {
    background-color:white;
    color:#525564;
    text-align:center;
    width:80%;
    border-right: 1px solid #d3d3d3;
    border-left: 1px solid #d3d3d3;
}

#id_custom_nav_bar {
    background-color:#424242;
    color:#fff;
    text-align:center;
    width:80%;
    font-size:14pt;
}

#id_custom_paragraph {
    background-color:white;
    text-align:justify;
    font-size:14pt;
    padding:35px 30px;
    border:1px solid #d3d3d3;
}

#id_news_date {
    color:#BFC9CA;
}

#id_news_figure {
    background-color:white;
    text-align:left;
}

#id_custom_tomo_table {
    background-color:white;
    color:black;
    text-align:left;
    width:80%;
    border: 1px solid #d3d3d3;
}

#id_vote_tomo_image {
    background-color:white;
    text-align:center;
    margin-top:35px;
}

#id_plot_option_vote_tomo {
    border:1px solid #FFFFFF; 
    padding:10px; 
    margin-bottom:10px; 
    margin-top:10px;
}

#load{
position:absolute;
z-index:1;
border:3px double #999;
background:#f7f7f7;
width:300px;
height:300px;
margin-top:-150px;
margin-left:-150px;
top:50%;
left:50%;
text-align:center;
line-height:300px;
font-family:"Trebuchet MS", verdana, arial,tahoma;
font-size:18pt;
}

.grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    max-width: 1200px;
    margin: auto;
}

.use-case {
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s;
}

.use-case:hover {
    transform: translateY(-5px);
}

.use-case img {
    width: 100%;
    height: auto;
}

.use-case-content {
    padding: 15px;
}

.use-case h3 {
    margin: 10px 0;
    font-size: 1.2em;
}

.use-case p {
    color: #555;
}

.use-case a {
    display: inline-block;
    margin-top: 10px;
    padding: 8px 12px;
    background: #007BFF;
    color: white;
    text-decoration: none;
    border-radius: 5px;
}

.use-case a:hover {
    background: #0056b3;
}