.icerikler {
    margin-left: 350px;
    margin-right: 50px !important;
    margin-top: 95px;
    margin-bottom: 95px;
}

.parent {
    position: sticky;
    z-index: 6;
    top: 38px;
    align-items: center;
    align-self: center;
    text-align: center;
    justify-self: center;
    background-color: #f9f9f9;
    box-shadow: 10px 5px 15px 0px #797A7A;
}
.parent2 {
    position: fixed;
    
    width: 100%;
    z-index: 6;
    top: 38px;
    align-items: center;
    align-self: center;
    text-align: center;
    justify-self: center;
    background-color: #f9f9f9;
    box-shadow: 10px 5px 15px 0px #797A7A;
}

.features-small-item {
    cursor: pointer;
    display: block;
    border-radius: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    position: relative;
    font-size: 18px;
    color: white;
    height: 100%;
    text-shadow: 1px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000;
}
/*
    background: #13547a;
*/

.features-small-item_pasif {
    cursor: pointer;
    display: block;
    border-radius: 20px;
    background: #dddddd;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    position: relative;
    font-size: 18px;
    color: darkgray;
    height: 100%;
}


.features-small-item:hover {
    margin-top: -10px;
}

.features-small-item_pasif .icon-content {
    width: 60px;
    height: 60px;
    margin: auto;
    position: relative;
    border-radius: 50%;
}

.features-small-item .icon-content {
    width: 60px;
    height: 60px;
    margin: auto;
    position: relative;
    border-radius: 50%;
}



body {
    font-family: Candara, Arial, Helvetica, sans-serif;
    background-color: #f9f9f9;

}

.scrollable-menu::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 4px;
}
/*
        background-color: lightgray;
*/
.scrollable-menu::-webkit-scrollbar-thumb {
    border-radius: 3px;

    background-image: linear-gradient(#F2FFFF,#a3bebf);
    -webkit-box-shadow: 0 0 1px rgba(255,255,255,.75);
}
.scrollable-menu {
    height: auto;
    max-height: calc(100vh - 150px);
    overflow-x: hidden;
}



/*
 max-height: 110px;
*/


.maxparent {
    padding-left: 260px;
    display: flex;
}
#flash {
    font-size: 45px;
    font-weight: 800;
    letter-spacing: 18px;
}




.light {
   
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 3px;
}

#flashhr {
    margin: 0px;
    padding: 0px;
    position: relative;
    height: 1px;
    line-height: 0px;
    background-color: #283E59;
}

.metin {
    color: #283E59;
    overflow: hidden;
    align-self: center;
    text-align: center;
    justify-self: center;
}

.img_center {
    margin-top: 20px;
    margin-bottom: 20px;
    position: relative;
    border-radius: 50%;
    width: 180px;
    left: 45px;
}

.maxparent img {
    padding: 5px;
    width: auto;

    height: 100px;
}

/*

    
*/
/*
    img
*/
#img_center img {
    align-items: center;
    justify-content: center;
}

#bartop {
    display: none;

}


/* flash ------------------------------------------------------ */


/* light ------------------------------------------------------ */



.trstyle {
    transform: rotate(0);
    cursor: pointer;
}

    .trstyle:hover {
        cursor: pointer;
    }

.arrow-5 {
    /* more triangle */
    position: relative;
    height: 0px;
    width: 0px;
    border: 12px solid;
    border-color: darkcyan darkcyan transparent transparent;
    transform: rotate(225deg);
}


    .arrow-5:before {
        content: '';
        position: absolute;
        top: 0px;
        right: 0px;
        display: block;
        height: 12px;
        width: 16px;
        background-color: darkcyan;
        transform: rotate(-45deg) translate(2px, 1px);
    }

/**/

.mediabar {
    flex-direction: row; /* default value; can be omitted */
    flex-wrap: nowrap; /* default value; can be omitted */
    justify-content: space-between;
    position: fixed;
    z-index: 1000;
    height: 38px;
    width: 100%;
    display: flex;
    background-color: #18324b;
    top: 0px;
    
}

.telif a {
    text-decoration: none;
}
.telif p {
    position: relative;
    font-weight: 900;
    margin-left: 20px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: white;
    font-size: 14px;
    top: 19px;
}

.eskisurm {
    display: flex;
    
    height: 38px;
}

    .eskisurm a {

        text-decoration: none;
    }
    .eskisurm p {
        position: relative;
        font-weight: 900;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        color: white;
        font-size: 14px;
        top: 19px;
    }

.boy {
    height: 38px;
    margin-right: 20px;
}

    .seffect .buttons {
        right:0;
        position: relative;
        top:19px;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
   
        display: flex;
       
    }



    .seffect a {
        margin-left: 10px;
      
        text-decoration: none !important;
        color: #fff;
        width: 30px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        font-size: 25px;
        overflow: hidden;
        position: relative;
    }

    .seffect a img {
        max-height: 30px;
        max-width: 30px;
        padding: 5px 5px;
        position: relative;
        z-index: 3;
    }

    .seffect a.fb {
        background-color: #3b5998;
    }

    .seffect a.tw {
        background-color: #00aced;
    }

    .seffect a.g-plus {
        background-color: #dd4b39;
    }

    .seffect a.dribbble {
        background-color: #ea4c89;
    }

    .seffect a.pinterest {
        background-color: #cb2027;
    }

    .seffect a.youtube {
        background-color: #FF0000;
    }

    .seffect a.telgram {
        background-color: #229ED9;
    }

    .seffect a.insta {
        background-color: #bc2a8d;
    }

    .seffect a.in {
        background-color: #007bb6;
    }

    .seffect a.vimeo {
        background-color: #1ab7ea;
    }
/* aeneas seffect */
.seffect.aeneas a {
    transition: transform 0.4s linear 0s, border-top-left-radius 0.1s linear 0s, border-top-right-radius 0.1s linear 0.1s, border-bottom-right-radius 0.1s linear 0.2s, border-bottom-left-radius 0.1s linear 0.3s;
}

    .seffect.aeneas a img {
        transition: transform 0.4s linear 0s;
    }

    .seffect.aeneas a:hover {
        transform: rotate(360deg);
        border-radius: 50%;
    }

        .seffect.aeneas a:hover img {
            transform: rotate(-360deg);
        }
/* jaques seffect */
.seffect.jaques a {
    transition: border-top-left-radius 0.1s linear 0s, border-top-right-radius 0.1s linear 0.1s, border-bottom-right-radius 0.1s linear 0.2s, border-bottom-left-radius 0.1s linear 0.3s;
}

    .seffect.jaques a:hover {
        border-radius: 50%;
    }
/* egeon seffect */
.seffect.egeon a {
    transition: transform 0.2s linear 0s, border-radius 0.2s linear 0.2s;
}

    .seffect.egeon a img {
        transition: transform 0.2s linear 0s;
    }

    .seffect.egeon a:hover {
        transform: rotate(-90deg);
        border-top-left-radius: 50%;
        border-top-right-radius: 50%;
        border-bottom-left-radius: 50%;
    }

        .seffect.egeon a:hover img {
            transform: rotate(90deg);
        }
/* claudio seffect */
.seffect.claudio a {
    transition: transform 0.2s linear 0s, border-radius 0.2s linear 0s;
}

    .seffect.claudio a:hover {
        transform: scale(1.2);
        border-bottom-left-radius: 50%;
        border-top-right-radius: 50%;
    }
/* laertes seffect */
.seffect.laertes a {
    transition: all 0.2s linear 0s;
}

    .seffect.laertes a img {
        transition: all 0.2s linear 0s;
    }

    .seffect.laertes a:hover {
        border-radius: 50%/20%;
    }

        .seffect.laertes a:hover img {
            transform: scale(1.1);
            text-shadow: 0 0 12px rgba(33, 33, 33, 0.6);
        }


.cardsec1 {
    background: #7f87b2;
    box-shadow: 0 4px 8px 0 #515673, 0 6px 20px 0 #6D7399;
}

.cardsec2 {
    background: #95dab6;
    box-shadow: 0 4px 8px 0 #3D594A, 0 6px 20px 0 #82BFA0;
}

.cardsec3 {
    background: #83b2d0;
    box-shadow: 0 4px 8px 0 #334652, 0 6px 20px 0 #84B3D1;
}

.cardsec4 {
    background: #f2e6b1;
    box-shadow: 0 4px 8px 0 #736D54, 0 6px 20px 0 #F2E6B1;
}

.cardsec5 {
    background: #dc8580;
    box-shadow: 0 4px 8px 0 #5C3735, 0 6px 20px 0 #DB847F;
}

.panel {
    border: 1px solid rgba(0,0,0,0.25);
    padding: 25px;
}

    .panel img {
        border-radius: 20px;
        border: 1px solid rgba(0,0,0,0.25);

        rotation:40deg;
    }


.book-container {
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 400px;

}

.book {

    width: 125px;
    height: 200px;
    position: relative;
    transform-style: preserve-3d;
    transform: rotateY(-31deg);
    transition: 1s ease;
    -webkit-animation: initAnimation 1s ease 0s 1;
    animation: initAnimation 1s ease 0s 1;
}

    .book:hover {
        transform: rotateY(-8deg);
    }

    .book > :first-child {
        position: absolute;
        top: 0;
        left: 0;
        background-color: red;
        width: 125px;
        height: 200px;
        transform: translateZ(5px);
        background-color: #949494;
        border-radius: 0 1px 1px 0;
        box-shadow: 5px 5px 20px #666;
    }

    .book:before {
        background-color: #00f;
        width: 8px;
        transform: translateX(120px) rotateY(90deg);
        background: linear-gradient( 90deg, #fff, #f9f9f9 5%, #fff 10%, #f9f9f9 15%, #fff 20%, #f9f9f9 25%, #fff 30%, #f9f9f9 35%, #fff 40%, #f9f9f9 45%, #fff 50%, #f9f9f9 55%, #fff 60%, #f9f9f9 65%, #fff 70%, #f9f9f9 75%, #fff 80%, #f9f9f9 85%, #fff 90%, #f9f9f9 95%, #fff );
    }

    .book:after,
    .book:before {
        position: absolute;
        content: " ";
        left: 0;
        top: 0;
        height: 200px;
    }

    .book:after {
        width: 125px;
        transform: translateZ(-5px);
        background-color: lightgray;
        border-radius: 0 1px 1px 0;
        box-shadow: -10px 0 20px 0 #666;
    }



.booktxt {
    text-decoration: none;
    display:flex;
}
    .booktxt a {
        text-decoration: none;
        color: black;
    }
.booklink {
    text-decoration: none;
    font: Arial;
    font-family: sans-serif;
    text-align: center;
    color: black;
    margin-top: 15px;
    font-weight: 600;
    line-height: 1.5em;
    overflow: hidden;
    display: block;
    display: -webkit-box;
    width: 140px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}



    .booklink img {
        height: 1.8em;
        width: 1.8em;
       margin-left:10px;
    }

.booktitle {
    margin-bottom: 40px !important;
    font: Arial;
    font-family: sans-serif;
 
    font-weight: bold;
    font-size: 1.6rem;
 
    color: rgba(24, 50, 75, 1);
    
}


.features-small-item .stonge_card {
    color: white;
    text-decoration: none;
}

.features-small-item a {
    text-decoration: none;
    font-size: 18px;
}