@import url('normalize.less');
@import url('settings.less');

header {
 height: 80px;
 background: @white;
 box-shadow: 0 3px 0 rgba(0,0,0,0.2);
 
 .w100;
 .rel;
 .zi(11);
 
	section {
	 padding: 0 20px;
	 max-width: @basew;
	 
	 .bx;
	 .w100;
	 .cmargin;
	 .rel;
	 .zi(15);
	 
		#logo {
		 margin: 27px 0 0 0;
		 max-width: 164px;
		 
		 .w100;
		 .block;
		 .fleft;
		 
			img {
			 .block;
			 .w100;
			}
		}
		
		.menu {
		 margin: 30px 0 0 20px;
		 color: @black;
		 
		 .fright;
		 .block;
		 .ntext;
		 .none;
		 
			img {
			 margin: 0 10px 0 0;
			 width: 20px;
			 
			 .block;
			 .fleft;
			}
		}
		
		nav {
		 background: none;
		 border: none;
		 box-shadow: none;
		 padding: 0 0 0 16px;
		 min-height: 80px;
		 max-width: 440px;
		 
		 .w100;
		 .fleft;
		 
		 
			ul {
			 .ulclear;
			 .block;
			}
			
			> ul {
			 .fleft;
			 
				> li {
				 .fleft;
				 
					> a {
					 color: @darkgray !important;
					 height: 80px;
						 
					 .lheight(78px);
					 .block;
					 .ntext !important;
					 
						&:hover {
						 color: @orange !important;
						}
					}
					
					&.selected {
						> a {
						 color: @orange !important;
						}
					}
				}
				
				&#lang {
				 margin: 0 10px 0 0;
				 
					li {
					 margin: 0 5px 0 0;
					}
				}
				
				&#nav {
					> li {
					 margin: 0 8px 0 0;
					 
						&.selected {
							> a {
							 background: url(../images/darr.png) no-repeat center 57px;
							background-size: auto 7px;
							}
						}
						
						> a {
							&:hover {
							 background: url(../images/darr.png) no-repeat center 57px;
							 background-size: auto 7px;
							}
						}
						
						> div {
						 margin: 0;
						 left: 0;
						 top: 80px;
						 
						 .none;
						 .abs;
						 .w100;
						 .ohidden;
						 
							div {
							 padding: 20px;
							 background: @orange;
							 box-shadow: inset 0 3px 0 rgba(0,0,0,0.1);
							 
							 .ohidden;
							 .bx;
							 .w100;
							 
								a {
								 color: @white;
								 
								 .ntext;
								 
									&:hover {
									 color: @black;
									}
								}
								
								ul {
								 padding: 0 20px 0 0;
								 width: 25%;
								 
								 .fleft;
								 .bx;
								 
									li {
										strong {
										 border-bottom: 2px solid white;
										 padding: 0 0 10px;
										 margin: 0 0 10px;
										 
										 .block;
										 .normal;
										 .fsize(12pt);
										}
										
										&:last-child {
											strong {
											 border-bottom: none;
											}
										}
									}
								}
							}
							
							> img {
							 .block;
							 .w100;
							}
						}
					}
				}
			}
		}
		
		aside {
		 max-width: 280px;
		 
		 .fleft;
		 .w100;
		 
			a {
			 margin: 30px 0 0;
			 
			 .ntext !important;
			 .lspacing;
			 .block;
			 .fright;
			 
				&.consult {
				 color: @white;
				 background: @orange;
				 margin: 20px 0 0;
				 padding: 6px 0 0;
				 width: 170px;
				 height: 40px;
				 
				 .lheight(26px);
				 .fsize(10pt);
				 .center;
				 .bx;
				 .radius(4px);
				 .fleft;
				 
					&:hover {
					 background: @darkgray;
					}
				}
			}
		}
	}
}

aside {
 .w100;
 .ohidden;
 .rel;
 .zi(10);
 
	&.slider {
	 height: 380px;
	 
	 .rel;
	 .zi(10);
	 
		div {
		 margin: 0 0 0 -1060px;
		 width: 2120px;
		 height: 380px;
		 left: 50%;
		 top: 0;
		
		 .abs;
		 .ohidden;
		 .zi(10);
		
			ul {
			 height: 380px;
			 
			 .ulclear;
			 .block;
			 .ohidden;
			 .w100;
			 .rel;
			 .block !important;
			 
				li {
				 height: 380px;
				 top: 0;
				 
				 .abs;
				 .fleft;
				 
					&:nth-child(1) {
					 left: 0;
					}
					
					&:nth-child(2) {
					 left: 475px;
					}
					
					&:nth-child(3) {
					 left: 970px;
					}
				}
			}
		}
		
		.overlay {
		 margin: 0 0 0 -1056px;
		 height: 380px;
		 left: 50%;
		 top: 0;
		
		 .zi(11);
		 .abs;
		 .block;
		}
		
		dl {
		 color: @white;
		 padding: 40px 0 0;
		 max-width: @basew - 40;
		 
		 .rel;
		 .w100;
		 .w100;
		 .cmargin;
		 .zi(12);
		 .bx;
		 .ohidden;
		 
			dt {
			 padding: 40px 0 0;
			 width: 220px;
			 
			 .fsize(64pt);
			 .fleft;
			 .block;
			 .bx;
			}
			
			dd {
			 padding: 0;
			 width: 680px;
			 
			 .fsize(18pt);
			 .lheight(40px);
			 .fleft;
			 .bx;
			 
				p {
				 .lheight(27px);
				}
			}
		}
		
		h1 {
		 color: @white;
		 margin: 10px 0 0;
		 
		 .rel;
		 .zi(12);
		 .center;
		 .fsize(32pt);
		 .lspacing;
		}
	}
	
	&#map {
	 background: @white;
	 box-shadow: 0 0 20px rgba(0,0,0,0.3);
	 border: 20px solid @white;
	 width: 96%;
	 height: 90%;
	 left: 2%;
	 top: 5%;
	 
	 .fixed;
	 .bx;
	 .zi(12);
	 .none;
	 
		iframe {
		 left: 0;
		 top: 0;
		 height: 100%;
		 
		 .w100;
		 .abs;
		 .zi(12);
		}
		
		> a {
		 background: @white;
		 box-shadow: 0 0 3px rgba(0,0,0,0.3);
		 padding: 10px;
		 width: 20px;
		 height: 20px;
		 right: 10px;
		 top: 10px;
		 
		 .abs;
		 .zi(13);
		 .block;
		 
			img {
			 width: 20px;
			 .block;
			}
		}
	}
}

article {
 .w100;
 .ohidden;
 
	&.white {
	 background: @white;
	}
	
	&#bnrs {
		section {
		 padding: 40px 0;
		 max-width: @basew + 20;
		
		 .w100;
		 .ohidden;
		 .cmargin;
		
			> ul {
			 max-width: @basew + 20;
			 
			.ulclear;
			.cmargin;
			.block;
			.ohidden;
			
				> li {
				 margin: 0 10px;
				 width: 300px;
				 
				 .fleft;
				 .ohidden;
				 
					> div {
					 padding: 0 20px;
					 background: @white;
					 height: 320px;
					 
					 .radius(6px);
					 .ohidden;
					 .bx;
					 .rel;
					 
						> a {
						 margin: 0 0 8px -20px;
						 border-bottom: 2px solid @beige;
						 height: 140px;
						 width: 300px;
						 
						 .block;
						 .ohidden;
							
							img {
							 height: 140px;
							 
							 .block;
							 .cmargin;
							}
							
							&.next, &.prev {
							 border: none;
							 width: 7px;
							 height: 11px;
							 top: 25px;

							 .abs;
							}
							
							&.prev {
							 background: url(../images/larr.png) no-repeat center top / 7px auto;
							 right: 40px;
							 
								&:hover {
								 background: url(../images/larr_hover.png) no-repeat center top / 7px auto;
								}
							}
							
							&.next {
							 background: url(../images/rarr.png) no-repeat center top / 7px auto;
							 right: 20px;
							 
								&:hover {
								 background: url(../images/rarr_hover.png) no-repeat center top / 7px auto;
								}
							}
						}
						
						h2 {
							a {
							 .ntext;
							}
						}
					}
					
					> span {
					 height: 30px;
					 
					 
					 .block;
					}
					
					&:nth-child(1) {
						> span {
						 background: url(../images/tiptail1.png) no-repeat center top / 60px auto;
						}
					}
					
					&:nth-child(2) {
						> span {
						 background: url(../images/tiptail2.png) no-repeat center top / 60px auto;
						}
					}
					
					&:nth-child(3) {
						> span {
						 background: url(../images/tiptail3.png) no-repeat center top / 60px auto;
						}
					}
					
					&.testimonials {
						> div {
							h2 {
							 margin: 0 0 0 -20px;
							 padding: 0 0 0 20px;
							 
							 .bx;
							}
							
							ul {
							 .ulclear;
							 .block;
							}
							
							p {
							 margin: 0;
							}
						}
					}
					
				}
			}
		}
	}
	
	&#slider {
		section {
		 padding: 40px 0;
		 max-width: @basew;
		 
		 .w100;
		 .cmargin;
		 .rel;
		 .bx;
		 
			ul {
			 height: 400px;
			 
			 .ulclear;
			 .cmargin;
			 .w100;
			 .ohidden;
			 .radius(6px);
			 .rel;
			 .zi(10);
			 
				li {
				 height: 400px;
				 
				 .ohidden;
				 .rel;
				 .w100 !important;
				 
					strong {
					 color: @white;
					 background: rgba(0,0,0,0.6);
					 padding: 5px 0;
					 left: 0;
					 bottom: 0;
					 
					 .fsize(16pt);
					 .block;
					 .abs;
					 .w100;
					 .center;
					 .normal;
					}
					
					img {
					 margin: 0 0 0 -470px;
					 left: 50%;
					 top: 0;
					 .abs;
					}
				}
			}
			
			> a {
			 margin: -20px 0 0;
			 width: 26px;
			 height: 40px;
			 top: 50%;
			 
			 .abs;
			 .zi(11);
			 .block;
			 
				&.prev {
				 background: url(../images/larr_big.png) no-repeat center top / 26px auto;
				 left: 20px;
				 
					&:hover {
					 background: url(../images/larr_big_hover.png) no-repeat center top / 26px auto;
					}
				}
				
				&.next {
				 background: url(../images/rarr_big.png) no-repeat center top / 26px auto;
				 right: 20px;
				 
					&:hover {
					 background: url(../images/rarr_big_hover.png) no-repeat center top / 26px auto;
					}
				}
			}
		}
	}
	
	&#text {
	 padding: 40px 0 60px;
	 
		section {
		 max-width: @basew;
		 
		 .w100;
		 .cmargin;
		 .ohidden;
		 
			&.simple {
			 max-width: @basew - 100;
			
				img {
				 margin: 5px 20px 20px 0;
				 
				 .radius(4px);
				}
				
				p {
				 margin-left: 80px;
				}
			}
			
			&.thcols {
			 .cols(3);
			}
			
			form {
			 padding: 0 20px;
			 max-width: 460px;
			 
			 .w100;
			 .block;
			 .ohidden;
			 .cmargin;
			 .bx;
			 
				p {
				 margin: 0 0 10px;
				 
				 .block;
				 .ohidden;
				 .w100;
				}
			}
			
			label {
			 color: @orange;
			 padding: 0 0 5px;
			 
			 .block;
			 .fsize(12pt);
			}
			
			input {
				&[type="text"], &[type="email"], &[type="number"] {
				 border: 1px solid @darkgray * 2.5;
				 text-indent: 10px;
				 max-width: 320px;
				 height: 40px;
				 
				 .radius(4px);
				 .w100;
				 .bx;
				}
				
				&[type="radio"], &[type="checkbox"] {
				 margin: 4px 5px 0 0;
				 
				 .fleft;
				}
			}
			
			select {
			 text-indent: 5px;
			 border: 1px solid @darkgray * 2.5;
			 height: 40px;
			 
			 .w100;
			 .radius(4px);
			}
			
			textarea {
			 border: 1px solid @darkgray * 2.5;
			 padding: 10px;
			 min-height: 140px;
			 
			 .radius(4px);
			 .w100;
			 .bx;
			}
			
			button {
			 color: @white;
			 background: @orange;
			 padding: 0 20px;
			 height: 40px;
			 
			 .fsize(11pt);
			 .os;
			 .bold;
			 .radius(4px);
			}
			
			.alert {
			 .center;
			 .fsize(24pt);
			 .lspacing;
			}
			
			.alert-danger {
			 color: @orange;
			}
			
			.alert-success {
			 color: spin(@orange, 180);
			}
			
			table {
			 .cmargin;
			 
					td {
					 border-bottom: 1px solid @darkgray * 3;
					 padding: 10px 0;
					 
						p {
						 margin: 0;
						}
						
						&:first-child {
						 color: @orange;
						}
					}
					
					tr:last-child {
						td {
						 border: none;
						}
					}
					
					&.ourteam {
						td {
							&:first-child {
							 color: @black;
							}
						}
					}
			}
		}
		
		h2, h3, h4 {
		 color: @orange;
		 padding: 10px 0;
		 max-width: @basew;
		 
		 .fsize(16pt);
		 .cmargin;
		 .w100;
		 .lspacing;
		}
		
		h3 {
		 .fsize(14pt);
		}
		
		h4 {
		 .fsize(12pt);
		}
		
		&.programs {
		 padding: 40px 0 20px;
		 
			> div {
			 max-width: @basew;
		 
			 .cmargin;
			 .ohidden;
			 .rel;
			 
				> aside {
				 padding: 5px 0 0 40px;
				 margin: 0 20px 0 0;
				 width: 320px;
				 
				 .bx;
				 .fleft;
				 
					nav {
					 border: 1px solid @orange;
					 padding: 15px 20px;
					 width: 280px;
					 
					 .radius(3px);
					 .bx;
					 
						a {
						 border-bottom: 1px solid @beige / 1.1;
						 padding: 5px 0;
						 color: @black;
						 .block;
						 .ntext;
						 .fsize(12pt);
						 
							&:last-child {
							 border: none;
							}
							
							&:hover {
							 color: @orange;
							}
						}
						
						&.fix {
						 top: 20px;
						 
						 .fixed;
						}
					}
				}
				
				> div {
				 max-width: 600px;
				 .fleft;
				
					section {
					 margin-bottom: 40px;
					 border-bottom: 1px solid @beige / 1.1;
					
						> img {
						 margin: 5px 20px 0 0;
						 background: @beige;
						 max-width: 320px;
						 
						 .fleft;
						}
						
						> div {
						 padding: 0 80px;
						 
						 .ohidden;
						 .none;
						 
							> img {
							 .w100;
							}
							
							p {
							 margin-left: 0;
							}
						}
						
						.readmore {
						 margin: -10px 0 40px;
						 padding: 0 0 0 80px;
						 
						 .block;
						 .ohidden;
						 .bold;
						 
							span, ins, img {
							 .fleft;
							 .block;
							}
							
							img {
							 margin: 7px 0 0 5px;
							 width: 10px;
							}
							
							ins {
							 .none;
							}
							
							&.opened {
								img {
								 margin: 8px 0 0 5px;
								 
								 .rotate(180deg);
								}
								
								ins {
								 .block;
								}
								
								span {
								 .none;
								}
							}
						}
						
						&:last-child {
						 border-bottom: none;
						}
					}
				}
			}
			
			> h2 {
			 padding: 0 0 20px 80px;
			 .fsize(24pt);
			}
		}
		
		&.testimonials {
			section {
			 max-width: @basew + 20;
			 .w100;
			
				a {
				 color: @black;
				 margin: 0 20px 40px 0;
				 width: 300px;
				 
				 .block;
				 .fleft;
				 .ntext;
				 .bx;
				 
					span {
					 width: 300px;
					 height: 180px;
					 
					 .block;
					 .ohidden;
					}
					
					strong {
					 color: @orange;
					 
					 .block;
					}
				}
			}
			
			&.form-this {
				section {
				
					form.form-horizontal {
					 padding: 0;
					 max-width: 100%;
					 .block;
					 .ohidden;
					 .w100;
					
						> div {
						 padding: 0 10px 20px;
						 max-width: 320px;
						 
						 .fleft;
						 .w100;
						 .bx;
						 
							&.form-btn {
							 max-width: 100%;
							 clear: both;
							 .center;
							 .fnone;
							}
							
							label {
							 white-space: nowrap;
							 .block;
							 .fsize(10pt);
							}
						}
					}
				}
			}
		}
		
		.requestform {
            form {
             max-width: @basew;

             .block;
             .w100;
             .ohidden;

                h2 {
                 padding: 0;
                }

                div {
                padding: 20px 0;

                .w100;
                .ohidden;
                    p {
                     max-width: 300px;
                     padding: 0 20px 20px 0;
                     margin: 0;

                     .fleft;
                     .block;
                     .bx;

                        label {}

                        input {
                            &.code {
                             width: 100px;
                            }

                            &.phnumber {
                             width: 160px;
                            }
                        }

                        span {
                         width: 10px;

                         .iblock;
                         .center;
                        }
                    }
                }
            }
		}
	}
}

footer {
 max-width: @basew + 20;
 
 .w100;
 .cmargin;
 .ohidden;
 .bx;
 
	> img {
	 .w100;
	 .block;
	}
	
	section {
	 padding: 40px 0 20px;
	 max-width: @basew;
	 
	 .w100;
	 .cmargin;
	 .ohidden;
	 .bx;
	 
		.col1 {
		 max-width: 460px;
		 
		 .fleft;
		 .w100;
		 .ohidden;
		 
			.logo {
			 width: 164px;
			 
			 .block;
			 .both;
			 
				img {
				 .block;
				 .w100;
				}
			}
			
			> div {
			 padding: 10px 10px 0 0;
			 width: 220px;
			 
			 .fleft;
			 
				.social {
					a {
					 margin: 0 5px 0 0;
						img {
						 width: 20px;
						}
					}
				}
			}
			
			> p {
			 padding: 8px 0 0;
			 .both;
			 .block;
			}
		}
		
		.col2 {
		 max-width: 480px;
		 
		 .fleft;
		 .w100;
		 .ohidden;
		 
			h2 {
			 margin: 0 0 10px;
			 height: 24px;
			}
			
			> ul {
			 background: @white;
			 
			 .radius(6px);
			 .ulclear;
			 .block;
			 .ohidden;
			 .bx;
			 
			 padding: 10px;
			 margin: 0 0 10px;
			 
				> li {
				 margin: 0 0 3px;
				 width: 50%;
				 
				 .fleft;
				 
					> a {
					 padding: 0 15px 0 0;

					 .iblock;
					}
				 
					ul {
					 border-top: 2px solid @beige;
					 
					 .fsize(9pt);
					 .ulclear;
					 .block;
					 .none;
					 .w100;
					 .ohidden;
					 
					 margin-top: 5px;
					 padding-top: 5px;
					 
						li {
						 width: 50%;
						 margin: 0;
						 
						 .fleft;
						 
							a {
							 color: @black;
							 
								&:hover {
								 color: @orange;
								}
							}
						}
					}
					
					&.selected {
					.w100;
						> a {
						 background: url(../images/close.png) no-repeat right center/10px auto;
						}
					}
				}
				
				a {
				 .ntext;
				}
			}
			
			h3 {
			 margin: 0 0 5px;
			 
			 .fsize(11pt);
			}
			
			> form {
			 .block;
			 .w100;
			 .ohidden;
			 
				p {
					input {
					 color: @darkgray;
					 background: @white;
					 text-indent: 10px;
					 margin: 0 10px 0 0;
					 max-width: 360px;
					 height: 30px;
					 
					 .radius(4px);
					 .os;
					 .fleft;
					 .w100;
					}
					
					button {
					 color: @white;
					 background: @orange;
					 padding: 0 0 3px;
					 width: 110px;
					 height: 30px;
					 
					 .radius(4px);
					 .os;
					 .fleft;
					}
				}
			}
		}
	}
}

#inside {
	.slider, article {
	 background: @white;
	}
	
	.slider {
	 height: 140px;
		div {
		margin-top: -240px;
		}
		
		.overlay {
		 top: -240px;
		}
	}
}

.orangebox {
	margin:10px 0px;
}
.orangebox a {
	text-decoration:none;
}
.orangebox a img{
	position: relative;
	top: 10px;
	left: 10px;
	z-index: 99;
}

@import url('mobile.less');