html { overflow-x: hidden; }
body { margin: 0; padding: 0; display: block; }

/* Fonts
--------------------------------------------------------------------------------------------------------------- */
body, input, textarea, select { font-family: "Segoe UI",Arial,Sans-Serif; font-size: 14px; color: #333; margin: 0; }

a { color: #274472; outline: none; text-decoration: none; }
a:hover { text-decoration: none; }

img { display: block; margin: 0; padding: 0; border: none; }

/*--HTML 5 Overrides--*/
address, article, aside, figcaption, figure, footer, header, nav, section { display: block; margin: 0; padding: 0; }


h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 10px; color: #1C3039; font-weight: 600; letter-spacing: -0.025em; }
h1 { font-size: 24px; }
h2 { font-size: 22px; }
h3 { font-size: 20px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 15px; }


p { margin: 0 0 5px 0; }
ul, label { margin: 0; padding: 0; }

hr { -webkit-box-sizing: content-box; box-sizing: content-box; height: 0 }

.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
.clear20 { width: 100%; height: 20px; clear: both; display: block; }

.wrapper { width: 100%; float: left; margin: 0; overflow: hidden; }

.col0 { width: 250px; height: 100%; position: fixed; overflow-x: hidden; display: block; background: #000; }
.col0:before { content: ""; /*width: 100%; height: 100%;*/ position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url(/Content/image/leftbg.jpg) no-repeat center; background-size: cover; opacity: 20%; z-index: -1; }
.col1 { width: calc(100% - 250px); max-width: 100%; position: relative; left: 250px; margin-bottom: 0; }
.col2 { width: calc(100% - 250px); max-width: 100%; position: relative; left: 250px; }


/*--- html5 element ---*/
header { width: 100%; height: 0; background: #fff; position: relative; }
main { width: 100%; }
footer { width: 100%; }

section#sec1 { width: 100%; }
section#inside { width: 100%; }

article#detail { width: 100%; min-width: 300px; float: left; padding: 10px; box-sizing: border-box; }

article#slide { width: 100%; height: 180px; margin-bottom: 30px; display: block; position: relative; background: #000; }
article#slide:before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url(/Content/image/slide.jpg) no-repeat 0 50%; opacity: 70%; background-size: cover; z-index: 1; }

.container { width: 100%; max-width: 1650px; height: 100%; float: left; overflow: hidden; }

.topleft { width: 225px; height: 60px; position: absolute; top: 10px; left: 10px; background: url(/Content/image/logo.jpg) no-repeat; cursor: pointer; display: none; }
.topmiddle { width: 80px; height: 60px; position: absolute; top: 0; right: 150px; }
.topright { width: auto; position: absolute; top: 13px; right: 60px; }
.topright i { margin-right: 10px; }
.topright a { padding: 8px 10px; border: 1px solid #ddd; display: block; }
.topright a:hover { background: #efefef }


.maingrid { width: 100%; display: grid; grid-template-columns: minmax(300px, 2fr) minmax(300px, 1fr); gap: 0px 20px; grid-template-areas:
        "slider slider"
        "bolum bolum"
        "detail list"; }

#item1 { grid-area: slider; background: #1A1A1A; margin-bottom: 30px; }
#item2 { grid-area: bolum; padding: 10px; margin-bottom: 100px; }
#item3 { grid-area: detail; padding: 10px; }
#item4 { grid-area: list; }

.detailgrid { width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, auto) minmax(300px, 1fr)); gap: 20px; grid-template-areas:
        "image statement" }

#detail1 { grid-area: image; }
#detail2 { grid-area: statement; }
#detail1 img { max-width: 100%; height: auto; }


.contactgrid { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(300px, 1fr)); gap: 20px; grid-template-areas:
        "form adres" }

#form { grid-area: form; }
#adres { grid-area: adres; }
#adres a { padding: 5px; color: #168eea; display: block; }
#adres i { min-width: 30px; font-size: 18px; color: #EF802E; }
#adres a:hover { text-decoration: none; color: #EF802E }


.phgrid1 { width: 100%; display: grid; grid-template-columns: 1fr; gap: 20px; }
.phgrid2 { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(300px, 1fr)); gap: 20px; }
.phgrid3 { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.phgrid4 { width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; }
.phgrid5 { width: 100%; display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; }
.phgrid8 { width: 100%; display: grid; grid-template-columns: repeat(8, minmax(90px, 1fr)); gap: 20px; }


/*slider side*/
.topslider { width: 100%; min-width: 300px; min-height: 300px; max-height: 1100px; display: block; }
.slider { width: 100%; display: none; }


/* left side menu*/
.openNav { position: absolute; top: 15px; right: 10px; padding: 0 5px; font-size: 28px; cursor: pointer; color: #333; background: #eee; display: none; }
.closebtn { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; color: #444; display: none; }

.menuside { width: 100%; height: 100%; float: left; position: relative; }
.menulogo { width: 225px; height: 80px; margin-top: 10px; margin-left: 10px; background: url(/Content/image/logo.jpg) no-repeat; cursor: pointer; }

.menutop { width: 100%; float: left; margin-top: 50px; }
.menutop nav a { padding: 5px 0 5px 15px; color: #bbb; font-weight: 600; display: block; }
.menutop nav i { min-width: 30px; font-size: 14px; }
.menutop nav a:hover { text-decoration: none; color: #1A1A1A; background: #EF802E; }
.menutop nav .act { margin-top: 20px; color: #FF5454; font-weight: 600; }
.menutop nav .tel { color: #168eea; font-weight: 600; }

.menusocial { position: absolute; left: 5px; bottom: 15%; }
.menusocial a { padding-left: 10px; color: #168eea }
.menusocial i { font-size: 22px; }
.menusocial a:hover { text-decoration: none; color: #FF5454 }

.menubottom { position: absolute; left: 0; bottom: 15px; }
.menubottom a { padding: 6px; font-size: 11px; color: #bbb; text-align: center; display: block; }
.menubottom a:hover { color: #EF802E; }
.menubottom .goplogo { width: 100px; height: 100px; margin: 0 auto; background: url(/Content/image/goplogo.png) no-repeat; cursor: pointer; }

.boxtop { width: 100%; display: flex; margin-bottom: 10px; }
.boxtop h1 { padding-left: 10px; font-size: 22px; font-weight: 400; border-left: 10px solid #EF802E; display: block; }
.boxtop a { width: auto; float: right; margin-top: 20px; font-size: 13px; color: #A82512; }
.boxtop a:hover { text-decoration: underline; color: #168eea; }

.mainbox { width: 100%; float: left; margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #ddd; }
.mainbox a { width: 98%; float: left; padding-right: 5px; font-size: 22px; color: #777; font-weight: 300; }
.mainbox a:hover { text-decoration: none; background: #eee; }

.phDiv { width: 100%; float: left; }

.mainbox1 { width: 100%; position: relative; box-sizing: border-box; border-radius: 3px; }
.mainbox1 img { width: 100%; max-width: 100%; height: 100%; max-height: 250px; margin-bottom: 10px; }
.mainbox1 h2 { margin-bottom: 20px; padding-left: 10px; font-size: 22px; border-left: 3px solid #EF802E; display: block; }
.mainbox1 p { margin-bottom: 20px; display: block; }
.mainbox1 a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #555; opacity: 0; }
.mainbox1 a:hover:before { opacity: 0.2; }

.mainbox2 { width: 100%; float: left; }
.mainbox2 img { width: 100%; max-width: 600px; height: 100%; max-height: 440px; float: left; }
.mainbox2 h1 { margin-bottom: 30px; padding-left: 10px; font-size: 22px; font-weight: 400; border-left: 10px solid #EF802E; display: flex; }
.mainbox2 p { margin-bottom: 50px; display: flex; line-height: 22px; }
.mainbox2 a { color: #444; float: left; font-size: 18px; }
.mainbox2 i { margin-right: 10px; color: #EF802E; }
.mainbox2 a:hover { opacity: 0.5; }

.mainbox3 { width: 100%; position: relative; box-sizing: border-box; border-radius: 3px; }
.mainbox3 img { width: 150px; max-width: 100%; height: 100%; max-height: 90px; float: left; margin-right: 10px; }
.mainbox3 h2 { font-size: 18px; display: block; margin-bottom: 5px; }
.mainbox3 p { display: block; }
.mainbox3 a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #555; opacity: 0; }
.mainbox3 a:hover:before { opacity: 0.2; }

.mainbox4 { width: 100%; position: relative; box-sizing: border-box; border-radius: 3px; }
.mainbox4 h3 { font-size: 16px; font-weight: 400; }
.mainbox4 i { margin-right: 10px; color: #EF802E; }
.mainbox4 a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #555; opacity: 0; }
.mainbox4 a:hover:before { opacity: 0.2; }

/*arama*/
.mainbox6 { width: 100%; background: #eee; border: 1px solid #eee; border-radius: 3px; position: relative; box-sizing: border-box; }
.mainbox6 img { width: 100%; max-width: 100%; max-height: 180px; }
.mainbox6 h2 { height: 30px; padding: 10px; color: #444; font-size: 14px; font-weight: 600; display: block; }
.mainbox6 p { padding: 5px; background: #eee; display: block; }
.mainbox6 a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #168eea; opacity: 0; }
.mainbox6 a:hover:before { opacity: 0.2; }




/*-------Contact Page*/
.warning { width: 99%; float: left; color: #ff2400 }
.warning img { max-width: 100%; float: left; margin-top: 10px; }

.contact { width: 100%; min-width: 280px; max-width: 500px; margin: 0 auto; }

fieldset { width: 99%; margin-bottom: 10px; padding: 10px; border: 1px solid #ddd; border-radius: 3px; box-sizing: border-box; }
fieldset legend { font-size: 12px; color: #168eea; }

fieldset input[type=text] { width: 100%; margin-bottom: 10px; box-sizing: inherit; }
fieldset input[type=number] { width: 100%; margin-bottom: 10px; box-sizing: inherit; }
fieldset input[type=email] { width: 100%; margin-bottom: 10px; box-sizing: inherit; }
fieldset input[type=tel] { width: 100%; margin-bottom: 10px; box-sizing: inherit; }
fieldset input[type=password] { width: 100%; margin-bottom: 10px; box-sizing: inherit; }

fieldset textarea { width: 100%; height: 60px; overflow: hidden; box-sizing: inherit; }
fieldset select { width: 100%; margin-bottom: 10px; box-sizing: inherit; }

fieldset#birthdate input[type=tel] { width: 34%; color: #444; }
fieldset#birthdate select { width: 21%; color: #444; }

fieldset#captcha input[type=number] { width: 70px; }


.row1 { width: 100%; display: block; }
.row1 table { width: 100%; }
.row1 table td { padding: 8px; }
.row1 input[type=submit] { width: 100%; padding: 12px 0; }


.isok { width: 97%; float: left; background: #168eea; padding: 5px; color: #fff; border-radius: 3px; }
.isnot { width: 97%; float: left; background: #e5e5e5; padding: 5px; border-radius: 3px; }

/*-------Search Page a div in içinde*/
.menupactive { width: 95%; float: left; margin-bottom: 20px; box-shadow: 0px 2px 3px 3px #e5e5e5; padding: 5px; }
.menupactive img { width: 100px; min-height: 60px; max-height: 75px; float: left; margin-right: 15px; }
.menupactive h3 { font-size: 20px; margin: 10px 0; }
.menupactive p { font-size: 14px; color: #A82512; }
.menupactive a { width: 100%; height: 100%; display: inline-block; }
.menupactive a:hover { text-decoration: none; background: #63B2F5; transition: all 0.7s; opacity: 0.7; }
.menupactive a:hover h3 { color: #fff; }
.menupactive a:hover p { color: #fff; }

.menupassive { width: 95%; float: left; margin-bottom: 20px; box-shadow: 0px 2px 3px 3px #e5e5e5; padding: 5px; }
.menupassive img { width: 100px; min-height: 60px; max-height: 75px; float: left; margin-right: 15px; }
.menupassive h3 { font-size: 20px; margin: 10px 0; }
.menupassive p { font-size: 14px; color: #A82512; }
.menupassive a { width: 100%; height: 100%; display: inline-block; }
.menupassive a:hover { text-decoration: none; background: #A72611; transition: all 0.7s; opacity: 0.7; }
.menupassive a:hover h3 { color: #fff; }
.menupassive a:hover p { color: #fff; }


.login { width: 400px; margin: 0 auto; }
.login table td { padding: 5px; }
.login input[type=email], input[type=password] { width: 350px; float: left; }
.login .cb { float: left; }
.login input[type=submit] { width: 100px; float: right; }



/*footer side*/
footer .leftfooter { width: 46%; float: left; color: #fff; font-size: 13px; }
footer .leftfooter p { margin-bottom: 10px; }
footer .leftfooter span { margin-left: 5px; }

footer .rightfooter { width: 46%; float: right; color: #2F2B2A; font-size: 13px; }

.linkbox { width: 100%; float: left; margin-bottom: 20px; }
.linkbox h4 { font-weight: 400; color: #fff; }
.linkbox a { width: auto; float: left; color: #EE7F2D; margin-right: 10px; font-size: 14px; }
.linkbox a:hover { text-decoration: none; color: #fff; }

textarea { width: auto; height: 50px; color: #4e4e4e; overflow: auto; }
textarea, select, input[type=text], input[type=number], input[type=email], input[type=tel], input[type=password] { padding: 8px 6px; font-size: 13px; color: #4e4e4e; border: 1px solid #ddd; border-radius: 5px; }

input[type=submit] { min-width: 60px; padding: 6px 4px; background: #2996CC; border: 1px solid #bbb; color: #fff; cursor: pointer; font-size: 13px; font-weight: normal; }
input[type=submit]:hover { background: #77BACE; }
input[type=text]:focus, textarea:focus, select:focus { border-color: #2D3940; background: #e7fbff; }