/* ----------------------- IMPORTS ----------------------- */

@import 'https://fonts.googleapis.com/css?family=Montserrat';
@import 'https://fonts.googleapis.com/css?family=Montserrat:300';

@font-face {
  font-family: Montserratl;
  src: url(../fonts/Montserrat-Light.eot) format("eot");
}

@font-face {
    font-family: Montserratl;
    src: url(../fonts/Montserrat-Light.ttf) format("truetype");
}


@font-face {
  font-family: Chalet;
  src: url(../fonts/ChaletComprimeMilanEighty.eot) format("eot");
}

@font-face {
   font-family: Chalet;
   src: url(../fonts/ChaletComprimeMilanEighty.ttf) format("truetype");
}


@font-face {
  font-family: Montserrath;
  src: url(../fonts/Montserrat-Hairline.eot) format("eot");
}

@font-face {
    font-family: Montserrath;
    src: url(../fonts/Montserrat-Hairline.ttf) format("truetype");
}


@font-face {
  font-family: bebasneue;
  src: url(../fonts/BebasNeue_Bold.eot) format("eot");
}

@font-face {
    font-family: bebasneue;
    src: url(../fonts/BebasNeue_Bold.otf) format("opentype");
}


@font-face {
  font-family: rockwell;
  src: url(../fonts/ROCK.eot) format("eot");
}

@font-face {
    font-family: rockwell;
    src: url(../fonts/ROCK.ttf) format("truetype");
}



/* -------------------- END OF IMPORTS ------------------- */


#course_loader {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 1;
  margin: -75px 0 0 -75px;
  border: 10px solid #f3f3f3;
  border-radius: 50%;
  border-top: 10px solid black;
  width: 50px;
  height: 50px;
  -webkit-animation: spin 1s linear infinite;
  animation: spin 1s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: translate(100%, 100%) rotate(0deg); }
  100% { -webkit-transform: translate(100%, 100%) rotate(360deg); }
}

@keyframes spin {
  0% { transform: translate(100%, 100%) rotate(0deg); }
  100% { transform: translate(100%, 100%) rotate(360deg); }
}

/* ------------------------- TAGS ------------------------ */

h1, h2, h3, h4, p, input{
    font-family: 'Montserrat', sans-serif !important;
}


/* ---------------------- END OF TAGS -------------------- */

.course_title {
  font-size: 75px !important;
}

@media screen and (max-width: 850px) {
  .course_title {
    font-size: 30px !important;
  }
}


/* ----------------------- CLASSES ----------------------- */

.absolute_centered {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
}

.absolute_bottom {
    top: 100% !important;
    transform: translate(-50%, -100%) !important;
}

.absolute_position {
    position: absolute !important;
}

.additional_image {
    background: rgb(122, 175, 5);
}

.additional_text {
    background: rgb(255, 147, 0);
}

.additional_text_div {
    min-width: 100%;
    height: 100%;
    overflow-y: auto;
    position: fixed;
    left: 100%;
    z-index: 333;
    background: white;
    padding: 50px;
}

.additional_text_div p {
    width: 60%;
    margin: 0 auto;
}

.additional_text_div iframe {
    width: 80%;
    height: 80%;
    display: block;
    margin: auto;
}

.big_number {
    font-size: 78px !important;
}

.big_separated_letters {
    letter-spacing: 6px !important;
}

.big_text {
    font-size: 50px !important;
}

.black_background {
    background: black !important;
}

.black_text {
    color: black !important;
}

.centered_text {
    text-align: center !important;
}

.course_icon {
    padding: 10px;
    width: 100px;
    border-radius: 5px;
    margin-bottom: 10px;
}

.course_icon:hover {
    margin-right: 10px;
}

.cursor_default {
    cursor: default !important;
}

.cursor_pointer {
    cursor: pointer !important;
}

.fat_text {
    font-weight: bold !important;
}

.fixed_position {
    position: fixed !important;
}

.full_height {
    min-height: 100% !important;
}

.full_width {
    width: 100% !important;
}

.giant_text {
    font-size: 130px !important;
}

.grey_background {
    background: #f2f2f2 !important;
}

.grey_background:hover {
    background: white !important;
}

.grey_text {
    color: grey !important;
}

.horizontal_absolute_centered {
    position: absolute !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

.horizontal_absolute_25 {
    position: absolute !important;
    left: 25% !important;
    transform: translate(-50%, -50%) !important;
}

.horizontal_absolute_75 {
    position: absolute !important;
    left: 75% !important;
    transform: translate(-50%, -50%) !important;
}

.icons_container {
    position: fixed;
    top: 60%;
    right: -15px;
    z-index: 9999;
}

.light_montserrat {
    font-family: 'Montserratl' !important;
    font-weight: 300 !important;
}

.medium_text {
    font-size: 19px !important;
}

.middle_width {
    width: 50% !important;
}

.middle_height {
    height: 50% !important;
}

.montserrat_hairline {
    font-family: 'Montserrath' !important;
    font-weight: bold !important;
}

.recommended_video {
    background: rgb(111, 115, 136);
}

.responsive_image {
    width: 100% !important;
    height: auto !important;
}

.relative_position {
    position: relative !important;
}

.relevant_link {
    background: rgb(0, 176, 240);
}

.responsive_title {
    font-size: 28px !important;
}

.responsive_title span {
    font-size: 21px !important;
}

.shadowed_text {
    text-shadow: 0 0 5px #999 !important;
}

.slim_text {
    font-weight: lighter !important;
}

.small_separated_letters {
    letter-spacing: 4px !important;
}

.medium_small_text {
    font-size: 17px !important;
}

.small_text {
    font-size: 13px !important;
}

.smart_image:hover {
    -webkit-filter: invert(1);
    filter: invert(1);
}

.smart_title:hover {
    margin-top: -15px;
    margin-bottom: 15px;
}

.spaced_lines {
    line-height: 40px !important;
}

.spaced_lines {
    line-height: 30px !important;
}

.transitioned_element {
    -moz-transition: all 0.5s ease-in-out 0s !important;
    -webkit-transition: all 0.5s ease-in-out 0s !important;
    -o-transition: all 0.5s ease-in-out 0s !important;
    transition: all 0.5s ease-in-out 0s !important;
}

.transitioned_element_slower {
    -moz-transition: all 0.8s ease-in-out 0s !important;
    -webkit-transition: all 0.8s ease-in-out 0s !important;
    -o-transition: all 0.8s ease-in-out 0s !important;
    transition: all 0.8s ease-in-out 0s !important;
}

.vertical_absolute_centered {
    position: absolute !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
}

.white_text {
    color: white !important;
}

.white_background {
    background: white !important;
}

.white_background:hover {
    background: #e1e1e1 !important;
}


/* -------------------- END OF CLASSES ------------------- */


/* ------------------ RESPONSIVE DESIGN ------------------ */

@media (max-width: 960px) {
    .additional_text_div p {
        width: 80% !important;
    }
    .additional_text_div iframe {
        width: 90%;
        height: 50%;
    }
    .big_text {
        font-size: 35px !important;
    }
    .dont_display_in_mobile {
        display: none;
    }
    .giant_text {
        font-size: 90px !important;
    }
    .large_words {
        font-size: 25px !important;
    }
    .horizontal_absolute_25 {
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
    }
    .horizontal_absolute_75 {
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
    }
    .mobile_margin_bottom {
        margin-bottom: 15px !important;
    }
    .responsive_image {
        height: 100% !important;
        width: auto !important;
    }
    .responsive_title {
        font-size: 18px !important;
    }
    .responsive_title span {
        font-size: 12px !important;
    }
}

@media (min-width: 961px) and (max-width: 1400px) {
    .responsive_title {
        font-size: 25px !important;
    }
    .responsive_title span {
        font-size: 19px !important;
    }
}

.tv_image_container {
	margin: 0 auto;
	width: 50%;
}

@media (min-width: 961px) and (max-width: 1400px){
	.tv_image_container {
		width: 60% !important;
	}
}

@media (max-width: 960px){
	.tv_image_container {
		margin-top: 75px !important;
		width: 100% !important;
	}
}

/* --------------- END OF RESPONSIVE DESIGN -------------- */

.arrow-down {
  position: absolute;
  bottom: -76px;
  right: 50px;
  border-top: 35px solid rgb(242, 242, 242);
  opacity: 0.6;
}

.arrow-up {
  position: absolute;
  top: -70px;
  left: 50px;
  opacity: 0.6;
}

.arrow-down:hover {
  opacity: 1;
}
.arrow-up:hover {
  opacity: 1;
}

.footer_icon {
  margin: 5px !important;
}

.footer_icon:hover {
  width: 90px !important;
}

@media (max-width: 960px) {
  .arrow-down {
    bottom: -76px;
    opacity: 0.6;
  }
  .arrow-up {
    top: -70px;
    opacity: 0.6;
  }
  .arrow-down:hover {
    opacity: 1;
  }
  .arrow-up:hover {
    opacity: 1;
  }
  .footer_icon_container {
    width: 100% !important;
  }
  .footer_icon {
    width: 50px !important;
  }
  .footer_icon:hover {
    width: 40px !important;
  }
}
@media (min-width: 961px) and (max-width: 1400px) {
  .footer_icon {
    width: 80px !important;
  }
  .footer_icon:hover {
    width: 70px !important;
  }
}

/* -------------- CUSTOMIZING RESPONSIVE.CSS ------------- */

.left_side_column_content {
    margin-top: 15% !important;
}

@media (max-width: 960px) {
    /*.diapositive {
        height: auto !important;
        min-height: 100% !important;
    }*/
}

.col-half-offset {
  margin-left:4.166666667%;
}

@media (max-width: 960px) {
  .col-half-offset {
    margin-left:0;
  }
  .dont_display_in_mobile {
    display: none;
  }
  .grey_border_in_mobile {
    border-bottom: 1px solid #CCC;
    padding-bottom: 25px;
    margin-bottom: 25px;
  }
}

.additional_text_bombilla {
    background: #E74C3C;
}

.additional_text_enlace {
    background: #06adf8;
}

.additional_text_lectura {
    background: #ff9300;
}

.additional_text_frase {
    background: #00d500;
}

.additional_text_infografia {
    background: #65d8ff;
}

.additional_text_imagen {
    background: #ff7586;
}

.additional_text_herramientas {
    background: #b03a87;
}

.additional_text_ejercicio {
    background: #035e88;
}

.additional_text_reto {
    background: #1fc7be;
}

.additional_text_sabiasQue {
    background: #6d886d;
}

.additional_text_evaluacion {
    background: #884663;
}

.additional_text_video {
    background: #6f7388;
}

.additional_text_reflexiones {
    background: #3c9193;
}

/* -------------- CUSTOMIZING RESPONSIVE.CSS END ------------- */
