/* Подключение шрифта Робото */

@import url('https://fonts.googleapis.com/css?family=Roboto:400,300,500,700&subset=latin,cyrillic');
@import url('https://fonts.googleapis.com/css?family=Playfair+Display|Roboto');


/* CSS-переменные */
:root {
   /* --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")*/
    --abtb-blue: #003399; /*АБТБшный синий цвет*/
    --abtb-blue-50: #00339977; /*АБТБшный синий цвет с прозрачностью*/
    }


/* Общие стили */
body, html {
	overflow-x: hidden;   /* Отмена горизонтальной прокрутки на айфоне */
	background-color: white;
	font-family: 'Roboto', sans-serif; /* Шрифт сайта */
}

body {
	font-size: 0.9rem;
	font-weight: 400;
	line-height: 1.5; 
	text-align: justify;
}



.page-section {
    text-align: center;
}


.navbar-toggler-icon2 {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    /* background-image: var(--bs-navbar-toggler-icon-bg2);*/
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
}


button, button img {
    -webkit-user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

p{
    border: none;
    border-style: none;
}



a:hover {
	color: var(--abtb-blue);
    text-decoration: none;
}


/* Синий цвет АБТБ */

.abtb-blue {
    color: var(--abtb-blue);
}

.bg-abtb-blue {
    background-color: var(--abtb-blue);
}

.bg-abtb-blue-50 {
    background-color: var(--abtb-blue-50);
}

/* Пустота при помощи Эйчара */

hr{
	border: none;
}

/* Стили заголовков */

h1, h1 a {
	font-size: 2rem;
	color: var(--abtb-blue);
    text-decoration: none;
}

h2, h2 a {
	color: var(--abtb-blue);
    margin-top: 3rem;
    margin-bottom: 1.5rem;
    text-decoration: none;
    font-weight: bolder;
    text-align: center;
}		


h3, h3 a {
	font-size: 1.5rem;
	color: #343a40;
    text-decoration: none;
}

h5, h5 a {
	color: #343a40;
    text-decoration: none;
}

h3:hover a, h3:focus a, h5:hover a, h5:focus a  {
	color:var(--abtb-blue);
}



div.contact-us p, div.contact-us p a {
    color: var(--abtb-blue);
    text-decoration: none;
}

/* Стили для бокового меню главной страницы */


nav.top_menu a, .nav-item a {
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
	display: block;
    padding: .5rem 1rem;
	color: var(--abtb-blue);
    text-decoration: none;
    background-color: transparent;
	
}

nav.top_menu a:hover, nav.top_menu a:focus,  .nav-item a:hover, .nav-item a:focus {
    text-decoration: underline;
}

/* Стили для верхнего меню подстраниц */


nav.top_menu-2 a, .nav-item a {
	font-size: 1rem;
	font-weight:600;
	text-align: center;
	display: block;
    padding: .5rem 1rem;
	color: var(--abtb-blue);
    text-decoration: none;
    background-color: transparent;
}

nav.top_menu-2 a:hover, nav.top_menu a:focus,  .nav-item a:hover, .nav-item a:focus {
    text-decoration: underline;
}

/* Стили для кнопки мобильного меню подстраниц */

.nav-toggle {
    border-radius: 20px;
    border: none;
    box-shadow: none;
    background-color: #FFFFFF;
}

.nav-toggle:focus, .nav-toggle:hover  {
    border-radius: 20px;
    box-shadow: 2px;
    border-color: var(--abtb-blue);
    border-width: 2px;
    background-color: #FFFFFF;
}

.nav-toggle:active  {
    border-radius: 20px;
    box-shadow: 2px;
    border-color: #990000;
    border-width: 2px;
    background-color: #adadad;
}


/* Стили для Хлебных Крошек */

nav.breadcrumb {
	background-color: white;
	justify-content: center;
}
nav.breadcrumb a {
	font-size: 0.9rem;
    color: rgba(0, 0, 0, 0.8);
}

nav.breadcrumb a:hover, nav.breadcrumb a:focus, ol.navibar li a:hover, ol.navibar li a:focus{
  color: var(--abtb-blue);
}

nav.breadcrumb a:active {
    color: rgba(0, 0, 0, 0.6);
    font-weight: 600;
}

/* Стили для Карточек проектов */

/*
@media (min-width: 576px) {
  .card-columns {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 1.25rem;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
    orphans: 1;
    widows: 1;
  }
}

@media (min-width: 992px) {
  .card-columns {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 1.25rem;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
    orphans: 1;
    widows: 1;
  }

}
*/

/* Направления проектов - карточки*/

div.project-gallery {
    display: flex;
    flex-flow: row wrap;
    text-align: center;
    margin-bottom: 1rem;
}

div.project-card {
    flex: 0 0 auto;
    padding: 0.5rem 0.5rem;
}

div.project-card-inner {
    width: 100%;
    height: auto;
    aspect-ratio: 4/5;
    border-radius: 2rem;

    background-position: center; 
    background-size: cover; 
    background-clip: content-box; 
    background-repeat: no-repeat; 
    background-origin: content-box;
}

div.project-card-inner:hover, div.project-card-inner:focus { 
    -webkit-transform: scale(1.02);
    -o-transform: scale(1.02);
    -moz-transform: scale(1.02);
    transform: scale(1.02);
}

div.project-card h5 {
    word-wrap: break-word;
    word-break: keep-all;
}

.project-card-inner-overlay {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    border-radius: inherit;
}

.project-card-inner-overlay:hover, .project-card-inner-overlay:focus {
    background-color: var(--abtb-blue-50);
    backdrop-filter: blur(10px);
}

.project-card-inner-overlay:hover .project-name, .project-card-inner-overlay:focus .project-name, .project-card-inner-overlay:hover .project-descr, .project-card-inner-overlay:focus .project-descr {
    color: white;
    font-weight: bolder;
    text-align: center;
    font-size: 1.5rem;
}

.project-card-inner-overlay .project-name, .project-card-inner-overlay .project-descr {
    text-decoration: none;
    text-decoration-style: none;
    font-size: 0%;
    
}

.project-name {
    color: transparent;
}

.project-descr {
    color: transparent;
}





/* Команда - карточки */

div.team-gallery {
    display: flex;
    flex-flow: row wrap;
    text-align: center;
}

div.team-card {
    flex: 0 0 auto;
    margin-bottom: 0.9rem;	
	cursor: pointer;
}

div.team-card:hover { 
    -webkit-transform: scale(1.05);
    -o-transform: scale(1.05);
    -moz-transform: scale(1.05);
    transform: scale(1.05);
}

div.person-photo {
    width: 95%;
    height: auto;
    aspect-ratio: 1/1;
    filter: grayscale(100%);
    border-radius: 2rem;

    background-position: center; 
    background-size: cover; 
    background-clip: content-box; 
    background-repeat: no-repeat; 
    background-origin: content-box;
}

div.person-photo:hover { 
    filter: grayscale(0%);
}

.person-name {
    color: var(--abtb-blue);
    font-weight: bolder;
    margin-top: 1rem;
}

.person-title {
    font-weight:normal;
}


/* Образование - карточки*/

div.study-gallery {
    display: flex;
    flex-flow: row wrap;
    text-align: center;
    flex: 0 0 auto;
    margin-bottom: 1rem;
}

div.study-card {
    flex: 0 0 auto;
    padding: 0.5rem 0.5rem;
}

div.study-card-inner {
    width: 100%;
    height: auto;

    border-radius: 1.5rem;

    background-position: center; 
    background-size: cover; 
    background-clip: content-box; 
    background-repeat: no-repeat; 
    background-origin: content-box;

    flex: 0 0 auto;
    display: flex;
    flex-flow: column wrap;
    
}

.pic-4-5 {
    aspect-ratio: 5/4;
}

.pic-tall {
    aspect-ratio: 5/8.15;
}

div.study-card h5 {
    word-wrap: break-word;
    word-break: keep-all;
}

.study-card-inner-overlay {
    width: 100%;
    height: 100%;
    border-radius: inherit;
    padding: 20px 20px;
    align-content: center;
}
.pic-gray {
    filter: grayscale(100%);
}

.pic-blue {
    background-color: var(--abtb-blue-50);
    filter: grayscale(0%);
    backdrop-filter: blur(5px);
}

.study-name {
    color: white;
    font-weight: bolder;
    text-align: justify;
    font-size: 1.5rem;
}


.study-text {
    color: white;
    font-weight: normal;
    text-align: justify;
    font-size: 1rem;
}



.contact-us a {
    font-size: 1.5rem;
}

/*Новости на главной */

div.news-card {
    margin-bottom: 0.9rem;	
	display: inline-block;
	cursor: pointer;
    width: 100%;
    height: auto;
    aspect-ratio: 3/2;
}


/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  margin-bottom: 4rem;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 3rem;
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel-item {
  height: 32rem;
}

@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }

}



/* Список новостей (проверить: старый) */


ul.news-list {
	list-style-type: none !important;
}

ul.news-list li {
    text-decoration: none;
    padding: 0.5rem;
    margin-bottom: 0.9rem;
	list-style-type: none !important;
    
    border: thin;
    border-color: gray;
    border-radius: 0.1rem;
}

ul.news-list li:hover, ul.news li:focus {
    -webkit-transform: scale(1.02);
    -o-transform: scale(1.02);
    -moz-transform: scale(1.02);
    transform: scale(1.02);
	box-shadow: 0.1rem 0.1rem 0.3rem 0.3rem rgba(0, 0, 0, 0.1);
    list-style-type: none !important;
    text-decoration: none;
}
ul.news-list li a {
    color: rgba(0, 0, 0, 0.7);
}

ul.news-list li a:hover, ul.news-list li a:focus {
    color: var(--abtb-blue);
}

ul.news-list li img {
    width: 80%;
    height: auto;
}



/*
div.card {
	margin-bottom: 0.9rem;	
	display: inline-block;
	cursor: pointer;
    width: 100%;
    height: auto;
}

div.card a {
    text-decoration: none;
}

div.card:hover, div.card:focus { 
    -webkit-transform: scale(1.02);
    -o-transform: scale(1.02);
    -moz-transform: scale(1.02);
    transform: scale(1.02);
	box-shadow: 0.1rem 0.1rem 0.3rem 0.3rem rgba(0, 0, 0, 0.1);
}

div.card h5 {
    color: rgba(0, 0, 0, 0.8);
}

div.card:hover h5, div.card:focus h5 {
    color: var(--abtb-blue);
}

div.card a p {
    color: rgba(0, 0, 0, 0.8);
}

div.card-item {
	display: inline-block;
}

*/


/* Стили для главной страницы (устарели) */

/*
div.main-page-nav nav{
    flex-direction: row !important;
    justify-content: center;
}
*/

/* Стили для Футера */

footer {
	/* background-color: rgba(0, 0, 0, 0.05);*/
	padding-top: 1rem;	
	padding-bottom: 1rem;
}


/* Стили для футер-меню (старые)  */

footer nav {
    justify-content: center;
	flex-direction: column;
}

nav.footer_menu a {
	font-size: 0.9rem;
	font-weight: normal;
	display: block;
    padding: .5rem 1rem;
    color: rgba(0, 0, 0, 0.5);
	text-align: center;
    text-decoration: none;
    background-color: transparent;
}

nav.footer_menu h5 {
    color: rgba(0, 0, 0, 0.7);
}

nav.footer_menu a:hover, nav.footer_menu a:focus {
    color: var(--abtb-blue);
}


p.copyright {
	font-size: 0.7rem;
    color: rgba(0, 0, 0, 0.3);
	text-align: end;
}