/* Typography */
.h1, h1, .h2, h2, .h3, h3, .h4, h4, .h5, h5, .h6, h6{ font-family: 'Cinzel', serif !important;}
.h1, h1{ font-size: 2.5rem; }
html {
  font-size: 1rem;
}
.dyna {font-family: 'Dynalight', sans-serif !important; }
@media screen and (max-width: 576px) {
  html {
    font-size: 1.2rem;
  }
  .logo{ width: 5.5vh; }
  .logo-container { background-color: #f8f9fa; }
}

@media screen and (max-width: 768px) {
  html {
    font-size: 1.1rem;
  }
}

/* Form css */
.error {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}

/*@include media-breakpoint-up(992px) {
  html {
    font-size: 3.6rem !important; 
  }
}

@include media-breakpoint-up(1200px) {
  html {
    font-size: 5.6rem;
  }
}*/

/* Colours */
body{ background-color: white;}
footer{ background-color: #0b58a9;}

/* Front page */
/*nav.navbar{ height: 18vh; }*/
nav.navbar a{ border-bottom: 2px solid transparent; }
nav.navbar a:hover{ border-bottom: 2px solid #0b58a9; }
nav.navbar h1 a{ border-bottom: 2px solid transparent !important; }
.logo{ 
    display: block;
    width: 46vw;
    margin-left: auto;
    margin-right: auto;
}
@media screen and (min-width: 576px) {
    .logo{ width: 16vw; }
    .logo-container{
        background-color: #f8f9fa;
    }
}

@media screen and (min-width: 768px) {
    .logo-container{ position: absolute; 
        left: 62vw; 
        top: -6vh; 
        z-index: 900;
        background-color: rgba(255, 0, 0, 0.0);
        
    }
    .logo{ width: 12vw;}
}

@media screen and (min-width: 1200px) {
    .logo-container{ position: absolute; 
        left: 42vw;
        top: -6vh; 
        z-index: 900; }
    .logo{ width: 13vw;}
}

h2 a{
    color: rgba(0,0,0,.9);
    border-bottom: 2px solid transparent !important;
}

.main-banner a i{
    color: #212529;
}
/* Blog on Front Page */
/*.blog-img{
    width:28vw;
}*/

/* Link - remove underline. */
.a-no-ul:hover{
    text-decoration: none;
}
 /* Right aligned text */
 p.justifyright{
     float: right;
 }
 /*Gallery Overlay*/
 .card:hover h6.card-title{
     visibility: visible;
 }
 /* Admission form css */
 .control:checked ~ .conditional{
     clip: auto;
				height: auto;
				margin: 0;
				overflow: visible;
				position: static;
				width: auto;
 }
 .control:not(:checked) ~ .conditional {
    border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
 }
 .control:not(:checked) ~ .large-conditional {
    display: block;
 }
 .control:not(:checked)~ label i {
     transform: rotate(180deg);
 }
 .display-5 {
     font-size:1.8rem;
 }
 .control:checked ~ .large-conditional{
     display: none;
 }
 
 .card.facilities {
     padding: 0;
 }
 .panel-img {
     width: 100%;
 }
 footer .D6-logo {
     height: 3.1rem;
     width: 3.1rem;
     margin-bottom: 0.8rem;
 }
 footer .D6-logo {
     height: 3.1rem;
     width: 3.1rem;
     margin-bottom: 0.8rem;
 }
 .card-body .D6-logo {
     height: 3.1rem;
     width: 3.1rem;
     margin-bottom: 0.8rem;
 }
 .main-banner img.D6-logo {
     height: 1.4rem;
     width: 1.4rem;
     margin-bottom: 0.12rem;
 }
 .social-media-logo {
     color: black;
 }
 
 footer {
     color: white;
 }
 footer ul {
     display: inline-flex;
     width: 100%;
     list-style-type: none;
     justify-content: center;
     color: white;
 }
 footer ul a {
     color: white;
 }
 footer ul a:hover {
     color: grey;
    text-decoration: none;
}
footer div a {
    color: white;
}
footer div a:hover {
    color: grey;
    text-decoration: none;
}
a.admission-link {
    text-decoration: none;
}

@media screen and (max-width: 768px) {
    .strelitzia {
        width: 100%;
        height: auto;
    }
    .dyna {
        font-size: 2rem !important;
    }
}

.map-img {
    width: 100%;
    height: auto;
}

#carterPopup {
    max-width: 80%;
}
#carterPopup > div > div > div.modal-body {
    align-self: center;
}