/* ********************CONTAINER CLASS ********************************/

.My_container {

 }

/* ************************ ABOUT ME SECTION ************************ */

.MyPersonalData{
 background: url(../images/nature.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 700px;
  margin-top: -21px;
}

#data {
    background: none no-repeat #ffffff;
    border: 10px none;
    border-radius: 15px;
    float: left;
    left: 10%;
    padding: 1%;
    position: relative;
    top: 10%;
    width: 40%;
    display: inline-block;
}

#upm_image {
    height: 39%;
    width: 36%;
}
#etsidi_image {
    height: 53%;
    width: 59%;
}

/* *********************************************************************** */

/* ************************ MY SKILLS SECTION ************************ */

.MyProgrammingLanguages{
 background: #FFFFFF no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 1400px;
}
.programming_images{
    height: 80%;
    padding: 5px;
    position: relative;
    top: 3%;
    width: 100%;
    left: 17%;
}
#cplusplus_image {
    height: 37%;
    width: 13%;
}
#python_image {
    height: 38%;
    width: 16%;
}
#html_css_js_image {
    height: 38%;
    width: 18%;
}
#git_image {
    height: 30%;
    width: 11%;
}

/* *********************************************************************** */

/* ************************ D3.js styles ************************ */

#pieChart {
    bottom: 40%;
    position: relative;
    left: 34%;
}

/* *********************************************************************** */


/* ************************ MY EXPERIENCE SECTION ************************ */

.MyJob{
 background: #F3E2A9 no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 700px;
}

#my_data_job {
    background: none no-repeat scroll 0 0 / 80px 60px #ffffff;
    border: 10px none;
    border-radius: 15px;
    float: center;
    left: 10%;
    padding: 24px;
    position: relative;
    width: 80%;
    display: inline-block;
    top: 10%;
}

#bii_image{
  width: 40%;
  float: right;
}

#biicode_tool_images{
  width: 100%;
}

#github_image{
  width: 23%;
}

#read_the_docs_image{
  width: 10%;
}
#rpi_image{
  width: 12%;
  position: relative;
  left: 1%
}

#arduino_image{
  width: 10%;
  position: relative;
  left: 1%
}

#bii_title{

}

/* *********************************************************************** */

.browsehappy {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

body{
  font: 25px 'Montez',Helvetica,sans-serif;
}

#header_titles{
  font-size: 45px;
  padding-top: 2%;
  
}

h3{
  font-size: 30px;
}

/* Everything but the jumbotron gets side spacing for mobile first views */
.header,
.footer {
  background: #3D3D66;
  padding: 15px;
}

/* Custom page header */
.header {
  border-bottom: 1px solid #e5e5e5;
}

/* Make the masthead heading the same height as the navigation */
.header h3 {
  margin-top: 0;
  margin-bottom: 0;
  line-height: 40px;
  padding-bottom: 19px;
  padding-left: 10px;
}

.text-muted{
  color: #d7d7d7;
}

/* Custom page footer */
.footer {
  padding-top: 19px;
  color: #d7d7d7;
  border-top: 1px solid #e5e5e5;
}

.container-narrow > hr {
  margin: 30px 0;
}

/* Main marketing message and sign up button */
.jumbotron {
  text-align: center;
  border-bottom: 1px solid #e5e5e5;
}

.jumbotron .btn {
  font-size: 21px;
  padding: 14px 24px;
}

/* ******************* Responsive classes and ID's ******************* */

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
  .container {
    max-width: 730px;
  }

  /* Remove the padding we set earlier */
  .header,
  .footer {
    padding-left: 0;
    padding-right: 0;
  }

  /* Remove the bottom border on the jumbotron for visual effect */
  .jumbotron {
    border-bottom: 0;
  }

}