@import url('https://fonts.googleapis.com/css?family=Raleway');





.PhoneNav{


    display: none;


}





.Navbar{


    color: #f7f0f0;


    background-color: black;


    background-repeat: repeat;  


    align-items: center;


    z-index: 3;


}





.NavTop {


    display: flex;


    justify-content: space-between;


    text-align: center;


    padding: 1vw;


    border-bottom: solid;


    border-width: .5vh;


    border-color: #422a14;


}





.PhoneNumber {


    width: 20vw;


    font-size: 1.25vw;


    padding: 1vw;


    text-align: left;


    display: flex;


    align-items: center;


}





.Company {


    width: 40vw;


    font-size: 1.75vw;


    display: flex;


    flex-direction: column;


    justify-content: center;


}





.Company img{


    height: 10vw;


    width: 10vw;


    padding: none;


    margin: none;


}





.Slogan{


    padding: none;


    margin: none;


    font-weight: normal;


    font-size: 2.5vw;


}





.Icons {


    width: 20vw;


    padding: none;


    margin: none;


    display: flex;


    align-items: center;


    justify-content: flex-end;


    


}





.Icons img {


    width: 2.25vw;


    height: 2.25vw;


    padding: .5vw;


}





.Sticky {


    display: flex;


    justify-content: space-between;


    align-items: center;


    background-color: black;


    background-repeat: repeat;


    box-shadow: 0px 7px 12px 0px rgba(0,0,0,0.75);


    position: sticky;


    top: 0;


    z-index: 3;


}





.Logo{


    font-size: 1vw;


    margin: 0;


}





.Logo a{


    text-decoration: none;


    color: #f7f0f0;


    padding: .75vw;


    display: block;


    transition-duration: 350ms;


}





.Logo a:hover{


    background: rgba(115, 108, 117, .5);


    box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.75);


}





.SideBySide{


    list-style-type: none;


    display: flex;


    font-size: 1vw;


    padding: 0;


    margin: 0;


}





.SideBySide li a{


    text-decoration: none;


    color: #f7f0f0;


    padding: .75vw;


    display: block;


    transition-duration: 350ms;


}





.SideBySide li a:hover{


    background: rgba(115, 108, 117, .5);


    box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.75);


}





@media screen and (max-width: 1200px){





    .NavTop {


        padding: 1.5vw;    


    }


    


    .PhoneNumber {


        width: 30vw;


        font-size: 2vw;


        padding: 1.5vw;


    }





    .Company {


        width: 30vw;


        font-size: 2.5vw;


    }





    .Icons {


        width: 30vw; 


    }





    .Icons img {


        width: 3.375vw;


        height: 3.375vw;


        padding: .75vw;


    }





    .Logo{


        font-size: 1.5vw;


        margin: 0;


    }





    .Logo a{


        padding: 1.15vw;


    }





    .SideBySide{


        font-size: 1.5vw;


    }





    .SideBySide li a{


        padding: 1.15vw;


    }


}





@media screen and (max-width: 600px){


    .NavDesktop{


        display: none;


    }





    .NavMobile{


        display: flex;


        box-shadow: 0px 7px 12px 0px rgba(0,0,0,0.75);


    }





    .PhoneNav{


        height: 10vw;


        display: flex;


        align-items: center;


        justify-content: space-between;


        padding-left: 5vw;


        padding-right: 5vw;


        padding-top: 2vw;


        padding-bottom: 2vw;


    }





    .PhoneLogo{


        height: 11vw;


        width: 11vw;


    }





    .PhoneLogo img{


        height: 11vw;


        width: 11vw;


    }





    .PhoneSlogan{


        font-size: 4vw;


        text-align: center;


        color: #f7f0f0;


    }





    .Hamburger{


        height: 10vw;


        width: 10vw;


        cursor: pointer;


        transition: 350ms;


        -webkit-user-select: none; /* Safari */        


        -moz-user-select: none; /* Firefox */


        -ms-user-select: none; /* IE10+/Edge */


        user-select: none; /* Standard */


    }





    .Hamburger.clicked{


        transform: rotate(90deg);


    }





    .DropDown{


        display: flex;


        flex-direction: column;


        position: absolute;


        left: 0;


        background-color: black;


        border-top: solid;


        border-color: #422a14;


        border-width: 1vw;


        width: 100vw;


        z-index: 4;


    }





    .TopByTop{


        list-style-type: none;


        display: flex;


        flex-direction: column;


        align-items: center;


        text-align: center;


        padding: 0;


        margin: 0;


        -webkit-user-select: none; /* Safari */        


        -moz-user-select: none; /* Firefox */


        -ms-user-select: none; /* IE10+/Edge */


        user-select: none; /* Standard */


    }





    .TopByTop li a{


        text-decoration: none;


        color: #f7f0f0;


        padding: 3vw;


        width: 100vw;


        display: block;


        font-size: 6vw;


        transition-duration: 350ms;


    }





    .Call{


        display: flex;


        align-items: center;


        justify-content: center;


        font-size: 6vw;


        background-color: #f7f0f0;


        color: black;


        width: 60vw;


        height: 15vw;


        margin-left: auto;


        margin-right: auto;


        margin-bottom: 4vw;


        cursor: pointer;


        -webkit-user-select: none; /* Safari */        


        -moz-user-select: none; /* Firefox */


        -ms-user-select: none; /* IE10+/Edge */


        user-select: none; /* Standard */


    }





    .Call img{


        height: 6vw;


        width: 6vw;


        padding-right: 2vw;


        -webkit-user-select: none; /* Safari */        


        -moz-user-select: none; /* Firefox */


        -ms-user-select: none; /* IE10+/Edge */


        user-select: none; /* Standard */


    }





    .Call a{


        text-decoration: none;


        color: black;


        width: 100%;


        height: 100%;


        display: flex;


        align-items: center;


        justify-content: center;


    }





    .PhoneImg{


        display: flex;


        width: 100vw;


        align-items: center;


        margin-left: auto;


        margin-right: auto;


        justify-content: center;


        padding-bottom: 4vw;


    }





    .PhoneImg img{


        height: 12vw;


        width: 12vw;


        padding: 2vw;


    }


}


