body {margin:0; background : #fff; font-family:"Arial", sans-serif; color:#1b1b1b;}
html { overflow : auto; }
a { text-decoration : none; }
img { border : 0; }

#wrapper { position:relative; width : 99%; margin : 0 auto; background:#fff; overflow : hidden;}

.logo { width : 100%; height :80px; margin : 0 auto;  background:#00182F; border-bottom : 1px solid #fff;}	
.home:hover , .dil:hover { background : linear-gradient(#1b1b1b,#666666); background: -webkit-linear-gradient(top,#1b1b1b,#666666); }

div.orta-row:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
div.orta-item { float: left; width: 100%; }
div.orta-item img { display: block; width: 100%; height: auto; }


div.gallery-row:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
div.gallery-item { float: left; width: 16.66666666%; }
div.gallery-item a { display: block; margin: 5px; border: 1px solid #3c3c3c; }
div.gallery-item img { display: block; width: 100%; height: auto; }

.menu { position : relative; width : 100%; top : 5px; float : left;}
.menu .eleman:hover { background : linear-gradient(#aaaaaa,#666666); background: -webkit-linear-gradient(top,#aaaaaa,#666666); color : #fff; text-shadow : 1px 1px #1b1b1b;}

.dip
	{
		position : relative;
		color : #333333;
		text-align : center;
		line-height : 120%;
	}	
.dip a
	{
		text-decoration : none;
		color : #111111;
	}	
.dip a:hover
	{
		color : #336699;
	}

.harita { width : 100%; height : auto; }

.anabolum:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; margin-left : auto; margin-right : auto;}

.tekne { float : left; width : 30%; height : auto; border : 1px solid #999999; padding : 1px;  margin : 0; padding-bottom : 5px; margin-right : 2%; margin-bottom : 2%;}
.tekne:hover { border-color : #336699; background-color : #eee; }
.teknefoto { width : 99%; height : auto;}



@media screen and (max-width:320px) 
{
	#ustmenu { background : #336699; height : 30px; border-bottom : 1px solid #aaa; overflow : hidden;}	
	#ustmenu p { text-align : center; font-size : 10px; color : #fff; }
	.home { position : relative; float : left; left : 0; width : 60px; height : 100%; display : block; color : #fff; background : linear-gradient(#666666,#1b1b1b); background: -webkit-linear-gradient(top,#666666,#1b1b1b); font-size : 13px; text-align : center; padding-top :8px;}
	.dil { position : relative; float : right ; right: 0; width : 40px; height : 100%; display : block; color : #fff; background : linear-gradient(#666666,#1b1b1b); background: -webkit-linear-gradient(top,#666666,#1b1b1b); font-size : 13px; text-align : center; padding-top :8px;}	
	
	.menu .eleman { display : block; font-size : 12px; line-height :25px; height : 25px; padding : 5px;  padding-left : 10px; text-decoration : none; background : linear-gradient(#eeeeee,#aaaaaa); background: -webkit-linear-gradient(top,#eeeeee,#aaaaaa);  margin-top : 1px; color : #1b1b1b; text-shadow : 1px 1px #fff; letter-spacing : 0.5px;}

	.dip { font-size : 11px; }

	h1	{ margin : 0; padding : 0; margin-top : 10px; margin-bottom : 10px; color : #336699; text-align : left; font-size : 16px; font-weight : bold; float : left;}
	h2  { float : right; margin : 0; padding : 0; margin-top : 12px; color : #990000; font-size :13px; font-weight : bold; }
	.icerik_yazi { margin : 0; padding : 0; clear : left; text-align : left; font-size : 12px; color : #333333; }
	.foto { margin-left : 5px; margin-bottom : 5px; float : right; align : right; width : 120px; height : auto; }

	.tekneadi { margin : 0; color : #336699; text-align : center; font-size : 11px; font-weight : bold; }
	.teknea { margin : 0; color : #333333; text-align : center; font-size : 10px; }
	
	.teknesol { margin : 0; padding : 0; text-align : right; font-size : 12px; color : #333333; font-weight : bold; }
	.teknesag { margin : 0; padding : 0; padding-left : 5px; text-align : left; font-size : 12px; color: #333; }
	.teknegenis { margin : 0; padding : 0; text-align : left; font-size : 13px; color : #333333; font-weight : bold; text-decoration : underline; }
	.teknenot { margin : 0; padding : 0; text-align : left; font-size : 10px; color : #333333; }

	.fleet { display : block; font-size : 15px; line-height :30px; height : 30px; padding : 5px;  padding-left : 10px; text-decoration : none; background : linear-gradient(#333333,#aaaaaa); background: -webkit-linear-gradient(top,#333333,#aaaaaa);  margin-top : 1px; color : #fff; text-shadow : 1px 1px #333; letter-spacing : 0.5px;}
	.fleet:hover { background : linear-gradient(#aaaaaa,#333333); background: -webkit-linear-gradient(top,#aaaaaa,#333333); }
	

#map-canvas {
		width : 100%;      
        height: 200px;
        margin: 0px;
        padding: 0px
      }

}

@media screen and (min-width:321px) and (max-width:450px)
{
	#ustmenu { background : #336699; height : 35px; border-bottom : 1px solid #aaa; overflow : hidden;}	
	#ustmenu p { text-align : center; font-size : 11px; color : #fff; }	
	.home { position : relative; float : left; left : 0; width : 70px; height : 100%; display : block; color : #fff; background : linear-gradient(#666666,#1b1b1b); background: -webkit-linear-gradient(top,#666666,#1b1b1b); font-size : 14px; text-align : center; padding-top :9px;}
	.dil { position : relative; float : right ; right: 0; width : 50px; height : 100%; display : block; color : #fff; background : linear-gradient(#666666,#1b1b1b); background: -webkit-linear-gradient(top,#666666,#1b1b1b); font-size : 14px; text-align : center; padding-top :9px;}	

	.menu .eleman { display : block; font-size : 13px; line-height :30px; height : 30px; padding : 5px; padding-left : 10px; text-decoration : none; background : linear-gradient(#eeeeee,#aaaaaa); background: -webkit-linear-gradient(top,#eeeeee,#aaaaaa);  margin-top : 1px; color : #1b1b1b; text-shadow : 1px 1px #fff; letter-spacing : 0.5px;}

	.dip { font-size : 12px; }
	
	h1	{ margin : 0; padding : 0; margin-top : 10px; margin-bottom : 10px; color : #336699; text-align : left; font-size : 18px; font-weight : bold; float : left; }
	h2  { float : right; margin : 0; padding : 0; margin-top : 12px; color : #990000; font-size :14px; font-weight : bold; }
	
	.icerik_yazi { margin : 0; padding : 0; clear : left; text-align : left; font-size : 13px; color : #333333; }
	.foto { margin-left : 5px; margin-bottom : 5px; float : right; align : right; width : 160px; height : auto; }

	.tekneadi { margin : 0; color : #336699; text-align : center; font-size : 12px; font-weight : bold; }
	.teknea { margin : 0; color : #333333; text-align : center; font-size : 11px; }

	.teknesol { margin : 0; padding : 0; text-align : right; font-size : 13px; color : #333333; font-weight : bold; }
	.teknesag { margin : 0; padding : 0; padding-left : 5px; text-align : left; font-size : 13px; color: #333; }
	.teknegenis { margin : 0; padding : 0; text-align : left; font-size : 14px; color : #333333; font-weight : bold; text-decoration : underline; }
	.teknenot { margin : 0; padding : 0; text-align : left; font-size : 11px; color : #333333; }

	.fleet { display : block; font-size : 16px; line-height :30px; height : 30px; padding : 5px;  padding-left : 10px; text-decoration : none; background : linear-gradient(#333333,#aaaaaa); background: -webkit-linear-gradient(top,#333333,#aaaaaa);  margin-top : 1px; color : #fff; text-shadow : 1px 1px #333; letter-spacing : 0.5px;}
	.fleet:hover { background : linear-gradient(#aaaaaa,#333333); background: -webkit-linear-gradient(top,#aaaaaa,#333333); }

#map-canvas {
		width : 100%;      
        height: 250px;
        margin: 0px;
        padding: 0px
      }
	
}

@media screen and (min-width:451px) and (max-width:600px)
{
	#ustmenu { background : #336699; height : 40px; border-bottom : 1px solid #aaa; overflow : hidden;}	
	#ustmenu p { text-align : center; font-size : 13px; color : #fff; }	
	.home { position : relative; float : left; left : 0; width : 75px; height : 100%; display : block; color : #fff; background : linear-gradient(#666666,#1b1b1b); background: -webkit-linear-gradient(top,#666666,#1b1b1b); font-size : 15px; text-align : center; padding-top :10px;}
	.dil { position : relative; float : right ; right: 0; width : 55px; height : 100%; display : block; color : #fff; background : linear-gradient(#666666,#1b1b1b); background: -webkit-linear-gradient(top,#666666,#1b1b1b); font-size : 15px; text-align : center; padding-top :10px;}	

	.menu .eleman { display : block; font-size : 14px; line-height :30px; height : 30px; padding : 5px; padding-left : 10px; text-decoration : none; background : linear-gradient(#eeeeee,#aaaaaa); background: -webkit-linear-gradient(top,#eeeeee,#aaaaaa); margin-top : 1px; color : #1b1b1b; text-shadow : 1px 1px #fff; letter-spacing : 0.5px;}

	.dip { font-size : 13px; }
	
	h1	{ margin : 0; padding : 0; margin-top : 10px; margin-bottom : 10px; color : #336699; text-align : left; font-size : 20px; font-weight : bold; float : left; }
	h2  { float : right; margin : 0; padding : 0; margin-top : 12px; color : #990000; font-size :15px; font-weight : bold; }	
	
	.icerik_yazi { margin : 0; padding : 0; clear : left; text-align : left; font-size : 14px; color : #333333; }
	.foto { margin-left : 5px; margin-bottom : 5px; float : right; align : right; width : 210px; height : auto; }

	.tekneadi { margin : 0; color : #336699; text-align : center; font-size : 13px; font-weight : bold; }
	.teknea { margin : 0; color : #333333; text-align : center; font-size : 12px; }
	
	.teknesol { margin : 0; padding : 0; text-align : right; font-size : 14px; color : #333333; font-weight : bold; }
	.teknesag { margin : 0; padding : 0; padding-left : 5px; text-align : left; font-size : 14px; color: #333; }
	.teknegenis { margin : 0; padding : 0; text-align : left; font-size : 15px; color : #333333; font-weight : bold; text-decoration : underline; }
	.teknenot { margin : 0; padding : 0; text-align : left; font-size : 12px; color : #333333; }
	
	.fleet { display : block; font-size : 17px; line-height :35px; height : 35px; padding : 5px;  padding-left : 10px; text-decoration : none; background : linear-gradient(#333333,#aaaaaa); background: -webkit-linear-gradient(top,#333333,#aaaaaa);  margin-top : 1px; color : #fff; text-shadow : 1px 1px #333; letter-spacing : 0.5px;}
	.fleet:hover { background : linear-gradient(#aaaaaa,#333333); background: -webkit-linear-gradient(top,#aaaaaa,#333333); }
	
#map-canvas {
		width : 100%;      
        height: 300px;
        margin: 0px;
        padding: 0px
      }
}

@media screen and (min-width:601px)
{
	#wrapper { max-width : 800px; }
	#ustmenu { background : #336699; height : 45px; border-bottom : 1px solid #aaa; overflow : hidden;}	
	#ustmenu p { text-align : center; font-size : 15px; color : #fff; }	
	.home { position : relative; float : left; left : 0; width : 80px; height : 100%; display : block; color : #fff; background : linear-gradient(#666666,#1b1b1b); background: -webkit-linear-gradient(top,#666666,#1b1b1b); font-size : 16px; text-align : center; padding-top :13px;}
	.dil { position : relative; float : right ; right: 0; width : 60px; height : 100%; display : block; color : #fff; background :linear-gradient(#666666,#1b1b1b); background: -webkit-linear-gradient(top,#666666,#1b1b1b); font-size : 16px; text-align : center; padding-top :13px;}	
	
	.menu .eleman { display : block; font-size : 15px; line-height :30px; height : 30px; padding : 10px;  text-decoration : none; background : linear-gradient(#eeeeee,#aaaaaa); background: -webkit-linear-gradient(top,#eeeeee,#aaaaaa); margin-top : 1px; color : #1b1b1b; text-shadow : 1px 1px #fff; letter-spacing : 0.5px;  }
	
	.dip { font-size : 14px; }	
	
	h1	{ margin : 0; padding : 0; margin-top : 10px; margin-bottom : 10px; color : #336699; text-align : left; font-size : 21px; font-weight : bold; float : left; }
	h2  { float : right; margin : 0; padding : 0; margin-top : 12px; color : #990000; font-size :16px; font-weight : bold; }
	
	.icerik_yazi { margin : 0; padding : 0; clear : left; text-align : left; font-size : 15px; color : #333333; }
	.foto { margin-left : 5px; margin-bottom : 5px; float : right; align : right; width : 260px; height : auto; }
	
	.tekneadi { margin : 0; color : #336699; text-align : center; font-size : 14px; font-weight : bold;  }
	.teknea { margin : 0; color : #333333; text-align : center; font-size : 13px;  }
	
	.teknesol { margin : 0; padding : 0; text-align : right; font-size : 15px; color : #333333; font-weight : bold; }
	.teknesag { margin : 0; padding : 0; padding-left : 5px; text-align : left; font-size : 15px; color: #333; }
	.teknegenis { margin : 0; padding : 0; text-align : left; font-size : 16px; color : #333333; font-weight : bold; text-decoration : underline; }
	.teknenot { margin : 0; padding : 0; text-align : left; font-size : 13px; color : #333333; }
	
	.fleet { display : block; font-size : 17px; line-height :35px; height : 35px; padding : 5px;  padding-left : 10px; text-decoration : none; background : linear-gradient(#333333,#aaaaaa); background: -webkit-linear-gradient(top,#333333,#aaaaaa);  margin-top : 1px; color : #fff; text-shadow : 1px 1px #333; letter-spacing : 0.5px;}
	.fleet:hover { background : linear-gradient(#aaaaaa,#333333); background: -webkit-linear-gradient(top,#aaaaaa,#333333); }
	
#map-canvas {
		width : 100%;      
        height: 350px;
        margin: 0px;
        padding: 0px
      }
	
}