.popup{position:fixed; top:0; right:0; bottom:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.5); z-index:9999;}
.popup a{display:inline-block; height:42px; line-height:40px; font-size:12px; text-transform:uppercase; font-weight:700; padding:0 15px; margin-right:20px; color:#000; border:1px solid #000; cursor:pointer;}
.popup a:hover{opacity:0.6;}
.popup a:last-child{background:#79c75a; color:#fff; font-size:14px; border:1px solid #79c75a; margin:0;}
.popup a:last-child:hover{background:#fff; color:#79c75a; opacity:1;}
.popup .content{position:absolute; top:50%; left:50%; width:620px; background:#fff; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); -webkit-box-shadow:0px 0px 20px -3px rgba(0,0,0,0.3); box-shadow:0px 0px 20px -3px rgba(0,0,0,0.3); -webkit-animation:popup 0.3s ease-out; animation:popup 0.3s ease-out;}
.popup .content .wrapper{display:table; width:100%; padding:0 !important;}
.popup .content .left, .popup .content .right{display:table-cell;}
.popup .content .left{width:31%; background:no-repeat #fff center / contain;}
.popup .content .right{width:75%; padding:20px 24px 24px 24px; font-size:15px; line-height:24px; text-align:right;}
.popup .content .right p{margin:0; color:#79c75a; text-align:left; font-size:14px; line-height:18px;}
.popup .content .right h3{font-size:22px; line-height:32px; margin:-5px 0 5px 0; font-weight:700;}
.popup .content .right table{text-align:left; width:100%; margin:20px 0;}
.popup .content .right table tr:first-child td{border-bottom:1px solid #eee; padding-bottom:8px; font-size:14px; line-height:20px;}
.popup .content .right table tr:nth-of-type(2) td{padding-top:8px;}
/*.popup .content .right table tr:last-child td{padding-top:8px; font-size:13px; color:#aaa;}*/
.popup .content .right table tr td{padding:0; line-height:20px;}
.popup .content .right table tr td:last-child{text-align:right;}
.popup .content .right s{text-decoration:line-through; color:#aaa;}
.popup.login a{background:none; color:#000; font-size:14px;}
.popup.login a:hover{color:#aaa !important; background:none;}
.popup.login form a{float:right; background:none !important; border:0;}
.popup.login .login_melding{display:block; color:red; text-align:center; margin:-10px 0 10px;}
.popup.login .content{padding:32px 38px; width:360px; font-size:14px; line-height:28px; box-sizing:border-box;}
.popup.login .content h1{font-size:28px; line-height:28px; margin:0 0 30px;}
.popup.login .content form{float:left; width:100% !important;}
.popup.login .content input{border:0; background:#f3f3f3;}
.popup.login .content input[type=password]{margin-bottom:20px;}
.popup.login .content button{float:right; margin:0; height:40px; line-height:38px; font-size:14px; padding:0 15px; background:#000; border-radius:0; border:1px solid #000;}
.popup.login .content button:hover{background:#fff; color:#000;}
.popup.login .content .of{position:relative; float:left; width:100%; margin:40px 0 30px; color:#bbb; border-top:1px solid #eee;}
.popup.login .content .of span{position:absolute; display:inline-block; left:50%; top:-15px; padding:0 12px; margin-left:-18px; background:#fff;}
.popup.login .content .small_links{float:left; width:100%; text-align:center;}
.popup.login .content .small_links a{float:none !important; display:block; height:auto; font-size:14px !important; line-height:24px; margin:0; background:none !important; border:0;}
a.delete{position:absolute; left:auto; right:0; bottom:10px; width:16px; height:16px; background:url(/modules/webshop/img/cart/delete_black.png) no-repeat center / 16px 16px; z-index:2; opacity:0.3;}
a.delete:hover{opacity:1;}
.sure{display:none; position:absolute; top:0; left:0; right:0; height:100%; background:rgba(232, 109, 109, 0.7); z-index:2;}
.sure .text{position:absolute; left:0; top:50%; width:100%; height:16px; margin-top:-8px; font-size:15px; line-height:16px; color:#fff; text-align:center;}
.sure .text span{padding:0 2px; cursor:pointer; color:#fff;}
.sure .text span:hover{text-decoration:underline;}
.sure .text .del{display:inline-block; width:16px; height:16px; margin:-1px 10px 0 0; background:url(/modules/webshop/img/cart/delete.png) no-repeat center / 16px 16px; vertical-align:top;}
#login_form{width:50%; margin:0 auto;}
/*free product*/
.popup .content .wrapper.free_product{border-top:2px dashed #000; background:#eaf9ee;}
.popup .content .wrapper.free_product .right table{margin:10px 0 0;}
.popup .content .wrapper.free_product .right table td{border:0 !important; padding-bottom:0 !important;}

#create_form table, #create_form td, #recover_password_form table, #recover_password_form td{border:0 !important;}
#create_form td:nth-of-type(2){padding-left:20px;}

.webshop{padding:0;}
.webshop.page{padding:100px 0;}
.webshop .wrapper{display:table; width:100%;}
.webshop .cats, .webshop .products{position:relative; display:table-cell; vertical-align:top;}
.webshop .cats{width:25%; background:#f3f3f3;}
.webshop .cats .content{position:relative; float:left; width:100%; padding:70px; box-sizing:border-box; z-index:2;}
.webshop .cats h3{margin:0;}
.webshop .cats h3 em{font-style:normal;}
.webshop .cats #toggle{float:left; width:100%;}
.webshop .cats .zoeken{display:inline-block; vertical-align:top; width:100%; margin:30px 0;}
.webshop .cats input[type="search"]{height:38px; line-height:38px; padding-right:30px; margin:0; font-size:15px; background:url(/modules/webshop/img/search.png) no-repeat #fff right 12px center / 16px 16px; vertical-align:top;}
.webshop .cats ul li{line-height:38px; border-bottom:1px dotted #ccc;}
.webshop .cats ul li:last-child{border:0;}
.webshop .cats ul li a{position:relative; display:block; line-height:38px;}
.webshop .cats ul li a:hover{font-weight:700;}
.webshop .cats ul li a.active{font-weight:700;}
.webshop .products{width:75%; text-align:center;}
.webshop .topper{float:left; width:100%; padding:50px 6% 0; font-size:15px; text-align:left; box-sizing:border-box;}
.webshop .topper span{display:inline-block; width:16px; height:16px; background:url(/modules/webshop/img/check.png) no-repeat center / 16px 16px; margin:-2px 5px 0 30px; vertical-align:middle;}
.webshop .topper span:nth-of-type(1){margin-left:0;}
.webshop .topper .sort{float:right;}
.webshop .topper .sort select{padding:0 14px 0 0; margin:-4px 0 0 5px; font-size:15px; background-color:#fff !important; background-position:right center; vertical-align:middle;}
.webshop .grid{float:left; width:100%; background:none; padding:45px 3%; box-sizing:border-box;}
.webshop .item{float:left; width:33.33%; background:none; color:#000; height:auto; border-right:1px dotted #000; padding:0 3%; margin-bottom:40px; text-align:left; box-sizing:border-box;}
.webshop .item:nth-of-type(3n){border-right:0;}
.webshop .item .image{position:relative; float:left; width:100%; margin-bottom:20px;}
.webshop .item .image img{float:left; width:100%;}
.webshop .item .image em{position:absolute; top:50%; left:50%; width:24px; height:24px; margin:-12px 0 0 -22px; background:url(/img/icons/go.png) no-repeat center / cover; opacity:0; z-index:4; transition:0.3s ease;}
.webshop .item .image .bg{position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:0; z-index:3; transition:0.3s ease;}
.webshop .item .image:hover em{margin-left:-12px; opacity:1;}
.webshop .item .image:hover .bg{opacity:0.3;}
.webshop .item .info{position:relative; float:left; width:100%; max-width:100%; color:#000; bottom:auto; left:auto; min-height:88px;}
.webshop .item .titel{font-size:20px; line-height:24px;}
.webshop .price{font-size:26px; line-height:26px; margin-top:10px; font-weight:700; color:#79c75a;}
.webshop .price s{opacity:0.5;}
.webshop .price sup{font-size:18px; line-height:20px; font-weight:700;}
.webshop .price s sup{font-weight:normal;}
.webshop .price span{font-size:13px;}
.webshop a.linkbtn.to_top{background:#eee; color:#999 !important; margin-bottom:120px;}
.webshop a.linkbtn.to_top:hover{background:#ddd;}
.webshop .image, .webshop .image img{width:100%;}
.webshop .image a{position:relative; width:100%;}
.webshop .image a em{position:absolute; top:50%; left:50%; width:0; height:0; margin:0; background:url(/img/icons/add-white.png) no-repeat center / cover; opacity:0; z-index:2; transition:0.3s ease;}
.webshop .image a .bg{position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:0; z-index:2; transition:0.3s ease;}
.webshop .image a:hover em{margin:-16px 0 0 -16px; width:32px; height:32px; opacity:1; z-index:3;}
.webshop .image a:hover .bg{opacity:0.3;}
.webshop .txt{margin-top:40px;}
.webshop .shopping{margin-top:40px;}
.webshop .shopping .price{font-size:40px; line-height:40px;}
.webshop .shopping .form{margin-top:20px;}
.webshop .shopping table{width:auto;}
.webshop .shopping table td{padding:0;}
.webshop .shopping table td:nth-of-type(1){padding-right:10px;}
.webshop .shopping .linkbtn{padding-left:42px; height:54px; font-size:20px; line-height:52px; padding:0 30px 0 56px; margin-top:30px; background:url(/modules/webshop/img/bag_white.png) no-repeat #79c75a 26px 18px / 16px 16px;}
.webshop .shopping .linkbtn sup{line-height:48px; font-size:12px;}
.webshop .shopping .linkbtn:hover{padding-left:60px; color:#fff !important; background-color:#65b446;}
.webshop .details{display:block; margin-top:40px; font-size:14px; line-height:22px; color:#aaa;}
.webshop a.back{display:inline-block; margin-top:-20px; color:#aaa; font-size:14px;}

/*
.webshop.product .shipping{float:left; width:100%; padding:10px 14px; margin:0; font-size:14px; line-height:22px; text-align:center; background:#f3f3f3; z-index:2; box-sizing:border-box;}
.webshop.product .shipping span{display:inline-block; width:16px; height:16px; background:url(/modules/webshop/img/cart/shipping.png) no-repeat center left / 16px 16px; margin:-2px 5px 0 0; vertical-align:middle; -webkit-filter:brightness(0%); filter:brightness(0%);}
.webshop.product .container{display:table; width:100%;}
.webshop.product .half{display:table-cell; float:none; margin:0;}
.webshop.product .half.image{background:#f3f3f3; width:34%;}
.webshop.product .half.image a{position:absolute; top:0; left:0; width:100%; height:100%; z-index:1;}
.webshop.product .half.image a:hover{background:rgba(0, 0, 0, 0.1);}
.webshop.product .half.image img{width:100%;}
.webshop.product .half.text .inner{position:relative; width:60%; padding:100px 0 80px 90px; box-sizing:border-box;}
.webshop.product .half.text h1{width:90%; padding-right:10%;}
.webshop.product .half.text p{width:80%;}
.webshop.product .extras{border-top:2px dotted #ccc; margin-top:30px; padding-top:30px;}
.webshop.product .extras p{font-weight:normal; margin-top:20px;}
.webshop.product .extras label{margin:0; float:none;}
.webshop.product .extras label span{float:right; display:inline-block;}
.webshop.product .extras table{width:100%; margin-bottom:20px;}
.webshop.product .extras table tr:first-child td{font-weight:normal; padding-bottom:10px; border:0;}
.webshop.product .extras table tr:last-child td{border:0;}
.webshop.product .extras table td{border-bottom:1px solid #eee; padding:3px 0;}
.webshop.product .extras table td:last-child{text-align:right;}
.webshop.product .extras .less, .webshop.product .extras .more{display:inline-block; background:#f3f3f3; border-radius:6px; padding:0 8px; margin:3px 5px 0; cursor:pointer; line-height:22px;}
.webshop.product .extras .less{margin-left:0;}
.webshop.product .extras .more{margin-right:10px;}
.webshop.product .extras .less:hover, .webshop.product .extras .more:hover{background-color:#ccc;}
.related{background:#f3f3f3; text-align:center; padding:130px 0;}
.related h2{float:right; margin-right:20%; margin-bottom:70px; font-size:40px;}
.related .products{display:block; width:100%;}
.related .products .grid{padding:0 10%;}
.related .products .grid .item{background:#fff; border:0 !important; padding:0; margin:0 1% 20px; width:31.33%;}
.related .products .grid .item img{margin:0;}
.related .products .grid .item .info{padding:18px 25px; min-height:auto; box-sizing:border-box;}
.related .products .grid .item .info .prijs{font-size:24px; line-height:30px; margin:0; color:#f5600a;}
.related .products .grid .item .info .prijs s{opacity:0.5;}
.related .products .grid .item .info .prijs sup{font-size:15px; line-height:21px;}
.related .products .grid .item .info .prijs span{font-size:12px; color:#000;}
.related .products .grid .item .info .prijs em{float:right; font-size:14px;}
*/
.webshop #reminder{display:none; float:left; width:100%; padding-top:20px; margin-top:20px; border-top:1px dashed #ccc;}
.webshop #reminder h3{margin:0; font-size:22px; line-height:30px; color:#e86d6d;}
.webshop #reminder p{margin:5px 0 20px; font-size:14px; line-height:24px; height:auto;}
.webshop #reminder p.small{font-size:11px; color:#aaa; margin:7px 0 0 0;}
.webshop #reminder a{color:#000; text-decoration:underline;}
.webshop #reminder a:hover{color:#0088cc; text-decoration:underline;}
.webshop #reminder input{float:left; margin:0; font-size:14px;}
.webshop #reminder input[type=email]{width:65%; margin-right:5%;}
.webshop #reminder input[type=button]{width:30%; padding:0; font-size:18px; height:34px; line-height:31px; border: 0;}
.webshop #reminder input[type=button]:hover{color:#fff; background:#333;}
.webshop a.wishlist_btn{position:absolute; top:10px; right:0; width:32px; height:32px; background:url(/modules/webshop/img/wishlist.png) no-repeat top / 32px 32px; -webkit-filter:grayscale(100%); filter:grayscale(100%); cursor:pointer; opacity:0.3; z-index:2;}
.webshop a.wishlist_btn.okay, .webshop a.wishlist_btn:hover{-webkit-filter:grayscale(0); filter:grayscale(0); opacity:1;}
.section.thanks h1{font-size:30px; line-height:30px; margin:0 0 20px;}

/*anim*/
@keyframes popup{0%{margin-top:10px; opacity:0;}100%{margin-top:0px; opacity:1;}}
@-webkit-keyframes popup{0%{margin-top:10px; opacity:0;}100%{margin-top:0px; opacity:1;}}
/*retina*/
@media only screen and (-Webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi){
a.delete{background-image:url(/modules/webshop/img/cart/delete_black@2x.png);}
.sure .text .del{background-image:url(/modules/webshop/img/cart/delete@2x.png);}
.webshop a.wishlist_btn{background-image:url(/modules/webshop/img/wishlist@2x.png);}
.webshop .cats input[type="search"]{background-image:url(/modules/webshop/img/search@2x.png);}
.webshop .topper span{background-image:url(/modules/webshop/img/check@2x.png);}
.webshop .shipping span{background-image:url(/modules/webshop/img/cart/shipping@2x.png);}
.webshop .shopping .linkbtn{background-image:url(/modules/webshop/img/bag_white@2x.png);}
.webshop .item .image em{background-image:url(/img/icons/go@2x.png);}
.webshop .image a em{background-image:url(/img/icons/add-white@2x.png);}
}
/*responsive*/
@media screen and (max-width:1500px){
.webshop .cats .content{padding:50px;}
}
@media screen and (max-width:1300px){
.webshop .cats .content{padding:40px;}
.webshop .item{width:50%;}
.webshop .item:nth-of-type(3n){border-right:1px dotted #000;}
.webshop .item:nth-of-type(2n){border-right:0;}
}
@media screen and (max-width:1100px){
.webshop .cats .content li{white-space:nowrap;}
.webshop .topper{padding:30px 6% 0; font-size:13px;}
.webshop .topper span{margin:-2px 5px 0 10px;}
.webshop .topper span:nth-of-type(1){margin-left:0;}
.webshop .topper .sort select{font-size:13px;}
.webshop .grid{padding:40px 3%;}
}
@media screen and (max-width:990px){
.webshop .cats{font-size:15px; line-height:28px;}
.webshop .cats ul li a{font-size:15px; line-height:34px;}
.webshop .topper{padding:20px 6% 0; text-align:center;}
.webshop .topper .sort{float:left; width:100%; margin-top:14px; padding:5px 0; background:#f3f3f3;}
.webshop .topper .sort select{background-color:#f3f3f3 !important;}
.webshop .item .info{min-height:88px;}	
}
@media screen and (max-width:750px){
.popup a{float:left; padding:0 10px; margin-right:0;}
.popup a:last-child{float:right; font-size:12px;}
.popup .content{width:90%; left:5%; -webkit-transform:translate(0,-50%); transform:translate(0,-50%);}
.popup .content .left{display:none;}
.popup .content .right{width:100%; margin-left:0;}
.popup .content .right p{font-size:13px;}
.popup .content .right h3{font-size:20px; line-height:30px;}
.popup .content .right table tr:last-child td{line-height:24px;}
.popup.login .content{width:90%; padding:26px 30px;}
.popup.login .content h1{margin:0 0 20px;}
.popup.login .content a{margin:0 0 0 6px;}
#login_form, #recover_password_form, #create_form{width:100%;}
#login_form td, #recover_password_form td, #create_form td{display:block; width:100%; padding:0;}
#create_form td:nth-of-type(2){padding-left:0;}
.webshop.page{padding:40px 0;}
.webshop.page .container{width:82%;}
.webshop .wrapper{float:left; display:block;}
.webshop .cats, .webshop .products{float:left; display:block; width:100%;}
.webshop .cats .content{float:left; width:100%; padding:14px 24px; overflow:hidden;}
.webshop .cats h3{position:relative; font-size:20px; line-height:30px; cursor:pointer;}
.webshop .cats h3 span{position:absolute; content:""; right:0; top:14px; width:16px; height:2px; background:#000; transition:0.3s ease; -webkit-animation:show_prodcat 0.3s ease 1s 1 both; animation:show_prodcat 0.3s ease 1s 1 both;}
.webshop .cats h3 span:nth-of-type(1){-webkit-transform:rotate(0deg); transform:rotate(0deg);}
.webshop .cats h3 span:nth-of-type(2){-webkit-transform:rotate(90deg); transform:rotate(90deg);}
.webshop .cats h3.active span:nth-of-type(1){-webkit-transform:rotate(45deg); transform:rotate(45deg);}
.webshop .cats h3.active span:nth-of-type(2){-webkit-transform:rotate(-45deg); transform:rotate(-45deg);}
.webshop .cats #toggle{display:none;}
.webshop .cats ul li a{font-size:16px; line-height:36px;}
.webshop .cats .zoeken{margin:10px 0 16px;}
.webshop .topper{padding:20px 6% 0; font-size:11px; line-height:12px; text-align:center;}
.webshop .topper span{width:10px; height:10px; background-size:10px 10px; margin:-1px 2px 0 4px;}
.webshop .topper .sort{padding:8px 0;font-size:13px;}
.webshop .grid{padding:20px 3%;}
.webshop .item{margin-bottom:20px; min-height:220px;}
.webshop .item .info{min-height:70px;}
.webshop .item .titel{font-size:16px; line-height:20px;}
.webshop .price{font-size:22px; line-height:22px;}
.webshop a.linkbtn.to_top{margin:0 0 40px;}
}
@media screen and (max-width:320px){
.popup .content a{height:36px; line-height:36px; padding:0 6px; font-size:11px;}
}