/*
Theme Name: Futurist v1
*/

body{ background-color: #ececec; font-family: 'Open Sans', sans-serif; color:#222222;}

.container{ padding-left: 0.5rem; padding-right: 0.5rem;}
.row{ margin-left: -0.5rem; margin-right: -0.5rem;}
[class*="col-"] {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
a, a:visited{ color: #222222;}
a:hover{ color: #111111;}
.main-wrapper{ box-shadow:0px 0px 50px #cccccc;}
h1,h2,h3,h4,h5{ margin-bottom: 1rem;}
h1{font-size: 2rem; line-height: 2.5rem;}
h2{font-size: 2rem; line-height: 2.5rem;}
h3{font-size: 1.5rem; line-height: 2rem;}
h4{font-size: 1.5rem; line-height: 2rem;}
h5{font-size: 1.5rem; line-height: 2rem;}
.fw300{ font-weight: 300;}
.fw400{ font-weight: 400;}
.fw700{ font-weight: 700;}
.fw800{ font-weight: 800;}
img{ max-width: 100%; height: auto;}
.header-wrapper{ background: url('img/futurism.png') no-repeat center center;}
.branding, .site-title{ text-align: center;}
.site-title{ max-width: 260px; margin:auto;}
.menunav, .menusearch{ position: absolute; font-size:16px; line-height: 20px; background-color: black; color:#ffffff;}
.menunav i, .menusearch i{ border-right: 1px solid #ffffff; font-size: 16px; line-height: 20px; padding: 5px; width: 32px; text-align: center;}
.menunav span, .menusearch span{padding: 5px;}
.menusearch{ right: 15px; top: 0;}
.menusearchform{ display: none;}
.menusearchform{ width: 150px; margin-left: 2px;}
.menusearchformgoster{ display: inline;}
.menusearchbuton{cursor: pointer;}
#menu-toggle{ cursor: pointer; left: 15px;}
#menu-kapat{ position: absolute; right: 15px; top:10px; cursor: pointer; font-size: 27px; line-height: 28px; padding: 7px 8px; background-color: #000000;}
#menu-kapat:hover{ background-color: #111111;}
#gohome{position: absolute; left: 10px; top:10px; cursor: pointer; padding: 6px; background-color: #000000;}
#gohome img{ width: 30px; height: 30px;}
#gogome:hover{ background-color: #111111;}
#sidenav{ width: 280px; background-color: #222222; color: #ffffff;
  min-height: 100vh;
  -webkit-transition: margin .50s ease-out;
  -moz-transition: margin .50s ease-out;
  -o-transition: margin .50s ease-out;
  transition: margin .50s ease-out;
  position: fixed;
  margin-left: -280px;
  z-index: 1000;
  padding-top: 60px;
}
#sidenav.toggled {
  margin-left: 0;
}
.sidenavmenu{ line-height: 30px; font-size: 18px;}
.sidenavmenu a, .sidenavmenu a:visited{ color: #ffffff; text-decoration: none; }
.sidenavmenu a:hover{ color: #cccccc;}
.sidenavmenu ul{ list-style: none; margin: 0; padding: 0; border-bottom:1px solid #111111; margin-bottom: 10px;}
.sidenavmenu ul li{ margin-bottom: 5px; font-weight: 800; font-size: 26px; line-height: 26px;}
.sidenavmenu ul li a, .sidenavmenu ul li a:visited{ padding: 10px; display: block;}
.sidenavmenu ul li a:hover{color: #ffffff; background-color: #007bff;}
.sidenavmenu2 a{ padding: 10px; display: block; color:#ffffff;}

.yazi-avatar{ position: absolute; width: 96px; height: 96px; left: -96px; border-radius: 50%; box-shadow:0px 0px 10px #cccccc;}
.yazi-avatar img{ width: 100%; height: auto; border-radius: 50%;}
.yazi-mini-gorsel{ position: absolute; width: 96px; height: 96px; right: -96px; border-radius: 50%; box-shadow:0px 0px 10px #cccccc;}
.yazi-mini-gorsel a img{ width: 100%; height: auto; -webkit-filter: grayscale(100%); filter: grayscale(100%); border-radius: 50%;}

.entry-meta{ font-size: 0.8rem;}
.entry-body{ line-height: 1.7rem;}
.more-link{ font-size: 0.8rem;}
.tag-links{ display: flex;}
.tag-links ul{ padding:0; margin: 0; list-style: none;}
.tag-links ul li{ float: left; padding: 5px; background-color: #ececec; border-radius: 5px; margin-right: 5px; margin-bottom: 5px;}
.tag-links ul li i{ margin-right: 5px;}

.wp-block-embed__wrapper{ position: relative; padding-bottom: 57%;}
.wp-block-embed__wrapper iframe{ position: absolute; top:0; left: 0; width: 100%; height: 100%;}

@media (max-width: 768px) {
h1,h2,h3,h4,h5{font-size: 1.6rem; line-height: 2rem;}
.site-title{ padding-top: 60px;}
}