@doc_height: 100%;
@margin: 3px 4px 3px 4px;
@back_gray: rgb(245, 245, 245);
@basecolor: #EF9033;
@basefontsize: 100%;
@textcolor: #777;
@baseblue: #74abe8;

/* Utils */
cite {
  text-decoration: underline;
}

li.active,
a.set-time-offset.active {
  color: #ffffff !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
  background-color: #0088cc;
}

span.letter {
  color: #ef9033;
  margin: 0;
  font-size: 110%;
  font-weight: bold;
}

.carousel-inner .item {
  background: rgb(19, 99, 218);
  background: rgba(16, 113, 189, 0.55);
}

.carousel-inner .item:hover {
  background: rgb(19, 99, 218);
  background: rgba(16, 113, 189, 0.75);
}

.carousel-caption {
  padding: 10px;
  position: relative;
  //bottom: 15px;
  background: #333333;
  background: rgba(0, 0, 0, 0.55);
  
}

.arrow-up (@color, @width) {
  width: 0;
  height: 0;
  border-left: @width solid transparent;
  border-right: @width solid transparent;

  border-bottom: @width solid @color;
}

.arrow-down (@color, @width) {
  width: 0;
  height: 0;
  border-left: @width solid transparent;
  border-right: @width solid transparent;

  border-top: @width solid @color;
}

.arrow-right (@color, @width) {
  width: 0;
  height: 0;
  border-top: @width solid transparent;
  border-bottom: @width solid transparent;

  border-left: @width solid @color;
}

.arrow-right-bottom (@color, @width) {
  width: 0;
  height: 0;
  border-top: @width solid transparent;
  border-right: @width solid @color;
}

.arrow-left (@color, @width) {
  width: 0;
  height: 0;
  border-top: @width solid transparent;
  border-bottom: @width solid transparent;

  border-right:@width solid @color;
}

.sticker {
  position: relative;
  background-color: rgb(255, 255, 255);
}

.sticker div.triangle {
  position: absolute;
  right: 0;
  bottom: 0;
  .arrow-right-bottom(#EF9033, 30px);
}

.CornerShadowBottom {
  position:absolute;
  width: 100px;
  height: 100px;
  z-index:-6;
  display: inline-block;
  -webkit-box-shadow: -10px -10px 10px rgba(50, 50, 50, 0.28);
  -moz-box-shadow: -10px -10px 10px rgba(50, 50, 50, 0.28);
  box-shadow: -10px -10px 10px rgba(50, 50, 50, 0.28);
}

.CornerShadowTop {
  position:absolute;
  width: 100px;
  height: 100px;
  z-index:-6;
  display: inline-block;
  -webkit-box-shadow: -10px -10px 10px rgba(50, 50, 50, 0.28);
  -moz-box-shadow: -10px -10px 10px rgba(50, 50, 50, 0.28);
  box-shadow: -10px -10px 10px rgba(50, 50, 50, 0.28);
}

.CornerShadowTop {
  position:absolute;
  width: 100px;
  height: 100px;
  z-index:-6;
  display: inline-block;
  -webkit-box-shadow: -10px -10px 10px rgba(50, 50, 50, 0.28);
  -moz-box-shadow: -10px -10px 10px rgba(50, 50, 50, 0.28);
  box-shadow: -10px -10px 10px rgba(50, 50, 50, 0.28);
}

.bottom-left-shadow {
  .CornerShadowBottom;
  float: left;
  bottom:-5px; left:-12px;
  -moz-transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
  -webkit-transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
  -o-transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
  -ms-transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
  transform: scale(1) rotate(274deg) translate(20px, 25px) skew(9deg, 0deg);
}
.bottom-right-shadow {
  .CornerShadowBottom;
  float: right;
  bottom:-13px; right:-4px;
  -moz-transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
  -webkit-transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
  -o-transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
  -ms-transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
  transform: scale(1) rotate(184deg) translate(20px, 25px) skew(9deg, 0deg);
}

.top-left-shadow {
  .CornerShadowTop;
  top:-13px; left:-6px;
  float: left;
  -moz-transform: scale(1) rotate(4deg) translate(20px, 25px) skew(9deg, 0deg);
  -webkit-transform: scale(1) rotate(4deg) translate(20px, 25px) skew(9deg, 0deg);
  -o-transform: scale(1) rotate(4deg) translate(20px, 25px) skew(9deg, 0deg);
  -ms-transform: scale(1) rotate(4deg) translate(20px, 25px) skew(9deg, 0deg);
  transform: scale(1) rotate(4deg) translate(20px, 25px) skew(9deg, 0deg);
}

.top-right-shadow {
  .CornerShadowTop;
  top:-4px; right:-15px;
  float: right;
  -moz-transform: scale(1) rotate(94deg) translate(20px, 25px) skew(9deg, 0deg);
  -webkit-transform: scale(1) rotate(94deg) translate(20px, 25px) skew(9deg, 0deg);
  -o-transform: scale(1) rotate(94deg) translate(20px, 25px) skew(9deg, 0deg);
  -ms-transform: scale(1) rotate(94deg) translate(20px, 25px) skew(9deg, 0deg);
  transform: scale(1) rotate(94deg) translate(20px, 25px) skew(9deg, 0deg);
}


/* End of Utils */

/* Wrapper for page content to push down footer */
#wrap {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  /* Negative indent footer by it's height */
  margin: 0 auto -20px;
}

.span3.custom {
  //padding-top: 20px !important
}

.project-title {
  //text-shadow: rgb(3, 3, 3) 0px 3px 3px !important;
  border-bottom: 2px solid #EF9033;
}

.navbar .nav > li > a:focus, .navbar .nav > li > a:hover {
  border-bottom: 2px solid #005580 !important;
}

/* Custom container */
.container-fluid {
  color: @textcolor;
}

.row-fluid {
  margin-top: 15px !important;
}

.container-narrow {
  	margin: 0 auto;
  	max-width: 700px;
}

.container-narrow > hr {
  	margin: 30px 0;
}

/* Main marketing message and sign up button */
.jumbotron {
  	margin: 60px 0;
  	text-align: center;
}

.jumbotron h1 {
	font-size: 72px;
	line-height: 1;
}

.jumbotron .btn {
	font-size: 21px;
	padding: 14px 24px;
}

/* Supporting marketing content */
.marketing {
  	margin: 60px 0;
}

.marketing p + h4 {
  	margin-top: 28px;
}

form.form-signin {
	max-width: 300px;
	padding: 19px 29px 29px;
	margin: 0 auto 20px;
	background-color: #fff;
	border: 1px solid #e5e5e5;
	-webkit-border-radius: 5px;
	   -moz-border-radius: 5px;
	        border-radius: 5px;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
	   -moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
	        box-shadow: 0 1px 2px rgba(0,0,0,.05);
}

form.form-signin .form-signin-heading,
form.form-signin .checkbox {
	margin-bottom: 10px;
}

form.form-signin input[type="text"],
form.form-signin input[type="password"] {
	font-size: 16px;
	height: auto;
	margin-bottom: 15px;
	padding: 7px 9px;
}

/* Layered Paper */
.layered-paper {
    background: #eee;
    box-shadow:
        0 1px 1px rgba(0,0,0,0.15), /* The top layer shadow */
        0 10px 0 -5px #eee, /* The second layer */
        0 10px 1px -4px rgba(0,0,0,0.15), /* The second layer shadow */
        0 20px 0 -10px #eee, /* The third layer */
        0 20px 1px -9px rgba(0,0,0,0.15); /* The third layer shadow */
    
    
    padding: 30px;
}

.note {
   position:relative;
   padding:1em 1.5em;
   margin:2em auto;
   overflow:hidden;
}

.note:before {
   content:"";
   position:absolute;
   top:0;
   right:0;
   border-width:0 30px 30px 0;
   border-style:solid;
   //border-color:#fff #fff #333 #333;
   background:#333;
   -webkit-box-shadow:0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2);
   -moz-box-shadow:0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2);
   box-shadow:0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2);
   display:block; width:0; /* Преодоление ограничений Firefox 3.0 */
}

.note.rounded {
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
}

.note.rounded:before {
   border-width:8px;
   //border-color:#fff #fff transparent transparent;
   -webkit-border-bottom-left-radius:5px;
   -moz-border-radius:0 0 0 5px;
   border-radius:0 0 0 5px;
}

.date-title {
  font-size: @basefontsize + 25%;
  color: lighten(rgb(35, 119, 211), 20%);
  border-bottom: 2px solid whitesmoke;
}

.event {
  border-bottom: 1px solid #d4d4d4;
  padding-bottom: 19px;
}

.event, .school {
  margin-bottom: 20px;
}

.margin0 {
  margin: 0 !important;
}

.event .nilmargin,
.school .nilmargin {
  .margin0;
}

.event .time {
  text-align: center;
  margin-right: 0;
  //font-size: @basefontsize + 40%;
  line-height: 1.3;
  margin-bottom: 40px;
}

.event .time div {
   padding-right: 6px;
}

.event .time div * {
  //font-size: 16px;
}

.event .price {
  text-align: right;
  background-color: darken(@back_gray, 5%);
  opacity: 0.9;
  padding: 3px 3px;
  font-size: @basefontsize + 14%;
  width: 28.2051282051% !important;
  .margin0;
  padding-top: 10px;
}

.event .name,
.school .name {
  text-align: center;
  background-color: @back_gray;
  opacity: 0.8;
  padding: 3px;
  font-size: @basefontsize + 14%;
  color: darken(@basecolor, 10%);
  padding-top: 10px;
  font-weight: bold;
 .margin0
}

.event .course {
  //margin-left: 120px;
  margin-top: 5px;
}

.event .course span {
  text-transform: uppercase;
  color: @basecolor;
}

.event .addinfo {
  //margin-left: 120px;
  margin-top: 10px;
  font-style: italic;
  //width: 240px;
}

.event-title,
.school-title {
  margin-bottom: 60px;
}

.event-title [class^="span"],
.school-title [class^="span"] {
  height: 50px;
}

.school {
  //margin-left: 100px;
  //width: 30%;
}

.school .s-name{
  //: 110%;
  font-weight: bold;
}

.gmap {
  cursor: pointer;
}

.sidebar-nav,
.sidebar-nav legend {
  color: @textcolor !important;
  border-bottom: none;
}

.sidebar-nav form {
  .margin0;
  width: 50%;
}

.nav.nav-list li.tallanto {
  border-bottom: 1px solid whitesmoke;
  padding-left: 0px;
  cursor: pointer;
}

.nav.nav-list li.tallanto label {
  padding: 3px 5px 3px 5px !important;
}


.nav.nav-list li.tallanto:hover,
.nav.nav-list li.tallanto .active {
  background-color: @basecolor !important;
  color: white !important;
  text-shadow: none;
}

.big-font {
  font-size: 40px;
}

.very-big-font {
  font-size: 86px;
  margin-bottom: 60px;
}

.container-error {
  position: absolute;
  width: 100%;
  left: 0;
  height: 30%;
  top: 30%;
  padding: 45px;
}

[class^="timer"], [class*=" timer"] {
  font-size: 16px;
  padding: 5px;
}

div.promo {
  margin-top: 20px;
  margin-bottom: 20px;
  opacity: 0.7;
}

div.promo img {
  -webkit-box-shadow: 0px 0px 8px rgba(50, 50, 50, 0.45);
  -moz-box-shadow:    0px 0px 8px rgba(50, 50, 50, 0.45);
  box-shadow:         0px 0px 8px rgba(50, 50, 50, 0.45);
  //border: 1px solid #eee;
}

div.promo:hover {
  opacity: 1;
  width: 110%;
  margin-left: -5%;
  margin-left: -5%;
  margin-top: 5%;
  -webkit-box-shadow: 0px 0px 57px rgba(50, 50, 50, 0.15);
  -moz-box-shadow:    0px 0px 57px rgba(50, 50, 50, 0.15);
  box-shadow:         0px 0px 57px rgba(50, 50, 50, 0.15);
}

#events-feed {
  //margin-left: 100px;
  //width: 55%;
  //width: 55%;
}

#school-feed {

 }

#school-feed row.custom {
  margin-left: 0;
}

.sidebar-nav.custom {
  border-bottom: 1px solid #e3e3e3 !important;
}

.sidebar-nav.custom form {
  width: 100%;
}

.row.custom {
  //margin-left: 30px !important;
}

.event-day {
  background-color: rgb(255, 232, 182) !important;
}

.today {
  background-color: rgba(130, 190, 255, 0.54) !important;
  border: 1px solid rgba(255, 33, 46, 0.27) !important;
}


.fc-day:hover {
  background-color: #2a85a0 !important;
  color: #ffffff !important;
}

/* Mbile media */
@media only screen and (max-device-width: 800px) {
  #leftbar {
    width: 100%;
  }

  #events-feed {
    margin-left: 0;
    width: 100%;
  }

  #rightbar {
    width: 100%;
  }
}
/* End of mobile media */

/* Pagination */
div.pagination {
  text-align: center;
}

div.pagination .current-page a {
  background-color: #0088cc;
  color: white;
  border-color: #0088cc;
  font-weight: bold;
  //font-size: 105%;
}

div.pagination .current-page a:hover {
  color: #005580;
  background-color: #f5f5f5;
  border-color: #dddddd;
}
/* End of Pagination */

/* colorBox */
#colorbox #cboxClose
{
  top: 0;
  right: 0;
}

/* Tiles */
.amarelo {
  background-color: #daa520;
}

.vermelho {
  background-color: #cd0000;
}

.azul {
  background-color: #4682b4;
}

.verde {
  background-color: #2e8b57;
}

/* School */
.school-details {
  margin-left: 20px !important;
}

.school-title.name {
  margin-left: -20px !important;
  margin-right: 20px !important;
}

img.school-logo {
  margin: 10px 0px 10px 0px;
  //.StandartShadow;
  max-height: 150px;
}

#fixed-search-form {
  margin: 0;
  margin-top: 5px
}

a.remove {
  text-decoration: none;
}

img.logo {
  margin-top: 10px;
  margin-bottom: 10px;
  width: 200px;
}

.thumbnails li:nth-child(5n+5) {
  margin-left: 0;
}

span.social {
  margin: 10px;
  opacity: 0.6;
}

span.social:hover {
  opacity: 1;
}

.category-icon {
  width: 16px;
  height: 16px;
  float: left;
  background-size: cover;
}

li.tallanto .category-icon {
  width: 24px !important;
  height: 24px !important;
}