@import url(baseStyles.css);

a:link{color:#23568D;font-weight:bold;}
a:visited{color:#23568D;font-weight:bold;}
a:hover{color:#900;font-weight:bold;}

ul,ol{margin-left:12px;}
p {padding:0px 12px;}
body{background:url(img/body-bg.jpg);color:#fff;}

#copyright{text-align:center;margin-bottom:24px;font-size:1.2em;}

#copyright a:link{color:#fff;font-weight:bold;}
#copyright a:visited{color:#fff;font-weight:bold;}
#copyright a:hover{color:#7AA3E7;font-weight:bold;}

#maincontainer{width:960px;margin:24px auto;height:100%;}
#mainheader{float:right;color:#c8c8c8;}
#mainheader span{font-size:.5em;}
#toptab{width:250px;text-align:center;}
#toptab a{font-size:1.2em;}
#contentbox{padding:12px 6px;background:url(img/directory-watermark.png) top center no-repeat;}
#titlebar{margin-bottom:24px;}
#titlebar img{float:left;margin-left:24px;margin-top:-14px;z-index:2000;position:relative;}
#titlebar h1{text-align:center;padding-top:12px;padding-right:102px;}
#leftcol{width:180px;float:left;font-size:1.2em;}
#leftcol ul{list-style-type:none;margin-left:6px;}
#googlelinks{width:160px;margin:auto;margin-bottom:12px;}
#leftcol img{margin-top:24px;margin-bottom:26px;}
#maincol{width:520px;float:left;padding:0px 24px;}
#maincol p {padding:0px 0px;width:500px;margin-right:auto;margin-left:auto;}
#maincol h3{margin:6px 0px 6px 12px;}
#maincol li{line-height:200%;font-size:1.3em;}
.directorylinks{width:50%;float:left;}
.directorylinks ul{list-style-type:none;font-size:1em;}
.clear{clear:both;}
#rightcol{width:180px;float:right;}
#googleads{width:160px;margin:auto;}

#listingdiv table{width:100%;}
.thumbtd{width:130px;}

#contactform fieldset{width:350px;margin:auto;border:2px solid #23568D;font-size:1.2em;}
#contactform legend{font-size:1.2em;color:#23568D;font-weight:bold;}
#contactform table {font-size:1.2em;margin:24px auto;}
#contactform table table{margin:12px auto;font-size:1.2em;}
#contactform td {padding:6px;vertical-align:top;color:#23568D;font-weight:bold;}
#contactform td td{padding:3px;}
#contactform input{width:180px;background:#23568D !important;border:1px solid #0F2546;color:#d0e4ea !important;}
#contactform textarea{width:180px;background:#23568D !important;border:1px solid #0F2546;color:#d0e4ea !important;}

#listingform fieldset{width:480px;margin:auto;border:2px solid #23568D;font-size:1.2em;}
#listingform legend{font-size:1.2em;color:#23568D;font-weight:bold;}
#listingform table {font-size:1.2em;margin:24px auto;}
#listingform table table{margin:12px auto;font-size:1.2em;}
#listingform td {padding:6px;vertical-align:top;color:#23568D;font-weight:bold;}
#listingform td td{padding:3px;}
#listingform span{color:#900;font-weight:bold;}
#listingform input{width:200px;background:#23568D !important;border:1px solid #0F2546;color:#d0e4ea !important;}
#listingform textarea{width:200px;background:#23568D !important;border:1px solid #0F2546;color:#d0e4ea !important;}
#listingform select{width:200px;background:#23568D !important;border:1px solid #0F2546;color:#d0e4ea !important;}

div.fileinputs {
	position: relative;
}

div.fakefile {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1;
}

input.file {
	position: relative;
	text-align: right;
	-moz-opacity:0 ;
	filter:alpha(opacity: 0);
	opacity: 0;
	z-index: 2;
}

#remLen1{color:#23568D !important;}
#remLen2{color:#23568D !important;}

#vglogo{width:112px;height:54px;position:fixed;bottom:0px;right:0px;}
#vglogo img{border:none;}

#listingdiv p{width:auto;margin:auto;}
#listingdiv td{padding:0px 6px;}
#listingdiv table{margin-bottom:24px;}
#listingdiv h3{margin:auto;}

.top-left, .top-right, .bottom-left, .bottom-right { 
	background-image: url('img/corners-main.png'); /* CHANGE: path and name of your image */
	height: 9px;       /* CHANGE: replace by the height of one of your corners (= 1/2 height of the image) */
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
	}
.top-left, .bottom-left { 
	margin-right: 9px; /* CHANGE: replace by the width of one of your corners */
	}
.top-right, .bottom-right { 
	margin-left: 9px;  /* CHANGE: replace by the width of one of your corners */
	margin-top: -9px;  /* CHANGE: replace by the height of one of your corners */
	}
.top-right {
	background-position: 100% 0;    /* DNC: position right corner at right side, no vertical changes */
	}
.bottom-left  { 
	background-position: 0 -9px;    /* CHANGE: replace second number by negative height of one of your corners */
	}
.bottom-right { 
	background-position: 100% -9px; /* CHANGE: replace second number by negative height of one of your corners */
	}
.inside {
	background: #fff;            /* YCC: background-color of the inside */
	color: #000000;                 /* YCC: default text-color of the inside */
	padding-left: 10px;             /* YCC: all texts at some distance of the left border */
	padding-right: 10px;             /* YCC: all texts at some distance of the left border */
	}
.notopgap    { margin-top: 0; }    /* DNC: to avoid splitting of the box */
.nobottomgap { margin-bottom: -1px; padding-bottom: 1px; } /* DNC: to avoid splitting of the box */


.top-left2, .top-right2, .bottom-left2, .bottom-right2 { 
	background-image: url('img/corners-side.png'); /* CHANGE: path and name of your image */
	height: 9px;       /* CHANGE: replace by the height of one of your corners (= 1/2 height of the image) */
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
	}
.top-left2, .bottom-left2 { 
	margin-right: 9px; /* CHANGE: replace by the width of one of your corners */
	}
.top-right2, .bottom-right2 { 
	margin-left: 9px;  /* CHANGE: replace by the width of one of your corners */
	margin-top: -9px;  /* CHANGE: replace by the height of one of your corners */
	}
.top-right2 {
	background-position: 100% 0;    /* DNC: position right corner at right side, no vertical changes */
	}
.bottom-left2  { 
	background-position: 0 -9px;    /* CHANGE: replace second number by negative height of one of your corners */
	}
.bottom-right2 { 
	background-position: 100% -9px; /* CHANGE: replace second number by negative height of one of your corners */
	}
.inside2 {
	background: #c8c8c8;            /* YCC: background-color of the inside */
	color: #000000;                 /* YCC: default text-color of the inside */
	padding-left: 0px;             /* YCC: all texts at some distance of the left border */
	padding-right: 0px;             /* YCC: all texts at some distance of the left border */
	padding:0px 6px;
	height:640px;
	}


.top-left3, .top-right3, .bottom-left3, .bottom-right3 { 
	background-image: url('img/corners-top.png'); /* CHANGE: path and name of your image */
	height: 9px;       /* CHANGE: replace by the height of one of your corners (= 1/2 height of the image) */
	font-size: 2px;    /* DNC: correction IE for height of the <div>'s */
	}
.top-left3, .bottom-left3 { 
	margin-right: 9px; /* CHANGE: replace by the width of one of your corners */
	}
.top-right3, .bottom-right3 { 
	margin-left: 9px;  /* CHANGE: replace by the width of one of your corners */
	margin-top: -9px;  /* CHANGE: replace by the height of one of your corners */
	}
.top-right3 {
	background-position: 100% 0;    /* DNC: position right corner at right side, no vertical changes */
	}
.bottom-left3  { 
	background-position: 0 -9px;    /* CHANGE: replace second number by negative height of one of your corners */
	}
.bottom-right3 { 
	background-position: 100% -9px; /* CHANGE: replace second number by negative height of one of your corners */
	}
.inside3 {
	background: #32517d;            /* YCC: background-color of the inside */
	color: #fff;                 /* YCC: default text-color of the inside */
	padding-left: 0px;             /* YCC: all texts at some distance of the left border */
	padding-right: 0px;             /* YCC: all texts at some distance of the left border */
	border-left: 2px solid #253e6f;
	border-right: 2px solid #253e6f;
	height:70px;
	}