﻿.accom {width:350px;}
.colleft{width:350px;margin-right:10px; height:auto; overflow:hidden;}
	p.t30 {padding-top:30px;}
	p.mb40 {margin-bottom:40px;}
	p.book50{margin:50px 0 0 70px;}
	.book15{margin:0;}
	.bookl30{margin:15px 0 0 30px;}
	p.tariff {color: #830404;
    font-family: "belgranoregular";
    font-size: 20px;
    }
	p.headingg{margin-bottom:5px;}
	p.secure{padding:20px 10px 0 0; font-family: 'open_sanssemibold';}
	p.securec{padding:0 50px 0 0;font-family: 'open_sanssemibold';text-align:center;}
.collefttop{height:auto; overflow:hidden;background:#f7f3e6;padding:15px 10px 26px 10px;margin-bottom:8px;}
p.guide {;font-family: 'open_sanssemibold';}
.colright{width:500px; height:auto; overflow:hidden;text-align:justify;padding-bottom:10px;}
.remodal {max-width:900px;}
.modalbottom{width:850px;height:auto; overflow:hidden;padding:5px 0 0 300px;}


.slider{
	min-width: 520px; /*Same as width of the large image*/
	position: relative;
	/*Instead of height we will use padding*/
	padding-top: 370px; /*That helps bring the labels down*/
	margin: 0px auto;
			}

/*Last thing remaining is to add transitions*/
.slider>img{
	position: absolute;
	left: 0; top: 0;
	transition: all 0.5s;
	height:370px;
}
.slider>img.w435{
	position: absolute;
	left: 0; top: 0;
	transition: all 0.5s;
	height:335px;
}
.slider>img.w447{
	position: absolute;
	left: 0; top: 0;
	transition: all 0.5s;
	height:332px;
}
.slider>img.h330{
	position: absolute;
	left: 0; top: 0;
	transition: all 0.5s;
	height:330px;
}
.slider>img.h336{
	position: absolute;
	left: 0; top: 0;
	transition: all 0.5s;
	height:336px;
}
.slider>img.h300{
	position: absolute;
	left: 0; top: 0;
	transition: all 0.5s;
	height:300px;
}

.slider>img.h212{
	position: absolute;
	left: 0; top: 0;
	transition: all 0.5s;
	height:212px;
	margin-left:74px;
}



.slider input[name=slide_switch] {
	display: none;
}
.wide{width:25%}
.slider>img.nar{border-left:80px solid white;border-right:120px solid white;}
.slider>img.narmore{border-left:90px solid white;border-right:130px solid white;border-bottom:10px solid white;}

.slider>img.nar435{border-left:80px solid white;border-right:120px solid white;height:335px;}
.slider>img.shallow{border-bottom:5px solid white;}
.slider>img.shallow225{border-top:75px solid white;height:225px;}
.slider>img.shallow352{border-top:75px solid white;height:352px;}
.slider>img.shallow225{border-top:75px solid white;height:225px;}
.slider>img.shallow225{border-top:75px solid white;height:225px;}
.slider label {
	/*Lets add some spacing for the thumbnails*/
	margin:10px 7px 0 0;
	float:left;
	cursor: pointer;
	transition: all 0.5s;
	}
.slider label.m13{margin-right:13px;}
.slider label.m15{margin-right:15px;}
.slider label.m9{margin-right:9px;}
.slider label.m8{margin-right:8px;}
.slider label.m5{margin-right:5px;}
.slider label.m14{margin-right:14px;}
.slider label.m48{margin-right:48px;}
.slider label.m20{margin-right:20px;}
.slider label.m26{margin-right:26px;}
.slider label.m11{margin-right:11px;}
.slider label.m3020{margin-right:20px;margin-left:37px;}
.slider label img.h80{height:80px;}
.slider label img.h75{height:75px;}
.slider label img{
	display: inline-block;height:85px;
}
.slider label.nar{width:60px;}
.slider label.wide{width:107px;}


/*Time to add the click effects*/
.slider input[name=slide_switch]:checked + label {
	-webkit-box-shadow: 3px 3px 10px -1px rgba(0,0,0,0.75);
-moz-box-shadow: 3px 3px 10px -1px rgba(0,0,0,0.75);
box-shadow: 3px 3px 10px -1px rgba(0,0,0,0.75);
	
}


.slider label img{
	display: block;
}

/*Clicking any thumbnail now should change its opacity(style)*/
/*Time to work on the main images*/
.slider input[name='slide_switch'] ~ img {
	opacity: 0;
	transform: scale(1.1);
}
/*That hides all main images at a 110% size
On click the images will be displayed at normal size to complete the effect
*/
.slider input[name='slide_switch']:checked+label+img {
	opacity: 1;
	transform: scale(1);
}
/*Clicking on any thumbnail now should activate the image related to it*/

/*We are done :)*/
