/*
Template Name: Energetic
Template URI: http://themeforest.net/item/energetic-responsive-html5-template/2246961
Description: Designed by AivahThemes.
Version: 1.2
Author: <a href="http://themeforest.net/user/AivahThemes">AivahThemes</a>
Author URI: http://themeforest.net/user/AivahThemes
License URI: license.txt
Tags: black, white, two-columns, liquid-width, custom-pricing table
Coolblue kleur #0090e3
*/
/**
* CSS RESET WITH CLEARFIX
* http://meyerweb.com/eric/tools/css/reset/
* v2.0 | 20110126
* License: none (public domain)
* -----------------------------------------------
*/
/* @import url('https://fonts.googleapis.com/css?family=Roboto:300italic,300,500,700,400');*/
@import url('http://fonts.googleapis.com/css?family=Raleway:400,700"');
/* @import url('https://fonts.googleapis.com/css?family=Ubuntu');*/
/*nav,i,menu, strong,*/
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, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var, b, u, center, dl, dt, dd, ol, ul, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, hgroup, output, ruby, section, summary, time, mark, audio, video {
outline: none;
padding: 0;
border: 0;
border-style: solid;
font-size: 14px;
vertical-align: baseline;
padding-right: 0px;
padding-left: 0px;
color: #000000;
}
.header-logo.mb-80 .one_half.last .texthome_sleft {
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
padding-left: 0px;
}
figure #logoklant
{
padding-left: 50px;
width: 200px;
min-height: 200px;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
.clear {
clear: both;
display: block;
width: 0;
height: 0;
visibility: hidden;
}
/*clearfix*/
.clearfix:after {
content: ".";
display:block;
clear:both;
visibility:hidden;
line-height:0;
height:0;
}
.clearfix { display:inline-block;}
html[xmlns] .clearfix { display:block; }
* html .clearfix { height:1%; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
GENERAL
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
body {
font: normal 14px/2.0 Raleway,Arial,Helvetica,sans-serif;
color: #666;
background-color: #FFFFFF;
margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: 0px;
width: 100%;
}
strong {
font-weight: bold;
color: rgba(176,34,36,1);
}
mark {
position:relative;
font-size:10px;
padding:1px 3px;
border:rgba(0, 0, 0, .1) 1px solid;/* Safari 4+, Chrome, FF3.5+ */
background-color:#fff305;
}
mark.info {
position:absolute;
top:-10px;
padding:2px 6px;
background:#666;
color:#fff;
letter-spacing:0;
-webkit-border-radius: 40px;
-moz-border-radius: 40px;
border-radius: 40px;
-webkit-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.1);
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Link Colors
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
mark.orange { background-color: #ff5c00; }
mark.red { background-color: #861D23; }
mark.yellow { background-color: #ffb515; }
mark.green { background-color: #91bd09; }
a {
color:#146008;
text-decoration:none;
-webkit-transition:color 200ms ease-in;
-moz-transition:color 200ms ease-in;
-o-transition:color 200ms ease-in;
transition:color 200ms ease-in;
}
a:hover {
color: #2651AA;
}
ul.tabs li.current:after {
border-color:#11beff;
}
ul.tabs li.current {
background-color:#11beff;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Grouping end
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
ul, ol {
list-style-position:outside;
margin-left:20px;
}
ul ul, ol ol {
margin-left:0 !important;
}
ol ol,
ul ul { margin-bottom:0; }
p, hr, ul, ol {
margin-bottom: 20px;
width: 100%;
color: #6C6464;
font: normal 18px/2.0 Raleway,Arial,Helvetica,sans-serif;
}
.post-entry ul ul,
.syswidget ul ul { margin-bottom:0; }
.post-entry ol {
list-style:decimal ;
}
hr {
border:0;
height:1px;
background:rgba(0,0,0,0.1);
clear: both;
}
span em {
font-style:italic;
font-family:'Roboto', Georgia, Serif;
font-size:100%;
}
.preloader {
display:block;
background:url(../ajax-loader.png) center center no-repeat transparent;
}
.ribbon {
position:absolute;
top:0;
right:0;
z-index:2;
}
abbr { border-bottom:1px dotted black;}
acronym { border-bottom:1px dotted #444444;/* IE 7 Hack*/ border-bottom:1px dotted rgba(0,0,0,0.9); }
b { font-weight:bold; }
cite { font-style:italic;}
dfn { font-style:italic;}
dfn { text-decoration: line-through;}
em { font-style:italic;}
i { font-style:italic;}
/* Unicode escapes:*/
q {quotes: '\201C' '\201D' '\2018' '\2019';}
q:before {content: open-quote;}
q:after {content: close-quote;}
small { font-size:11px;}
/*strong {
font-weight: bold;
color: darkgoldenrod;
text-align: left;
}*/
sub { position:relative; font-size:11px; bottom:-2px;}
sup { position:relative; font-size:11px; top:-2px;}
dl { margin: 3em 0; border-color:rgba(0,0,0,0.1); border-width:0 0 1px 0;}
dt { float: left; clear: left; width: 30%; font-weight: bold;}
dd { margin: 0 0 0 30%; padding: 5px 0;}
dd, dt { border-color:rgba(0,0,0,0.1); border-width:1px 0 0 0;}
figure img {
width: 90%;
max-width: 90%;
height: 90%;
margin-right: 10px;
float: left;
position: relative;
clear: left;
margin-bottom: 25px;
} /* Fixes for the Responsive Layout */
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Headings
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
h1, h2, h3, h4, h5, h6 {
font: Raleway,Arial,Helvetica,sans-serif;
font-weight: normal;
line-height: normal;
color:#6C6464;
}
h1 { font-size: 34px; margin: 0 0 20px 0; color:#6C6464;}
h2 { font-size: 30px; margin: 0 0 20px 0; color:#6C6464;}
h3 {
font-size: 26px;
margin: 0 0 20px 0;
color: #6C6464;
}
h4 { font: normal 18px/2.0 Raleway, Helvetica, sans-serif;}
h5 { font-size: 16px; margin: 0 0 15px 0; }
h6 {
font-size: 13px;
margin: 0 0 15px 0;
text-align: left;
}
h7 {
font-size: 18px;
margin: 0 0 15px 0;
text-align: left;
color:#6C6464;
}
h10 { font-size: 26px; margin: 0 0 20px 0; color:#6C6464}
h11 { font-size: 18px; margin: 0 0 20px 0; color:#6C6464}
h12 { font-size: 12px; margin: 0 0 15px 0; }
h13 { font-size: 10px; margin: 0 0 15px 0; color:#F70303}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Layout
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#stretched #wrapper {
position:relative;
width: 100%;
margin:0;
}
#boxed #wrapper {
position: absolute;
width: 100%;
margin: 0;
background-color: #fff;/* IE Hack*/
border-left: 1px solid #666666;
border-right: 1px solid #666666;
border-top: 0px solid rgba(0, 0, 0, .2);
border-bottom-width: 0;
-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.2);
-moz-box-shadow: 1px 1px 1px rgba(0,0,0,.2);
box-shadow: 1px 1px 1px rgba(0,0,0,.2);
}
.inner {
position:relative;
width:100%;
margin:auto;
}
.one_full { width:95%; }
.one_half {
width: 47.5%;
}
.one_half_hp {
width: 45.5%;
}
.one_half_pws { width:47.5%;
margin-bottom: 10px; }
.one_half_pws_mob { width:95%;}
.one_third { width:31%;
margin-bottom: 5px;}
.one_third_hp { width:31%; }
.one_third_p { width:22%; }
.two_third { width:65%; }
.one_fourth {
width: 21.2%;}
.een_kwart {
width: 20%;
}
.one_fifth { width:19%;
}
.three_fourth { width:73.8%; }
.four_fifth { width:79%; }
.two_fifth { width:37%; }
.three_fifth { width:58%; }
.one_sixth {
width:12.5%;
margin-right: 10px;}
.one_seventh { width:10.0%; }
.one_eighth { width:8.0%; }
.one_sixth_payment {width:12.0%; }
.one_half, .half_width, .one_half_pws,
.one_third, .two_third,
.one_fifth,
.four_fifth, .one_sixth, .one_sixth_payment ,
.two_fifth, .three_fifth,
.three_fourth, .een_kwart,.one_seventh, .one_eighth {
position: relative;
display: inline;
float: left;
margin-right: 1%;
alignment-adjust: middle;
margin-left: 0%;
color: #006;
font-size: 14px;
}
.one_fourth {
position: relative;
display: flex;
float: left;
margin-right: 1%;
/*alignment-adjust: middle;*/
margin-left: 0%;
color: #006;
font-size: 14px;
}
.one_third_p {
position: relative;
display: inline;
float: left;
margin-right: 2%;
alignment-adjust: middle;
margin-left: 0%;
color: #006;
font-size: 14px;
border: thin solid #6C6464;
}
.one_third_hp {
position: relative;
display: inline;
float: left;
margin-right: 1%;
alignment-adjust: middle;
margin-left: 0%;
color: #006;
font-size: 14px;
margin-bottom: 25px;
}
.one_half_hp {
margin-bottom: 75px;
}
.last {
margin-right: 0 !important;
margin-left: 2%;
}
.one_half_pws_mob {
display: none;
}
.one_fifth a {
color: brown;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Header, Logo
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#header {
position:relative;
margin:0 auto;
background-color:#ffffff;
z-index:5;
}
#header .inner {
width:100%;
}
/* TOPBAR */
#subheader .inner:after,
.topbar:after { clear:both; content:""; display:block; height:0; visibility:hidden; }
.topbar {
line-height:36px;
position:relative;
background-color:#000000;
}
/* Nav
.nav {
float:left;
list-style:none;
margin:0;
padding:0;
}
.nav li{
display:inline;
font-size:12px;
padding:0px 0px;
line-height:36px;
background:url(../images/opacs/dark5.png) top right repeat-y;
}
.nav li:last-child { background:none;}
.nav li:first-child { padding-left:0;}
.nav li a { color:#999}
.nav li a:hover { color:#ff8800; }
/* Sociables */
.atpsocials {
float:right;
list-style:none;
margin:0;
padding:0;
background:url(../images/opacs/white20.png) top right repeat-y;
}
.atpsocials li{
display:inline;
float:left;
margin:0;
font-size:11px;
line-height:36px;
background:url(../images/opacs/white20.png) top left repeat,url(../images/opacs/white20.png) top left repeat-y;
}
.atpsocials li img{
position:relative;
left:0;
vertical-align:middle;
}
.atpsocials li a{
padding:12px;
-webkit-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
-o-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
transition: all 200ms ease-in;
}
.atpsocials li a:hover{ color:#ff8800; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Logo & Primary Menu
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#head:after { clear:both; content:""; display:block; height:0; visibility:hidden;}
#head {
position: fixed;
padding-right: 0;
padding-left: 0;
padding-bottom: 00px;
width: 100%;
margin: 0 auto;
max-width: 100%;
background-color: #FFFFFF;
top: 0px;
border-bottom: 1px solid #D0CECE;
}
/* LOGO */
.logo {
position: relative;
display: inline;
float: left;
clear: both;
content: "";
display: block;
height: auto;
margin-left: 20px;
padding-top: 0px;
padding-right: 20px;
}
.logo h1 {
font-size:28px;
line-height:28px;
margin-bottom:0;
letter-spacing:-1px;
font-weight:bold;
}
.logo a { color:#666666; display:block; }
.logo a img {
margin-top: 0;
padding-top: 15px;
padding-left: 5px;
}
.logo a:hover { text-decoration:none; }
.logo span { font-size:11px; }
/*** Primary Menu ***/
.sf-menu, .sf-menu * {
margin: 0;
padding: 0;
list-style: none;
}
.sf-menu {
padding-left: 20px;
float: right;
margin: 0 auto;
line-height: 1.0;
position: relative;
z-index: 99;
width: 75%;
padding-top: 15px;
}
.sf-menu ul { position: absolute; top: -999em; width: 14em; /* left offset of submenus need to match (see below) */}
.sf-menu ul li { width:100%; position: relative;z-index:101;}
/* zelf knutsel */
.sf-menu ul li ul li { width:100%; position: relative;z-index:101;}/* zelf knutsel */
/* zelf knutsel */
.sf-menu li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */}
.sf-menu li {
float: left;
background: none;
list-style-position: inside;
position: relative;
vertical-align: middle;
align-items: center;
}
.sf-menu a { display: block; position: relative; text-transform: capitalize; }
.sf-menu li:hover ul,
.sf-menu li.sfHover ul { left: 0.77em; top:5em; /* match top ul list item height */ }
.sf-menu li:hover li ul,
.sf-menu li.sfHover li ul { top:-999em; }
.sf-menu li li:hover ul,
.sf-menu li li.sfHover ul { left: 14em; top:0; /* match ul width */ }
.sf-menu li li:hover li ul,
.sf-menu li li.sfHover li ul { top:-999em; }
.sf-menu li li li:hover ul,
.sf-menu li li li.sfHover ul { left: 14em; bottom: 10em; top: 0;/* match ul width */ }
/* Menu Settings */
.sf-menu a { padding:1em 1.4em; text-decoration:none; }
.sf-menu a,
.sf-menu a:visited { text-decoration:none; color:#999; /* visited pseudo selector so IE6 applies text colour*/ }
.sf-menu li a {
font-size: 14px;
font-weight: normal;
}
.sf-menu li li a { font-weight:normal; font-size:12px; }
.sf-menu li ul {
padding:1px;
background-image: url(../images/opacs/dark10.png), url(../images/opacs/dark10.png), url(../images/opacs/dark10.png);
background-position: top left, top right, top left;
background-repeat: repeat-y, repeat-y, repeat-x;
-webkit-box-shadow:0 2px 10px rgba(0,0,0,.2);
-moz-box-shadow:0 2px 10px rgba(0,0,0,.2);
box-shadow:0 2px 10px rgba(0,0,0,.2);
}
.sf-menu li li {
background-color:#f8f8f8;
background-image: url(../images/opacs/white90.png), url(../images/opacs/dark10.png);
background-position: top left, bottom left;
background-repeat: repeat-x;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover,
.sf-menu a:active {
color:#fff;
outline:0;
text-decoration:none;
}
.sf-menu li li:hover, .sf-menu li li.sfHover,
.sf-menu li li a:focus, .sf-menu li li a:hover,
.sf-menu li li a:active {
text-decoration:none;
outline:0;
background-color:#f1f2f3;
color:#fff;
background-image: url(../images/opacs/white90.png), url(../images/opacs/dark10.png);
background-position: top left, bottom left;
background-repeat: repeat-x;
}
/* Active Page Status CSS for all the browsers*/
.sf-menu li.current-cat a,
.sf-menu li.current_page_item a { margin:0; }
.sf-menu li.current-cat a:visited,
.sf-menu li.current_page_item a:visited { color:#ff8800; }
.sf-menu li a span {
display:block;
font:italic normal 11px/20px Georgia, Arial, Helvetica, sans-serif;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Frontpage Slider
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#featured_slider {
position: relative;
margin-top: 25px;
margin-right: auto;
margin-left: auto;
margin-bottom: 0px;
padding: 0px 0;
z-index: 2;
width: 100%;
max-width: 100%;
}
.slider_wrapper {
position: relative;
margin: 0px auto;
background: url(../images/opacs/dark60.png);
}
/* Static Slider */
.staticslider { position:relative;}
.staticslider img { display:block;}
/* Video Slider */
.videoslider {
position:relative;
display:block;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Toggle Slider
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.toggle_slider { position:relative; padding:5%; }
.toggle_slider:after {
content: ".";
display:block;
clear:both;
visibility:hidden;
line-height:0;
height:0;
}
.planbox { position:relative; float:left; width:30.4%; margin:0 1.5% 0 1.4%; }
.plan_box {
position: relative;
width: auto;
height: 350px;
overflow: hidden;
padding:0px;
background:#ffffff;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
.plan_box .plan_info {
position:absolute;
top:0;
left:0;
width:100%;
height:350px;
background:#f1f2f3;
text-align:center;
cursor:pointer;
z-index:1;
color :#fff;
background-color:#222;
background-image:url(../images/opacs/dark10.png);
background-position:top left;
background-repeat:repeat;
background-attachment:scroll;
/* Safari 4+, Chrome & Mozilla 3.6+ */
background-image: -webkit-gradient(linear,center bottom,center top, from(rgba(0, 0, 0, .1)),to(rgba(255, 255, 255, .1)));
background-image: -moz-linear-gradient(center top,rgba(255, 255, 255, .1) 0%,rgba(0, 0, 0, .1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000')"; /* IE8 */
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px; }
.plan_box .plan_details {
width:100%;
margin:0 auto;
height:350px;
text-align:center;
z-index:0;
}
.plan_box .plan_details .content { padding:20px; }
.plan_box .content { margin:0 10px; }
.plan_box ul { margin:15px 0 15px 0; }
.plan_box ul li { text-align:left; padding: 2% 0; margin:0 10px; line-height:inherit; border-bottom:1px solid #ddd; }
.plan_box h2 { font-weight:bold; background:none; border:none; margin:20px 0 0 0 ; padding:0; }
.plan_box h3.price {
margin:10px 0;
padding:0;
font-weight:bold;
color:#FFC000;
line-height:inherit;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Subheader
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#subheader {
position: relative;
overflow: hidden;
width: 100%;
z-index: 3;
background-color: #0066FF;
background-image: url(../images/opacs/dark10.png);
background-position: left top;
background-repeat: repeat-x;
background-attachment: scroll;
/* Safari 4+, Chrome & Mozilla 3.6+ */
background-image: -webkit-gradient(linear,center bottom,center top, from(rgba(0, 0, 0, .1)),to(rgba(255, 255, 255, .1)));
background-image: url(../images/demo/slide3m_oud.png);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000')"; /* IE8 */
margin-top: 50px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#subheader .inner {
padding: 30px 0;
width: 100%;
}
#subheader h1 {
float:left;
width:50%;
margin-bottom:0;
padding-left:10%;
font-size: 48px;
line-height: normal;
font-weight:bold;
letter-spacing:-1px;
color:#fff;
}
#subheader .rightaside {
float: right;
text-align:right;
width:30%;
padding-right:10%;
}
#subheader .rightaside h4{ color:#fff; margin-bottom:0;}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Subheader wie
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#subheaderwie {
position: relative;
overflow: hidden;
width: 100%;
margin-top: 95px;
margin-right: 0;
margin-left: 0;
margin-bottom: 0;
z-index: 3;
background-image: url(../images/opacs/dark10.png);
background-position: top left;
background-repeat: repeat-x;
background-attachment: scroll;
/* Safari 4+, Chrome & Mozilla 3.6+ */
background-image: -webkit-gradient(linear,center bottom,center top, from(rgba(0, 0, 0, .1)),to(rgba(255, 255, 255, .1)));
background-image: url(../images/demo/slide4.png);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000')";
background-size: 100%;
height: inherit;
}
#subheaderwie .inner {
padding-top: 50px;
padding-right: 0;
padding-left: 0;
width: 100%;
}
#subheaderwie h1 {
float:left;
width:50%;
margin-bottom:0;
padding-left:10%;
font-size: 48px;
line-height: normal;
font-weight:bold;
letter-spacing:-1px;
color:#fff;
}
#subheaderwie .rightaside {
float: right;
text-align:right;
width:30%;
padding-right:10%;
}
#subheaderwie .rightaside h4{ color:#fff; margin-bottom:0;}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Subheader contact
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#subheadercontact {
position: relative;
overflow: hidden;
width: 100%;
margin: 0;
z-index: 3;
background-image: url(../images/opacs/dark10.png);
background-position: top left;
background-repeat: repeat-x;
background-attachment: scroll;
/* Safari 4+, Chrome & Mozilla 3.6+ */
background-image: -webkit-gradient(linear,center bottom,center top, from(rgba(0, 0, 0, .1)),to(rgba(255, 255, 255, .1)));
background-image: url(../images/demo/slide_5m.png);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000')";
background-size: 100%;
height: 250px;
}
#subheadercontact .inner {
padding: 30px 0;
}
#subheadercontact h1 {
float:left;
width:50%;
margin-bottom:0;
padding-left:10%;
font-size: 48px;
line-height: normal;
font-weight:bold;
letter-spacing:-1px;
color:#fff;
}
#subheadercontact .rightaside {
float: right;
text-align:right;
width:30%;
padding-right:10%;
}
#subheadercontact .rightaside h4{ color:#fff; margin-bottom:0;}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Breadcrumb
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#breadcrumbs {
position: relative;
z-index: 4;
display: block;
margin: -0px 0 0 0;
padding-left: 10%;
padding-right: 10%;
}
#breadcrumbs .breadcrumbs {
background:#ffffff;
padding:4px 20px;
display:inline-block;
font-size:11px;
}
#breadcrumbs span { padding: 0 4px 0 4px; }
#breadcrumbs a { }
#breadcrumbs a:hover { }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Sidebars & Main Content
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#sidebar {
position:relative;
padding:0 0 30px 0;
}
#sidebar h3 {
padding:0;
margin-bottom:0px;
padding-bottom:10px;
font-size:16px;
line-height:normal;
font-weight:normal;
color:#999;
font-weight:bold;
}
.fullwidth #main {
padding: 15px 0;
width: 100%;
}
.fullwidth #main:after { clear:both; content:""; display:block; height:0; visibility:hidden; }
/* Left Sidebar*/
.leftsidebar #main {
float:right;
width:70%;
}
.leftsidebar #main .entry-content {
overflow:hidden;
padding:60px 0 60px 30px;
}
.leftsidebar #sidebar {
float:left;
overflow:hidden;
width:30%;
}
.leftsidebar #sidebar .content{
padding:60px 30px 0px 0;
}
/* Right Sidebar*/
.rightsidebar #main {
float:left;
padding:60px 0;
width:70%;
}
.rightsidebar #main .entry-content {
padding-right:40px;
}
.rightsidebar #sidebar {
position:relative;
float:left;
width:30%;
}
.rightsidebar #sidebar .content{
padding:60px 0 0 40px;
}
/* Page middle content area */
.pagemid {
position: relative;
display: block;
width: 100%;
z-index: 1;
margin-top: 30PX;
margin-right: auto;
margin-left: auto;
margin-bottom: 0;
padding: 0;
background: #ffffff;
color: #426A98;
}
.pagemid .maincontent {
width: 80%;
position: relative;
overflow: hidden;
margin: 0 auto;
padding: 0;
color: #F4F9FB;
}
.pagemid .maincontent h4{
color: #FD0307;
font-size: 18px;
}
/*.pagemid .maincontent a {
color: #146008;
font-size: 16px; */
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Footer
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#footer {
position: relative;
background-color: #FFFFFF;
background-position: top left;
background-repeat: repeat;
background-attachment: scroll;
}
#footer .inner {
width: 80%;
margin: 0 auto;
overflow: hidden;
padding: 10px 0;
font-size: 11px;
color: #f1f2f3;
}
#footer .een_kwart {
margin-left:2%;
}
#footer .one_fourth {
margin-left:3%;
}
#footer h3 {
margin-bottom: 20px;
font-size: 26px;
font-weight: lighter;
color: #999;
text-align: center;
font-family: Roboto, Geneva, sans-serif;
margin: 0 0 20px 0;
}
/* Footer Widgets */
#footer .syswidget { margin-bottom:0px; }
#footer .syswidget ul li a {
padding:0px;
text-decoration:none;
}
#footer .syswidget ul.children {
padding-left:8px;
border-left:1px solid #ddd;
}
/*-- Copyright --*/
.copyright {
position: relative;
width: 100%;
background-color: #fff;
border-top: 0 solid #333;
color: #525050;
border-bottom: 1px solid #525050;
}
.copyright .inner {
width: 95%;
margin: 0px auto;
padding: 15px 0;
padding: 15px 0;
font-size: 11px;
color: #525050;
}
.copyright p {
margin: 0;
font-size: 11px;
text-align: center;
color: #525050;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Blog Post
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.post { overflow:hidden; position:relative; padding-top:0px; margin-bottom:10px; }
.post .entry-title { margin:0px 0 15px 0px; font-size:22px; line-height:22px; }
.post .post-meta { float:left; z-index:2; width:130px; margin-bottom:15px; margin-right:30px; padding:0 0 5px 0; }
.post .post-meta { padding:0px; font-size:11px; text-align:right; color:#bbb; }
.post .postimg { display:block; position:relative; float:left; margin:0 0px 20px 0; }
.post .postmeta .comment{ font-size:16px; font-weight:bold; margin-top:20px; }
.post .post-entry { float:left; width:77%; }
.post .post-meta span { display:block; }
/* Blog Single Page Related Posts */
.singlepostlists {
overflow:hidden;
margin:0px;
}
.singlepostlists ul { margin:0px; }
.singlepostlists li {
display:block;
float:left;
width:120px;
margin:0 10px 0 0;
line-height:16px;
padding:0;
}
.singlepostlists li .thumb {
display:block;
margin:0 0 5px 0;
}
.singlepostlists h3 {
font-size:16px;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Post Style 3
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.post3 {
position:relative;
display:inline;
float:left;
margin:0 4% 0 0;
}
.post3 figure > span {
position:relative;
border:1px solid #ddd;
display:block;
padding:4px;
-webkit-box-shadow:0 2px 2px rgba(0,0,0,.1),0 0 10px rgba(0,0,0,.1);
-moz-box-shadow:0 2px 2px rgba(0,0,0,.1),0 0 10px rgba(0,0,0,.1);
box-shadow:0 2px 2px rgba(0,0,0,.1),0 0 10px rgba(0,0,0,.1);
}
.post3 figure.featured_image {
margin-bottom:20px;
}
.post3 h4 {
margin-bottom:10px;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Services Frontpage Widgets
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.fp-widget {
margin:0 0 10px 0;
padding:0;
}
.fp-widget h3 {
text-align:center;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Typography
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.typo_desc h1{ font-size:30px; }
.typo_desc p{ border:1px solid #eee; padding:10px;}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Post Style 2
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.post2 {
overflow:hidden;
position:relative;
margin-bottom:30px;
padding-bottom:20px;
border-bottom:1px solid #ddd;
}
.post2 .post-info {
display: table;
float:left;
width:26%;
margin: 0 4% 4% 0;
padding-right:4%;
background-image: url(../images/opacs/dark10.png);
background-position: top right;
background-repeat: repeat-y;
background-attachment: scroll;
}
.post2 .postmetadata span {
text-align:right;
display:block;
padding:3% 0;
}
.post2 header h2 { padding-left:34%; }
.post2 figure { margin-bottom:20px;}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Author Box
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#author-box {
margin:20px 0;
padding:30px 0;
border:1px solid #ddd;
border-width:1px 0 0 0;
}
#author-box .authorbox_content { overflow:hidden;}
#author-avatar {
float:left;
margin:0 15px 0 0;
}
#author-description { margin:0 10px 0px 100px; }
#author-description h2 {
font-size:16px;
margin-bottom:5px;
}
#author-description p {
font:italic 13px/1.6 Georgia, Serif;
margin-bottom:0;
}
#authorpage {
margin:0 auto;
margin-bottom:30px;
border-bottom:1px solid #eee;
text-align:center;
}
#authorpage img.avatar {
margin:0 auto;
display:block;
border:1px solid #eee;
padding:2px
}
#authorpage .author-bio {
display:block;
width:80%;
margin:10px auto;
text-align:center;
}
#authorpage .author-bio p {
font:italic normal 13px/18px Georgia, Times, Serif;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Post Pagination
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#nav-below {
margin:30px 0;
padding:20px 0;
overflow:hidden;
background-image:url(../images/opacs/dark10.png);
background-position:50% top;
background-repeat:repeat-y;
background-attachment:scroll;
border-top:1px solid #ddd;
border-bottom:1px solid #ddd;
font:italic normal 12px/1.6 Roboto, Times, Serif;
}
#nav-below .nav-previous {
position: relative;
display:inline-block;
line-height:1em;
width:50%;
float: left;
}
#nav-below .nav-next {
display:inline-block;
position: relative;
line-height:1em;
width:50%;
float: right;
text-align:right;
}
.nav-previous span { margin-right:10px; }
.nav-next span { margin-left:10px; }
.nav-next span,
.nav-previous span {
line-height:2em;
text-transform:uppercase;
display: block;
color:#aaa;
font:Roboto normal 12px/1.6 Arial, Georgia, Times, Serif;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Portfolio
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.portfolio_item {
overflow:hidden;
width:100%;
padding:0px 0px 0px 0px;
}
.port_box {
display:block;
float:left;
margin:0 0 10px 0 ;
}
.port_desc h4 { margin-bottom:10px; }
.port_desc {
padding: 0;
margin: 0 0 0 30;
}
.port_desc p { margin-bottom:20px; }
.port_desc p.extras { margin-bottom:0;}
.port_desc.col1 { padding:0px 2px 2px 2px; margin:0; }
.port_desc .date { display:block; }
.port_desc .date,
.port_desc a.casestudy,
.port_desc a.visitsite {
font-size:11px;
padding:0 10px 0 0px;
}
.port_desc a.visitsite {
background:url(../images/opacs/dark10.png) 0 0 repeat-y;
padding:0 10px 0 10px;
}
.port_desc a.visitsite:hover,
.port_desc a.casestudy:hover { }
.portfolio_single .postimg { margin-bottom:20px;}
.post_slider {
display:block;
position:relative;
z-index:2;
}
.post_slider img { display: block; margin-bottom:20px;}
/* Post Slider Navigation */
.postslider_nav {
bottom: -10px;
position: relative;
left: 0px;
}
.postslider_nav a {
display: block;
float: left;
width:7px;
height: 7px;
margin-right: 5px;
text-indent: -9999px;
outline:none;
}
.postslider_nav a.activeSlide {
}
.postslider_nav a:hover {
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Portfolio Single Page Pagination
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.portfoliopage p {
margin-bottom:10px;
line-height:16px;
}
.port-post-info {
margin-bottom:0px
}
.port-post-info span {
display:block;
}
.port_box { position:relative;}
.port_img { position:relative; overflow:hidden;}
.portfolio_single .port_img { margin-bottom:30px;}
.post_slider a, .sort_img a {
display: block;
position: relative;
}
.post_slider a:hover img,
.sort_img a:hover img { opacity:0.5; }
/* Portfolio Related */
#relatedposts { margin: 20px 0; padding:0; }
#relatedposts ul { list-style: none; margin:0; }
#relatedposts ul li { float: left; margin-right: 15px; width: 80px; }
#relatedposts img { display:block;}
#relatedposts a:hover { }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Portfolio Next Prev
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#single-nav {
margin:0;
padding:5px 0;
overflow:hidden;
font:italic 12px "Roboto", Georgia, Times, Serif;
}
#single-nav .nav-previous {
display:block;
text-align:center;
padding-bottom:10px;
}
#single-nav .nav-next {
padding-top:10px;
background:url(../images/dots.png) 0 0 repeat-x;
display:block;
text-align:center;
}
#single-nav .nav-previous span,
#single-nav .nav-next span {
line-height:normal;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Hover Image Icons
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.hover_type { display: none; position:absolute; z-index:10; left:50%; }
.hover_type a {
position: absolute;
bottom: 10px;
width: 26px;
height: 26px;
background-image: url(../images/hover_icons.png);
}
/* Hover Link */
.hover_type a.hoverlink { background-position: -90px 0; }
/* Hover Image */
.hover_type a.hoverimage { background-position: -60px 0; right: 1px !important; }
/* Hover Video */
.hover_type a.hovervideo { background-position: -30px 0; right: 1px !important; }
/* Hover Custom Link */
.hover_type a.hovercustomlink { background-position: 0 0; right: 1px !important; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Comments
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#comments {
margin:20px 0 0 0;
padding-top:20px;
}
#comments-title {
text-align:center;
}
#comments-title em {
display:block;
font:italic 12px Roboto, Times, Serif;
}
ol.commentlist {
margin:0 0 30px 0;
padding: 0;
}
ol.commentlist li {
margin: 0px;
padding:0px;
list-style-type:none;
}
.comment_wrap {
position:relative;
margin:0 0 30px 0;
padding:0 0 15px 0;
border-bottom:1px solid #eee;
}
.comment-author { display:block; }
.comment-author .avatar { float:left; width:40px; }
.single_comment { clear:both; margin-top:10px; }
.comment-meta {
border-left:1px solid #eee;
margin-left:50px;
height:40px;
padding-left:10px;
color:#ccc;
}
.comment-meta cite {
display:block;
font-weight:bold;
}
.commentlist ul.children {
margin:0;
padding:0 0 0 50px;
}
.commentlist .children .comment_wrap { padding-top:0px; }
.commentlist .moderation { margin-top: 10px; color: #dd0000; }
.commentlist .children { margin-bottom:0px;}
.comment-author-admin .avatar {
padding-bottom:1px;
border-bottom:0px solid #222;
}
.reply a:link,
.reply a:visited { color:#999; }
.reply a:hover { color:#ff8800; }
.cancel-comment-reply a {
float:right;
padding:4px 0;
font:Italic 11px Roboto, Times, Serif;
}
.cancel-comment-reply a:hover {
color:#000000;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Comments form
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#commentform input,
#commentform textarea { padding:4px; }
#commentform input[type=image] { width:auto !important; background:none; }
#commentform .btn { border: 0 !important; }
#respond:after {
display: block;
visibility: hidden;
clear: both;
height: 0;
content: ".";
}
#respond {
position:relative;
clear:both;
padding:15px 0;
}
#respond p { position:relative; }
#respond h3 { font:italic 16px Georgia, Times, Serif; }
#respond label {
width: 60px;
position:absolute;
top:3px;
left:1px;
line-height:18px;
padding:3px 10px;
background:url(images/dot10.png) top right repeat-y;
}
#respond input,
#respond select,
#respond textarea {
width: 98%;
padding:6px 0;
border: 1px solid;
border-color: #ddd #eee #eee #ddd;
}
#respond input:focus,
#respond select:focus,
#respond textarea:focus { border-color: #d6d6d6 #e5e5e5 #e5e5e5 #d6d6d6; }
#respond textarea {
height: 100px;
width: 96%;
padding: 6px;
vertical-align: top;
line-height:20px;
}
#respond span { font:normal 11px Tahoma, Arial, Sans-serif; }
#respond input { text-indent:90px; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Widget Lists
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.syswidget {
margin-bottom:40px;
text-align:left;
}
.syswidget ul {
margin:0;
padding:0;
}
.syswidget ul ul { margin-bottom:0; }
.syswidget ul li {
margin:0;
padding:5px 0;
list-style-type:none;
background:none;
position:relative;
border-bottom:1px solid #eee;
}
.syswidget ul li a {
padding:1px 0px 1px 0px;
text-decoration:none;
zoom:1;
}
.syswidget ul li a,
.syswidget ul li a:visited { display:block; }
.syswidget ul li ul { margin-left:15px}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Fancy Highlights
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.highlight{
padding:1px 4px;
text-shadow: none;
color:#ffffff;
background-color:#5E5E5E;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.highlight:hover { background:#c30000; }
.highlight2 {
transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
}
.highlight2 { font-style:italic; border-bottom:1px dashed #777777; }
.highlight2:hover { border-bottom:1px solid #c30000; }
.highlight.yellow { background-color:#ffda48; color:#000000; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Button
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.button,
.button span { display: inline-block; }
.button {
position:relative;
zoom:1; /* zoom and *display = ie7 hack for display:inline-block */
overflow: visible;
line-height:1em;
margin-bottom:10px;
border: 1px solid #ddd;/* IE Hack*/
border: rgba(0, 0, 0, .1) 1px solid;/* Safari 4+, Chrome, FF3.5+ */
border-bottom:rgba(0, 0, 0, .2) 3px solid;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.1);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.1);
box-shadow: 0 1px 2px rgba(0,0,0,.1);
outline: none;
white-space: nowrap;
cursor: pointer;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
/* FF3.5+ */
background: -moz-linear-gradient(
center top,
rgba(255, 255, 255, .1) 0%,
rgba(0, 0, 0, .1) 100%
);
/* Safari 4+, Chrome */
background: -webkit-gradient(
linear,
center bottom,
center top,
from(rgba(0, 0, 0, .1)),
to(rgba(255, 255, 255, .1))
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000')"; /* IE8 */
-moz-user-select: none;
-webkit-user-select:none;
-khtml-user-select: none;
user-select: none;
}
button::-moz-focus-inner { border: none; /* overrides extra padding on sides FF3.5 */ }
button.button { margin:0; padding:0px; }
.button.full,
.button.full span { display: block; }
.button:hover,
button.button:hover,
.button.hover {
position:relative;
top:1px;
/* FF3.5 */
background: -moz-linear-gradient(
center top,
rgba(255, 255, 255, .2) 0%,
rgba(255, 255, 255, .1) 100%
);
/* Safari4+, Chrome */
background: -webkit-gradient(
linear,
center bottom,
center top,
from(rgba(255, 255, 255, .1)),
to(rgba(255, 255, 255, .2))
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#33FFFFFF', EndColorStr='#19FFFFFF'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#33FFFFFF', EndColorStr='#19FFFFFF')"; /* IE8 */
}
button.button:active,
.button:active,
.button.active {
top:1px;
/* FF3.5 */
background: -moz-linear-gradient(
center top,
rgba(0, 0, 0, .1) 0%,
rgba(255, 255, 255, .1) 100%
);
/* Safari4+, Chrome */
background: -webkit-gradient(
linear,
center bottom,
center top,
from(rgba(255, 255, 255, .1)),
to(rgba(0, 0, 0, .1))
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19000000', EndColorStr='#19FFFFFF'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#19000000', EndColorStr='#19FFFFFF')"; /* IE8 */
}
.button span {
position: relative;
padding:0.5em 1.3em;
border-top:1px solid rgba(255, 255, 255, 0.1);
border-bottom:1px solid rgba(0, 0, 0, 0.1);
line-height:1em;
text-align:center;
text-decoration:none;
white-space: nowrap;
color:#fff;
}
td form .btnBBS {
color: rgba(212,6,9,1.00);
}
td form .btnBBS a {
color: rgba(212,6,9,1.00);
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari, Google Chrome margin fix */
button.button span {
margin-top: -1px;
margin-left:-2px;
margin-right:-2px;
}
}
.button.small span { font-size:10px; text-transform:uppercase; }
.button.medium span { font-size:14px; }
.button.large span { font-size:18px; }
/* ---- Buttons Color Scheme ---- */
.button.gray { background-color: #666666; } .button.gray:hover { background-color: #666666; }
.button.brown { background-color: #A52A2A; } .button.brown:hover { background-color: #A52A2A; }
.button.cyan { background-color: #00FFFF; } .button.cyan:hover { background-color: #00FFFF; }
.button.orange { background-color: #ff5c00; } .button.orange:hover { background-color: #ff5c00; }
.button.red { background-color: #861D23; } .button.red:hover { background-color: #861D23; }
.button.magenta { background-color: #A9014B; } .button.magenta:hover { background-color: #A9014B; }
.button.yellow { background-color: #ffb515; } .button.yellow:hover { background-color: #ffb515; }
.button.blue { background-color: #00ADEE; } .button.blue:hover { background-color: #00ADEE; }
.button.pink { background-color: #e22092; } .button.pink:hover { background-color: #e22092; }
.button.green { background-color: #91bd09; } .button.green:hover { background-color: #91bd09; }
.button.black { background-color: #333333; } .button.black:hover { background-color: #333333; }
.button.white { background-color: #FFFFFF; }
.button.white span { color: #666666; }
a.button,
a.button:hover,
button.button:hover { background-color:#EDEDED; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Icons
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
a[class ^="icon-"] { margin-right:8px; }
span[class ^="icon-"] {
margin-right:8px;
line-height:20px;
display:-moz-inline-stack;
display:inline-block;
zoom:1; /* Internet Explorer Hack */
*display:inline;
}
.icon-male { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -780px 0; }
.icon-female { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -760px -20px; }
.icon-addbook { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -740px -40px; }
.icon-movie { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -720px -60px; }
.icon-zip { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -700px -80px; }
.icon-calc { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -680px -100px; }
.icon-arrow { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -660px -120px; }
.icon-medal { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -640px -140px; }
.icon-star { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -620px -160px; }
.icon-error { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -600px -180px; }
.icon-new { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -580px -200px; }
.icon-feed { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -560px -220px; }
.icon-print { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -540px -240px; }
.icon-exclamation { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -520px -260px; }
.icon-yen { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -500px -280px; }
.icon-euro { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -480px -300px; }
.icon-mail { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -460px -320px; }
.icon-pdf { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -440px -340px; }
.icon-home { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -420px -360px; }
.icon-word { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -400px -380px; }
.icon-dollar { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -380px -400px; }
.icon-pound { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -360px -420px; }
.icon-phone { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -340px -440px; }
.icon-support { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -320px -460px; }
.icon-vcard { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -300px -480px; }
.icon-disk { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -280px -500px; }
.icon-monitor { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -260px -520px; }
.icon-download { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -240px -540px; }
.icon-location { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -220px -560px; }
.icon-pin { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -200px -580px; }
.icon-find { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -180px -600px; }
.icon-check { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -160px -620px; }
.icon-help { padding-left:25px; vertical-align:baseline; background:url(../images/icons/icons_black.png) no-repeat -140px -640px; }
.icon-male.blue, .icon-female.blue, .icon-zip.blue, .icon-movie.blue, .icon-addbook.blue, .icon-arrow.blue, .icon-calc.blue, .icon-dollar.blue, .icon-pound.blue, .icon-euro.blue, .icon-yen.blue, .icon-error.blue, .icon-exclamation.blue, .icon-feed.blue, .icon-help.blue, .icon-home.blue, .icon-mail.blue, .icon-medal.blue, .icon-new.blue, .icon-word.blue, .icon-pdf.blue, .icon-phone.blue, .icon-print.blue, .icon-star.blue, .icon-support.blue, .icon-vcard.blue, .icon-disk.blue, .icon-monitor.blue, .icon-download.blue, .icon-pin.blue, .icon-location.blue, .icon-find.blue, .icon-check.blue
{ background-image:url(../images/icons/icons_blue.png); }
.icon-male.cyan, .icon-female.cyan, .icon-zip.cyan, .icon-movie.cyan, .icon-addbook.cyan, .icon-arrow.cyan, .icon-calc.cyan, .icon-dollar.cyan, .icon-pound.cyan, .icon-euro.cyan, .icon-yen.cyan, .icon-error.cyan,
.icon-exclamation.cyan,.icon-feed.cyan,.icon-help.cyan,.icon-home.cyan,.icon-mail.cyan,.icon-medal.cyan,.icon-new.cyan,.icon-word.cyan,.icon-pdf.cyan,.icon-phone.cyan,.icon-print.cyan,.icon-star.cyan,.icon-support.cyan,.icon-vcard.cyan,
.icon-disk.cyan,.icon-monitor.cyan,.icon-download.cyan,.icon-pin.cyan,.icon-location.cyan,.icon-find.cyan, .icon-check.cyan
{ background-image:url(../images/icons/icons_cyan.png); }
.icon-male.green, .icon-female.green, .icon-zip.green, .icon-movie.green, .icon-addbook.green, .icon-arrow.green, .icon-calc.green, .icon-dollar.green, .icon-pound.green, .icon-euro.green, .icon-yen.green, .icon-error.green,
.icon-exclamation.green,.icon-feed.green,.icon-help.green,.icon-home.green,.icon-mail.green,.icon-medal.green,.icon-new.green,.icon-word.green,.icon-pdf.green,.icon-phone.green,.icon-print.green,.icon-star.green,.icon-support.green,.icon-vcard.green,
.icon-disk.green,.icon-monitor.green,.icon-download.green,.icon-pin.green,.icon-location.green,.icon-find.green, .icon-check.green
{ background-image:url(../images/icons/icons_green.png); }
.icon-male.magenta, .icon-female.magenta, .icon-zip.magenta, .icon-movie.magenta, .icon-addbook.magenta, .icon-arrow.magenta, .icon-calc.magenta, .icon-dollar.magenta, .icon-pound.magenta, .icon-euro.magenta, .icon-yen.magenta, .icon-error.magenta,
.icon-exclamation.magenta,.icon-feed.magenta,.icon-help.magenta,.icon-home.magenta,.icon-mail.magenta,.icon-medal.magenta,.icon-new.magenta,.icon-word.magenta,.icon-pdf.magenta,.icon-phone.magenta,.icon-print.magenta,.icon-star.magenta,.icon-support.magenta,.icon-vcard.magenta,
.icon-disk.magenta,.icon-monitor.magenta,.icon-download.magenta,.icon-pin.magenta,.icon-location.magenta,.icon-find.magenta, .icon-check.magenta
{ background-image:url(../images/icons/icons_magenta.png); }
.icon-male.gray, .icon-female.gray, .icon-zip.gray, .icon-movie.gray, .icon-addbook.gray, .icon-arrow.gray, .icon-calc.gray, .icon-dollar.gray, .icon-pound.gray, .icon-euro.gray, .icon-yen.gray, .icon-error.gray,
.icon-exclamation.gray,.icon-feed.gray,.icon-help.gray,.icon-home.gray,.icon-mail.gray,.icon-medal.gray,.icon-new.gray,.icon-word.gray,.icon-pdf.gray,.icon-phone.gray,.icon-print.gray,.icon-star.gray,.icon-support.gray,.icon-vcard.gray,
.icon-disk.gray,.icon-monitor.gray,.icon-download.gray,.icon-pin.gray,.icon-location.gray,.icon-find.gray, .icon-check.gray
{ background-image:url(../images/icons/icons_gray.png); }
.icon-male.orange, .icon-female.orange, .icon-zip.orange, .icon-movie.orange, .icon-addbook.orange, .icon-arrow.orange, .icon-calc.orange, .icon-dollar.orange, .icon-pound.orange, .icon-euro.orange, .icon-yen.orange, .icon-error.orange,
.icon-exclamation.orange,.icon-feed.orange,.icon-help.orange,.icon-home.orange,.icon-mail.orange,.icon-medal.orange,.icon-new.orange,.icon-word.orange,.icon-pdf.orange,.icon-phone.orange,.icon-print.orange,.icon-star.orange,.icon-support.orange,.icon-vcard.orange,
.icon-disk.orange,.icon-monitor.orange,.icon-download.orange,.icon-pin.orange,.icon-location.orange,.icon-find.orange, .icon-check.orange
{ background-image:url(../images/icons/icons_orange.png); }
.icon-male.pink, .icon-female.pink, .icon-zip.pink, .icon-movie.pink, .icon-addbook.pink, .icon-arrow.pink, .icon-calc.pink, .icon-dollar.pink, .icon-pound.pink, .icon-euro.pink, .icon-yen.pink, .icon-error.pink,
.icon-exclamation.pink,.icon-feed.pink,.icon-help.pink,.icon-home.pink,.icon-mail.pink,.icon-medal.pink,.icon-new.pink,.icon-word.pink,.icon-pdf.pink,.icon-phone.pink,.icon-print.pink,.icon-star.pink,.icon-support.pink,.icon-vcard.pink,
.icon-disk.pink,.icon-monitor.pink,.icon-download.pink,.icon-pin.pink,.icon-location.pink,.icon-find.pink, .icon-check.pink
{ background-image:url(../images/icons/icons_pink.png); }
.icon-male.red, .icon-female.red, .icon-zip.red, .icon-movie.red, .icon-addbook.red, .icon-arrow.red, .icon-calc.red, .icon-dollar.red, .icon-pound.red, .icon-euro.red, .icon-yen.red, .icon-error.red,
.icon-exclamation.red,.icon-feed.red,.icon-help.red,.icon-home.red,.icon-mail.red,.icon-medal.red,.icon-new.red,.icon-word.red,.icon-pdf.red,.icon-phone.red,.icon-print.red,.icon-star.red,.icon-support.red,.icon-vcard.red,
.icon-disk.red,.icon-monitor.red,.icon-download.red,.icon-pin.red,.icon-location.red,.icon-find.red, .icon-check.red
{ background-image:url(../images/icons/icons_red.png); }
.icon-male.yellow, .icon-female.yellow, .icon-zip.yellow, .icon-movie.yellow, .icon-addbook.yellow, .icon-arrow.yellow, .icon-calc.yellow, .icon-dollar.yellow, .icon-pound.yellow, .icon-euro.yellow, .icon-yen.yellow, .icon-error.yellow,
.icon-exclamation.yellow,.icon-feed.yellow,.icon-help.yellow,.icon-home.yellow,.icon-mail.yellow,.icon-medal.yellow,.icon-new.yellow,.icon-word.yellow,.icon-pdf.yellow,.icon-phone.yellow,.icon-print.yellow,.icon-star.yellow,.icon-support.yellow,.icon-vcard.yellow,
.icon-disk.yellow,.icon-monitor.yellow,.icon-download.yellow,.icon-pin.yellow,.icon-location.yellow,.icon-find.yellow, .icon-check.yellow
{ background-image:url(../images/icons/icons_yellow.png); }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Fancy Table
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
table.fancy_table { border: 1px solid #eee; }
table.fancy_table th {
padding:8px;
background-color: #06C;
border: 1px solid #ddd;
color:#666;
text-align:center;
}
table.fancy_table td {
padding:5px;
background:#fff;
border: 1px solid #eee;
text-align:center;
}
table.fancy_table tbody tr:hover td {
background-color:#F3F3F3;
}
table.fancy_table tfoot {
background-color: #F3F3F3;
}
table.fancy_table {
width:99%;
margin:0 auto;
margin-bottom:20px;
border-collapse: collapse;
border-spacing: 0;
}
.fancy_table.alignleft { float:left; margin:3px 15px 10px 3px;}
.fancy_table.alignright { float:right; margin:3px 3px 10px 15px; }
.fancy_table.aligncenter {
display:block;
clear:both;
margin:0 auto;
padding:2px;
text-align:center;
}
/* Default Table */
table {
width: 99%;
margin: 0 auto;
margin-bottom: 20px;
border: 0px solid #eee;
border-collapse: collapse;
border-spacing: 0;
color: #666;
font-size: 12px;
text-align: left;
background-color: #ffffff;
}
table th {
padding: 1em;
background-color: #06C;
border: 0px solid #ddd;
color: #FFF;
text-align: center;
}
table td {
padding: 0;
background-color: #fff;
border: 0px solid #eee;
text-align: center;
font-size: 100%;
font-weight: bold;
}
table tbody tr:hover td {
background-color:white;
color: grey;
}
table tfoot {
background-color: #F3F3F3;
}
table.alignleft { float:left; margin:3px 15px 10px 3px;}
table.alignright { float:right; margin:3px 3px 10px 15px; }
table.aligncenter {
display:block;
clear:both;
margin:0 auto;
padding:2px;
text-align:center;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Dropcaps
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.dropcap1,
.dropcap2 {
float: left;
text-align: center;
overflow:hidden;
}
.dropcap1 {
width: 50px;
margin:5px 15px 15px 0;
font-size: 36px;
line-height: 200%;
color:#ffffff;
background-color:#b9b9b9;
background-image:url(../images/opacs/dark10.png);
background-position:top left;
background-repeat:repeat;
background-attachment:scroll;
/* Safari 4+, Chrome & Mozilla 3.6+ */
background-image: -webkit-gradient(linear,center bottom,center top, from(rgba(0, 0, 0, .1)),to(rgba(255, 255, 255, .1)));
background-image: -moz-linear-gradient(center top,rgba(255, 255, 255, .1) 0%,rgba(0, 0, 0, .1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000')"; /* IE8 */
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
}
.dropcap2 {
height: 45px;
width: 45px;
margin:5px 15px 5px 0;
font-size: 24px;
line-height: 45px;
color:#fff;
background-color:#000000;
}
.dropcap3 {
background:url("../images/dropcap3.png") no-repeat scroll 0px 0px transparent;
color:#ddd;
float:left;
padding-right:0px;
overflow:hidden;
text-align:center;
line-height: 64px;
width: 64px;
margin:0 10px 0 0;
font-size: 4.0em;
font-weight:bold;
}
.dropcap1.black, .dropcap2.black { background-color:#000000; }
.dropcap1.blue, .dropcap2.blue { background-color:#00ADEE; }
.dropcap1.cyan, .dropcap2.cyan { background-color:#52F3FF; }
.dropcap1.green, .dropcap2.green { background-color:#4CC417; }
.dropcap1.navy, .dropcap2.navy { background-color:#151B8D; }
.dropcap1.orange, .dropcap2.orange { background-color:#F87217; }
.dropcap1.pink, .dropcap2.pink { background-color:#F660AB; }
.dropcap1.red, .dropcap2.red { background-color:#E41B17; }
.dropcap1.yellow, .dropcap2.yellow { background-color:#FFE87C; }
.dropcap1.magenta, .dropcap2.magenta { background-color:#E238EC; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Legend
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
div.legend { width:auto; border:1px solid #ddd; }
div.legend h5 {
float:left;
position:relative;
top: -18px;
left:11px;
margin:0 0 -9px!important;
padding: 0 10px;
font-size: 12px;
line-height: 24px;
font-weight:normal;
background-color: #eee;
text-shadow: none;
border-radius: 1px;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
}
div.legend
{
margin: 35px 0;
padding: 6px;
border-radius: 1px;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
}
div.legend p
{ margin:10px; clear:both; }
/* --- ALERT MESSAGE BOXES
________________________________________*/
span.error { border-color:#ffcfce; background: #ffdfdf }
span.info { border-color:#d4ecf0; background: #e0f2f5 }
span.alert { border-color:#efeabf; background: #f6f3da }
span.download { border-color:#c7f5ce; background: #d6f7db }
span.error,
span.info,
span.alert,
span.download {
display: block;
padding: 20px 20px 20px 20px;
margin: 5px 0;
border-style:solid;
border-width:4px 4px 4px 20px;
border-radius:5px;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Blockquotes & Pullquotes
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
span.inset-left {
display: block;
float: left;
width: 35%;
padding: 15px;
border-left:1px solid #dddddd;
font:italic normal 14px/25px Georgia, Arial, Sans-serif;
letter-spacing:0;
}
span.inset-right {
display: block;
float: right;
width: 35%;
padding: 15px;
border-right:1px solid #dddddd;
font:italic normal 14px/25px Georgia, Arial, Sans-serif;
letter-spacing:0;
}
/* Blockquote */
blockquote {
margin: 0 0 20px 0;
padding: 10px 0px 0 50px !important;
background: transparent url(../images/quote_left.png) 0 10px no-repeat;
font:italic 16px/20px 'Georgia', "Trebuchet MS", "Times New Roman", Serif;
}
blockquote p {
margin-bottom: 12px;
font:italic 16px/20px 'Georgia', "Trebuchet MS", "Times New Roman", Serif;
}
blockquote cite {
display:block;
padding-top:10px;
font-size: 12px;
font-style: italic;
line-height:20px;
}
blockquote.alignleft {
margin: 0 5% 0 0;
width: 30%;
}
blockquote.alignright {
margin:0 0 0 5%;
width:30%;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Alignment
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.left {float:left;}
/* wrap text around image */
.leftBB {
float: left;
padding: 010px 10px 10px 0px;}
.leftBB img {
width: 350px;
}
.right {float:right;}
.center {
float: none;
text-align: center;
margin-top: inherit;
margin-right: 20%;
margin-left: 20%;
margin-bottom: inherit;
}
.alignleft,
img.alignleft,
a img.alignleft { float:left; margin:3px 15px 4px 3px;}
.alignright,
img.alignright,
a img.alignright { float:right; margin:3px 3px 4px 15px; }
.aligncenter,
img.aligncenter,
a img.aligncenter { clear:both; display:block; margin:10px auto 10px auto; padding:2px; text-align:center; }
.wp-caption { text-align: center; margin-bottom: 20px; padding: 2px; border:1px solid #ddd; background:#f1f2f3; }
.wp-caption img { margin: 3px;}
.wp-smiley { margin:0; }
.wp-caption p.wp-caption-text { margin: 0 0 4px; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Dividers
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.divider {
width:auto;
display:block;
clear:both;
height:21px;
padding:40px 0;
background:url(../images/separator.png) center center scroll no-repeat;
}
.divider_space {
clear: both;
width: 100%;
height:1px;
margin:0px;
padding:20px 0;
}
.divider_line {
position: relative;
display: block;
clear: both;
margin:40px 0;
background:#ddd;
height:1px;
}
.divider_line_dun {
position: relative;
display: block;
clear: both;
margin:20px 0 20px 0;
background:#ddd;
height:1px;
}
.divider_line_dun_wit {
position: relative;
display: block;
clear: both;
margin: 10px 0 10px 0;
background-color: #ffffff;
height: 3px;
}
.divider_line_dik {
position: relative;
display: block;
clear: both;
margin:20px 0 20px 0;
background:#ddd;
height:3px;
}
.divider_line_klant {
position: relative;
display: block;
clear: both;
margin:0px 0 0px 0;
background:#ddd;
height:1px;
}
.top {
position: relative;
margin-bottom: 40px;
}
.top a {
position: absolute;
top:-5px;
right:0;
font-size: 14px;
line-height: 12px;
text-transform: uppercase;
text-align: right;
color:#fff;
background-color:#b4b4b4;
padding:3px 6px;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Horizontal Tabs / Vertical Tabs
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.systabspane { clear:both; margin:10px 0 30px 0;}
.systabspane .panes { clear:both; }
.systabspane.centertabs ul.tabs { margin:0 auto;}
.systabspane.righttabs ul.tabs { margin:0 0 0 auto; }
.tabs {
clear:left;
position:relative;
display: table;
margin:0;
padding:0;
}
ul.tabs li {
float:left;
margin:0;
padding:0;
position:relative;
list-style-type:none;
}
ul.tabs a span {
display:block;
}
ul.tabs a {
display:block;
float:left;
position:relative;
margin-right:2px;
padding:8px 15px !important;
font-size:11px;
font-weight:bold;
line-height:22px;
color:#999;
text-decoration:none;
}
.tab_content {
display:none;
overflow:hidden;
padding:20px 30px;
border:1px solid #eee;
border-width:1px 1px 1px 1px;
background-color:#fff;
}
ul.tabs li.current {
position:relative;
border-bottom:none;
background-position:center bottom;
background-repeat:no-repeat;
}
ul.tabs li.current a {
color:#fff;
}
/* Current Tab Arrow */
ul.tabs li.current:after {
width:0;
height:0;
display:block;
position:absolute;
content:"";
border-width:10px;
}
ul.tabs li.current:after {
margin-left:-10px;
bottom:-20px;
left:50%;
border-style: solid outset outset outset;
border-right-color:transparent !important;
border-bottom-color:transparent !important;
border-left-color:transparent !important;
}
/**
* Vertical Tabs CSS
*-----------------------------------
*/
.vertabs .panes {
clear:none;
}
.vertabs ul.tabs {
clear:none;
float:left;
width:160px;
height:auto;
margin:0 !important;
padding:0 5px 0 0;
border-bottom:0px solid #000;
}
.vertabs ul.tabs li {
clear:left;
display:block;
float:none;
margin:0 0 5px 0;
padding:0;
list-style-type:none;
border:1px solid #f1f2f3;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 0px;
-moz-border-radius-bottomleft: 5px;
-webkit-border-radius: 5px 0px 0px 5px;
border-radius: 5px 0px 0px 5px;
}
.vertabs ul.tabs a {
display:block;
clear:left;
float:none;
position:relative;
top:1px;
height:auto;
margin-right:2px;
padding:8px 15px;
color:#999;
text-decoration:none;
}
.vertabs .tab_content { border-width:1px; }
.vertabs ul.tabs li.current {
position:relative;
border:1px solid #eee;
border-bottom:1px solid #eee;
top:0;
right:-5px;
background-color:#ffffff;
border-right:1px solid #000;
-webkit-border-top-left-radius: 5px;
-moz-border-radius-topleft: 5px;
border-top-left-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-left-radius: 5px;
/* ------- clear radius on vertical tabs -------- */
-webkit-border-top-right-radius: 0px;
-moz-border-radius-topright: 0px;
border-top-right-radius: 0px;
}
.vertabs ul.tabs li.current a {
color:#444;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Fancy Headings
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.fancycenter {
margin: auto;
width: 100%;
padding: 10px;
position: relative;
}
.fancyheading {
width: 100%;
margin-bottom:18px;
background-color: #b9b9b9;
text-align: center;
background-color: #b9b9b9;
background-image: url(../images/opacs/dark10.png);
background-position: top left;
background-repeat: repeat;
background-attachment: scroll;
/* Safari 4+, Chrome & Mozilla 3.6+ */
background-image: -webkit-gradient(linear,center bottom,center top, from(rgba(0, 0, 0, .1)),to(rgba(255, 255, 255, .1)));
background-image: -moz-linear-gradient(center top,rgba(255, 255, 255, .1) 0%,rgba(0, 0, 0, .1) 100%);
}
.fancyheading p {
text-align: center;
}
.fancyheading span {
width: 100%;
padding: 5px 5px;
font-size: 12px;
font-weight: normal;
letter-spacing: 1px;
line-height: 2px;
text-transform: uppercase;
color : #fff;
background-color: #b9b9b9;
background-image: url(../images/opacs/dark10.png);
background-position: top left;
background-repeat: repeat;
background-attachment: scroll;
/* Safari 4+, Chrome & Mozilla 3.6+ */
background-image: -webkit-gradient(linear,center bottom,center top, from(rgba(0, 0, 0, .1)),to(rgba(255, 255, 255, .1)));
background-image: -moz-linear-gradient(center top,rgba(255, 255, 255, .1) 0%,rgba(0, 0, 0, .1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000'); /* IE6,IE7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#19FFFFFF', EndColorStr='#19000000')"; /* IE8 */
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-left: 10%;
margin-right: 10%;
left: 10%;
right: 10%;
top: 10%;
bottom: 10%;
}
.fancyheading span.gray { background-color: #666666; }
.fancyheading span.orange { background-color: #ff5c00; }
.fancyheading span.red { background-color: #e62727; }
.fancyheading span.magenta { background-color: #A9014B; }
.fancyheading span.yellow { background-color: #ffb515; }
.fancyheading span.blue { background-color: #00ADEE; }
.fancyheading span.pink { background-color: #e22092; }
.fancyheading span.green { background-color: #91bd09; }
.fancyheading span.black { background-color: #333333; }
.fancyheading span.white { background-color: #FFFFFF; }
.fancyheading span.white span { color: #666666; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* List Styles
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.pricing li {
background:#ffffff;
border:1px solid #eeeeee;
border-bottom:1px solid #ddd;
margin-bottom:1px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
}
ul.doubles {
clear:both;
padding-left:25px;
margin-left:0px !important;
overflow:hidden;
}
.doubles li {
float:left;
width:42%;
}
ul.sitemap { margin-left:0px !important; }
ul.list-disc li,
ul.list-circle li,
ul.list-square li,
ul.list-arrow1 li,
ul.list-arrow2 li,
ul.list-arrow3 li,
ul.list-arrow4 li,
ul.list-arrow5 li,
ul.list-bullet1 li,
ul.list-bullet2 li,
ul.list-bullet3 li,
ul.list-bullet4 li,
ul.list-bullet5 li,
ul.list-star1 li,
ul.list-star2 li,
ul.list-star3 li,
ul.list-plus li,
ul.list-minus li,
ul.list-pointer li,
ul.list-style1 li,
ul.list-check li,
ul.sitemap li,
ul.list-tree li {
background-image: url("../images/bullets/lists.png");
background-repeat:no-repeat;
background-position: 0 0;
padding-left:25px;
list-style-type:none;
line-height:22px;
}
ul.list-disc li { background-position: -480px 0px; }
ul.list-circle li { background-position: -460px -17px; }
ul.list-square li { background-position: -440px -37px; }
ul.list-arrow1 li { background-position: -420px -57px; }
ul.list-arrow2 li { background-position: -400px -77px; }
ul.list-arrow3 li { background-position: -380px -97px; }
ul.list-arrow4 li { background-position: -360px -117px; }
ul.list-arrow5 li { background-position: -340px -137px; }
ul.sitemap li { background-position: -340px -137px; }
ul.list-bullet1 li { background-position: -320px -157px; }
ul.list-bullet2 li { background-position: -300px -177px; }
ul.list-bullet3 li { background-position: -280px -197px; }
ul.list-bullet4 li { background-position: -260px -217px; }
ul.list-bullet5 li { background-position: -240px -237px; }
ul.list-star1 li { background-position: -220px -257px; }
ul.list-star2 li { background-position: -200px -277px; }
ul.list-star3 li { background-position: -180px -297px; }
ul.list-plus li { background-position: -160px -317px; }
ul.list-minus li { background-position: -140px -337px; }
ul.list-pointer li { background-position: -120px -357px; }
ul.list-style1 li { background-position: -100px -377px; }
ul.list-check li { background-position: -80px -397px; }
ul.red li { background-image:url("../images/bullets/list_red.png"); }
ul.green li { background-image:url("../images/bullets/list_green.png"); }
ul.blue li { background-image:url("../images/bullets/list_blue.png"); }
ul.yellow li { background-image:url("../images/bullets/list_yellow.png"); }
ul.magenta li { background-image:url("../images/bullets/list_magenta.png"); }
ul.cyan li { background-image:url("../images/bullets/list_cyan.png"); }
ul.orange li { background-image:url("../images/bullets/list_orange.png"); }
ul.black li { background-image:url("../images/bullets/list_black.png"); }
ul.pink li { background-image:url("../images/bullets/list_pink.png"); }
ul.navy li { background-image:url("../images/bullets/list_navy.png"); }
ul.gray li { background-image:url("../images/bullets/list_gray.png"); }
ul.bullet-check li { background: transparent url("images/bullets/check.gif") no-repeat 0 5px; list-style:none; padding-left:25px; }
ul.bullet-check { padding:0;}
ul.list-tree li { background-position: -340px -137px; }
ul.list-tree ul { border-left:1px solid #aaa; margin-left:20px; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Pricing Table used in (hosting_template.html)
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.pricetable{
position: relative;
clear:both;
z-index:0;
width:100%;
margin:20px auto;
}
.pricetable .pricinginner { padding:20px 5px; }
.pricetable .block{
float:left;
position:relative;
z-index:3;
width:25%;
height:100%;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
-webkit-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.1);
}
.pricetable .block.active {
position:relative;
z-index:4;
-webkit-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.2);
box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.2);
}
.pricetable .pricebox { padding:20px 0; }
.pricetable .pricetag { width:100%; background:#4d4d4d; text-align:center; color:#ffae00; padding:10px 0; }
.pricetable .pricetag .price { font-size:16px; }
.pricetable .pricetag .rate { font-size:35px; font-weight:bold; line-height:34px; vertical-align:top; }
.pricetable h2 { text-align:center; }
.pricetable .pt_desc { margin:20px 20px 20px 20px; color:#656565; font-size:13px; }
.pricetable .pt_desc ul { margin:0; padding-bottom:10px; }
.pricetable .pt_desc ul li { line-height:32px; }
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Toggles
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.simpletoggle {
position:relative;
margin:0;
padding:8px;
border-bottom:1px solid #dddddd;
}
.simpletoggle .toggleinside { padding-left:30px;}
.simpletoggle .toggle,
.fancytoggle .toggle {
display:block;
padding:8px 30px;
background:url(../images/arrow_close.png) 0 center scroll no-repeat;
}
span.toggle a {
display: block;
text-transform: normal;
text-decoration: none;
}
span.active {
display:block;
background: url(../images/arrow_open.png) 0 center scroll no-repeat;
}
span.active a:link { color:#666; display:block;}
.toggle_content { clear:both; margin:0px; }
.toggleinside { padding:10px;}
span.toggle { display:block; margin-bottom:0; }
.fancytoggle {
position:relative;
margin:5px 5px 20px 5px;
border:1px solid #fff;
-webkit-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);
}
.fancytoggle span.toggle { background:#fafafa url(../images/arrow_close.png) 10px center scroll no-repeat; padding:10px 10px 10px 40px; margin-bottom:-1px; border-bottom:1px solid #ddd; }
.fancytoggle span.active { background:#fafafa url(../images/arrow_open.png) 10px center scroll no-repeat; }
.fancytoggle .toggle_content { position:relative; }
.fancytoggle .toggleinside { padding:15px}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Form validation Results
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.input_small { width:25% !important; }
.input_medium { width:50% !important; }
.input_large { width:90% !important; }
#validate_form label.error { border:none; }
#validate_form .error { color: red; border: 1px solid red; }
div#note,
div#result {
position:relative;
}
.close_note {
position: absolute;
top: 18px;
right: 10px;
font-size:9px;
}
div#note p,
div#result p {
margin-bottom:0;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* Contact Form
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.sysform input, textarea {
padding: 6px;
outline: 0;
width: 75%;
border:1px solid #ddd;
-webkit-box-shadow: inset 0px 0px 2px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0px 0px 2px 2px rgba(0, 0, 0, 0.05);
box-shadow: inset 0px 0px 2px 2px rgba(0, 0, 0, 0.05);
-webkit-border-radius:2px;
-moz-border-radius:2px;
border-radius:2px;
}
.sysform .checkbox {
padding: 6px;
outline: 0;
width: 25px;
border: 10px solid #ddd;
height: 25px;
color: #146008;
}
.sysform label { float: left; width: 15em; margin-right: 1em; color: #FC0A0E; }
.sysform .aankdt { width: 250px;}
#kaozastita {
display:none;
}
.sysform select, textarea {
padding: 6px;
color:#2651AA;
outline: 0;
width: auto;
border:1px solid #ddd;
-webkit-box-shadow: inset 0px 0px 2px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0px 0px 2px 2px rgba(0, 0, 0, 0.05);
box-shadow: inset 0px 0px 2px 2px rgba(0, 0, 0, 0.05);
-webkit-border-radius:2px;
-moz-border-radius:2px;
border-radius:2px;
}
.sysform textarea {
width: 93%;
height: 150px;
line-height: 150%;
}
.sysform p {
margin-bottom: 10px;
color: #2F2F2F;
}
.sysform input:hover, .sysform textarea:hover,
.sysform input:focus, .sysform textarea:focus {
border-color: #C9C9C9;
-webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 5px;
}
.sysform .form label {
margin-left: 10px;
color: #2651AA;
}
.sysform .submit input {
width: auto;
padding: 5px 15px;
background: #0A89D9;
border: 0;
color: #FFFFFF;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
}
.sysform-input input,
.sysform-textarea textarea,
.sysform-checkbox checkbox,
.sysform-select select {
width:100%;
padding:6px;
outline:none;
border: rgba(0, 0, 0, .1) 1px solid;/* Safari 4+, Chrome, FF3.5+ */
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}
.sysform-input label { display:block; float:left; margin:0px; }
#footer .sysform { font-size:11px; }
#footer .sysform input.txt,
#footer .sysform textarea,
#footer .sysform select { width:94%; font-size:11px; }
#footer .sysform input.txt { width:55%; }
#sidebar .sysform input.txt { width:55%; color:#999;}
#sidebar .sysform textarea { color:#999;}
#boxed #wrapper .pagemid .maincontent #main article .port_img .post_slider figure {
text-align: center;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* rotatio-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
#rotata {
position: relative;
width: 300px;
height: 300px;
margin: auto;
-moz-transform: rotateX(55deg);
-webkit-transform: rotateX(55deg);
transform: rotateX(55deg);
}
.eachBit {
font-size:30px;
color: #ffffff;
width: 200px;
height: 200px;
position: absolute;
background-color: #fff;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
transition-property: all;
-moz-transition-property: all;
-webkit-transition-property: all;
}
.eachBit img {
width: 100%;
height: 100%
}
.rotateBackRotata, .rotateForwardRotata {
top: 50%;
position: absolute;
background-color: rgba(0,0,0,0.8);
width: 70px;
height: 70px;
border-radius: 100%;
-moz-border-radius: 100%;
-webkit-border-radius: 100%;
padding: 0;
margin: 0;
text-align: center;
color: #ffffff;
font-weight: bold;
font-family: Verdana, Geneva, sans-serif;
font-size: 35px;
border: 1px solid rgba(255,255,255,0.3);
cursor: pointer;
}
.rotateBackRotata {
left: -100px;
}
.rotateForwardRotata {
right: -100px;
}
.pagemid .maincontent #main .inner .content #apDiv1 #specificatie tr {
}
.pagemid .maincontent #main .inner .content #apDiv1 #specificatie tr td {
background-color: #9DCEFF;
}
#thumbwrap {
position:relative;
margin:75px auto;
width:252px; height:252px;
}
.thumb img {
border:1px solid #000;
margin:3px;
float:left;
}
.thumb span {
position:absolute;
visibility:hidden;
}
.thumb:hover, .thumb:hover span {
visibility:visible;
top:0; left:250px;
z-index:1;
}
#histlijst tr td {
text-align: left;
font-weight: normal;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* test zelf
. = class
# = ID
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.test {
color: #F03;
box-shadow: #999;
}
.tableself {
color: #999;
box-shadow: #999;
background-color: #fff;
text-align:left;
}
#tableself {
border:#006;
border-bottom-style:dashed;
border-width:2px;
color:#36C;
padding-bottom:20px;
}
table.tableself tr:hover td {
background-color: #CCC;
color: #000;
}
/* ---------------------------------------------------------------------- */
/* Portfolio
/* ---------------------------------------------------------------------- */
#portfolio-items-filter {
float: right;
margin: -65px 0 0;
overflow: hidden;
}
.no-js #portfolio-items-filter { display: none; }
#portfolio-items-filter li {
display: block;
float: left;
list-style: none;
margin: 0;
}
#portfolio-items-filter li:first-child {
margin-top: 5px;
margin-right: 5px;
}
.ie7 #portfolio-items-filter li:first-child { display: none !important; }
#portfolio-items-filter a {
background: #f15a23;
color: #fff;
cursor: pointer;
display: block;
margin: 0 0 5px 5px;
padding: 5px 10px;
}
.ie7 #portfolio-items-filter a {
display: block !important;
margin: 0 0 5px 5px !important;
padding: 5px 10px !important;
width: auto !important;
}
#portfolio-items-filter a:hover { background: #3a3a3a; }
#portfolio-items { margin: 0 -20px 40px 0; }
#portfolio-items article {
margin-bottom: 50px;
}
#portfolio-items .project-meta {
display: block;
margin: 0;
padding: 20px 0 0;
}
/* Isotope */
.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1;
}
.isotope, .isotope .isotope-item {
-webkit-transition-duration: 0.6s;
-moz-transition-duration: 0.6s;
-ms-transition-duration: 0.6s;
-o-transition-duration: 0.6s;
transition-duration: 0.6s;
z-index: 2;
}
.isotope {
-webkit-transition-property: height, width;
-moz-transition-property: height, width;
-ms-transition-property: height, width;
-o-transition-property: height, width;
transition-property: height, width;
}
.isotope .isotope-item {
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
-ms-transition-property: top, left, opacity;
-o-transition-property: top, left, opacity;
transition-property: transform, opacity;
}
/* Clearfix
.clear1{clear:both;display:block;height:0;overflow:hidden;visibility:hidden;width:0}.clearfix1:after{clear:both;content:' ';display:block;font-size:0;height:0;line-height:0;visibility:hidden;width:0}* html .clearfix1,:first-child+html .clearfix1{zoom:1}*/
/* zelf knutsel */
.widgetcenter {
color: #F00;
font-weight: bold;
alignment-adjust: central;
text-align: center;
}
.contentself {
padding-bottom: 20px;
font-family: Roboto, Roboto, sans-serif;
font-size: 14px;
font-style: italic;
font-weight: normal;
color: #2651AA;
}
#register {
width: 25%;
background-color: #066;
color: #FFF;
font-size: 14px;
text-align: center;
line-height: normal;}
#message {
width: auto;
color: #CB1341;
font-size: 14px;
text-align: left;
padding-top: 20px;
padding-bottom: 20px;
padding-left: 10px;
padding-right: 10px;
border-radius: 8px;
border: 2px dashed #2651AA;
clear: both;
}
#message a {
color:#2651AA;;
}
#register a {
width: 25%;
background-color: #066;
color: #FFF;
font-size: 14px;
text-align: center;
padding-left:5px;}
.button green {
background-color:rgba(16,126,39,1.00);
}
.formbackground {
background-color: #fff;
padding-left: 15px;
width: auto;
background-size: 100%
;
color: #2651AA;
}
#artikelkaart {
color: rgba(147,142,143,1.00);
text-align: center;
z-index: 2;
-webkit-align-self: center; /* Safari 7.0+ */
align-self: center;
}
#adreskaart {
color: rgba(147,142,143,1.00);
text-align: center;
z-index: 2;
-webkit-align-self: center; /* Safari 7.0+ */
align-self: center;
}
#adreskaart p {
color: rgba(147,142,143,1.00);
text-align: center;
-webkit-align-self: center; /* Safari 7.0+ */
align-self: center;
font-size: 12px;
}
#knop {
width: 150px;
color: #fff;
background-color: #1D6E26;
text-align: center;
margin-bottom: 10px;
height: 100%;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
}
#knopL {
width: 150px;
height: 60px;
color: #Fff;
background-color: goldenrod;
text-align: center;
margin-bottom: 10px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
margin: 0 auto;
position: relative;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
}
#knopL p {
line-height: 1.1;
}
#knopR {
width: 150px;
height: 60px;
color: #ffffff;
background-color: #4CAF50;
text-align: center;
margin-bottom: 10px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
margin: 0 auto;
position: relative;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
}
#activate {
width: 150px;
height: 60px;
color: #ffffff;
background-color: #4CAF50;
text-align: center;
margin-bottom: 10px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
margin: 0 auto;
position: relative;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
}
#deactivate {
width: 150px;
height: 60px;
color: #ffffff;
background-color: #4CAF50;
text-align: center;
margin-bottom: 10px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
margin: 0 auto;
position: relative;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
}
#knopL_rd {
width: 150px;
height: 60px;
color: #Fff;
background-color: rgba(252,10,14,1.00);
text-align: center;
margin-bottom: 10px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
margin: 0 auto;
position: relative;
}
#knop a {
color:#Fff;
}
#knopL a {
color:#Fff;
}
#knopR a {
color:#Fff;
}
#knopL_rd a {
color:#Fff;
}
.img-zoom {
width: 100%;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
z-index:2;
}
.transition {
-webkit-transform: scale(1.3);
-moz-transform: scale(1.3);
-o-transform: scale(1.3);
transform: scale(1.3);
z-index:2;
}
.imgsmall {
width:95%;
margin-bottom: 25px;
box-shadow: 2px 2px 4px rgba(70, 70, 70, 0.6);
border: 2px solid white;
}
#artikelkaart .text {
position: absolute;
bottom: 1px;
left: 0px;
visibility: hidden;
}
#artikelkaart:hover .text {
visibility: visible;
color: # 525050;
position: absolute;
left: 0px;
right: 0px;
padding-top: 12px;
padding-right: 12px;
padding-left: 12px;
padding-bottom: 10px;
background:rgba(00,00,00,0.5);
text-decoration: none;
text-align: center;
width: 75%;
margin-bottom: 25px;
font-size: 10px;
font-family: "Roboto", Verdana, sans-serif;
border-radius: 10px;
}
.stylecolours {
width:100%;
}
.stylecolours img {
/*filter: blur(4px);*/
}
.blocks {
width:20%;
}
#registreer {
width: auto;
}
.grayscale {
-webkit-filter: grayscale(100%) brightness(100%) contrast(100%);
}
.sepia {
-webkit-filter: sepia(100%);
}
.artgrpsub {
font-size: 16px;
padding-top: 5px;
background-color: darkgoldenrod;
color: #FFFFFF;
height: 35px;
border-bottom: thin solid darkgoldenrod;
margin-bottom: 7px;
}
.artgrpsub2 {
padding-top: 5px;
padding-bottom: 15px;
border-top: thin solid #050C0F;
margin-bottom: 7px;
}
.artgrpsub2 img {
max-width: 250px;
}
@media only screen and (max-width: 768px){
.artgrpsub2 img {
max-width: 150px;
}
}
#artikelkaart h3 { font-size: 18px; margin: 0 0 15px 0; color:#2651AA; text-align:center}
#artikelkaart p { font-size: 12px; margin: 0 0 15px 0; color:#C60; text-align:center}
#klantlogo {
text-align: center;
}
#klantimage {
width:50%;
}
#artikelkaart #emailimage {
width:20px;
}
#artikelkaart a h14 {
font-size:14px;
font-variant:small-caps;
text-transform:lowercase;
}
#artikelkaart a:hover {
color: #FFFFFF;
}
#artikelkaart a {
color: white;
}
#artikelkaart .btnBBS a {
color: #85144b;
}
#artikelkaart .btnBBS p {
color:#D40609;
}
.button_extern {
display: inline-block;
height: 50px;
padding-right: 15px;
padding-left: 15px;
position: relative;
background-color:rgb(41,127,184);
color:rgb(255,255,255);
text-decoration: none;
/*text-transform: uppercase;*/
letter-spacing: 1px;
margin-bottom: 5px;
/*border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
text-shadow:0px 1px 0px rgba(0,0,0,0.5);
-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true)";zoom:1;
filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true);
-moz-box-shadow:0px 2px 2px rgba(0,0,0,0.2);
-webkit-box-shadow:0px 2px 2px rgba(0,0,0,0.2);
box-shadow:0px 2px 2px rgba(0,0,0,0.2);
-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true)";
filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true);*/
}
.button_extern.green {
background: #1D6E26;
color:#fff;
}
.button_extern.red {
background:#F70303;
}
#eco{
width: 35%;
float: right;
align-content: center;
border-radius: 5px;
left: 20%;
}
#eco img {
width:50%;
margin-left:20%;
}
img.ecoleft {
float: left;
margin-top: 0.1em;
margin-right: 0.5em;
margin-left: 0.2em;
margin-bottom: 0.5em;
border: 2px solid #999;
clear: left;
width: 100%;
height: auto;
max-width:480px;
}
img.ecoright {
float: right;
margin-top: 0.1em;
margin-right: 0.5em;
margin-left: 0.2em;
margin-bottom: 0.5em;
border: 2px solid #999;
clear: left;
width: 100%;
height: auto;
max-width:480px;
}
.pws {
/*writing-mode: tb-rl;
writing-mode: sideways-lr;*/
text-align: right;
width: 150px;
height: 60px;
background-image: url(../images/knoppen/basket.png);
position: fixed;
top: 2px;
z-index: 3000;
border-width: 1px;
border-color: #525050;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
color: #FFF;
font-size: 16px;
right: 10.5%;
padding-top: 5px;
}
.pws a {
color:#F4F9FB;
}
.pws p {
color:#FFF;
}
.pws1 {
float: right;
text-align: center;
width: 150px;
height: 30px;
background-color: #FD0307;
position: fixed;
top: 72px;
z-index: 3000;
border-width: 1px;
border-color: #525050;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
color: #F4F9FB;
font-size: 16px;
/*margin-left: 45%;
margin-right:45%;*/
right: 10.5%;
}
.pws1 a {
color:#F4F9FB;
}
.pws1 p {
color:#F4F9FB;
font-size: 16px;
}
.pws2 {
float: right;
text-align: center;
width: 150px;
height: 30px;
background-color:#146008;
position: fixed;
top: 105px;
z-index: 3000;
border-width: 1px;
border-color: #525050;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
color: #F4F9FB;
font-size: 16px;
/*margin-left: 45%;
margin-right:45%;*/
right:10.5%;
}
.pws2 a {
color:#F4F9FB;
}
.pws2 p {
color:#FFF;
font-size: 16px;
}
.pws3 {
float: right;
text-align: center;
width: 150px;
height: 30px;
background-color: #0090E3;
position: fixed;
top: 140px;
z-index: 3000;
border-width: 1px;
border-color: #525050;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
color: #F4F9FB;
font-size: 16px;
/*margin-left: 45%;
margin-right:45%;*/
right:10.5%;
}
.pws3 a {
color:#F4F9FB;
}
.pws3 p {
color:#FFF;
font-size: 16px;
}
.pws4 {
float: right;
text-align: center;
width: 150px;
height: 30px;
background-color:hsla(43,100%,40%,1.00);
position: fixed;
top: 10px;
z-index: 3000;
border-width: 1px;
border-color: #525050;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
color: #F4F9FB;
font-size: 16px;
/*margin-left: 45%;
margin-right:45%;*/
right:10.5%;
}
.pws4 a {
color:#F4F9FB;
}
.pws4 p {
color:#FFF;
font-size: 16px;
}
.pws5 {
float: right;
text-align: center;
width: 150px;
height: 35px;
background-color:hsla(193,74%,49%,1.00);
position: fixed;
top: 45px;
z-index: 3000;
border-width: 1px;
border-color: #525050;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
color: #F4F9FB;
font-size: 16px;
/*margin-left: 45%;
margin-right:45%;*/
right:10.5%;
}
.pws5 a {
color:#F4F9FB;
}
.pws5 p {
color:#FFF;
font-size: 16px;
}
#sales p {
color:#EC1A14;
}
#sales li {
color:#EC1A14;
}
.link a {
color:#D96211;
}
img.detail {
width: 25%;
max-width: 25%;
height: 25%;
margin-right: 50px;
margin-bottom:25px;
float: left;
position: relative;
clear: left;
}
.button_externpws {
display: inline-block;
height: 20px;
line-height: auto;
margin-top:10px;
padding-right: 30px;
padding-left: 30px;
position: relative;
background-color:rgba(255,251,251,1.00);
color:rgba(102,102,102,1.00);
text-decoration: none;
/*text-transform: uppercase;*/
letter-spacing: 1px;
margin-bottom: 2px;
border: 2px solid rgba(102,102,102,1.00);
}
.button_externpws_orange {
background:#E7772B;
}
#knopzelf {
width:100%;
margin-bottom:10px;
}
.knopzelf {
margin-bottom:10px;
max-width:60%;
}
.land {
color:#0090E3;
font-size: 24px;
padding-left: 5%;
font-style: oblique;
}
.stad p a:link {
text-transform:uppercase ;
color:rgba(102,102,102,0.80);
font-style:normal;
font-size: 12px;
}
.linearrow {
width:80%;
border-color:rgba(0,144,227,1.00);
}
/* DIT IS DE BOVENSTE LINE , oet in achtergrond kleur */
.linearrow:after {
content:'';
position: absolute;
border-style: solid;
border-width: 7px 7px 0;
border-color: #FFFFFF transparent;
display: block;
width: 0;
z-index: 1;
top: 25px;
left: 45%;
}
/* DIT IS DE onnderste LINE , zelfde kleur als class line */
.linearrow:before {
content:'';
position: absolute;
border-style: solid;
border-width: 7px 7px 0;
border-color:#0090E3 transparent;
display: block;
width: 0;
z-index: 1;
top: 26px;
left: 45%;
}
#noheader {
/* display:none;*/
}
#kleur {
align-items:center;
}
#kleur img {
height: 15px;
max-width: 15px;
border-radius: 15px;
}
#logosaccoo {
display: block;
width: 100%;
height: auto;
padding-top: 10px;
padding-right: 15px;
padding-left: 40px;
}
#koptekst {
/*background-color: rgba(255,251,251,0.30);*/
margin-bottom: 0px;
border-style: solid;
}
#koptekst p {
color: #fff;
font-weight: bolder;
font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
font-size: 18px;
line-height: inherit;
font-style: italic;
font-variant: small-caps;
}
.footerimage {
position: relative;
width: 100%; /* for IE 6 */
}
.paginaimage {
position: relative;
width: 100%; /* for IE 6 */
max-width: 450px;
clear: right;
float: right;
margin-bottom: 10px;
margin-left: 10px;
border: thin solid #6C6464;
}
.paginaimageL {
position: relative;
width: 100%; /* for IE 6 */
max-width: 450px;
clear: left;
float: left;
margin-bottom: 10px;
margin-right: 10px;
border: thin solid #6C6464;
}
h30 {
/* position: absolute; */
top: 5%;
left: 0%;
width: 100%;
}
h30 p {
/* position: absolute; */
font: bold 12px/15px Helvetica, Sans-Serif;
}
h30 span {
color: #D40609;
line-height: 45px;
font-weight: normal;
font-size: 24px;
font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
letter-spacing: 2px;
background: rgb(225,225,225);
background-color: rgba(255,251,251,1.00);
padding: 5px;
display: block;
text-align: center;
margin-bottom: 0px;
}
h301 span {
color:#FFF;
font: bold 24px/45px Helvetica, Sans-Serif;
letter-spacing: -1px;
background: rgb(52,152,219); /* fallback color */
background: rgba(52,152,219, 0.7);
padding: 5px;
display: block;
text-align:left;
margin-bottom:0px;
}
h2 span.spacer {
width:100%;
padding:0 0px;
}
h30 span a {
color:#D40609;
font: 24px/45px Helvetica, Sans-Serif;
letter-spacing: 3px;
}
h301 span p {
color: #FFF;
font: 20px/45px Helvetica, Sans-Serif;
letter-spacing: -1px;
}
#stappen {
width: auto;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 5px;
margin-left: 10px;
}
.foto_personalize img {
max-width:100%;}
.responsive-image {
max-width: 100%;
background-size: 100% 100%;
}
.personalizer {
display:none;
}
.centreer_inhoud {
margin-left: 10%;
margin-bottom: 5px;
}
.centreer_inhoudknop {
margin-bottom: 5px;
}
.pws_img img {
border: thin solid #6C6464;
}
.btnx {
background: #3498db;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
color: #ffffff;
font-size: 12px;
text-decoration: none;
text-align: center;
width: 150px;
margin-bottom: 10px;
padding: 10px,10px,10px,10px;
}
.btnxPWS {
background: #fff;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 0px #666666;
color: #000000;
font-size: 12px;
text-decoration: none;
text-align: center;
width: 150px;
padding: 10px,10px,10px,10px;
margin-left: auto;
margin-right: auto;
border: solid #949292;
border-width: 1px;
}
.btnxPWS a {
color: darkslategrey;
}
.popuptext .btnx {
background: #3498db;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
color: #ffffff;
font-size: 16px;
text-decoration: none;
text-align: center;
width: 150px;
margin-bottom: 0px;
padding: 10px,10px,10px,10px;
}
.btnx_red {
background:rgba(212,6,9,1.00);
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
font-family: Georgia;
color: #ffffff;
font-size: 20px;
padding: 10px 20px 10px 20px;
text-decoration: none;
text-align: center;
max-width: 151px;
margin-bottom: 10px;
}
.btnx.green {
background: rgba(20,96,8,1.00);
}
.btnx.green:hover {
background: rgba(20,96,8,1.00);
}
.btnx.red {
background: rgba(253,3,7,1.00);
}
.btnx.red:hover {
background: rgba(253,3,7,1.00);
}
.pagemid .maincontent .btnx a {
color: #FFF;
font-size: 20px;
}
.btnx:hover {
background: #3cb0fd;
background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
text-decoration: none;
}
#artikelkaart .btnx a {
color: #FFF;
font-size: 14px;
}
.btnshoes {
background: #FF0000;
background-image: -webkit-linear-gradient(top, #FF0000,#FF0000);
background-image: -moz-linear-gradient(top, #FF0000,#FF0000);
background-image: -ms-linear-gradient(top, #FF0000,#FF0000);
background-image: -o-linear-gradient(top, #FF0000,#FF0000);
background-image: linear-gradient(to bottom, #FF0000,#FF0000);
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
font-family: Georgia;
color: #ffffff;
font-size: 20px;
padding: 10px 20px 10px 20px;
text-decoration: none;
text-align: center;
max-width: 100%;
margin-bottom: 10px;
}
.pagemid .maincontent .btnshoes a {
color: #FFF;
font-size: 20px;
}
.btnshoes:hover {
background: #3cb0fd;
background-image: -webkit-linear-gradient(top, #FF0000,#FF0000);
background-image: -moz-linear-gradient(top, #FF0000,#FF0000);
background-image: -ms-linear-gradient(top, #FF0000,#FF0000);
background-image: -o-linear-gradient(top, #FF0000,#FF0000);
background-image: linear-gradient(to bottom, #FF0000,#FF0000);
text-decoration: none;
width: 100%;
}
#artikelkaart .btnshoes a {
color: #FFF;
font-size: 14px;
}
.btnBB {
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
font-family: Georgia;
color: #ffffff;
font-size: 14px;
text-decoration: none;
text-align: center;
max-width: 100%;
margin-left:25%;
margin-right:25%;
}
.pagemid .maincontent .btnBB a {
color: #FFF;
font-size: 14px;
}
.btnBB:hover {
background: #3cb0fd;
background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
text-decoration: none;
}
.btnBBsales {
background: #FF0000;
background-image: -webkit-linear-gradient(top, #FF0000, #DB0101);
background-image: -moz-linear-gradient(top, #FF0000, #DB0101);
background-image: -ms-linear-gradient(top, #FF0000, #DB0101);
background-image: -o-linear-gradient(top, #FF0000, #DB0101);
background-image: linear-gradient(to bottom, #FF0000, #DB0101);
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
font-family: Georgia;
color: #ffffff;
font-size: 14px;
text-decoration: none;
text-align: center;
max-width: 100%;
margin-left:25%;
margin-right:25%;
}
.pagemid .maincontent .btnBBsales a {
color: #FFF;
font-size: 14px;
}
.btnBBsales:hover {
background: #3cb0fd;
background-image: -webkit-linear-gradient(top, #DB0101, #FF0000);
background-image: -moz-linear-gradient(top, #DB0101, #FF0000);
background-image: -ms-linear-gradient(top, #DB0101, #FF0000);
background-image: -o-linear-gradient(top, #DB0101, #FF0000);
background-image: linear-gradient(to bottom, #DB0101, #FF0000);
text-decoration: none;
}
.btnBBS {
background-color:#fff;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
color: darkslategray;
font-size: 12px;
text-decoration: none;
text-align: center;
max-width: 100%;
margin-left: 15%;
margin-right: 15%;
padding-top: 5px;
padding-bottom: 5px;
border: 1px solid rgba(0,0,0,1.00);*/
}
.btnBBSout {
background-color:red;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
color: #ffffff;
font-size: 12px;
text-decoration: none;
text-align: center;
max-width: 100%;
margin-left: 15%;
margin-right: 15%;
padding-top: 5px;
padding-bottom: 5px;
/*border: 1px solid rgba(39,101,35,1.00);*/
}
.pagemid .maincontent .btnBBS a {
color:#000 ;
font-size: 12px;
}
.btnBBS a {
color:#000 ;
font-size: 12px;
}
/*.btnBBS:hover {
background-color: #FF4500;
background-image: -webkit-linear-gradient(270deg,rgba(249,104,4,1.00) 0%,rgba(243,9,13,1.00) 15.03%);
background-image: -moz-linear-gradient(270deg,rgba(249,104,4,1.00) 0%,rgba(243,9,13,1.00) 15.03%);
background-image: -ms-linear-gradient(top, #FF4500, #FF4500);
background-image: -o-linear-gradient(270deg,rgba(249,104,4,1.00) 0%,rgba(243,9,13,1.00) 15.03%);
background-image: linear-gradient(180deg,rgba(249,104,4,1.00) 0%,rgba(243,9,13,1.00) 15.03%);
text-decoration: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
} */
.btnBB_orange {
background-color: #FF4500;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #ffffff;
font-size: 12px;
text-decoration: none;
text-align: center;
width: 150px;
height: 50px;
margin-left: 15%;
margin-right: 15%;
}
.pagemid .maincontent .btnBB_orange a {
color: #FFF;
font-size: 16px;
}
.btnBB_red {
background-color: #F10606;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #ffffff;
font-size: 12px;
text-decoration: none;
text-align: center;
width: 150px;
height: 50px;
margin-left: 15%;
margin-right: 15%;
}
.knopBBdeactiveer {
width: 150px;
height: 60px;
color: #ffffff;
background-color: #FF0F2D;
text-align: center;
margin-bottom: 10px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
margin: 0 auto;
position: relative;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
}
.btnBB_red p {
padding-top: 5px;
line-height: normal;
}
.pagemid .maincontent .btnBB_red a {
color: #FFF;
font-size: 16px;
}
.btnBB_green {
background-color: #4CAF50;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #ffffff;
font-size: 12px;
text-decoration: none;
text-align: center;
width: 150px;
height: 50px;
margin-left: 15%;
margin-right: 15%;
}
.btnBB_green p {
color: #ffffff;
padding-top: 5px;
line-height: normal;
}
.pagemid .maincontent .btnBB_green a {
color: #FFF;
font-size: 16px;
}
.btnBB_blue {
background-color: #3498db;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #ffffff;
font-size: 12px;
text-decoration: none;
text-align: center;
width: 150px;
height: 50px;
margin-left: 15%;
margin-right: 15%;
padding-top: 5px;
}
.btnBB_blue p {
padding-top: 5px;
line-height: normal;
}
.pagemid .maincontent .btnBB_blue a {
color: #FFF;
font-size: 16px;
}
.details p {
color:#0C5F94;
font-size:14px;
margin-bottom: 1px;
}
.details h3 {
color:#F30307;
font-size:14px;
margin-bottom: 2px;
}
#kleur1 img {
height:30px;
max-width:30px;
margin-bottom:15px;
border-radius: 15px;
}
/*------------------------------------*\
ACCORDION
\*------------------------------------*/
/*.accordion{
width:80%;
overflow:hidden;
list-style:none;
margin-bottom:10px;
text-shadow:1px 1px 1px rgba(0,0,0,0.25);
background:blue;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-o-border-radius:10px;
border-radius:10px;
}
.accordion li{
float:left;
width:20%;
overflow:hidden;
height:100%;
-moz-transition:width 0.2s ease-out;
-webkit-transition:width 0.2s ease-out;
-o-transition:width 0.2s ease-out;
transition:width 0.2s ease-out;
-moz-transition-delay:0.15s;
-webkit-transition-delay:0.15s;
-o-transition-delay:0.15s;
transition-delay:0.15s;
}
.accordion li:first-of-type{
-moz-border-radius:10px 0 0 10px;
-webkit-border-radius:10px 0 0 10px;
-o-border-radius:10px 0 0 10px;
border-radius:10px 0 0 10px;
}
.accordion li:last-of-type{
-moz-border-radius:0 10px 10px 0;
-webkit-border-radius:0 10px 10px 0;
-o-border-radius:0 10px 10px 0;
border-radius:0 10px 10px 0;
}
.accordion div{
padding:10px;
}
.accordion:hover li{
width:100%;
}
.accordion li:hover{
width:60%;
}
.slide-01 { background:red; color:white; }
.slide-02 { background:orange; color:white; }
.slide-03 { background:yellow; color:#333; text-shadow:none; }
.slide-04 { background:green; color:white; }
.slide-05 { background:blue; color:white; }
/*------------------------------------*\
VERTICAL
\*------------------------------------*/
#vertical{
height:300px;
}
#vertical li{
float:none;
height:20%;
width:90%;
-moz-transition:height 0.2s ease-out;
-webkit-transition:height 0.2s ease-out;
-o-transition:height 0.2s ease-out;
transition:height 0.2s ease-out;
}
#vertical li:first-of-type{
-moz-border-radius:10px 10px 0 0;
-webkit-border-radius:10px 10px 0 0;
-o-border-radius:10px 10px 0 0;
border-radius:10px 10px 0 0;
}
#vertical li:last-of-type{
-moz-border-radius:0 0 10px 10px;
-webkit-border-radius:0 0 10px 10px;
-o-border-radius:0 0 10px 10px;
border-radius:0 0 10px 10px;
}
#vertical:hover li{
height:10%;
width:90%;
}
#vertical li:hover{
height:100%;
width:90%;
}
/* Fixes for the Responsive Layout */
#inside {
text-align: center;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
font-size: 18px;
}
#more {
width: 100%;
}
#more img {
display:inline;
}
#header16 img {
display: inline-block;
/*max-width: 100%;*/
height: auto !important;
height:25%;
width:25%;
}
/* meer minder knoppen */
.sp-quantity {
width:124px;
height:42px;
font-family:"ProximaNova Bold", Helvetica, Arial;
}
.sp-minus {
width:40px;
height:40px;
border:1px solid #e1e1e1;
float:left;
text-align:center;
}
.sp-input {
width:40px;
height:40px;
border:1px solid #e1e1e1;
border-left:0px solid black;
float:left;
}
.sp-plus {
width:40px;
height:40px;
border:1px solid #e1e1e1;
border-left:0px solid #e1e1e1;
float:left;
text-align:center;
}
.sp-input input {
width:30px;
height:34px;
text-align:center;
font-family:"ProximaNova Bold", Helvetica, Arial;
border: none;
}
.sp-input input:focus {
border:1px solid #e1e1e1;
border: none;
}
.sp-minus a, .sp-plus a {
display: block;
width: 100%;
height: 100%;
padding-top: 5px;
}
.selectstyle {
display: inline-block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
width: 300px;
padding: 5px 20px;
border: 1px solid #ff0000;
-webkit-border-radius: 3px;
border-radius: 3px;
/*font: normal 16px/normal "Times New Roman", Times, serif;*/
color: rgba(0,142,198,1);
-o-text-overflow: clip;
text-overflow: clip;
background: rgba(252,252,252,1);
-webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) inset;
box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) inset;
text-shadow: 1px 1px 0 rgba(255,255,255,0.66);
-webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
margin-bottom: 10px;
}
.bttn_selectstyle {
display: inline-block;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
cursor: pointer;
padding: 10px 20px;
border: 1px solid #018dc4;
-webkit-border-radius: 3px;
border-radius: 3px;
font: normal 16px/normal "Times New Roman", Times, serif;
color: rgba(255,255,255,0.9);
-o-text-overflow: clip;
text-overflow: clip;
background: #0199d9;
-webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2);
box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2);
text-shadow: -1px -1px 0 rgba(15,73,168,0.66);
-webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
-moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
-o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
margin-left: 25px;
}
#bericht {
background-color: black;
margin-bottom: 10px;
padding: 10px 10px 10px 10px;
display: none;
}
#bericht h1 {
color: #fff;
font-size: 28px;
}
#bericht p {
color: #fff;
font-size: 16px;
}
/* accodeon */
/*button.accordion {
background-color: #20B2DA;
color: #444;
cursor: pointer;
padding: 18px;
margin-bottom: 5px;
width: 100%;
border: none;
text-align: left;
outline: none;
font-size: 15px;
transition: 0.4s;
}
button.accordion.active, button.accordion:hover {
background-color: #DAA520;
}
div.panel {
padding: 0 18px;
background-color: white;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
}
*/
.storno {
color: rgba(253,3,7,1.00);
font-style: oblique;
}
.NoBackorder {
/*display: none;*/
color:darkgreen;
font-style: oblique;
}
./*accordion {
background-color: #20B2DA;
color: #fff;
cursor: pointer;
padding: 18px;
width: 100%;
border: none;
text-align: left;
outline: none;
font-size: 15px;
transition: 0.4s;
margin-bottom: 2px;
}
.active, .accordion:hover {
background-color: #DAA520;
}
.accordion:after {
content: '\002B';
color: #777;
font-weight: bold;
float: right;
margin-left: 5px;
}
.active:after {
content: "\2212";
}
.panel {
padding: 0 18px;
background-color: white;
max-height: 0;
overflow: hidden;
transition: max-height 0.4s ease-out;
}
*/
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #FD0307;
text-align: left;
opacity: 0.5;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #FD0307;
text-align: left;
opacity: 0.5;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #FD0307;
text-align: left;
opacity: 0.5;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #0E6F03;
text-align: left;
opacity: 0.5;
}
::-ms-input-placeholder { /* Microsoft Edge */
color: #0E6F03;
text-align: left;
opacity: 0.5;
}
/*-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
* knipperende teksten
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.blink {
animation-duration: 2s;
animation-name: blink;
animation-iteration-count: infinite;
animation-timing-function: steps(2, start);
color: #FD0307;
}
@keyframes blink {
80% {
visibility: hidden;
}
}
/* Popup container - can be anything you want */
/* The Modal (background) */
/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
/*overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
z-index: 6666;
}
/* Modal Content/Box */
.modal-content {
background-color: #fefefe;
margin: 15% auto; /* 15% from the top and centered */
padding: 10px;
border: 1px solid #888;
border-radius: 10px;
width: 80%; /* Could be more or less, depending on screen size */
max-width: 750px;
height: 80%;
max-height: 600px;
height: auto;
}
.modal-content ul li {
font-size: 12px;
color: crimson;
}
/* The Close Button */
.close {
color:rgba(245,7,11,1.00);
float: right;
font-size: 32px;
font-weight: bold;
padding-right: 10px;
}
.close:hover,
.close:focus {
color:chartreuse;
text-decoration: none;
cursor: pointer;
}
/* The BREXIT Close Button */
.brexclose {
color:#20B2DA;
float: right;
font-size: 28px;
font-weight: bold;
}
.brexclose:hover,
.brexclose:focus {
color: black;
text-decoration: none;
cursor: pointer;
}
.popup-container {
position: relative;
text-align: left;
color: white;
background-color:#000;
max-height: 570px;
}
.popuptext-centered {
position: absolute;
width: 80%;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
}
.popuptext-centered p {
font-style:oblique;
font-size: 16px;
color: aliceblue;
}
.popuptext-centered h1 {
font-style:oblique;
font-size: 36px;
color: aliceblue;
}
.popuptext-centered ul li {
font-style:oblique;
font-size: 16px;
color: aliceblue;
}
.rotate90 {
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
.popuptext-centered {
top: 50%;
}
}
.popuptext-centered h1 {
font-size: 16px;
font-style: oblique;
line-height: normal;
}
.popuptext-centered p {
font-size: 13px;
font-style: oblique;
line-height: normal;
}
.popuptext-centered h1 {
font-style:oblique;
font-size: 26px;
color: aliceblue;
}
.popuptext-centered ul li {
font-size: 16px;
text-align: left;
font-style: oblique;
line-height: normal;
}
.popuptext-centered a {
color: red;
}
.bbtegels {
display: block;
/*margin-left: 10%;*/
margin-right: auto;
}
.bbkop2023 {
display: block;
margin-left: 10%;
margin-right: auto;
}
/* menu bb teksten over tegels */
.one_third_hp {
width: 30%;
}
.containermenu_l {
position: right;
text-align: center;
color: white;
margin-bottom: 10px;
padding-right: 15px;
float: left;
}
.containermenu_r{
position: left;
text-align: center;
color: white;
margin-bottom: 10px;
float: right;
}
.containermenu_right {
position: right;
text-align: center;
color: white;
margin-bottom: 10px;
padding-right: 15px;
float: left;
}
/* Centered text */
.centeredmenu {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: rgba(33,150,243,0.28);
width: 100%;
height: 50px;
padding: 6px;
border: 1px solid rgba(255,251,251,1.00);
}
.pagemid .maincontent .centeredmenu a {
color: rgba(5,5,5,1.00);
font-style: normal;
font-weight: bold;
}
.centermenutext {
margin-top: 10px;
color:darkgray;
text-align: center;
}
.centermenutext a {
font-weight: bold;
color: white;
font-style: normal;
}
div.centermenutext a:hover {
color: rgba(5,5,5,0.50);
}
/* Centered text banner */
.centeredmenubanner {
position: absolute;
top: 50%;
left: 20%;
transform: translate(-50%, -50%);
background-color: rgba(255,251,251,0.50);
width: 350px;
height: 150px;
padding: 6px;
border: 1px solid rgba(255,251,251,1.00);
}
.pagemid .maincontent .centeredmenubanner a {
color: rgba(5,5,5,1.00);
font-style: normal;
font-weight: bold;
}
.centermenutextbanner {
margin-top: 5%;
color:darkgray;
}
.centermenutextbanner a {
font-weight: bold;
color: darkslategrey;
font-style: normal;
}
div.centermenutextbanner a:hover {
color: rgba(5,5,5,0.50);
}
/* menu bb teksten over Frontpage (FP) halfpage */
.centeredmenuFP {
position:relative;
top: 100%;
left: 50%;
transform: translate(-50%, -50%);
background-color:rgba(255,251,251,1.00);
width: 300px;
height: 60px;
padding: 6px;
border: 1px solid rgba(102,102,102,0.50);
font-size: 40px;
}
.pagemid .maincontent .centeredmenuFP a {
color: #FFFBFB;
font-style: normal;
font-weight: bold;
}
.centermenutextFP {
margin-top: -4%;
font-size: 40px;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
color: rgba(5,5,5,1.00);
}
.centermenutextFP a {
font-weight: 600;
font-size: 40px;
color: rgba(5,5,5,1.00);
}
div.centermenutextFP a:hover {
color: rgba(5,5,5,0.50);
}
div.centeredmenuFP:hover {
background-color:rgba(255,255,255,1.00);
}
/* menu bb teksten over HEADER (FP) */
.containermenu {
position: relative;
text-align: center;
color: white;
margin-bottom: 10px;
overflow: hidden;
}
/*.containermenu img {
border-radius: 10%;
}*/
.containermenubanner {
position: relative;
text-align: center;
color: white;
margin-bottom: 10px;
overflow: hidden;
}
.centeredmenuHD {
position: absolute;
top: 90%;
left: 50%;
transform: translate(-50%, -50%);
/*background-color: rgba(255,251,251,0.20);*/
width: 100%;
height: 100px;
padding: 6px;
/*border: 2px solid rgba(255,255,255,1.00);*font-size: 40px;*/
}
.pagemid .maincontent .centeredmenuHD a {
color: #FFFBFB;
font-style: normal;
font-weight: bold;
font-size: 40px;
}
.centermenutextHD {
margin-top: -4%;
font-size: 40px;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}
.centermenutextHD a {
font-weight: 600;
font-size: 40px;
}
.headertext {
font-weight: bold;
font-size: 40px;
text-align: center;
text-shadow: 2px 2px #666666;
}
.headertext a {
font-weight: 600;
font-size: 40px;
text-align: center;
color: aliceblue;
}
/* menu header txt aniation over pagina breed */
#headertext p {
/*margin-top: 25px;
font-size: 75px;*/
font-weight: bold;
font-size: 40px;
text-align: center;
text-shadow: 2px 2px #666666;
color: aliceblue;
text-align: center;
animation: fadein 4s;
-moz-animation: fadein 4s; /* Firefox */
-webkit-animation: fadein 4s; /* Safari and Chrome */
-o-animation: fadein 4s; /* Opera */
}
@media only screen and (max-width: 768px) {
#headertext p {
/*margin-top: 25px;
font-size: 75px;*/
font-weight: bold;
font-size: 22px;
text-align: center;
text-shadow: 2px 2px #666666;
color: aliceblue;
text-align: center;
animation: fadein 4s;
-moz-animation: fadein 4s; /* Firefox */
-webkit-animation: fadein 4s; /* Safari and Chrome */
-o-animation: fadein 4s; /* Opera */
}
}
@keyframes fadein {
from {
opacity:0;
color: black;
}
to {
opacity:1;
color: white;
}
}
@-moz-keyframes fadein { /* Firefox */
from {
opacity:0;
}
to {
opacity:1;
}
}
@-webkit-keyframes fadein { /* Safari and Chrome */
from {
opacity:0;
color: black;
}
to {
opacity:1;
color: white;
}
}
@-o-keyframes fadein { /* Opera */
from {
opacity:0;
}
to {
opacity: 1;
}
}
/* zoom in images */
#infinite-zoom {
-webkit-animation: zoomSlow 2s ;
-moz-animation: zoomSlow 2s ;
animation: zoomSlow 2s ;
animation-fill-mode: forwards;
}
/*#infinite-zoom{
-webkit-animation: zoomSlow 1s infinite linear;
-moz-animation: zoomSlow 1s infinite linear;
animation: zoomSlow 2s infinite linear;
animation-iteration-count: 1;
}*/
@-webkit-keyframes zoomSlow {
0% {
-moz-transform: scale(1);
-webkit-transform: scale(1);
transform: scale(1);
}
50% {
-moz-transform: scale(1.3) rotate(0.1deg);
-webkit-transform: scale(1.3) rotate(0.1deg);
transform: scale(1.3) rotate(0.1deg);
}
100% {
-moz-transform: scale(1);
-webkit-transform: scale(1);
transform: scale(1);
}
}
@-moz-keyframes zoomSlow {
0% {
-moz-transform: scale(1);
-webkit-transform: scale(1);
transform: scale(1);
}
50% {
-moz-transform: scale(1.3) rotate(0.1deg);
-webkit-transform: scale(1.3) rotate(0.1deg);
transform: scale(1.3) rotate(0.1deg);
}
100% {
-moz-transform: scale(1);
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes zoomSlow {
0% {
-moz-transform: scale(1);
-webkit-transform: scale(1);
transform: scale(1);
}
50% {
-moz-transform: scale(1.3) rotate(0.1deg);
-webkit-transform: scale(1.3) rotate(0.1deg);
transform: scale(1.3) rotate(0.1deg);
}
100% {
-moz-transform: scale(1);
-webkit-transform: scale(1);
transform: scale(1);
}
}
/* menu frontpage over pagina breed */
.homepage {
background-position: center center;
background-repeat: no-repeat;
background-attachment:fixed;
background-size: cover;
background-color:rgba(102,102,102,0,50);
margin-right: 5%;
}
.homepage1 {
background-image: url(../images/tegels/f2.jpg) ;
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background-color: #999;
margin-right: 5%;
}
.homepage2 {
background-image: url(../images/tegels/f3.jpg) ;
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
background-color: #999;
margin-right: 5%;
}
.homepagebackground {
width: auto;
height: auto;
/*background-image: url(../images/opacs/dark30.png);
background-repeat: repeat;*/
}
.homepagetxt {
/*background-color: rgba(102,102,102,0.50);*/
margin-left: 5%;
margin-right: 10%;
padding-top: 25px;
padding-bottom: 20px;
}
.homepagetxt p {
color:#333333;
margin-left: 15px;
}
.homepagetxt h1 {
color:rgba(212,6,9,1.00);
margin-left: 15px;
}
.homepagetxt h2 {
color:rgba(0,0,0,0.50);
margin-left: 13px;
}
.texthome {
margin-left: 10px;
padding-top: 20px;
padding-left: 10px;
}
.texthome_l {
margin-right: 10px;
margin-left: 10px;
padding-top: 20px;
padding-left: 10px;
}
.texthome h2 {
color:rgba(212,6,9,1.00);
}
.texthome_l h2 {
color:rgba(212,6,9,1.00);
}
.texthome h3 {
color: #144383;
font-weight: bold;
}
.texthome_l h3 {
color: #144383;
font-weight: bold;
}
.register {
text-align: right;
}
.register a {
color: rgba(212,6,9,1.00);
font-size: 18px;
}
.text_who h1 {
color: #D40609;
}
.text_who h2 {
color: #333333;
}
.half_modal {
width: 47.5%;
border-right: 0px solid rgba(43,42,42,1.00);
}
.half_modal {
position: relative;
display: inline;
float: left;
margin-right: 1%;
alignment-adjust: middle;
margin-left: 0%;
color: #006;
font-size: 14px;
border-right: 0px solid rgba(43,42,42,1.00);
}
.modal-content .btnBB_blue {
background-color: hsla(43,100%,40%,1.00);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #ffffff;
font-size: 12px;
text-decoration: none;
text-align: center;
width: 150px;
height: 55px;
margin: auto;
padding-top: 10px;
left: 50%;
right: 20%;
}
.modal-content .btnBB_blue p {
margin-top: 15px;
color: rgba(43,42,42,1.00);
}
.modal-content .btnBB_blue a {
padding-top: 15px;
color: #ffffff;
}
.aanbieding p {
color: rgba(212,6,9,1.00);
font-size: 18px;
font-style: oblique;
font-weight: bold;
text-shadow: 1px 1px rgba(43,42,42,1.00);
}
/* popup screen */
#overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000;
filter:alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
z-index: 100;
display: none;
}
.cnt223 a{
text-decoration: none;
}
.popup{
width: 100%;
margin: 0 auto;
display: none;
position: fixed;
z-index: 101;
}
.cnt223{
min-width: 300px;
max-width: 450px;
width: 100%;
height: 100%;
min-height: 150px;
margin: 100px auto;
background: #f3f3f3;
position: relative;
z-index: 103;
padding: 15px 35px;
border-radius: 5px;
box-shadow: 0 2px 5px #000;
max-height: 650px;
}
.cnt223 p{
clear: both;
color: #555555;
/* text-align: justify; */
font-size: 20px;
font-family: sans-serif;
}
.cnt223 p a{
color: #d91900;
font-weight: bold;
}
.cnt223 .x{
float: right;
height: 35px;
left: 22px;
position: relative;
top: -25px;
width: 34px;
}
.cnt223 .x:hover{
cursor: pointer;
}
#vakantie {
color: #F7EFEF;
font-weight: bold;
padding-left: 5px;
background-image: url(../images/vakantie/2018.jpg);
background-size: cover;
border: medium solid #A6A6A6;
}
#vakantie h1 {
color: #F7EFEF;
font-weight: bold;
}
#vakantie p {
color: #F7EFEF;
font-weight: bold;
}
#vakantie ul {
color: #F7EFEF;
font-weight: bold;
}
.new {
margin-bottom: 15px;
}
.new img {
border: 5px solid #434343;
}
/* hide / show in formulier klachten voorraad */
#klachtstock {
display:none;
}
#klachtrepair {
display:none;
}
#adres_a {
display:none;
}
#formbackgr {
background-color:rgba(133,168,240,0.20);
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
#formbackgr1 {
background-color:rgba(253,253,253,1.00);
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
/* formulier klachten results */
#klacht_form_res .one_half {
color: rgba(9,18,90,1.00);
font-style: italic;
font-size: 20px;
}
.magsluit {
width: 100%;
background-color:rgba(14,38,94,1.00);
color:rgba(253,253,253,1.00);
padding-left: 5%;
padding-top: 2px;
}
.magsluit {
display:none;
}
.magsluit p {
color:rgba(253,253,253,1.00);
}
.marge5 {
padding-left:2%;
padding-right: 2%;
}
.backorder p {
text-align: center;
font: normal;
font-size: 10px;
}
.EstDelTime {
text-align: center;
font: normal;
font-size: 10px;
color: rgba(63,117,243,1.00);
}
.EstDelTime p {
text-align: center;
font: normal;
font-size: 10px;
color: rgba(63,117,243,1.00);
margin-bottom: 10px;
}
.EstDelTime h1 {
text-align: center;
font: normal;
font-size: 13px;
color: rgba(63,117,243,1.00);
}
#pageprint {
display: none;
}
.kleurruimte {
margin-right: 1px;
margin-left: -3px;
}
.aktiecode {
border: thin dotted #F8060A;
padding: 10px;
}
.aktiecode p {
color:#120E0E;
}
.artkop {
background-color: white;
color:cadetblue;
font-weight: bold;
}
.eco {
text-align: center;
padding-left: 5%;
float: none;
}
.header-img {
width: 100%;
height: 400px;
background: url('https://www.saccoo.com/assets/images/header_saccoo_BB.png');
background-size: cover;
}
input[type=submit] {
width="100px";
background-color: red;
border: none;
color: white;
padding: 16px 32px;
text-decoration: none;
margin: 4px 2px;
/*cursor: pointer;*/
font-size: 14px
}
.cancelemailknop input[type=submit] {
background: #3498db;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
color: #ffffff;
font-size: 16px;
text-decoration: none;
text-align: center;
width: 150px;
margin-bottom: 10px;
padding: 10px,10px,10px,10px;
}
.btnbsktchange {
width: 100px;
background-color: #4CAF50;
border: none;
color: white;
padding: 16px 32px;
text-decoration: none;
margin: 4px 2px;
font-size: 14px
/*cursor: pointer;*/
}
.pagemid .maincontent .btnbsktchange {
color: white;
font-weight: lighter;
font-size: 14px;
}
.imagezoom {
overflow: hidden; /* importante */
float: left;
}
.imagezoom img {
transition: all 2s;
width: 90%;
height:90%;
}
.imagezoom:hover img {
transform: scale(1.9);
}
.fa {color:red;
font-size: 25px;
}
/*.pws_reseller {
display: none;
}*/
.pws_reseller {
display: block;
writing-mode: vertical-rl;
transform: rotate(180deg);
text-align: center;
width: 40px;
height: 150px;
background-color: red;
color:white;
position: fixed;
top: 300px;
z-index: 9999;
border: 1px solid hsla(180,20%,50%,1.00);
padding-left: 35px;
}
.pws_aanbieding {
display: block;
writing-mode: vertical-rl;
transform: rotate(-90deg);
text-align: center;
width: 300px;
background-color: hsla(0,22%,96%,0.30);
height: 100px;
position: fixed;
top: 300px;
z-index: 9999;
border: 0px solid hsla(180,20%,50%,1.00);
}
.pws_reseller {
display: block;
writing-mode: vertical-rl;
transform: rotate(180deg);
text-align: center;
width: 40px;
height: 150px;
background-color: red;
position: fixed;
top: 300px;
z-index: 9999;
border: 1px solid hsla(180,20%,50%,1.00);
padding-left: 35px;
}
.pws_verkoop {
display: block;
writing-mode: vertical-rl;
transform: rotate(360deg);
text-align: center;
/*width: 40px;
height: 150px;
background-color: red;*/
color:white;
position: fixed;
/*top: 300px;*/
bottom: 5%;
left: -15px;
z-index: 9999;
/*border: 1px solid hsla(180,20%,50%,1.00);*/
padding-left: 35px;
}
.one_sixth .history p {
font-size: 12px;
line-height: normal;
text-align: center;
}
.one_sixth a {
color: red;
}
.one_sixth a:hover {
color: blue;
}
.one_sixth a:visited {
color: green;
}
.history td p {
font-size: 12px;
line-height: normal;
text-align: center;
}
/* zipfile history */
.thumb {
margin-top: 5px;
box-shadow: 2px 2px 4px rgba(70, 70, 70, 0.6);
border: 2px solid white;
}
.thumb:hover {
box-shadow: 3px 3px 6px rgba(70, 70, 70, 0.8);
cursor: pointer;
}
.thumbChecked {
box-shadow: 2px 2px 4px rgba(70, 70, 70, 0.6);
}
.download {
margin-top: 20px;
display: none;
margin: 0 auto;
}
/* popup text container - can be anything you want */
.popuptext {
position: relative;
display: inherit;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background: #3498db;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
color: #ffffff;
font-size: 16px;
text-decoration: none;
text-align: center;
width: 150px;
margin-bottom: 10px;
}
/* The actual popuptext */
.popuptext .popuptexttext {
visibility: hidden;
width: 200px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 3px 3px 3px 3px;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -80px;
}
/* popuptext arrow */
.popuptext .popuptexttext::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
}
/* Toggle this class - hide and show the popuptext */
.popuptext .show {
visibility: visible;
-webkit-animation: fadeIn 1s;
animation: fadeIn 1s;
}
/* popup text container - can be anything you want */
.popuptext2 {
position: relative;
display: inherit;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
/*background: #3498db;*/
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
color: #ffffff;
font-size: 16px;
text-decoration: none;
text-align: center;
width: 150px;
margin-bottom: 10px;
}
/* The actual popuptext */
.popuptext2 .popuptexttext2 {
visibility: hidden;
width: 200px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 3px 3px 3px 3px;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -80px;
}
/* popuptext arrow */
.popuptext2 .popuptexttext2::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
}
/* Toggle this class - hide and show the popuptext */
.popuptext2 .show {
visibility: visible;
-webkit-animation: fadeIn 0.5s;
animation: fadeIn 0.5s;
}
.popuptext3 {
position: relative;
display: inherit;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
/*background: #3498db;*/
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0px;
text-shadow: 0px 0px 26px #666666;
color: #ffffff;
font-size: 16px;
text-decoration: none;
text-align: center;
width: 150px;
margin-bottom: 10px;
}
/* The actual popuptext */
.popuptext3 .popuptexttext3 {
visibility: hidden;
width: 200px;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 3px 3px 3px 3px;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -80px;
}
/* popuptext arrow */
.popuptext3 .popuptexttext3::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: #555 transparent transparent transparent;
}
/* Toggle this class - hide and show the popuptext */
.popuptext3 .show {
visibility: visible;
-webkit-animation: fadeIn 0.5s;
animation: fadeIn 0.5s;
}
/* Add animation (fade in the popuptext) */
@-webkit-keyframes fadeIn {
from {opacity: 0;}
to {opacity: 1;}
}
@keyframes fadeIn {
from {opacity: 0;}
to {opacity:1 ;}
}
/* image repeat imago afbeeldingen */
.row {
display: flex;
}
/* Create three equal columns that sits next to each other */
.column {
display: inline-block;
}
/* modal op de homepage */
#myImg {
border-radius: 5px;
cursor: pointer;
transition: 0.3s;
}
#myImg:hover {opacity: 0.7;}
#myImg2 {
border-radius: 5px;
cursor: pointer;
transition: 0.3s;
}
#myImg2:hover {opacity: 0.7;}
#myImg3 {
border-radius: 5px;
cursor: pointer;
transition: 0.3s;
}
#myImg3:hover {opacity: 0.7;}
#myImg4 {
border-radius: 5px;
cursor: pointer;
transition: 0.3s;
}
#myImg4:hover {opacity: 0.7;}
#img01 {
border-radius: 20px;
}
/* The Modal (background) */
.modalindex {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 999; /* Sit on top */
padding-top: 100px; /* Location of the box */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0,0.7); /* Fallback color */
background-color: rgba(0,0,0,0.7); /* Black w/ opacity */
}
/* Modal Content (image) */
.modalindex-content {
margin: auto;
display: block;
width: 80%;
max-width: 700px;
}
/* Caption of Modal Image */
#captionindex {
margin: auto;
display: block;
width: 80%;
max-width: 700px;
text-align: center;
color: #fff;
font-size:20px;
font-weight: 400;
padding: 10px 0;
height: 150px;
}
/* Add Animation */
.modalindex-content, #captionindex {
-webkit-animation-name: zoom;
-webkit-animation-duration: 0.6s;
animation-name: zoom;
animation-duration: 0.6s;
}
@-webkit-keyframes zoom {
from {-webkit-transform:scale(0)}
to {-webkit-transform:scale(1)}
}
@keyframes zoom {
from {transform:scale(0)}
to {transform:scale(1)}
}
/* The Close Button */
.closeindex {
position: absolute;
top: 15px;
right: 35px;
color: #F90004;
font-size: 40px;
font-weight: bold;
transition: 0.3s;
}
.closeindex:hover,
.closeindex:focus {
color: #F90004;
text-decoration: none;
cursor: pointer;
}
#midden {
align-content: center;
/*padding-left: 10%;*/
}
.kopregel .one_sixth {
background-color: firebrick;
color: white;
}
.poppen {
border-radius: 25px;
border:1px solid #4b8f29;
text-align: center;
}
.email {
text-align: center;
display:block;
margin-top: 150px;
}
.emailsend p {
font-size: 10px;
line-height: normal;
}
.headerfoto {
max-width: 1215px;
max-height: 370px;
}
.responsive-image-mobile{ display:none;
max-width: 100%;
background-size: 100% 100%;}
.responsive-image-hide{
display:none;
}
.responsive-image-mobile-hide{ display:none;
}
/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 768px){
.modalindex-content {
width: 90%;
}
.one_sixth_payment { width:10%; }
.responsive-image{
display:none;
max-width: 100%;
background-size: 100% 100%;
}
.responsive-image-mobile{ display:block;
max-width: 100%;
background-size: 100% 100%;}
}
.bb-logo {
margin-left:25%;
margin-right: 25%;
}
.bb-logo img {
width: 75%;
}
}