Guest User

Untitled

a guest
Nov 23rd, 2017
79
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.54 KB | None | 0 0
  1. /* FONTS */
  2.  
  3. @font-face {
  4. font-family: 'NewhouseDTCondCondensedRg';
  5. src: url('fonts/newhousedt-condensed-webfont.eot');
  6. src: url('fonts/newhousedt-condensed-webfont.eot?#iefix') format('embedded-opentype'),
  7. url('fonts/newhousedt-condensed-webfont.woff') format('woff'),
  8. url('fonts/newhousedt-condensed-webfont.ttf') format('truetype'),
  9. url('fonts/newhousedt-condensed-webfont.svg#NewhouseDTCondCondensedRg') format('svg');
  10. font-weight: normal;
  11. font-style: normal;
  12.  
  13. }
  14.  
  15. /* GLOBALS */
  16. * {
  17. font-family:Myriad Pro, Helvetica Neue, Helvetica, Verdana, Geneva, sans-serif;
  18. font-size:12px;
  19. padding:0;
  20. margin:0;
  21. border:0;
  22. }
  23.  
  24.  
  25. H1, H2, H3, H4 { font-family: NewhouseDTCondCondensedRg; text-transform:uppercase; }
  26. H1 { font-size: 18px; text-transform:none; background-image:url("/images/title-corner.png"); background-repeat:no-repeat; padding-left:16px; }
  27.  
  28. HTML { height:100%; }
  29. BODY { height:100%; background-color:#e2e0de; position:relative; }
  30.  
  31. A { color:white; line-height:12px; text-decoration:none; }
  32. A:visited { color:white; text-decoration:none; }
  33. A:hover { color:white; text-decoration:underline; }
  34. SPAN A, P A { color:#F74B00; }
  35. SPAN A:visited,P A:visited { color:#F74B00; }
  36. SPAN A:hover,P A:hover { color:#F74B00; }
  37.  
  38. .clearfloat { clear:both; margin:0px; padding:0px; line-height:0px; }
  39. .chamber-border { border:1px solid white; padding: 0; }
  40.  
  41. .logo { padding:11px; position:absolute; z-index:10; }
  42.  
  43. .still { width: 100%; margin: 0 auto; width:1280px; height:720px; }
  44.  
  45. .backgroundImage { position:absolute; width:1280px; height:720px; }
  46.  
  47. /* Background images */
  48. .content { width: 1280px; height: 720px; position:absolute; z-index:6; padding:0; }
  49. .content .overlay { position:absolute; }
  50. .content-label { z-index:100; position:absolute; }
  51. .content-label .content { width: auto; height: auto; }
  52. .content-label A { color:black; font-family: NewhouseDTCondCondensedRg; text-transform:uppercase; font-size:18px; }
  53. .content-label A:hover { text-decoration:none; }
  54.  
  55. /* Image Map */
  56. .imageMap { width: 1280px; height: 720px; position:absolute; z-index:8; padding:0; }
  57. .imageMap IMG { width: 1280px; height: 720px; }
  58.  
  59. /* Background overlay labels */
  60. .left-aligned-label { height:48px; }
  61. .left-aligned-label .left { background: url(/images/label-left-arrow.png) no-repeat; width:29px; height:48px; float:left; }
  62. .left-aligned-label .middle { background: url(/images/label-middle.png) repeat-x; padding-left:10px; padding-right:20px; height:48px; float:left; padding-top:16px; padding-left:16px; }
  63. .left-aligned-label .right { background: url(/images/label-right-end.png) no-repeat; width:7px; height:48px; float:left; }
  64.  
  65. .right-aligned-label { height:48px; font-family: NewhouseDTCondCondensedRg; }
  66. .right-aligned-label .left { background: url(/images/label-left-end.png) no-repeat; width:7px; height:48px; float:left; }
  67. .right-aligned-label .middle{ background: url(/images/label-middle.png) repeat-x; padding-left:20px; padding-right:10px; height:48px; float:left; padding-top:16px; padding-left:16px; }
  68. .right-aligned-label .right { background: url(/images/label-right-arrow.png) no-repeat; width:29px; height:48px; float:left; }
  69.  
  70. .bottom-aligned-home-label { background: url(/images/home-unit-one-background.png) no-repeat; width:287px; height:267px; float:left; margin-top:-80px; }
  71. .bottom-aligned-home-label H2 { color:black; font-size:18px; }
  72. .bottom-aligned-home-label .content { margin-top:14px; margin-left:14px; float:none; }
  73. .bottom-aligned-home-label .content .item { float:none; width:240px; height:50px; margin-top:8px; }
  74. .bottom-aligned-home-label .content .item IMG { border:1px solid white; float:left; margin-right:10px;}
  75. .bottom-aligned-home-label .content .item A { color:white; float:left;}
  76. .bottom-aligned-home-label .content .item .title{ color:black; float:none; width: 240px; height:30px; }
  77. .bottom-aligned-home-label .button { float:right; }
  78. .bottom-aligned-home-label .button .left { background: url(/images/other/button-orange-left.png) no-repeat; float:left; width:2px; height:16px; margin: 0px;}
  79. .bottom-aligned-home-label .button .middle { background: url(/images/other/button-orange-middle.png) repeat-x; float:left; width:auto; height:16px; margin: 0px; padding-left:4px; padding-right:4px; color:white;}
  80. .bottom-aligned-home-label .button .right { background: url(/images/other/button-orange-right.png) no-repeat; float:left; width:2px; height:16px; margin: 0px;}
  81.  
  82. .left-aligned-medewerker-label { background: url(/images/left-aligned-medewerker-label.png) no-repeat; width:190px; height:212px; float:left; margin-top:-80px; }
  83. .left-aligned-medewerker-label .content { margin-top:14px; margin-left:38px; float:none; overflow:hidden; }
  84. .left-aligned-medewerker-label .content IMG { border:1px solid white; float:none; width:135px; height:135px; }
  85. .left-aligned-medewerker-label .content .name { font-size:14px; color:black; width:100%; padding-top:8px; float:left;}
  86. .left-aligned-medewerker-label .content .title { font-size:9px; color:black; width:100%; padding-top:3px; float:left; }
  87.  
  88. /* Units */
  89. .unit { width:728px; height:377px; top:171px; left:276px; position:absolute; color:black; }
  90. .unit .left { background: url(/images/unit-left.png) no-repeat; float:left; width:11px; height:inherit; }
  91. .unit .middle { background: url(/images/unit-middle.png) repeat-x; float:left; width:714px; height:inherit; }
  92. .unit .right { background: url(/images/unit-right.png) no-repeat; float:left; width:3px; height:inherit; }
  93. .unit .middle .half { float:left; margin:10px; width:330px;}
  94. .unit .middle .full { float:left; margin:10px; width:660px;}
  95. .unit .middle .close { background: url(/images/other/closebutton.png); width:16px; height:16px; position:absolute; right:4px; top:4px; }
  96. .unit .middle IMG { border:1px solid white; }
  97. .unit .middle .textarea { width:340px; height:310px; overflow-y:scroll; overflow-x:hidden; margin-top:33px; }
  98.  
  99. .unit .middle .textareaFull { width:640px; height:310px; overflow-y:hidden; overflow-x:hidden; margin-top:33px; }
  100. .unit .paging { height: 11px; margin-top:16px; }
  101. .unit .paging A { color:black; margin-left:10px; margin-right:10px; }
  102. .unit .paging .back { float:left; width:50%; }
  103. .unit .paging .next { float:right; width:50%; text-align:right; }
  104. .unit .paging .icon { height: 11px; width:8px; }
  105. .unit .paging .back .icon { float:left; background: url(/images/other/button-back-active.png) no-repeat; }
  106. .unit .paging .next .icon { float:right; background: url(/images/other/button-next-active.png) no-repeat; }
  107.  
  108. .unit .related { width:100%; margin-top:14px; }
  109. .unit .related .button .right { background: url(/images/other/button-orange-right-bubble.png) no-repeat; float:left; width:33px; height:16px; }
  110. .unit .button { height:16px; float:left; margin-right:6px; }
  111. .unit .button .left { background: url(/images/other/button-orange-left.png) no-repeat; float:left; width:2px; height:16px; }
  112. .unit .button .middle { background: url(/images/other/button-orange-middle.png) repeat-x; float:left; width:auto; height:16px; padding-left:10px; padding-right:10px;}
  113. .unit .button .right { background: url(/images/other/button-orange-right.png) no-repeat; float:left; width:2px; height:16px; }
  114. .unit .button .middle A { width: 5px; color:white; }
  115. .unit .button .middle A:visited { color:white; }
  116.  
  117. .textarea A { color:#F74B00; }
  118. .textarea P { margin-bottom: 12px; }
  119.  
  120. /* Button Popovers */
  121. .button-popover { background: url(/images/button-popover-background.png) no-repeat; width:245px; height:234px; position:absolute; overflow:hidden; }
  122. .button-popover .blog-item,
  123. .button-popover .item { border-bottom:1px solid #d2d2d2; width:220px; padding-bottom:8px; color:black; margin:14px; }
  124. .button-popover .blog-item A,
  125. .button-popover .item A { color:#F74B00; }
  126. .button-popover .blog-item:nth-child(n+5) ,
  127. .button-popover .item:nth-child(n+5) { display:none; }
  128.  
  129. .button-popover .project-item { border-bottom:1px solid #d2d2d2; width:220px; padding-bottom:14px; margin:14px; color:black; }
  130. .button-popover .project-item A { color:#F74B00; }
  131. .button-popover .project:nth-child(n+5) { display:none; }
  132.  
  133. .button-popover .person-item { border-bottom:1px solid #d2d2d2; width:220px; padding-bottom:8px; margin:8px; color:black; }
  134. .button-popover .person-item A { color:#F74B00; }
  135. .button-popover .person-item:nth-child(n+5) { display:none; }
  136.  
  137. /* Share Popover */
  138. .share-popover { background: url(/images/share-unit-background.png) no-repeat; width:287px; height:267px; position:absolute; right:327px; bottom:24px; display:none }
  139. .share-popover H4 { font-size:16px; margin:16px; }
  140. .share-popover .container { margin:16px; }
  141. .share-popover .item { width:90px; height:28px; padding-left:35px; padding-top:8px; float:left; }
  142. .share-popover .facebook { background:url(/images/social-facebook-button.png) no-repeat; }
  143. .share-popover .twitter { background:url(/images/social-twitter-button.png) no-repeat; }
  144. .share-popover .linkedin { background:url(/images/social-linkedin-button.png) no-repeat; }
  145. .share-popover A { color:black; }
  146.  
  147. .small-unit-with-left-arrow { width:406px; height:353px; top:160px; left:110px; position:absolute; color:black; }
  148. .small-unit-with-left-arrow .left { background: url(/images/unit-left-arrow.png) no-repeat; float:left; width:41px; height:inherit; }
  149. .small-unit-with-left-arrow .middle { background: url(/images/unit-middle-small.png) repeat-x; float:left; width:363px; height:inherit; }
  150. .small-unit-with-left-arrow .right { background: url(/images/unit-right-small.png) no-repeat; float:left; width:2px; height:inherit; }
  151. .small-unit-with-left-arrow .middle .close { background: url(/images/other/closebutton.png); width:16px; height:16px; position:absolute; right:4px; top:4px; }
  152.  
  153. .small-unit-with-right-arrow { width:406px; height:353px; top:12px; left:110px; position:absolute; color:black; }
  154. .small-unit-with-right-arrow .left { background: url(/images/unit-left-small.png) no-repeat; float:left; width:2px; height:inherit; }
  155. .small-unit-with-right-arrow .middle { background: url(/images/unit-middle-small.png) repeat-x; float:left; width:363px; height:inherit; }
  156. .small-unit-with-right-arrow .right { background: url(/images/unit-right-arrow.png) no-repeat; float:left; width:41px; height:inherit; }
  157. .small-unit-with-right-arrow .middle .close { background: url(/images/other/closebutton.png); width:16px; height:16px; position:absolute; right:45px; top:4px; }
  158.  
  159. /* Page specific unit styles */
  160. .notfound { height: 150px; margin-top: 150px; }
  161.  
  162. .project-unit .middle .textarea { height: 278px; }
  163.  
  164. .medewerker-unit .social { height:105px; padding-top:16px;}
  165. .medewerker-unit .social .facebook-button { background:url(/images/facebook-button.png); width:23px; height:23px; border:1px solid black; }
  166. .medewerker-unit .lefthalf { float:left; margin:10px; width:200px; }
  167. .medewerker-unit .righthalf { float:right; margin:10px; }
  168. .medewerker-unit .middle .textarea { width:444px; height: 278px; }
  169.  
  170. .socialmedia-unit .news .large { margin-top:16px; height:170px; }
  171. .socialmedia-unit .news .small { margin-top:16px;}
  172. .socialmedia-unit .news H2 { font-weight:bold; color:#F74B00; }
  173. .socialmedia-unit .news .date {}
  174. .socialmedia-unit .news A { color:#F74B00; }
  175.  
  176. .socialmedia-unit .tweets-background { background:url(/images/other/socialmedia-twitter-background.png) no-repeat; width:364px; height:323px; margin-left:-10px; }
  177. .socialmedia-unit .tweets { padding:25px 0 0 25px; }
  178. .socialmedia-unit .tweet { width:310px; height:60px; }
  179. .socialmedia-unit .tweet SPAN { color:black; }
  180. .socialmedia-unit .tweet { color:#999999; }
  181. .socialmedia-unit .tweet B { color:#F74B00; }
  182. .socialmedia-unit .tweet .username { color:#F74B00; }
  183. .socialmedia-unit .tweet .web { color:#F74B00; }
  184.  
  185. .contact-unit .contact-left { width:50%; float:left; font-weight:bold; }
  186. .contact-unit .contact-right { width:50%; float:left; }
  187. .contact-unit .contact-right-noleft { margin-left:50%; width:50%; float:right;}
  188. .contact-unit .contact-block { width:100%; margin-top:16px; }
  189. .contact-unit .contact-block DIV { height: 32px; }
  190. .contact-unit .newsletter-field { background-color:white; border:1px solid #ff8400; padding:4px; width:190px; margin-bottom:10px; }
  191. .contact-unit H2 { margin-top:20px; }
  192. .contact-unit P { margin-top:20px; margin-bottom:10px; }
  193. .contact-unit #email
  194. {
  195. border:1px solid #F74B00;
  196. height:18px;
  197. width:175px;
  198. -webkit-box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.3);
  199. -moz-box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.3);
  200. box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.3);
  201. margin: 0 0 4px 0;
  202. }
  203. .contact-unit #aanmeldButton,
  204. .contact-unit #afmeldButton
  205. {
  206. -webkit-border-radius: 5px;
  207. -moz-border-radius: 5px;
  208. border-radius: 5px;
  209. background-color:#F74B00;
  210. height:18px;
  211. width:100px;
  212. color:White;
  213. cursor:pointer;
  214. margin: 0 4px 8px 0;
  215. }
  216.  
  217.  
  218. .whitepapers-unit .scrollarea { margin-top:16px; width:335px; height:290px; overflow-y:scroll; overflow-x:hidden; padding:8px; }
  219. .whitepapers-unit .item { margin-bottom:12px; }
  220. .whitepapers-unit .item .line { margin-top:12px; border-bottom:1px solid #f95e00; }
  221. .whitepapers-unit .item IMG { width:51px; height:51px; float:left; margin-right:16px; border:0px; }
  222. .whitepapers-unit .item H2 { height:17px; }
  223. .whitepapers-unit .item .button { margin-top:6px; }
  224. .whitepapers-unit .middle .right { visibility:hidden; display:none; }
  225.  
  226. .calendar-unit .scrollarea { margin-top:16px; width:335px; height:290px; overflow-y:scroll; overflow-x:hidden; padding:8px;}
  227. .calendar-unit .item { margin-bottom:12px; }
  228. .calendar-unit .item .line { margin-top:12px; border-bottom:1px solid #f95e00; }
  229. .calendar-unit .item .icon { width:66px; height:66px; float:left; margin-right:16px; border:0px; background:url(/images/icon-background.jpg) repeat-x; }
  230. .calendar-unit .item .icon .day { color:white; font-weight:bold; font-size:40px; text-align:center; }
  231. .calendar-unit .item .icon .month { color:white; text-align:center; }
  232. .calendar-unit .item H2 { height:17px; }
  233. .calendar-unit .item .button { margin-top:6px; }
  234. .calendar-unit .middle .right { visibility:hidden; display:none; }
  235.  
  236. .search-unit .scrollarea { margin-top:16px; width:335px; height:290px; overflow-y:scroll; overflow-x:hidden; padding:8px; }
  237. .search-unit .item { margin-bottom:12px; }
  238. .search-unit .item .line { margin-top:12px; border-bottom:1px solid #f95e00; }
  239. .search-unit .item IMG { width:51px; height:51px; float:left; margin-right:16px; border:0px; }
  240. .search-unit .item H2 { height:17px; }
  241. .search-unit .item .button { margin-top:6px; }
  242. .search-unit .middle .right { visibility:hidden; display:none; }
  243. .search-unit { float:left; }
  244. .search-unit .input
  245. {
  246. border:1px solid #F74B00;
  247. height:18px;
  248. width:175px;
  249. -webkit-box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.3);
  250. -moz-box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.3);
  251. box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.3);
  252. }
  253. .search-unit .button
  254. {
  255. -webkit-border-radius: 5px;
  256. -moz-border-radius: 5px;
  257. border-radius: 5px;
  258. background-color:#F74B00;
  259. height:18px;
  260. width:100px;
  261. color:White;
  262. cursor:pointer;
  263. }
  264. /* Sitemap */
  265. .sitemap { }
  266. .sitemap-button { background:url(/images/button-background.png); width:191px; height:45px; margin:0 auto; }
  267. .sitemap-button .label { width:191px; padding-top:28px; text-align:center; }
  268. .sitemap-button .label a { text-decoration:none; font-weight: bold; }
  269. .sitemap-background { background:url(/images/menu-background.png) repeat-x; height: 188px; }
  270. .sitemap-content { margin:0 auto; padding-top: 18px; color:white; width:938px; text-align:left; }
  271. .sitemap-content .left { float:left; width:13px; height:8px; background:url(/images/menu-orange-corner.png) no-repeat; }
  272. .sitemap-content UL { float:left; padding:0px; margin:0px; line-height:0px; width:91px; height:166px; }
  273. .sitemap-content H3 { line-height:0px; margin:0px; font-weight:bold; font-size:14px; }
  274. .sitemap-content LI { margin:0px; padding:0px; height:24px; list-style:none; }
  275. .sitemap-content .map { margin-left:35px; float:left; background:url(/images/sitemap/background.png) no-repeat; width:155px; height:165px; }
  276.  
  277. /* Footer */
  278. .footer { position:absolute; bottom:0; z-index:10; width:100%; }
  279. .footer .fixed { background: #2e0a09 url(/images/footer-background.jpg) no-repeat center; height:33px; padding: 0 11px 0 11px; }
  280. .footer .breadcrumb { color:white; float:left; margin-top:10px;}
  281. .footer .contact { color:white; float:right; margin-top:10px; }
  282. .footer .contact DIV{ float:left; margin-left:11px; }
  283.  
  284. .footer .button { height:16px; float:left; padding:0px; margin:0px; margin-right:6px; }
  285. .footer .button .left { background: url(/images/other/button-orange-left.png) no-repeat; float:left; width:2px; height:16px; margin: 0px;}
  286. .footer .button .middle { background: url(/images/other/button-orange-middle.png) repeat-x; float:left; width:auto; height:16px; margin: 0px; padding-left:4px; padding-right:4px;}
  287. .footer .button .right { background: url(/images/other/button-orange-right.png) no-repeat; float:left; width:2px; height:16px; margin: 0px;}
  288.  
  289. /* Effects */
  290. .shadow { -webkit-box-shadow: 0 0 6px #aaa; }
  291.  
  292. @media all and (max-device-width: 1024px) {
  293. BODY { margin:0; padding:0; }
  294. .still {
  295. margin:0;
  296. position:absolute;
  297. left:-150px;
  298. top:0;
  299. width:1280px;
  300. height:640px;
  301. overflow:hidden;
  302. }
  303. .logo {
  304. left: 150px;
  305. }
  306. }
Add Comment
Please, Sign In to add comment