/*
FAPROTAX CSS
Stilianos Louca
August 2024
*/

/* Content */
body {
	font-family: Lucida Grande, Verdana, Geneva, Helvetica, sans-serif;
	color: #222222;
	font-size: 12px;
	background-color: #F9F9F9;
}

.main_page_news {color: #616161; font-size: 11px; }
.sub_info {font-size: 11px; }/* sub_info used as app-description in applications list, as member-details in about section, as file-info in application download list. */
.page_title {font-size: 20px; }
.section_title {font-size: 15px; }
.super_section_title {font-size: 17px; font-style:bold; color: #000000; }
.tree_path {font-size: 16px; font-weight: bold; }/* path composed out of url-nodes (used for example in DC_file_browser) */
.url_listing {font-size: 12px; }
.title_quote {font-size: 13px; font-style: italic; }

/* used for small articles like about, disclaimer etc */
.article_title {font-size: 12px; font-weight: bold; }
.article {font-size: 12px; text-align: justify}

.article_codebox {	font-size: 12px; 
					color: #333333; 
					font-family: "Courier"; 
					background-color: #F2F2F2; 
					padding: 5px;
					vertical-align: middle;
					border: 1.2px solid #C0C0C0;
					margin-top: 5px;
					margin-bottom: 5px;
}


.article_codeinline {	font-size: 12px; 
						color: #333333; 
						font-family: "Courier"; 
}

.code_section_title {	
	font-size: 15px; 
	color: #333333; 
	font-family: "Courier"; 
}


.article_codeinline_link {	font-size: 12px; 
							color: 	#0309A8; 
							font-family: "Courier"; 
}

.code_scrollbox {
	border:0px
	height:30px;
	width:760px;
	overflow-y:hidden;
	overflow-x:scroll; 
	white-space:nowrap; 
	padding-bottom:0px;
}

									
.developer_property_title, .about_memberlist_title {font-weight: bold; font-size: 12px; }
.developer_detail {font-size: 11px; }/* including .developer_name & .developer_LANGUAGE */
.developer_name {font-weight: bold; }
.developer_rb { color: #009900; }
.developer_php { color: #990066}
.developer_pascal, .developer_PAS { color: #561200; }
.developer_cpp { color: #0000FF; }
.developer_html { color: #FF6600; }
.developer_pl { color: #ED0010; }
.developer_java, .developer_JAR {color: #1B604A; }
.developer_c { color: #951FFF; }
.developer_cocoa, .developer_m  { color: #004F89; }
.developer_f, .developer_f90, .developer_f95, .developer_f77 { color: #A86B26; }
.developer_pseudo, .developer_article { color: #404B65; }
.developer_cryptography { color: #FF6699; }
.developer_algorithms, .developer_algorithm { color: #C81D1B; }
.developer_protocols, .developer_protocol { color: #0F77C8; }
.developer_unknown { color: #666666; }

.contact_category {font-size: 11px; font-weight: bold; }
.contact_address {font-size: 11px; }

.disclaimers_title {font-size: 16px; font-weight: bold; }
.disclaimers_file_title { font-size: 15px; }

.listing { font-size: 12px; color: #000000; }
.sub_listing {font-size: 11px; color: #000000; }
.column_title { font-size: 16px; color: #000000; }
.listing_group {font-size: 15px; color: #000000; }
.navigation_list {font-size: 12px; color: #0F1369; }
.label {font-size: 11px; font-weight: bold; }
.tab_text {font-size: 14px; color: #000000; }


.error { font-size: 12px; color: #EE0000; }
.warning { font-size: 12px; color: #5B0E3E; }
.success { font-size: 12px; color: #00AA07; }
.neutral { font-size: 12px; }
.log { font-size: 12px; color: #000000; }
.informative { font-size: 12px; color: #1B00DA; }
.footnote { font-size: 10px; color: #444444; }
.footnote_size { font-size: 11px; }

.error_color { color: #EE0000; }
.warning_color { color: #5B0E3E; }
.success_color { color: #00AA07; }
.neutral_color {}
.not_important_color { color: #606060; }
.log_color { color: #000000; }
.informative_color { color: #1B00DA; }
.highlight_important_color {color: #EE0000; }
.highlight_mild_color {color: #00AA00; }

/* image borders and styles */
.profile_photo_border { border-width: 1px; border-color: grey; border-style: solid; }
.research_photo_border { border-width: 1px; border-color: grey; border-style: solid; }
.software_photo_border { border-width: 1px; border-color: #BBBBBB; border-style: solid; padding: 3px }
.activity_photo_border { border-width: 0; }


/* Links */
a {
	color: #0309A8;
}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
	color: #0066FF;
}
a:active {
	text-decoration: none;
}


img.small_icon { width:16; border:0; }
img.medium_icon { width:21px; border:0; }
img.large_icon { border:0; }


/****************************************/
/* Modal images */


/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
}

/* Modal Content (Image) */
.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
}


/* Add Animation - Zoom in the Modal */
.modal-content, #caption { 
    animation-name: zoom;
    animation-duration: 0.4s;
}

@keyframes zoom {
    from {transform:scale(0)} 
    to {transform:scale(1)}
}

/* The Close Button */
.modal_close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.modal_close:hover,
.modal_close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}
