.linear-gradient (@col1:white, @col2:black) {
        background: @col1;
        background: -webkit-gradient(linear, 0 0, 0 bottom, from(@col1), to(@col2));
        background: -webkit-linear-gradient(@col1, @col2);
        background: -moz-linear-gradient(@col1, @col2);
        background: -ms-linear-gradient(@col1, @col2);
        background: -o-linear-gradient(@col1, @col2);
        background: linear-gradient(@col1, @col2);
        -pie-background: linear-gradient(@col1, @col2);
        behavior: url('PIE.htc');
}
.rounded-corners (@radius: 5px) {
	border-radius: @radius;
	-webkit-border-radius: @radius;
	-moz-border-radius: @radius;
	behavior: url('/assets/js/PIE.htc');
}
.rot_left  {
	margin: 20px;
	-moz-transform: rotate(5.5deg);  /* FF3.5+ */
	-o-transform: rotate(5.5deg);  /* Opera 10.5 */
	-webkit-transform: rotate(5.5deg);  /* Saf3.1+, Chrome */
	filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);  /* IE6,IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */
}
.rot_right {
	margin: 20px;
	-moz-transform: rotate(-5.5deg);  /* FF3.5+ */
	-o-transform: rotate(-5.5deg);  /* Opera 10.5 */
	-webkit-transform: rotate(-5.5deg);  /* Saf3.1+, Chrome */
	filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=-0.083);  /* IE6,IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=-0.083)"; /* IE8 */
}
.rot_left2  {
	margin: 20px;
	-moz-transform: rotate(8.5deg);  /* FF3.5+ */
	-o-transform: rotate(8.5deg);  /* Opera 10.5 */
	-webkit-transform: rotate(8.5deg);  /* Saf3.1+, Chrome */
	filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.087);  /* IE6,IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.087)"; /* IE8 */
}
.rot_right2 {
	margin: 20px;
	-moz-transform: rotate(-8.5deg);  /* FF3.5+ */
	-o-transform: rotate(-8.5deg);  /* Opera 10.5 */
	-webkit-transform: rotate(-8.5deg);  /* Saf3.1+, Chrome */
	filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=-0.087);  /* IE6,IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=-0.087)"; /* IE8 */
}


@corner_size: 7px;
@block_space: 10px;
@block_space2: 1%;
@text-color: #000;
@bg_col1: #fff;
@bg_col2: #03325c;
@orange1: #ffb000; // old #feb703
@orange2: darken(@orange1, 15%); // old #ef6622
@grey1: #ffffff;
@grey2: darken(@grey1, 15%);	

ul { margin-top: 0; }
html { font-size: 14px; height: 100%;}
body {
	margin: 0; padding: 0;
	height: 100%;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: @text-color;
}
img{
	max-width: 100%;
}

#globalwrapper{
	width: 100%;
	height: auto;
	min-height: 100%;
	position: relative;
	.linear-gradient(@bg_col1,@bg_col2); // old #028dc8,#042f5a
}
#page_container {
	width: 90%;
	margin: 0 auto;
	position: relative;
	#head {
		#logo {
			position: absolute;
			top: 20px;
			left: 10px;
		}
		#phone {
			position: absolute;
			top: 15px;
			right: 10px;
			color: #000;
			font-size: 120%;
			.big {
				font-size: 130%;
			}
			.small {
				font-size: 60%;
				color: lighten(@text-color, 70%);
			}
		}
		#menu1 {
			position: absolute;
			left: 220px;
			top: 43px;
			ul {
				list-style-type:none;
				padding: 0px;
				margin: 0px;
				float: left; /* to take height from child */
			}
			li {
				display: inline-block;
				float: left;
				margin: 0px 10px;
				a:hover {
					color: @text-color;
				}
			}
		}
		padding-top: 20px;
		margin: -10px auto @block_space auto;
		width: 100%;
		height: 47px;
		.rounded-corners(@corner_size);
	}
	#main_parts {
		margin: 0 0 10px 0;
		width: 100%;
		height: 150px;
		a {
			text-decoration: none;
		}
		.part {
			position: relative;
			width: 22%;
			margin-right: 4%;
			height: 100%;
			float: left;
			overflow: hidden;
			.part_content{
				position: relateive;
				height: 100%;
				background: #6A93D4;
				background: #226fb5;
				.rounded-corners(@corner_size);
				.linear-gradient(@grey1,@grey2);
				
				text-align: center;
				//opacity: 0.7;
				&:hover{
					.linear-gradient(@orange1,@orange2);
					opacity: 1;
				}
				img{
					display: block;
					margin: 0px auto 5px auto;
					height: 80%;
				}
				span {
					font-size: 130%;
					white-space: nowrap;
					padding: 5px 10px;
					text-align: center;
					background: black;
					opacity: 0.6;
					color: white;
					.rounded-corners(5px);
				}
			}
		}
		.part_last {
			margin-right: 0;
		}
	}
	#parts {
		margin: 0 0 10px 0;
		width: 100%;
		height: 30px;
		a {
			text-decoration: none;
		}
		.part {
			position: relative;
			width: 22%;
			margin-right: 4%;
			height: 100%;
			float: left;
			overflow: hidden;
			.part_content{
				position: relateive;
				height: 100%;
				background: #6A93D4;
				background: #226fb5;
				.rounded-corners(@corner_size);
				.linear-gradient(#ffffff,#e5e5e5);
				.linear-gradient(@grey1,@grey2);
				text-align: center;
				//opacity: 0.7;
				&:hover{
					.linear-gradient(@orange1,@orange2);
					opacity: 1;
				}

				img{display:none;}
				span {
					position: relative;
					top: 3px;
					font-size: 130%;
					white-space: nowrap;
					text-align: center;
					color: #000;
				}
			}
			.active {
					.linear-gradient(#feb703,#ef6622);
					.linear-gradient(@orange1,@orange2);
					opacity: 1;
			}
		}
		.part_last {
			margin-right: 0;
		}
	}
	#pagecontent{
		background:#e5e5e5;
		.rounded-corners(@corner_size);
		padding: 15px;
		#breadcrumbs {
			margin: 0 0 @block_space 0;
			padding:  0 0 @block_space 0;
			font-size: 80%;
			ul{
				list-style-type:none;
				padding: 0px;
				margin: 0px;
				float: left;
				li {
					float: left;
					padding: 0px 3px;
				}
				li {
					.B_Crumbwrpr {
						.B_crumb {
							background: #2c79bf;
							.rounded-corners(3px);
							padding: 2px 3px;
						}
						.B_firstCrumb {
							background: #2c79bf;
							.rounded-corners(3px);
							padding: 2px 3px;					
						}
						.B_currentCrumb {
							background: #3e75b6;
							background: #ccc;
							.rounded-corners(3px);
							padding: 2px 3px;
							text-decoration: none;
						}
						a {
							color: white;
						}
					}
				}
				.breadcrumb_separator {
					background: url("http://www.bosfor.org/assets/img/arrow.png") 50% 50% no-repeat;
				}
			}
		}
		#menu2 {
			margin: @block_space 0;
			height: 30px;
			ul {
				position: absolute;
				margin:0; 
				padding:0; 
				list-style:none;
				background: #bfbfbf;
				.rounded-corners(5px);
				li {
					float:left; 
					display:block; 
					width:160px; 
					height: 100%;
//					padding: 0 15px;
					position:relative;
					z-index:500; 
					&:hover {
						background: #2c79bf;
						.rounded-corners(5px);
					}
					a {
					    display:block; 
						padding: 5px; 
						text-align: center;
						text-decoration:none;
						color: white;
						&:hover {
							text-decoration: underline;
						}
						.selected {
							color:#f00;
						}
					}
					ul {
						position:absolute; 
						left:0; 
						display:none; 
//						margin:0 0 0 -1px; 
						padding:0; 
						list-style:none;
						background: #bfbfbf;
						.rounded-corners(5px);
						li {
							float:left; 
							&:hover {
								background: #2c79bf;
								.rounded-corners(5px);
							}
							a {
								display:block;  
								color: white;
								&:hover{
									text-decoration:underline
								}
							}
						}
					}
				}
			}
		}
		#content {
			text-align: justify;
			margin: @block_space 0;
			h2 {
				text-align: center;
			}
			hr {
				clear: both;
				margin: 20px;
			}
			p {
				img {
					padding: 20px;
				}
			}
		}
	}
}
#prefooter {
	margin: 79px 0 0 0;
	height: 10px;
}
#footer{
	height: 79px;
	width: 100%;
	position: absolute;
	bottom:0;
	background: url("/assets/img/sea.png");
	font-size: 70%;
	text-align: center;
}


//MOVABLE BLOCKS

#main_line1{
	height: 400px;
	width: 100%;
	margin: 0 0 @block_space 0;
	#slideshow{
		float: left;
		padding-right: @block_space;
		width: 61%;
		height: 100%;
		overflow: hidden;
		div {
			height: 100%;
			.rounded-corners(@corner_size);
		}
		#show {
			div {
				span {
					position: absolute;
					left: -10px;
					top: 70%;
					padding: 10px;
					padding-left: 20px;
					background: black;
					color: white;
					opacity: 0.6;
					.rounded-corners(@corner_size);
					font-size: 120%;
					a{
						color: white;
					}
				}
			}
			#slide1{
				background: url("/assets/img/slideshow/prep_tropic.jpg") 50%;
			}
			#slide2{
				background: url("/assets/img/slideshow/try_dive.jpg") 50%;
			}
			#slide3{
				background: url("/assets/img/slideshow/dry.jpg") 50%;
			}
			#slide4{
				background: url("/assets/img/slideshow/icediving.jpg") 50%;
			}
			#slide5{
				background: url("/assets/img/eLearning_header_main.jpg") 50%;
			}
		}
	}
	#main_newsblock{
		width: 37%;
		height: 100%;
		float: right;
		.linear-gradient(@grey1,@grey2);
		.rounded-corners(@corner_size);
		overflow-y: auto;
		.blocktitle {
			padding: 5px 10px;
			font-size: 140%;
		}
		.news_item {
			width:90%;
			margin: 3% 4%;
			.date {
				font-size: 70%;
			}
			.text {
				font-size: 90%;
				img{
					display: none;
					margin: 10px;
					float: left;
					height: 100px;
				}
			}
		}
	}
}	

#main_line2 {
	height: 220px;
	width: 100%;
	overflow: hidden;
	div {
		overflow: hidden;
		float:left;
		text-align: center;
		height: 100%;
	}
	#banner_aeris {
		width: 25%;
		background: white;
		.rounded-corners(@corner_size);
		img {
			height: 100%;
		}
	}
	#banner_el {
		width: 50%;
		padding: 0 @block_space2;
		img {
			height: 100%;
			.rounded-corners(@corner_size);
		}
	}
	#banner_iv {
		width: 23%;
		img {
			width: 100%;
			height: 100%;
			.rounded-corners(@corner_size);
		}
	}
}




.jshowoff-slidelinks {
	position: absolute;
	bottom: 0;
	right: 0;
	padding: 10px;
	a {
		font-size: 70%;
		color: white;
		text-decoration: none;
		margin: 3px; //between blocks
		padding: 2px 6px; // in block
		background: black;
		.rounded-corners(2px);
		&:hover {
			background: grey;
			color: black;
		}
	}
	.jshowoff-active{
		background: white;
		color: black;
	}
}


#gallery {
	.child {
		width: 20.5%;
		float: left;
		margin: 1%;
		padding: 0 1%;
		.image {	
			text-align: center;
			max-height: 85%;
			text-align: center;
			width: 100%;
			height: 190px;
			overflow: hidden;
			margin-bottom: 10px;	
			img {
				.rounded-corners;					
				max-height: 180px;
				*height: 120px;
				margin: 0;
				padding: 0;
			}
		}
		.text {
			margin: 5px 0 0 0;
			height: 35px;
			text-align: center;
			font-size: 90%;
		}
	}
}

#shopcatalog {
	.child {
		height: 200px;
		width: 28.33%;
		margin: 1%;
		padding: 1%;
		float: left;
		.rounded-corners;
		position: relative;
		.image {
			text-align: center;
			.rounded-corners;
			height: 200px;
			img {
				max-width: 90%;
				max-height: 70%;
				.rounded-corners;
			}
		}
		.text {
			margin-bottom: 10px;
			text-align: center;
			font-size: 90%;
		}
		.price {
			position: absolute;
			right: 10px;
			bottom: 10px;
			float: right;
			.nums {
				color: red;
				font-size: 120%;
			}
		}
	}
}