/********************************* Classes for XHTML default Tag *********************************/
html { overflow-x:hidden; }
@font-face { font-family: Museo300; src: url("Museo300-Regular.otf")/*tpa=http://www.arifguler.com/index_dosyalar/Museo300-Regular.otf*/; }
@font-face { font-family: Museo500; src: url("Museo500-Regular.otf")/*tpa=http://www.arifguler.com/index_dosyalar/Museo500-Regular.otf*/; }
@font-face { font-family: Museo700; src: url("Museo700-Regular.otf")/*tpa=http://www.arifguler.com/index_dosyalar/Museo700-Regular.otf*/; }
::selection{ background: #096; color:#cff; /* Safari */ }
::-moz-selection{ background: #096; color:#cff; /* Firefox */ }
* {	margin: 0; }
html, body { height:100%; }
body { margin:0; padding:0; font: .80em/1.3em arial, sans-serif, tahoma, "Trebuchet MS"; color:#999; background:#001b21 url("page_bg.gif")/*tpa=http://www.arifguler.com/index_dosyalar/page_bg.gif*/ repeat-x 0 0; }
h1, h2, h3, h4, h5, h6 { font-family: "Museo700",arial, verdana, sans-serif; margin:0; padding:5px 0; text-shadow:1px -1px 1px #000; }
h1, h2 { font:bold 2em "Museo300",aller,arial, verdana, sans-serif; color:#096; }
h3, h4 { font:bold 1.6em "Museo300",aller,arial, verdana, sans-serif; color:#699; }
h5 { font:bold 1.6em "Museo300",aller,arial, verdana, sans-serif; color:#999; }
form, img, a, li, ul { margin:0; padding:0; border:0; list-style:none; }
a { color:#096; text-decoration:none; outline:none; }
a:hover { text-decoration:underline; }
p { margin:0; line-height:1.5em; }

/************************ Classes for differentiation of uniq ID ************************/
#wrapper { min-height:100%; height:auto !important; height:100%; margin:0 auto -390px; }
.lsize, #content_area { width:940px; margin:0 auto; }

#content_area { padding:0; }
#left_panel { width:640px; float:left; position:relative; }
#right_panel { width:250px; float:right; }

#parallax {position:absolute; top:65px; overflow:hidden; width:990px; height:500px; z-index:1;}
#parallax #layer1 { background:url("cloud.png")/*tpa=http://www.arifguler.com/index_dosyalar/cloud.png*/ center top no-repeat; width:1100px; height:500px; }
#parallax #layer2 { background:url("mount.png")/*tpa=http://www.arifguler.com/index_dosyalar/mount.png*/ center top no-repeat; width:1200px; height:500px; }
#parallax #layer3 {
	width:1650px;
	height:500px;
	background-image: url("eagle.png")/*tpa=http://www.arifguler.com/index_dosyalar/eagle.png*/;
	background-repeat: no-repeat;
	background-position: center top;
}
	
#header {
	height:610px;
	overflow:hidden;
	background-image: url("header_bg.jpg")/*tpa=http://www.arifguler.com/index_dosyalar/header_bg.jpg*/;
	background-repeat: no-repeat;
	background-position: 50% 0;
}
#header_inner { background: url("header_bg_inner.jpg")/*tpa=http://www.arifguler.com/index_dosyalar/header_bg_inner.jpg*/ no-repeat 50% 0; height:387px; overflow:hidden; }
#menu {
	font: 1.4em "Museo300",aller,arial,sans-serif;
	width:940px;
	height:37px;
	line-height:34px;
	margin:30px auto 0 auto;
	overflow:hidden;
	background-image: url("logo_line.png")/*tpa=http://www.arifguler.com/index_dosyalar/logo_line.png*/;
	background-repeat: no-repeat;
	background-position: 0 0;
}
#menu #logo { display:block; float:left; width:139px; height:37px; text-indent:-999em; margin-right:15px; }
#menu #hire { display:block; float:right; width:90px; text-indent:-999em; }
#menu li { float:left; margin:0 15px; text-transform:uppercase; }
#menu li a { display:block; float:left; padding:0; color:#fff; cursor:pointer; text-decoration:none; }
#menu a span { font:normal .65em arial, verdana, sans-serif; background: url("menu_tooltip.png")/*tpa=http://www.arifguler.com/index_dosyalar/menu_tooltip.png*/ no-repeat 0 0; position:absolute; display:none; padding:13px 10px 10px 10px; width:113px; height:28px; overflow:hidden; margin-top:30px; z-index:10; text-transform:capitalize; color:#fff; }
#menu a:hover span { display:block; text-indent:0; }
#menu li a:hover { color:#390; text-decoration:none; }
#menu li.active a {
	color:#390;
	background-image: url("menu_arrow.gif")/*tpa=http://www.arifguler.com/index_dosyalar/menu_arrow.gif*/;
	background-repeat: no-repeat;
	background-position: 50% 0;
}
#hire:hover span { margin-left:-20px; }

#header_caption { position:absolute; z-index:10; margin-top:320px; width:400px; height:150px; }
#header_caption h1, #inner_caption h1 { font-size:1.7em; color:#699; text-shadow:1px -1px 1px #08181b; }
#header_caption h1 b, #inner_caption h1 b { color:#096; font-family:"Museo700",aller,arial,sans-serif; }
#header_caption a {
	display:block;
	float:left;
	width:261px;
	height:43px;
	text-indent:-999em;
	margin-top:10px;
	background-image: url("portfolio_but.png")/*tpa=http://www.arifguler.com/index_dosyalar/portfolio_but.png*/;
	background-repeat: no-repeat;
	background-position: 0 0;
}

#inner_caption { width:485px; margin-top:70px; }
#inner_caption h1 { font-size:1.7em; line-height:1.4em; color:#699; }

#qod-quote { font: 1.2em "Museo300",arial,sans-serif; color:#699; position:absolute; margin-top:150px; width:280px; height:160px; overflow:hidden; }
#qod-quote .qod-author { display:none; }
#qod-quote strong { font-weight:bold; font-family:"Museo700", arial, sans-serif; }


#services_list li, .services_item dd, .list li { margin:5px 0; background:url("green_arrow.gif")/*tpa=http://www.arifguler.com/index_dosyalar/green_arrow.gif*/ no-repeat 0 50%; padding-left:20px; font-weight:bold; }
.list li { padding:6px 0 6px 20px; background-position:0 10px; margin:0; border-bottom:1px solid #082228; line-height:1.5em; }

.services_item { padding-top:10px; }
.services_item dl { float:left; width:205px; margin-right:10px; }
.services_item dl.last { margin-right:0; }
.services_item .sub { font:bold 1.6em "Museo300",aller,arial, verdana, sans-serif; color:#699; text-shadow:1px -1px 1px #08181B; background:none; padding-left:0; }
.services_item .space { padding-top:10px; }
.services_item .space1 { padding-top:28px; }
.services_item dt { background: url("services_heading.gif")/*tpa=http://www.arifguler.com/index_dosyalar/services_heading.gif*/ no-repeat 0 0; height:50px; font:bold 1.6em/38px "Museo300",aller,arial, verdana, sans-serif; color:#699; text-shadow:1px -1px 1px #08181B; padding-left:14px; }
.services_item .price { background: url("hire_designer_price.png")/*tpa=http://www.arifguler.com/index_dosyalar/hire_designer_price.png*/ no-repeat 0 0; display:block; width:76px; height:61px; position:absolute; margin:-25px 0 0 129px; cursor:pointer; }
.services_item .developer { background: url("hire_developer_price.png")/*tpa=http://www.arifguler.com/index_dosyalar/hire_developer_price.png*/ no-repeat 0 0; }
.services_item .gdesigner { background: url("hire_gdesigner_price.png")/*tpa=http://www.arifguler.com/index_dosyalar/hire_gdesigner_price.png*/ no-repeat 0 0; }

.services_info { position:absolute; width:424px; margin-top:-40px; left:480px; background-color:#09323b; -moz-border-radius:10px; -webkit-border-radius:10px; border:3px solid #096; padding:10px 15px; }
.services_info .arrow { background: url("speech_arrow.gif")/*tpa=http://www.arifguler.com/index_dosyalar/speech_arrow.gif*/ no-repeat 0 0; display:block; width:22px; height:40px; position:absolute; margin:30px 0 0 -37px; }
.services_info li { padding:5px 0; border-top:1px solid #0f414c; line-height:1.5em; }
.html_services { width:380px; }
.html_prices { width:210px; left:394px; margin-top:0; display:block; }
.html_prices .hlight { color:#fbbd13; font-size:1.2em; }
.p2h_price { background: url("p2h_price.png")/*tpa=http://www.arifguler.com/index_dosyalar/p2h_price.png*/ no-repeat 0 0; display:block; width:76px; height:61px; position:absolute; margin:-25px 0 0 129px; cursor:pointer; }

.grad, .grad1 { position:relative; overflow:hidden; text-transform:uppercase; }
.grad span, .grad1 span {
	position:absolute;
	display:block;
#display:none; 	left:0;
	width:100%;
	height:35px;
	margin-top:-4px;
	background-image: url("heading_grad.png")/*tpa=http://www.arifguler.com/index_dosyalar/heading_grad.png*/;
	background-repeat: repeat-x;
	background-position: 0 0;
}
.grad1 span { background: url("heading_grad1.png")/*tpa=http://www.arifguler.com/index_dosyalar/heading_grad1.png*/ repeat-x 0 0; }

#how_diff li { background: url("hr_line.gif")/*tpa=http://www.arifguler.com/index_dosyalar/hr_line.gif*/ repeat-x 0 100%; padding:12px 0; }
#how_diff .thumb { float:left; width:205px; }
#how_diff .caption { float:left; width:435px; }
#how_diff h3 { padding-top:0; }

#hire_inst { width:455px; }

#testimonial {
	width:250px;
	height:163px;
	font-size:0.85em;
	background-image: url("testimonial.gif")/*tpa=http://www.arifguler.com/index_dosyalar/testimonial.gif*/;
	background-repeat: no-repeat;
	background-position: 0 0;
}
#testimonial .spacing { padding:30px 5px 0 15px; }
#testimonial p { height:85px; padding:0 2px; }
#testimonial .nav_but { margin-top:3px; float:left; }
#testimonial .cname { float:right; background: url("voice_icon.gif")/*tpa=http://www.arifguler.com/index_dosyalar/voice_icon.gif*/ no-repeat 0 50%; padding-left:25px; line-height:20px; font-weight:bold; margin-right:5px; color:#ccc; }

#psd_xhtml, #how_work {
	width:250px;
	height:100px;
	display:block;
	text-indent:-999em;
	margin-top:20px;
	position:relative;
	cursor:pointer;
	background-image: url("banner.gif")/*tpa=http://www.arifguler.com/index_dosyalar/banner.gif*/;
	background-repeat: no-repeat;
	background-position: 0 0;
}
#how_work { background-position:0 -106px; height:52px; }
#psd_xhtml span, #how_work span {
	display:block;
	width:49px;
	height:49px;
	position:absolute;
	right:-14px;
	top:-10px;
	background-image: url("price_99.png")/*tpa=http://www.arifguler.com/index_dosyalar/price_99.png*/;
	background-repeat: no-repeat;
	background-position: 0 0;
}
#how_work span {
	background-image: url("must_read.png")/*tpa=http://www.arifguler.com/index_dosyalar/must_read.png*/;
	background-repeat: no-repeat;
	background-position: 0 0;
}

#work_method h3 { background: url("number_bullet.gif")/*tpa=http://www.arifguler.com/index_dosyalar/number_bullet.gif*/ no-repeat 0 0; height:46px; line-height:35px; position:relative; padding-left:50px; font-size:1.8em; margin:15px 0 0 0; }
#work_method h3 span { position:absolute; color:#001b21; left:10px; top:4px; text-shadow:1px -1px 1px #b2e0d1; font-size:1.5em; font-weight:normal; }

.image-switcher-tools { float:right; margin-top:-25px; position:relative; z-index:1; }
.image-switcher-tools a { display:block; float:left; height:12px; width:12px; font-size:0; background: url("slide_swticher.gif")/*tpa=http://www.arifguler.com/index_dosyalar/slide_swticher.gif*/ 0 -26px; overflow:hidden; text-indent:-999em; margin-right:6px; }
.image-switcher-tools a:hover { background-position:0 -13px; }
.image-switcher-tools a.activeSlide, .image-switcher-tools a.activeSlide:hover { background-position:0 0; }
.homepage-carousel-shortbord .slides { height:320px; overflow:hidden; }

.bullet_list li { background:url("bullet.gif")/*tpa=http://www.arifguler.com/index_dosyalar/bullet.gif*/ no-repeat 0 10px; padding:4px 0 4px 18px; line-height:1.5em; border-bottom:1px solid #082228; }

#footer, .push { background:#000 url("footer_bg.gif")/*tpa=http://www.arifguler.com/index_dosyalar/footer_bg.gif*/ repeat-x 0 0; height:390px; }
.push { background:none; padding:0; }
#footer .footer_graphic {
	height:170px;
	padding-top:190px;
	background-image: url("footer_graphic.jpg")/*tpa=http://www.arifguler.com/index_dosyalar/footer_graphic.jpg*/;
	background-repeat: no-repeat;
	background-position: 50% 0;
}
#footer_left { width:630px; margin-top:10px; float:left; }
#footer_menu li { float:left;  }
#footer_menu li a { font: 1.2em "Museo300",arial,sans-serif; background:none; padding:4px; float:left; margin:0 8px; display:inline; text-decoration:underline; color:#699; font-weight:bold; text-decoration:none; }
#footer_menu li.active a, #footer_menu li a:hover { background: url("footer_menu_active.gif")/*tpa=http://www.arifguler.com/index_dosyalar/footer_menu_active.gif*/ no-repeat 50% 100%; text-decoration:none; }
#footer .footer2 a { color:#c4d7ed; }
#copyright { float:left; display:inline; width:380px; line-height:1.8em; font-size:.9em; font-weight:bold; margin:90px 0 0 12px; clear:both; }
#footer_right { width:250px; float:right; }

#contact_talk { background-color:#09323b; -moz-border-radius:10px; -webkit-border-radius:10px; border:3px solid #096; padding:10px 15px 0 15px; }
#contact_talk .arrow { background: url("speech_arrow.gif")/*tpa=http://www.arifguler.com/index_dosyalar/speech_arrow.gif*/ no-repeat 0 0; display:block; width:22px; height:40px; position:absolute; margin:10px 0 0 -37px; }
#contact_talk .talk_us li { background-image:url("talk_icons1.gif")/*tpa=http://www.arifguler.com/index_dosyalar/talk_icons1.gif*/; border-bottom:#0f414c 1px solid; }

.talk_us li {
	line-height:30px;
	border-bottom:#1a1a1a 1px solid;
	padding-left:35px;
	background-image: url("talk_icons.gif")/*tpa=http://www.arifguler.com/index_dosyalar/talk_icons.gif*/;
	background-repeat: no-repeat;
	background-position: 0 0;
}
.talk_us li a { color:#999; font-weight:bold; }
.talk_us .e-mail { background-position:0 8px; }
.talk_us .skype { background-position:0 -20px; }
.talk_us .g-talk { background-position:0 -115px; }
.talk_us .msn { background-position:0 -83px; }
.talk_us .yahoo { background-position:0 -51px; }

#social { width:250px; position:absolute; margin:-105px 0 0 -250px; }
#social a {
	width:30px;
	height:50px;
	display:block;
	float:left;
	margin-right:10px;
	text-indent:-999em;
	background-image: url("social_icon.gif")/*tpa=http://www.arifguler.com/index_dosyalar/social_icon.gif*/;
	background-repeat: no-repeat;
	background-position: 0 0;
}
#social a:hover { background-position:0 -57px; }
#social a.facebook { background-position:-40px 0; }
#social a.facebook:hover { background-position:-40px -57px; }
#social a.twitter { background-position:-80px 0; }
#social a.twitter:hover { background-position:-80px -57px; }
#social a.myspace { background-position:-120px 0; }
#social a.myspace:hover { background-position:-120px -57px; }
#social a.deviant { background-position:-160px 0; }
#social a.deviant:hover { background-position:-160px -57px; }

.resources .col1 { float:left; width:32%; }
.resources .col2 { float:left; width:32%; margin:0 2%; }
.resources .col3 { float:right; width:32%; }
.resources li p { font-weight:normal; }

/********************* Filer Portfolio *********************/
div#container { margin:-30px auto 0 auto; overflow: hidden; }
ul#filter { border-bottom:1px solid #334b51; font:bold 1.6em "Museo300",aller,arial, verdana, sans-serif; list-style: none; padding-left:170px; height:30px; position:relative; z-index:1; }
ul#filter li { float:left; padding:0 10px; }
ul#filter li:last-child { border-right:none; margin-right:0; padding-right:0; }
ul#filter a { padding:0 8px; color: #096; text-decoration:none; }
ul#filter li.current a, ul#filter a:hover { background:#699; color:#000; text-decoration:none; -moz-border-radius:5px; -webkit-border-radius:5px; }
ul#filter li.current a { color: #000; font-weight:bold; }
ul#filter li.current { padding-bottom:4px; background: url("portfolio_arrow.gif")/*tpa=http://www.arifguler.com/index_dosyalar/portfolio_arrow.gif*/ 50% 100% no-repeat; }
ul#portfolio { float: left; list-style: none; margin-top:20px; }
ul#portfolio li { float:left; margin:0 10px 10px 0; padding:0; width:303px; }
ul#portfolio a { display:block; width:100%; }
ul#portfolio a:hover { text-decoration:none; }
ul#portfolio img { display:block; background: url("loading_quote.gif")/*tpa=http://www.arifguler.com/index_dosyalar/loading_quote.gif*/ 50% 50% no-repeat; }
ul#portfolio a span { display:block; padding:5px; font-weight:bold; background:#000; color:#999; }
ul#portfolio a:hover span { background:#096; color:#000; }

/********************* Contact Page *********************/
input, textarea, select { font:.9em/1.2em arial, "Trebuchet MS", sans-serif, serif; color:#ccc; }
#contact_form { margin-top:10px; }
#contact_form .col1, #contact_form .col2 { float:left; padding:0 25px 0 0; width:300px; }
#contact_form .col2 { padding:0; }
#contact_form label { display:block; margin-bottom:5px; font-weight:bold; }
#contact_form .textbox, #contact_form select, #contact_form textarea { width:288px; padding:5px; margin-bottom:20px; border:1px solid #0f414c; background:#09323b; -moz-border-radius:5px; -webkit-border-radius:5px; }
#contact_form .human { width:50px; color:#096; font-weight:bold; }
#contact_form select { width:300px; padding:4px; }
#contact_form textarea { width:611px; margin-bottom:10px; }
#contact_form em, .star { color:#fbbd13; }
#contact_form input:focus, #contact_form select:focus, textarea#message:focus { border:1px solid #096; }
#contact_form input.error, #contact_form select.error, #contact_form textarea.error { border:1px dotted #fbbd13; margin-bottom:0; }
#contact_form label.error { color:#fbbd13; font-size:.85em; margin-bottom:0; }
#submit input { background: url("submit_but.gif")/*tpa=http://www.arifguler.com/index_dosyalar/submit_but.gif*/ no-repeat 0 0; width:245px; height:43px; cursor:pointer; border:0; padding:0; margin:0;  }
.require_field { font:normal .4em arial, verdana, serif; }

a.button { background: url("button.gif")/*tpa=http://www.arifguler.com/index_dosyalar/button.gif*/ 0 0 no-repeat; display:block; float:left; font-weight:bold; padding-left:15px; text-decoration:none; color:#fff; height:34px; line-height:34px; cursor:pointer; }
a.button span { background: url("button.gif")/*tpa=http://www.arifguler.com/index_dosyalar/button.gif*/ 100% 0 no-repeat; display:block; float:left; padding-right:15px; }
a.button:hover { background-position:0 100%; text-decoration:none; }
a.button:hover span { background-position:100% 100%; }

/********************* classes for differentiation of padding, border & color ********************/
.fl { float:left; }
.fr { float:right; }
.clear { clear:both; }
.center { text-align:center; }
.left { text-align:left; }
.right { text-align:right; }
.bold { font-weight:bold; }
.normal { font-weight:normal; }
.pad { padding:5px; }
.pad1 { padding:10px; }
.pt { padding-top:5px; }
.pt1 { padding-top:10px; }
.pb { padding-bottom:5px; }
.pb1 { padding-bottom:10px; }
.pl { padding-left:5px; }
.pl1 { padding-left:10px; }
.pr { padding-right:5px; }
.pr1 { padding-right:10px; }
.mrg { margin:5px; }
.mt { margin-top:5px; }
.mt1 { margin-top:10px; }
.mt2 { margin-top:20px; }
.mb { margin-bottom:5px; }
.mb1 { margin-bottom:10px; }
.ml { margin-left:5px; }
.ml1 { margin-left:10px; }
.mr { margin-right:5px; }
.mr1 { margin-right:10px; }
.white_text { color:#ffffff; }
.green_text { color:#096; }
.small_text { font-size:.85em; }
.mid_align { vertical-align:middle; }
.width_full { width:100%; }

.award { position:absolute; right:0; top:100px; z-index:200; }