html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

@font-face {
  font-family: "CuprumBold";
  src: url("/assets/fonts/cuprum/static/Cuprum-Bold.ttf");
}

.CuprumBold {
  font-family: "CuprumBold";
}

@font-face {
  font-family: "Norwester";
  src: url("/assets/fonts/norwester/static/norwester.otf");
}

.Norwester {
  font-family: "Norwester";
}

@font-face {
  font-family: "Orbitron";
  src: url("/assets/fonts/orbitron/static/Orbitron-Black.ttf");
}

.Orbitron {
  font-family: "Orbitron";
}

@font-face {
  font-family: "Railgoth";
  src: url("/assets/fonts/RailGoth/RailroadGothicCC.ttf");
}

.Railgoth {
  font-family: "Railgoth";
}

@font-face {
  font-family: "Tourney";
  src: url("/assets/fonts/Tourney/static/Tourney-Black.ttf");
}

.Tourney {
  font-family: "Tourney";
}

@font-face {
  font-family: "Tourneybold";
  src: url("/assets/fonts/Tourney/static/Tourney-Bold.ttf");
}

.Tourneybold {
  font-family: "Tourneybold";
}


body {
    background-color: darkgray;
  }

  .headercontainer{
    width: 100vw;
    position: fixed;
    top: 0;
    justify-content: center;
    height:16vh;
    z-index: 150;
  }
.header {
    /*background: #555;*/
    color: #f1f1f1;
    
    width: 100vw;
    height:16vh;
    position: fixed;
    top: 0;
    transition-duration: 0.2s;
    
  }

.headerSmall{
    margin : 2vh;
    width: 90vw;
    height:12vh;
    border-radius: 10em;
    position: fixed;
    top: 0;
}

.header-absolute-img{
  position: absolute;
  top: 0;
  width: 100%;
  height: 120%;
  z-index: 5;
  transition-duration: 0.2s;
}

.header-absolute-img-small{
  /*border-radius: 5em;*/
  top: -20%;
  height: 140%;
  transition-duration: 0.2s;
}



.header-text{
    text-align:center;
}

.headercontent{
    padding-top:2vh;
    padding-bottom: 2vh;
    border-radius: 10em;
    z-index: 10;
}

.BCBeige{
    background-color: rgb(255, 221, 184);
}

.BCBlack555{
    background-color: #555;
}

.beige{
    color:rgb(255, 221, 184);
}

.black555{
    color:#555;
}


.deg90{
  transform :rotate(90deg);
}

.deg180{
  transform :rotate(180deg);
}

.infront{
  position: relative;
  z-index: 1;
}
  
.content {
    
     padding-top: 14vh; 
  }

  
/*.headerSmall + .content {
    padding-top: 14vh;
  }*/
  

.pargraph-container{
  width: 100%;
  justify-content: center;
  height:30vh;
}

.paragraph-background-img{
  position: absolute;
  top: 0;
  width: 100%;
  height: 48vh;
}

.paragraph-img{
  width: 90vw;
  height: 25vh;
}


.blur0{
  transition-duration: 0.6s;
}
.blur1{
  filter: blur(10px);
  transition-duration: 1s;
}

.blur2{
  filter: blur(20px);
  transition-duration: 1s;
}


  /*---------------*/
  /* The sticky class is added to the header with JS when it reaches its scroll position
  .sticky {
    position: fixed;
    top: 0;
    width: 100%
  } */
  
  /* Add some top padding to the page content to prevent sudden quick movement (as the header gets a new position at the top of the page (position:fixed and top:0) 
  .sticky + .content {
    padding-top: 102px;
  } */
/*---------------*/

  a:link {
    text-decoration: none;
  }
  
  a:visited {
    text-decoration: none;
  }
  
  a:hover {
    text-decoration: underline;
  }
  
  a:active {
    text-decoration: underline;
  }

.flex{
    display: flex;
}

.flex-column{
  display: flex;
  flex-direction: column;
}

.flexwrap{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding:2%;
}

.w30{
    width: 30%;
}

.w18{
    width: 18%;
}

.vw18{
    width: 18vw;
}


.text-center{
    text-align: center;
    justify-content: center;
}

.text{
  font-size:15px;
  letter-spacing: 2px;
  font-weight: bolder;
}

.fat-text{
  font-size:20px;
  letter-spacing: 3px;
  font-weight: bolder;
}

.fat-text2{
  font-size:30px;
  letter-spacing: 3px;
  font-weight: bolder;
}

.center{
    align-items: center;
    justify-content: center;
}

.center-b{
  align-items: center;
  justify-content: space-between;
}

.center-e{
  align-items: center;
  justify-content:space-evenly;
}

.card-full{
    /*background: #555;*/
    margin:1%;
    padding:1%;
    width: 95vw;
    height:auto;
}

.card-half{
  /*background: #555;*/
  margin:1%;
  padding:1%;
  width: 43vw;
  height:auto;
}

.card-img-header{
  width: 100%;
  height: 100%;
}

.logo-img-header{
  padding-top: 5%;
  height: auto;
  width: 60%;
}


.footer{
  width: 100vw;
  height: 15vh;
  /*background-color: #555;*/
  position: relative;
  bottom : 0;
}

.paragraph-img-contact{
  padding-top: 15%;
  width: 80vw;
  height: 15vh;
}

.left-btn{
  position: absolute;
  left: 0;
  top: auto;
  width: 25vw;
}

.right-btn{
  position: absolute;
  right: 0;
  width: 25vw;
}

.img-arrow{
  width: 100%;
}

.card-img-insta{
  width: 80%;
  height: auto;
  margin: 0 10% 0 10%;
}

.dot{
  width: 5%;
  height: auto;
}

.invisible{
  visibility: hidden;
  transition-duration: 0.5s;
}

@media only screen and (min-width: 640px){

  .content {   
    padding-top: 18vh; 
  }

.pargraph-container{
  justify-content: center;
  height:40vh;
}

.paragraph-background-img{
  position: absolute;
  top: 0;
  width: 100%;
  height: 62vh;
}

.paragraph-img{
  width: 90vw;
  height: 35vh;
}

.paragraph-img-contact{
  padding-top: 5%;
  width: 90vw;
  height: 25vh;
}



}



@media only screen and (min-width: 960px){

  .header {
    /*background: #555;*/
    color: #f1f1f1;
    
    width: 100vw;
    height:18vh;
    position: fixed;
    top: 0;
    transition-duration: 0.2s;
    
  }

.headerSmall{
    margin : 2vh;
    width: 90vw;
    height:14vh;
    border-radius: 10em;
    position: fixed;
    top: 0;
}

.pargraph-container{
  justify-content: center;
  height:40vh;
}

.paragraph-background-img{
  position: absolute;
  top: 0;
  width: 100%;
  height: 66vh;
}

.paragraph-img{
  width: 75vw;
  height: 35vh;
}



.content {   
  padding-top: 22vh; 
}

.card-full{
  /*background: #555;*/
  margin:1%;
  padding:1%;
  width: 95vw;
  height:auto;
}

.card-half{
  /*background: #555;*/
  margin:1%;
  padding:1%;
  width: 43vw;
  height:auto;
}

.card-img-header{
  width: 85%;
  height: 100%;
}


.paragraph-img-contact{
  padding-top: 0%;
  width: 70vw;
  height: 30vh;
}

.card-img-insta{
  width: 60%;
  height: auto;
  margin: 0 20% 0 20%;
}

.logo-img-header{
  padding-top: 5%;
  height: auto;
  width: 45%;
}

}

@media only screen and (min-width: 1200px){
  .card-img-header{
    width: 65%;
    height: 100%;
  }

  .header {
    /*background: #555;*/
    color: #f1f1f1;
    
    width: 100vw;
    height:22vh;
    position: fixed;
    top: 0;
    transition-duration: 0.2s;
    
  }

.headerSmall{
    margin : 2vh;
    width: 75vw;
    height:18vh;
    border-radius: 10em;
    position: fixed;
    top: 0;
}

.pargraph-container{
  justify-content: center;
  height:40vh;
}

.paragraph-background-img{
  position: absolute;
  top: 0;
  width: 100%;
  height: 70vh;
}

.paragraph-img{
  width: 60vw;
  height: 35vh;
}
.content {   
  padding-top: 26vh; 
}

.footer{
  width: 100vw;
  height: 25vh;
  /*background-color: #555;*/
  position: relative;
  bottom : 0;
}

.card-img-insta{
  width: 50%;
  height: auto;
  margin: 0 25% 0 25%;
}

.logo-img-header{
  padding-top: 5%;
  height: auto;
  width: 30%;
}

}


.card-img{
  width: 100%;
  height: auto;
}

.card-img2{
  width: 130%;
  height: 130%;
}

.section-30{
  padding:1vw;
  width: 98vw;
  height:30vh;
}

.margin3{
  margin: 3%;
}



.bcflower{
  background-image: url(assets/cartographer.png);
  background-repeat: repeat;
}

.paddingtop10{
  padding-top: 10%;
}

.paddingtop5{
  padding-top: 5%;
}