body{font-family: 'Saira Extra Condensed',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol','Noto Color Emoji'; background-color: #f4f1f1;} /**/
.spacer{height:90px;}

.animate {
    -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        transition: all 0.3s ease;
}
a:hover{text-decoration: none;}

/*-------------------------------
Navbar
-------------------------------*/

.navbar {min-height: 90px; text-transform: uppercase; box-shadow: 0 5px 20px rgba(0,0,0,.08);}
.navbar-collapse {flex-grow: 0;}
.logo {width: auto; height: 60px;}
.navbar .navbar-nav .nav-item >a:hover {color: #00bcbf;}
.navbar-light .navbar-nav .active>.nav-link {color: #6bdc03;}

nav.smaller{min-height: 35px;}
nav.smaller .navbar-brand > .logo {width: auto; height: 40px;}


/*-------------------------------
Cover
-------------------------------*/
.row{height: 100%;}
#cover{padding:100px 30px 100px 30px; text-align: center; background: url("img/background1.jpg") no-repeat center center; height: 100vh;
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  -webkit-box-align: center;



}
#imgp {
  vertical-align: center;
  margin: auto;
  width: 75%;
  max-width: 300px;
  height: auto;
  margin: 15px;
  border: 7px solid #ddd;
    /*border: .3rem solid rgba(56,0,0,.9);*/
}
h1{margin-bottom: 0; text-transform: uppercase;}
.location{margin: 30px;}
.fab{
    color: #fff;
    font-size: 24px;
    border: 2px solid #e9e9e9;
    width: 57px;
    height: 57px;
    line-height: 55px;
    text-align: center;
    margin-right: 5px;
    border-radius: 40px;
    color:#057080; border: 2px solid #057080;}

.fab:hover {color:#fff; background-color: #057080;}

.card {
    border: 0;
display: inline-block;
  padding: 2rem 4rem 2rem 4rem;
  border-radius: 1.5rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  max-width: 800px;
  margin: auto;
  text-align: center;
}

.bottomleft:before{
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  border-left: 30px solid #057080;
  border-right: 30px solid transparent;
  border-top: 30px solid transparent;
  border-bottom: 30px solid #057080;
  border-bottom-left-radius: 1.5rem;
}

.bottomleft:after{
  font-family:  'Material Icons';
  content:"\e0ba";
  position: absolute;
  bottom: 10px;
  left: 10px;
  color: #fff;
}

.topleft:before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  border-left: 30px solid #057080;
  border-right: 30px solid transparent;
  border-top: 30px solid #057080;
  border-bottom: 30px solid  transparent;
  border-top-left-radius: 1.5rem;
}

.topleft:after{
  font-family:  'Material Icons';
  content:"\e0ba";
  position: absolute;
  top: 8px;
  left: 10px;
  color: #fff;
}

.topright:before{
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border-left: 30px solid transparent;
  border-right: 30px solid #057080;
  border-top: 30px solid #057080;
  border-bottom: 30px solid  transparent;
  border-top-right-radius: 1.5rem;
}

.topright:after{
  font-family:  'Material Icons';
  content:"\e0ba";
  position: absolute;
  top: 8px;
  right: 10px;
  color: #fff;
}



.bottomright:before{
  margin: 0;
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  border-left: 30px solid transparent;
  border-right: 30px solid #057080;
  border-top: 30px solid transparent;
  border-bottom: 30px solid #057080;
  border-bottom-right-radius: 1.5rem;
}

.bottomright:after{
  font-family: 'Material Icons';
  content:"\e0ba";
  position: absolute;
  bottom: 10px;
  right: 10px;
  color: #fff;
  font-weight: 300;
}

.title {margin-top: 0;
  color: grey;
  font-size: 1.5rem;
}
.card{animation: fadeIn 3s;}
.material-icons{color: #057080;
    vertical-align:middle;
    line-height: inherit;}
ul{
    list-style: none;
    padding-left: 0px;}
.contact{
    margin-left: 1em;}
a:hover{color: #057080;}
button {
  border: none;
  outline: 0;
  display: inline-block;
  padding: 8px;
  color: white;
  background-color: #000;
  text-align: center;
  cursor: pointer;
  width: 75%;
  font-size: 18px;
  border-radius: 0.6rem;background: rgb(5,74,128);
background: -moz-linear-gradient(90deg, rgba(5,74,128,1) 0%, rgba(10,16,182,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(5,74,128,1) 0%, rgba(10,16,182,1) 100%);
background: linear-gradient(90deg, rgba(5,74,128,1) 0%, rgba(10,16,182,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#054a80",endColorstr="#0a10b6",GradientType=1);
}

a {
  text-decoration: none;
  font-size: 1rem;
  color: black;
}

button:hover, a:hover {
  opacity: 0.7;
}
/*-------------------------------
Tablet
-------------------------------*/
@media (max-width: 1024px){
  .card{margin-top: 0; margin-left: auto; margin-right: auto; margin-bottom: auto;}
  #cover {padding: 25px 50px 25px 50px;}
  h1{font-size: 1.3rem;}
  .title{font-size: 1rem;}
  .fab{font-size: 1rem; width: 28.5px; height: 28.5px;
  line-height: 24px;}
  a{font-size: 1rem;}
  .contact{font-size: 0.6rem;}
  .contact a{font-size: 0.6rem;}
}
