body { }
a[name] { margin-top: -60px; padding-top: 60px; }

html, body {
  color: #CCC;
  background-color: #000000;

  font-family: 'Open Sans', sans-serif;
  font-style: normal;
  font-size: 14pt;
}

a.text-link:before { content: ' ↪ '; }
a.text-link:hover  {  }
a                  { text-decoration: underline; color: #FFFFFF; }
a:focus, a:hover{ color:rgba(255,255,255,0.5); transition: color 0.3s; }

nav.navbar { background-color: #222; }

section { }

div.prepad {
  height: 60px;
}

section.section-introduction {
  background-image: linear-gradient(
    45deg,
    rgba(0,0,0,1.0) 30%,
    rgba(80,0,0,1.0) 80%
  );
  min-height: 100vh;
}

section.cover-image {
  min-height: 100vh;
  overflow: hidden;
  background-attachment: fixed;
  background-position: center center;
  background-image:
    linear-gradient(
      160deg,
      rgba(0,0,0,0.33),
      rgba(0,0,0,0.33)
    ),
    linear-gradient(
      160deg,
      rgba(255,  0,120,0.7) 10%,
      rgba(  0, 50,255,0.5) 40%,
      rgba(  0, 50,255,0.5) 60%,
      rgba(  0,255,150,0.5) 90%
    ),
    url('../assets/coding.jpg')
  ;
  background-repeat: no-repeat;
  background-size: cover;
}

section.cover-image .panel {
  padding: 2em;
  background-color: rgba(0,0,0,0.66);
}

section.section-cv {
  text-align: justify;
  background-color: #444444;
  color: #ffffff;
}

section.section-cv h1,
section.section-cv h2,
section.section-cv h3,
section.section-cv h4,
section.section-cv h5,
section.section-cv h6 { color: #FFFFFF; }

section.section-resources {
  min-height: 100vh;
  overflow: hidden;
  background-attachment: fixed;
  background-position: center center;
  background-image: linear-gradient(160deg, rgba(0,0,0,0.33), rgba(0,0,0,0.33)), linear-gradient(160deg, rgba(255,0,120,0.7) 10%, rgba(0,50,255,0.5) 40%, rgba(0,50,255,0.5) 60%, rgba(0,255,150,0.5) 90%), url('../assets/street_network.gif');
  background-repeat: no-repeat;
  background-size: cover;
}

section.section-journey { background-image: linear-gradient(360deg,rgba(0,0,100,0.0) 0%,rgba(0,0,100,0.8) 100%); }

footer.section-footer {
  background-color: #222;
  color: #ffffff;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Trirong', serif;
  font-weight: 500;
  font-style: normal;
}

nav.navbar {
  font-family: 'Open Sans', sans-serif;
  font-weight: 500;
  font-style: normal;
}

h1, h2, h3, h4, h5, h6 { color: #FFFFFF; }

h1 small, .h1 small, h1 .small, .h1 .small,
h2 small, .h2 small, h2 .small, .h2 .small,
h3 small, .h3 small, h3 .small, .h3 .small,
h4 small, .h4 small, h4 .small, .h4 .small,
h5 small, .h5 small, h5 .small, .h5 .small,
h6 small, .h6 small, h6 .small, .h6 .small
{
  font-size: 60%;
  font-weight: 300;
  color: #AAAAAA;
}




a.active.focus,
a.active:focus,
a.focus,
a:active.focus,
a:active:focus,
a:focus,
button.active.focus,
button.active:focus,
button.focus,
button:active.focus,
button:active:focus,
button:focus,
.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: 0;
    outline-color: transparent;
    outline-width: 0;
    outline-style: none;
    box-shadow: 0 0 0 0 rgba(0,123,255,0);
}

.navbar-dark .navbar-nav .nav-link{ text-decoration: none; color:rgba(255,255,255,1.0) }
.navbar-dark .navbar-nav .nav-link:focus,.navbar-dark .navbar-nav .nav-link:hover{color:rgba(255,255,255,0.5)}
.img-thumbnail {
  padding: 0px;
  border-radius: 0;
  border: solid 1px #FFF;
}

.alert-info {
    color: #DDE;
    background-color: #000036;
    border-color: #000060;
}