/*
 * Stylesheet gia Skoda Koronios. Copyright (C) 2011.
 *
 */

/* 
 * Genika styles
 * 
 */

* {
	padding: 0;
	margin: 0;
}

html, body {
	width: 100%;
	height: 100%;
}

body {
	font-family: Tahoma, Arial, sans-serif;
	background-color: #fff;
	font-size: 13px;
	color: #222;
}

a img {
	border: 0;
}

a {
	text-decoration: none;
	outline: none;
	color: #000;
}

a:hover {
	text-decoration: underline;
	color: #4ba82e;
}

a:active {
	text-decoration: underline;
}

h1, h2, h3, h4 {
	margin-bottom: 5px;
	font-weight: bold;
}

h1 {
	font-size: 1.8em;
}

h2 {
	font-size: 1.6em;
}

h3 {
	font-size: 1.4em;
}

h4 {
	font-size: 1.2em;
}

.clear {
	clear: both;
}

.left {
	float: left;
}

.right {
	float: right;
}

/*
 * Styles gia page.
 * 
 */

div#page {
	width: 100%;
	height: 100%;
}

/*
 * Styles gia header.
 * 
 */

div#header-wrapper {
	background: url('../images/header-bg.png') repeat-x 0 0;
	width: 100%;
	height: 175px;
}

div#header-wrapper #header {
	background: url('../images/claim.png') no-repeat 0 0;
	position: relative;
	margin: 0 auto;
	width: 960px;
	height: 100%;
}

div#header .logo {
	position: absolute;
	top: 0;
	right: 50px;
}

/* Main navigation */

div#header #navigation {
	list-style-type: none;
	position: absolute;
	bottom: 44px;
	left: 20px;
}

ul#navigation > li {
	-webkit-transition: border .3s ease;
	-moz-transition: border .3s ease;
	-o-transition: border .3s ease;
	transition: border .3s ease;
	border: 1px solid transparent;
	position: relative;
	padding: 6px 0;
	float: left;
}

ul#navigation > li > a {
	-webkit-transition: color .3s ease;
	-moz-transition: color .3s ease;
	-o-transition: color .3s ease;
	transition: color .3s ease;
	text-decoration: none;
	padding: 0 6px;
	color: #555;
}

ul#navigation > li:hover {
	border: 1px solid #efefef;
}

ul#navigation > li:hover > a {
	color: #9f9f9f;
}

ul#navigation .subnav {
	-webkit-transition: opacity .3s ease;
	-moz-transition: opacity .3s ease;
	-o-transition: opacity .3s ease;
	transition: opacity .3s ease;
	border: 1px solid #efefef;
	background-color: #fff;
	list-style-type: none;
	margin: 4px 0 0 -1px;
	position: absolute;
	width: 180px;
	padding: 5px 0;
	left: -999em;
	z-index: 9500;
	opacity: 0;
}

ul#navigation .subnav li {
	background: url('../images/arrow_right.png') no-repeat 6px center;
}

ul#navigation .subnav li a {
	padding: 3px 15px 3px 20px;
	text-decoration: none;
	display: block;
}

ul#navigation li:hover .subnav {
	opacity: 1;
	left: 0;
}

ul#navigation .subnav li:hover {
	background-color: #efefef;
}

/* Search */

form#search {
	position: absolute;
	bottom: 48px;
	right: 200px;
}

form#search .search-inside {
	box-shadow: inset 0 2px 3px #d3d3d3;
	border: 1px solid #d3d3d3;
	font-size: 0.9em;
	padding: 0 5px;
	height: 20px;
	float: left;
	color: #555;
}

form#search .search-button {
	background: #d3d3d3 url('../images/search_btn.png') no-repeat 0 center;
	cursor: pointer;
	float: right;
	width: 22px;
	height: 22px;
	border: 0;
}

/* Car navigation */

div#header #car-navigation {
	background-color: #4ba82e;
	list-style-type: none;
	position: absolute;
	margin-left: 20px;
	z-index: 9000;
	width: 920px;
	bottom: 0;
}

ul#car-navigation > li {
	-webkit-transition: background-color .3s ease;
	-moz-transition: background-color .3s ease;
	-o-transition: background-color .3s ease;
	transition: background-color .3s ease;
	position: relative;
	padding: 5px 0;
	float: left;
}

ul#car-navigation > li > a {
	text-decoration: none;
	padding: 0 25px 0 18px;
	font-size: 1.3em;
	color: #fff;
}

ul#car-navigation > li:hover {
	background: #fff url('../images/arrow_down.png') no-repeat right center;
	border: 1px solid #efefef;
	border-width: 1px 0 0 1px;
	padding: 4px 0 5px 0;
}

ul#car-navigation > li:hover > a {
	padding: 0 25px 0 17px;
	color: #4ba82e;
}

ul#car-navigation .subnav {
	-webkit-transition: opacity .3s ease, visibility .3s ease;
	-moz-transition: opacity .3s ease, visibility .3s ease;
	-o-transition: opacity .3s ease, visibility .3s ease;
	transition: opacity .3s ease, visibility .3s ease;
	border: 1px solid #efefef;
	border-width: 0 1px 1px 1px;
	background-color: #fff;
	list-style-type: none;
	margin: 5px 0 0 -1px;
	visibility: hidden;
	position: absolute;
	padding: 10px 20px;
	width: 370px;
	z-index: 9000;
	opacity: 0;
}

ul#car-navigation li:hover .subnav {
	visibility: visible;
	opacity: 1;
}

ul#car-navigation .subnav > li {
	border-top: 1px solid #000;
	padding-bottom: 10px;
}

ul#car-navigation .subnav > li:first-child {
	border-top: 0;
}

ul#car-navigation .subnav > li .model-name {
	font-size: 1.3em;
	margin: 5px 0;
}

ul#car-navigation .subnav > li img {
	float: left;
}

ul#car-navigation .subnav > li .model-info {
	margin-left: 20px;
	float: left;
}

ul#car-navigation .subnav > li ul {
	list-style-image: url('../images/arrow_right.png');
}

/*
 * Styles gia container.
 * 
 */

div#container {
	position: relative;
	margin: 0 auto;
	width: 960px;
}

/* Slideshow stin kentriki selida */

div#container #main-slideshow {
	position: relative;
	width: 940px;
	height: 500px;
	bottom: 10px;
	left: 10px;
}

div#main-slideshow #main-slides {
	list-style-type: none;
	position: relative;
	overflow: auto;
	width: 940px;
	height: 500px;
}

div#main-slideshow #main-slides li {
	width: 940px;
	height: 500px;
}

div#main-slideshow #main-slides li img {
	width: 940px;
	height: 500px;
}

div#main-slideshow .slide-caption {
	position: absolute;
	width: 250px;
	color: #fff;
}

div#main-slideshow .slide-caption .caption-header {
	font-family: "Trebuchet MS", Arial, sans-serif;
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 1.6em;
}

div#main-slideshow .slide-caption .caption-text {
	font-size: 1.05em;
}

div#main-slideshow #pagination {
	list-style-type: none;
	position: absolute;
	z-index: 8000;
	height: 28px;
	right: 20px;
	top: 30px;
}

div#main-slideshow #pagination li {
	-webkit-transition: border .5s ease, background-color .5s ease, color .5s ease;
	-moz-transition: border .5s ease, background-color .5s ease, color .5s ease;
	-o-transition: border .5s ease, background-color .5s ease, color .5s ease;
	transition: border .5s ease, background-color .5s ease, color .5s ease;
	background-color: #4ba82e;
	border: 2px solid #fff;
	border-radius: 16px;
	text-align: center;
	margin-left: 7px;
	font-weight: bold;
	font-size: 1.1em;
	cursor: pointer;
	width: 28px;
	height: 28px;
	line-height: 28px;
	float: left;
	color: #fff;
}

div#main-slideshow #pagination li.current {
	border: 2px solid #4ba82e;
	background-color: #fff;
	color: #4ba82e;
}

/* Slider stin kentriki selida */

div#container #main-links {
	background-color: #f2f2f2;
	position: relative;
	width: 625px;
	height: 200px;
	bottom: 100px;
	left: 30px;
	z-index: 7000;
}

div#main-links .sliderbutton {
	cursor: pointer;
	height: 200px;
	width: 30px;
	z-index: 7002;
}

div#main-links #slide-left {
	background: url('../images/slide-left.png') no-repeat center center;
	position: absolute;
	left: 0;
	top: 0;
}

div#main-links #slide-right {
	background: url('../images/slide-right.png') no-repeat center center;
	position: absolute;
	right: 0;
	top: 0;
}

div#main-links #main-slider {
	position: relative;
	overflow: auto;
	overflow-x: hidden;
	width: 625px;
	height: 200px;
}

div#main-slider ul {
	list-style-type: none;
	position: absolute;
	width: 625px;
	top: 0;
	left: 0;
}

div#main-slider ul li {
	padding: 30px 0 0 35px;
	width: 260px;
	height: 170px;
	float: left;
}

div#main-slider img {
	box-shadow: 0 2px 4px #777;
	margin-bottom: 10px;
}

div#main-slider .text-link {
	background: url('../images/arrow_right_box.png') no-repeat 0 4px;
	padding-left: 15px;
	font-size: 1.15em;
}

/* Maura koutakia stin kentriki selida */

div#container #main-info {
	position: absolute;
	width: 255px;
	top: 400px;
	right: 30px;
	z-index: 7000;
}

div#main-info #black-arrow {
	background: url('../images/arrow_up_blackbox.png') no-repeat 0 0;
	height: 20px;
}

div#main-info #welcome,
div#main-info #news {
	background-color: #000;
	margin-bottom: 5px;
	padding: 20px;
	color: #fff;
}

div#welcome .small {
	margin-bottom: 5px;
	font-size: 1.15em;
}

div#welcome .large {
	font-size: 1.9em;
}

div#news .news-header {
	margin-bottom: 10px;
	font-size: 1.9em;
}

div#news ul {
	list-style-image: url('../images/arrow_right_white.png');
	margin-left: 16px;
}

div#news ul li {
	margin-bottom: 10px;
}

div#news a {
	color: #fff;
}

/* Styles gia selida metaxeirismena */

div#used-container {
	background: url('../images/used-side-bg.png') repeat-y  0 0;
}

/* Sidebar */

div#used-container #used-sidebar {
	padding: 10px 0;
	float: left;
	width: 215px;
}

div#used-sidebar ul {
	list-style-type: none;
	margin: 10px 0 20px;
}

div#used-sidebar li {
	font-size: 0.9em;
	text-align: right;
	height: 43px;
}

div#used-sidebar li a {
	text-decoration: none;
	padding: 15px 20px 0 0;
	display: block;
	height: 28px;
}

div#used-sidebar li a:hover {
	color: #E3621E;
}

div#used-sidebar .current {
	background: url('../images/used-side-selected.png') no-repeat 0 0;
}

div#used-sidebar .current a {
	font-weight: bold;
	color: #E3621E;
}

/* Content */

div#used-container #used-content {
	padding: 0 0 20px 10px;
	float: right;
	width: 735px;
}

div#used-content .used-box {
	box-shadow: 0 2px 3px #777;
	border: 1px solid #b2b1b1;
	background-color: #eeeeec;
	margin: 15px 0 0 12px;
	position: relative;
	width: 160px;
	height: 150px;
	float: left;
}

div#used-content .used-name {
	position: absolute;
	font-size: 1.15em;
	bottom: 3px;
	left: 5px;
}

div#used-content #used-info {
	padding: 20px 35px 40px 20px;
}

div#used-info p {
	text-align: justify;
}

/* Styles gia geniko content article */

div#container #article-wrap {
	margin: 20px 0 40px;
}

div#article-wrap .article-photo {
	max-width: 300px;
	float: left;
}

div#article-wrap #article {
	text-align: justify;
}

div#article-wrap #article.with-photo {
	margin-left: 320px;
}

/* Selida epikoinonias */

div#container #contact-info {
	background-color: #000;
	margin: 20px 0 0 40px;
	padding: 20px;
	float: left;
	color: #fff;
}

div#container #contact-info a {
	color: #fff;
}

div#contact-info h1 {
	font-weight: normal;
	font-size: 1.9em;
}

div#container .invalid-text {
	margin-top: 20px;
	color: #cc0000;
	width: 500px;
	float: right;
}

div#container #contact {
	margin: 20px 0 20px 60px;
	width: 500px;
	float: left;
}

form#contact label {
	padding-top: 7px;
	font-size: 1.15em;
	display: block;
	width: 180px;
	float: left;
}

form#contact input,
form#contact textarea {
	box-shadow: inset 0 3px 4px #babdb6;
	background-color: #F2F2F2;
	border: 1px solid #D0CFCF;
	margin: 5px 0 10px;
	padding: 4px;
	height: 18px;
	width: 300px;
}

form#contact textarea {
	height: 200px;
	resize: none;
}

form#contact .invalid {
	box-shadow: inset 0 0 5px #cc0000;
	background-color: #f7dede;
}

form#contact .submit-button {
	background: #000 url('../images/arrow_right_white.png') no-repeat 102px 13px;
	margin-left: 180px;
	box-shadow: none;
	cursor: pointer;
	float: left;
	border: none;
	width: 120px;
	height: 30px;
	color: #fff;
}

/*
 * Styles gia footer.
 * 
 */

div#footer-wrapper {
	margin-bottom: 30px;
	background-color: #f2f2f2;
	width: 100%;
	height: 200px;
}

div#footer-wrapper #footer {
	background: url('../images/footer_bg.png') no-repeat 745px 0;
	padding: 40px 0 0 100px;
	position: relative;
	margin: 0 auto;
	width: 860px;
	height: 160px;
}

div#footer ul {
	list-style-image: url('../images/arrow_right.png');
	width: 540px;
	float: left;
}

div#footer ul li {
	margin-bottom: 10px;
	width: 180px;
	float: left;
}

div#footer li a {
	color: #555;
}

div#footer #statement {
	position: absolute;
	width: 340px;
	bottom: 20px;
	right: 24px;
}

div#statement p {
	margin-bottom: 5px;
	text-align: right;
}

div#statement .disclaimer {
	font-size: 0.8em;
}

.sec {
	font-size: 24px;
	margin: 0 0 5px 0;
}

.text {
	font-size: 14px;
	margin: 0;
}

.news-list {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.news {
	margin: 20px 0;
}

.news .date {
	background-color: #4BA82E;
	color: #fff;
	float: left;
	margin: 8px 10px 0 0;
	padding: 8px 10px;
	text-align: center;
}

.news .date .day {
	font-size: 26px;
	font-weight: bold;
}

.news .date .month {
	font-size: 14px;
	margin-top: -5px;
}

.news-files {
	list-style-type: none;
	text-align: center;
	margin-top: 20px;
}

.news-files .item {
	margin: 5px 0;
	font-weight: bold;
}

.news-files .icon {
	margin: 0 5px 0 0;
	vertical-align: middle;
}

.news-files a {
	color: #333;
	text-decoration: none;
}