/* Sections of Layout
-------------------------------------- */
/* Layout is stacked vertically by default (for narrower viewports), so give some breathing room between the sections. */

html{
    font-size: 12px;
}



/* Now let's apply grid for wider viewports. */
@media screen and (max-width: 600px) {
    html{
    font-size: 10px;
}
}

/* Generic styles for demo purposes
 background-image: url('../img/london.jpg');
 background-color: rgb(240, 255, 240);
-------------------------------------- */
body { 

    font-family: Verdana,  sans-serif;
    background-color: white;
    margin: 0px;

}
#container {
    margin-top: 1rem;
     position: relative;
    display: flex;
    flex-direction: column;
     min-height: 100vh;
    background-color: white;
    margin: auto;
     width: 80rem;
    
    padding-bottom: 3rem;
   

}

#container > * {
    background-color: whiter;
    padding: 1rem;
}


#header {
    height: 5rem;
    background-color: white;
    display: flex;
    align-items: center;

}

#title{
    font-family: komikaFont;
    font-size: 3rem;
    color: red;
    letter-spacing: 0.5rem;
    margin-left: 3rem;
    
   
}

.title2{
    font-family: komikaFont;
    font-size: 1.5rem;
    color: red;
    margin: 2rem;
  
}
.menu{
    display: flex;
   justify-content: flex-end;
    background-color: forestgreen;
    height: 1rem;

}
.menu >a{
    
    
}

.linksMenu{
   
  appearance: button;
  padding-left: 0.5rem;
   padding-right: 0.5rem;
    text-decoration: none;
    color: white;
    font-weight: 200;
    height: 100%;
    font-size: 1.2rem;
  
}



a.linksMenu:hover {

    color: yellow;
     font-weight: 400;
     
}



.menu2{
    display: flex;
  
    background-color: #dcdcdc;
    height: 2rem;
    width: 100%;

}
.menu2 >a{
   font-size: 1.5em;
     color: black;
     font-weight: 400;
     padding-left: 1em;
}

.section {
    display: flex;
    flex-flow: row;
    padding: 1rem;
    background-color: #f1f1f1;
    width: 100%;
  
}
.footer {
    height: 5rem;
    background-color: #cfcfc4;
    display: flex;
    align-items: center;

}

.reg-box {
    display: flex;
    flex-flow: column;

    width: 30rem;
    margin: 0 auto;
    padding: 10px;

    background-color: blanchedalmond;
    margin-bottom: 2rem;


}
.input-bx{
    background-color:white;
    display:block;
}

.button {
    background-color: #555555; /* Green */
    border: none;
    color: white;
    padding: 5px 2em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 1rem;
    margin: 4px 2px;
    cursor: pointer;
}

.foot-cont {
     background-color: #c0c0c0;
    height: 2rem;
    color: white;
    position: absolute;
    bottom: 0;
  left: 0;
  right: 0;
   
}



.idx-img {
    display: -webkit-flex;
    display: flex;
    background-color: floralwhite;
    flex-direction: column;

    width: 100%;
    height: 30rem;


}





@font-face {
    font-family: komikaFont;
    src: url(font/KOMIKAX_.ttf);
}