@charset "utf-8";
/*css document*/

/*
html {
    font-size: 1em;
}
*/

html {
  position: relative;
  min-height: 100%;
}

/*Navigation Styles*/
.navbar-custom {
    background-color: #fcf8f8;
}

/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
    color: rgba(81, 135, 168, 0.8);
}

/* change the link color */
.navbar-custom .navbar-nav .nav-link {
    color: rgba(51, 51, 51, .6);
}

/* change the color of active or hovered links */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
    color: #333333;
}

/* fontawesome bar icon */
.fa-bars {
  color: #5187a8;
}

body {
    background-color: #fcf8f8;
    margin-bottom: 60px; /* Margin bottom by footer height */
}

h1 {
    font-family: helvetica, arial, "sans serif";
    color: darkslategray;
    font-size: 3rem;
}

h2 {
    font-family: helvetica, arial, "sans serif";
/*    color: darkslategray;*/
    font-size: 2.25rem;
}

h3 {
    font-family: helvetica, arial, "sans serif";
/*    color: darkslategray;*/
    font-size: 1.5rem;
}

h4 {
    font-family: helvetica, arial, "sans serif";
    color: darkslategray;
    font-size: 1.313rem;
}

h5 {
    font-family: helvetica, arial, "sans serif";
/*    color: darkslategray;*/
    font-size: 1.125rem;
}

.col-centered {
  float: none;
  margin-right: auto;
  margin-left: auto;
}

.mt-0 {
  margin-top: 0 !important;
}

.ml-1 {
  margin-left: ($spacer * .25) !important;
}
.ml-2 {
  margin-left: ($spacer * .5) !important;
}
.mr-2 {
  margin-right: ($spacer * .5) !important;
}
.px-2 {
  padding-left: ($spacer * .5) !important;
  padding-right: ($spacer * .5) !important;
}

.p-3 {
  padding: $spacer !important;
}

.p-4 {
  padding: ($spacer * 1.5) !important;
}

img {
	text-align: center;
	max-width: 100%;
	height: auto;
	width: auto;
}

.jumbotron {
    margin-bottom: 0 !important;
/*    margin-top: 0 !important;*/
}

.p-exhibitions{
    display: block;
    margin-top: 1em;
    margin-bottom: .5em;
    margin-left: 0;
    margin-right: 0;
}

.social {
	list-style-type: none;
	text-align: center;
    margin-bottom: 0 !important;
/*    background-color: aliceblue;*/
}
.social li {
	display: inline;
}

.social i {
	font-size: 270%;
/*  top-right-bottom-left*/
	margin: 1% 8% 1% 1%;
	color: #2C2C2C;
}

/*not working*/
.social a:hover {
	color: sienna;
}

.social a {
    text-decoration: none;
    color: #2C2C2C;
}

footer.copy {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50px; /* Set the fixed height of the footer here */
    line-height: 50px; /* Vertically center the text there */
	background-color: silver;
}
footer.copy p {
    font-family: 'Nanum Gothic', sans-serif;
    font-size: 80%;
	color: #FFF;
	text-align: center;
}

/*Gallery Styles*/
.gallery {
    margin-top: 3rem;
    background-color: #dddddd!important;
    
}

.figure-caption {
    font-family: 'Nanum Gothic', sans-serif;
    font-size: 80%;
    color: #33393e;
    font-weight: 400;
}



/*
####################################################
M E D I A  Q U E R I E S
####################################################
*/


html {
  font-size: 1rem;
}

@include media-breakpoint-up(sm) {
  html {
    font-size: 1.2rem;
  }
}

@include media-breakpoint-up(md) {
  html {
    font-size: 1.4rem;
  }
}

@include media-breakpoint-up(lg) {
  html {
    font-size: 1.6rem;
  }
}



/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Bootstrap 4 breakpoints
*/

/* 
Extra small devices (portrait phones, less than 544px) 
No media query since this is the default in Bootstrap because it is "mobile first"
*/


/* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) {  

}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {  

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 

}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  
    
}