.navbar-toggler {
  border: none;
  background: transparent !important;
}

.navbar-toggler:focus {
  outline: none;
  background: transparent !important;
}

.navbar-toggler .icon-bar {
  background-color: #333333;
  transform: rotate(0deg) translate(0px, 0px);
  transition: ease all .2s;
}

.navbar-toggler .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
}

.navbar-toggler .icon-bar+.icon-bar {
  margin-top: 4px;
}

.icon-bar:nth-child(2) {
  width: 16px;
  transition: ease all .2s;
}

.navbar-toggler:hover>.icon-bar:nth-child(2) {
  width: 22px;
  transition: ease all .2s;
}

.navbar-toggler:active>.icon-bar:nth-child(2) {
  width: 22px;
  transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(1) {
  transform: rotate(45deg) translate(5px, 4px);
  transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(2) {
  opacity: 0;
  transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(3) {
  transform: rotate(-45deg) translate(4px, -4px);
  transition: ease all .2s;
}

/* paginator */

div.pagination {
    text-transform: uppercase;
   font-size: 0.875rem;
    font-weight: 600;
   font-family: 'Source Sans Pro', sans-serif;
  line-height: 26px;
    padding-top:10px;
}

div.pagination a {
    padding: 5px 10px;
    margin: 2px;
    border: 2px solid #d0d0d0;
    zoom: 100%;
    text-decoration: none; /* no underline */
    color: #a5a5a5;
      
    
}
div.pagination a:hover, div.pagination a:active {
    border: 2px solid #333;
    color: #000;
}
div.pagination span.page_current {
    padding: 5px 10px;
    margin: 2px;
    border: 2px solid #333;
 
    * zoom: 100%;

    background-color:#333;
    color: #FFF;
}
div.pagination span.page_disabled {
    padding: 5px 10px;
    margin: 2px;
    border: 2px solid #EEE;

    * zoom: 100%;

    color: #DDD;
}

* span.elipsis {zoom:100%}

div.pagination a.prev, div.pagination .page_disabled.prev {margin-left:0;}



input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-box-shadow: 0 0 0px 1000px white inset;
}


/* Extra small devices (portrait phones, less than 576px)
 No media query since this is the default in Bootstrap */
body {color:#333333; }

body > .container {
  padding: 90px 15px 15px 15px;
}

/* .search {height:40px;} */
.search .input-group-text {background-color:white; border-left:0; border-width: 2px} 
.search .form-control {border-right:0; border-width: 2px; border-color: #d0d0d0} 
.search .form-control:focus { box-shadow: none; border-color: #d0d0d0}
.search button { cursor: pointer}
.search button:focus { outline:none}
.search svg path { fill:#a9a9a9}
.search button:hover svg path { fill:#333333}

.fader { transition: all .2s ease-in-out;}
a {color: #333333; transition: all .2s ease-in-out;}
a:hover {color:#949494;}
small.date {margin-top:-8px; margin-bottom: 20px; font-size:0.875rem; margin-left:2px; display: block; font-family: 'Source Sans Pro', sans-serif; color: gray}
article h1 a:hover, .search h3 a:hover {text-decoration: none}
article p a:not(.btn) {text-decoration:underline;}
article a img {opacity: 1; -webkit-backface-visibility: hidden;}
article a:hover img {opacity: 0.8}

.navbar {margin:-120px 0; opacity:0;}
.navbar.appear { margin:0; opacity: 1;  transition: all .3s ease-in-out;}



.soc-icon {width: 32px; height: 32px; display: inline-block; margin-top:4px; transition: transform .2s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
.soc-icon:hover { transform: rotate(35deg);}

.myTable {table-layout: auto; font-family: 'Source Sans Pro', sans-serif; }
.myTable tr:first-child td {border-top: none; }

.myTable tr td:first-child { font-weight: bold; white-space: nowrap; padding-left:0}
.myTable tr td:last-child  { width: 100%; }



.soc-icon svg path, .soc-icon svg polygon{fill:#333333 !important; transition: all .2s ease-in-out; }
.soc-icon:hover svg path, .soc-icon:hover svg polygon{fill:#3B5998 !important;}
.soc-icon.tw:hover svg path, .soc-icon.tw:hover svg polygon{fill:#1DA1F2 !important;}
.soc-icon.yt:hover svg path, .soc-icon.yt:hover svg polygon{fill:#e52d27 !important;}
.soc-icon.frm:hover svg path, .soc-icon.frm:hover svg polygon{fill:#5a7ba0 !important;}


.sidebar .sticky-top {top: 122px;}
.sidebar ul li {font-size: 0.875rem}


#scrollUp {
    background-image: url("../img/top.png");
    background-size: 50px 50px;
    bottom: 20px;
    right: 20px;
    width: 50px;    
    height: 50px;   
    transition: all .15s ease-in-out;
    opacity: 1;
}

#scrollUp:hover {bottom:25px; opacity: 0.9}

.sidebar ul.sidebar-panel li a {display: block; border-bottom: 1px solid rgba(0,0,0,.1); padding: 8px 0; text-decoration: none; }
footer {color: darkgray}

.btnMy {border-color:#d0d0d0; color: #b3b3b3; font-family: 'Source Sans Pro', sans-serif; font-weight: 600; border-width: 2px; padding:0.75rem 1rem; font-size: 0.875rem; text-transform: uppercase}
.btnMy:hover, .btnMy:focus, .btnMy:active {border-color:#333333 !important; background-color: white !important; color: #333333 !important; box-shadow: none !important}

h1 {font-size:2rem}
h2 {font-size:1.75rem}
h3 {font-size: 1.5rem}
h4 {font-size: 1.25rem}
h5 {font-size: 1rem}
h6 {font-size: 0.75rem}

h1, h2, h3, h4, h5, h6 {font-family: 'Source Sans Pro', sans-serif; font-weight: 600}

.posts article {margin-bottom: 50px;}
.posts article:last-of-type {margin-bottom: 40px;}
.posts article h1, .sidebar h3, .search h1, .search h3, .page h1 {text-transform: uppercase}
.shadow {box-shadow: 0 .125rem .25rem rgba(0,0,0,.05)!important}
.logo {width: 122px; margin-top: -12px}
.sidebar ul {list-style: none; padding-left: 0; font-size:1rem;}
.bg-light {background-color: white !important;}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 

    .navbar-expand-md>.container {
        padding-left:15px;
        padding-right:15px;
    }
    
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {  
    
   
    
    .navbar {padding: 1.25rem 1rem}
body > .container {
  padding: 120px 15px 15px 15px;
}
    .posts article {margin-bottom: 80px;}
    .posts article:last-of-type {margin-bottom: 40px;}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {  }

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

    .container {max-width: 1000px;}

}

