/***********************
HAT MEDYA 2017
www.hatmedya.com
info@hatmedya.com
chrome10+, ie9+, ff4+
***********************/
@import"../css/reset.css";@import"../css/hatresponsive.css";
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed|Roboto:300,400,400i&subset=latin-ext');
body {background: #fff; font: 17px/23px 'Roboto', sans-serif; color: #323946; position: relative; min-width: 320px;}
html,body {height: 100%;}

p {padding-bottom: 20px}
a {color: #222; font-style: italic; text-decoration: none;}
a:hover {color: /*#00b8cd*/#763200; text-decoration: none; -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; -o-transition: all 0.4s linear; transition: all 0.4s linear;}
img {border: 0px;}

h1,h2,h3,h4 {font-weight: normal; line-height: normal;}
h1 {font-size: 30px; padding-bottom: 15px; color: #763200;}
h2, h2 a {font-size: 27px; font-style:normal; padding-bottom: 15px; color: #763200;}
h3 {font-size: 24px; padding-bottom: 15px;}
h4 {font-size: 21px; padding-bottom: 15px;}  

.clear {clear: both; line-height: 0; font-size: 0; overflow: hidden; height: 0; width: 100%;}
.fleft {float: left}
.fright {float: right}
.alignright {text-align: right}
.aligncenter {text-align: center}
.alignjust {text-align: justify}
.alignmiddle *{vertical-align: middle}
.it {font-style: italic;}

.sayfa404 {font-size: 18px; line-height: 28px; text-align: center; height: 220px; padding-top: 150px;}

/* PADDING ---------------------------------------- */
.padtop5{padding-top:5px}.padtop10{padding-top:10px}.padtop15{padding-top:15px}.padtop20{padding-top:20px}.padtop25{padding-top:25px}.padtop30{padding-top:30px}.padtop35{padding-top:35px}.padtop40{padding-top:40px}.padtop45{padding-top:45px}.padtop50{padding-top:50px}.padtop55{padding-top:55px}.padtop60{padding-top:60px}.padbot5{padding-bottom:5px}.padbot10{padding-bottom:10px}.padbot15{padding-bottom:15px}.padbot20{padding-bottom:20px}.padbot25{padding-bottom:25px}.padbot30{padding-bottom:30px}.padbot35{padding-bottom:35px}.padbot40{padding-bottom:40px}.padbot45{padding-bottom:45px}.padbot50{padding-bottom:50px}

/* HEADER ---------------------------------------- */
header {position: relative; margin: 0 auto;}
header nav {font:300 17px/56px 'Roboto', sans-serif; text-align: center; height: 56px;}
header nav a {color: #fff; font-style: normal; padding: 0 12px; position: relative; -webkit-transition: all 0.7s linear; -moz-transition: all 0.7s linear; -o-transition: all 0.7s linear; transition: all 0.7s linear;}
header nav a:hover, header nav a.current {color: #323946; display: inline-block; background: #fff; text-decoration: none;}
.menu {height: 56px; background: #311a09; padding: 0; z-index: 1;}
.logo {position: relative; height: 130px; margin-top: 0;}
.logo img { height:130px; width:auto}
.bg1 {background:url(../images/egim1.jpg) left no-repeat /*#0042bb*/#763200; color: #fff; height: 130px; font: 300 24px/32px 'Roboto', sans-serif; float:left; }
.bg1 img { float:left; margin:0 0; padding:0 0}
.bg1 span {font-size: 26px;}
.wa {position: relative; z-index: 2; margin-top: 0; float: right; width:auto; font:300 24px/42px 'Roboto', sans-serif; padding:10px 0; height:42px; margin: 0 14px;}
.wa a { background:url(../images/wa.png) left 0 no-repeat; padding:0 0 30px 50px; color:#FFF; display:table}
.fiyat {float: right; margin: 7px 14px 0 0;}


.slider {height:400px; width: 100%; margin-top: 30px;}

/* CONTENT ---------------------------------------- */
section {position: relative; margin: 0 auto;}
.slogan img {position: relative; z-index: 1; width: 100%; height: auto;}
.slogan p {position: relative; float: right; padding: 14px; color: #fff; font:300 20px/28px 'Roboto', sans-serif; background: rgba(0,0,0,0.7); z-index: 2; margin-top: -180px; width: 350px;}
.foto {width: 100%; height: auto;}
address p {font-style: normal; font-weight: normal; line-height: 28px;}
address span {display: inline-block; width: 80px; color: #999;}
address a {font-style: normal;}
.map {overflow: hidden;}
.map iframe {width: 980px; height: 340px;}


.int1 {border-left:1px solid #ccc; padding-left:25px; margin-left:0px; margin-right:-1px;}
.intmenu {height:100%; border-right:1px solid #ccc; margin-right:-1px; font-size:16px;}
	.intmenu ul {list-style:none;}
	.intmenu li {padding-bottom:12px;}
	.intmenu a {font-style:normal;}
	.intmenu a.current {color:#009fe3;}

/* FOOTER ---------------------------------------- */
footer {position: relative; margin: 0 auto; height: 70px; border-top: 1px solid #888; margin-top: 40px; font-size: 12px; line-height: 16px; color: #999; padding-top: 20px;}
.logofooter img {width: 56px; height: auto; float: left; margin: -18px 10px 0 0;}
.design {font-size: 10px; text-align: right; line-height: 10px; padding-top: 15px;}
.design img {width: 87px; height: 14px; float: right; margin: 3px 0 0 14px;}

	
/* RESPONSIVE ---------------------------------------- */
@media only screen and (min-width: 768px) and (max-width: 980px) {
	h1 {font-size: 27px;}
	h2 {font-size: 24px;}
	h3 {font-size: 21px;}
	h4 {font-size: 17px;}
	header nav {font:300 15px/56px 'Roboto', sans-serif;}
	header nav a {padding: 0 5px;}
	.bg1 {font: 300 21px/32px 'Roboto', sans-serif;}
	.bg1 span {font-size: 23px;}
	.slogan p {margin-top: -155px; width: 350px;}
	footer {font-size: 11px;}
	.map iframe {width: 768px; height: 300px;}
	.tanitim iframe {width: 768px; height: 433px;}
	}
@media only screen and (min-width: 480px) and (max-width: 767px) {
	h1 {font-size: 24px;}
	h2 {font-size: 22px;}
	h3 {font-size: 19px;}
	h4 {font-size: 16px;}
.wa {position: relative; z-index: 2; margin-top: 0; float: right; width:auto; font:300 24px/42px 'Roboto', sans-serif; padding:10px 0 0 18px; height:42px; margin: 0 14px;}
	header nav {height: auto; width: 480px; margin: 0 auto;}
	header nav a {color: #fff; background: #323946; padding: 0px; margin: 1px 0; position: relative; float: none; display: block; border: 1px solid #323946;}
	header nav a:hover, header nav a.current {color: #323946; background: #fff; border: 1px solid #323946; display: block;}
	.menu {background: none; position: relative; display: block; height: auto;}
	.logo {position: relative; z-index: 2; float: none; text-align: center;}
	.slider {height:244px;}
	.foto {margin: 10px 0;}
	.slogan {display: none;}
	footer {height:122px; font-size:11px;}
	.map iframe {width:480px; height:290px;}
	.tanitim iframe {width: 480px; height: 270px;}
	}
@media only screen and (max-width: 479px), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
	body {font: 15px/20px 'Roboto', sans-serif;}
	h1 {font-size: 23px;}
	h2 {font-size: 21px;}
	h3 {font-size: 18px;}
	h4 {font-size: 15px;}
	header nav {height: auto; width: 320px; margin: 0 auto;}
	header nav a {color: #fff; background: #323946; padding: 0px; margin: 1px 0; position: relative; float: none; display: block; border: 1px solid #323946;}
	header nav a:hover, header nav a.current {color: #323946; background: #fff; border: 1px solid #323946; display: block;}
	.menu {background: none; position: relative; display: block; height: auto;}
	.logo {position: relative; z-index: 2; float: none; text-align: center;}
	.slider {display: none;}
	.slogan {display: none;}
	.foto {display:none;}
	.libfoto a {pointer-events: none; cursor: default;}
	.map iframe {width:320px; height:260px;}
	footer {height:70px; font-size:10px;}
	.logofooter img {display: none;}
	.design {display:none;}
}