/**************************************************************
	Theme
**************************************************************/

.bg-brand {
	background-color: #0d7373;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
}

h1, .h1 {
	/*margin-top: 3rem;*/
	margin-bottom: 1.5rem;
}

h2, h3, h4, h5, h6,
.h2, .h3, .h4, .h5, .h6 {
	margin-top: 3rem;
	margin-bottom: 1.5rem;
}


/**************************************************************
	Header navigation icons
**************************************************************/

.navicon a {
	color: #268c8c;
}
.navicon a:hover,
.navicon a:active {
	color: #006666;
	text-decoration: none;
}

.navicon-icon {
	display: block;
	font-size: 2rem;
	line-height: 1.15;
}

.navicon-title {
	font-size: 0.9rem;
}


/**************************************************************
	Sidebar
**************************************************************/

.sidebar-backdrop {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1080;
}

.sidebar-overlay {
	width: 100vw;
	bottom: 0;
	touch-action: none;
}

.sidebar-overlay::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #000;
	opacity: 0;
	transition: opacity .15s linear;
}

.sidebar-overlay.show::before {
	opacity: 0.5;
}


.sidebar {
	position: fixed;
	top: 0;
	left: 0;
	box-sizing: border-box;
	width: 280px;
	height: 100vh;
	/*padding: 20px 20px;*/
	padding: 2.75rem 0 1rem 0;
	background-color: #fff;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	transform: translateX(-100%);
	transition: transform 0.3s ease-out;
	z-index: 1090;
}

.sidebar.show {
	transform: translateX(0);
}

.sidebar .navbar-toggler {
	position: fixed;
	top: 0;
	right: 0;
	padding: .75rem .75rem;
}


/**************************************************************
	News Cards
**************************************************************/

.card-columns.news img {
	max-height: 200px;
	object-fit: cover;
}

.card-columns.news h5 {
	font-weight: 400;
}

.card-columns.news a:hover {
	text-decoration: none;
}


/**************************************************************
	SVG Icons
**************************************************************/

.svg-icon {
	/* Place the icon on the text baseline. */
	position: relative;
	/*top: .125em;*/

	/* Prevent the icon from shrinking inside a flex container. */
	flex-shrink: 0;

	/* Scale the icon to match the font-size of the parent element. */
	height: 1em;
	width: 1em;

	/* Let the icon take whatever color the parent has. */
	fill: currentColor;

	/* If the icon is used on a link, which has a color transition, we can also use a transition on the fill value.	*/
	transition: fill .3s;

	/* Font Awesome specific */
	display: inline-block;
	font-size: inherit;
	vertical-align: -.075em;
}

.svg-icon.fa-fw {
	text-align: center;
	width: 1.25em;
}

.svg-icon.fa-2x {
	font-size: 2em;
}

header .svg-logo {
	width: 7em;
	height: 5em;
	fill: #0d7373;
}

footer .svg-logo {
	width: 4em;
	height: 3em;
	fill: #fff;
}


/**************************************************************
	Bootstrap customization
**************************************************************/

.form-control {
	height: calc(3rem + 2px);
	padding: .75rem .75rem;
	border-radius: 0;
}

form .btn {
	padding: .75rem 1.5rem;
}

.alert,
.btn,
.card,
.dropdown-menu {
	border-radius: 0;
}

.badge {
	font-weight: normal;
	border-radius: 0;
}

.breadcrumb {
    background-color: transparent;
    border-radius: 0;
    font-size: 85%;
    padding-left: 0;
}

.card:hover {
	/*box-shadow: 0 5px 15px rgba(0,0,0,0.08);*/
	border-color: #a3a2a0;
}

.navbar-toggler {
	padding: .75rem 0;
	font-size: 2rem;
}
.navbar-toggler:focus {
	outline:none;
}


/**************************************************************
	Media queries
**************************************************************/

/* XS devices (less than 576px) */
@media (max-width: 575.98px) {
	.tile a {
		min-height: auto;
	}

}

/* SM devices (less than 768px) */
@media (max-width: 767.98px) {

}

/* MD devices (less than 992px) */
@media (max-width: 991.98px) {

}

/* LG devices (less than 1200px) */
@media (max-width: 1199.98px) {

}


/*********************************************************************************************************/

/* SM devices (576px and up) */
@media (min-width: 576px) {
	.card-columns {
		column-count: 2;
	}
}

/* MD devices (768px and up) */
@media (min-width: 768px) {
}

/* LG devices (992px and up) */
@media (min-width: 992px) {
    .card-columns {
        column-count: 3;
    }
}

/* XL devices (1200px and up) */
@media (min-width: 1200px) {
	.container-text > p,
	.container-text > h2,
	.container-text > h3 {
		max-width: 930px;
	}
}

/* HD devices (1600px and up) */
@media (min-width: 1600px) {

/*	main > .container {
		max-width: 1248px;
	}
	main > .container-text {
		max-width: 1140px;
	}
*/

}