@import url(http://fonts.googleapis.com/css?family=Headland+One&subset=latin,latin-ext);
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, font, 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 {	 
	 text-rendering: optimizeLegibility !important;

text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
-webkit-font-smoothing: antialiased !important; margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}body {line-height: 1;}ol, ul {list-style: none;}blockquote, q {quotes: none;}blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;} /* remember to define focus styles! */ :focus {outline: 0;} /* remember to highlight inserts somehow! */ins {text-decoration: none;}del {text-decoration: line-through;} /* tables still need 'cellspacing="0"' in the markup */ table {border-collapse: collapse;border-spacing: 0;
}
 

/*---------- BODY --------------------------------*/

body {
	text-align: center;
	background: #fafafa;
	padding-bottom: 220px;
   
	font:14px/20px  'Open Sans', sans-serif;
	font-weight:bold;
	color:#4b5660;
	height:100%;
	min-width:1280px;
}

a {
	text-decoration: none; 
}



.header {
	position:fixed; top:0%;   left:50%; margin-left:-50%;
	display:inline-block;  width:100%; background: url(../images/header.png) #fafafa; height:80px;
	 z-index:9; min-width:1280px;
	}

.headerMin {
  top:-40px; 
	}	




/*---------- Wrapper --------------------*/

nav {
  
	display:inline-block;  
	height:80px;
    vertical-align:top;
	display:inline-block;  z-index:9998; 
	margin:0 auto; 
	
	
}
.wrapper {
	width:100%; height:52px; background:#bbbbbb; display:inline-block; 
	}


.logo {
	position:relative; display:inline-block;  
	background:url(../images/sahinlogo.png) transparent no-repeat ; width:300px; height:80px; z-index:9998;
 
	}

.menuContainer {
	display:inline-block; position:relative;  vertical-align:top; margin-top:10px; 
 
	font:14px/20px  'Hammersmith One', sans-serif;
	}
 

nav ul {
	text-align: center;  
}

nav ul li {
		cursor: pointer; height:40px; padding-top:10px;
	
}
 
nav ul li.drop {
	position: relative; 	 
	width:110px; height:60px; margin:0px -5px 0px 0px ;

}

 .active {
	position: relative;  
	width:110px; height:60px; margin:0px -5px 0px 0px ;
	font:14px/20px  'Hammersmith One', sans-serif; color:#666
	

	 }

.show:hover a {
	color:#666;
	}

nav ul li.drop:hover {
 
	
	 font-weight:lighter; color:#222; 
}

nav ul > li { 
	display: inline-block; 	margin-top:30px;     
}

nav ul li a {
 
	color: #336699; font-size:15px; letter-spacing:0.05em;
 
 
}

nav ul li a:hover {
	color: #FFF;
}

nav .dropdownContain {
	  
	position: absolute;
	z-index: 999999;
	left: 50%;
	margin-left: -120px; /* half of width */
	top:60px; 
	opacity:1;
	z-index:0;
	 height:0px; overflow:hidden;

}


nav ul li:hover .dropdownContain { top: 60px; opacity:1; min-height:400px;  
-webkit-transition: all .55s ease-out;
-moz-transition: all .55s ease-out;
-ms-transition: all .55s ease-out;
-o-transition: all .55s ease-out;
transition: all .55s ease-out;
			
}

nav .dropOut {
	width: 200px;
  
	float: left;
	position: relative;
	margin-top: 0px;
	display:block; 
		
 
 
}

nav .dropOut ul {
	float: left;
	padding: 10px 0;
}


nav .dropOut ul li {
	text-align: left;
	float: left;
	width:200px; height:30px; 
 	margin: 0px 10px;
	color: #fff;
	transition: background 0.5s;
	-webkit-transition: background 0.5s;
	-moz-transition: background 0.5s;
	-o-transition: background 0.5s;
	 background:#00aeef;
	border-bottom:1px dotted #000;

}

nav .dropOut ul li:hover {
	background: #333;  
	
}

 
.dropOut a {
	font:12px/20px  'Open Sans', sans-serif; 
	color:#fff; letter-spacing:0.02em;
	}  

 


nav ul li:hover .underline { border-bottom-color: #666; }

 
/*
.drop:hover .dropOut {  margin-top: 10px; top:0px;
	opacity: 1;      
 -webkit-transition: all .75s ease;
       -moz-transition: all .45s ease;
        -ms-transition: all .45s ease;
         -o-transition: all .45s ease;
            transition: all .45s ease;
 }*/

.show {
 
 margin-top:12px;
 
  
	}
 

.mainContainer {
	position:relative;
	width:100%;  
 	margin-top:100px;
	z-index:1;
	background:url(../images/bg.png) repeat;

}


.page {
	position:relative;
	width:1000px;
	min-height:420px;
	margin:20px auto;
	padding:12px;
	background-color: #ffffff;
	border:1px solid #bbb;
	

	font-weight:lighter;
 
/*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/
-moz-box-shadow: 0px 0px 5px #aaa;
-webkit-box-shadow: 0px 0px 5px #aaa;
box-shadow: 0px 0px 5px #aaa;
/*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/

	
	}
	
.mainbg {
	width:560px; height:110px; display:inline-block; margin:10px 10px; padding:20px;
	}	

.mainbgsquare {
	width:191px; height:195px; display:inline-block; margin:20px 40px; padding:20px;
	background:url(../images/mainbgsquare-hover.png); cursor:pointer; vertical-align:top; z-index:2;
	overflow:hidden;
	}	

.mainbgsquare:hover {
	background:url(../images/mainbgsquare.png);
	}	


.mainbg p , .mainbgsquare p {
 
	color:#333; text-shadow:0px 0px 1px #999;
	padding:5px;
	 position:relative; z-index:1;
	}	
		
	
.wrapper {
	width:100%; height:4px; background:#020202; display:inline-block; position:relative; z-index:99999; 
	}	
.subMain {
	   width:980px;
 
	  background-color:transparent;  display:inline-block; position:relative;   padding:15px;  text-align:left;
	  color:#4a4a4a;
	  

	}	
 
 .subMain p {
	 margin-top:10px;
	 }
 
 .subMain li {
	  line-height:34px;   margin-left:23px;
	  list-style-image:url(../images/check16.png);
	  
	 }
 
 h2 {
	 font-size:18px;	 color:#fff; text-align:center; font-weight:normal;
	 display:inline-block; padding:5px; background:#00aeef ; width:50%; margin:15px auto;
	 }
	
 h3 {
	 font-size:14px;
	 line-height:1.3em;color:#00aeef;   margin-bottom:15px;
	 
	 }

h4 {
	
	 font-size:18px;
	 line-height:1.3em;color:#333333;
	 text-shadow:1px 1px 3px #c7c7c7;
	 display:inline-block;
	 margin:5px;
	 }
	 	 
	 
.box {
	padding:10px; width:260px; height:320px;  display:inline-block; vertical-align:top; margin:15px;
	border: 2px solid #c7c7c7; background:#e8e8e8;  
	
	-moz-box-shadow: 0px 0px 5px #aaa;
	-webkit-box-shadow: 0px 0px 5px #aaa;
	box-shadow: 0px 0px 5px #aaa;
	
	-moz-border-radius:5px; /* FF1+ */
	-webkit-border-radius:5px; /* Saf3-4 */
	border-radius:5px;
	cursor:pointer;
} 

.box:hover {
		-moz-box-shadow: 0px 0px 7px #000;
	-webkit-box-shadow: 0px 0px 7px #000;
	box-shadow: 0px 0px 7px #000;
	
	}

.shadow {
	width:306px;  height:27px; display:inline-block; margin-top:27px; margin-left:-25px;
	background:url(../images/boxShadow.png); 
	}
	
.boxFrame {
	
	display:inline-block; margin:5px; width:250px; height:140px; background:#FFF; padding:2px;
	
	}	

.box2 {
	padding:10px; width:260px; height:320px;  display:inline-block; vertical-align:top; margin:15px;
	border: 2px solid #c7c7c7; background:transparent; 
	
 
	
	-moz-border-radius:5px; /* FF1+ */
	-webkit-border-radius:5px; /* Saf3-4 */
	border-radius:5px;
	
 
	} 
 
 .ref {
	 margin:2%; padding:1%; position:relative;
	 width:16.67%; border:1px solid #CACACA; display:inline-block; vertical-align:top;
	 height:210px;  text-shadow:0px 0px 3px #3a3a3a;  text-align:center; 
	 color:#336699;
	 }	

.ref .img {
	width:96%; height:150px; display:inline-block;  padding:2%;
	} 

.ref img {

display: inline-block;
 
height: auto;
background-color: #fff;
border: 0px solid #ddd;
border-radius: 4px; 
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; vertical-align:middle;

 
	}


.ref:hover {
 
background-color: #fafafa;
border: 4px solid #ddd inset;
border-radius: 4px;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out; vertical-align:middle;
 
	}
.ref:hover img {
	
	-webkit-filter: grayscale(0%);
  -moz-filter: grayscale(0%);
  -ms-filter: grayscale(0%);
  -o-filter: grayscale(0%);
  filter: grayscale(0%);
  
  filter: gray; /* IE 6-9 */	
	
}
	
.ref .txt {
	display:inline-block;
	 background:#336699; color:#FFF; width:100%; height:50px;
  font-weight:bold; text-align:center;  padding:1%; line-height:50px;
	 
	}			

.box3 {
	
	padding:5px; width:100%; height:360px;  display:inline-block; vertical-align:top;  
	
	}
	
input[type=text],input[type=tel],input[type=email], textarea , input[type=submit]{
		border:1px solid #dadada; background:transparent; min-width:250px; min-height:35px; vertical-align:top;
	padding:5px;
	}			

.seperator {
	background:#00aeef repeat-x; width:100%; height:3px; display:inline-block; margin:0px auto;
	}	
	
	
.cross {
	background:url(../images/cross-line-bg.png); height:20px; display:inline-block; margin:0 20px;
	}	

.footer {
	 position:relative; width:96%; padding:2%; background:#333;   color:#dadada; top:200px;  height:100px; overflow:hidden;
	 
	 transition: all 1s;
    -moz-transition: all 1s;
    -webkit-transition: all 1s;
    -o-transition: all 1s;
	font: 13px Verdana, 'Lucida Grande';
	}	

.footerMin {
	height:300px; top:0px;
	}	

.footer li {
	font-size:12px; font-weight:lighter; line-height:25px; width:200px;   text-align:left;
	}
.footer a {
		font: 13px;color:#dadada;
	}

.footer a:hover {
	text-decoration:underline; 
	}
	
.footer .sitemap {
	width:200px; position:relative; margin:10px auto;  display:inline-block;vertical-align:top;
	}	

.footer h4 {
	
	 font-size:18px;
	 line-height:1.3em; color:#; 
	 text-shadow:1px 1px 3px #333;
	 display:inline-block;
	 margin:5px;
	 }

#back-top {
	 position:fixed; cursor:pointer;
	bottom:200px; right:50px; z-index:99;
	background:url(../images/bottomtop.png) transparent; width:33px; height:33px;
		transition: background 0.1s;
-webkit-transition: background 0.1s;
-moz-transition: background 0.1s;
-o-transition: background 0.1s;

}

#back-top:hover {
	background:url(../images/bottomtop.png) 0px -5px;
}


.leftMenu {
	
	position:fixed; width:250px; height:200px; background:transparent; left:-200px; top:40%; cursor:pointer;
			transition: all 0.9s;
-webkit-transition: all 0.9s;
-moz-transition: all 0.9s;
-o-transition: all 0.9s; z-index:99999999;
	
	}
	
.leftMenu:hover {
	left:0px;  
	}	

.leftMenu .degree90 {
	
	width:50px; height:200px; background: url(../images/hesaplamalar.png) transparent no-repeat; display:inline-block; position:absolute; right:0; top:0;
	
	
	}

.leftMenu ul {
	margin-top:50px; text-align:left; margin-left:5px;
	}	

.leftMenu li {
	
	font-size:14px; line-height:22px; color:white; width:150px; height:20px; background:#999; margin:20px; padding:10px;
	transition: background 0.1s;
	-webkit-transition: background 0.1s;
	-moz-transition: background 0.1s;
	-o-transition: background 0.1s;
	
		-moz-box-shadow: 0px 0px 5px #aaa;
	-webkit-box-shadow: 0px 0px 5px #aaa;
	box-shadow: 0px 0px 5px #aaa;
	
	-moz-border-radius:5px; /* FF1+ */
	-webkit-border-radius:5px; /* Saf3-4 */
	border-radius:5px;
	cursor:pointer;
	
	}
.leftMenu li:hover {
	
	background:#666;
	
	}	

.leftMenu a {
	color:inherit;
	}	

.leftMenu .content {
	width:200px; height:200px; display:inline-block; position:absolute; left:0; top:0; background:#333; 
	}	

table {
		overflow:hidden;
		border:1px solid #d3d3d3;
		background:#fefefe;
		width:96%;
		margin:2% auto 0;
		-moz-border-radius:5px; /* FF1+ */
		-webkit-border-radius:5px; /* Saf3-4 */
		border-radius:5px;
		-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
		-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
	}
	
	th, td {padding:18px 28px 18px; text-align:center; }
	
	th {padding-top:22px; text-shadow: 1px 1px 1px #fff; background:#e8eaeb;}
	
	td {border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;}
	
	tr.odd-row td {background:#f6f6f6;}
	
	td.first, th.first {text-align:left}
	
	td.last {border-right:none;}
	
	/*
	Background gradients are completely unnessary but a neat effect.
	*/
	
	td {
		background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);
		background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));
	}
	
	tr.odd-row td {
		background: -moz-linear-gradient(100% 25% 90deg, #f6f6f6, #f1f1f1);
		background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f1f1f1), to(#f6f6f6));
	}
	
	th {
		background: -moz-linear-gradient(100% 20% 90deg, #e8eaeb, #ededed);
		background: -webkit-gradient(linear, 0% 0%, 0% 20%, from(#ededed), to(#e8eaeb));
	}
	
	/*
	I know this is annoying, but we need dditional styling so webkit will recognize rounded corners on background elements.
	Nice write up of this issue: http://www.onenaught.com/posts/266/css-inner-elements-breaking-border-radius
	
	And, since we've applied the background colors to td/th element because of IE, Gecko browsers also need it.
	*/
	
	tr:first-child th.first {
		-moz-border-radius-topleft:5px;
		-webkit-border-top-left-radius:5px; /* Saf3-4 */
	}
	
	tr:first-child th.last {
		-moz-border-radius-topright:5px;
		-webkit-border-top-right-radius:5px; /* Saf3-4 */
	}
	
	tr:last-child td.first {
		-moz-border-radius-bottomleft:5px;
		-webkit-border-bottom-left-radius:5px; /* Saf3-4 */
	}
	
	tr:last-child td.last {
		-moz-border-radius-bottomright:5px;
		-webkit-border-bottom-right-radius:5px; /* Saf3-4 */
	}