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

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

a { color: #168eea; outline: none; text-decoration: none; }
a:hover { text-decoration: none; color: #EF802E; }

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; padding: 0; overflow: hidden; }

.col0 { width: 225px; height: 100%; position: fixed; background: #fff; overflow-x: hidden; display: block; }
.col1 { width: calc(100% - 225px); max-width: 100%; height: 70px; background: #fff; position: relative; left: 225px; display: none; }
.col2 { width: calc(100% - 225px); max-width: 100%; position: relative; left: 225px; }


/*--- html5 element ---*/
header { width: 100%; position: relative; }
main { width: 100%; margin-top: 0; display: flex; }
footer { width: 100%; }

section#sec1 { width: 100%; }
section#inside { width: 100%; }
article#detail { width: 100%; min-width: 300px; float: left; }

.container { width: 100%; max-width: 1440px; /*width: 1240px;*/ height: 100%; float: left; padding: 10px; overflow: hidden; box-sizing: border-box; }

.topleft { width: 60px; height: 55px; position: absolute; top: 10px; left: 10px; background: url(/Content/image/logo.jpg) no-repeat; cursor: pointer; display: none; }
.topmiddle { max-width: 300px; position: absolute; top: 15px; left: 10px; }
.topmiddle a { font-size: 22px; color: #01AB55; }
.topright { width: auto; position: absolute; top: 13px; right: 50px; }
.topright i { margin-right: 5px; color: #EF802E; font-weight: bold; }
.topright a { padding: 8px 5px; color: #444; font-size: 16px; font-weight: bold; display: inline-block; }
.topright a:hover { color: #444; }


/* grid sides*/

.maingrid { width: 100%; float: left; display: grid; grid-template-columns: minmax(210px, 350px) minmax(30px, 1fr); grid-template-rows: auto; gap: 40px 20px; grid-template-areas:
        "slide slide"
        "category category"
        "info news1"
        "image image"; }

#item1 { grid-area: slide; background: #f3f3f3; }
#item2 { grid-area: category; }
#item3 { grid-area: info; background: #eee; border: 1px solid #ddd; border-radius: 3px; }
#item4 { grid-area: news1; }
#item5 { grid-area: image; }


.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; 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: 10px; }
.phgrid2 { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(200px, 1fr)); gap: 20px; }
.phgrid3 { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.phgrid4 { width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.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; }
.phgridNews { width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }


.detailPageGrid { width: 100%; display: grid; grid-template-columns: 1fr 0.3fr; grid-template-rows: auto; gap: 20px; grid-template-areas:
        "image tag"
        "statement tag"
        "info tag"
        "carousel tag"; }

#detail1 { grid-area: image; }
#detail2 { grid-area: statement; }
#detail3 { grid-area: info; }
#detail4 { grid-area: carousel; }
#detail5 { grid-area: tag; padding: 10px; background: #f5f5f5; }

#detail1 img { width: auto; max-width: 100%; }

/* grid end */


/*slider side*/
.topslider { width: 100%; float: left; }
.topslider .bigslider { width: 100%; min-width: 300px; max-width: 1440px; min-height: 100px; max-height: 400px; display: none; }

.slider { width: 100%; display: none; }
.mainvideo { width: 100%; display: flex; }

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


/* 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: 100%; height: 160px; margin-top: 10px; background: url(/Content/image/logomenu.jpg) no-repeat; background-position: center top; cursor: pointer; }

.menutop { width: 100%; float: left; margin-top: 10px; }
.menutop nav { margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px solid #ddd; display: block; }
.menutop nav a { padding: 5px 0 5px 15px; color: #444; display: block; }
.menutop nav i { min-width: 30px; font-size: 14px; }
.menutop nav a:hover { text-decoration: none; background: #eee }
.menutop nav .act { margin-top: 10px; color: #FF5454; font-weight: 600; }
.menutop nav .tel { color: #168eea; font-weight: 600; }

.menubottom { width: 100%; position: absolute; bottom: 15px; }
.menubottom .goplogo { width: 100px; height: 100px; margin: auto; background: url(/Content/image/goplogo.png) no-repeat; cursor: pointer; }

.boxtop { width: 100%; display: flex; margin-bottom: 10px; border-bottom: 1px solid #ddd; }
.boxtop h1 { width: auto; float: left; font-weight: 300; color: #274472; }
.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; }

/* for middle slogan */
.mainbox0 { width: 100%; float: left; padding: 20px 10px; box-sizing: border-box; }
.mainbox0 h1 { width: 100%; margin: 0; padding: 0; font-size: 20px; text-align: right; color: #aaa; display: block; }

/* for types */
.mainbox1 { width: 100%; float: left; padding: 10px; background: #fff; border: 1px solid #ddd; position: relative; border-radius: 3px; box-sizing: border-box; }
.mainbox1 h4 { color: #777; font-size: 20px; display: inline-block; }
.mainbox1 a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.mainbox1 a:hover:before { background: #168eea; opacity: 0.2; }

.type1, .type2, .type3, .type4 { margin-right: 10px; font-size: 22px; font-weight: 600; color: #ccc; vertical-align: middle; display: inline-block; }

.type1:before { font-family: "Font Awesome 5 Free"; content: "\f1ad"; }
.type2:before { font-family: "Font Awesome 5 Free"; content: "\f2e7"; }
.type3:before { font-family: "Font Awesome 5 Free"; content: "\f5da"; }
.type4:before { font-family: "Font Awesome 5 Free"; content: "\f540"; }

/* middle box menu */
.mainbox2 { width: 100%; padding: 10px; background: #F4F4F2; border: 1px solid #eee; box-sizing: border-box; border-radius: 3px; }
.mainbox2 i { float: left; font-size: 32px; margin-right: 10px; color: #AF9483 }
.mainbox2 a { font-size: 22px; color: #7E683F; display: block; }
.mainbox2 p { display: flex; }

/* bio */
.mainbox3 { width: 100%; display: grid; grid-template-columns: 1fr; grid-template-rows: 160px auto; box-sizing: border-box; }
.mainbox3 .boximg { width: 100%; }
.mainbox3 .boximg img { width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 3px; }
.mainbox3 .boxcontent { padding: 10px; }
.mainbox3 .boxcontent a { font-size: 18px; font-weight: 600; display: block; }
.mainbox3 .boxcontent p { display: block; }

/*haber etkinlikler dikey */
.mainbox4 { width: 100%; float: left; background: #fff; border: 1px solid #eee; position: relative; border-radius: 3px; box-sizing: border-box; }
.mainbox4 .boximg { width: 100%; max-width: 150px; height: 84px; float: left; margin-right: 10px; position: relative; overflow: hidden; }
.mainbox4 .boximg img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; border-radius: 3px; }
.mainbox4 h2 { padding: 10px; font-size: 13px; display: block; /*word-break: break-all;*/ }
.mainbox4 a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #EF802E; opacity: 0; }
.mainbox4 a:hover:before { opacity: 0.2; }

/*haber etkinlikler yatay */
.mainbox5 { width: 100%; display: grid; grid-template-columns: minmax(250px, 1fr); grid-template-rows: 150px auto; background: #f9f9f9; border: 1px solid #ddd; border-radius: 3px; box-sizing: border-box; overflow: hidden; position: relative; }
.mainbox5 .boximg { width: 100%; height: 100%; }
.mainbox5 .boximg img { width: 100%; height: 100%; object-fit: cover; object-position: top; border-radius: 3px; }
.mainbox5 .boxcontent { padding: 10px; }
.mainbox5 .boxcontent h2 { color: #274472; font-size: 15px; font-weight: 400; }
.mainbox5 .boxcontent h2:before { margin-right: 10px; font-size: 16px; color: #168eea; font-family: "Font Awesome 5 Free"; content: "\f249"; }
.mainbox5 a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #168eea; opacity: 0; }
.mainbox5 a:hover:before { opacity: 0.2; }

/* search */
.mainbox6 { width: 100%; border: 1px solid #eee; border-radius: 3px; position: relative; background: #fff; border: 1px solid #eee; box-sizing: border-box; }
.mainbox6 .boximg { width: 100%; height: 160px; float: left; overflow: hidden; }
.mainbox6 .boximg img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.mainbox6 .boxcontent { width: 100%; float: left; padding: 10px; box-sizing: border-box; }
.mainbox6 .boxcontent h2 { color: #444; font-size: 16px; font-weight: 600; display: block; }
.mainbox6 a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #555; opacity: 0; }
.mainbox6 a:hover:before { opacity: 0.2; }

.mainbox7 { width: 100%; float: left; }
.mainbox7 a { margin: 3px; padding: 3px; display: inline-block; }
.mainbox7 a:hover { background: #fff; color: #ff6a00; border-radius: 3px; display: inline-block; }

.mainbox8 { width: 100%; height: 60vh; margin: 50px 0; background: url(/Content/image/footerimage.jpg) no-repeat; background-size: contain; display: block; }

.mainbox9 { width: 100%; float: left; background: #fff; }
.mainbox9 a { margin: 3px; padding: 3px; display: block; }
.mainbox9 a:hover { background: #fff; color: #ff6a00; border-radius: 3px; display: inline-block; }

/* mini gallery*/
.minigal { width: 100% !important; max-width: 800px !important; background: #eee; display: inline-block; }

/*-------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: 8px; box-sizing: inherit; }
fieldset input[type=number] { width: 100%; box-sizing: inherit; }
fieldset input[type=email] { width: 100%; box-sizing: inherit; }
fieldset input[type=tel] { width: 100%; margin-bottom: 8px; box-sizing: inherit; }
fieldset input[type=password] { width: 100%; 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 select { width: 32.5%; /* width: calc(99% / 3);*/ box-sizing: inherit; }

fieldset#categories select { margin-bottom: 8px; }

fieldset#contactinfo input[type=tel], fieldset#contactinfo input[type=email] { width: 49.33%; box-sizing: inherit; }

fieldset#contactadres input[type=text] { width: 100%; box-sizing: inherit; }
fieldset#contactadres select { width: 49.33%; box-sizing: inherit; }

fieldset#save input[type=password] { width: 200px; margin-right: 10px; padding: 10px; }
fieldset#save input[type=submit] { padding: 10px; }

fieldset#sozlesme input[type=checkbox] { float: left; }
fieldset#sozlesme div { display: inline-block; }
fieldset#sozlesme div a { color: #FF5454 }

fieldset#activation input[type=text] { width: 150px; }
fieldset#activation input[type=submit] { padding: 12px; }

fieldset#next1, fieldset#next2 { border: none; }
fieldset#next1, fieldset#next2, input[type=submit] { float: right; min-width: 80px; }

fieldset#login input[type=email], fieldset#login input[type=password] { margin-bottom: 10px; }
fieldset#captcha input[type=number] { width: 70px; }


.row1 { width: 100%; max-width: 350px; margin: 0 auto; margin-bottom: 20px; }
.row1 table { width: 100%; float: left; }
.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, .menupassive { width: 100%; float: left; margin-bottom: 20px; padding: 10px; border: 1px solid #ddd; position: relative; box-sizing: border-box; }
.menupactive i, .menupassive i { width: 80px; float: left; margin-right: 15px; font-size: 60px; color: #EF802E; text-align: center; opacity: 0.5; }
.menupactive img, .menupassive img { width: 80px; max-height: 60px; float: left; margin-right: 15px; }
.menupactive h3, .menupassive h3 { font-size: 20px; margin: 3px 0 5px 0; display: block; }
.menupactive p, .menupassive p { color: #A82512; display: block; }

.menupactive a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #168eea; opacity: 0; }
.menupassive a:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #A82512; opacity: 0; }
.menupactive a:hover:before, .menupassive a:hover:before { opacity: 0.2; }


.poll input[type="radio"] { display: none; }
.poll input[type="radio"] + label { width: auto; max-width: 100%; height: auto; min-height: 60px; display: inline-block; padding: 10px; font-size: 14px; background: #eee; cursor: pointer; border: 1px solid #ddd; }
.poll input[type="radio"]:checked + label { background-color: #ff6a00; 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; }

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; }

input[type="radio"] { display: none; }
input[type="radio"] + label { display: inline-block; margin-right: 5px; padding: 3px 6px; font-size: 14px; cursor: pointer; border: 1px solid #ddd; background: #fff; }
input[type="radio"]:checked + label { background-color: #ff6a00; color: #fff; }

input[type="checkbox"] + label { padding: 0px 8px; cursor: pointer; }