﻿#demo-wrapper
{
    width: 100%;
    max-width: 680px;
    margin: 20px auto;
	height:auto;
}
#button-less
{
    margin-top: 20px;
}
#button-less .akordeon-item-head-container
{
    left: 0px !important;
}
.demobar
	{
	height: 90px;
	line-height: 90px;
	}
	.demobar .fleft
	{
	float: left;
	margin-left: 10px;
	}
	.demobar .fright
	{
	float: right;
	margin-top: 14px;
	margin-right: 10px;
	}
	
.akordeon
{
    width: 98%;
    border: solid 2px  #3f153d;
    color: White;
    font-family: Arial;
    font-size: 12px;
	margin:10px 5px;

}
.akordeon-item
{
    position: relative;
}
.akordeon-item .akordeon-item-head
{
    height: 35px;
	color:#FFF;
	background-color: #8c349d;
	background-image: -moz-linear-gradient(#8c349d, #3f153d); 
	background-image: -webkit-gradient(linear, left top, left bottom, from(#8c349d), to(#3f153d));	
	background-image: -webkit-linear-gradient(#8c349d, #3f153d);	
	background-image: -o-linear-gradient(#8c349d, #3f153d);
	background-image: -ms-linear-gradient(#8c349d, #3f153d);
	background-image: linear-gradient(#8c349d, #3f153d);
	 /*fix gradient for IE browser*/
	 filter:     progid:DXImageTransform.Microsoft.gradient(startColorstr=#8c349d, endColorstr=#3f153d);
    padding-top: 6px;
	font-size:14px;
}
.akordeon-item .akordeon-item-body
{
    background: #FFF; 
    border-bottom: none;
    overflow: hidden;
	color:#666;
	font-size:12px;
	height:auto;
	
	
}
.akordeon-icon
{
    width: 22px;
    height: 20px;
    background: #f2f2f2; /* Old browsers */
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f2f2f2), to(#cccccc));
    background-image: -moz-linear-gradient(#f2f2f2, #cccccc);
    background-image: -webkit-linear-gradient(#f2f2f2, #cccccc);
    background-image: -o-linear-gradient(#f2f2f2, #cccccc);
    background: -ms-linear-gradient(#f2f2f2, #cccccc);
    background: linear-gradient(#f2f2f2, #cccccc);
	border:1px solid #666;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 0;
    margin-top: 1px;
    float: left;
    cursor: pointer;

}
.akordeon-heading
{
    float: left;
    padding-left: 10px;
    padding-top: 2px;
    font-weight: bold;
}
.akordeon-icon span
{
    color: #666666;
    font-size: 24px;
    position: absolute;
    left: 5px;
    top: 2px;
    font-weight: bold;
    text-align: center;
}

.akordeon-item.expanded .akordeon-icon span
{
    top: 1px;
	border:1xp solid #999;
}
.akordeon-item-head-container
{
	width: 100%;
	position: absolute;
	left: -6px;
	cursor: pointer;
	top: 9px;
}

.akordeon-item.expanded .akordeon-item-body
{
    border-top: solid 1px #5c5c5c;
}
.akordeon-item.collapsed
{
}

.akordeon-item.expanded .akordeon-heading
{
    color: #FFF;
}

.akordeon-item.expanded .akordeon-item-head
{
    background: #3f153d !important; 
}
.akordeon-item-content
{
    padding: 10px;
    min-height: 400px;
	overflow:hidden;
	font-size:12px;
	line-height:18px;
	clear: both;
	
}
.akordeon-item-content p{ padding:3px;}
.akordeon-item-content ul{ padding:0; margin:0; list-style:square;}
.akordeon-item-content li{ padding:5px 0;}
.akordeon-item-content .img-fac {padding:0; margin:0; height:auto}
.akordeon-item-content .fac-txt{ width:50px; height:auto; min-height:50px;}
.akordeon-item-content .img-fac img{float:left; padding:0;}
.akordeon-item-content .img-fac .icon{float:left; width:50px; height:90px; margin:0 10px;font-size:11px; text-align:center; line-height:13px; }
.akordeon-item-content .map-link{float:left; margin:10px 0;}
.akordeon-border-bottom
{
    border-bottom: solid 1px black;
}
.akordeon-border-top
{
    border-top: solid 1px black;
}
.akordeon-item.expanded .akordeon-item-body.akordeon-border-bottom
{
    border-bottom: solid 1px black !important;
}

.line-dotted { border-bottom:1px dotted #999; width:99%; margin:10px 0;}


/* Start Pagination */
#pagination {display: block; margin: auto; width: 100%;; height: auto; margin:auto; padding:5px 0 30px 0;  }
#pagination table td{ border:0; }
#pagination table{ margin:0;}
#pagination a{ color:#333;  }
#pagination .left{float:left; width:45%;display:block; margin-left:10px;}
#pagination .right{float:right; width:35%; display:block; margin-right:6px; }

#pagination-body, #pagination-table, #pagination-text, #pagination-numbers {display: block; position: relative; margin: 0; width: 100%; height: auto; padding: 0;color:#666; border:none;}
.pagination-number { text-decoration:none; color: #666; text-shadow: 0px 1px 0px rgba(255,255,255,0.59); font-size: 11px; display: inline; position: relative; margin: 0px 1px 0px 1px; width: auto; height: auto; background: #ececec; padding: 6px; outline: none; border: 1px solid #d8d8d8; border-bottom: 1px solid #ccc; border-radius: 3px; cursor: pointer; -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.57); -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.57); -o-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.57); box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.57);
}

.pagination-number:hover {color: #888; text-shadow: 0px 1px 0px rgba(255,255,255,0.69); -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.75); -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.75); -o-box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.75); box-shadow: 0px 2px 2px rgba(0,0,0,0.027), inset 0px 1px 0px rgba(255,255,255,0.69), inset 0px -1px 0px rgba(0,0,0,0.0187), inset 0px 14px 13px rgba(255,255,255,0.75);}

.pagination-number:active {color: #696969; text-shadow: 0px 1px 0px rgba(255,255,255,0.53); border: 1px solid #d2d2d2; border-bottom: 1px solid #d8d8d8; -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 1px 6px rgba(0,0,0,0.07), inset 0px -14px 13px rgba(255,255,255,0.20); -moz-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 1px 6px rgba(0,0,0,0.07), inset 0px -14px 13px rgba(255,255,255,0.20); -o-box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 1px 6px rgba(0,0,0,0.07), inset 0px -14px 13px rgba(255,255,255,0.20); box-shadow: 0px 1px 0px rgba(255,255,255,0.58), inset 0px 1px 6px rgba(0,0,0,0.07), inset 0px -14px 13px rgba(255,255,255,0.20);}

.pagination-number.dots, .pagination-number.dots:hover, .pagination-number.dots:active {color: #666; text-shadow: 0px 1px 0px rgba(255,255,255,0.59); background: none; border: none; border-radius: 0px; -webkit-box-shadow: none; -moz-box-shadow: none; -o-box-shadow: none; box-shadow: none; padding: 9px 2px 3px 2px; cursor: default;}

/*For IE 8/9 */
#pagination .left{ width:46%;margin-left:1px\0/;}
#pagination .right{ width:38%; margin-right:1px\0/; }

/*Checking*/

#guideline {
	width:100%; 
	max-width:190px; 
	margin-right:10px; 
	float:left
	}
#guideline .box {
	width:190px; 
	border-top:1px dashed #999; 
	font-size:16px; 
	padding-top:7px;
	}	
#guideline .upon, .availiable, .not-avail {
	font-size:11px; 
	height:35px;}

#guideline .upon .icon{
	margin-top:4px;
	background:#9ed9f9; 
	width:20px; 
	height:20px; 
	border:1px solid #999; 
	float:left; 
	margin-right:5px;
	}

#guideline .box .txt{
	float:left; 
	width:82%;
	height:25px;
	line-height:15px;
	}
#guideline .availiable .icon{
	margin-top:4px;
	background:#dbfbaf; 
	width:20px; 
	height:20px; 
	border:1px solid #999; 
	float:left; 
	margin-right:5px;
	}	
	
#guideline .availiable .txt{
	float:left; 
	width:80%; 
	height:25px;
	line-height:30px;
	}
#guideline .not-avail{
	border-bottom:1px dashed #999;
	}	
	
#guideline .not-avail .icon{
	margin-top:4px;
	background:#ffa5a4; 
	width:20px; 
    height:20px; 
	border:1px solid #999; 
	float:left; 
	margin-right:5px;
	}	

#guideline .not-avail .txt{
	float:left; 
	width:80%; 
	height:25px; 
	line-height:30px;
}

#demo-wrapper .btn-booking a{
	
    background: #8c349d; /* Old browsers */
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#8c349d), to(#3f153d));
    background-image: -moz-linear-gradient(#8c349d, #3f153d);
    background-image: -webkit-linear-gradient(#8c349d, #3f153d);
    background-image: -o-linear-gradient(#8c349d, #3f153d);
    background: -ms-linear-gradient(#8c349d, #3f153d);
    background: linear-gradient(#8c349d, #3f153d);
	border:1px solid #3f153d;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
	font-style:italic;
	width:190px;
    height:50px; 
	float:left; 
	font-size:24px; 
	line-height:40px; 
	margin-top:15px;
	text-align:center;
	text-decoration:none;
	color:#FFF;
	line-height:50px;
	
	 
	}

#demo-wrapper .btn-booking a:hover, .btn-booking a:active{ 
    background: #3f153d; /* Old browsers */
	background-image:linear-gradient(bottom, #3f153d 0%, #8c349d 52%);
	background-image:-moz-linear-gradient(bottom, #3f153d 0%, #8c349d 52%);
	background-image:-webkit-linear-gradient(bottom, #3f153d 0%, #8c349d 52%);
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
	color:#FFF; 
	text-decoration:none;
	
	}


	
/* Start Calender */

#demo-wrapper #checking {
	width:100%;
	 max-width:420px; 
	 float:right; 
	 height:auto; 
	 padding:10px; 
	 background:#ececec; 
	 border:1px solid #999;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	 border-radius:5px; 
	 vertical-align:text-bottom; 
	 margin-top:20px;
	}

.cal-height { height:570px; _height:570px;}
#demo-wrapper .calender {
	
	border-radius:7px;
	-webkit-border-radius:7px;
	-moz-border-radius: 7px; 
	float:left;
	width:100%; 
	max-width:180px;
	height:255px;
	display:block; 
	position:relative;
	margin:12px;
	}
#demo-wrapper	.box-calendar { height:570px;}	
#demo-wrapper .calender table{
	margin: auto; 
	float: left; 
	width:100%; 
	max-width:180px; 
	height:auto;
	border:3px solid #999;
}
#demo-wrapper .header-cal {
	width:100%;
    height: 25px;
    background: #fbfbfb; 
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fbfbfb), to(#c4c2c3));
    background-image: -moz-linear-gradient(#fbfbfb, #c4c2c3);
    background-image: -webkit-linear-gradient(#fbfbfb, #c4c2c3);
    background-image: -o-linear-gradient(#fbfbfb, #c4c2c3);
    background: -ms-linear-gradient(#fbfbfb, #c4c2c3);
    background: linear-gradient(#fbfbfb, #c4c2c3);
    float: left;
	color:#666;
	font-size:12px;
	line-height:25px;
	text-transform:uppercase;
	text-align:center;

	 /*fix gradient for IE browser*/
	 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#f2f2f2, endColorstr=#cccccc);

	}
#demo-wrapper .calender td{ 
	width:23px; 
	height:23px; 
	background:#FFF; 
	color:#ccc; 
	font-size:12px; 
	border:1px solid #ddd; 
	text-align:center; 
	line-height:25px;
	}
#demo-wrapper .calender th { 
	width:25px; 
	height:25px; 
	background:#FFF; 
	color:#ccc; 
	font-size:12px; 
	border:1px solid #ddd; 
	text-align:center; 
	line-height:25px;
	}
#demo-wrapper .calender th {color:#000;}
#demo-wrapper .calender .upon { background:#9ed9f9;color:#000; }
#demo-wrapper .calender .not-avail { background:#ffa5a4;color:#000; }
#demo-wrapper .calender .avail { background:#dbfbaf;color:#000; }

/* Search form checking*/

 .form-checking {
	margin:auto;
	width:100%;
	height:auto;
	padding-top:30px;
	}
.form-checking form{ 	
	width:100%; 
	max-width:500px; 
	height:auto; 
	padding:10px; 
	margin:20px 0 20px 62px; 
	background:#EEEEEE;
	text-align:center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	 border-radius:5px;
	 float:left;
	 border:1px solid #ddd;
}
	
#demo-wrapper .form-checking div { 
	width:100%;
	margin:3px; 
	auto;float:left
	}
#demo-wrapper .form-checking label { 
	width:35%; 
	display:block; 
	float:left; 
	padding:6px; 
	text-align:right; 
	font-size:11px;
	}
#demo-wrapper .form-checking h1{ 
	border-bottom:1px solid #ddd; 
	width:100%; 
	padding-bottom:10px; 
	margin-bottom:10px;
	}

#demo-wrapper .form-checking select, .select-short   select {
	-webkit-appearance: none;
	-webkit-box-shadow: 
		inset 0 1px 0 rgba(255, 255, 255, 0.6),
		0 1px 0 rgba(0, 0, 0, 0.2),
		0 0 0 1px rgb(150, 150, 150),
		0 1px 2px rgba(0, 0, 0, 0.25);
	background-position: right center, left top;
	background-repeat: no-repeat, repeat-x;
	background-image:
		url('../images/arrow.png'),
		-webkit-gradient(
			linear,
			left top,
			left bottom,
			from(rgb(240, 240, 240)),
			to(rgb(210, 210, 210))
		);
	border-radius: 3px;
	border: 1px solid #ddd;
	-moz-border-radius:3px;
	 -webkit-border-radius:3px;
	 color: rgb(80, 80, 80);
	font-size: 11px;
	font-weight: bold;
	outline: 0;
	padding-left: 3px;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
/* for this page only */
	height: 25px;
	width: 45%;
	display: block;
	margin: 4px 0px;
	line-height:25px;
	float:left;
}

#demo-wrapper .form-checking .select-short { 
	width:20%; 
	float:left; 
	display:inline-block;
	margin: 4px 8px 4px 0;
	}

/* fix input select in firefox*/	
@-moz-document url-prefix() { 
  .form-checking   select {
	padding:4px;
  }
  
}

#demo-wrapper .form-checking input[type=text] {
	-webkit-appearance: none;
	-webkit-box-shadow:
		0 -1px 0 rgba(0, 0, 0, 0.3),
		inset 0 1px 1px rgba(0, 0, 0, 0.2),
		0 0 0 1px rgb(140, 140, 140),
		0 2px 0 rgba(255, 255, 255, 0.3);
	-webkit-transition-property: background-color, color;
	-webkit-transition-duration: 0.4s;
	border-radius: 3px;
	font: 11px/1 'Lucida Grande', sans-serif;
	color: rgb(90, 90, 90);
	background:
		-webkit-gradient(
			linear,
			left top,
			left bottom,
			from(rgba(0, 0, 0, 0.1)),
			to(rgba(0, 0, 0, 0))
		)
		rgb(245, 245, 245);
	background-image: url("../images/sw_calendar.png");
	background-repeat: no-repeat;
	background-position: 95% 50%;/* for this page only */
	height: 25px;
	width: 45%;
	display: block;
	margin: 4px 5px;
	line-height:25px;
	border: 1px solid #ddd;
}

#demo-wrapper .form-checking button[type="submit"] {
	cursor:pointer;
	width:20%;
    background: #8c349d; /* Old browsers */
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#8c349d), to(#3f153d));
    background-image: -moz-linear-gradient(#8c349d, #3f153d);
    background-image: -webkit-linear-gradient(#8c349d, #3f153d);
    background-image: -o-linear-gradient(#8c349d, #3f153d);
    background: -ms-linear-gradient(#8c349d, #3f153d);
    background: linear-gradient(#8c349d, #3f153d);
	border:1px solid #3f153d;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
	color:#FFF;
	margin: ;	
	padding:5px;
	float:left;
	font-weight:bold;
	text-transform:uppercase;
	
}

#demo-wrapper .form-checking  button[type="submit"]:hover {
    background: #3f153d; /* Old browsers */
	background-image:linear-gradient(bottom, #3f153d 0%, #8c349d 52%);
	background-image:-moz-linear-gradient(bottom, #3f153d 0%, #8c349d 52%);
	background-image:-webkit-linear-gradient(bottom, #3f153d 0%, #8c349d 52%);
	-webkit-transition:background 0.3s ease-in-out;
	-moz-transition:background 0.3s ease-in-out;
	transition:background-color 0.3s ease-in-out;
}
#contact-form button[type="submit"]:active {
	box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);
}

 /* Elastislide Style */
.intro {padding-left:10px; margin:0;}
.icon-detail{width:100%; padding:5px; margin-bottom:10px;}
.icon-fev{float:left; padding-left:30px;}
.group-btn{float:right; width:50%; }

#gallery-detail {	
	width: 100%;
	max-width: 630px;
	margin: 0 auto;
	position: relative;} 

#gallery-detail .clr {
	clear: both;
	float: none;
}

#gallery-detail .tumbnail-carousel {
	width: 100%;
	margin: 0 auto;
	position: relative;
}

#gallery-detail .gallery {
	width: 100%;
	max-width: 630px;
	margin: 0 auto;
	position: relative;
	border:3px solid #ccc;
}

#gallery-detail .lt-ie8 .elastislide-list {
	display: none;
	border-top:3px solid #ccc;
	padding-top:3px;
}


/* Elastislide Style */

#gallery-detail .elastislide-list {
	list-style-type: none;
	display: none;
}

#gallery-detail .no-js .elastislide-list {
	display: block;
}

#gallery-detail .elastislide-carousel ul li {
	min-width: 20px; /* minimum width of the image (min width + border) */
}

#gallery-detail .elastislide-wrapper {
	position: relative;
	background-color: #FFF;
	margin: 0 auto;
	min-height: 60px;
}

#gallery-detail .elastislide-wrapper.elastislide-loading {
	background-image: url(../images/loading.gif);
	background-repeat: no-repeat;
	background-position: center center;
}

#gallery-detail .elastislide-horizontal {
	padding: 2px 40px;
}

#gallery-detail .elastislide-vertical {
	padding: 40px 10px;
}

#gallery-detail .elastislide-carousel {
	overflow: hidden;
	position: relative;
}

#gallery-detail .elastislide-carousel ul {
	position: relative;
	display: block;
	list-style-type: none;
	padding: 0;
	margin: 0;
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	-o-transform: translateX(0px);
	transform: translateX(0px);
}

#gallery-detail .elastislide-horizontal ul {
	white-space: nowrap;
}

#gallery-detail .elastislide-carousel ul li {
	margin: 0;
	-webkit-backface-visibility: hidden;
}

#gallery-detail .elastislide-horizontal ul li {
	height: 100%;
	display: inline-block;
}

#gallery-detail .elastislide-vertical ul li {
	display: block;
}

#gallery-detail .elastislide-carousel ul li a {
	display: inline-block;
	width: 100%;
}

#gallery-detail .elastislide-carousel ul li a img {
	display: block;
	border: 2px solid #FFF;
	max-width: 100%;
}

/* Navigation Arrows */

#gallery-detail .elastislide-wrapper nav span {
	position: absolute;
	background: #999 url(../images/nav.png) no-repeat 4px 3px;
	width: 23px;
	height: 23px;
	border-radius: 50%;
	text-indent: -9000px;
	cursor: pointer;
	opacity: 0.8;
}

#gallery-detail .elastislide-wrapper nav span:hover {
	opacity: 1.0
}

#gallery-detail .elastislide-horizontal nav span {
	top: 50%;
	left: 10px;
	margin-top: -11px;
}

#gallery-detail .elastislide-vertical nav span {
	top: 10px;
	left: 50%;
	margin-left: -11px;
	background-position: -17px 5px;
}

#gallery-detail .elastislide-horizontal nav span.elastislide-next {
	right: 10px;
	left: auto;
	background-position: 4px -17px;
}

#gallery-detail .elastislide-vertical nav span.elastislide-next {
	bottom: 10px;
	top: auto;
	background-position: -17px -18px;
}


#gallery-detail .demo-4 .elastislide-horizontal {
	background-color: transparent;
}


#gallery-detail .demo-4 .elastislide-horizontal.elastislide-loading {
	background-image: url(../images/loading_dark.gif);
}

#gallery-detail .demo-4 .elastislide-carousel ul li a{
	/*padding: 2px;*/
}

#gallery-detail .demo-4 .elastislide-carousel ul li a img {
	border: none;
	box-shadow: 0 1px 2px #FFF;
}

#gallery-detail .demo-4 .elastislide-wrapper nav span {
	background-color: #666;
}

#gallery-detail .demo-4 .image-preview img {
	max-width: 100%;
	display: block;
}

#gallery-detail .demo-4 .elastislide-carousel ul li.current-img a img {
	box-shadow: 0 0 3px 2px rgba(62,235,255,0.8);
}



/* screen on ipad*/
@media screen and (max-width: 768px) { 


#demo-wrapper  #checking { float:left; width:100%;} 
.form-checking form{ margin:20px 0 20px 0px; width:95%; }
.icon-fev{float:left; padding-left:10px; }
#gallery-detail .group-btn{width:70%; }
#gallery-detail {	width: 97%; clear:both;}
#gallery-detail .gallery {width: 97%;}
.group-btn{float:right; width:65%; }
.icon-detail { clear:both}
#demo-wrapper	.box-calendar { height:800px;}	


}

/*iphone5----------- */
@media all and (max-width: 605px)  {
#demo-wrapper #checking { float:left; width:95%;} 
.form-checking form{ margin:20px 0 20px 0px; width:96%; }
.form-checking form h1{ font-size:14px; }
.calender {
	float:left;
	width:100%; 
	margin:3px;
	 }
#pagination .left{ width:50%}
#pagination .right{ width:40%}
.group-btn { width:70%; float:right; display:block;  }
.icon-detail { clear:both}
#gallery-detail { clear:both;}
#demo-wrapper	.box-calendar { height:800px;}	
	   }
	   
/* screen on iphone landscape*/
@media screen and (max-width: 480px) { 
#checking { float:left; width:95%;} 
.form-checking form{ margin:20px 0 20px 0px; width:96%; }
.form-checking form h1{ font-size:14px; }
.calender {
	float:left;
	width:100%; 
	margin:3px;
	 }
#pagination .left{ width:50%}
#pagination .right{ width:40%}
.group-btn { width:100%; float:left; display:block; margin-left:10px; }
.icon-detail { clear:both}
#gallery-detail { clear:both;}
#demo-wrapper	.box-calendar { height:1400px;}	
}

/* screen on smartphone*/
@media screen and (max-width: 320px) { 
#checking { float:left; width:92%;} 
.form-checking form{ margin:20px 0 20px 0px; width:92%; }
.form-checking button[type="submit"] { width:40%;}
.form-checking input[type=text] { width:50%;}
.form-checking select {width:50%;}
#pagination .left{ margin:10px 4px; width:90%;}
#pagination .right{  float:left;width:90%; margin:10px 4px;}
.icon-fev{float:left; display:block; }
.group-btn { width:100%; float:left;display:block; }
.group-btn img{  float:left; display:line-block; }
.icon-detail { clear:both}
#gallery-detail { clear:both;}
#gallery-detail .elastislide-horizontal nav span {
	top: 40%;
	left: 10px;
	margin-top: -11px;
}
#gallery-detail .elastislide-horizontal {
	padding-top: 10px;
}

}
