@charset "utf-8";
/* CSS Document */


/* CSS RESET */
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 {
	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 { font-family:Georgia, "Times New Roman", Times, serif; color:#333; font-size:16px  }

.clear { clear:both }
a { color:#0057a6 }
a:hover { text-decoration:	none }
.orange { color:#f57000}
.blue { color:#0057a6 }
.noDisplay { display:none }
.doDisplay { display:block }


#body { border-top:solid 3px #0057a6 }

.wrapper { width:940px; margin:0px auto; position:relative }

/* right nav */
#right-nav { text-align:right; color:#424242; height:40px; }
#right-nav-elements { position:absolute; right:0; top:5px; }
#right-nav-elements li { float:left }
#right-nav-elements li span { padding:0px 13px; font-size:13px; }
#right-nav-elements a { font-size:14px; color:#424242; text-decoration:none }
#right-nav .facebook { padding-right: 10px }
#right-nav .facebook a { text-decoration: underline; font-size:12px; color: #666 }

/* main nav */
#main-nav { position:relative; height:50px; margin-bottom:35px; }
#logo { width:266px; height:50px; overflow:hidden }
#main-nav img { position:absolute; left:0px; }
#main-nav img.no-pad { position:absolute; left:0px; }
#main-nav-elements { 
	position:absolute; 
	right:0; 
	top:10px; 
	
	height:30px; 
	
	border-top:solid 1px #d7eef5 
}
#main-nav-elements li { padding:9px 0px; float:left }
#main-nav-elements li.padding { padding-right:25px; }
#main-nav-elements a { color:#333; padding:7px 0px; font-size:21px; text-decoration:none; }
#main-nav-elements a:hover, #main-nav-elements a.active { border-top:solid 2px #0aa1d0 }



/* slideshow */
#slide-show-bg { background:url(/images/design/slide-bg.png) no-repeat center center; height:311px; margin:0px auto 1px auto; width:940px; overflow:hidden; }
		 
#slider {  width:940px; height:311px; margin:0px auto; position:relative }

#slider ul, #slider ul li {
		padding:0;
		list-style:none;
		position:relative;
		margin:0px auto;
		}
		#slider ul li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		list-style:none;
		width:940px;
		height:300px;
		overflow:hidden; 
		
		}	
		/* numeric controls */	

	ol#pages{
		margin:1em 0;
		padding:0;
		height:28px;	
		}
	ol#pages li{
		margin:0 6px 0 0; 
		padding:0;
		float:left;
		list-style:none;
		height:28px;
		line-height:28px;
		}
	ol#pages li a{
		float:left;
		height:18px;
		line-height:18px;
		width:18px;
		background:#077395;
		color:#fff;
		padding:0 0px;
		font-size:11px;
		font-family:Arial, Helvetica, sans-serif;
		text-align:center;
		text-decoration:none;
	        border-radius: 9px;
            -moz-border-radius: 9px; 
	        -webkit-border-radius: 9px; 
		}
	ol#pages li.current a{
		background:#05465a;
		height:20px;
		line-height:20px;
		width:20px;
	        border-radius: 10px;
            -moz-border-radius: 10px; 
	        -webkit-border-radius: 10px;
		}
	ol#pages li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}

ol#pages { position:absolute; top:5px; right:15px; z-index:15000 }
	
.slide-left-content { width:560px; float:left }
.slide-left-content .top { height:230px; }
.slide-left-content .web-dir { background:url(/images/slide/slide-web-dir.png) bottom center no-repeat; }
.slide-left-content .uk-dir { background:url(/images/slide/slide-uk-dir.png) bottom center no-repeat; }
.slide-left-content .blog-dir { background:url(/images/slide/slide-blog-dir.png) bottom center no-repeat; }
.slide-left-content .local-dir { background:url(/images/slide/slide-local-dir.png) bottom center no-repeat; }
.slide-left-content .bottom { height:81px; line-height:81px; color:#fff; padding-left:40px }
.slide-left-content .bottom h2 { text-shadow: 2px 2px 1px #333; letter-spacing:-1px; font-size:30px; font-weight:bold; }
.slide-left-content .bottom span { font-size:14px; text-shadow:0px 0px 0px #000; letter-spacing:0px; }

.slide-right-content { width:320px; margin-right:23px; float:right }
.slide-right-content .top { height:230px; }
.slide-right-content .top p.description { font-family: 'Droid Serif', arial, serif; color:#fff; font-size:20px; line-height:30px; font-weight:bold; position:absolute; top:57px; padding:0px 30px 0px 5px; width:275px; }
.slide-right-content .bottom { height:81px }
.slide-right-content .bottom a { margin-top:18px; text-indent:-5500px }
.slide-right-content .bottom a.get-listed { background:url(/images/design/button-slide-getlisted.png); width:132px; height:44px; display:block; float:left; }
.slide-right-content .bottom a.browse { background:url(/images/design/button-slide-browse.png); width:184px; height:44px; display:block; float:left }



/* info */
#info { background:url(/images/design/info-bg.png) repeat-x; padding:32px 32px; width:876px; margin:0px auto; position:relative }
#info h3 { color:#0057a6; font-size:26px; margin-bottom:12px; }
#info .column { width:255px; padding-left:7px; float:left }
#info .column li { background:url(/images/design/ico-check.gif) 0px 12px no-repeat; padding:7px 18px; font-size:20px; line-height:22px; }
#info .right-column { width:300px; padding:30px 0px 30px 43px; font-size:20px; line-height:24px; float:left }
#info .right-column a { color:#f57000; font-size:18px; line-height:30px; }

#info .shadow { background:url(/images/design/info-shadow.png); width:1px; height:300px; position:absolute; left:561px; top:0px; }


/* more info */
#more-info { padding:6px 0px }
#more-info .from-blog { width:400px; border-top:solid 1px #c1c1c1; padding:5px 0px; line-height:22px; font-size:14px; float:left }
#more-info .from-blog .item { margin-top:10px }
span.from { font-size:13px; letter-spacing:2px }
#more-info .from-blog span.sub-title { color:#666 }
#more-info .from-blog span.sub-title a { color:#666 }
#more-info .from-blog h4 { font-size:24px; margin:0px; color:#f57000; line-height:28px; }
#more-info .from-blog a { color:#f57000 }
#more-info .from-blog p { padding:10px 0px }
#more-info .from-blog a.blog { line-height:46px; font-size:16px }

#more-info .testimonials { width:440px; border-top:solid 4px #e3e1d5; background:#fffdef; position:relative; float:right }
#more-info .testimonials #next { background:url(/images/design/ico-next.png); width:22px; height:22px; position:absolute; top:15px; right:15px; display:block; z-index:5000 }
#more-info .testimonials #prev { background:url(/images/design/ico-prev.png); width:22px; height:22px; position:absolute; top:15px; left:15px; display:block; z-index:5000 }

#more-info .testimonials .outer-content { background:url(/images/design/ico-open-q.png) no-repeat 15px 70px #fffdef; padding:35px 15px 35px 55px; }
#more-info .testimonials .content { background:url(/images/design/ico-close-q.png) bottom right no-repeat #fffdef; color:#424242; line-height:22px; padding:0px 20px 10px 0px; }
#more-info .testimonials h4 { font-size:22px; margin:0px 0px 10px 0px; color:#0057a6; line-height:28px; }
#more-info .testimonials .author { margin-top:12px; line-height:22px; position:relative }
#more-info .testimonials .author img { vertical-align:bottom }





/* footer */
#footer {
	border-top:solid 2px #cdd6ce;
	background:#eae9e7;
	padding:40px 0px 40px 0px;
}

#footer .left-column { width:440px; float:left }
#footer .left-column .logo { 
	background:url(/images/design/botw-logo-greyscale.png) top left no-repeat; 
	
	padding:40px 0px 0px 50px; 
	
	color:#666; 
	font-size:11px; 
}

#footer .contact-section { width:220px; color:#666; line-height:22px; float:left }

#footer .links-section { width:280px; float:left  }

#footer .links-section ul.menu { width:120px; float:left }

#footer .links-section ul.directories { width:140px; float:right }

#footer .links-section a { color:#666; border-bottom:solid 1px #c3c3c1; text-decoration:none; padding:8px 0px 8px 4px; display:block }







.regular-page { border-top:dotted 1px #d4d4d4; padding-top:20px; }


/* about us */
.about-heading { background:url(/images/design/about-us-heading.png); width:940px; height:343px; margin-top:15px }
.about-main { margin-top:35px }
.about-pic-holder { width:700px; float:left }
.about-pic-holder li { background:url(/images/design/picture-holder.png) top left no-repeat; width:160px; padding-right:20px; margin-bottom:40px; height:220px; font-size:18px; float:left }
.about-pic-holder li.no-padding { padding:0px; }
.about-pic-holder li img { margin-bottom:15px }
.about-pic-holder li span { font-size:15px }
.about-pic-holder .fontsmall { font-size:13px }

.about-right { width:200px; float:right }
.about-right .blue-box { background:#e7f5f9; padding:15px; }
.about-right .blue-box h2 { margin-bottom:10px; font-size:21px }
.about-right .blue-box li { border-bottom:solid 1px #c2dcec }
.about-right .blue-box a { color:#0057a6; text-decoration:none; font-size:15px; padding:7px 0px 7px 3px; display:block }
.about-right .blue-box a:hover { background:url(/images/design/ico_arrow2_list.gif) 150px 13px no-repeat #D8E9F3; padding-left:4px; }

.about-right .yellow-box { background:#fffce2; padding:13px; border:solid 1px #f5f2db ; margin:15px 0px; font-size:15px; line-height:20px }

.about-popup { padding:20px; }
.about-popup .left { width:200px; float:left }
.about-popup .pic-holder { background:url(/images/design/picture-holder.png) top left no-repeat; width:160px; padding-right:20px; margin-bottom:40px; font-size:15px; line-height:20px; float:left }
.about-popup .pic-holder img { margin-bottom:15px }
.about-popup .right { width:500px; margin-left:200px; }
.about-popup .right h4 { font-size:46px; padding-bottom:15px; }
.about-popup .right h5 { font-size:18px; padding:5px 0px; }
.about-popup .right p { font-size:15px; line-height:20px }

.social-media li { margin:0px 3px; position:relative; float:right }
.social-media a { width:24px; height:24px; overflow:hidden; display:block }
.social-media a img { position:absolute; top:0px; left:0px; z-index:1301; }


/* directories */
.directories-main { margin-top:55px; padding-bottom:35px; }

.directories-heading { background:url(/images/design/directories-heading.png); width:940px; height:360px; margin-top:15px; position:relative }
.directories-heading a { width:314px; height:42px; position:absolute; bottom:-21px; left:300px; overflow:hidden; margin:auto; }
.directories-heading a span { position:absolute }
.directories-heading a img { position:absolute }

.directories-holder { width:680px; float:left }

.directories-holder li { width:320px; font-size:20px; padding-top:220px; height:180px; line-height:22px; float:left }
.directories-holder li.padding { margin-left:40px }
.directories-holder li.web-dir { background:url(/images/design/dir-web.png) top center no-repeat; }
.directories-holder li.uk-dir { background:url(/images/design/dir-uk.png) top center no-repeat; }
.directories-holder li.blog-dir { background:url(/images/design/dir-blog.png) top center no-repeat; }
.directories-holder li.local-dir { background:url(/images/design/dir-local.png) top center no-repeat; }
.directories-holder li.sh-dir { background:url(/images/design/dir-sh.png) top center no-repeat; }
.directories-holder li.soft-dir { background:url(/images/design/dir-soft.png) top center no-repeat; }
.directories-holder li.edu-dir { background:url(/images/design/dir-edu.png) top center no-repeat; }
.directories-holder li.begreen-dir { background:url(/images/design/dir-begreen.png) top center no-repeat; }
.directories-holder li h4 { font-size:24px; color:#0057a6; line-height:30px }
.directories-holder li p { padding:10px 0px }

.dir-right { width:200px; float:right }
.dir-right .blue-box { background:#e7f5f9; padding:15px; }
.dir-right .blue-box h2 { margin-bottom:10px; font-size:21px }
.dir-right .blue-box li { border-bottom:solid 1px #c2dcec; padding:12px 0px; line-height:22px; }
.dir-right .yellow-box { background:#fffce2; padding:13px; border:solid 1px #f5f2db ; margin:15px 0px; font-size:15px; line-height:20px }
.dir-right .yellow-box a { color:#333 }


/* contact */
.contact-heading { background:url(/images/design/contact-heading.png); width:940px; height:48px; margin-top:15px; position:relative }

.contact-social-media { width:380px; height:48px; position:absolute; top:0px; right:0px; text-align:right }
.contact-social-media a { width:100%; }
.contact-social-media img { vertical-align:bottom; margin-left:5px; }

.contact-main { margin-top:35px; margin-bottom:35px; padding-bottom:35px; }

.contact-left { width:600px; padding:35px 50px; background:#eae9e7; float:left; }

.contact-left h2 { font-size:24px; margin-bottom:5px }

.contact-left fieldset { padding:15px 0px }
.contact-left label.label { width:170px; margin:0px; padding:4px 20px 6px 0px; display:block; font-size:18px; font-weight:bold; text-align:right; float:left }
.contact-left input[type=text],
.contact-left textarea,
.contact-left select { background:url(/images/design/input-shadow.png) repeat-x top left #fff; padding:8px; width:200px; border:solid 1px #9c9c9c; color:#666; font-size:16px; font-family:Georgia, "Times New Roman", Times, serif; float:left }

.contact-left input.email { width:320px }
.contact-left input.name { width:280px }

.contact-left textarea { width:380px; height:180px }

.contact-left p { line-height:22px; font-size:18px; }
.contact-left div.field { display:block; }
.contact-left .desp { height:1px; background:#c5c5c5; margin:18px 0px; clear:both }

.contact-left small { margin-left:190px; font-style:italic; font-size:13px; color:#666 }

.contact-left .submit-button { background:url(/images/design/button-submit-question.png); width:316px; height:44px; margin:55px 0px 15px 190px; display:block; border:none; cursor:pointer }

.contact-right { width:200px; float:right }
.contact-right .blue-box { background:#e7f5f9; padding:15px; }
.contact-right .blue-box h3 { margin-bottom:0px; font-size:21px }
.contact-right .blue-box p { border-bottom:solid 1px #c2dcec; padding:12px 0px; margin-bottom:16px; line-height:22px; }
.contact-right .blue-box p.nohr { border-bottom:none }

.number-only { padding:5px; color:#666 }
.contact-field-error { border:solid 2px #FF9191; background:#FFCCCC }
.error-message { border:solid 2px #FF9191; background:url(/images/design/cross_circle.png) no-repeat 5px center #FFCCCC; padding:7px 7px 7px 25px; margin:18px 0px 0px 0px; } 

.notification {
                position: relative;
                margin: 0 0 15px 0;
                padding: 0px;
                border: 1px solid;
                background-position: 12px 14px !important;
                background-repeat: no-repeat !important;
                font-size: 15px;
                width: 99.8%;
                }
                
.successNotif {
                background: #d5ffce url('//images/design/tick_circle.png');
                border-color: #9adf8f;
                color: #556652;
                }
.errorNotif {
                background: #ffcece url('//images/design/cross_circle.png');
                border-color: #df8f8f;
                color: #665252;
                }
                
.notification div {
                display:block;
                font-style:normal;
                padding: 10px 10px 10px 36px;
                line-height: 1.5em;
                }

.notification .close {
                color:#990000;
                font-size:9px;
                position:absolute;
                right:8px;
                top:8px;
				cursor:pointer;
                }



/* careers */
.careers-heading { background:url(/images/design/careers-heading.png); width:940px; height:48px; margin-top:15px; position:relative }
.careers-main { margin-top:25px; margin-bottom:30px; padding-bottom:35px; font-size:15px; color:#333; line-height:19px; }
.careers-main p { padding:10px 0px; }
.careers-main p.sub-title { font-size:24px; line-height:30px; }
.careers-main p strong.title { font-size:18px; line-height:24px; }
.careers-main .job-list { margin:0px 0px 15px 45px }
.careers-main .job-list li { list-style:disc; padding:8px 0px 5px 0px }



/* press */
.press-heading { background:url(/images/design/press-heading.png); width:940px; height:48px; margin-top:15px; position:relative }
.press-heading img { margin:15px 10px 0px 0px; border:none; float: right }
.press-main { margin-top:35px; margin-bottom:35px; padding-bottom:35px; }

.press-list li { padding:19px 0px; border-bottom:dotted 1px #ddd }
.press-list li span { color:#999; font-size:14px; font-style:italic; font-weight:bold; float:right }
.press-list li p { font-size:15px; color:#333; line-height:20px; padding:7px 0px 0px 0px }
.press-list li p img { vertical-align:middle }



/* popup */
#ad-popup { background:#fff; width:820px; margin:0px auto 0px auto; }
#ad-popup .heading { background:url(/images/design/ad-head-bg.png) repeat-x; height:89px; line-height:89px; }
#ad-popup .heading h3 { background:url(/images/design/ad-logo.png); width:389px; height:55px; margin:16px 0px 0px 31px; position:relative; float:left }
#ad-popup .heading h3 span { position:absolute; top:-5000px }
#ad-popup .heading .right { width:320px; font-size:18px; color:#85c1f4; float:right }
#ad-popup .heading a { font-size:18px; color:#85c1f4; }
#ad-popup .container { padding:25px }

#ad-popup .info { font-size:17px; }
#ad-popup .info strong.important { font-size:23px }

#ad-popup .shadow { background:url(/images/design/ad-shadow.png) no-repeat center center; height:6px; margin:24px 0px; }

#ad-popup .container li {padding:5px 10px 5px 0px; width:250px; height:70px; font-size:15px; line-height:20px; float:left }
#ad-popup .container li.right {  height:150px; width:240px; float:right }
#ad-popup .container li strong { font-size:17px; font-weight:bold }
#ad-popup .container li strong.green { color:#39841f }
#ad-popup .container li p { padding-left:0px }

#ad-popup .button { width:227px; height:44px; display:block; margin:15px auto; overflow:hidden; position:relative }
#ad-popup .button img { position:absolute; top:0px; left:0px; }





/* 404 */
.error-page { width:932px; margin:40px auto; font-family:Arial, Helvetica, sans-serif; }
.error-page .error-logo { width:880px; margin:0px auto 10px auto; height:50px; position:relative }
.error-page .error-logo #logo { width:266px; height:50px; overflow:hidden }
.error-page .error-logo img.logo { position:absolute; left:0px; }
.error-page .error-logo .error-follow { position:absolute; font-size:12px; right:0px; top:35px; }
.error-page .error-logo .error-follow a { color:#333 }
.error-page .error-logo .error-follow img { margin-left:10px; vertical-align:middle; }

.error-page .error-content { background:url(/images/design/404_main.png); width:880px; height:290px; margin:0px auto; position:relative }

.error-page .error-text { position:absolute; left:260px; top:80px; color:#333; }
.error-page .error-text h2 { font-size:65px; padding:0px; margin:0px 0px 10px 0px; }
.error-page .error-text .error-uh { font-size:32px; color:#666; line-height:40px; }
.error-page .error-text .error-smallerfont { font-size:22px }
.error-page .error-text .error-nav { margin-top:80px; }
.error-page .error-text .error-nav a { color:#00488B; font-size:16px; }
.error-page .error-text .error-nav a:hover { text-decoration:none }
.error-page .error-text .error-nav ul { margin-top:20px }
.error-page .error-text .error-nav li { float:left }
.error-page .error-text .error-nav li span { padding:0px 15px; color:#999 }

.error-page .error-bottom { background:url(/images/design/404_bottom.png); width:932px; height:40px; color:#fff; font-size:12px; line-height:32px; text-align:center }
.error-page .error-bottom a { color:#fff }
.error-page .error-bottom a:hover { text-decoration:none }





/* Styles for validation helpers
-----------------------------------------------------------*/


.error
{ 
 font-size:13px; color:#ff0000; margin:0px 0px 0px 10px; padding:0px; width:100%; padding-left:190px; padding-top:7px; float:left;
}

.field-validation-error
{
   
     font-size:smaller;color:Red;
}

.field-validation-valid
{
    display: none;
}

.input-validation-error
{
    font-size:smaller;color:Red;
}

.validation-summary-errors
{
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid
{
    display: none;
}