@charset "UTF-8";


/*body*/

html, body { 
  min-height: 100%; }

@media only screen and (max-width: 767px) {
  body {
    background-image: url("../Images/A-wall-painting-with-gold-filigree-and-white-marble-background.jpg_q50.png");}}

body {
background-image: url("../Images/A-wall-painting-with-gold-filigree-and-white-marble-background.jpg_q50.jpg");
background-repeat:repeat;
background-size:cover;	
background-position:center center;
background-attachment: fixed;}

body{ overflow-x: hidden;
overflow-y: scroll;}



/*fonts*/

@font-face{font-family: Plantagenet Cherokee;
src:url("../Fonts/Plantagenet Cherokee.ttf");}

#hero h1{font-family: "Plantagenet Cherokee"; font-size: 40px;}
#hero p {font-family: "Plantagenet Cherokee"; font-size: 18px;}

#about h1 {font-family: "Plantagenet Cherokee"; font-size: 40px;}
#about p {font-family: "Plantagenet Cherokee"; font-size: 18px;}

#services h1 {font-family: "Plantagenet Cherokee"; font-size: 40px;}
#services h3 {font-family: "Plantagenet Cherokee"; font-size: 22px;}
#services li {font-family: "Plantagenet Cherokee"; font-size: 18px;}

#covid h1 {font-family: "Plantagenet Cherokee"; font-size: 40px;}
#covid p {font-family: "Plantagenet Cherokee"; font-size: 18px;}

#contact h3{font-family: "Plantagenet Cherokee"; font-size: 22px;}

#navbar a {font-family: "Plantagenet Cherokee"; font-size: 18px;}

/*dropdown*/

.container{
	  clear: both;}
  
  
nav{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9998;
	transition: all 0.5s;}

.scrollUp{
	transform: translateY(-90px)}

#navbar {background-color:black;
	height: 90px;}

.navbar-brand{padding-left: 40%;}

.responsive {
  width: 100%;
  max-width: 200px;
  height: auto;}

 



.dropbtn {
	background-color: black;
	color: white;
	padding: 26.5px;
	font-size: 16px;
	border: none;
	cursor: pointer;
	position: fixed;
	top:0px;
z-index: 1;}

.dropbtn:hover, .dropbtn:focus {
  background-color: goldenrod;}

.dropdown {
  position: relative;
  display: inline-block;
z-index: 1;}

.dropdown-content {
	display: none;
	position: fixed;
	top: 90px;
	background-color: goldenrod;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;}

.dropdown-content a:hover {background-color: #EFEAEA}

.show {display:block;}


/*hero*/

#hero {background-color: black;
padding: 5%;
margin-top: 10%;
margin-left: 10%;
margin-right: 10%;
margin-bottom: 10%;	
text-align: center;}

#hero h1 {color: white;}
#hero p {color: white;}



.parallax {
  background-image: url("../Images/ladyjustice.jpeg");
  background-size: cover;
  height: 200px; 
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  margin: -1.3%;}



@media (max-width: 1024px) {
 	.parallax  {
		top: 0 !important;
		height: 100% !important;
		width: 100% !important;
	}
}

/*about*/

#profile{padding-bottom: 3%;}

#profile img{background-color: transparent;
margin-top: -50px;
border: none;}

#about{
color: black;
padding: 2%;
margin-top: -10%;}

#about h1{color: black;
padding-bottom: 2%;
text-align: center;}

#about p{text-align: left;
padding-top: 20px;}

#s1 span{
	display: inline-block;
	color: white;
	background-color: goldenrod;}
#s2 span{
	display: inline-block;
	color: white;
	background-color: goldenrod;}


/*services*/

#services {background-color: goldenrod;
margin: 2%;
margin-bottom: 10%;	
text-align: center;
padding: 5%;}

#services h1 {color: white;
padding-bottom: 2%;}

#services li {
color: white;
text-align: left;}

#services ul {
text-align: left;
z-index: 1;
background-color: goldenrod;}

.list1{padding: 20px;}

.list2{padding: 20px;}

#services ol{
text-align: left;
padding-left: 2%}

.s1 {background-color: transparent;
border: none;}


#popup{background-image: url("../Images/melinda-gimpel-wkfZyteTMOA-unsplash.jpg");
 background-repeat: no-repeat;
  background-size: 600px 400px}

.s2 {background-color: transparent;
border: none;}


.list1{margin-left: 10px;
	padding-left: 10%;
	padding-right: 10%;}


/*covid info*/

#covid
{background-color: black;
margin-top: 10%;
margin-left: 5%;
margin-right: 5%;	
margin-bottom: 10%;	
text-align: center;
padding: 5%;}

#covid h1{
color: white;
padding-bottom: 2%;}

#covid p {
color: white;
text-align: center;	}

/*buttonsinfo*/

.communication {background-color: transparent;
border: none;}

.meetings {background-color: transparent;
border: none;}

.admission{background-color: transparent;
border: none;}

.covidservice {background-color: transparent;
border: none;}

#comms span{
	display: inline-block;
	color: white;
	background-color: black;
	padding: 2%; }

#meet span {
	display: inline-block;
	color: white;
	background-color: black;
	padding: 2%;}

#adm span {
	display: inline-block;
	color: white;
	background-color: black;
	padding: 2%;}

#doc span{
	display: inline-block;
	color: white;
	background-color: black;
	padding: 2%;}

#covidlinks { color: white;
	padding-top: 2%;}


/*contact*/

#contact {background-color: white;
text-align: center;
margin-top: 10%;
padding: 5%;}

#contact h3 {color: black;}