﻿/*##################
Site Name: Varyao
Site URI: http://www.varyap.com.tr
Description: Varyap sitesi için hazırlanan css dosyası.
Author: Kerim ÇALIK - kerim.calik@trafo.com.tr
Company: Trafo - www.trafo.com.tr
Company URL: http://www.trafo.com.tr
####################*/

/*
Genel

color: #adadad
bg: #000
font: Helvetica
font-size: 12px 
*/
/*@charset "utf-8";*/
html { height:100%}
body 
{
	background-color:#000000;
	font-family: Helvetica,Verdana,Tahoma;
	font-size: 12px;
	color: #adadad;
	text-shadow: #000 0 0 0;
	-moz-opacity: 0.99;
	-height: 100%;
	height: auto !important;
	height: 100%;
	margin:0 auto;
	padding:0;	
}
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

* html .clearfix {zoom: 1;}
*:first-child+html .clearfix {zoom:1;}

.opera body {padding-top:10px;}
.ie6 body {padding-top:17px;}
img {overflow: hidden;text-decoration: none;}
p {padding-bottom:10px;line-height:14px}
.clr {clear: both;margin: 0px;padding: 0px;}

body #container {margin:0 auto;width:902px;background-color:#000;padding-top:29px;}
#footer,#top-space,#header,#language,#slide-image,#top-menu {width:902px;}
#content-container {width:100%;float:left;min-height:300px;height:auto !important;height:300px;}

#top-space {float:left;height:21px;}
#middle-space {float:left;width:45px;}
#slide-image {float:left;height:228px;}

a.white:link,a.white:hover,a.white:visited {text-decoration:none;color:#adadad;}
a.white:hover {color:#fff;background-color:#840000;}

a.gray:link,a.gray:hover,a.gray:visited,a.gray:hover {text-decoration:none;color:#adadad;}
a.gray:hover {background-color:#840000;}

a.bubble:link,a.bubble:hover,a.bubble:visited,a.bubble:hover {text-decoration:none;color:#adadad;padding:3px;background-color:#840000;}
a.bubble:hover {background-color:#fff;color:#840000;}

/*Body*/
#content {float:left;width:676px;padding-left:45px;}
#text,.text {float:left;width:100%;padding-bottom:20px;overflow:hidden}

#text ul,.text ul {list-style-type:square;margin-left:20px;line-height:18px;}
#text a:link,.text a:link,
#text a:hover,.text a:hover,
#text a:visited,.text a:visited
{text-decoration:underline;color:#adadad;}
#text a:hover,.text a:hover {color:#fff;background-color:#840000;text-decoration:none;}

/*Projects List*/
#text h1,.text h1 {color:#fff;font-size:18px;font-weight:bold;padding-bottom:10px;}
#text h1 span,.text h1 span {color:#820000;font-size:13px;}
#text p.small,.text p.small {font-size:11px;color: #adadad;}

#text div.toogle,
.text div.toggle {font-size:13px;font-weight:bold;color:#fff;cursor:pointer;padding-top:10px;}
#text div.toogle-target,
.text div.toggle-target {display:none;margin-top:10px;line-height:15px;}
.hover-toggle {color:#000000; text-decoration:underline;}

.projects-container {width:645px;float:left;height:99px;padding-bottom:10px;}
.projects-right {width:402px;float:left;padding-left:10px;}
.projects-left {width:233px;height:99px;float:left;}

/*Project Detail*/
#project-left {float:left;width:446px;padding-right:10px;padding-bottom:20px;}
#project-left p {padding:0;padding-top:10px;}
#project-left div.toggle {font-size:13px;font-weight:bold;color:#fff;cursor:pointer;padding-top:10px;padding-bottom:10px;}
#project-left div.toggle-target {display:none;padding-top:10px;line-height:15px;}

#project-left h1 {font-size:18px;color:#fff;padding-bottom:10px;padding-top:10px;}
#project-left h1 span {color:#820000;font-size:12px;}
#project-right {float:left;width:200px;padding-left:10px;padding-right:10px;padding-bottom:20px;}
#project-right img {padding-bottom:10px;}
#project-right h1 {color:#fff;font-size:15px;padding-bottom:10px;}
#project-right h3 {background-color:#820000;color:#fff;font-size:12px;font-weight:bold;padding:3px 3px 3px 7px;width:190px;float:left;margin-bottom:5px;}
#project-right p {font-size:11px;padding:0px 7px 10px 7px;}
p.more {color:#820000;font-size:11px;}
a.white:link,a.white:visited,a.white:hover {color:#fff;text-decoration:underline;font-size:11px;}
a.white:hover {color:#820000;background-color:#fff;text-decoration:none;}

/*Gallery*/
#gallery-list {float: left; width: 474px; text-align: center;} /*462*/
#gallery-list a:link,
#gallery-list a:visited,
#gallery-list a:active,
#gallery-list a:hover {text-decoration:none;background-color:Transparent;position:relative;}
#gallery-list .gallery-images {width: 142px; float: left; height: 142px; border: solid 3px #191919;margin-right: 10px; margin-bottom: 10px;}
#gallery-list .gallery-images img {vertical-align: middle}
.releated-project {float: left; width: 156px; padding-left: 23px; padding-right: 23px; overflow:hidden}
.releated-project h2 {color:#FFFFFF;font-size:15px;padding-bottom:10px;}
.releated-project img {border: solid 2px #191919;margin-bottom:5px;}
.ie6 #gallery-list .gallery-images {float:left;padding:0;}
.ie6 .releated-project {width:156px;padding-left:10px;}
.title 
{
	display:none;
	width: 142px;
	height:30px;
	background:#000;
	color:#fff;	
	left:0;
	bottom:30px;
	position:relative;
	border:none;
	margin:0;
	-moz-opacity:0.7;	
	-khtml-opacity: 0.7;
	opacity:0.7;
}
.ie8 .title,
.ie7 .title {background:url(../media/site/transparent.png) repeat left top;bottom:33px;}
.ie6 .title 
{
	background-image:none;
	background-color:#000000;
	position:absolute;
	margin-left:-145px;
	left:auto;
	bottom:auto;
	margin-top:112px;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
	vertical-align:middle;
}
/*Site Map*/
#site-map {float:none;width:100%;height:35px;}
span.next {color:#fff;font-size:17px;}
a.red:link,a.red:visited,a.red:hover {color:#820000;font-size:17px;text-decoration:none;}
a.red:hover {text-decoration:underline;}

/*Content Menu*/
#content-menu {float:left;width:174px;padding-left:7px;}
#section {border-bottom:solid 1px #191919;height:22px;width:160px;float:left;padding-left:14px;font-weight:bold;color:#fff;font-size:15px;}
/*#content-nav {list-style-type:none;list-style-position:outside;margin:0;padding:0;padding-left:3px;}*/
/*.hover-contentmenu {background:url(../media/site/bg-contentmenu.png) no-repeat left top;}*/
#content-menu ul.ac-menu, 
#content-menu ul.ac-menu ul {list-style-type:none;margin: 0;padding: 0;width: 160px;}
#content-menu ul.ac-menu {margin-top:10px;}
#content-menu ul.ac-menu a {display: block;text-decoration: none;}
#content-menu ul.ac-menu li {border-bottom:dotted 1px #262626;}
#content-menu ul.ac-menu li a {color: #fff;height:16px;padding:5px 0px 3px 10px;}
#content-menu ul.ac-menu li a.selected {background:url(../media/site/content-menu.png) no-repeat top left;}
#content-menu ul.ac-menu li a.selected-main {background:url(../media/site/content-menu.png) no-repeat bottom left;cursor:default;}
#content-menu ul.ac-menu li a:hover {background:url(../media/site/content-menu.png) no-repeat bottom left;}
#content-menu ul.ac-menu li ul {margin-bottom:1px;}
#content-menu ul.ac-menu li ul li {border:none;border-left:solid 1px #262626;border-right:solid 1px #262626;border-top:solid 1px #262626;border-collapse:separate;}
#content-menu ul.ac-menu li ul li a {background-image:none;background-color: #111;color: #fff;padding-left: 20px;min-height:16px;height:auto !important;}
#content-menu ul.ac-menu li ul li a:hover {font-weight:bold;color:#adadad;}
#content-menu ul.ac-menu li ul li a:hover,
#content-menu ul.ac-menu li ul li a:visited {background-image:none;background-color:#111;}

/*Header*/
#header {float:left;height:64px;}
#logo {float:left;width:152px;padding-left:0px;}
#language {float:left;text-align:right;height:21px;font-size:10px;}
#language ul {list-style-type:none;list-style-position:outside;margin:0;padding:0;}
#language ul li {display:inline;}
#language ul li a:link,
#language ul li a:hover,
#language ul li a:visited {text-decoration:none;color:#adadad;padding:3px;position:relative;}
#language ul li a:hover {color:#fff;background-color:#840000;}

/*Top Menu*/
#top-menu {float:left;height:55px;}
#menu {float:left;width:750px;text-align:center;overflow:hidden;line-height:normal;height:40px;}
.menu-item {float:left;width:106px;height:40px;}
#menu a:link,#menu a:visited,#menu a:hover {text-decoration:none;color:#d5d5d5;font-size:13px;font-weight:bold;background-color:Transparent;}
#menu a:hover {color:#fff;}
.seperator {float:left;width:1px;height:15px;background-color:#3e3e3e;}
.hover-topmenu {background:url(../media/site/bg-topmenu.png) no-repeat center top;}

/*Footer*/
#footer {float:left;background:url(../media/site/footer-line.gif) repeat-x top left;height:99px;padding:9px 0px 0px 0px;}
#holding-logo {float:left;width:147px;padding-left:20px;}
#footer-contact {float:left;width:485px;padding-top:15px;}
#footer-contact ul {list-style-type:none;list-style-position:outside;margin:0;padding:0;}
#footer-contact ul li {display:inline;padding-left:15px;padding-right:15px;font-size:10px;}
#copyright {float:left;width:250px;font-size:10px;text-align:right;padding-top:15px;}


/*News*/
#news-container {width: 902px; float: left;padding-bottom:20px;}
#news-caption {float: left; width: 142px; padding: 0 17px 0 17px;}
#news-items {list-style-type:none;}
.news-text,#news-text {float: left; width: 726px;padding-bottom:20px;height:40px;overflow:hidden;}
.news-text {height:auto;width:100%;}
.news-item h1 {font-size:14px;}
.news-item h1 span {font-size:12px;}
.news-item .news-title {color:#fff;font-weight:bold;font-size:13px;}
.news-item .news-title span {color:#820000;}
/*.date {color:#fff;font-weight:bold;font-size:13px;}*/

/*More Button*/
a.more:link,
a.more:visited,
a.more:hover 
{
	background:url(../media/site/bg-button.png) no-repeat top left;
	width:55px;
	height:11px;
	text-decoration:none;
	position:absolute;
	margin-top:3px;
	margin-left:2px;
}
a.more:hover {background-position:bottom left;}

.ie6 a.more:hover {margin-top:-1px;}


/*More Button*/
a.more_news:link,
a.more_news:visited,
a.more_news:hover 
{
	background:url(../media/site/bg-button.png) no-repeat top left;
	width:55px;
	height:11px;
	text-decoration:none;
	margin-top:3px;
	margin-left:2px;
	text-indent: -9999px;
	display: block;
	display: inline-block;

}
a.more_news:hover {background-position: 0 -25px ;}

.ie6 a.more_news:hover {margin-top:-1px;}





/*Slider*/
#slide-image 
{
	float:left;
	width:902px;
	height:228px;
	overflow:hidden;
	z-index:22;
	position:relative;
}
#slide_image 
{
	float:left;
	width:902px;
	height:228px;	
}
.slide-spot 
{
	width:160px;
	height:218px;
	background:url(../media/site/slider/bg-spot.png) repeat top left;
    text-align:right;
    padding:10px;
    position:absolute;
    z-index:20;
    margin-left:902px;
    /*float:right;
	width:160px;
	height:218px;
	background:url(../media/site/slider/bg-spot.png) repeat top left;
    text-align:right;
    padding:10px;
    position:relative;
    top:0;
    z-index:20;
    left:180px;*/
}
.slide-spot h1 {font-size:16px;font-weight:bold;padding-bottom:5px;}
.slide-media-container 
{
	float:left;
	width:902px;
	height:228px;
	overflow:hidden;
	z-index:19;
	position:relative;
}

.form-table input[type=text],
.form-table textarea {border:solid 1px #393939;background-color:#2A2A2A;color:#fff;width:300px;}

.vrForm {margin-bottom:10px;}
.vrForm td {padding-bottom:5px;vertical-align:top;}
/*.vrForm label {display:inline-block;line-height:18px;vertical-align:top;width:120px;position:relative;}*/
/*.vrForm ol {margin:0;padding:0;}
.vrForm li {list-style:none;padding:5px;margin:0;}*/
.vrform-input {width:200px;background-color:#2A2A2A;border:solid 1px #393939;color:#fff;}
/*.vrForm input[type=text],
.vrForm textarea {width:200px;background-color:#2A2A2A;border:solid 1px #393939;color:#fff;}*/
.vrForm a:link,
.vrForm a:visited,
.vrForm a:hover {width:45px;height:15px;background:url(../media/site/bg-send.png) no-repeat top left;outline:none;text-decoration:none;float:left;}
.vrForm a:hover {background-position:left bottom;}


span.KalanRakam {font-size: 10px;}
.KalanKarakter {text-align:right}

#project-slides
{
	width:418px;
	height:188px;
	float:left;
	overflow:hidden;
	margin-bottom:10px;
}

#text .paging,
.text .paging 
{
	padding-top:10px;
	font-size:11px;
	float:left;
	width:630px;
	text-align:center;
}
#text .paging b,
.text .paging b{color:#666666;padding:3px 4px;width:auto;display:inline;position:relative;}

#text .paging a:link,
.text .paging a:link,
#text .paging a:visited,
.text .paging a:visited
{
	position:relative;
	border:solid 1px #ddd;
	margin-right:2px;
	color:#fff;
	padding:3px 6px;
	text-decoration:none;
}
#text .paging a:hover,
.text .paging a:hover
{border-color:#A9061B;}

.popup {border-collapse: collapse;width:345px;height:160px;padding:5px;}

.popup .popup-contents {line-height: 1.2em;}

#varyap-in-press {width:100%;padding-bottom:10px;}
#varyap-in-press th {font-weight:bolder;height:20px;border-bottom:solid 1px #262626;color:#820000;font-size:13px;}
#varyap-in-press td {padding-top:10px;}