
html { 
    background-color: black;

}

html, body {margin: 0; height: 100%; overflow: hidden; width: 100%; position: fixed;}
.loadyazi {
position:absolute;
 left: 0; 
 right: 0; 
 margin-left: auto; 
 margin-right: auto;
z-index:99;
top: 40%;
font-size:16px;
color:white;
text-align:center;
letter-spacing:5px;
font-family: 'Cinzel', serif;
 opacity:0.6;
}


.yukleniyor {
position:fixed;
width:100%;
height:100%;
background-color:#41332d;
z-index:98;
}

.loady {
position: absolute; 
 left: 0; 
 right: 0; 
 margin-left: auto; 
 margin-right: auto; 
 width: 120px; /* Need a specific value to work */
 z-index:99;
 top:20%;
 opacity:0.7;

}




.container {

     position: relative;
   width: 74%;
   height: auto;
   padding:1%;
   padding-bottom:50px;
   left: 12%;
   background-color: rgba(30, 22, 22, 0.9);
   /* opacity: 0.8; */
   box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.28);
   z-index: 5;
      -webkit-transition-duration: 1s;
   -moz-transition-duration: 1s;
   -o-transition-duration:1s;
   transition-duration: 1s;
   overflow:auto;
           min-height: 40%;
}

.arkaplan {
   width: 104%;
   height: 104%;
   position: fixed;
   background: url(./bgold.jpg) no-repeat center center fixed;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
   z-index: -2;
   filter: blur(2px);
   background-color: #31211c;
   margin: 0 !important;
   padding: 0 !important;
   left: -2%;
   top: -2%;
   opacity:0.9;
   overflow: hidden;
}

.menu {
   width: 80%;
   /* top: 240px; */
   color: white;
   left: 10%;
   text-align: center;
   z-index: 5;
   position: relative;
   padding-bottom: 2.5%;
   padding-top: 0.5%;
}

.menulink {

font-size:17px;

letter-spacing:2px;
font-family: 'Cinzel', serif;
opacity:0.9;
cursor:pointer;
color:black;
text-shadow:0 0 25px white;

}

.menulink:hover {
opacity:1;
text-shadow:0 0 50px #332e28;

}
.ayrac {

opacity:0.2;
   padding: 5%;
}

.logo{
width: 25%;
max-width: 300px;
   padding: 10px;
   opacity:0.95;
}



.esmalar {
   width: 100%;
   height: 100%;
   z-index:2;
   overflow:hidden;
       


}

.esmatek {
font-size:24px;
color:white;
font-family: 'Cinzel', serif;
letter-spacing:3px;
filter:blur(5px);
 opacity:0.01;
  -webkit-transition-duration: 3s;
   -moz-transition-duration: 3s;
   -o-transition-duration:3s;
   transition-duration: 3s;
}

.neden {
   position: relative;
   width: 72%;
   left: 27%;
   height: 80%;
   top: 10%;
   color: white;
   opacity: 0.85;
   line-height: 18px;
   font-size: 13px;
   font-weight:400;
   letter-spacing: 1px;
   /* text-align: center; */
   padding-top: 10px;
font-family: 'Montserrat', sans-serif;
 
   

}

.imza {
   float: right !important;
   padding-right: 10%;
}

.foto {
   position: absolute;
   left: 4%;
   width: 20%;
   top: 12%;
       opacity: 0.85;
        -webkit-transition-duration: 1s;
   -moz-transition-duration: 1s;
   -o-transition-duration:1s;
   transition-duration: 1s;
}

.foto:hover{

opacity:0.9;
 
}



.bio_sayfa {
  position: absolute;
   width: 70%;
   left: 27%;
   height: 80%;
   top: 10%;
   color: white;
   opacity: 0;
   line-height: 18px;
   font-size: 13px;
   font-weight:400;
   letter-spacing: 1px;
   /* text-align: center; */
   padding-top: 10px;
font-family: 'Montserrat', sans-serif;

}


.eser_sayfa {
  position: absolute;
   width: 45%;
   left: 27%;
   height: 80%;
   top: 10%;
   color: white;
   opacity: 0;
   line-height: 18px;
   font-size: 13px;
   font-weight:400;
   letter-spacing: 1px;
   /* text-align: center; */
   padding-top: 10px;
font-family: 'Montserrat', sans-serif;
text-align:justify;

}


.eserlink {
    position: absolute;
   right: -52%;
   font-size: 14px;
   letter-spacing:1px;
   line-height: 34px;
   text-align: left;
   width: 45%;
   font-family: 'Montserrat', sans-serif !important;
   top: 0;
   min-width:120px;


}


.esertek {
   background: rgba(95, 70, 55, 0.4);
   padding-top:12px;
   display: inline-block;    
   -webkit-transition-duration: 250ms;
   -moz-transition-duration: 250ms;
   -o-transition-duration: 250ms;
   transition-duration: 250ms;
       width: 100%;
   position: relative;
   font-family: 'Montserrat', sans-serif !important;
margin-bottom: 5%;

}

.esertek:hover {
   background: rgba(95, 70, 55, 0.85);



}



.eserfoto {
   width: 65%;
   margin-bottom: -9px;

}


.kitap {
position:relative;
font-family: 'Montserrat', sans-serif !important;


}


.iletisimarkaplan {
position:absolute;
width:100%;
height:100%;
z-index:79;
background:black;
left:0;
top:0;
opacity:0;

}

.iletisim {
   position: absolute;
   width: 50%;
   height: auto;
   z-index: 89;
   background: black;
   left: 25%;
   top: 20%;
   box-shadow: 0 0 40px 7px rgba(218, 172, 133, 0.3);
   opacity: 0;
   outline: rgba(218, 172, 133, 0.5) solid 2px;
   outline-offset: -16px;
}


.iletisimic {
position:relative;
width:90%;
height:90%;
z-index:99;
left:5%;
top:5%;
color:white;


}

.iletisimbaslik{
font-size:18px;
font-weight:400;
letter-spacing:3px;
font-family: "Cinzel", serif;
   margin-top: 50px;

}

.kapat{
   position: absolute;
   right: 0;
   top: 0;
   width: 26px;
   z-index: 100;
   cursor: pointer;
   margin: 30px;
}



#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea, #contact button[type="submit"] { font:400 14px/18px "Open Sans", Helvetica, Arial, sans-serif; }

#contact {
margin: 30px;
   width: 80%;
   /* left: 5%; */
   position: relative;
   overflow: hidden;
   margin-left: auto;
   margin-right: auto;
}

#contact h3 {
   color: #F96;
   display: block;
   font-size: 30px;
   font-weight: 400;
}

#contact h4 {
   margin:5px 0 15px;
   display:block;
   font-size:13px;
}

fieldset {
   border: medium none !important;
   margin: 0 0 10px;
   min-width: 100%;
   padding: 0;
   width: 100%;
}

#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea {
   width:100%;
   border:1px solid #CCC;
   background:#FFF;
   margin:0 0 5px;
   padding:10px;
}

#contact input[type="text"]:hover, #contact input[type="email"]:hover, #contact input[type="tel"]:hover, #contact input[type="url"]:hover, #contact textarea:hover {
   -webkit-transition:border-color 0.3s ease-in-out;
   -moz-transition:border-color 0.3s ease-in-out;
   transition:border-color 0.3s ease-in-out;
   border:1px solid #AAA;
}

#contact textarea {
   height:100px;
   max-width:100%;
 resize:none;
}

#contact button[type="submit"] {
   cursor:pointer;
   width:30%;
   border:none;
   background:#71573e;
   color:#FFF;
   margin:0 0 5px;
   padding:10px;
   font-size:15px;
       margin-left: 35%;
}

#contact button[type="submit"]:hover {
   background:#ab8f75;
   -webkit-transition:background 0.3s ease-in-out;
   -moz-transition:background 0.3s ease-in-out;
   transition:background-color 0.3s ease-in-out;
}

#contact button[type="submit"]:active { box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.5); }

#contact input:focus, #contact textarea:focus {
   outline:0;
   border:1px solid #999;
}
::-webkit-input-placeholder {
color:#888;
}
:-moz-placeholder {
color:#888;
}
::-moz-placeholder {
color:#888;
}
:-ms-input-placeholder {
color:#888;
}

a {
color:#f5deb3;
text-decoration:none;
}


.bg-container {
   width: 200%;
   height: 200%;
 position:absolute;
 top:50%;
 left:50%;
 transform: translate3d(-50%,-50%,0);
  overflow:hidden !important;
     user-select: none;
}

.bg-scroll {
   opacity: 0.13;
 position: absolute;
 /* make BG larger than container */
 height: 150%;
 width: 150%;
 /* center bg in container - ratio of 150% */
 top: -25%;
 left: -25%;
 background: url(./bgpt.png) repeat;
 animation: backgroundScroll 60s linear infinite;
 transform: scale(1);
 transform-origin: center center;
  overflow:hidden !important;
}

@keyframes backgroundScroll {
   0% {
   background-position: 0 0;
 }
   100% {
   /* pattern bg texture is 1000x1000px */
   background-position:-1000px -1000px;
 }
}
/*
    FILE ARCHIVED ON 11:19:29 Jan 03, 2019 AND RETRIEVED FROM THE
    INTERNET ARCHIVE ON 18:27:12 May 08, 2020.
    JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

    ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
    SECTION 108(a)(3)).
*/
/*
playback timings (ms):
 PetaboxLoader3.resolve: 58.903 (2)
 load_resource: 94.327
 LoadShardBlock: 579.617 (3)
 exclusion.robots.policy: 0.179
 RedisCDXSource: 625.245
 esindex: 0.012
 PetaboxLoader3.datanode: 606.299 (5)
 CDXLines.iter: 12.298 (3)
 captures_list: 1220.512
 exclusion.robots: 0.194
*/