/*---
   _____    __      __     _____   ____  _   _ 
  / ____|  /\ \    / /\   |  __ \ / __ \| \ | |
 | (___   /  \ \  / /  \  | |__) | |  | |  \| |
  \___ \ / /\ \ \/ / /\ \ |  _  /| |  | | . ` |
  ____) / /  \ \  / /  \ \| | \ \| |__| | |\  |
 |_____/_/    \_\/_/    \_\_|  \_\\____/|_| \_|  

---*/
@font-face {
    font-family: "greycliff_cf";
    src: url("/fonts/greycliffcf-bold-webfont.woff2") format("woff2"),
         url("/fonts/greycliffcf-bold-webfont.woff") format("woff");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "greycliff_cf";
    src: url("/fonts/greycliffcf-demibold-webfont.woff2") format("woff2"),
         url("/fonts/greycliffcf-demibold-webfont.woff") format("woff");
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: "greycliff_cf";
    src: url("/fonts/greycliffcf-extrabold-webfont.woff2") format("woff2"),
         url("/fonts/greycliffcf-extrabold-webfont.woff") format("woff");
    font-weight: 800;
    font-style: normal;

}
@font-face {
    font-family: "greycliff_cf";
    src: url("/fonts/greycliffcf-heavy-webfont.woff2") format("woff2"),
         url("/fonts/greycliffcf-heavy-webfont.woff") format("woff");
    font-weight: 900;
    font-style: normal;

}
@font-face {
    font-family: "greycliff_cf";
    src: url("/fonts/greycliffcf-light-webfont.woff2") format("woff2"),
         url("/fonts/greycliffcf-light-webfont.woff") format("woff");
    font-weight: 300;
    font-style: normal;

}
@font-face {
    font-family: "greycliff_cf";
    src: url("/fonts/greycliffcf-medium-webfont.woff2") format("woff2"),
         url("/fonts/greycliffcf-medium-webfont.woff") format("woff");
    font-weight: 500;
    font-style: normal;

}
@font-face {
    font-family: "greycliff_cf";
    src: url("/fonts/greycliffcf-regular-webfont.woff2") format("woff2"),
         url("/fonts/greycliffcf-regular-webfont.woff") format("woff");
    font-weight: 400;
    font-style: normal;

}
*{
    font-family: greycliff_cf, Roboto, sans-serif;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
a{
    color: #000000;
    text-decoration: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
header{
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 1;
    background: #FFFFFF;
}
.header_top_logo{
    margin: 20px 0 10px 0;
    text-align: center;
}
.header_top_logo>img{
    width: 145px;
}
.header_top>img{
    width: 200%;
}
.header_bottom{
    box-shadow: 0 1px 15px rgb(0 0 0 / 4%), 0 1px 6px rgb(0 0 0 / 4%);
    background: #FDFBFC;
    padding: 15px;
    box-sizing: border-box;
}
.header_bottom>ul{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}
.header_bottom>ul>a>li{
}
.header_bottom>ul>a>li>img{
    width: 30px;
    height: 30px;
}
.header_bottom>ul>a>li>span{
    font-size: 14px;
    font-weight: 600;
    color: #434343;
    display: block;
    margin: 17px 0 0 0;
    position: relative;
    top: -10px;
}
.body{
    margin-top: 189px;
}
.body_vucut{
    padding: 20px;
}
.body_vucut>h3{
    font-size: 22px;
    font-weight: 600;
}
.menu{
    margin-top: 20px;
}
.menu_item{
    box-shadow: 0 1px 15px rgb(0 0 0 / 4%), 0 1px 6px rgb(0 0 0 / 4%);
    background: #FFFFFF;
    border-radius: 20px;
    padding: 10px;
    margin: 15px 0 0 0;
}
.menu_item_image{
    width: 30%;
    display: inline-block;
}
.menu_item_image>img{
    border-radius: 15px;
    width: 100px;
    height: 100px;
    object-fit: cover;
}
.menu_item_content{
    padding: 11px 0;
    position: absolute;
    display: inline-block;
    margin: 0 0 0 10px;
}
.menu_item_content>h4{
    font-size: 18px;
    font-weight: 600;
    color: #000000;
}
.menu_item_content>span{
    font-size: 20px;
    font-weight: 500;
    color: #F15C2C;
    margin-top: 10px;
    display: block;
}
.menu_item_content>p{
    font-size: 14px;
    font-weight: 300;
    color: #434343;
    margin-top: 10px;
}

@media only screen and (min-device-width: 500px), only screen and (min-width: 500px){
    body{
        width: 500px;
        margin: 0 auto;
        border: 5px solid #EF4B24;
    }
    header{
        width: 500px;
    }
    .header_top>img{
        width: 100%;
    }
}