/* List view Gallery view btn */
	.t-view 						{ width:100%; border:none; border-collapse:collapse; margin-bottom:20px}
	.t-view tbody tr td:first-child { text-align:left; vertical-align:top;}
	.t-view tbody tr td:last-child  { text-align:right; vertical-align:middle;}

	.btn-view 				{ border:none; outline:none; padding:12px 16px; background-color: #f1f1f1; cursor:pointer; transition:all 0.3s ease-out;}
	.btn-view:hover 		{ background-color:#ddd }
	.btn-view.active 		{ background-color:#666; color:#fff}

		
	.selectdiv 			{ position:relative; float:left; min-width:200px; margin:0 0 10px 0; padding:0;}

	.selectdiv:after 	{ content:'\f078'; font: normal normal normal 17px/1 FontAwesome; color:#fec84b; right:11px; top:6px; height:34px;
	    				  padding: 15px 0px 0px 8px; border-left: 1px solid #b4e0ec!important;
	    				  position: absolute; pointer-events:none;}


    /*  left right year box */
 	.sel-date 	{ float:left; width:250px; height:50px; margin:5px 10px 5px 0px; padding:0 20px;
				  font-size:16px; /*font-family:'Roboto Slab Regular'; font-weight:normal;*/ line-height:3; color:#333;  text-align: center; 
   				  background-color: #fff; border: 1px solid #b4e0ec!important; overflow:hidden;}

	.sel-date .fa-chevron-left 		{ left:10px; border-right:1px solid #b4e0ec; padding-right:12px}
	.sel-date .fa-chevron-right 	{ right:10px; border-left:1px solid #b4e0ec; padding-left:12px }
	.sel-date .fa-chevron-left,
	.sel-date .fa-chevron-right 	{ position:absolute; font-size:17px; height:50px; line-height:3; color:#fec84b; top:0; }

    .sel-date.calendar-year {width:320px; top:10px;}

	/* css select year (div) */
	select::-ms-expand 	{ display: none;}

	.selectdiv select 	{ 	display:block; width:100%; max-width:100%; height:50px; float:right; margin:5px 0px; padding:0px 50px 0 20px;
						   	/*font-family:'Roboto Slab Regular'; font-weight:normal;*/ font-size:16px; line-height:1.75; color:#333;
						   	background-color:#fff; background-image:none; border: 1px solid #b4e0ec!important;
							  -ms-word-break: normal;
							      word-break: normal;
					      -webkit-appearance: none;
						     -moz-appearance: none;
							      appearance: none; }

	.selectdiv.width-l-blk.list-categories    	{ width:400px;}
	.selectdiv select.width-l.list-categories 	{ width:400px; overflow:hidden;}

	.selectdiv.width-s-blk.list-year    		{ width:200px;}
	.selectdiv select.width-s.list-year			{ width:200px; overflow:hidden;}
	.adj-space { margin-right:15px;}
    .sel-date.calendar-year {top:0px;}

	/* ==========================================================================
	      Media Style: 
	============================================================================= */
	
	@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
	.sel-date 					    { width:250px;  height:40px; line-height:2.4; border-radius:3px;}
	.sel-date .fa-chevron-left,
	.sel-date .fa-chevron-right 	{ height:40px; line-height:2.4;}
	.selectdiv select 			{ height:40px; margin-bottom:-4px}
	.selectdiv:after 			{ height:24px; top:5px; line-height:0.5 }


/*	.selectdiv.width-l-blk.list-categories    	{ width:280px;}
	.selectdiv select.width-l.list-categories 	{ width:280px; }*/
    .sel-date.calendar-year {top:0px;}

	}

	@media only screen and (min-device-width: 768px) and (max-device-width: 1024px)  and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
	.selectdiv.width-l-blk.list-categories 		{ width:300px;}
	.selectdiv select.width-l.list-categories 	{ width:300px;}
	.selectdiv.width-s-blk.list-year	    	{ width:100px;}
	.selectdiv.width-s-blk.list-year	    	{ width:100px;}

	.adj-space 					{ margin-right:12px;}
	.selectdiv 					{ margin-bottom:11px}

	}

	@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
	.selectdiv.width-l-blk.list-categories 		{ width:350px;}
	.selectdiv select.width-l.list-categories 	{ width:350px;}
	.selectdiv.width-s-blk.list-year	    	{ width:100px;}
	.selectdiv.width-s-blk.list-year	    	{ width:100px;}

	}


	@media only screen and (max-width:767px) {
	.t-view,
	.t-view tbody,
	.t-view tbody tr,
	.t-view tbody tr td 	{ display:block; width:100%}
	.btn-view 				{ padding:8px 10px; font-size:12px }

	.sel-year 				{ margin-bottom:1px;}
	.sel-date 						{ width:100%; height:40px; font-size:15px; line-height:2.7; float:left; margin: 5px 0;}
	.sel-date .fa-chevron-left,
	.sel-date .fa-chevron-right 	{ font-size:15px; height:40px; line-height:2.7; color:#fec84b; top:0; }


	.selectdiv			{ margin-bottom:5px}
	.selectdiv select 	{ font-size:15px; height:40px; padding-left:15px;}
	.selectdiv:after  	{ content: '\f078'; font: normal normal normal 14px/1 FontAwesome; color: #fec84b;
	    				  right:11px; top:5px; height:24px;}

	.adj-space { margin-right:0;}

    .sel-date.calendar-year { width:100%; top:0;}
    
	.selectdiv.width-s-blk.list-year,	    
	.selectdiv.width-s-blk.list-year,	    	
	.selectdiv.width-l-blk.list-categories, 		
	.selectdiv select.width-l.list-categories 	{ width:100%; min-width:100%; }

	}