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

body {
	/*background-color: #dedede;*/
	background-color: #e6e6e6;
	/*background-color: #f7f7f7;*/
	margin: 0;
	padding: 0;
}

p {
margin: 0;
padding: 0;
}

.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

/*-------------------------------------------------- START OF STYLES FOR DIV BLOCKS --------------------------------------------------*/

#topNavHorizontal {
	width: 100%;
	background-color: #293b5c;
	height: 100px;
}

#topNavInner {
	width: 1024px;
	margin-right: auto;
	margin-left: auto;
	/*background-color: gray;*/
}

#headerHorizontal {
	width: 100%;
	background-color: white;
}

#headerInner {
	width: 1024px;
	margin-right: auto;
	margin-left: auto;
}

#picturesHorizontal {
	width: 100%;
	background-color: #f7f7f7;
	border-top: 1px solid #dedede;
	border-bottom: 1px solid #dedede;
}
#picturesHorizontalWide {
	width: 100%;
	background-color: #f7f7f7;
	border-top: 1px solid #dedede;
	border-bottom: 1px solid #f7f7f7;
}

#picturesPanel {
	width: 1022px;
	background-color: #e6e6e6;
	border-left: 1px solid #dedede;
	border-right: 1px solid #dedede;
	border-top: 1px solid #e6e6e6;
	border-bottom: 1px solid #e6e6e6;
	margin: 0px auto;
}
#picturesPanelBorderless {
	width: 1024px;
	/*background-color: #e6e6e6;*/
	margin: 40px auto;
}
#picturesInner1024 {
	width: 1024px;
	margin: 40px auto 12px;
}
#picturesInner480 {
	width: 480px;
	margin: 39px auto 11px;
}
#picturesInner320 {
	width: 320px;
	margin: 39px auto 11px;
}
#picturesInnerFlash {
	width: 1024px;
	margin: 39px auto;
	text-align: center;
}
.picturesInnerBorderless {
	width: 1024px;
	margin: 40px auto 0;
	/*text-align: center;*/
}
.picturesInnerBorder {
	width: 1024px;
	margin: 40px auto 0;
	border: 1px solid #dedede;
}
.picturesInnerBorderlessSmall {
	width: 942px;
	margin: 40px auto;
	border: 1px solid #dedede;
	padding: 40px;
	background-color: white;
}

#descriptionHorizontal {
	width: 100%;
	background-color: white;
}
#descriptionHorizontalMultiple {
	width: 100%;
	background-color: white;
	border-top: 1px solid #e6e6e6;
}
#descriptionHorizontalNoThumbs {
	width: 100%;
	background-color: white;
	border-top: 1px solid #e6e6e6;
	border-bottom: 1px solid #e6e6e6;
	/*margin-bottom: 40px;*/
}

#descriptionInner {
	width: 1024px;
	margin-right: auto;
	margin-left: auto;
	background-image: url(dividerVertical.png);
}
#descriptionInnerWide {
	width: 1024px;
	margin-right: auto;
	margin-left: auto;
}

#thumbsHorizontal {
	width: 100%;
	background-color: #f7f7f7;
	border-top: 1px solid #dedede;
	border-bottom: 1px solid #dedede;
}

#thumbsInner {
	width: 1024px;
	margin: 40px auto 20px;
}

#tagsHorizontal {
	width: 100%;
	background-color: white;
}

#tagsInner {
	width: 1024px;
	margin-right: auto;
	margin-left: auto;
}

#footerHorizontal {
	height: 10px;
	font-size: 1px;
	margin-right: auto;
	margin-left: auto;
	
	width: 100%;
	/*width: 1024px;*/

	background-color: #dc1e34;
	/*background-color: #dedede;*/
}

.pictureBorder {
	border: 1px solid #000000;
}


/*-------------------------------------------------- END OF STYLES FOR DIV BLOCKS --------------------------------------------------*/

/*-------------------------------------------------- START OF STYLES FOR TOP NAV --------------------------------------------------*/

.logo {
	width:  372px;
	height: 36px;
	margin-top: 37px;
	float: left;
	background: url(logo-nhil.png) left top no-repeat;
	overflow: hidden; 
	text-indent: -99999px;
}
.logo:hover { background-position: 0px -36px; }

#topNav {
	float: right;
	text-align: right;
	margin-top: 37px;
	/*background-color: red;*/
	margin-right: -16px;
}
#topNav ul li {
	display: inline;
	list-style-type: none;
 	margin-left: 8px; 
 	margin-right: 0px; 
	font: 17px 'Ubuntu', sans-serif; font-weight: 300;
	letter-spacing: 1px;
	text-shadow: 0 1px 1px #000000;
}
#topNav a {
	text-decoration: none;
	color: #949dae;
	padding: 6px 14px;
	border-radius: 3px;
}
#topNav a:link {
	background-color: #293b5c;
	border: 1px solid #293b5c;
}
#topNav a:visited {
	background-color: #293b5c;
	border: 1px solid #293b5c;
}
#topNav a:hover {
	color: white;
	background-color: #293b5c;
	border: 1px solid white;
}
#topNav a:active {
	color: white;
	background-color: #5190c5;
	border: 1px solid #5190c5;
}
.topNavOn {
	color: white;
	padding: 6px 14px;
	border-radius: 3px;
	background-color: #5190c5;
	border: 1px solid #5190c5;
}

/*-------------------------------------------------- END OF STYLES FOR TOP NAV --------------------------------------------------*/

/*-------------------------------------------------- START OF STYLES FOR TAGS --------------------------------------------------*/

#tags {
	float: right;
	text-align: right;
	margin-top: 40px;
	margin-bottom: 40px;
	margin-right: -10px;
	color: #999999;
	width: 1044px;
	/*background-color: red;*/
}
#tags ul {
	padding-left: 0px; 
}
#tags li {
	display: inline;
	list-style-type: none;
	margin-left: 4px; 
	margin-right: 0px; 
	font: 12px 'Ubuntu', sans-serif; font-weight: 300;
}
#tags a {
	text-decoration: none;
	color: #999999;
	padding: 5px 7px;
	border-radius: 3px;
}
#tags a:link {
	background-color: white;
	border: 1px solid white;
}
#tags a:visited {
	background-color: white;
	border: 1px solid white;
}
#tags a:hover {
	color: #5190c5;
	background-color: white;
	border: 1px solid #5190c5;
}
#tags a:active {
	color: white;
	background-color: #5190c5;
	border: 1px solid #5190c5;
}
.tagsStart {
	color: #999999;
	padding-right: 16px;
	padding-left: 0px;
	text-transform: uppercase;
}
.tagsOn {
	color: white;
	padding: 5px 7px;
	border-radius: 3px;
	background-color: #5190c5;
	border: 1px solid #5190c5;
}

#tagsOff {
	float: left;
	text-align: center;
	margin: 40px auto;
	color: #999999;
	/*color: #b3b3b3;*/
	width: 1024px;
	font: 12px 'Ubuntu', sans-serif; font-weight: 300;
	letter-spacing: 0.25px;
	background-color: white;
}
#tagsOff a { text-decoration: none; }
#tagsOff a:link { color: #5190c5; }
#tagsOff a:visited { color: #5190c5; }
#tagsOff a:hover { color: #dc1e34; }
#tagsOff a:active { color: #dc1e34; }


/*-------------------------------------------------- END OF STYLES FOR TAGS --------------------------------------------------*/

/*-------------------------------------------------- START OF STYLES FOR THUMBS --------------------------------------------------*/

.thumbsRow {
	width: 1024px;
	display: table;
	margin-bottom: 11px;
}
.thumbsRowBig {
	width: 1024px;
	display: table;
	margin-bottom: 20px;
}
.thumbsBlock {
	width: 180px;
	height: 154px;
	display: marker;
	padding: 0px;
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 300;
	color: #808080;
	text-align: center;
	border: 2px solid #f7f7f7; 
	margin: -2px;
	/*text-transform: uppercase;*/
	letter-spacing: 0.25px;
}
.thumbsBlockBig {
	width: 226px;
	height: 190px;
	display: marker;
	padding: 0px;
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 300;
	color: #808080;
	text-align: center;
	border: 2px solid #f7f7f7; 
	margin: -2px;
	/*text-transform: uppercase;*/
	letter-spacing: 0.25px;
}
.thumbsBlock:hover {
    box-shadow: 0px 0px 0px 1px #5190c5;
	color: #5190c5;
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 400;
	background-color: white;
	border: 2px solid white; 
	margin: -2px;
}
.thumbsBlockBig:hover {
    box-shadow: 0px 0px 0px 1px #5190c5;
	color: #5190c5;
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 400;
	background-color: white;
	border: 2px solid white; 
	margin: -2px;
}
.thumbsSpacer {
	width: 31px;
	/*background-color: lime;*/
	display: table-cell;
	margin: 0px;
	padding: 0px;
}
.thumbsSpacerBig {
	width: 40px;
	/*background-color: lime;*/
	display: table-cell;
	margin: 0px;
	padding: 0px;
}
.thumbsBlockON {
	width: 180px;
	height: 154px;
	display: marker;
	padding: 0px;
	color: #5190c5;
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 400;
	text-align: center;
	letter-spacing: 0.25px;
	box-shadow: 0px 0px 0px 1px #5190c5;
	background-color: white;
	border: 2px solid white; 
	margin: -2px;
}

.thumbsBlockBigON {
	width: 226px;
	height: 190px;
	display: marker;
	padding: 0px;
	color: #5190c5;
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 400;
	text-align: center;
	letter-spacing: 0.25px;
	box-shadow: 0px 0px 0px 1px #5190c5;
	background-color: white;
	border: 2px solid white; 
	margin: -2px;
}


.thumbsRow2 {
	display: table;
	margin-bottom: 100px;
	margin-right: auto;
	margin-left: auto;
}
.thumbsBlock2 {
	width: 98px;
	height: 73px;
	display: marker;
	padding: 0px;
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 300;
	color: #808080;
	text-align: center;
	border: 2px solid #f7f7f7; 
	margin: -2px;
	/*text-transform: uppercase;*/
	letter-spacing: 0.25px;
}
.thumbsBlock2ON {
	width: 98px;
	height: 73px;
	display: marker;
	padding: 0px;
	color: #808080;
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 400;
	text-align: center;
	letter-spacing: 0.25px;
	box-shadow: 0px 0px 0px 1px #5190c5;
	background-color: white;
	border: 2px solid white; 
	margin: -2px;
}
.thumbsSpacer2 {
	width: 17px;
	/*background-color: lime;*/
	display: table-cell;
	margin: 0px;
	padding: 0px;
}
.thumbsText2 {
	padding-top: 10px;
	font-weight: 400;
}
.thumbsText2 a {
	font-weight: 300;
	text-decoration: none;
	color: #5190c5;
}
.thumbsText2 a:link {
	color: #5190c5;
}
.thumbsText2 a:visited {
	color: #5190c5;
}
.thumbsText2 a:hover {
	color: #dc1e34;
}
.thumbsText2 a:active {
	color: #dc1e34;
}


/*-------------------------------------------------- END OF STYLES FOR THUMBS --------------------------------------------------*/

/*-------------------------------------------------- START OF STYLES FOR TOOLTIPS --------------------------------------------------*/

a[data-tooltip]:link, a[data-tooltip]:visited { position: relative; text-decoration: none; }

a[data-tooltip]:after {
	content: attr(data-tooltip);
	position: absolute;
	color: #5190c5;
	top: -123px;
	left: 0px;
	background: #ffffff;
	padding: 2px 6px;
	-webkit-border-radius: 0px 0px 2px 0px;
	-moz-border-radius: 0px 0px 2px 0px;
	border-radius: 0px 0px 2px 0px;
	white-space: nowrap;
	visibility: hidden;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.25);
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 400;
}

a[data-tooltip]:hover:before, a[data-tooltip]:hover:after {
	visibility: visible;
	-webkit-transition: visibility 0s linear .0s;
	-moz-transition: visibility 0s linear .0s;
	-o-transition: visibility 0s linear .0s;
	transition: visibility 0s linear .0s;
}

/*-------------------------------------------------- END OF STYLES FOR TOOLTIPS --------------------------------------------------*/

/*-------------------------------------------------- START OF STYLES FOR SLIDESHOW --------------------------------------------------*/

.fadein { position:relative; width:480px; height:320px; margin-bottom: 25px; }
.fadein img { position:absolute; left:0; top:0; box-shadow: #000 0em 0em 0em; }

.fadeinMedium { position:relative; width:480px; height:480px; margin-bottom: 25px; }
.fadeinMedium img { position:absolute; left:0; top:0; box-shadow: #000 0em 0em 0em; }

.fadeinBig { position:relative; width:1024px; height:768px; margin-bottom: 25px; }
.fadeinBig img { position:absolute; left:0; top:0; box-shadow: #000 0em 0em 0em; }

#slideshow-container { height:768px; position:relative; margin-left: 50px; margin-right: 50px }
#slideshow-container img { position:absolute; left:0; top:0; width:100%; height:100% }
#slideshow      { position:absolute; left:0; top:0; width:100%; height:100%; list-style:none }
#slideshow img  { width:1024px; height:768px; background-repeat:none; background-position:top left; position:absolute; left:0; top:0 }
#slideshow      { position:absolute; left:0; top:0; width:100%; height:100%; }
#slideshow img  { width:1024px; height:768px; background-repeat:none; background-position:top left; position:absolute; left:0; top:0 } /* adjust this for your images */

/*-------------------------------------------------- END OF STYLES FOR SLIDESHOW --------------------------------------------------*/

/*-------------------------------------------------- START OF STYLES FOR 2DB --------------------------------------------------*/

#twodeebeeMain {
	width: 1024px;
	margin: 40px auto;
	background-image: url(dividerVertical2.png);
}
.twodeebeeLeft {
	float: left;
	width: 472px;
}
.twodeebeeRight {
	float: right;
	width: 472px;
}
.twodeebeeRight p { margin-top: 20px; margin-bottom: 20px;
	font-size: 0px;
}



.twodeebeeThumb {
/*	width: 180px;
	height: 154px;
	display: marker;
	margin: 0px;
	padding: 0px;
	font: 12px/22px 'Ubuntu', sans-serif; font-weight: 300;
	color: #808080;
	text-align: center;
	border: 1px solid #f7f7f7; 
	margin: -1px;
	/*text-transform: uppercase;*!/
	letter-spacing: 0.25px;*/
}
.twodeebeeThumb:hover {
    box-shadow: 0px 0px 0px 1px #5190c5;
	color: #5190c5;
	border: 2px solid white; 
	margin: -2px;
}
.twodeebeeThumbOn {
    box-shadow: 0px 0px 0px 1px #5190c5;
	color: #5190c5;
	border: 2px solid white; 
	margin: -2px;
}

/*-------------------------------------------------- END OF STYLES FOR 2DB --------------------------------------------------*/

/*-------------------------------------------------- START OF STYLES FOR PARAGRAPHS --------------------------------------------------*/

.projectHeader {
	font: 32px 'Ubuntu', sans-serif; font-weight: 300;
	color: #808080;
	float: left;
	margin-top: 40px;
	margin-bottom: 40px;
}

.clientHeader {
	font: 24px 'Ubuntu', sans-serif; font-weight: 300;
	color: #808080;
	float: right;
	text-align: right;
	margin-top: 48px;
	margin-bottom: 40px;
}

.wipProjectHeader {
	font: 32px 'Ubuntu', sans-serif; font-weight: 300;
	color: #808080;
	float: left;
	margin-top: 40px;
	margin-bottom: 20px;
}

.wipClientHeader {
	font: 24px 'Ubuntu', sans-serif; font-weight: 300;
	color: #808080;
	float: right;
	text-align: right;
	margin-top: 48px;
	margin-bottom: 20px;
}

.workInProgressHeader {
	font: 24px 'Ubuntu', sans-serif; font-weight: 300;
	color: #dc1e34;
	/*margin-top: -20px;*/
	padding-bottom: 20px;
	text-align: center;
	/*background-color: yellow;*/
}

.paragraphLeft {
	font: 14px/22px 'Ubuntu', sans-serif; font-weight: 300;
	letter-spacing: 0.25px;
	text-align: left;
	color: #808080;
	float: left;
	margin-top: 40px;
	margin-bottom: 30px;
	width:  472px;
}

.paragraphLeft p { margin-top: 0px; margin-bottom: 10px; }
.paragraphRight p { margin-top: 0px; margin-bottom: 10px; }
.paragraphWide p { margin-top: 0px; margin-bottom: 10px; }
.paragraphNarrow p { margin-top: 0px; margin-bottom: 10px; }
.smallPictureText p { margin-top: 0px; margin-bottom: 10px; }
/*.paragraphLeft img { margin-top: 0px; margin-bottom: 20px; }*/

.paragraphHeader { font: 24px/22px 'Ubuntu', sans-serif; font-weight: 300; padding-bottom: 5px; }
.paragraphHeader2 { font: 24px 'Ubuntu', sans-serif; font-weight: 300; padding-bottom: 10px; color: #808080; }

.paragraphLeft a { text-decoration: none; font-weight: 500; }
.paragraphLeft a:link { color: #5190c5; }
.paragraphLeft a:visited { color: #5190c5; }
.paragraphLeft a:hover { color: #dc1e34; }
.paragraphLeft a:active { color: #dc1e34; }

.paragraphRight a { text-decoration: none; font-weight: 500; }
.paragraphRight a:link { color: #5190c5; }
.paragraphRight a:visited { color: #5190c5; }
.paragraphRight a:hover { color: #dc1e34; }
.paragraphRight a:active { color: #dc1e34; }

.paragraphWide a { text-decoration: none; font-weight: 500; }
.paragraphWide a:link { color: #5190c5; }
.paragraphWide a:visited { color: #5190c5; }
.paragraphWide a:hover { color: #dc1e34; }
.paragraphWide a:active { color: #dc1e34; }

.paragraphNarrow a { text-decoration: none; font-weight: 500; }
.paragraphNarrow a:link { color: #5190c5; }
.paragraphNarrow a:visited { color: #5190c5; }
.paragraphNarrow a:hover { color: #dc1e34; }
.paragraphNarrow a:active { color: #dc1e34; }


.dividerHorizontal { width: 100%; background: url(dividerHorizontal.png) 0 20px repeat-x; height: 51px; }
.dividerHorizontalSmall { width: 100%; background: url(dividerHorizontal.png) 0 10px repeat-x; height: 31px; }
.spacer { width: 100%; height: 10px;  font: 1px; }
.spacerBig { width: 100%; height: 40px;  font: 1px; }
.spacerWhite { width: 100%; height: 60px;  font: 1px; background-color: white; }

/*-------------------------------------------------------------------------------------------------------*/

.paragraphRight {
	font: 14px/22px 'Ubuntu', sans-serif; font-weight: 300;
	letter-spacing: 0.25px;
	text-align: left;
	color: #808080;
	float: right;
	margin-top: 40px;
	margin-bottom: 30px;
	width:  472px;
}

.paragraphRight ul { padding:0px; margin: -10px 0px 10px; }
.paragraphRight li { list-style-type: circle; margin-left: 16px; }

.smallPictureText ul { padding:0px; margin: -10px 0px 10px; }
.smallPictureText li { list-style-type: circle; margin-left: 16px; }

.appStore { width:  100%; margin-bottom: 10px; }
.appStoreLeft { float: left; width:  80px; height: 66px; }
.appStoreRight { float: left; }
.appStore ul { padding:0px; margin: 0px; }
.appStore li { list-style-type: none; margin-left: 0px; }

.videoPreview { width:  472px; margin-bottom: 10px; height: 50px; background: url(video-icon.png) left top no-repeat; overflow: hidden; }
.videoPreview:hover { background-position: 0px -50px; }
.videoPreviewRight { float: right; width: 392px; font: 14px/22px 'Ubuntu', sans-serif; font-weight: 500; text-transform: uppercase; margin-top: 14px; }

.interactivePreview { width:  472px; margin-bottom: 10px; height: 50px; background: url(interactive-icon.png) left top no-repeat; overflow: hidden; }
.interactivePreview:hover { background-position: 0px -50px; }
.interactivePreviewRight { float: right; width: 392px; font: 14px/22px 'Ubuntu', sans-serif; font-weight: 500; text-transform: uppercase; margin-top: 14px; }

.paragraphWide {
	font: 14px/22px 'Ubuntu', sans-serif; font-weight: 300;
	letter-spacing: 0.25px;
	text-align: left;
	color: #808080;
	margin: 0 auto 40px;
	width:  942px;
	background-color: white;
	padding: 20px 40px;
	border-left: 1px solid #dedede;
	border-right: 1px solid #dedede;
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #dedede;
}

.paragraphNarrow {
	font: 14px/22px 'Ubuntu', sans-serif; font-weight: 300;
	letter-spacing: 0.25px;
	text-align: left;
	color: #808080;
	margin: 0 auto 40px;
	width:  280px;
	background-color: white;
	padding: 20px 20px;
	border-left: 1px solid #dedede;
	border-right: 1px solid #dedede;
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #dedede;
}

.smallPicture {
	float: left;
	margin: 0px;
}
.smallPictureText {
	font: 14px/22px 'Ubuntu', sans-serif; font-weight: 300;
	letter-spacing: 0.25px;
	text-align: left;
	color: #808080;
	float: right;
	margin: 0px;
	width:  582px;
}

.paragraphBold {
	font-weight: 400;
	color: #dc1e34;
}

.contactIcon {
	margin-right: 2px;
	position : relative;
	top: 2px;
}

.columnSplitterLeft {
	width: 236px;
	float: left;

}
.columnSplitterRight {
	width: 236px;
	float: right;

}
/*-------------------------------------------------- END OF STYLES FOR PARAGRAPHS --------------------------------------------------*/

.bekoText{
font: 14px/22px 'Ubuntu', sans-serif; font-weight: 300;
letter-spacing: 0.25px;
text-align: center;
color: #808080;
margin-top: 20px;
margin-bottom: 20px;
width:  1022px;
}





body {
	text-align: center;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	background: url(../backgrounds/1-beko-appliance-finder-1.png) 0px 0px / 100% 1101px no-repeat;
}