﻿  /**************************/
 /*        CSS reset       */
/**************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
body {line-height:1;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content:''; content:none;}
:focus {outline:0;}
ins {text-decoration:none;}
del {text-decoration:line-through;}
/*caption, th, td {text-align: left; font-weight: normal;}
table, caption, tbody, tfoot, thead, tr, th, td {font-size:100%; vertical-align:baseline; outline:0; margin:0; padding:0;}
table { border-collapse:collapse; border-spacing: 0;}*/
/******* Default rules tags *******/
body { font-family: Arial, Verdana, Helvetica, sans-serif; color:#2f2f2f; background:#232323; line-height:18px; font-size:12px;}
h1 {font-size:20px;}
h2 {font-size:18px; }
h3{ font-size:16px; }
h4 {font-size:14px;}
h5 {font-size:12px;}
a{ text-decoration:underline; color:#333;}
a:hover{ color:#112875; text-decoration:none;}
input, select, textarea {font-size:11px; border:1px solid #CCC; font-family:Verdana, Geneva, sans-serif}
/*0. ///////Structure all templates///////*/
.w600{ width:600px; margin:0px auto; background-color: #f6f6f6;}

      
/*0. ///////end: Structure all templates///////*/

/*1. ///////HTML elements///////*/
    .cb{ clear:both; font-size:0%; line-height:0%;}
    .cl{ clear:both; font-size:0%; line-height:0%;}
    .cr{ clear:both; font-size:0%; line-height:0%;}
    
    /*-- Sprites --*/

[class^="icon-"], [class*=" icon-"] 
{
     display:block;
     margin-top: 1px;
     line-height: 40px;
     vertical-align: text-top;
     background-image: url("../images/sprite-icon.png");
     background-repeat: no-repeat;
 }
    
    
    /*-- Button --*/
   .button {		
		
		/*fallback */ background-color: #e5e5e5; background: url(../images/repeat-x.jpg); background-repeat: repeat-x; 
		/* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#e5e5e5), to(#b9babb)); 
		/* Safari 5.1, Chrome 10+ */ background: -webkit-linear-gradient(top, #e5e5e5, #b9babb); 
		/* Firefox 3.6+ */ background: -moz-linear-gradient(top, #e5e5e5, #b9babb); 
		/* IE 10 */ background: -ms-linear-gradient(top, #e5e5e5, #b9babb); 
		/* Opera 11.10+ */ background: -o-linear-gradient(top, #e5e5e5, #b9babb);
	    float:left; 
	    display:block; 
	    width:112px; 
	    height:31px;
	    line-height:29px !important;
        text-align:center;
        cursor:pointer;
        padding:0px !important;
		color:rgb(0,0,0);
		-moz-border-radius: 5px;
        border-radius: 5px;
	}
	
    .button input[type="submit"]{ width:100%; display:block; padding-bottom:6px; background:transparent; border:none; cursor:pointer; font-size:13px; padding-top:6px;}
    .button input[type="button"]{ width:100%; display:block; padding-bottom:6px; background:transparent; border:none; cursor:pointer; font-size:13px; padding-top:6px;}
    
    .button01 {		
		
		/*fallback */ background-color: #268db9; background: url(../images/repeat-x01.jpg); background-repeat: repeat-x; 
		/* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#268db9), to(#49bde3)); 
		/* Safari 5.1, Chrome 10+ */ background: -webkit-linear-gradient(top, #268db9, #49bde3); 
		/* Firefox 3.6+ */ background: -moz-linear-gradient(top, #268db9, #49bde3); 
		/* IE 10 */ background: -ms-linear-gradient(top, #268db9, #49bde3); 
		/* Opera 11.10+ */ background: -o-linear-gradient(top, #268db9, #49bde3);
	    float:left; 
	    display:block; 
	    width:112px; 
	    height:31px;
	    line-height:29px !important;
        text-align:center;
        cursor:pointer;
        padding:0px !important;
		color:rgb(255,255,255);
		-moz-border-radius: 5px;
        border-radius: 5px;
	}
	
	.button0111{		
		
		/*fallback */ background-color: #e5e5e5; background: url(../images/repeat-x.jpg); background-repeat: repeat-x; 
		/* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#e5e5e5), to(#b9babb)); 
		/* Safari 5.1, Chrome 10+ */ background: -webkit-linear-gradient(top, #e5e5e5, #b9babb); 
		/* Firefox 3.6+ */ background: -moz-linear-gradient(top, #e5e5e5, #b9babb); 
		/* IE 10 */ background: -ms-linear-gradient(top, #e5e5e5, #b9babb); 
		/* Opera 11.10+ */ background: -o-linear-gradient(top, #e5e5e5, #b9babb);
	    float:left; 
	    display:block; 
	    width:112px; 
	    height:31px;
	    line-height:29px !important;
        text-align:center;
        cursor:pointer;
        padding:0px !important;
		color:rgb(0,0,0);
		-moz-border-radius: 5px;
        border-radius: 5px;
	}
	
	.button0111 input[type="button"]{ width:100%; display:block; padding-bottom:6px; background:transparent; border:none; cursor:pointer; font-size:13px; padding-top:6px;  color:#fff;}
    
	
    .button01 input[type="submit"]{ width:100%; display:block; padding-bottom:6px; background:transparent; border:none; cursor:pointer; font-size:13px; padding-top:6px;  color:#fff;}
    
	
    .button01 input[type="button"]{ width:100%; display:block; padding-bottom:6px; background:transparent; border:none; cursor:pointer; font-size:13px; padding-top:6px;  color:#fff;}
    
	/*--end: Button --*/
    
    /*-- Content --*/
    /*  .tab-head{ background:url(../images/bg-title.jpg) no-repeat top left; height:77px;} */
    .Columns{ overflow:hidden;}
    .sub-wrapp{ height:490px;}
        .tab-head{ background:#00a1db; height:55px;}
    
    .m100left{ margin-left:140px;}
    .m200left{ margin-left:200px;}
    .f-left{ float:left;}
    .f-right{ float:right;}
    /*-- calendar --*/
    .tab-calendar{}
        .tab-calendar select{ background:transparent;  color:#FFF; font-size:40px; font-weight:bold; font-family: 'Open Sans Condensed', sans-serif; margin-left:20px; border:none; width:560px;}
        .tab-calendar01 img{ margin-left:20px;}
    
    .tab-message{ position:relative;}
        .create-mess{ position:absolute; top:12px; right:20px; width:34px; height:35px;}
        .tab-message h2, .tab-account h2{ font-size:40px; font-weight:bold; font-family: 'Open Sans Condensed', sans-serif; color:#fff; margin-left:20px; line-height:44px; padding-top:8px;}
        .tab-message01, .tab-archive01{ width:560px; margin:0px auto; height:370px; overflow-y:scroll; margin-top:20px;}
        .mess-item{ margin-bottom:20px;}
         .mess-item a, .archive-item .description a{ text-decoration:none; font-size:12px; color:#a9a8a8;}
         .mess-item a strong, .mess-item01 strong, .archive-item .description strong{ color:#00a0d9; font-size:14px; font-weight:bold; padding-bottom:7px;}
         .mess-item strong, .mess-item label, .mess-item span,
         .mess-item01 strong, .mess-item01 label, .mess-item01 span,
         .archive-item .description strong,.archive-item .description label, .archive-item .description span{ display:block;}
        .tab-message02 { width:560px; margin:0px auto; height:340px; margin-top:20px;}
            .mess-item01, .booking-table{ height:340px;color:#a9a8a8;}
            .booking-table{ font-family:font-family: 'Open Sans Condensed', sans-serif;}
            .booking-table h3{ font-size:24px; color:#f85c27;}
            .booking-table table{ width:100%; margin-top:20px;}
                .booking-table table tr td{ font-size:18px; text-align:right; border-bottom:solid 1px #cfcece; padding:7px 5px;}
                .booking-table table tr td:first-child{ text-align:left;}
        .mess-item01{ position:relative;}
            .mess-item01 .btn-delete{ position:absolute; top:0px; right:0px; width:12px; height:12px;}
        .mess-form, .login-form{ width:480px; margin:0px auto; padding-top:20px; overflow:hidden;}
        .change-form{ width:540px; margin:0px auto; padding-top:20px; overflow:hidden;}
            .mess-form label{ width:90px; float:left; margin-right:10px; font-size:16px; line-height:25px;}
            .login-form label{ width:150px; float:left; margin-right:10px; font-size:16px; line-height:25px;}
            .change-form label{ width:180px; float:left; margin-right:10px; font-size:16px; line-height:25px;}
            .mess-form input, .mess-form textarea, .login-form input, .change-form input{ font-size:12px; padding:5px; width:300px; margin-bottom:7px;}
            .mess-form textarea{ max-width:300px;}
             .login-form select{ font-size:12px; padding:4px; width:312px; margin-bottom:7px;}
         .archive-item{ overflow:hidden;}
            .archive-item .picture{ float:left; width:80px;}
            .archive-item .description{ float:right; width:450px;}
         .tab-archive02 { width:560px; margin:0px auto;}    
            .archive-item01{ overflow:hidden; font-size:12px; color:#a9a8a8; height:340px; margin-top:20px; overflow-y:scroll; margin-bottom:12px;}
                 .archive-item01 img{ float:left; margin-right:10px; margin-bottom:7px;}   
                 .archive-item01 h2{ font-size:16px; font-weight:normal; color:#00a0d9; margin-bottom:7px;}
                 .archive-item01 p{ padding-right:10px; text-align:justify; margin-bottom:10px;}
        .tab-account02 ul{ width:480px; margin:0px auto; padding-top:30px;}
            .tab-account02 ul li{ list-style:none; overflow:hidden; display:block; border-bottom:solid 1px #cfcece; padding-bottom:12px; margin-bottom:12px;}
            .tab-account02 ul li:last-child{ border-bottom:none;}
            .tab-account02 ul li img{ float:left; margin-right:12px;}
            .tab-account02 ul li a{ text-decoration:none; float:left; display:block; width:470px;}
            .tab-account02 ul li a span{ color:#4e4e4e; font-family: 'Open Sans Condensed', sans-serif; display:block; font-size:20px; font-weight:bold; line-height:28px; padding-top:20px;}
            .tab-account02 ul li a label{ color:#4e4e4e;}
    .tab-list{list-style-type: none;padding: 0;overflow:hidden; border-bottom:solid 1px #cfcece; border-top:solid 1px #cfcece;}
        .tab-list li{list-style:none; border-right:solid 1px #cfcece; display:inline-block; text-align:center; width:148px; float:left; border-left:solid 1px #cfcece;}
        .tab-list li a{ color:#4e4e4e; font-family: 'Open Sans Condensed', sans-serif; text-decoration:none; background-color:#fff; float:left; width:148px; text-align:center; padding-top:7px; padding-bottom:7px; display:table;}
            .tab-list li a span{ font-weight:bold; font-size:20px;}
            .tab-list li a:hover, .tab-list li.selected a{ color:#fff; background-color:#a9a8a8;}
            .tab-list li a i{ margin-bottom:7px;}
            
            .tab-list li a .icon-calendar{ width:44px; height:40px; background-position:-65px 0px; margin-left:53px;}
            .tab-list li a:hover .icon-calendar, .tab-list li.selected a .icon-calendar{ background-position:0px 0px;}
            
            .tab-list li a .icon-message{ width:37px; height:40px; background-position:-199px 0px; margin-left:56px;}
            .tab-list li a:hover .icon-message, .tab-list li.selected a .icon-message{ background-position:-135px 0px;}
            
            .tab-list li a .icon-archive{ width:37px; height:40px; background-position:-339px 0px; margin-left:56px;}
            .tab-list li a:hover .icon-archive, .tab-list li.selected a .icon-archive{ background-position:-271px 0px;}
            
            .tab-list li a .icon-account{ width:39px; height:40px; background-position:-478px 0px; margin-left:55px;}
            .tab-list li a:hover .icon-account, .tab-list li.selected a .icon-account{ background-position:-410px 0px;}
            
    /*--end: Content --*/
	
	.ui-widget-header {
		background:transparent;
		color: #BBBBBB;
		font-size: 15px;
		font-weight: normal;
		height: 35px;
		margin: 0 auto;
		padding: 9px 5px 1px 0;
		text-transform: uppercase;
		border:none;
		 border-bottom: 1px solid rgb(165, 165, 165);
		 width:90%; margin:0px auto;
	}
	.ui-corner-all{
		border-radius: 0;
	}
	.ui-datepicker {				
		padding: 0;
		width: 99%;
		margin:0px auto;
	}
	.ui-datepicker table {
		background:rgb(246, 246, 246);
		border-collapse: collapse;
		 width: 90%;
		  margin:0px auto 10px auto;
	}
	.ui-datepicker-calendar .ui-state-default {
		background:#e1e1e1;
		color:#b6b6b6;
		font-size: 18px;
		padding:13px;
		text-align: center;
		cursor:pointer;
		border: 2px solid #999999;
		border-radius:5px;
	}
	
	.ui-datepicker-calendar .ui-state-default-booked {
		background:#b4d4a5;
		color:#b6b6b6;
		font-size: 18px;
		padding:13px;
		text-align: center;
		cursor:pointer;
		border: 2px solid #7ba16a;
		border-radius:5px;
	}
	
	.ui-datepicker-calendar .ui-state-default-noavailable {
		background:#f2cbcb;
		color:#b6b6b6;
		font-size: 18px;
		padding:13px;
		text-align: center;
		cursor:pointer;
		border: 2px solid #e89999;
		border-radius:5px;
	}
	
	
	
	.ui-datepicker-calendar .ui-state-available{
	    background:#FFFFFF;
		color:#000000;
		font-weight:bold;
		font-size: 18px;
		padding:13px;
		text-align: center;
		cursor:pointer;
		border: 2px solid #999999;
		border-radius:5px;
	}
	
	.ui-datepicker-calendar .ui-state-available-booked{
	    background:#6aa84f!important;
		color:#000000;
		font-weight:bold;
		font-size: 18px;
		padding:13px;
		text-align: center;
		cursor:pointer;
		border: 2px solid #22520c;
		border-radius:5px;
	}
	
	.ui-datepicker-calendar .ui-state-available-queue{
	    background:#e69729!important;
		color:#000000;
		font-weight:bold;
		font-size: 18px;
		padding:13px;
		text-align: center;
		cursor:pointer;
		border: 2px solid #22520c;
		border-radius:5px;
	}
        
        .ui-datepicker-calendar .ui-state-disable-queue{
	    background:#f2d6b6 !important;
		color:#a1a09f;
		font-weight:bold;
		font-size: 18px;
		padding:13px;
		text-align: center;
		cursor:pointer;
		border: 2px solid #a1a09f;
		border-radius:5px;
	}
	
	.ui-datepicker-calendar .ui-state-available-noavailable{
	    background:#fc0000;
		color:#000000;
		font-weight:bold;
		font-size: 18px;
		padding:13px;
		text-align: center;
		cursor:pointer;
		border: 2px solid #610200;
		border-radius:5px;
	}
	
	.ui-datepicker th{
		background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
		border: medium none;
		color: #BBBBBB;
		padding: 12px 5px;
		text-transform: uppercase;
		font-size: 12px;
		font-weight: bold;
	}
	.ui-state-hover {
		background:rgb(0, 0, 0);
	}
	.ui-datepicker .ui-datepicker-header {
		padding: 7px 0;
		position: relative;
	}
	.ui-datepicker .ui-datepicker-title {
		line-height: 24px;
		margin: 6px;
		text-align: center;
		font-size:20px; font-weight:bold; font-family: 'Open Sans Condensed', sans-serif;
		border:none !important;
		color:#000;
	}
	.ui-widget-header .ui-datepicker-next .ui-icon {
		background: url("../images/arr-right.png") no-repeat scroll center center rgba(0, 0, 0, 0);
	}
	.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
		display: block;
		height: 35px;
		left: 8%;
		margin-left: 0;
		margin-top: 0;
		position: absolute;
		top: 20%;
		width: 17px;
		cursor:pointer;
		background: url("../images/arr-left.png") no-repeat scroll center center rgba(0, 0, 0, 0);
	}
	.ui-datepicker-calendar .ui-state-highlight  {
		background:rgb(221, 0, 4) !important;
		border:none !important;
	}
	
	.ui-datepicker-calendar .ui-state-active {
		border:none !important;
		color:#010004 !important;
		border: 2px solid #5b744d;
		border-radius:5px;
	}
	
	/*.ui-datepicker-calendar .ui-state-active {
		background:#69aa4e !important;
		border:none !important;
		color:#010004 !important;
		border: 2px solid #5b744d;
		border-radius:5px;
	}
	*/
	
	/*.ui-datepicker-calendar .ui-state-hover {
		background:#6da752!important;		
		color:#061705  !important;
		border: 2px solid #5b744d;
	}*/
	
	.ui-widget-content {
		background:rgb(246, 246, 246);
	}
	.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
		border:none	;
	}
	.ui-datepicker-prev {}
	.ui-widget {
		font-family:Arial,Tahoma,Verdana,Helvetica,sans-serif;
	}
	
	.ui-datepicker-header  .ui-state-hover {
		background:none;
		border:none;
		padding: 1px 1px 5px 0;		
	}
	.ui-datepicker-header  .ui-datepicker-prev.ui-state-hover .ui-icon{
		background: url("../images/arr-left.png") no-repeat scroll center center rgba(0, 0, 0, 0);
		border:none;
	}
	.ui-datepicker-header  .ui-datepicker-right.ui-state-hover .ui-icon{
		background: url("../images/arr-right.png") no-repeat scroll center center rgba(0, 0, 0, 0);
		border:none;
	}
/*1. ///////end: HTML elements///////*/
