@font-face {
  font-family: Segoe_Local;
  src: url(fonts/segoeprint.ttf);
}

@font-face {
  font-family: Century_Gothic;
  src: url(fonts/CenturyGothic.ttf);
}

.buttonexample {
  background-color: #E65A3F;
}

.buttonexample:hover {
  background-color: rgb(121, 0, 18);
  color: rgb(255, 255, 255);
}

.vid {
  padding: 25px;
}

#mainCont {
  margin-top: 25px;
  display: grid;
  grid-template-columns: 9fr 3fr;
  grid-template-rows: auto;
}

/* Videos grid */
#videos {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 2;
  /* display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  margin-top: 3rem; */
}

#opoTable{
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 2;
}

#landtext {
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 2;

  display: grid;
  grid-template-columns: 6fr 4fr;
  grid-template-rows: auto;
  font-size: 2.6rem;
  font-family: Century_Gothic;
}

#landtext div{
  color:#FFFFFF; 
  align-self: flex-end; 
  /* items: center; */
  margin: 40px;
}

#landsidetext {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 2;
  grid-row-end: 3;
}
#mainvid {
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 2;
  grid-row-end: 3;
  margin-left: 3rem;
  margin-bottom: 0.5rem;
  margin-top: 1.5rem;
}


.vid iframe {
  width: 394px;
  height: 222px;
}

.vid i {
  color: rgb(174, 2, 28);
  text-align: center;
  font-size: 35px;
}

.vid a {
  font-size: 22px;
}

.jumbotron{
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 4;
  grid-row-end: 5;
}

.banners {
  border-top-right-radius: .3rem;
  border-top-left-radius: .3rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  align-items: center;
  background-color: rgb(244, 253, 253);
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 6;
  grid-row-end: 7;
}

.wrapper {
  max-width: 1059px;
  padding: 0 20px 40px 20px;
  background-color: rgb(244, 253, 253);
}

.captionB {
  font-size: 12px;
  font-weight: bold;
  margin-top: 5px;

  text-align: left;
  color: black;
  padding: 0px;
  border-radius: 0px;
  background-color: rgb(244, 253, 253);
}

.slideshow li {
  background-color: rgb(244, 253, 253);
  padding: 15px;
  max-width: 338px;
  /* height: 424px; */
  height: auto;
}

.slideshow li img {
  max-width: 300px;
  max-height: 300px;
}

.jcarousel-control-prev:hover {
  text-decoration: none;
  color: crimson;
}

.jcarousel-control-next:hover {
  text-decoration: none;
  color: crimson;
}


#sideR {
  min-width: 332px;
  background-color: rgb(244, 253, 253);
  border-radius: 5px;
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 2;
}

#sideR h4 {
  text-align: center;
  color: white;
  padding: 3px;
  border-radius: 5px;
  background-color: #E65A3F;
}
.dlnk {
  color: rgb(58, 0, 9);
}

.dlnk:hover {
  color: rgb(107, 0, 16);
  text-decoration: underline;
}

.flexCont {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  text-align: center;
}

.flexCont_end{
  align-items: center;
}

#maincard{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
}

.card{
  width: 40%;
}

#btnceu{
  margin-top: 8%;
}

.cardimg{
    width: 225px !important;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1em;
}

thead tr th{
  background-color: rgb(244, 253, 253);
  text-align:center;
}
tbody{ 
  text-align:center;
}

thead tr .bg-secondary{
  font-size: 20px;
  color:white; 
  text-align:center;
} 

.tablecenter{
  vertical-align: middle !important;
}

#tables{
  margin: 2%;
}

#warning{
  color: rgb(174, 2, 28);
  text-decoration: underline;
  padding: 1%;
  font-size: 1.25rem;
  font-weight: 300;
  text-align: center;
}

#longo{
  font-size: 1.3rem;
  font-style: italic;
}

#movinfo{
  display: none;
  text-align: center;
}

.matriculaimg{
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
  max-width: 1151px;
}

#collapse_img_text{
  font-size: 1.7em;
  font-weight: 600;
  font-style: normal;
  font-family: Segoe_Local;
}

#ballfondler{
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 2;
  grid-row-end: 3;
}


#formCharSep21{
  position: fixed;
  top: 245px;
  left: 16px;
  z-index: 200;
}

#tableFormModal{
  /* display: block; */
}

.tecn3n1{
  font-weight: 700;
  font-size: 20px;
  line-height: 20px;
  letter-spacing: 0.07em;
  text-align: justified;
}

#buttCharla{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1060;
  /* display: none; */
  /* width: 100%; */
  /* height: 100%; */
  margin-top: 240px;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
  padding-left: 20px;
}


#landTbuttons{
  display: flex; 
  align-items: center; 
  justify-content: space-between; 
  font-size: 0.7em;
}

@media (max-width: 1655px) {

  #landTbuttons{
    display: block; 
    /* align-items: center; 
    justify-content: space-between; 
    font-size: 0.8em; */
  }

}

@media (max-width: 1199px) {
  #mainCont {
      margin-top: 25px;
      display: block;
  }
  .wrapper {
    max-width: 726px;
  }

  #sideR {
      background-color: rgb(244, 253, 253);
      border-radius: 5px;
      grid-column-start: 1;
      grid-column-end: 2;
      grid-row-start: 2;
      grid-row-end: 3;
  }

} 

@media (max-width: 991px) {
  #gridContM{
      display: none;
  }
  .wrapper {
    max-width: 559px;
  }
  #mainCont {
      margin-top: 25px;
      display: block;
  }

  #headImg{
      display: none;
  }

  .card{
    width: 100%;
  }

  #movinfo{
    display: block;
  }
  
  #warner {
    display: none;
  }

  #formCharSep21{
    top: 80px;
  }

  
  #buttCharla{
    margin-top: 90px;
  }

}



.lined{
  text-decoration: line-through;
}

#videos {
  max-width: 100%;
  overflow-x: hidden;
}

#sticky_navbar{
  overflow-x: visible !important;
}

#overflow{
  overflow: auto;
}

.bigtext{
  text-align: center;
  line-height: 1.5em;
  font-weight: 700;
  color: rgb(189, 0, 0);
  border-bottom: #212529 1px solid;
}


.flycatcher{
  padding: 3px;
  position: relative;
  margin: 3px;
}

#smTable{
  position: relative;
  right: 3%;
  border: #87d7db 5px solid;
  border-radius: 0px 0px 7px 7px;
  max-height: 210px;
}

.whammy{
  display: table;
  width: auto; 
  margin: auto;
  padding: 5px;
}

/* @media (max-width: 458px) {

  .vidbut {
    display: inline-block !important;
  }

  .vid iframe{
    display: none;
  }

} */




/* REWORK */

#cardCont{
  /* grid-row-start: 2; */
  /* grid-row-end: 4; */
}


#cardCont h2, h4 {
  text-align: center;
  color: white;
  padding: 3px;
  border-radius: 5px;
  background-color: #E65A3F;
}

.mobile_item{
  display: none !important;
}


.cardV{
  max-width: 400px;
  margin-bottom: 65px;
  margin-top: 45px;
  border: 0px !important;
}

/* .cardV h4{
  color: rgb(189, 0, 0) !important    ;
  background-color: white !important;
  text-decoration: underline;
} */

.cardV .card-body .card-text{
  text-align: left;
  padding: 7px;
}



/* PARALLAX */


.parallax{
  background-image: url("../img/rework img/index.jpeg");
  /* background-image: url("../img/rework img/CURSO\ SEGUIMIENTO.jpg"); */
}


.parallax{
  /* background-image: url("../../img/secundaria/Bio.jpg"); */

  /* Set a specific height */

  /* Create the parallax scrolling effect */
  /* background-attachment: fixed;
  background-repeat: no-repeat; */
  background-position: left;
  background-size: cover;

  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 7px;
  min-height: 450px;
}

.mobile_image{
  display: none;
}



@media (max-width: 575px) {

  .flycatcher a h2{
    font-size: 1.3rem !important;
  }

  .flycatcher a{
    margin: 0 !important;
  }

  .mob_hidden{
    display: none;
  }

  #espec{
      display: grid;
      grid-template-columns: auto;
      grid-template-rows: auto;
  }

  #cardCont{
      grid-row-start: 3;
      grid-row-end: 4;
  }

  #fastform{
      /* position: sticky !important; */
      top: 8rem !important;
      left: 0 !important;
      right: auto !important;
      bottom: auto !important;
  }

  #fastformSm{
      /* position: sticky !important; */
      bottom: 1rem !important;
      left: 0.5rem !important;
      right: auto !important;
      top: auto !important;
  }

  .fastformButW{
      width: 46px !important;
  }
  
  .sampletext{
      font-size: 1em !important;
  }
  .mobile_hidden{
      display: none;
  }

  .mobile_item{
      display: block !important;
  }
  .mobile_image{
      display: block; 
      margin-left: auto !important;
      margin-right: auto !important;
      width: 30% !important;
  }
  .non_mobile_image{
      display: none;
  }

  .non_mobile{
    display: none;
  }

  .cardV{
      margin-bottom: 5px !important;
      margin-top: 5px !important;
  }

  .wrapper {
    max-width: 360px;
  }

  .matriculaimg{
    width: 75%;
  }

  #collapse_img_text{
    font-size: 1.3em;
    font-family: Segoe_Local;
  }

  /* .parallax{
    background-image: url("../img/rework img/indexM.jpg");
    background-position: right;
  } */
  
  #landtext div{
    align-self: center; 
    margin: 20px;
  }
  
  #landtext{
    grid-template-columns: auto !important;
  }

}


@media (max-width: 812px) {
  .parallax{
    /* background-image: url("../img/rework img/indexM.jpg"); */
    background-position: left;
  }

  #landtext{
    grid-template-columns: 7fr 2fr;
    font-size: 1.6rem;
  }
  
  #landtext div{
    align-self: center;
  }
  

}


@media (max-width: 1766px) {
  #videos{
    display: block;
    margin-top: auto;
  }

  .flycatcher{
    position: static;
  }

  #smTable{
    position: static;
    right: auto;
    border: #87d7db 5px solid;
    border-radius: 0px 0px 7px 7px;
    max-height: 210px;
  }

  #cardCont{
    margin-top: 2em;
  }

  #mainvid{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    text-align: center;
    margin-left: auto;
    margin-bottom: auto;
    margin-top: auto;
  }

  
}

