/* Stylesheet by Alex Machin-Mayes, 2018 */
/***** CUSTOM FONTS FROM COMPUTER START*****/
@font-face {
    font-family:Copperplate Gothic Light;
      src: url("../assets/fonts/alex_fonts/coprgtl.ttf") format('truetype');
}

@font-face {
    font-family:Copperplate Gothic Bold;
      src: url("../assets/fonts/alex_fonts/coprgtb.ttf") format('truetype');
}

@font-face {
    font-family:Goudy Old Style;
      src: url("../assets/fonts/alex_fonts/goudos.ttf") format('truetype');
}
@font-face {
    font-family:Goudy Old Style Bold;
      src: url("../assets/fonts/alex_fonts/goudosb.ttf") format('truetype');
}

@font-face {
    font-family:Goudy Old Style Italic;
      src: url("../assets/fonts/alex_fonts/goudosi.ttf") format('truetype');
}

@font-face {
    font-family:Candara;
      src: url("../assets/fonts/alex_fonts/candara.ttf") format('opentype');
}

@font-face {
    font-family:Candara Bold;
      src: url("../assets/fonts/alex_fonts/candarab.ttf") format('opentype');
}

@font-face {
    font-family:Candara Italic;
      src: url("../assets/fonts/alex_fonts/candarai.ttf") format('opentype');
}

@font-face {
    font-family:Candara Bold Italic;
      src: url("../assets/fonts/alex_fonts/candaraz.ttf") format('opentype');
}


@font-face {
    font-family:Perpetua;
      src: url("../assets/fonts/alex_fonts/per.ttf") format('truetype');
}

@font-face {
    font-family:Perpetua Bold;
      src: url("../assets/fonts/alex_fonts/perb.ttf") format('truetype');
}


/***** CUSTOM FONTS FROM COMPUTER END*****/







/***** LOGO START*****/

.jumbotron {
  position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
  background-image: url("../assets/images/dem_header.jpg");
  background-position: center center;
  background-size: cover;
  height: 150px;
  padding: 1%;
  z-index: 20;
  box-shadow: 3px 3px 7px 0px #f2f2f2;
}


.logo{
  position: absolute;
  bottom: 20px;
  left: 30px;
  width: 80px;
                /***** Makes .png render much crisper!  *****/
  image-rendering: -moz-crisp-edges;
  image-rendering: -o-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
 
}


.brandtext h1{
  color: #50964c;
  font-style: normal;
  font-size: 46px;
  font-family: "Goudy Old Style Bold", "Palatino Linotype", "Book Antiqua", Palatino, serif;
  position: absolute;
  bottom: 50px;
  left: 113px;
   text-shadow: -1px 1.5px 1px #333333;
  background-color: transparent;
  text-decoration: none;
}



.brandtext p{
  color: #303895;
  font-size: 20px;
  font-family: "Copperplate Gothic Bold", "Palatino Linotype", "Book Antiqua", Palatino, serif;
  position: absolute;
  bottom: 20px;
  left: 115px;
  /*text-shadow: 1px 1px 1px black;*/
  background-color: transparent;
  text-decoration: none;
}

/***** LOGO END*****/








/*** NAVIGATION BAR START ***/

.header {
  padding: 20px 50px;
  position: absolute;
  top: 150px;
  left: 0px;
  right: 30px;
  height: 50px;
  
  padding: 1%;
  z-index: 10;
  text-shadow: 2px 2px 5px #909090;
}


.header a {
  font-family: Candara Bold, Tahoma, Geneva, sans-serif;
  background-color: none;
  float: left;
  color: #4b5059;
  text-align: center;
  padding: 12px;
  text-decoration: none;
  font-size: 20px; 
  line-height: 25px;
}


.header a:hover {
  color: #303895;
  font-size: 18px;
  border: 1px solid #c1be97;
  background-color: #f9f8e8;
  border-radius: 4px;
  font-weight: normal;
}


.header-right {
  float: right;
  
  z-index: 10;
}


/*** NAVIGATION BAR END ***/









/*** PORTFOLIO MAIN PAGE START ***/


/* Portfolio Square Locations */
.portfolio-thumbnail {
  padding-top: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  border-color: #606060;
  background-color: #606060; 
  border-width: 1px;
  width: 100%;
  box-shadow: 6px 6px 12px #282828;
}


/* Portfolio Square Headings */
.port-labels h4 { 
  color: #353535;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  font-style: normal;
  letter-spacing: .5px;
  text-align: center;
  font-family: Candara, Tahoma, Geneva, sans-serif;
  text-shadow: 2px 2px 5px #909090;
}


/* Portfolio Square Headings - Hover */
.port-labels h4:hover { 
  color: #303895;
  text-align: center;
  font-size: 25px;
  font-weight: bold;
  font-style: normal;
  letter-spacing: .5px;
  text-align: center;
  font-family: Candara, Tahoma, Geneva, sans-serif;
}



/* Portfolio Image Within Square */
.portimage {
  
  padding-top: 4px;
  padding-left: 4px;
  padding-right: 4px;
  padding-bottom: 4px;
  background-color: #fff;
  border-radius: 4px;
  width: 100%;
}

/* Portfolio Image Within Square - Hover */
.portfolio-thumbnail:hover {
  border-width: 4px;
  border-color: #263ea7;
}


/*** PORTFOLIO MAIN PAGE END ***/









/*** GENERAL START ***/


    /* Main Body (home page AND all other pages) */

body {
  background-color: #cccccc;
  padding-top: 15px;
  margin-bottom: 120px;
  z-index: 2; 
}

    /* page headers */
h1 {
  font-size: 42px;
  color: #303895;
  text-shadow: 1px 2px 5px #585858;
  font-family: "Goudy Old Style", "Palatino Linotype", "Book Antiqua", Palatino, serif;
}

    /* name title - resume */
h2 {
  font-size: 42px;
  color: #353535;
  font-weight: normal;
  font-family: "Goudy Old Style", "Palatino Linotype", "Book Antiqua", Palatino, serif;
}

    /* red-headers - resume */
h3 {
  font-size: 28px;
  color: #b70000;
  font-family: Candara, Tahoma, Geneva, sans-serif;
  
}

    /* dark brown headers - resume */
h4{
  font-size: 20px;
  color: #353535;
  font-family: Candara Bold, Tahoma, Geneva, sans-serif;
}

    /* bold dark brown sub-headers - resume */
h5{
  font-size: 18px;
  color: #353535;
  font-style: italic;
  font-family: Candara Bold, Tahoma, Geneva, sans-serif;
}


h6{
  font-size: 18px;
  color: #353535;
  font-family: Candara, Tahoma, Geneva, sans-serif;
}

h7{
  font-size: 16px;
    line-height: 12px;
  color: #353535;
  font-family: Candara, Tahoma, Geneva, sans-serif;
}

p {
  font-size: 20px;
  color: #353535;
  font-family: Candara, Tahoma, Geneva, sans-serif;
}

li {
  font-size: 18px;
  color: #353535;
  font-family: Candara, Tahoma, Geneva, sans-serif;
}


a {
  color: #fff;   
}


a:hover {
  color: #74b4e2;
  text-decoration: none;
}


hr {
  border-color: #353535;
  border-width: 1px;
  box-shadow: -1px 1px 2px #606060;
}


/*** GENERAL END ***/









/*** FOOTER START ***/

.footer {
  background-image: url("../assets/images/dem_header.jpg");
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-position: center center;
  background-size: cover;
  height:30px;
  padding: 7px;
  box-shadow: 3px 3px 9px 3px #999999;
}


.footer p {
  float: right;
  color: #6aaae8;
  font-size: 14px;
  position: relative;
  font-family: Candara, Tahoma, Geneva, sans-serif;
  font-weight: normal;
  padding: 15px;
  bottom: 10px;
}


.footer i{
color:#4b5059;
float:right;
position:relative;
 font-size: 18px;
 width: 20px;
 height: 30px;
 bottom: -7px;
 padding: 10px 13px;
 top:-10px;
}


.footer i:hover{
  text-align: center;
  padding: 8px;
  border-radius: 5px;
  width: 36px;
  height: 36px;
  border: 1px solid #c1be97;
  background-color: #f9f8e8;
  color: #303895;
  bottom: 10px;
  z-index: 10;

}

.copyright-fluid {
  color: #303895;
  float: left;
  font-size: 13px;
  font-family: Candara Bold, Tahoma, Geneva, sans-serif;
  position: absolute;
  bottom: 4px;
  left: 10px;
}


.soc-right {
  float: right;
  z-index: 10;
}
/*** FOOTER END ***/










/***** RESUME ALL START *****/


    /*** COLUMNS START ***/

.column {
    float: left;
    font-weight: bold; 
    padding: 0px;
    height: 75px;
}

.left {
  width: 30%;
}

.right {
  width: 70%;
}


    /*** Clear floats after the columns ***/
.row:after {
    content: "";
    display: table;
    clear: both;
}

    /*** COLUMNS END ***/





/*** RES BODY - ACTING STRANGELY ***/
.res-body{
    
    float: center;
    margin-top: 0%;
    margin-left: 10%;
    margin-right: 10%;
    margin-bottom: 10%;
}


/***** RESUME ALL END *****/







/*** MISC START ***/




a.notwhitetext:link {
  color: #0000ff;
  text-shadow: -1.5px 1.5px 3px #9b9b9b;
}


a.notwhitetext:visited {
  color:#0000ff;
    text-shadow: -1.5px 1.5px 3px #9b9b9b;
}


a.notwhitetext:hover {
  color:#b70000;
}


.about{
  float: center;
}


.welcome p{
  color: #4b5059;
  font-family: Candara, Tahoma, Geneva, sans-serif;
  font-size: 22px;
  float: center;
  
}


/*** MISC END ***/


/* End Map Page Display */












/* D3 Lab */



/*
.gratLines {
    
    stroke: #555555;
    stroke-width: 0px;
    stroke-opacity: .1;
    
}
*/


.gratBackground {
    fill: #989898;
    shape-rendering: crispEdges;
    
}


.map {
    stroke: rgba(68,67,54,.2);
    stroke-width: .5px;
    stroke-linecap: round;
    margin: 10px 0 0 20px;
    border: 3px solid #d2d2d2;
    box-shadow: 2px 5px 5px #575757;
    border-radius: 6px;
    shape-rendering: crispEdges;
}

.countries {
    fill: #bdbdbd;
    stroke: #969696;
    stroke-width: .5px;
    stroke-linecap: round;
    shape-rendering: crispEdges;
}

.regions {
    fill: #282828;
    stroke: #353535;
    stroke-width: 0.5px;
    stroke-linecap: round;
}


/*
.numbers {
    color: #353535;
    font-family: sans-serif;
    font-weight: normal;
}
*/


.chart {
    float: right;
    background-color: #bdbdbd;
    margin: 10px 20px 20px 0px; 
    border: 3px solid #d2d2d2;
    shape-rendering: crispEdges;
    border-radius: 6px;
    box-shadow: 2px 5px 5px #575757;
}

.chartTitle {
    font-family: Candara, Tahoma, Geneva, sans-serif;
    font-size: 1.6em;
    font-weight: bold;
    fill: #353535;
    text-shadow: 4px 4px 6px #676767;
}

.chartBackground {
    fill: #989898;
    
}

.chartFrame {
    fill: none;
    stroke: #999;
    stroke-width: 0px;
    shape-rendering: crispEdges;   
}



.axis path,
.axis line {
    fill: none;
    stroke: #353535;
    stroke-width: 2px;
    shape-rendering: crispEdges;
}

.axis text {
    
    font-family: Candara, Tahoma, Geneva, sans-serif;
    font-size: .9em;
    stroke: #353535;
    font-style: italic;
    font-weight: normal;
    shape-rendering: crispEdges;
}






.dropdown {
    position: absolute;
    color: #353535;
    top: 500px;
    left: 40px;
    z-index: 10;
    font-family: Candara, Tahoma, Geneva, sans-serif;
    font-size: 1.2em;
    font-weight: bold;
    padding: 10px;
    background-color: rgba(255,255,255,.8);
    box-shadow: 2px 5px 5px #575757;
    border-radius: 4px;
    border: 1.5px solid #353535;
}

/*
option {
    font-weight: normal;
}
*/


.infolabel {
    z-index: 15;
    position: absolute;
    height: 100px;
    min-width: 100px;
    color: #252525;
    background-color: rgba(255,255,255,.92);
    border-radius: 4px;
    border: solid thin #858585;
    padding: 5px 10px;
    top: 5px;
    font-family: Candara, Tahoma, Geneva, sans-serif;
    font-size: 1.1em;
    
    
}


/*
.infolabel lablename {
    color: aqua;
    margin: 0 50px 0 0;
    padding: 0;
    display: inline-block;
    line-height: 1em;
}
*/




/* Portfolio Square Location - Map */

/*
.map-portfolio-thumbnail {
  padding-top: 10px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  border-color: #606060;
  background-color: #606060; 
  border-width: 1px;
  border-radius: 3px;
  width: 50%;
  box-shadow: 6px 6px 12px #282828;
}
*/