@font-face {
   font-family: "OpenSans";
   src: url(../fonts/OpenSans.ttf);
}

html {
    font-family: sans-serif;
    min-width: 350px;
    display: block;
}

body {
    font-family: OpenSans;
    background-color: #EEEEEE;
    width: 100%;
    margin: 0;
    padding: 0;
    display: block;
    transform: none;
}

#header,
.content.well {
    background-color: #ffffff;
}

#header {
    font-weight: bold;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    box-shadow: 0px 2px 5px rgba(0,0,0,0.2);
    text-transform: uppercase;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 15px;
}

#header-url > a,
.content > p > a {
    color: #009645;
    text-decoration: none;
}

#header-url > a:hover,
.content > p > a:hover {
  color: #79AF33;
  transition: all 0.35s;
}


#header-content {
 display: flex;
 align-items: center;
 margin-right: auto;
 margin-left: auto;
 padding-left: 9px;
 padding-right: 9px;

}

.content {
  padding: 15px;
}

.content > p {
	margin: 0;
	padding: 10px;
}

.content.well > form > ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.content.well > form > ul > li {
        display: grid;
        grid-template-columns: 24px auto;
}

.listdescription {
        text-align: justify;
}

.date,
.radio.radio-inline {
        margin-top: 5px;
}

.content.well > form > a {
	display: none;
}

.content.well > form > p > a {
	display: none;
}	

.jumbotron.table {
  max-width: 100%;
}

.jumbotron.table > tbody > tr {
	display: grid;
	padding-top: 5px;
}

.btn-group {
	display: grid;
	margin-left: 5px;
	padding-top: 5px;
}

label:has(> span.\[.glyphicon.glyphicon-ok.\]) {
	display: none;
}

.information {
	margin-bottom: 5px;
}


.form-control,
textarea,
input[type=text] {
	margin-top: 5px;
	background: white;
	border-width: 2px;
	border-style: inset;
	border-color: black;
	border-image: initial;
}

.form-control:focus,
textarea:focus,
input[type=text]:focus {
  outline: none;
  border-style: solid !important;
  border-width: 2px !important;
  border-color: #009645 !important;
  border-radius: 0 !important;
}

input[type=submit] {
	padding: 8px;
	margin-top: 10px;
    border-radius: 0;
    margin-left: 5px;
	background: #009645;
	color: #fff;
    font-weight: 700;
	font-size: 13px;
	border: none;
	box-shadow:inset 0 3px 5px rgba(0,0,0,0.125);
}

#library-img {
    margin-left: auto;
    margin-right: auto;
    display: block;
    padding-top: 15px;
    max-width: 80%;

}

#footerframe > .list-unstyled {
	display: none;
}

.poweredby {
	margin-top: 15px !important;
}


@media (min-width: 1200px) {
  #header-content,
  #mainContent {
    width: 1180px;
    margin-right: auto;
    margin-left: auto;
  }

}


@media (min-width: 1200px) {
  .content.well > form {
    width: 700px;
  }

  textarea,
  input[type=text] {
    width: 400px;
  }

}


@media (max-width: 1199px) {
  #header-content{
    max-width: 100%;
  }

  #mainContent {
    margin-left: 10px;
    margin-right: 10px;
  }

  .content.well > form {
    width: 700px;
  }

  textarea,
  input[type=text] {
    width: 400px;
  }
}

@media (max-width: 750px) {
  #header-content{
    max-width: 100%;
  }

  .content.well > form {
    max-width: 95%;
  }

  .jumbotron.table {
    max-width: 80%;
    min-width: 70%
  }

  textarea,
  input[type=text] {
    width:100%;
  }
}

@media (max-width: 580px) {
  #header-content{
    max-width: 100%;
  }

  .content.well > form {
    max-width: 95%;
  }

  .jumbotron.table {
   max-width: 100%;
   width: 98%;
  }

  textarea,
  input[type=text] {
    width:100%;
  }
}

@media (max-width: 460px) {
h3 {
		margin-bottom: 5px;
	}
	
	
	#header {
		font-size: 3.4vw;
    }
   
    #logo {
		width: 80px;
	}
	.content.well > .error {
		font-size: 3.8vw;
	}
	
	.content > p {
		margin: 0;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	
}