/*
Site Name: Web Gallery Plus Plus - Collection of Best of the Best Web Design Inspiration
Theme Name: Web Gallery Plus Plus Multi Color
Theme URI: http://webgalleryplusplus.com/
Description: Web Gallery Plus Plus is a collection of website design and web design resources link to help some beginner to professional designer to improve there skills
Version: 1
Author: Jonathan Concepcion a freelance web designer and front-end developer
Author URI: http://jonathanconcepcion.com
Theme copyright by: WebGalleryPlusPlus.com
*/
/* Global Style */
body, div, p, h1, h2, h3, h4, h5, h6, input, form, label, ul, li, ol, textarea { margin: 0; padding: 0; font-family: Verdana, Arial, Helvetica, sans-serif; }
body, #the-cat, #the-cat-nav, .sidebar-div { background-color: #000; font-size: 10px; color: #FFF; }
#content-wrapper, #s-field, .contact-form ol li input, .contact-form ol li textarea { background: #000 url(../assets/content.png) 0 0 no-repeat scroll; }
#main-nav-wrapper, #main-nav-container, #main-nav-container ul { height: 29px; }
#search-form label, .display-none { display: none; }
#content-container { padding: 31px 0; }
#content { width: 468px; }
#sidebar-a, #sidebar-b { width: 200px; margin-left: 26px; }
#wrapper { width: 100%; }
.float-left, .int-m, .int-h, .int-f, #intro ul li h3, .h-icon, .f-icon, .m-icon, #image-thumb li, #pagination span, #pagination a { float: left; }
.float-right, #pagination { float: right; }
.clear-both, #intro ul li p, #pagination { clear: both; }
blockquote { padding: 5px 10px !important; margin: 0 5px; background: url(../assets/content.png) -812px -104px no-repeat scroll; }
a, a:hover, a:active { outline: none; }
a { color: #FFF; text-decoration: underline; font-weight: bold; }
em { font-style: normal; }

/* Start Haccordion */
#haccordion-wrapper { height: 309px; }
#haccordion-container { padding-top: 31px; }

/* Begin Header */
#header-container h1 a, .kroeger, #header-container, #content { overflow: hidden; }
#header-container h1 a, #s-submit { text-indent: -5000px; }
#header-container h1 a, #main-nav-container ul .mn a, .int-m, .int-h, .int-f, .colorscheme ul li a { display: block; }
#header-wrapper, #main-nav-wrapper, #haccordion-wrapper, #content-wrapper, #footer-wrapper, #title-header-wrapper { min-width: 920px; padding-right: 35px; }
#header-container, #main-nav-container, #haccordion-container, #content-container, #footer-container, #title-header-container { width: 920px; margin-left: 15px; }
#header-container { height: 79px; padding-top: 17px; background: #000 url(../assets/flavor.gif) 796px 77px no-repeat scroll; }
#header-container h1 a { width: 389px; height: 56px; }
#title-header-wrapper { height: 92px; }

/* Start Search */
#search-form { width: 215px; height: 23px; margin-top: 7px; }
#search-form input { font-size: 10px; font-weight: bold; }
#s-field { width: 168px; height: 13px; padding: 5px; color: #FFF !important; }
#s-field:hover, #s-field:focus { color: #FFF; }
#s-field:focus { border-color: #FFF; }
#s-submit { width: 28px; height: 25px; line-height: 5000px; border: none; }

/* Start Main Navigation */
#main-nav-container ul, #intro ul, #the-cat, #the-cat-nav, #image-thumb, #r-comment { list-style: none; }
#main-nav-container ul .mn { float: left; background: transparent url(../assets/divider.gif) right 6px no-repeat scroll !important; line-height: 25px; padding-right: 1px; }
#main-nav-container ul .mn a { float: left; padding: 0 9px 0 8px; height: 29px; color: #FFF; font-size: 10px; font-weight: bold; text-decoration: none; }

/* Start Colorscheme */
.colorscheme, .cs { background-image: none !important; text-indent: 0px !important; }
.colorscheme ul { width: 78px; padding: 0 5px; }
.colorscheme ul li { float: left; margin: 7px 3px 0; }
.colorscheme ul li a { height: 9px; width: 9px; overflow: hidden; text-indent: -5000px; background-image: url(../assets/minicons.gif); }
.colorscheme ul li a:hover { border-color: #FFF; }
.cs-def { background-color: #8C0606; }
.cs-h160 { background-color: #068D8E; }
.cs-h35 { background-color: #8E0655; }
.cs-des { background-color: #4A4A4A; }

/* Start sIFR */
.kroeger { margin-top: 44px; margin-left: 11px; height: 200px; width: 7px; }
.blue_highway-24 { margin-left: 25px; font-size: 16px; font-style: italic; font-weight: bold; height: 30px; overflow: hidden !important; }
.blue_highway { margin-left: 25px; font-size: 21px; font-style: italic; font-weight: bold; height: 35px; overflow: hidden; }
@media screen {
	.sIFR-flash { visibility: visible !important; margin: 0; }
	.sIFR-replaced { visibility: visible !important; }
	.sIFR-hasFlash .kroeger { visibility: hidden; font-size: 8px; }
	.sIFR-hasFlash .blue_highway-24 { visibility: hidden; font-size: 16px; }
	.sIFR-hasFlash .blue_highway { visibility: hidden; font-size: 21px; margin-top: -7px; }
	span.sIFR-alternate { position: absolute; left: 0; top: 0; width: 0; height: 0; display: block; overflow: hidden; }
}
@media print {
	.sIFR-flash, .sIFR-flash object, .sIFR-flash embed { display: none !important; height: 0; position: absolute; overflow: hidden; }
	span.sIFR-alternate { visibility: visible !important; display: block !important; position: static !important; left: auto !important; top: auto !important; }
}

/* Start Introduction */
#title-header-container { padding-top: 51px; }
#intro { height: 250px; width: 200px; }
#intro ul li { margin-bottom: 25px; }
#intro ul li h3, #intro ul li h3 a { font-size: 12px; font-weight: bold; text-decoration: none; color: #FFF; margin-bottom: 9px; }
#intro ul li h3 a:hover { text-decoration: none; padding-bottom: 2px; border-bottom: 1px solid #FFF; }
.int-m, .int-h, .int-f { width: 45px; height: 17px; margin-right: 7px; background-image: url(../assets/accessories.png); background-repeat: no-repeat; }
.int-m { background-position: -3px -41px; }
.int-h { background-position: -3px -3px; }
.int-f { background-position: -3px -22px; }

/* Sidebar A and Sidebar B content, ol, li, ul */
#the-cat, #the-cat-nav, .sidebar-div, #r-comment, #bookmark-list { margin-bottom: 31px; }
#the-cat li, #the-cat li a, #the-cat-nav li, #the-cat-nav li a, #bookmark-list li, #bookmark-list li a { height: 21px !important; width: 196px; line-height: 20px; display: block; font-weight: bold; color: #FFF; text-decoration: none; text-indent: 5px; }
#the-cat li a, #the-cat li a:hover, #the-cat-nav li a, #the-cat-nav li a:hover, .active-cat, #bookmark-list li a { background-image: url(../assets/cat-icon.gif); }
#the-cat li a, #the-cat-nav li a, #bookmark-list li a { background-position: 173px -21px; background-repeat: no-repeat; }
#the-cat li a:hover, #the-cat-nav li a:hover, .active-cat, #bookmark-list li a:hover { background-position: 173px 0px !important; background-repeat: no-repeat; }
#the-cat li a:hover, #the-cat-nav li a:hover, .active-cat, #bookmark-list li a:hover { background-color: #171717; }
.rss-icon { height: 16px; font-style: normal; color: #FF6600; background: transparent url(../assets/bullet_feed.gif) 4px 2px no-repeat scroll; padding-left: 18px; display: block; cursor: pointer; }
.sidebar-div p { padding: 5px; line-height: 14px; }
.h-icon, .f-icon, .m-icon { background-position: 5px 5px; background-repeat: no-repeat; display: block; text-indent: 35px; font-style: normal; }
.h-icon, .h-icon-t { background-image: url(../assets/h-icon.gif) !important; }
.f-icon, .h-icon-f { background-image: url(../assets/f-icon.gif) !important; }
.m-icon, .h-icon-m { background-image: url(../assets/m-icon.gif) !important; }
.icon, .pos { margin-bottom: 15px !important; }

/* Start Gallery Thumbnail Display */
#image-thumb { width: 494px; }
#image-thumb li { width: 210px; height: 170px; padding: 5px; background: #000 url(../assets/thumb-bdr.png) 0 0 repeat-x scroll; margin-right: 27px; margin-bottom: 27px; }
#image-thumb li div { border: 1px solid #000; padding-left: 4px; padding-top: 5px; height: 163px; overflow: hidden; }
#image-thumb li div a { font-weight: bold; text-decoration: none; color: #FFF; }
#image-thumb li div a:hover { text-decoration: underline; }
#image-thumb li div h3 { font-style: normal; font-size: 10px; }
#image-thumb li div img { margin: 6px 0 3px; }
#image-thumb li div a img { padding: 1px; background-color: #000; }
#r-comment li a { padding: 5px; display: block; color: #FFF; text-decoration: none; height: 100%; }
#r-comment li a:hover { border-left-color: #FFF; }
.r-author { font-weight: bold; }
.h-icon-t, .h-icon-m, .h-icon-f { width: 24px; height: 12px; display: block; margin-right: 4px; }
.h-icon-t, .h-icon-m, .h-icon-f, .preview { margin-right: 4px; }

/* Start Pagination */
#pagination { margin-bottom: 20px; padding-right: 2px; }
#pagination span, #pagination a { height: 20px; width: 20px; background-color: #333 !important; text-align: center; line-height: 19px; margin-right: 5px; color: #FFF; text-decoration: none; font-weight: bold; }
#pagination a:hover { text-decoration: underline; }
#pagination span { color: #555 !important; cursor: default; }
#pagination a.move { width: 39px !important; }

/* contact and comment forms */
#cf2_field_1, #cf2_field_2, .tl-f { width: 134px; margin-right: 5px; }
#cf2_field_3, .tl-a { width: 194px !important; max-height: 305px !important; }
#cf2_field_1, #cf2_field_2, #cf2_field_3, .tl-f, .tl-a, .tl-s { padding: 2px; background-image: url(../assets/content.png); background-color: #333; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; color: #FFF !important; }
#cf2_field_3, .tl-a { border-bottom-width: 5px !important; height: 72px; }
#cf2_field_1:focus, #cf2_field_2:focus, #cf2_field_3:focus, .tl-f:focus, .tl-a:focus { border-color: #FFF !important; }
.tellafriend { margin-top: -15px; margin-bottom: 31px; }
.tellafriend ol { list-style: none; }
.tellafriend ol li label { display: none; }
.tellafriend ol li { margin-bottom: 11px; }
.reqtxt, .emailreqtxt { font-size: 9px; }
.cf-sb { text-align: right; }
.tl-s { background-color: #323232 !important; background-image: none !important; padding: 1px 3px  !important; }

/* Start Single Page */
#comments ol, #trends ol, #respond form { margin-top: 10px; list-style: none; }
#comments ol li, #trends ol li { clear: both; padding: 10px 0; border: none !important; min-height: 97px; }
#interact-wgpp { width: 468px; }
.h2-title { font-size: 10px; margin-left: 7px; margin-bottom: 9px; }
.single-p p a:hover { font-weight: bold !important; text-decoration: underline; color: #FFF !important; }
.single-p, #comments, #trends, #respond { margin-bottom: 30px; }
.single-p img { margin: 0 -5px 15px; }
.single-p img { background: #000; padding: 3px; border-width: 2px !important; width: 458px; }
.trends { width: auto !important; margin-left: 0 !important; }
.single-p a:hover img { border-color: #FFF; border-width: 1px !important; padding: 4px; }
.single-p p { margin-bottom: 15px; padding: 0 5px; }
.single-p p a { font-weight: bold; color: #FFF; }
.c-img-container { float: left; width: 86px; }
.c-content-container { width: 363px; float: right; }
.c-img-container img, .c-img-container a img { height: 80px !important; width: 80px !important; background-color: #000; }
.cp-content { display: block; padding: 5px; color: #FFF !important; border-left-width: 2px !important; border-right: none !important; border-bottom: none !important; border-top: none !important; background: #000 url(../assets/content.png) -716px -149px no-repeat scroll; }
.cp-comment { padding: 0 5px !important; }
.cp-content p { margin: 0 !important; padding: 5px 0; }
.cp-content p img { border: 4px solid #151515; }
.h3-com { margin-bottom: 10px; font-size: 12px; }
.c-content-container p { margin-bottom: 15px; }
.c-img-container a img { padding: 2px; }
.c-img-container a:hover img { border-color: #FFF; }
.c-title cite a { text-decoration: underline; }
.c-title cite a, .c-title cite { color: #FFF; font-weight: bold; font-style: normal; }
.c-title cite a:hover, .c-content-container a:hover { text-decoration: none !important; }
.search-result { margin-bottom: 5px !important; }
.design-trends-page { margin-top: -10px !important; }
.page-content { background-color: #000; padding: 0 5px; margin-bottom: 30px; }
.page-content a:hover, #content a:hover, #sidebar-a p a:hover, #sidebar-b p a:hover { text-decoration: none; }
.page-content p { line-height: 14px !important; }
.page-content p, .page-content h4 { padding: 5px 0; }
.page-content h4 { font-size: 12px; }
.search-error { margin-top: -30px; }
.suggest, .benefits { list-style: none; padding: 5px 0; }
.suggest li { margin: 5px 0; padding-left: 13px; background: #000 url(../assets/cat-icon.gif) no-repeat scroll -6px -25px; }
.benefits li { margin: 5px 0; padding-left: 19px; background: #000 url(../assets/benefits.png) no-repeat scroll 3px 1px; font-weight: bold; }
span.pages { display: none; }

/* Start Contact Form*/
.contact-form ol { list-style: none; }
.contact-form ol li { min-height: 40px; padding: 5px; clear: both; background: url(../assets/content.png) -812px -104px no-repeat scroll; border-bottom: 2px solid #000; }
.contact-form ol li label { width: 150px; font-weight: bold; float: left; height: 40px; }
.contact-form ol li input, .contact-form ol li textarea { width: 296px; padding: 5px; border-width: 1px; border-style: solid; background-color: #323232; font-size: 10px; font-weight: bold; color: #FFF; }
.contact-form ol li select { width: 180px; }
.contact-form ol li select, .contact-form ol li option { font-size: 10px; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif; }
.contact-form ol li input:focus, .contact-form ol li textarea:focus, .tl-s:focus { border-color: #FFF; }
.contact-form ol li textarea { width: 296px !important; /* safari hacks */ height: 150px; max-height: 300px !important; /* safari hacks */}
.contact-form ol li textarea { border-bottom-width: 5px; }
.sendbutton { background-image: none !important; background-color: #323232; font-size: 10px; color: #FFF; font-weight: bold; width: auto !important; padding: 5px 10px !important; float: right; }
.radio { padding: 0 !important; margin-right: 5px; line-height: 0; width: auto !important; border: none !important; background: none !important; }
.contact-form ol li label span { color: #FFF !important; font-weight: normal !important; font-size: 9px; }
.cf_hidden { display: none; }
.linklove { height: 1px; width: 1px; text-decoration: -5000px; overflow: hidden; display: block; }
input.cf_error, textarea.cf_error { background: url(../assets/color-scheme-index-bg.png) 0px -29px no-repeat scroll !important; }
option.cf_error, select.cf_error { color: #FFF !important; background-color: #8C0606; }

/* Start Screenshot for tooltip */
#screenshot { position: absolute; display: none; color: #fff; margin-top: -140px; }
#screenshot2 { position: absolute; display: none; color: #fff; margin-top: -50px; text-align: center; font-weight: bold; }
#screenshot img, #screenshot2 img { padding: 3px; background: #000 url(../assets/loader.gif) center center no-repeat scroll; }

/* Start Footer */
#footer-wrapper { padding-top: 12px; margin-top: -15px }
#footer-container { color: #333; height: 55px; }
#footer-container p { height: 15px; display: block; }
#footer-container a { font-weight: bold; color: #FFF; text-decoration: none; }
#footer-container a:hover { text-decoration: underline; }