html,
body {
margin: 0;
padding: 0;
height: 100%;
background: #cb132f;
/*-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover; */
font-family: 'Muli', sans-serif;
font-size: 110%;
letter-spacing: 1px;
-webkit-font-smoothing: antialiased;
text-align: center;
}
#wrapper {
position: relative;
min-height: 100%;
height: auto !important;
margin-bottom: -50px;
}
#header {
}
#content {
float: left;
width: 100%;
padding-bottom:14% ; /* Height of the footer element */
}
#footer {
width:100%;
height:14%;
position:absolute;
padding: 0;
bottom:0;
left:0;
/* overflow: hidden;*/
}
#logo{
position: relative ;
width:15%;
height: auto;
float: left;
margin-top: 3%;
margin-left: 8%;
margin-bottom: 0%;
z-index: 90;}
#title{
float: left;
width: 75%;
font-family: 'Adamina', serif;
text-align: left;
margin-top: 7%;
margin-left: -3%;
padding-left: 5%;
font-size: 6vw;
background: #dfae0b;
z-index: -1;
}
h1
{
font-family: 'Adamina', serif;
text-align: left;
margin-top: 5%;
font-size: 350%;
}
#clr {clear:both;}
h2
{
font-family: 'Adamina', serif;
text-align: center;
margin-top: 0%;
}
p.copyright{
font-size: 50%;
font-family: 'Adamina', serif;
}
p.about {
font-family: font-family: 'Muli', sans-serif;
text-align: left;
font-size: 90%;
}
.icon {
float: left;
width: 2%;
margin: 1%
}
hr {
width: 50%;
color: #000;
border-width: 2px;
border-color: #000;
}
#about
{
margin-left: auto;
margin-right: auto;
padding: 1% 5% 5% 10%;
width: 75%;
background: white;
}
#KrisImage1
{
float: left;
margin-top: 3%;
margin-right: 2%;
margin-bottom: 3%;
width: 35%;
height: auto;
background-color: green;
}
#KrisImage2
{
float: right;
margin-top: 1%;
margin-left: 1%;
width: 25%;
height: auto;
background-color: green;
}
ul.arrowunderline{
list-style-type:none;
/*margin-top:2%;*/
padding:0;
text-align:center; /* enter "left", "right", or "center" to orient the menu accordingly */
font: bold 16px serif;
}
ul.arrowunderline li{
display:inline;
margin-right:25px; /* spacing between each menu item */
}
ul.arrowunderline li a{
position:relative;
color:black;
font-family: 'Poiret One', cursive;
font-size: 1.5vw;/*140%;*/
font-weight: bold;
padding-bottom:8px; /*spacing between each menu item and arrow underline beneath it */
text-decoration:none;
}
ul.arrowunderline li a:hover{
border-bottom:3px solid #000; /* style of arrow underline */
}
ul.arrowunderline li a:hover:after{ /* use CSS generated content to add arrow to the menu */
content:'';
width:0;
height:0;
position:absolute;
left:50%;
margin-left:-5px; /* value should match border-width below */
bottom: 0;
border-width:5px; /* value should match margin-left above */
border-style:solid;
border-color: transparent transparent #000 transparent; /* create up arrow */
}
/* GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
ul.arrowunderline li a{
font-size: 2.5vw;/*140%;*/
font-weight: bold;
}
.icon {width: 5%; }
}
/* SECTIONS */
.section {
clear: both;
padding: 0px;
margin: 0px;
}
/* COLUMN SETUP */
.col {
display: block;
float:left;
margin: 1% 0 1% 1.6%;
}
.col:first-child { margin-left: 0; }
/* GRID OF EIGHT */
.span_8_of_8 {
width: 100%;
}
.span_7_of_8 {
width: 87.3%;
}
.span_6_of_8 {
width: 74.6%;
}
.span_5_of_8 {
width: 61.9%;
}
.span_4_of_8 {
width: 49.2%;
}
.span_3_of_8 {
width: 36.5%;
}
.span_2_of_8 {
width: 23.8%;
}
.span_1_of_8 {
width: 11.1%;
}
/* GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
.col { margin: 1% 0 1% 0%; }
.span_1_of_8, .span_2_of_8, .span_3_of_8, .span_4_of_8, .span_5_of_8, .span_6_of_8, .span_7_of_8, .span_8_of_8 { width: 100%; }
}
#slideshow{
float: left;
width: 98%;
margin-left: 1%;
margin-top: 0;
margin-bottom: 2%;
z-index: -1;