*{margin:0;padding:0;border:none;underline:none;outline:0;text-decoration:none;-webkit-font-smoothing:antialiased}body,html{background:#fcffff;font-family:Arial,sans-serif}#bespannen-logo{width:31px;height:42px;position:absolute;background:url(../img/logo.svg);background-size:cover;background-position:center;background-repeat:no-repeat;filter:drop-shadow(0 10px 14px rgba(136, 136, 254, .25));top:50px;left:64px}.navigation{width:40px;height:40px;position:absolute;background:0 0;border-radius:99px;cursor:pointer;z-index:15;margin-top:-20px;top:50%;right:20px;-webkit-transition:background .2s ease,-webkit-transform .15s ease;-moz-transition:background .2s ease,-moz-transform .15s ease;-ms-transition:background .2s ease,-ms-transform .15s ease;-o-transition:background .2s ease,-o-transform .15s ease;transition:background .2s ease,transform .15s ease}#menu-overlay{width:100%;height:100%;position:fixed;background:rgba(255,255,255,.05);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;z-index:15;display:none;top:0;left:0;-webkit-transition:opacity .3s ease;-moz-transition:opacity .3s ease;-ms-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease}#menu-overlay.visible{display:block}#menu-overlay.show{opacity:1}.navigation{width:40px;height:40px;position:absolute;background:0 0;border-radius:99px;cursor:pointer;z-index:17;margin-top:-20px;top:50%;right:20px;-webkit-transition:background .2s ease,-webkit-transform .15s ease;-moz-transition:background .2s ease,-moz-transform .15s ease;-ms-transition:background .2s ease,-ms-transform .15s ease;-o-transition:background .2s ease,-o-transform .15s ease;transition:background .2s ease,transform .15s ease}.no-mobile .navigation:hover{background:#f5f5fd}#menu-nav{top:50px;right:50px;margin-top:0}#menu-nav.bounce{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-o-transform:scale(1.1);transform:scale(1.1)}#menu-nav.hide{-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0)}.nav-holder{width:4px;height:20px;position:absolute;display:inline-block;margin-top:-10px;margin-left:-2px;top:50%;left:50%}.nav-holder .circle{width:4px;height:4px;position:absolute;background:#505050;border-radius:99px;display:inline-block;float:left;top:0;left:0;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-ms-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}.nav-holder .circle.two{top:8px}.nav-holder .circle.three{top:16px}.navigation.ani1 .nav-holder .circle.one,.navigation.ani1 .nav-holder .circle.three{top:8px}.navigation.ani2 .nav-holder .circle.two{display:none}.navigation.ani2 .nav-holder .circle.one,.navigation.ani2 .nav-holder .circle.three{width:20px;height:2px;left:-8px}.nav-holder .cross.one,.navigation.ani2 .nav-holder .circle.one{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}.nav-holder .cross.two,.navigation.ani2 .nav-holder .circle.three{-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}#menu{width:500px;height:100%;position:fixed;background:#fff;box-shadow:-30px 0 40px rgba(0,0,0,.03);z-index:16;top:0;right:-570px;-webkit-transition:right .35s ease;-moz-transition:right .35s ease;-ms-transition:right .35s ease;-o-transition:right .35s ease;transition:right .35s ease}#menu.show{right:0}#menu-holder{width:56%;height:100%;position:relative;display:table;opacity:0;margin:0 auto 0 auto;left:50px;-webkit-transition:opacity .25s ease,left .35s ease;-moz-transition:opacity .25s ease,left .35s ease;-ms-transition:opacity .25s ease,left .35s ease;-o-transition:opacity .25s ease,left .35s ease;transition:opacity .25s ease,left .35s ease}#menu-holder.show{opacity:1;left:0}#logo{width:62px;height:62px;position:absolute;background:#88f url(../img/bespannen-tennis.svg);background-size:90%;background-position:center;background-repeat:no-repeat;border-radius:22px;box-shadow:0 20px 40px rgba(136,136,254,.35);top:14%}#nav{position:absolute;margin-top:-132px;top:48%}#nav li{list-style:none;margin-bottom:26px}#nav li a{font-size:32px;color:#191919;letter-spacing:-1.4px;display:inline-block}#nav li a:after{width:0;height:1px;background:#fff;content:" ";display:table;-webkit-transition:width .35s ease;-moz-transition:width .35s ease;-ms-transition:width .35s ease;-o-transition:width .35s ease;transition:width .35s ease}.no-mobile #nav li a:hover:after{width:100%;background:#191919}.socials{position:absolute;display:table;margin-left:-6px;bottom:20%}.social{width:42px;height:42px;position:relative;border-radius:99px;float:left;margin-right:12px}.social .back{width:100%;height:100%;position:absolute;background:#eee;border-radius:99px;top:0;left:0;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-transition:-webkit-transform .25s ease;-moz-transition:-moz-transform .25s ease;-ms-transition:-ms-transform .25s ease;-o-transition:-o-transform .25s ease;transition:transform .25s ease}.social:hover .back{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}.social .icon{width:18px;height:18px;position:relative;z-index:2;margin-top:-9px;margin-left:-9px;top:50%;left:50%}.social .icon .a{fill:#b0b0c1;-webkit-transition:fill .25s ease;-moz-transition:fill .25s ease;-ms-transition:fill .25s ease;-o-transition:fill .25s ease;transition:fill .25s ease}.social.facebook .back{background:#bbccf0}.social.facebook:hover .icon .a{fill:#325192}.social.instagram .back{background:#ffc5ed}.social.instagram:hover .icon .a{fill:#d074b3}.social.whatsapp .back{background:#c6f7d8}.social.whatsapp:hover .icon .a{fill:#1ac158}#holder{width:1000px;position:relative;margin:180px auto 120px auto}.left{width:500px;display:inline-block;margin-top:150px}.right{width:380px;display:inline-block;float:right;padding-bottom:120px}h1{font-size:48px;letter-spacing:-1px;margin-bottom:12px}.contact{font-size:18px;font-weight:400;line-height:190%;color:#879798;display:inline-block;margin:16px 0 24px 0}#contact{width:100%;background:#fff;border-radius:26px;border:1px solid #f8f8ff;box-shadow:0 14px 65px rgba(136,136,254,.11);padding:22px 0 18px 0}.holder{padding:12px 32px;margin-bottom:8px}.holder p{font-size:17px;letter-spacing:.1px;color:#4e4e7b;display:block;margin-left:2px;margin-bottom:14px}input,textarea{width:100%;font-family:Averta,Arial;font-size:17px;color:#6a6aa4;letter-spacing:.2px;background:#fbfbfd;border-radius:9px;border:2px solid #ededff;border:1px solid #e0e0f7;box-sizing:border-box;padding:12px 13px;-webkit-appearance:none;-moz-appearance:none;appearance:none}input:focus,textarea:focus{border:1px solid #ddddf5}textarea{height:180px;resize:none}#verstuur{width:100%;position:relative;background:#88f;border-radius:16px;font-family:Averta;font-weight:600;font-size:17px;color:#fff;letter-spacing:.6px;text-align:center;border:none;box-shadow:0 15px 25px rgba(136,136,254,.25);box-sizing:border-box;display:table;cursor:pointer;padding:22px 48px;margin:0 auto 0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;-webkit-transition:background .3s ease,-webkit-transform .2s ease;-moz-transition:background .3s ease,-moz-transform .2s ease;-ms-transition:background .3s ease,-ms-transform .2s ease;-o-transition:background .3s ease,-o-transform .2s ease;transition:background .3s ease,transform .2s ease}#verstuur:active{-webkit-transform:scale(.95);-moz-transform:scale(.95);-ms-transform:scale(.95);-o-transform:scale(.95);transform:scale(.95)}.no-mobile #verstuur:hover{background:#7272ea}#melding{font-size:18px;color:#ff0023;text-align:center;display:block;margin-top:25px;margin-bottom:-15px}#melding.success{color:#88f}.socials{position:absolute;display:table;margin-left:-6px;bottom:20%}.left .socials{position:relative;margin-top:40px;bottom:0}.left .social{margin-right:24px}.left .social .icon{width:20px;height:20px;margin-top:-10px;margin-left:-10px}@media screen and (max-width:1600px){#holder{width:940px;margin-top:150px}.left{margin-top:100px}.right{width:370px}.holder{padding:10px 25px}.holder p{margin-bottom:10px}input,textarea{padding:11px 12px}textarea{height:160px}}@media screen and (max-width:1500px){#holder{width:920px}.left{margin-top:80px}.left .socials{margin-top:50px}.right{width:340px}.holder p{font-size:16px}input,textarea{font-size:16px;border-radius:7px;padding:9px 11px}#verstuur{border-radius:12px;padding:20px 40px}#melding{font-size:16px}}@media screen and (max-width:1230px){#menu{width:400px}#menu-holder{width:64%}#nav{margin-top:-102px}}@media screen and (max-width:1130px){#bespannen-logo{top:40px;left:50px}#menu-nav{top:44px;right:40px}h1{font-size:44px}}@media screen and (max-width:1100px){#holder{width:900px}.right{width:320px}}@media screen and (max-width:1050px){#holder{width:800px}.left{width:400px}}@media screen and (max-width:1000px){#menu{width:340px}#menu-holder{width:70%}#nav{margin-top:-92px}#nav li a{font-size:28px}}@media screen and (max-width:1000px) and (max-height:530px){#logo{display:none}#nav{margin-top:0;top:20%}}@media screen and (max-width:1000px) and (max-height:365px){.socials{bottom:10%}}@media screen and (max-width:960px){#holder{width:600px;margin-bottom:40px}.left{width:500px}.left .socials{margin-top:30px}.right{width:360px;float:unset;display:block;margin-top:70px}}@media screen and (max-width:820px){#holder{width:74%;margin-top:160px}.contact{font-size:17px}.left .social .icon{width:18px;height:18px;margin-top:-9px;margin-left:-9px}}@media screen and (max-width:710px){#holder{width:80%}.left{width:100%;margin-top:0}h1{line-height:110%}}@media screen and (max-width:620px){#bespannen-logo{width:30px;height:40px;top:46px;right:10%}#menu-nav{right:10%}h1{margin-bottom:2px}.right{margin-left:auto;margin-right:auto}#menu{width:100%;right:-110%}#nav li a{font-size:30px}}@media screen and (max-width:500px){.right{width:100%;margin-top:50px}#contact{border-radius:20px;padding:16px 0 12px 0}.holder{padding:10px 23px}#melding{margin-bottom:-10px}}@media screen and (max-width:330px){h1{font-size:34px}.contact{font-size:15px;margin:6px 0 12px 0}}
