/*	Less Framework 4
	http://lessframework.com
	by Joni Korpi
	License: http://opensource.org/licenses/mit-license.php	*/


/*	Resets
	------	*/
 

/*		Default Layout: 992px. 
		Gutters: 24px.
		Outer margins: 48px.
		Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

 
 
.wrapper{width:91%; margin:0 auto;}
.wrapper2{width:100%; margin:0 auto;}
.nav{ width:100%; height:76px; padding-top:10px; padding-bottom:25px;}
.logo{ width:28%;  float:left; padding-top:0px;}
.menu{ width:56%; float:left; padding-top:27px;}
.callus{ width:26%; float:right; font-size:22px; padding-top:7px; text-align:right; padding-right:20px; font-family:Helvetica, sans-serif;}
.title{ height:70px; width:100%; padding-top:49px; line-height:22px; padding-bottom:49px;}
 
 .slider{width:100%; height:520px; margin-top:0px;}
 .slider img{ height:520px;}
 
.maincontent{ width:100%; height:auto; background:#fff; clear:both; margin-top:7px; margin-bottom:7px;}

 /* sur */


/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

.mySlides {
    display: none;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor:pointer;
  height: 13px;
  width: 13px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation default was 1.5 changed to 3.5 */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 3.5s;
  animation-name: fade;
  animation-duration: 3.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}
 /* sur end */

.photoboxfull{ width:100%; height:207px; background:#000;}
.photoboxfullwhite{ width:100%; height:207px; background:#fff; margin-top:5px; margin-bottom:5px;}
.bandphoto{ width:317px; height:207px; border-right:7px solid #fff; float:left;}
.bandphoto img{ width:auto; height:auto;}
.bandtext{ width:74%; float:left; height:207px;}


.textwhite{ width:650px; float:left; padding-left:30px; padding-top:60px;}
.text{ width:400px; float:left; padding-left:30px; padding-top:60px;}
.arrow{ width:100px; float:left; padding-top:65px;}
.arrow1{ width:100px; float:left; padding-top:65px;}

.browseall{ width:100%; height:60px; padding:10px 0px; font-size:44px;}
.browseall .left{ width:250px; float:left; padding-top:5px;}
.browseall .right{ width:200px; float:left; padding-top:5px;}

.titletalent{ font-size:62px; padding:28px 0px 28px 0px; width:100%; line-height:22px; margin-bottom:18px; margin-top:18px;}

.titleproduct{ font-size:30px; height:360px; padding:24px 0px 24px 0px; width:100%; margin-top:20px; line-height:22px; margin-bottom:20px;}
.titleproductbox{height:300px; float:left;}
.titleproductbox img{ border:1px solid #000; padding:7px; background:#fff;}
.titleproducttext{ width:65%; height:300px; float:left;}
.titleproducttext p{ font-size:16px;}
.titleproducttext h2{ margin:0px; padding:0px; margin-top:120px;}



.footer{ width:100%; height:50px; padding-top:25px; padding-bottom:10px; font-size:15px;  margin-top:0px;}



.talentbox{ float:left; width:50%;}
.talentphoto{  float:left;}
.talentphoto img{ border:1px solid #000; padding:5px;}
.talenttext{ width:48%; float:left; padding-top:60px; padding-left:10px;}
.talenttext h2{padding:0px; margin:0px; font-size:25px;}
.talenttext p{padding:0px; margin:0px; font-size:15px;}

.action-button{}

 .example-obtuse{}


/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 991px) {
 
 
 
.wrapper{width:100%;}
.nav{ width:100%; height:64px; padding-top:10px; padding-bottom:10px;}
.logo{ width:22%; padding-left:2px; float:left;}
.logo img{ width:150px;}
.menu{ width:56%; float:left; padding-top:10px;}
.callus{ width:16%; float:right; font-size:14px; padding-top:22px; text-align:right; padding-right:20px;}
 
 
.maincontent{ width:100%; height:auto;}

 .slider{width:100%; height:330px;}
 .slider img{ height:300px;}
 

.talentbox{ float:left; width:100%;}
.talentphoto{ width:100%; text-align:center;}
.talentphoto img{ border:1px solid #ccc; padding:5px;}
.talenttext{ width:100%; height:170px; padding-top:20px; padding-left:20px; text-align:center;}
.talenttext h2{padding:0px; margin:0px; font-size:40px;}
.talenttext p{padding:0px; margin:0px; font-size:15px;}


.titleproduct{ font-size:30px; height:360px; padding:24px 0px 24px 0px; width:100%; line-height:22px;}
.titleproductbox{ height:300px;}
.titleproductbox img{ border:1px solid #ccc; padding:7px; background:#fff;}
.titleproducttext{ width:50%; height:300px; float:right;}
.titleproducttext p{ font-size:16px;}
.titleproducttext h2{ margin:0px; font-size:30px; padding:0px; margin-top:90px; line-height:40px;} 


 .tabs1{font-family:Helvetica, sans-serif; font-size:14px; width:24%;}
 .tabs2{font-family:Helvetica, sans-serif; font-size:14px; width:30%;} 
 
.padding{ padding:0px 10px;} 
.address{width:100%; height:auto; padding-left:20px; background:#f3f3f3; margin:0 auto;  padding-top:70px;  padding-bottom:70px; line-height:20px;}

 .photobox{ width:32%; height:230px; float:left;}
.photobox img{ width:240px; }
.rightboxblack{ width:65%; height:152px; float:left;}
.rightboxwhite{ width:45%; height:152px; float:left;}
.arrow{padding-top:40px; margin-left:0px;}  
 .arrow1{ text-align:center;  padding-top:200px; } 
  .text{ width:250px; float:left; padding-left:30px; padding-top:30px;}

}



/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (max-width: 767px) {
	
.wrapper{width:100%;}
.nav{ width:100%; height:auto; padding-top:10px; padding-bottom:10px;}
.logo{ width:100%; padding-left:0px; text-align:center;}
.menu{ width:100%;  padding-top:10px;}
.callus{ width:90%; margin:0 auto; text-align:center;font-size:24px; padding-top:22px; padding-bottom:20px;}
.title{ height:110px; width:100%;line-height:22px; }
 
.maincontent{ width:100%; height:auto;}
.photoboxfull{ width:100%; height:444px; background:#000;}
.photoboxfullwhite{ width:100%; height:514px; background:#fff; margin-top:5px; margin-bottom:5px;}
.bandphoto{ width:100%; height:207px;}
.bandphoto img{ width:auto; height:auto;}
.bandtext{ width:100%; height:207px;}


.textwhite{ width:100%;padding-top:20px; text-align:center; margin-left:-30px;}
.text{ width:100%;  padding-top:20px; margin-left:-30px; text-align:center;}
.arrow{ width:100%; padding-top:15px; text-align:center;}
.arrow1{ width:100%; padding-top:25px; text-align:center;}
 
.browseall{ width:100%; height:60px; padding:10px 0px;    font-size:30px; font-weight:bold; margin-top:5px; }
.browseall .left{ width:200px; float:left; padding-left:30px; padding-top:12px;}
.browseall .right{ width:70px; float:left; padding-top:5px;}

.talentbox{ float:left; width:100%;}
.talentphoto{ width:100%; text-align:center;}
.talentphoto img{ border:1px solid #ccc; padding:5px;}
.talenttext{ width:100%; height:170px; padding-top:20px; text-align:center;}
.talenttext h2{padding:0px; margin:0px; font-size:25px;}
.talenttext p{padding:0px; margin:0px; font-size:15px;}
.example-obtuse{}
 .footer{ width:100%; height:50px; padding-top:25px; padding-bottom:10px; font-size:15px;  margin-top:0px;}
 
.titleproduct{ font-size:30px; height:480px; padding:10px 0px 15px 0px; width:100%; margin-top:20px; line-height:22px; margin-bottom:20px;}
.titleproductbox{ width:90%; height:230px; margin:0 auto;}
.titleproductbox img{width:280px;border:1px solid #ccc; padding:7px; margin-left:12px; background:#fff;}
.titleproducttext{ width:90%; height:300px; text-align:center; margin:0 auto; margin-left:15px;}
.titleproducttext p{ font-size:16px; text-align:center;}
.titleproducttext h2{ margin:0px; font-size:30px; text-align:center; padding:0px; margin-top:70px; line-height:40px;} 


 
.titletalent{ font-size:30px; padding:32px 0px 18px 0px; text-align:center; width:100%; line-height:22px; margin-top:24px;}

 .example-obtuse{ width:76%;}
 
 .tabs1{font-family:Helvetica, sans-serif; font-size:12px; width:16%; margin-left:10px;}
 .tabs2{font-family:Helvetica, sans-serif; font-size:12px; width:27%;} 
 
.padding{ padding:0px 10px;}

.address{width:100%; height:auto; background:#f3f3f3; margin:0 auto; padding-left:10px; font-size:20px;  padding-top:30px;  padding-bottom:30px; line-height:30px;}


 
.slider{width:100%; height:225px;} 
.slider img{ height:250px;}

  
}



/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */

@media only screen and (min-width: 480px) and (max-width: 767px) {
 
 
.wrapper{width:100%;}
.nav{ width:100%; height:auto; padding-top:10px; padding-bottom:10px;}
.logo{ width:100%; padding-left:0px; text-align:center;}
.menu{ width:100%;  padding-top:10px;}
.callus{ width:100%; font-size:30px; text-align:center; padding-top:22px; padding-bottom:20px;}
 
.title{ height:110px; width:100%; margin-top:20px; line-height:22px; margin-bottom:2px;}

.photoboxfull{ width:96%; margin:0 auto; height:444px; background:#000;}
.photoboxfullwhite{ width:96%; margin:0 auto;  height:514px; background:#fff; margin-top:5px; margin-bottom:5px;}
.bandphoto{ width:317px; margin:0 auto; height:207px; text-align:center;}
.bandphoto img{ width:auto; height:auto; text-align:center;}
.bandtext{ width:100%; height:207px;}


.textwhite{ width:100%;padding-top:20px; text-align:center; margin-left:-30px;}
.text{ width:100%;  padding-top:20px; margin-left:-30px; text-align:center;}
.arrow{ width:100%; padding-top:15px; text-align:center;}
.arrow1{ width:100%; padding-top:25px; text-align:center;}

 
.browseall{ width:100%; height:60px; padding:10px 0px;    font-size:30px; font-weight:bold; margin-top:5px; }
.browseall .left{ width:250px; float:left; padding-left:30px; padding-top:12px;}
.browseall .right{ width:70px; float:left; padding-top:5px;} 
 
.talentbox{ float:left; width:100%;}
.talentphoto{ width:100%; text-align:center;}
.talentphoto img{ border:1px solid #ccc; padding:5px;}
.talenttext{ width:100%; height:170px; padding-top:20px; text-align:center;}
.talenttext h2{padding:0px; margin:0px; font-size:25px;}
.talenttext p{padding:0px; margin:0px; font-size:15px;}
 .footer{ width:100%; height:50px; padding-top:25px; padding-bottom:10px; font-size:15px;  margin-top:0px;}
 
 
 
.titleproduct{ font-size:30px; height:460px; padding:10px 0px 15px 0px; width:100%; margin-top:20px; line-height:22px;}
.titleproductbox{ width:100%; height:300px; text-align:center;}
.titleproductbox img{ border:1px solid #ccc; padding:7px; background:#fff;}
.titleproducttext{ width:100%; height:300px; text-align:center;}
.titleproducttext p{ font-size:16px; text-align:center; padding:0 10px;}
.titleproducttext h2{ margin:0px; font-size:30px; text-align:center; padding:0px; margin-top:0px; line-height:40px;} 
 
 .tabs1{font-family:Helvetica, sans-serif; font-size:14px; width:16%;}
 .tabs2{font-family:Helvetica, sans-serif; font-size:14px; width:30%;} 
 
.padding{ padding:0px 10px;} 
 
 .address{width:92%; height:auto; background:#f3f3f3; margin:0 auto;  padding-top:70px;  padding-bottom:70px; line-height:20px;}

 
 }