/* BEGIN MAIN CSS SECTION  */  

html {
    overflow-y: scroll;
}

body {
    font-family: Roboto, sans-serif; 
    font-size: 16px;
    font-weight: 300;
    line-height: 130%;
    color: #000;
    opacity: 1;
    transition: 2s opacity;
    background-color: #e7e5e5;
}

body.fade-out {
    opacity: 0;
    transition: none;
}

/* END MAIN CSS SECTION  */  



/* BEGIN TOP NAVIGATION SECTION  */

.navbar {
    margin-bottom: 0;
    background-color: #000;
    border-bottom: 2px solid #000;
    opacity: 0.9;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.navbar .navbar-brand { 
    font-family: Oswald, sans-serif;
    font-weight: 300;
    letter-spacing: 2px;
    font-size: 25px;
    color: #fff !important;
}

.navbar li a, .navbar { 
    font-family: Oswald, sans-serif;
    letter-spacing: 2px;
    color: #fff !important;
    font-weight: 300;
}

.navbar-nav li a:hover {
    color: #aaa !important;
}

.navbar-nav li.active a {
    color: #fff !important;
    background-color: #29292c !important;
}

.navbar-default .navbar-toggle {
    background-color: #fff;
    border-color: transparent;
}

/* END TOP NAVIGATION SECTION  */



/* END INTRO CSS SECTION  */ 

#main {
    transition: margin-left .5s;
    padding: 16px;
}

.container {
    padding: 0px;
}

#homescreen {
    padding-top: 70px;
}

.curvedb {
    border-radius: 10px;
    background-color: #fff; 
    margin: 0px 20px 20px 20px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#judyintro {
    padding-top: 60px;
    padding-bottom: 20px;
    padding-left: 5%;
    margin: auto;
}

h1.judyname {
    font-family: Oswald, sans-serif;
    color: #e01f39;
    font-size: 1.8em;
    font-weight: 400;
    padding-top: 0px;;
    margin-top: -10px;
}

h2 {
    font-family: Oswald, sans-serif;
    letter-spacing: 2px; 
    color: #000;
    font-weight: 400;
    font-size: 1.4em;
    margin: 0px;
    padding-bottom: 10px;
}

.padleft    {
    padding-left: 0px;
}

.viewresumelink {
     padding-bottom: 20px;
}

.topstatement {
    padding-top: 20px;
    padding-right: 20px;
}

#mainpicture {
    padding-top: 40px; 
    padding-left: 70px;
}


.btn {
    padding: 10px 20px;
    background-color: #2889b1;
    color: #fff;
    border-radius: 15;
    transition: .2s;
    border: 1px solid #6dbdc5;
}

.btn:hover, .btn:focus {
    border: 1px solid #999;
    background-color: #bde5f6;
    color: #000;
}

.btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    outline: 0;
    background-color: #f7efda;
}

/* END MAIN CSS SECTION  */  




/* BEGIN WORK SECTION  */ 

#work {
    padding-left: 5%;
}

#worktitle {
    font-family: Oswald, sans-serif;
    padding-left: 4%;
    padding-bottom: 20px;
    padding-top: 50px;
    color: #e01f39;
    font-weight: 400;
    font-size: 1.6em;
    line-height: 1;
}

.mainprojecthdr {
    font-family: Oswald, sans-serif;
    color: #2889b1;
    line-height: 1;
    font-size: 1.6em;
    font-weight: 400;
    padding-bottom: 5px;
}

.ptop30    {
    padding-top: 30px;
}

.projleftpad {
    padding-left: 30px;
    padding-top: 40px;
}

.goaltitle {
    font-weight: 400;
    font-family: Oswald, sans-serif;
}

.goal {
    padding-top: 20px;
}

.roletitle {
    font-weight: 400;
    font-family: Oswald, sans-serif;
}

.rolekit {
    padding-top: 20px;
}

.roleitems {
    padding: 10px 0px;
}

.toolkittitle {
    font-weight: 400;
    font-family: Oswald, sans-serif;
}

.toolkit {
    padding-bottom: 10px;
}

.kititems {
    padding: 10px 0px;
}

.outcometitle {
    font-weight: 400;
    font-family: Oswald, sans-serif;
}

.outcome {
    padding-bottom: 40px;
}

.projimage {
    padding-top: 40px;
    padding-bottom: 40px;
    
}

/* END WORK SECTION  */ 




/* BEGIN CONTACT SECTION  */ 

#aboutme {
    font-family: Oswald, sans-serif;
    padding-left: 4%;
    color: #e01f39;
    font-weight: 400;
    font-size: 1.6em;
    padding-bottom: 20px;
    padding-top: 50px;
}

.contactinfo    {
    color: #000;
    padding-top: 20px;
    padding-left: 5%;
}

.statement {
    color: #000;
    padding: 20px;
}

/* END CONTACT SECTION  */ 



/* BEGIN FOOTER SECTION  */

footer {
    background-color: #2d2d30;
    color: #f5f5f5;
    padding: 32px;
}

footer a {
    color: #f5f5f5;
  }

footer a:hover {
    color: #777;
    text-decoration: none;
  } 


/* END FOOTER SECTION  */