@font-face {
    font-family: 'Aileron';
    src: url(fonts/Aileron-UltraLight.otf) format("opentype") }



.header {
    padding: 10px 16px;
    /*background: #333;*/
    background: rgb(255,255,255);
    height: 100px;
    z-index: 2;
    opacity: 1;
}

.header-text {
    /*color: rgb(255,255,255);*/
    color: #333;
    text-align: center;
    font-family:'Aileron';
    font-size:49pt; 
    top: 25px;
}

.header-img {
    max-height: 80px;
}

.sticky {
    position: fixed;
    top: 0%;
    width: 100%;
}

.sticky + .content {
    padding-top: 102px;
}

.menu-img {
    opacity: 1;
    filter:alpha(opacity=40);
    display: block;
    width: 100%;
    height: auto;
    transition: .5s ease;
    backface-visibility: hidden;
}

.img-container:hover img {
    opacity: 0.5;
    filter:alpha(opacity=100);
}

.img-container:hover .middle-container {
    opacity: 1;
}


.container-fluid {
    margin-left: 0;
    margin-right: 0;
    position: relative;
}

.col-12 {
    /*padding-bottom: 4px; white lines between rows */ 
    padding-left: 0;
    padding-right: 0;
}

.col-lg-4 {
    padding-left: 0;
    padding-right: 0;
}

.middle-container {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
     top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
}

.middle-text {
    background-color: rgba(29.8, 29.8, 29.8, 0.5);
    color: white;
    border-radius: 2%;
    font-size: 2.8vw;
    padding: 12px 24px;
}

body{
    width: 100%;
    height: 100%; 
    background-color: rgba(166, 205, 206, 0.555);
}
  
.myImg {
    width: 180px;
    height: 200px;;
    border: 1px solid black;
    border-radius: 25px;
    float:left; 
    margin:30px;
}

.myImg:hover {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}

.wrapper{
    overflow:hidden; /*make sure the wrapper has no dimension*/
    width: 750px;
    margin: 0 auto;
    min-width: 250px;
}

.modal-dialog {
    top: 20%;
    transform: translateY(-10%);
    right: 13%;
}

.modal-image {
    width: 400px;
}