::selection { background: #e0e0e0; color: #b3b3b3; }
::-moz-selection { background: #e0e0e0; color: #b3b3b3; }

html { height: 100%; }
body { overflow-x: hidden; color: #505050; min-height: 100%;  }
p { font-size: 20px; }
p.small { font-size: 16px; }

a, a:hover, a:focus, a:active, a.active { outline: 0; }
a, a:active, a:visited { text-decoration: none; color: #3b3b3b; font-weight: bold; }
a:hover {  text-decoration: none; color: #7b7b7b; }
.img-centered { margin: 0 auto; }
header { text-align: center; color: #080808; }
header .container { padding: 80px 0px 20px 0px; }
header img { display: block; margin: 0 auto 20px; }
header .intro-text .name { display: block; text-transform: uppercase; }

h1 { font: bold 20px/18px 'Playfair Display', Georgia, serif; letter-spacing: .06em;  text-transform: uppercase; text-align: center; }
h1 .small { font: bold 20px/18px 'Playfair Display', Georgia, serif; letter-spacing: .06em; display: block; color: #3e3e3e; }
h1 em { display: block; font-style: normal; color: #3e3e3e; }
.profile-img { width: 100%; }

.subtitle { display: block; font: italic 8.5pt 'Playfair Display', serif; color: #9e9e9e; padding-bottom: 5px; }
.subtitle em { color: #b0b0b0; font-style: normal; }

.salute { display: block; font-size: 10pt; }
.salute em { font: italic 10pt 'Playfair Display', serif; color: #7b7b7b; }
h4 { text-transform: uppercase; }

.contact { display: block; padding: 5px; font-size: 10pt; }

.title { padding: 10px 0px; font-size: 14pt; text-transform: uppercase; text-align: center; display: block; }
h2 .small { font-size: 14px; letter-spacing: .06em; display: block; }
h2 em { font-size: 16px; letter-spacing: .06em; display: block; }

h3 { padding-bottom: 5px; font: 20px 'Playfair Display', serif; }

.navbar { text-transform: uppercase; }
.navbar a:focus { outline: 0; }
.navbar .navbar-nav { letter-spacing: 1px; }
.navbar .navbar-nav li a:focus { outline: 0; }
.navbar-default, .navbar-inverse { border: 0; }

address { font-size: 8pt; color: #bfbfbf; }

@media(min-width: 768px) {
    header .container { padding: 120px 0px 20px 0; }
    header .intro-text .name { font-size: 4.75em; }
    .navbar-fixed-top { padding: 20px 0; -webkit-transition: padding .3s; -moz-transition: padding .3s; transition: padding .3s; }
    .navbar-fixed-top .navbar-brand { font-size: 2em; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s; }
    .navbar-fixed-top.navbar-shrink { padding: 10px 0; }
    .navbar-fixed-top.navbar-shrink .navbar-brand { font-size: 1.5em; }
}

.content { text-align: left; }
.date { background: #000; color: #fff; padding: 3px; }

.books { height: 300px; border: 1px solid rgba(0, 0, 0, 0.5); }
.books-modal { width: 80%; border: 1px solid rgba(0, 0, 0, 0.5); }

#portfolio .portfolio-item { right: 0; margin: 0 0 15px; }
#portfolio .portfolio-item .portfolio-link { display: block; position: relative; margin: 0 auto; max-width: 400px; }
#portfolio .portfolio-item .portfolio-link .caption { position: absolute; width: 100%; height: 100%; opacity: 0; background: rgba(24,188,156,.9); -webkit-transition: all ease .5s; -moz-transition: all ease .5s; transition: all ease .5s; }
#portfolio .portfolio-item .portfolio-link .caption:hover { opacity: 1; }
#portfolio .portfolio-item .portfolio-link .caption .caption-content { position: absolute; top: 50%; width: 100%; height: 20px; margin-top: -12px; text-align: center; font-size: 20px; color: #fff; }
#portfolio .portfolio-item .portfolio-link .caption .caption-content i { margin-top: -12px; }
#portfolio .portfolio-item .portfolio-link .caption .caption-content h3, #portfolio .portfolio-item .portfolio-link .caption .caption-content h4 { margin: 0; }
#portfolio * { z-index: 2; }

@media(min-width:767px) {
    #portfolio .portfolio-item { margin: 0 0 30px; }
}

.btn-outline { margin-top: 15px; border: solid 2px #fff; font-size: 20px; color: #e8e8e8; background: 0 0; transition: all .3s ease-in-out; }

.btn-outline:hover, .btn-outline:focus, .btn-outline:active, .btn-outline.active { border: solid 2px #fff; color: #18bc9c; background: #fff; }

footer { color: #000; font-size: 0.8em; }
.scroll-top { z-index: 1049; position: fixed; right: 2%; bottom: 2%; width: 50px; height: 50px; }
.scroll-top .btn { width: 50px; height: 50px; border-radius: 100%; font-size: 20px; line-height: 28px; }
.scroll-top .btn:focus { outline: 0; }

.portfolio-modal .modal-content { padding: 100px 0; min-height: 100%; border: 0; border-radius: 0; text-align: center; background-clip: border-box; -webkit-box-shadow: none; box-shadow: none; }
.portfolio-modal .modal-content h2 { margin: 0; font-size: 24px; }
.portfolio-modal .modal-content img { margin-bottom: 30px; }
.portfolio-modal .modal-content .item-details { margin: 30px 0; }
.portfolio-modal .close-modal { position: absolute; top: 25px; right: 25px; width: 75px; height: 75px; background-color: transparent; cursor: pointer; }
.portfolio-modal .close-modal:hover { opacity: .3; }
.portfolio-modal .close-modal .lr { z-index: 1051; width: 1px; height: 75px; margin-left: 35px; background-color: #2c3e50; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.portfolio-modal .close-modal .lr .rl { z-index: 1052; width: 1px; height: 75px; background-color: #2c3e50; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg);}
.portfolio-modal .modal-backdrop { display: none; opacity: 0; }