@import url('https://fonts.googleapis.com/css2?family=Montserrat&family=Open+Sans:ital@0;1&display=swap');
/*@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css');*/

body {
font-family: 'Montserrat', sans-serif;
  min-height: 75rem;
  padding-top: 0rem;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px; /* Margin bottom by footer height */
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 60px; /* Set the fixed height of the footer here */
  line-height: 60px; /* Vertically center the text there */
  background-color: #f5f5f5;
}

#contact {
margin:0 !important;
}

.hr {
border-bottom: 1px solid #a1a2a4;
}
/* images */
.card img, img {
width:100%;
height: auto;
}

/* headings */
h1, h2, h3, h4, h5, h6 {
font-family: 'Open Sans', sans-serif;
}

h1 {
text-transform: uppercase;
}

h2, h3, h4 {
font-weight: 600;
}

/* type styles */
b, strong {
font-weight: 700;
}

/* Links */

/* unvisited link */
a {
  color: #00bddf;

}

/* visited link */
a:visited {
  color: #00bddf;
}

/* mouse over link */
a:hover {
  color: #00bddf;
text-decoration:none;
}

/* selected link */
a:active {
  color: #00bddf;
}

footer a {
colour: white;
}

.navbar-brand a:hover {
text-decoration:none;
}
/*.  Navbar. */
.navbar-brand {
text-transform:uppercase;
}

.navbar-brand span {
color: #df9200;
}
/*.navbar-brand img {
height: 100px;
width: auto;
}*/

/* Carousel */
.carousel-item {
  height: 100vh;
  min-height: 350px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

}

/* Centered on homepage page */
.centered {
  position:absolute;
  top: 50%;
  left: 20%;
  right: 20%;
  z-index: 3;
  text-align:center;
color: white;
  }

.centered p {
font-size: 24px;
}

.centered .btn {
margin: 10px;
}


/* Banners */
.jumbotron {
margin:0;
border-radius :0;
background: #a1a2a4;
}

/*parallax - behind contacts */
.parallax {
background-image: linear-gradient(to bottom, rgba(223,146,0,0.7), rgba(223,146,0, 0.7)),
url("images/3.jpg");



background-size: cover;
padding: 150px 20px;
/*height:100%;
min-height: 275px;*/
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}

/* Cards */

.card {
border:0;
border-radius: 5px;
}

.circle {
    width: auto;
    height: auto;
    border-radius: 25%;
    text-align: center;
    padding: 10px;
    font-size: 24px;
    border: 2px solid #a1a2a4;
    color:white;
    background:#231f20;
    position: absolute;
    top: -30px;
    right: 10px;
    transform: translateX(-10%)
}
        
.card-body {
  position:relative;
  padding-top: 30px;
}

.card-header, .card-footer {
background: transparent;
border: none;
}

/*Buttons*/

.btn {

    padding: 14px 24px;
    border: 1px solid;
    border-radius: 5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.btn:focus, .btn:active:focus, .btn.active:focus {
    outline: 0 none;
}

.btn-primary {
    background: #ffffff;
    color: #00bddf !important;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
    background: #00bddf;
    color: #ffffff !important;
border: 1px solid #00bddf !important;
}

.btn-primary:active, .btn-primary.active {
    background: #00bddf;
    box-shadow: none;
}


/* Video */
.video-container {
  position: relative;
  overflow: hidden;
  width: 100%;

}

.video-container::after {
  display: block;
  content: "";
  padding-top: 56.25%;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Video mp4 background*/
* { box-siz ing: border-box; }
video {
background: #ffffff;
position: fixed;
top: 0; right: 0; bottom: 0; left: 0;
z-index: -99;
}
video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
}
@media (min-aspect-ratio: 16/9) {
video { height: 300%; top: -100%; }
}
@media (max-aspect-ratio: 16/9) {
video { width: 300%; left: -100%; }
}

/* Email Forms - remove if no form */
form #website, form #ip { display:none; }

 /* Small devices (portrait tablets and large phones, 320px and smaller (down) */
    @media only screen and (max-width: 320px) {

      h1 {
          font-size:  24px !important;
        }
        h2 {
          font-size:  22px;
        }
        
        h3 {
          font-size:  20px;
        }
 
        h4 {
          font-size: 18px;
        }
      
        p {
          font-size:  14px;
        }
        ul {
          font-size: 14px;
        }


    }
     /* Extra small devices (phones, 320px and up) */
     @media only screen and (min-width: 320px) {

    } 


    /* Small devices (portrait tablets and large phones, 600px and up) */
    @media only screen and (min-width: 600px) {
        h1 {
          font-size:  48px;
        }
        h2 {
          font-size:  36px;
        }
        
        h3 {
          font-size:  24px;
        }
        h4 {
          font-size: 20px;
        }
        p {
          font-size:  16px;
        }
        ul {
          font-size: 16px;
        }
    } 

  /* Medium devices (landscape tablets, 767px and down) */
    @media only screen and (max-width: 767px) {

.navbar-brand {
font-size: 16px;
}

.centered {
  position:absolute;
  top: 30%;
  left: 20%;
  right: 20%;
  z-index: 3;
  text-align:center;
  }

    header {
    min-height: 20px;
    }
    }
    /* Medium devices (landscape tablets, 768px and up) */
    @media only screen and (min-width: 768px) {
    } 
    
    /* Large devices (laptops/desktops, 992px and up) */
    @media only screen and (min-width: 992px) {  
    } 
    
    /* Extra large devices (large laptops and desktops, 1200px and up) */
    @media only screen and (min-width: 1200px) {

        h1 {
          font-size:  54px;
        }
        h2 {
          font-size:  48px;
        }
        
        h3 {
          font-size:  36px;
        }
 
        h4 {
          font-size:  24px;
        }
      
        p {
          font-size:  18px;
        }
        ul {
          font-size:  18px;
        }

 header {
    min-height: 20px;
    }


 
    }