/*-------------------PC 1600 + --------------------------------*/     
      @media  (min-width: 1601px) {
      /*.bucket{grid-template-columns: 1fr 1fr 1fr 1fr;}*/

	  .filterSlider{
	      top:90px;
	      height:calc(100vh - 90px);    /*100%*/;
	  }
	  .filterSymbolButton{
	      top:15px;
	      right:150px;
	  }
      }

/*-------------------PC 1250 + --------------------------------*/      
      @media (max-width: 1600px) and (min-width: 1250px) {
      /*.bucket{grid-template-columns: 1fr 1fr 1fr;}*/

	  .filterSlider{
	      top:90px;
	      height:calc(100vh - 90px);    /*100%*/;
	  }

	  .filterSymbolButton{
	      top:15px;
	      right:150px;
	  }

   }

/*-------------------PC 700 + vga--------------------------------*/      
      @media (max-width: 1250px) and (min-width: 701px) {
     /*.bucket{grid-template-columns: 1fr 1fr;}*/

	  .filterSlider{
	      top:110px;
	      height:calc(100vh - 110px);    /*100%*/;
	  }
	  .filterSymbolButton{
	      top:60px;
	      right:150px;
	  }

      }

      
/*-------------------PC liten --------------------------------*/      
      @media (max-width: 700px) {
      /*.bucket{grid-template-columns: 1fr;}*/
	  .filterSlider{
	      top:110px;
	      height:calc(100vh - 110px);    /*100%*/;
	  }
	  .filterSymbolButton{
	      top:60px;
	      right:70px;
	  }


      }


 /*------------------- Felles PC --------------------------------*/      
      @media only screen
      and ( min-device-width: 950px ) , (-webkit-device-pixel-ratio: 1) {

     .filterSymbolButton:hover .filterSymbolUnder{
	 background-color:white;
     }

	  
      }



 /* ----------- Mobile  ----------- */     
     @media only screen 
            and (min-device-width: 100px) 
            and (max-device-width: 329px)
            and (-webkit-min-device-pixel-ratio: 2) {
     /*.bucket{ grid-template-columns: 1fr;}*/
     
     }

 /* ----------- Mobile  ----------- */     
     @media only screen 
            and (min-device-width: 330px) 
            and (max-device-width: 749px)
            and (-webkit-min-device-pixel-ratio: 2) {
     /*.bucket{grid-template-columns: 1fr 1fr;}*/
     
     }


/* ----------- Pad  ----------- */
     @media only screen 
            and (min-device-width: 750px)
            and (max-device-width: 950px) 
            and (-webkit-min-device-pixel-ratio: 2) { 
     /*.bucket{ grid-template-columns: 1fr 1fr 1fr;}*/

     }

     
/* ----------- Mobil og Pad med  ratio 2 og mer  ----------- */
     @media only screen
            and (max-device-width: 950px) 
            and (-webkit-min-device-pixel-ratio: 2) { 

	 .filterSlider{
	     top:100px;	 
	     height:calc(100vh - 100px);    /*100%*/;
	 }

	 .filterSymbolButton{
	      top:60px;
	      right:70px;
	  }

     }
 

/* ----------- Felles  ----------- */



     .filterCurtain{
	 display:none;
	 position:fixed;
	 top:0px;
	 left:0px;
	 width:100%;
	 height:100%;
	 background-color:rgba(19, 40, 68, 0.7);/*background-color: rgba(0, 0, 0, 0.2);*/
	 z-index:9000; 
     }



     .filterSlider{
	 display:block;
	 position:absolute;
	 left:0px;
	 width:0px;
	 overflow: scroll;
	 background-color: white;// rgba(255, 0, 0, 0.8);
	 color: #132844;
	 font-family:Abel;
	 z-index:10001;
	 transition: width 1000ms;
	 background-color: white;
	 z-index:101001; 
	 /*background-color: yellow; yellow;*/
     }


     .filterTop{
	 position:relative;
	 width:calc(100%-40px);
	 height:40px;
	 font-family:Oswald;
	 font-size:18px;
	 font-weight:700px;
	 line-height:40px;
	 padding: 10px 20px 10px 20px;
     }
     .filterTopTxt{
	 position:absolute;
	 width: 130px;
	 height:20px;
	 top:28px;
	 left:20px;
	 font-family:Oswald;
	 font-size:10px;
	 font-weight:400px;
     }

     .filterTopFilterCont{
	 width:calc(100%-40);
	 font-family:Abel;
	 font-size:16px;
	 padding: 10px 20px 10px 20px;
	 border-bottom: solid 2px #225397;
     }

     
     .filterTopButtonClear{
	 position:absolute;
	 width: 80px;
	 height:30px;
	 top:15px;
	 right:70px;    
	 line-height:30px;
	 font-family:Abel;
	 font-size: 16px;
	 text-align:center;
	 overflow:hidden;
	 text-overflow:ellipsis;
	 with-space:nowrap;
	 color: white;
	 background-color: #225397;
	 border: 1px solid #225397; 
	 border-radius: 15px;
	 cursor:pointer;
     }
     .filterTopButtonClear:hover{
	 background-color: #132844;
	 border: 1px solid #132844;;
     }
     .filterTopButtonClose{
	 position:absolute;
	 width: 30px;
	 height:30px;
	 top:15px;
	 right:10px;    
	 line-height:30px;
	 font-family:Abel;
	 font-size: 24px;
	 text-align:center;
	 overflow:hidden;
	 text-overflow:ellipsis;
	 with-space:nowrap;
	 color: white;
	 background-color: #225397; 
	 border: 1px solid #225397;
	 border-radius: 15px;
	 cursor:pointer;
     }
     .filterTopButtonClose:hover{
	 background-color: #132844;
	 border: 1px solid  #132844;
     }
     .filterHeading1{
	 width:calc(100%-40px);;
	 height:40px;
	 font-family:Oswald;
	 font-size:18px;
	 font-weight:700px;
	 line-height:40px;
	 padding: 0px 20px 0px 20px;
	 cursor:pointer;
	 /*background-color:orange;*/
     }
     .filterHeading2{
	 width:calc(100%-40px);
	 height:30px;
	 font-family:Abel;
	 font-size:16px;
	 line-height:30px;
	 padding: 0px 20px 0px 20px;
	 /*background-color:pink;*/
     }
     .filterHeadingZ{
	 width:calc(100%-40px);
	 height:30px;
	 font-family:Abel;
	 font-size:16px;
	 line-height:30px;
	 padding: 0px 20px 0px 20px;
	 /*background-color:yellow;*/
     }
     .filterValueCont{
	 width:calc(100%-40px);
	 height:29px;
	 font-family:Abel;
	 font-size:16px;
	 line-height:35px;
	 padding: 2px 20px 2px 20px;
	 /*background-color:orange;*/
     }	

     .filterButtonLabel{
	 display:inline-block;
     }
     .filterButtonLabel label{
	 cursor:pointer;
     }
     .filterButtonLabelCheck{
	 display:inline-block;
	 width:25px;
	 height:25px;
	 font-family:Abel;
	 white-space: nowrap;
	 overflow: hidden;
	 font-family:Abel;
	 color:white; /*#1b4786;*/
	 font-size:16px;
	 line-height: 25px;
	 text-align:center;
	 border: 1px solid #225397;
	 border-radius:15px;
	 cursor:pointer;
	 background-color:white;
     }

     .filterButtonLabel input[type="radio"] {
	 opacity: 0;
	 position: absolute;
	 width: 0px;
     }
     .filterButtonLabel input[type="checkbox"] {
	 opacity: 0;
	 position: absolute;
	 width: 0px;
     }
     .filterButtonLabel input[type="checkbox"]:checked + label >div {
	 background-color:#225397;
     }
     /*
     .filterButtonLabel input[type="checkbox"]:focus + label {
	 border: 1px dashed #1b4786;;
     }
     .filterButtonLabel input[type="radio"]:focus + label {
	 border: 1px dashed #1b4786;;
     }
 
     .filterButtonLabel label:hover {
	 background-color: #132844; //#dfd;
	 border: 1px dashed #1b4786;
     }
     */
      
     .filterInputText{
	 width:40%;
	 padding: 5px 15px; 5px; 15px;
	 font-family:Abel;
	 font-size:16px;
	 border-radius:15px;
	 margin: 5px 20px 5px 30px;
     }


     .filterMenyCont{
	 width:100%;
	 /*(background-color:blue;*/
     }
     .filterSecTrY{
	 width:calc(100%-30px);
	 margin: 0px 0px 0px 30px;  
	 /*background-color:red;*/
     }
     .filterBucketTrZ{
	 margin: 0px 0px 0px 30px;  
	 /*background-color:green;*/
	 
     }

     .filterSymbolButton{
	 position:absolute;
	 width:28px;
	 height:28px;
	 background-color: #001e3a;
	 cursor:pointer;
     }
     .filterSymbolUnder{
	 display:block;
	 position:absolute;
	 top:31px;
	 left:-2px;
	 background-color: #001e3a;
	 width:30px;
	 height:4px;
     }
  

     .filterFilterButton{
	 display:inline-block;
	 position:relative;
         padding: 2px 30px 2px 10px;
	 line-height:18px;
	 font-family:Abel;
	 font-size: 18px;
	 text-align:left;
	 overflow:hidden;
	 text-overflow:ellipsis;
	 with-space:nowrap;
	 color: white;
	 background-color: #225397;
	 border-radius: 15px;
	 margin: 2px 10px 2px 10px;
	 cursor:pointer;
     }

     .filterFilterButtonDel{
	 position:absolute;
	 width:17px;
	 height:17px;
	 top:2px;
	 right:3px;
	 font-family:Abel;
	 white-space: nowrap;
	 overflow: hidden;
	 font-family:Abel;
	 color:white;
	 font-size:16px;
	 line-height: 18px;
	 text-align:center;
	 border-radius:15px;
	 cursor:pointer;
	 
     }

     .filterFilterButton:hover{
	 background-color: #132844;
     }

 /************** Filter Symbol ***************************/
     .filterSymbolCont{display:inline-block;
	 position:relative;
	 top:5px;
	 width: 21px;
	 height: 21px;
	 color:white;
     }
     .filterSymbolLineH{
	 display:flex;
	 widht:100%;
	 height:3px;
	 padding:0px 0px 0px 0px;
     }
     .filterSymbolLineL{
	 display:flex;
	 widht:100%;
	 height:1px;
	 padding:0px 0px 0px 0px;
     }
     .filterSymbolTd-long{
	 width:60%;
	 height:100%;
     } 
     .filterSymbolTd-short{
	 width:22%;
	 height:100%;
	 
     }
     .filterSymbolTd-space{
	 width:14%;
	 height:100%;
     } 
     .filterSymbolTd-stroke{
	 width:4%;
	 height:100%;
     } 
     .filterSymbolTd-medium{
	 width:41%;
	 height:100%;
     } 
     .filterSymbolTdInv{
	 background-color:white;
     }