/*-------------------PC 1600 + --------------------------------*/     
      @media  (min-width: 1601px) {

	  .bookingMyContCont{
	      display:inline-block;
	  }
	  .bookingMyCont{
	      width:1000px;
	      flex-direction:row;
	  }
	  
	  .bookingCommentCont{
	      
	  }

	  .bookingUserCommentContNew{
	     width:calc(100% - 60px);    
	 }
	  .bookingUserCommentFrameNew{
	      width:calc(100% - 60px);
	     padding:10px 20px 5px 20px;
	 }
	  .bookingUserCommentArrowNew{
	      width:50px;
	      min-height:80px;
	      line-height:80px;
	      font-size:50px;
	  }
	 .bookingUserCommentCont{
	     width:calc(100% - 40px);
	 }
	 .bookingUserCommentFrame{
	     width:calc(100% - 140px);
	     padding:10px 20px 10px 20px;
	 }
	 .bookingUserCommentContEmployee{
	     width:calc(100% - 60px);
	 }
	 .bookingUserCommentFrameEmployee{
	     width:calc(100% - 160px);
	     padding:10px 20px 10px 20px;
	 }

	  .bookingCommentMsg{
	      height:100px;
	  }

	  .bookingFlexInstruction{
	      grid-template-columns: 1fr 1fr;
	  }

	  .bookingFlex{
	      grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	  }

      }

/*-------------------PC 1250 + --------------------------------*/      
      @media (max-width: 1600px) and (min-width: 1250px) {

	  .bookingMyContCont{
	      display:inline-block;
	  }
	  .bookingMyCont{
	      width:1000px;
	      flex-direction:row;
	  }
	  .bookingUserCommentContNew{
	     width:calc(100% - 60px);    
	 }
	  .bookingUserCommentFrameNew{
	      width:calc(100% - 40px);
	     padding:10px 20px 5px 20px;
	 }
	  .bookingUserCommentArrowNew{
	      width:50px;
	      min-height:80px;
	      line-height:80px;
	      font-size:50px;
	  }
	 .bookingUserCommentCont{
	     width:calc(100% - 40px);
	 }
	 .bookingUserCommentFrame{
	     width:calc(100% - 140px);
	     padding:10px 20px 10px 20px;
	 }
	 .bookingUserCommentContEmployee{
	     width:calc(100% - 60px);
	 }
	 .bookingUserCommentFrameEmployee{
	     width:calc(100% - 160px);
	     padding:10px 20px 10px 20px;
	 }

	  .bookingCommentMsg{
	  }
	 .bookingFlexInstruction{
	      grid-template-columns: 1fr 1fr;
	  }

	  .bookingFlex{
	      grid-template-columns: 1fr 1fr 1fr 1fr;
	  }

      }

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

	  .bookingMyContCont{
	      display:inline-block;
	  }
	  .bookingMyCont{
	      width:550px;
	      flex-direction:column;
	  }

	  .bookingUserCommentContNew{
	     width:calc(100% - 60px);    
	 }
	  .bookingUserCommentFrameNew{
	     width:calc(100% - 40px);
	     padding:10px 20px 5px 20px;
	 }
	  .bookingUserCommentArrowNew{
	      width:50px;
	      min-height:80px;
	      line-height:80px;
	      font-size:50px;
	  }
	 .bookingUserCommentCont{
	     width:calc(100% - 40px);
	 }
	 .bookingUserCommentFrame{
	     width:calc(100% - 120px);
	     padding:10px 20px 10px 20px;
	 }
	 .bookingUserCommentContEmployee{
	     width:calc(100% - 60px);
	 }
	 .bookingUserCommentFrameEmployee{
	     width:calc(100% - 100px);
	     padding:10px 20px 10px 20px;
	 }

	  .bookingCommentMsg{
	      height:150px;
	  }

	  .bookingFlexInstruction{
	      grid-template-columns: 1fr;
	  }

	  .bookingFlex{
	      grid-template-columns: 1fr 1fr;
	  }

      }

      
/*-------------------PC liten --------------------------------*/      
      @media (max-width: 700px) {
      /*.bucket{grid-template-columns: 1fr;}*/

	  
	  .bookingMyContCont{
	      display:block;
	  }
	  .bookingMyCont{
	      width:100%;
	      flex-direction:column;	      
	      margin:auto;
	  }

	  .bookingUserCommentContNew{
	     width:calc(100% - 20px);    
	 }
	  .bookingUserCommentFrameNew{
	     width:calc(100%);
	     padding:10px 20px 5px 20px;
	 }
	  .bookingUserCommentArrowNew{
	      width:30px;
	      min-height:50px;
	      line-height:50px;
	      font-size:30px;
	  }
	 .bookingUserCommentCont{
	     width:calc(100% - 10px);
	 }
	 .bookingUserCommentFrame{
	     width:calc(100% - 40px);
	     padding:10px 10px 10px 10px;
	 }
	 .bookingUserCommentContEmployee{
	     width:calc(100% - 10px);
	 }
	 .bookingUserCommentFrameEmployee{
	     width:calc(100% - 40px);
	     padding:10px 20px 10px 20px;
	 }

	  .bookingCommentMsg{
	      height:200px;
	  }

	  .bookingFlexInstruction{
	      grid-template-columns: 1fr;
	  }

	  .bookingFlex{
	      grid-template-columns: 1fr;
	  }

      }
 

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

	  
   }


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



	 
     }

 /* ----------- Mobile, liten pad ----------- */     
     @media only screen 
            and (min-device-width: 500px) 
            and (max-device-width: 950px)
            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;}


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

	 .bookingMyContCont{
	     display:block;
	  }
	 .bookingMyCont{
	     width:100%;
	     flex-direction:column;
	     margin:auto;
	  }
	 
	 .bookingUserCommentContNew{
	     width:calc(100% - 30px);    
	 }
	 .bookingUserCommentFrameNew{
	     width:calc(100% );
	     padding:10px 20px 5px 20px;
	 }

	 .bookingUserCommentArrowNew{
	     width:30px;
	     min-height:50px;
	     line-height:50px;
	     font-size:30px;
	 }
	 .bookingUserCommentCont{
	     width:calc(100% - 20px);
	 }
	 .bookingUserCommentFrame{
	     width:calc(100% - 20px);
	     padding:10px 10px 10px 10px;
	 }


	  .bookingCommentMsg{
	      height:200px;
	  }

	 .bookingFlexInstruction{
	      grid-template-columns: 1fr;
	  }

	 .bookingFlex{
	      grid-template-columns: 1fr;
	  }

     }
     
/*------------------------------- FELLLES ---------------------------*/



.bookingMain{
    width:calc(100% - 40px);
    background-color:white;;
    padding:20px;
    border-radius:20px;
}

.bookingHeading{
    display:inline-block;
    height:18px;
    font-family:Oswald;
    font-weight:700;
    font-size: 18px;
    color: #132844;
}

.bookingHelp{
    width:calc(100% - 40px);
    padding:20px;
    background-color:lightgrey;
    border-radius:20px;
}
.bookingHelpText{
    font-family:Oswald;
    font-weight:700;
    font-size: 16px;
    color: #132844;    
}

/********************************/

.bookingFlexInstruction{
    width:100%;
    display:grid;
    grid-column-gap:10px;
    grid-row-gap:10px;
}
.bookingTrInstruction{
    display:table;
}
.bookingTdInstruction{
    display:table-cell;
    color: #132844;    
    padding:5px;
}

/********************************/

.bookingFlex{
    width:100%;
    display:grid;
    grid-column-gap:10px;
    grid-row-gap:10px;
}

.bookingTr{
    color: white;
    background-color:#225397;
    padding:5px;
    border-radius:10px;
    text-align:center;
    cursor:pointer;
}
.bookingTr:hover{
    background-color:#132844;    
}
.bookingTdDay{
    display:inline-block;
    font-family:Abel;
    font-size: 18px;
    line-height:18px;
}
.bookingTdDate{
    display:inline-block;
    font-family:Abel;
    font-size: 18px;
    line-height:18px;
}
.bookingTdTime{
    display:inline-block;
    height:16px;
    width:16px;
    background-color: aqua;
    border-radius:16px;    
}
.bookingTdVip{
    display:inline-block;
    height:16px;
    width:16px;
    background-color: lime;
    border-radius:16px;    
}
.bookingTdStandby{
    display:inline-block;
    height:16px;
    width:16px;
    background-color: orange;
    border-radius:16px;    
}

/********************************/
.bookingMyContCont{
}
.bookingMyCont{
    display:flex;
    position:relative;
    justify-content:space-around;
    align-items:center;
    background-color:red;
    border-radius:10px;
    padding:2px;    
}
.bookingMyText{
    font-family:Oswald;
    font-size: 16px;
    font-weight:700;
    color: white;
}
.bookingMy{
    background-color:red;
    pointer:default;
}
.bookingMy:hover{
    background-color:red;
}
.bookingButton{
    display:inline-block;
    height:25px;
    width:150px;
    font-family:Abel;
    font-size: 18px;
    line-height:25px;
    text-align:center;
    color: white;
    background-color:#225397;
    border-radius:10px;
    cursor:pointer;
}
.bookingButton:hover{
    background-color:#132844;    
}
.bookingButtonDelete{
    display:block;
    position:absolute;
    top:3px;
    right:3px;
    height:20px;
    width:20px;
    font-family:Abel;
    font-size: 18px;
    line-height:20px;
    text-align:center;
    color: red;
    background-color:white;
    border: 2px solid white;
    border-radius:20px;
    cursor:pointer;
}
.bookingButtonDelete:hover{
    background-color:red;
    color:white;
}
.bookingButtonRefresh{
    display:inline-block;
    height:25px;
    width:25px;
    font-family: Lucida Sans Unicode;
    font-weight:400;
    font-size: 18px;
    line-height:25px;
    text-align:center;
    color: white;
    background-color:#225397;
    border-radius:25px;
    transform:rotate(110deg);
    cursor:pointer;
}
.bookingButtonRefresh:hover{
    background-color:#132844;    
}

/********************************/
.bookingButtonCheck{
    display: inline-block;
    width:280px;
    text-align:left;
}
.bookingButtonCheck label {
    display: inline-block;
    width:79%;
    height:20px;
    font-family:Abel;
    color: #132844;
    white-space: nowrap;
    overflow: hidden;
    font-family:Abel;
    font-size: 16px;
    line-height: 20px;
    text-align:center;
    border-radius: 10px;
    background-color: #eee;
    border: 2px solid #444;
    cursor:pointer;
}
.bookingButtonCheck input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    width: 0px;
}
.bookingButtonCheck input[type="checkbox"]:checked + label {
    background-color:#bfb;
    border-color: #4c4;
}
/*
.bookingButtonCheck input[type="checkbox"]:focus  + label{
    border: 2px solid   #444;
}
.bookingButtonCheck label:hover {
    background-color: #dfd;
}
*/

/******** grey button ***********/
.bookingButtonPassivCont{
    display: inline-block;
    width:280px;
    text-align:left;
}
.bookingButtonPassivLabel {
    width:79%;
    height:20px;
    font-family:Abel;
    color: #132844;
    white-space: nowrap;
    overflow: hidden;
    font-family:Abel;
    font-size: 16px;
    line-height: 20px;
    text-align:center;
    border-radius: 10px;
    background-color: #eee;
    border: 2px solid #444;
}
.bookingButtonPassivChecked {
    background-color:#bfb;
    border-color: #4c4;
}


/********************************/

.bookingCommentCont{
    width:calc(100% - 100px);
    position:relative;
    font-family:Abel;    
    padding:10px 20px 5px 20px;
    border-radius:20px;
    background-color:white;
}
.bookingCommentMsg{
    width:100%;
    border:0px;    
    outline:0px;
}


.bookingUserCommentContNew{
    display:flex;
    flex-direction:row;
    justify-content:flex-end;
    padding:0px 0px 0px 20px;
    /*background-color:pink;*/
}
.bookingUserCommentFrameNew{
    position:relative;
    font-family:Abel;    
    font-size: 16px;
    border-radius:20px;
    color:#225397;
    border: 2px solid #225397;
    border-radius:20px;
    background-color:white;
}
.bookingUserCommentMsgNew{
    width:100%;
    min-height:80px;
    border:0px;    
    outline:0px;
    background-color:white;
}
.bookingUserCommentArrowNew{
    display:flex;
    justify-content:center;
    align-items:center;
    baseline:top;
    font-family:Arial;
    font-weight:700;
    color:#225397;
    /*background-color:lime;*/
    cursor:pointer;
}
.bookingUserCommentArrowNew:hover{
    color: red;
}


.bookingUserCommentCont{
    display:flex;
    flex-direction:row;
    justify-content:flex-end;
    padding:0px 0px 0px 20px;
}
.bookingUserCommentFrame{
    position:relative;
    font-family:Abel;    
    font-size: 16px;
    border-radius:20px;
    color:#225397;
    background-color:#bfb;
}
.bookingUserCommentMsg{
    width:100%;
    font-family:Abel;    
    font-size: 16px;
    border:0px;    
    outline:0px;
    color:#225397;
}
.bookingUserCommentContCircle{
    display:flex;
    justify-content:center;
    align-items:center;
    width:50px;
    min-height:80px;
    line-height:80px;
    baseline:top;
    font-family:Arial;
    font-weight:700;
    font-size:50px;
   /* background-color:lime;*/
}


.bookingUserCommentContEmployee{
    display:flex;
    flex-direction:row;
    justify-content:flex-start;
    padding:0px 20px 0px 20px;
    position:relative;
    /*background-color:yellow;*/
}
.bookingUserCommentFrameEmployee{
    position:relative;
    border-radius:20px;
    color:#225397;
    background-color:lightcyan;
}
.bookingUserCommentMsgEmployee{
    width:100%;
    border:0px;    
    outline:0px;
    font-family:Abel;    
    font-size: 16px;
    color:#225397;
    background-color:lightcyan;
}




/********************************/
