/*Web type scale*/

/*http://type-scale.com/*/

html {
    font-size: 1em;
}

body {
    background-color: white;
    font-family: 'Libre Baskerville', serif;
    font-weight: 400;
    line-height: 1.45;
    color: #333;
}

p {
    margin-bottom: 3.3em;
    font-family: 'PT Sans', sans-serif;
}

/*ul {
    margin-top: 4em;
    color: #000;
    font-family: 'PT Sans', sans-serif;
}*/

ul.jobdesc, ul#proj-list {
    /*margin-top: 4em;*/
    color: #000;
    font-family: 'PT Sans', sans-serif;
}

li.nav-item {
    color: #000;
    font-family: 'PT Sans', sans-serif;
}

h3.projtitle {
    color: #333 !important;
}

h1 {
    font-family: 'Arimo', sans-serif;
    font-weight: bold;
    font-style: italic;
    color: #000;
    z-index: 2;
    position: relative;
}

h2 {
    color: #333333;
    font-family: 'PT Sans', sans-serif;
    text-align: center;
    padding-top: 1.2em;
    padding-bottom: 1.2em;
}

h3 {
    font-family: 'Ubuntu Condensed', sans-serif;
    /*color: #000;*/
    color:#333;
}


/*h4 {
    font-family: 'Caveat', cursive;
    margin: 1.414em 0 0.5em;
    font-weight: inherit;
    line-height: 1.2;
}*/

h5 {
    font-family: 'Arimo', sans-serif;
    font-weight: bold;
    font-style: italic;
    color: #000;
    /*padding-top: 2em;*/
    text-align: left; /*center;*/
}

h6 {
    color: #000;
    font-family: 'PT Sans', sans-serif;
    text-align: center;
    padding-top: 1.2em;
}

h4 {
    color: #000;
    font-family: 'PT Sans', sans-serif;
    text-align: center;
    font-style: italic;
}

h1 {
    margin-top: 0;
    /*font-size: 3.157em;*/
    font-size: 5em;
}

h2, h6 {
    /*font-size: 2.369em;*/
    font-size: 3em;
    font-weight: bold;
}

h3, h5 {
    font-size: 1.777em;
}

h4 {
    font-size: 1.333em;
}


/* link*/

a {
    color: #0287b4;
}

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


/*button style*/

.btn {
    font-size: .8rem;
    letter-spacing: .091em;
    line-height: 1em;
    border-radius: 0;
    padding: 1.8em 3.6em;
    color: #fff;
    background: rgba(0, 0, 255, 0.44);
}

.btn:hover {
    background-color: aqua;
    color: white;
    opacity: 0.8;
}

.btn-outline-primary {
    color: indigo;
    background-color: transparent;
    border: 1px indigo solid;
    transition: all 1s;
}

.btn-outline-primary:hover {
    color: white;
    background-color: indigo;
}



small,
.font_small {
    font-size: 0.75em;
}

html,
body {
    height: 100%;
}

.view {
    text-align: center;
    /*height: 50%;*/
    /*height: 100%;*/
    /*width: 100%;*/
    /*max-width: 100%;*/
    height: 100%;
    background: url("../img/beth-solano-313659.jpg") center center no-repeat;
    /*background-size: contain;*/
    background-size: cover;
    color: white;
}

.view h1 {
    padding-top: 2em;
}

.view h2 {
    padding-bottom: 5em;
}

.me{
    /*margin-top:1em;*/
    width: auto;
    max-width: 12em;
    height: auto;
    max-height: 12em;
    /*margin-right: 329fem;*/
    /*margin-left: 12em;*/
    background-color: white;
    /*border-radius: 10px;*/
    /*border-radius: 50%;*/
}

.gray {
    /*padding-top: 1em;*/
    padding-bottom: 3em;
    background-color: lightgray;
}

.aboutmep {
    margin-left: 1em;
}

.aboutsec {
    /*margin-bottom: 5em;*/
}

.aboutme {
    margin-bottom: 1.5em;
}



.portfolio-link img:hover {
    opacity: 0.9;

    -webkit-filter: grayscale(60%);
    filter: grayscale(60%);
  /*Safari 6.0 - 9.0 filter: grayscale(60%);*/
}


.portfolio-modal .modal-body {
    position: static;
}

.portfolio-modal .modal-dialog {
    max-width: 100%;
    max-height: 100%;
    height: 100%;
    margin: 0;
    /*    enable the overflow to set the screen no scrolling*/
    /*    overflow: hidden;*/
}

.portfolio-modal .modal-content {
    /*Change the paragraph font color*/
    color: #2f2c2c;
    padding: 0 0 2em 0;
    min-height: 100%;
    border: 0;
    border-radius: 0;
    text-align: left;
    background-clip: border-box;
    -webkit-box-shadow: none;
    box-shadow: none;
    /*Change the background-color*/
    background-color: rgba(252, 249, 249, 1);
}

.portfolio-modal .modal-content h2 {
    margin-top: 0px;
    margin-bottom: 30px;
    font-size: 2em;
}

.portfolio-modal .modal-content .item-details {
    margin: 2em 0;
}

.portfolio-modal .modal-header {
    border-bottom: none;
}

.portfolio-modal .close {
    font-size: 2em;
    padding-right: 1em;
    font-weight: 200;
}

.portfolio-modal .modal-backdrop {
    display: none;
    opacity: 0;
}

.portfolio-modal .bottom {
    padding: 3em;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1030;
    font-family: 'PT Sans', sans-serif;
}

.portfolio-modal ul.proj-list {
    margin-top: 4em;
    color: #000;
    font-family: 'PT Sans', sans-serif;
}

/*.portfolio-modal .tumblr-post {
    width: 2000px;
}

.embeddable-posts {
    position: relative;
    min-width: 270px;
    max-width: 2000px;
    margin: 0;
}
*/

.scrolled-nav {
    background-color: gray!important;
    color: white !important;
    /*font-family: 'Arimo', sans-serif;*/
    /*font-weight: bold;*/
    opacity: .85;
    z-index: 3;
}

.nav-name {
    font-family: 'Arimo', sans-serif;
    font-weight: bold;
    font-style: italic;
    /*font-family: 'Ubuntu Condensed', sans-serif;*/
   /* margin-top: 0em;
    margin-bottom: 0em;*/
}

a.nav-link{
    color: #000;
    font-family: 'PT Sans', sans-serif;
}

/*a.nav-link:hover {
    color: dodgerblue;
}
*/
/*a.active {
    color: #0287b4 !important;
    background-color: #55555a !important;
}*/


/*.snowfall-flakes {
    z-index: 1; 
    position: absolute;
}*/

.darkgreen {
    margin-top: 5em;
    padding-bottom: 3em;
    background-color: #333300;
}

h2#contact {
    color: white !important;
}

h3#contactp {
    color: white !important;
    text-align: center;
}

/*.progress {
   font-family: 'Ubuntu Condensed', sans-serif;
   font-size: 2em; 
}*/

.level-title .level-label {
    /*color: #ccd1d6;*/
    color: gray;
    /*font-size: 14px;*/
    font-size: .75em;
    font-weight: 400;
    font-family: "Lato", arial, sans-serif;
    position: absolute;
    right: 0;
    margin-top: .3em;
    margin-right: 1em;
    /*top: 0*/
}

.level-bar {
    height: 15px;
    background: #e8e8e8;
}

.level-bar-inner {
    height: 15px;
    background: #66cb8c;
}

.black {
    background-color:black;
}

p#copyright {
    color: white;
    padding-top: .5em;
    padding-bottom: .5em;
    margin-bottom: 0em;
    text-align: center;
}

p#panel_p{
    margin-left: 2em;
    margin-top: 1em;
    margin-bottom: 1em;
    font-size: 1.5em;
}

/*video {
    object-fit: cover;
}*/

/*.modal-open {
    overflow: visible;
}
*/

.card-header {
  overflow:visible;
}

.popover {
    z-index: 100;
    position: relative;
}

h6#skills {
    margin-bottom: 1em; 
}


.row {
    padding-top: 2em;
}



/* Panel CSS */



/*a.panel-heading {
    display: block;
}
.panel-primary .panel-heading[aria-expanded="true"], .panel-primary .panel-heading a:hover, .panel-primary .panel-heading a:focus, .panel-primary a.panel-heading:hover, .panel-primary a.panel-heading:focus {
    background-color: #286090;
}
.panel-danger .panel-heading[aria-expanded="true"], .panel-danger .panel-heading a:hover, .panel-danger .panel-heading a:focus, .panel-danger a.panel-heading:hover, .panel-danger a.panel-heading:focus {
    background-color: #c9302c;
}
.panel-default .panel-heading[aria-expanded="true"], .panel-default .panel-heading a:hover, .panel-default .panel-heading a:focus, .panel-default a.panel-heading:hover, .panel-default a.panel-heading:focus {
    background-color: #dcdcdc;
}
.panel-info .panel-heading[aria-expanded="true"], .panel-info .panel-heading a:hover, .panel-info .panel-heading a:focus, .panel-info a.panel-heading:hover, .panel-info a.panel-heading:focus {
    background-color: #31b0d5;
}
.panel-success .panel-heading[aria-expanded="true"], .panel-success .panel-heading a:hover, .panel-success .panel-heading a:focus, .panel-success a.panel-heading:hover, .panel-success a.panel-heading:focus {
    background-color: #449d44;
}
.panel-warning .panel-heading[aria-expanded="true"], .panel-warning .panel-heading a:hover, .panel-warning .panel-heading a:focus, .panel-warning a.panel-heading:hover, .panel-warning a.panel-heading:focus {
    background-color: #ec971f;
}
.panel-group .panel, .panel-group .panel-heading {
    border: none !important;
}
.panel-group .panel-body {
    border: 1px solid #ddd !important;
    border-width: 0 1px 1px 1px !important;
}
.panel-group .panel-heading a, .panel-group a.panel-heading {
    outline: 0;
}
.panel-group .panel-heading a:hover, .panel-group .panel-heading a:focus, .panel-group a.panel-heading:hover, .panel-group a.panel-heading:focus {
    text-decoration: none;
}
.panel-group .panel-heading .icon-indicator {
    margin-right: 10px;
}
.panel-group .panel-heading .icon-indicator:before {
    content: "\e114";
}
.panel-group .panel-heading.collapsed .icon-indicator:before {
    content: "\e080";
}*/