/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */
html {
  font-size: 14px;
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.container {
  /*max-width: 960px;*/
}

.card-deck .card {
  min-width: 220px;
}


.container {
  width: auto;
  /*max-width: 680px;*/
  padding: 0 15px;
}

.footer {
  background-color: #e9ecef !important;
}

.card-header h5{
    /*font-weight: bold;*/
}

body {
    /*background-color: #6c6cf71a;*/
    padding-bottom: 20px;
}

nav {
    border-bottom-style: solid;
    border-bottom-width: 5px;
    border-bottom-color: #83918f;
}

.navbar {
  margin-bottom: 20px;
}

nav small{
    color: #6c6cf7;
}
/*
#mydiv {
  width: 200px;
  height: 200px;
  display: block;
  position: relative;
}

#mydiv::after {
  content: "";
  background: url("../images/city_background.png");
  opacity: 0.5;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}*/
/*
#mydiv {
    position: relative;
    overflow: hidden;
}
#mydiv h1 {
    padding: 200px;
    position: relative;
    z-index: 2;
} 
#mydiv img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
    opacity: 0.6;
}*/
body{
       width:100%;
       height:100%;
    
}
body {
    position: relative;
    overflow: hidden;
}
/* You could use :after - it doesn't really matter */