/*
green from banner
#063c46
#0e9f9a
#0a7074


*/

:root {
  /* Alapszínek */
  --color-primary: #063c46;     /* Főszín: CTA gombok, kiemelés */
  --color-primary-dark: #0a7074; /* Főszín sötétebb árnyalat: hover */
  --color-secondary: #0e9f9a;   /* Másodlagos szín: kártyák, felületek */
  --color-background: #f5ecd0;  /* Háttérszín */
  --color-text: #676767;        /* Szöveg */

  /* Kiegészítők */
  --color-border: #ccc0b0;      /* Keretek */
  --color-surface: #ffffff;     /* Fehér felület pl. kártyákhoz */
  
  --primary-50: #e8fdfc;
  --primary-100: #d0fbf9;
  --primary-200: #a1f7f4;
  --primary-300: #72f3ee;
  --primary-400: #43efe9;
  --primary-500: #14ebe3;
  --primary-600: #10bcb6;
  --primary-700: #0c8d88;
  --primary-800: #085e5b;
  --primary-900: #042f2d;
  --primary-950: #032120;

}

h1, h2, h3, h4, h5, strong {
  color:var(--primary-800);
}

h1 {
  margin-bottom:2rem;
}

.btn-primary {
  background-color: var(--color-primary-dark);
  border-color: var(--color-primary-dark);
}

.btn-primary:hover {
  background-color: var(--color-secondary);
  border-color: var(--color-secondary);
  color: var(--color-text);
  text-decoration: none;
}

.bg-primary-subtle {
  background-color: var(--color-background) !important;
}

body, html {  
  height: 100%;  
  margin: 0;	
  font-family: Manrope;	
  font-style: normal;	
  font-weight: normal;	
  color: var(--color-text);
}

html {  
  font-size: 100%; /* instead of 125% */
}

body {  
  font-size: 1rem; /* if previously 1.125rem or more */
  padding:0;
  margin:0;
}

.container {
  width:1200px;
}

.article{
  margin-top:100px;
  padding-bottom:150px;
}

a {	
  font-family: Manrope;	
  text-decoration:underline;
  color: var(--primary-700);
}

a.btn {
text-decoration:none;
}

a:hover {  
text-decoration:underline;
color: var(--color-primary-dark);
}


.banner {
}


#banner_logo {max-width:100%;}

#banner_welcome {font-family:Manrope; color:#ffffff; position:absolute; top:43%; left:7%;}


.border_line {  position: relative;  z-index : 1;}

.border_line:before {  content : "";  position: absolute;  left    : 1.3vw;  top  : 0;  height  : 1px;  width   : 80%;  /* or 100px */  border-top:1px solid rgba(0,47,108,1);}


.navbar {background-color: #063c46 !important;}

.nav-link:link {
	text-transform:uppercase;
	font-weight:600;
	text-decoration: none;
  font-size:12px;
}

.nav-link:hover {
	color: var(--bs-heading-color);
}

.nav-link:active {
	color: var(--bs-heading-color);
}

.navbar-nav > .nav-item > a {color: #ffffff;} 
.navbar-nav > .nav-item > a:hover {color: #0e9f9a; } 


.progtable th, .progtable td  {text-align: center;border:none;vertical-align:middle;padding:12px;}
.progtable > tbody > tr > td.reg,
.progtable > tbody > tr > td.sect,
.progtable > tbody > tr > td.break,
.progtable > tbody > tr > td.social {border:4px solid #ffffff;}
.progtable > tbody > tr > td.time {text-align: left;}
.progtable > tbody > tr > td.reg {background-color: #F0F8FF;}
.progtable > tbody > tr > td.sect {background-color:#002f6c;color:#ffffff;}
.progtable > tbody > tr > td.break {background-color:#ededed;}
.progtable > tbody > tr > td.social {background-color:#FFC300;}








@media screen and (max-width: 580px) {
  html {  
    font-size: 100%; 
  }

  body {  
    font-size: 0.9rem; 
  } 
  
  .container, .container-fluid {
    width: 600px;
  }

  
  .banner {
/*    background-image: none !important;
    max-height:100%;*/
  }
  
  /*#banner_logo {width:100%;}  */
  
/*  #banner_welcome {top:25%;}*/

  
  .navbar-nav {		padding: 0 20px;		text-align: left;    position:absolute;    top:45px;    right:0;  width:100%;  }	
  .navbar-nav > .nav-item > a {font-size:12px !important; }  

  
}