/*-----------------------------+
  Site:     Hotello TOP
  Author:   Gerard Konings
	Company:  Novaware 
	          www.novaware.nl
+------------------------------+
  COLORS
  
  background
  + main:                #cecece;
/  + container:           #ababab
  
  text
/  + main:                #333
/  + rightcolumn:         #000
  
  headers
/  + h1, h2               #00600f
/  + h3, h4, h5, h6       #000
  
  links
/  + standard:            #00600f
/  + visited:             #098761
/  + hover:               #aaf433

  menu
	  + standard           #616161
		
+-----------------------------*/

/*------------------------------
  Import
------------------------------*/

@import 'reset.css';
@import 'g960_16_small.css';


/*------------------------------
  Typography
------------------------------*/

html { font-family: Arial,Helvetica,Tahoma,sans-serif; font-size: 12px; }

a { text-decoration: none; }

p, #content li a, #content li { font-size: 100%; line-height: 20px; }

h1, h2, h3, h4 { color: #f33846; font-weight: bold; clear: both; padding-bottom: 5px; }
h1 { font-size: 22px; }
h2 { font-size: 16px; }
h2 .h2_datum { color: #616161; font-size: 14px; padding-left: 5px; }

h3 { font-size: 12px; color: #252525; padding-bottom: 0px; }

h4 { font-size: 13px; color: #252525; }

#content a, #login a.logout { color: #f33846; font-weight: bold; }


/*------------------------------
  Global
------------------------------*/

html { background: #fff; }

/*------------------------------
  Header
------------------------------*/

#header { float: left; clear: left; width: 50%; height: 159px; background: url(htn/bg_header.gif) repeat-x; }

#header .logo { margin: 33px 0 0 0; }

#header .alignright { z-index: 2; float: right; position: relative; left: 480px; }

#headerback { float: left; height: 159px; width: 100%; background: url(htn/bg_header_right.gif) repeat-x; }

#login { padding: 5px; height: 69px; width: 141px; float: right; background: url(htn/bg_login.png); clear: both; }

#login a.logout { float: right; height: 20px; clear: both; }

#login ol { float: left; width: 100%; clear: both; line-height: 20px; }

#login ol img.profile_picture { float: right; clear: right; }

#login ol a { color: #616161; text-decoration: none; }

#login input { float: left; width: 110px; height: 16px; font-size: 10px; margin: 0px 0 5px 0; border: 1px solid #c4c4c4; font-style: italic; color: #939393; padding: 1px; }

#login .login_submit { float: left; width: 21px; height: 20px; position: relative; cursor: pointer; background: url(htn/htn_button.png) no-repeat; margin: 0; padding: 0 0 0 27px; border: 0px; }

#login .question { padding-left: 9px; padding-right: 8px; background: url(htn/htn_button_hover.png) no-repeat; background-position: top left; color: White; margin-left: 0px; font-size: 18px; }


/*------------------------------
  Navigation
------------------------------*/
#servicenav { height: 36px; line-height: 36px; list-style-type: none; text-align: right; clear: both; float: right; }

#servicenav li { float: left; padding: 0 3px; color: #969696; }

#servicenav li a { color: #969696; }

#mainnav { height: 50px; line-height: 50px; margin: 0px 0 0 0; padding: 0px 0 0 0px; background: url(htn/mainnav.gif) no-repeat; list-style-type: none; clear: both; position: relative; top: -15px; }
#mainnav li { display: block; width: 100px; float: left; text-align: center; }

#mainnav li a { color: #616161; font-size: 16px; display: block; position: relative; top: -5px; }

#mainnav li.active { background: url(htn/mainnav_active.png); color: #fff; }

#mainnav li.active a { color: #fff; }


/*------------------------------
  Duobox / solobox
------------------------------*/

.solobox, .duobox, .solobox_search { margin: 0 0 8px 0; padding: 0; }

.solobox, .solobox .add_background, .duobox, .duobox .add_background, .solobox_search, .solobox_search .add_background { float: left; }
.duoboxleft, .duoboxright, .soloboxinner { padding: 20px; padding-top: 20px; padding-bottom: 20px; }

.solobox_search .soloboxinner { padding-top: 10px; }

.duoboxleft, .soloboxinner { padding-left: 20px; }

.duoboxleft { padding-right: 0; }

.duoboxright { padding-left: 60px; }


.mainpageboxright { position: relative; left: -8px; }

.left_wide, .left_small, .right_small_top, .right_small_bottom { display: block; float: left; margin: 0px; padding: 20px; position: relative; }
.left_wide { width: 671px; height: 310px; }
.left_small { width: 197px; height: 200px; }
.right_small { width: 212px; height: 350px; }
.right_small_top { width: 212px; height: 310px; }
.right_small_bottom { width: 212px; height: 200px; }

.left_wide_left, .left_wide_right { float: left; width: 325px; }
.left_wide_right { padding-left: 20px; }


/*------------------------------
  Content
------------------------------*/

#content { float: left; clear: left; width: 100%; background: #cecece; }

#content .kruimelpad { padding: 0 0 25px 0; color: #707070; }

#content .kruimelpad a { color: #333; }

#content ul { padding: 5px 0 20px 0; clear: left; }

#content ul li { padding-left: 20px; background: url(htn/star.png) no-repeat 0 5px; }

#content ul li .related_date { color: #616161; float: left; width: 75px; }

#content ul li .related_link { }

#content table { width: 100%; float: left; }

#content table td  { vertical-align: top; min-width: 120px; line-height: 23px;}

#content textarea { width: 94%; float: left; }

#content table td input { width: 94%; float: left; }

#content input { float: left; }

#content input.text { width: 100%; height: 14px; width: 300px; font-size: 11px; border: 1px solid #c4c4c4; margin: 3px 10px 10px 0; font-style: italic; color: #939393; padding: 1px; }

#content input.button_zoek { background: url(htn/button_zoek.gif) bottom no-repeat; width: 54px; height: 22px; padding: 0 0 0 0; margin: 0; border: 0; color: #000; font-weight: bold; line-height: 11px; }

#content input.btn_zoek { background: url(htn/button_zoek.gif) bottom no-repeat; width: 54px; height: 22px; padding: 0 0 0 0; margin: 0; border: 0; color: #000; font-weight: bold; line-height: 11px; }

#content input.button_rubrieken { background: url(htn/button_rubrieken.gif) no-repeat; width: 125px; height: 36px; padding: 5px 0 0 0; margin: 0; border: 0; color: #000; font-weight: bold; line-height: 12px; float: right; position: relative; left: -30px; cursor: pointer; }

#content input.button_83 { background: url(htn/button_83.gif) bottom no-repeat; width: 83px; height: 22px; padding: 2px 0; margin: 0 0 3px 3px; border: 0; color: #000; font-weight: bold; line-height: 10px; font-size: 11px; }

#content .googlemap_search { height: 40px; }

#content .googlemap_search .text { width: 200px; }

#content .googlemap_main, #content .googlemap_profile { float: left; clear: both; width: 910px; height: 300px; }

#content .googlemap_profile { width: 550px; }

#content .googlemap_main_bottom, #content .googlemap_zoom, #content .googlemap_results, #content .rubriekennav { float: left; display: inline; }

#content .googlemap_main_bottom { clear: both; display: block; line-height: 20px; height: 45px; padding: 0; width: 900px; }

#content .googlemap_main_bottom .googlemap_zoom, #content .googlemap_main_bottom .googlemap_results { padding-top: 5px; line-height: 27px; }

#content .googlemap_main_bottom .googlemap_results { float: right; position: relative; left: 110px; }

.googlemap_zoom img { margin-right: 5px; }

.rubriekennav { height: 18px; z-index: 100; clear: none !important; }

#content img { float: none; padding: 2px 0; }

#content img.left { float: left; padding: 5px 15px 5px 0; }

#content p { padding: 0 0 15px 0; float: none; }

#content p.datumplaats { color: #616161; padding: 0; }

#content p.intro { font-weight: bold; }

#content p:last-child { padding: 0; }


#content .social_links { display: block; float: right; width: 100%; text-align: right; }

#content .social_links img { float: none; }

.profile_right { float: right; width: 90px; }

.profile_left { float: left; width: 100%; }

.profile_left h1, .profile_left h3 { width: 100%; }


#content a.wijzigen { float: right; font-size: 12px; padding-right: 5px; }

.fotothumbs img { float: none !important; }

.fotothumbs a { float: none !important; padding: 1px 2px; }


/*------------------------------
  Rubriekenmenu
------------------------------*/

.rubriekenmenu { top: 00px; z-index: 200; height: 200px; width: 230px; left: 150px; float: right; top: -200px; position: relative; }

.rubriekenmenu_inner { position: absolute; left: 0; bottom: 0; width: 255px; }
.rubriekenmenu_inner ul { background: url(htn/rubrieken_top.png) no-repeat; padding: 0 !important; margin-right: 30px; }

.rubriekenmenu_inner ul li { background-image: none !important; line-height: 30px !important; border-bottom: 1px solid #9b9b9b; padding: 0 0 0 10px !important; width: 208px; }

.rubriekenmenu_inner ul li img { margin: 0 5px; }

.rubriekenmenu_inner ul li:first-child { padding-top: 6px !important; }

.rubriekenmenu_inner ul li.dark { background: #ddd !important; }

.rubriekenmenu_inner ul li:last-child { border: 0; }

.rubriekenmenu_inner ul li input.checkbox { position: relative; top: 5px; }

/*------------------------------
  Accordion
------------------------------*/

#accordion { padding-bottom: 10px; width: 330px; }

#accordion h3 { background: #cbcbcb; height: 30px; color: #616161; border-left: 1px solid #cbcbcb; border-right: 1px solid #cbcbcb; border-top: 1px solid #e1e1e1; }

#accordion h3:first-child { border-top: 1px solid #cbcbcb; }

#accordion h3 a { line-height: 30px; font-size: 14px; font-weight: normal; color: #616161; text-transform: capitalize; }

#accordion div { padding: 0 10px; background: #e1e1e1; border-left: 1px solid #cbcbcb; border-right: 1px solid #cbcbcb; }

#accordion ul { padding-bottom: 0px; }

#accordion div:last-child { border-bottom: 1px solid #cbcbcb; }


#accordion .ui-icon { display: inline; float: left; width: 30px; height: 30px; }

#accordion .ui-icon-triangle-1-s { background: url(htn/acc_down.gif) no-repeat 10px 10px; }

#accordion .ui-icon-triangle-1-e { background: url(htn/acc_right.gif) no-repeat 14px 10px; }

/*------------------------------
  Sponsors
------------------------------*/

#logoParade { margin: 0px auto 20px; text-align: center; width: 950px; height: 75px; position: relative; background: #fff; height: 63px; margin-top: 0; }

#logoParade div.scrollableArea img { padding-top: 8px; float: left; margin-left: 25px; height: 47px; }

#logoParade div.scrollableArea a { display: block; float: left; }

.sponsoroverzicht { background: #fff; padding: 0; width: 100%; text-align: center; margin: 0; margin-bottom: 20px; float: left; }

.sponsoroverzicht div.inner { float: left; width: 100%; text-align: center; margin-bottom: 20px; padding: 20px 10px; }
.sponsoroverzicht a { margin: 0 auto; float: left; width: 125px; }
.sponsoroverzicht h1 { margin-bottom: 10px; text-transform: capitalize; }

.sponsoroverzicht img { float: left; margin: 0 auto; }

/*------------------------------
  Footer
------------------------------*/

#footer { float: left; clear: left; height: 30px; width: 100%; background: #252525; color: #d5d5d5; }

#footer a { color: #fff; }

#footerleft, #footerright {  }

#footerright { float: right; }

.border { background: #00f; }


object { float: left; padding: 4px; }

/*------------------------------
  Contactformulier
------------------------------*/
.contactformulier { float: left; padding: 0 0 30px 0; }

.contactformulier li { float: left; width: 500px; height: 24px; }

.contactformulier h2 { padding: 15px 0 3px; font-size: 14px; height: 24px; line-height: 4px; }

.contactformulier label { float: left; width: 160px; }

.contactformulier input { float: left; width: 160px !important; color: #000 !important; font-style: normal !important; }

.contactformulier .privepostcode, .contactformulier .zakelijkpostcode { width: 45px !important; }

.contactformulier .priveplaats, .contactformulier .zakelijkplaats { width: 101px !important; }

.contactformulier .jaar { width: 45px !important; }

.contactformulier .checkbox input { float: left; width: 10px !important; }

.contactformulier .checkbox { float: left; width: 24px !important; }

.contactformulier .button { float: left; margin: 5px 0 20px 160px; width: 100px !important; }


/*-------------------------
  profile edit
-------------------------*/
.profiletable { width: 100%; padding: 0px 0px 6px 4px; height: 18px; }
.profiletable textarea { width: 100%; height: 18px; }
.profiletable select { width: 100%; height: 24px; }
.profiletable input { width: 98%; height: 18px; }
.profiletable td { padding: 0px 0px 3px 4px; }
.profiletabel td label { font-weight: bold; }
.rowaccent td { background-color: #C9C9D2; margin-bottom: 3px; padding-top: 2px; line-height: 18px; }
.rowaccent input { width: 96%; }
.profileimage { float: right !important; height: 75px !important; display: inline-block; }
.profilesubheader td { font-weight: bold; padding-top: 10px; margin-top: 10px; }
#dHeader { height: 75px; }
#dName { float: left; }
.checkboxnarrow input { width: 20px; margin-right: 10px; }
.rowcombinetop td { padding-bottom: 0px; }
.rowcombine td { padding-top: 0px; padding-bottom: 0px; }
.rowcombinebottom td { padding-top: 0px; }
.h2paddingtop { padding-top: 10px; }
.strng { font-weight: bold; vertical-align: top; }

/*---------------------------
  popup (from outer to inner)
  override defaults with 
  !important
----------------------------*/

.ero { background-color: Transparent !important; }
.ero a { color: #F33846; }
.ero .ero-beak { background-color: Transparent !important; }
.ero .ero-body { background-color: Transparent !important; border-style: hidden !important; width: auto !important; }
.ero .ero-actionsBackground { background-color: Transparent !important; width: auto !important; }
.ero .ero-previewArea { background-color: Transparent !important; border-style: hidden !important; }
.ero .ero-previewArea p { color: white !important; }
.ero .firstChild { background-color: Transparent !important; }
.VE_Pushpin_Popup_Body { background-color: Transparent !important; }
.ero .ero-shadow { background-color: Transparent !important; }
.ero-leftBeak { padding: 0px !important; }
.ero-leftBeak .ero-beak { background: url('htn/Beak.png') !important; height: 16px !important; width: 8px !important; margin: 8px 0px 0px 1px !important; }
.ero .ero-previewArea div.firstChild { margin: 0px 0px 0px 8px !important; }

/* ------------*/
.wide_pin { width: 290px; }
.wide_pin_top { background: url(htn/pin_wide_top.png) no-repeat; width: 290px; height: 8px; }
.wide_pin_middle { background: url(htn/pin_wide_middle.png); width: 274px; padding: 0 8px; min-height: 100px; }
.wide_pin_bottom { background: url(htn/pin_wide_bottom.png) no-repeat; width: 290px; height: 8px; }

.wide_pin_image { color: #FFFFFF; font-family: arial; font-size: 11px; float: right; max-height: 60px; overflow: hidden; }
.wide_pin_image_content { width: 50px; min-height: 20px; max-height: 60px; border: 1px solid #FFFFFF; margin-top: 8px; border: 1px solid #CCCCCC; }
.wide_pin_description { float: left; }
.wide_pin_description_text { color: #FFFFFF; font-family: arial; font-size: 11px; width: 200px; overflow: auto; }
.wide_pin_description_wide_text { color: #FFFFFF; font-family: arial; font-size: 11px; width: 280px; overflow: auto; }
.wide_pin_link { color: #FFFFFF; font-family: arial; font-size: 11px; position: relative; bottom: 0px; left: 1px; }
#pin_wide_profile_link { width: 10px; height: 11px; background: url(htn/star.png) no-repeat center; display: inline-block; }

/* silvercircle */
.grid_left_wide { width: 681px; float: left; }
.left_wide_scroll_area { width: 630px; overflow: auto; }
.left_wide_profile { width: 640px; padding: 20px; float: left; position: relative; }
.profile_header { width: 100%; height: 30px; }
.grid_right_small { width: 242px; float: left; }
.right_small_scroll_area { width: 230px; overflow: auto; }
.right_small_profile { width: 240px; padding: 20px; }
.right_small_profile_photo { float: left; margin: 0 2px; }

#content input.button_83 { background: url(htn/button_83.gif) bottom no-repeat; width: 83px; height: 22px; padding: 2px 0; margin: 0 0 3px 3px; border: 0; color: #000; font-weight: bold; line-height: 10px; font-size: 11px; }
#content input.button_83.right { background: url(htn/button_83.gif) bottom no-repeat; width: 83px; height: 22px; padding: 2px 0; margin: 0 0 3px 3px; border: 0; color: #000; font-weight: bold; line-height: 10px; font-size: 11px; float: right !important; }
/* Home page */
div#dJobsLogo img { width: 100%; }

.popup { width: 300px; height: 150px; background-color: #CECECE; z-index: 99999; border: solid 1px gray; padding: 10px; }
.popupbg { background-color: Transparent; opacity: 0.7; }
.modalBackground { background-color: Gray !important; filter: alpha(opacity=70) !important; opacity: 0.7 !important; }


/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */
