﻿
.mainBody {
    display: flex;
    margin-top:60px;
    flex-flow: wrap;
    position: relative;
    justify-content: center;
    align-items: center;
    font-family: Arial, sans-serif;
    font: 20px;
}

.login-container {
    margin: 60px;
    padding: 20px;
    border-radius: 8px;
    display: block;
    justify-content: center;
    align-items: center;
    box-shadow: 0 0 10px #7a3300;
    text-align: center;
    transition: all ease-in 0.5s;
}
.Sahakari-container {
    padding: 20px;
    border-radius: 8px;
    justify-content: center;
    align-items: center;
    text-align: center;
    transition: all 1s;
}
    .Sahakari-container h1 {
        color: #ff6a00;
        text-transform: uppercase;
        letter-spacing: 5px;
        font-family: Cambria;
        text-shadow: 1px 1px 1px #7a3300,
            1px 1px 2px #7a3300,
            1.2px 1.2px 1px #7a3300,
            1.2px 1.2px 2px #7a3300,
            1.5px 1.5px 1PX #7a3300,
            1.5px 1.5px 2px #7a3300,
            2px 2px #7a3300,
            2px 2px 1px #7a3300,
            2px 2px 2px #7a3300,
            1.5px 2px 2px white, 
            2px 3px 2px white, 
            3px 4px 2px white, 
            4px 5px 2px white, 

            2px 5px 2px black, 
            6px 6px 3px black,
            4px 7px 4px black, 
            5px 8px 5px black;
        font-weight: 800;
        font-style: italic;
        font-size: 40px;
        margin-bottom: 30px;
    }
   
   
.logo {
    width: 100px;
    height: 100px;
}
.Sahakarilogo {
    margin: auto;
   
    width: 300px;
}
.login-container h1 {
    color: #ff6a00;
    text-transform: uppercase;
    letter-spacing: 5px;
    font-family: Cambria;
    text-shadow: 1px 1px 1px #7a3300, 
        1px 1px 2px #7a3300,
        1.2px 1.2px 1px #7a3300, 
        1.2px 1.2px 2px #7a3300, 
        1.5px 1.5px 1PX #7a3300, 
        1.5px 1.5px 2px #7a3300, 
        2px 2px #7a3300,
        2px 2px 1px #7a3300,
        2px 2px 2px #7a3300, 
        1.5px 2px 2px white,
        2px 3px 2px white, 
        3px 4px 2px white, 
        4px 5px 1px white,
        2px 5px 2px black,
        6px 6px 3px black,
        4px 7px 4px black, 
        5px 8px 5px black;
    font-weight: 800;
    font-style: italic;
    font-size: 30px;
    margin-bottom: 30px;
}



.login-container a {
    display: block;
    margin: 10px 0;
    font-size: 10px;
    color: gray;
    text-decoration: none;
}


#btnLogin {
    padding: 10px 20px;
    font-size: 17px;
    color: #fff;
    border-radius: 7px;
    font-weight: 700;
    text-transform: uppercase;
    transition: 0.9s;
    transition-property: background;
    background: #ff6a00;
}



    #btnLogin:hover {
        background: none;
        border: 2px solid #ff6a00;
        color: #ff6a00;
        cursor: pointer;
    }
    #btnLogin:focus {
        background: none;
        border: 2px solid #ff6a00;
        color: #ff6a00;
        cursor: pointer;
    }


        @media only screen and (max-width: 720px) {
            .login-container {
        display:flex;flex-flow:wrap;
    }
}