* {
    /* box-sizing: border-box; */
}
body {
    color: #777777;
    font-family: 'Arial', 'Helvetica Neue', Helvetica, sans-serif;
    font-size:14px;   
}

.my-container {
    width:99%;
    margin: 0 auto;
    padding:0px;
       
}
.my-col {
    padding:0px;  
}

.my-row {
    /* border-style:dotted; */
    /* border-color: blueviolet; */
    width:100%;
    margin:auto;
    background-color: #ffffff;
}

.my-bgColor {
    background-color: #cccccc;
    /* border-style: dotted; */
    /* border-color: red; */
}

#banner {
    /* Hard coded height diable the pull down from the hambegger  */
    /* height:80px; */
    
    padding:0px;
}

#main {
    padding:20px; 
    width:100%;
    border-style:solid;
    border-color: #cccccc;
    border-width: 20px 0px 20px 0px;

}

footer {
    position:sticky;
    bottom: 0px;
    width:99%;
    margin:auto;
    padding:0px;
    background-color: #666666;
    color:#dddddd;
    height:40px;

    border-style:solid;
    border-color:#4aaaa5;
    border-width: 4px 0 0 0;

    /* border-style: dashed; */
    /* border-color: blueviolet; */
    
}

nav {
    /* margin:0px; */
    /* padding:0px; */
    
    /* bottom: 0px; */
}

hr {
    height:2px;
    background-color: #cccccc;
    margin:0px 0px 20px 0px;
}

h1 {
    /* border-style: dashed; */
    /* border-width: 1px; */
    margin:0px;
    font-family: Georgia, Times, 'Times New Roman', serif;
    color: #4aaaa5;
    font-size: 24pt;

}

#brand {
    font-size: 24pt;
    height:75px;
    width:250px;
    background-color: #4aaaa5;
    color: #ffffff;
    font-family: Georgia, Times, 'Times New Roman', serif;
    
    margin:-10px;  /* cheating to adjust the brand */
    padding:15px 30px 0px 20px;

 /* The following lines cause the hamberger problem */   
    /* position: absolute; */
    /* left:0px; */
    /* bottom: 27px; */

    /* border-style: solid; */
    /* border-color:red; */
    
}

#copyright {
    font-size:10pt;
    position: absolute;
    bottom: 0px;
    width:100%;
    text-align: center;
    
    /* border-style: solid; */
}

#aboutme {
    margin: 0px 15px 10px 0px;
}

.figure img {
    float: left;
    margin: 20px 30px 10px 0px;
    object-fit: cover;
    width:200px;
    height:200px;
}


img.myProject {
    border: 2px solid blue;
    float: left;
    margin: 20px 30px 10px 0px;
    object-fit: cover;
    width:400px;
    height:250px;
}

.skill {
    width : 400px;
    float: left;
}