@import url(http://fonts.googleapis.com/css?family=Play);

* {border:none;outline:none;outline-width:0;outline:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;}

html, body {padding:0;margin:0;width:100%;height:100%;}
body { background-color:#fff;font-family:Tahoma,Arial,sans-serif;font-size:1em;color:#111;cursor:default;}

a, #MenuBut {text-decoration:none;cursor:pointer;}
a:link, a:visited {color:#039;}
a:hover {color:#f60;}

a.attBut {font-family:'Play',sans-serif;display:inline-block;width:100%;text-align:center;padding:7px 13px;border:1px solid #39c;border-radius:7px;background:#03c url(../../img/b/but.gif) 0 25%;}
a.attBut:link, a.attBut:visited {color:#fff;text-shadow:-1px -1px 0 #024;}
a.attBut:hover {color:#fff;border-color:#039;text-shadow:1px 1px 1px #123;background-position:0 35%;}

h1, h2 {font-family:'Play',sans-serif;color:#06c;margin:20px 0;padding:0;}
h1 {font-size:250%;}
h2 {font-size:190%;}

hr {margin:12px 0;height:0;border:none;border-top:1px dotted #ccc;}

.leftImg {float:left;width:235px;height:147px;margin:0 15px 9px 0;}
.rightImg {float:right;width:235px;height:147px;margin:0 0 9px 15px;}
.txLeft {float:left;text-align:left;line-height:1.8em;}

#NavTop a i, #FootNav a i {float:left;width:20px;height:20px;margin:2px 9px -2px 0;background:transparent url(../../img/b/icon20.png) 0 0;}
#NavTop a {float:left;height:50px;padding:12px 15px 0 9px;margin:0 2px;font-size:110%;text-shadow:1px 1px 1px #fff;}
#NavTop a:link, #NavTop a:visited {color:#666;}
#NavTop a:hover {color:#f60;}
#NavTop a.activ {background-color:#fff;color:#06c;border:1px solid #ccc;border-bottom:none;border-radius:7px 7px 0 0;}

a#t_webdesign i {background-position:-20px -80px;}
a#t_domeinnaam i {background-position:-20px -20px;}
a#t_hosting i {background-position:-20px -100px;}
a#t_portfolio i {background-position:-20px -40px;}
a#t_support i {background-position:-20px -120px;}
a#t_contact i {background-position:-20px -60px;}

#FootNav {position:fixed;left:0;bottom:0;width:100%;height:40px;color:#ccc;background:#111 url(../../img/b/stripb.gif) 0 0;box-shadow:0 -1px 5px rgba(0,0,0,.5);z-index:8;}
#FootNav a i {margin-top:0;}
#FootNav a {display:inline-block;height:40px;padding:9px 25px 0 20px;margin:0 2px;text-shadow:-1px -1px 1px #000;}
#FootNav a:link, #FootNav a:visited {color:#ccc;}
#FootNav a:hover {color:#f60;}
#FootNav a.activ {background-color:#222;color:#fff;}

a#b_webdesign i {background-position:0 -80px;}
a#b_domeinnaam i {background-position:0 -20px;}
a#b_hosting i {background-position:0 -100px;}
a#b_portfolio i {background-position:0 -40px;}
a#b_support i {background-position:0 -120px;}
a#b_contact i {background-position:0 -60px;}

#TopTit {float:left;font-size:22pt;font-family:'Play',sans-serif;color:#ccc;text-shadow:1px 1px 1px #fff;padding:18px 0 0 30px;}
#MenuNav {background:#eee url(../../img/b/stripw.gif) 0 0;border-bottom:1px solid #ccc;}
#MenuCon, #BodyCon {width:100%;margin:0 auto;}
#MenuBut {float:right;width:20px;height:20px;margin:9px 9px 0 0;background:transparent url(../../img/b/icon20.png) -20px 0;}
#Logo {float:left;padding:0;margin:0;}
nobr {display:inline-block;white-space:nowrap;}
#footInf {font-family:'Play',sans-serif;font-size:0.8em;text-align:center;padding-bottom:70px;}
#footInf span, nobr {white-space:nowrap;}

/* -- Landscape -- */

@media screen and (min-width:1001px) {
 #MenuBut {display:none;}
 #MenuCon {position:relative;}
 #BodyCon {margin-bottom:40px;}
 #MenuNav {position:relative;height:138px;padding:7px 9px;}
 #Logo img {width:160px;height:120px;}
 #NavTop {position:absolute;left:180px;top:81px;}
 #NavTop, #FootNav {display:block !important;}
 #MenuCon, #BodyCon {width:980px;}
 #FootCon {text-align:center;}
 .txLeft {width:720px;}
}

/* -- Portrait -- */

@media screen and (max-width:1000px) {
 #MenuBut {display:block;}
 #MenuNav {width:100%;height:40px;position:fixed;left:0;top:0;box-shadow:0 1px 5px rgba(0,0,0,0.2);z-index:9;}
 #BodyCon {margin:45px auto 20px;padding:1px 9px 25px 9px;}
 #Logo {width:53px;height:39px;padding:4px 6px;}
 #Logo img {width:40px;height:30px;}
 #NavTop {position:absolute;left:0;top:39px;width:100%;display:none;background:#eee url(../../img/b/stripw.gif) 0 0;border-bottom:2px solid #ccc;}
 #NavTop a {width:100%;height:40px;padding:9px 0 0 15px;margin:0;}
 #NavTop a.activ {background-color:#eee;border:none;border-radius:0;}
 #TopTit {font-size:10pt;color:#999;padding:0;position:absolute;top:12px;left:55px;white-space:nowrap;overflow:hidden;z-index:9;}
 #FootNav {position:relative;height:auto;padding-bottom:50px;}
 #FootNav a {float:left;text-align:left;width:99%;}
 #FootNav a i {margin:2px 15px -2px -8px;}
 .leftImg, .rightImg {width:100%;height:auto;margin:9px auto;}
 .txLeft {width:auto;}
}

#popIbgr {position:fixed;left:0;top:0;width:100%;height:100%;background-color:rgba(255,255,255,0.7);z-index:999;}
div#at4-share {filter:url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");filter:gray;-webkit-filter:grayscale(100%);}
.Clear {clear:both;}
.noselect {-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;user-select:none;}