@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300&display=swap');

*
{
	font-family: 'Noto Sans JP', sans-serif;
}

.container 
{
	padding: 80px 120px;
}

.navbar-brand
{
	padding-top: 0px;
}

.person 
{
	border: 10px solid transparent;
	margin-bottom: 25px;
	width: 80%;
	height: 80%;
	opacity: 0.7;
}

.person:hover 
{
	border-color: red
}

.carousel-inner img 
{
	-webkit-filter: grayscale(90%);
    filter: grayscale(90%); /* make all photos black and white */ 
	width: 100%; /* Set width to 100% */
	margin: auto;
}

.carousel-caption h3 
{
	color: #fff !important;
}

.bg-1 
{
	background: #2d2d30;
	color: #bdbdbd;
}

.bg-1 h3 { color: #fff; }
.bg-1 p { font-style: italic; }

/* Remove rounded borders from list */
.list-group-item:first-child 
{
	border-top-right-radius: 0;
	border-top-left-radius: 0;
}

.list-group-item:last-child 
{
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}

/* Remove border and add padding to thumbnails */
.thumbnail 
{
	padding: 0 0 15px 0;
	border: none;
	border-radius: 0;
}

.thumbnail p 
{
	margin-top: 15px;
	color: #555;
}

/* Black buttons with extra padding and without rounded borders */
.btn 
{
	padding: 10px 20px;
	background-color: #333;
	color: #f1f1f1;
	border-radius: 0;
	transition: .2s;
}

/* On hover, the color of .btn will transition to white with black text */
.btn:hover, .btn:focus 
{
	border: 1px solid #333;
	background-color: #fff;
	color: #000;
}

.modal-header, h4, .close 
{
	background-color: #333;
	color: #fff !important;
	text-align: center;
	font-size: 30px;
}

.modal-header, .modal-body 
{
	padding: 40px 50px;
}

.nav-tabs li a 
{
	color: red;
}

/* Add a dark background color with a little bit see-through */
.navbar 
{
	margin-bottom: 0;
	background-color: #2d2d30;
	border: 0;
	font-size: 11px !important;
	letter-spacing: 4px;
	opacity: 0.9;
}

/* Add a gray color to all navbar links */
.navbar li a, .navbar .navbar-brand 
{
	color: red !important;
}

/* On hover, the links will turn white */
.navbar-nav li a:hover 
{
	color: #fff !important;
}

/* The active link */
.navbar-nav li.active a 
{
	color: #fff !important;
	background-color:#29292c !important;
}

/* Remove border color from the collapsible button */
.navbar-default .navbar-toggle 
{
	border-color: transparent;
}

/* Dropdown */
.open .dropdown-toggle 
{
	color: #fff ;
	background-color: #555 !important;
}

/* Dropdown links */
.dropdown-menu li a 
{
	color: #000 !important;
}

/* On hover, the dropdown links will turn red */
.dropdown-menu li a:hover 
{
	background-color: red !important;
}

/* Add a dark background color to the footer */
footer 
{
	background-color: #2d2d30;
	color: #f5f5f5;
	padding: 32px;
}

footer a 
{
	color: #f5f5f5;
}

footer a:hover 
{
	color: #777;
	text-decoration: none;
}

body 
{
	font: 400 15px/1.8 Lato, sans-serif;
	color: #777;
}

/* Overwrite default styles of h3 and h4 */
h3, h4 
{
	margin: 10px 0 30px 0;
	letter-spacing: 10px;
	font-size: 20px;
	color: red;
}

/* Remove rounded borders on input fields */
.form-control 
{
	border-radius: 0;
}

/* Disable the ability to resize textareas */
textarea 
{
	resize: none;
}

@media (max-width: 600px) 
{
	.carousel-caption 
	{
		display: none; /* Hide the carousel text when the screen is less than 600 pixels wide */
	}
}