  @font-face{
    font-family:SpeakPro;
    src:url(../fonts/SpeakPro-Light.eot) format('embedded-opentype'),url(../fonts/SpeakPro-Light.eot) format('embedded-opentype'),url(../fonts/SpeakPro-Light.woff2) format('woff2'),url(../fonts/SpeakPro-Light.woff) format('woff'),url(../fonts/SpeakPro-Light.ttf) format('truetype');
    font-weight:300;
    font-style:normal;
    font-display:swap
  }
  @font-face{
    font-family:SpeakPro;
    src:url(../fonts/SpeakPro-LightItalic.eot) format('embedded-opentype'),url(../fonts/SpeakPro-LightItalic.eot) format('embedded-opentype'),url(../fonts/SpeakPro-LightItalic.woff2) format('woff2'),url(../fonts/SpeakPro-LightItalic.woff) format('woff'),url(../fonts/SpeakPro-LightItalic.ttf) format('truetype');font-weight:300;font-style:italic;font-display:swap}@font-face{font-family:SpeakPro;src:url(../fonts/SpeakPro.eot) format('embedded-opentype'),url(../fonts/SpeakPro.eot) format('embedded-opentype'),url(../fonts/SpeakPro.woff2) format('woff2'),url(../fonts/SpeakPro.woff) format('woff'),url(../fonts/SpeakPro.ttf) format('truetype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:SpeakPro;src:url(../fonts/SpeakPro-Italic.eot) format('embedded-opentype'),url(../fonts/SpeakPro-Italic.eot) format('embedded-opentype'),url(../fonts/SpeakPro-Italic.woff2) format('woff2'),url(../fonts/SpeakPro-Italic.woff) format('woff'),url(../fonts/SpeakPro-Italic.ttf) format('truetype');font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:SpeakPro;src:url(../fonts/SpeakPro-Bold.eot) format('embedded-opentype'),url(../fonts/SpeakPro-Bold.eot) format('embedded-opentype'),url(../fonts/SpeakPro-Bold.woff2) format('woff2'),url(../fonts/SpeakPro-Bold.woff) format('woff'),url(../fonts/SpeakPro-Bold.ttf) format('truetype');font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:SpeakPro;src:url(../fonts/SpeakPro-BoldItalic.eot) format('embedded-opentype'),url(../fonts/SpeakPro-BoldItalic.eot) format('embedded-opentype'),url(../fonts/SpeakPro-BoldItalic.woff2) format('woff2'),url(../fonts/SpeakPro-BoldItalic.woff) format('woff'),url(../fonts/SpeakPro-BoldItalic.ttf) format('truetype');font-weight:700;font-style:italic;font-display:swap}@font-face{font-family:SpeakPro;src:url(../fonts/SpeakPro-Heavy.eot) format('embedded-opentype'),url(../fonts/SpeakPro-Heavy.eot) format('embedded-opentype'),url(../fonts/SpeakPro-Heavy.woff2) format('woff2'),url(../fonts/SpeakPro-Heavy.woff) format('woff'),url(../fonts/SpeakPro-Heavy.ttf) format('truetype');font-weight:900;font-style:normal;font-display:swap}@font-face{font-family:SpeakPro;src:url(../fonts/SpeakPro-HeavyItalic.eot) format('embedded-opentype'),url(../fonts/SpeakPro-HeavyItalic.eot) format('embedded-opentype'),url(../fonts/SpeakPro-HeavyItalic.woff2) format('woff2'),url(../fonts/SpeakPro-HeavyItalic.woff) format('woff'),url(../fonts/SpeakPro-HeavyItalic.ttf) format('truetype');
    font-weight:900;
    font-style:italic;
    font-display:swap
  }

  @media screen {  
    * { font-family: SpeakPro }  
  } 

* {
    margin: 0;
    padding: 0;
    /*box-sizing: border-box;*/
  }
  /*html,*/
  body {    
    /*background-color: blue;*/
    /*background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 100% 100%;*/
    background-image: url(../img/Horizontal/inicio.png);
    background-position: center right;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: auto;
    margin: 0;
    padding: 0;    
    top: 0%;
    font-family: SpeakPro;
    font-weight: bold;
  }
  #outer {
    position: relative;
    width: 100%;
    height: 100%;
    background: transparent;
  }
  #outer #container {
    background-color: transparent;
    color: #663399;
    padding: 15px 25px;
    width: 100%;
    max-width: 300px;
    position: absolute;
    transform: translate(-50%, -50%);
    left: 50%;
    top: 50%;
  }

  /* If the screen size is smaller than 1200px, set the font-size to 80px 
  @media (max-width: 1023.98px) {
    .responsive-font-text {
      font-size: 16px;
    }
  }*/


  @media screen and (orientation: portrait){
    body{
      background-image: url(../img/Vertical/inicio.png);
      background-position: center center;
      background-repeat: no-repeat;
      background-attachment: fixed;
      background-size: cover;
      
      background-position-y: top;
      -webkit-background-size: contain;
      -moz-background-size: contain;
      -o-background-size: contain;
      background-size: contain;      
    }
    
  }

  @media screen and (orientation: landscape){
    body{
      background-image: url(../img/Horizontal/inicio.png);
      background-position: center center;
      background-repeat: no-repeat;
      background-attachment: fixed;
      background-size: cover;
      
      background-position-y: top;
      -webkit-background-size: contain;
      -moz-background-size: contain;
      -o-background-size: contain;
      background-size: contain;      
    }
    
  }

  @media screen and (orientation: portrait) and (max-width: 720px) { 
    
    .responsive-font-text {
      font-size: 24px;
      font-weight: 900;
    }

   }

   @media only screen and (orientation: portrait) and (min-width: 900px) { 
    
    .responsive-font-text {
      font-size: 18px;
      font-weight: 900;
    }

    .navbar{
      margin-top: 20px;
    }

   }
   
   @media only screen and (max-width: 1080px) and (orientation: portrait) { 
    
    .responsive-font-text {
      color: #004D68;
      font-size: 12px;
      /*font-weight: 900;*/
    }

   }
   .logo{
    vertical-align: top;
    align-items: center;       
    width: 5vh;
   }
   
   /* Pantallas Horizontal*/

  @media only screen and (max-width: 1000px) and (orientation: landscape) { 
    /*125%*/
    .responsive-font-text {      
      color: #004D68;
      /*color: darkorange;*/
      font-size: calc(7px+3vh);
      /*font-weight: 700;*/
      /*margin-top: 1px;*/      
      margin-right: 10px;
    }

  }

  @media only screen and (max-width: 1280px) and (orientation: landscape) { 
    /*100%*/

    .responsive-font-text {    
      color: #004D68; 
      /*color: yellow;*/
      font-size: 18px;
      /*calc(12px + 2vh);*/
      /*font-weight: 900;*/
      /*margin-top: 7vh;*/
      /*margin-top: -8px;*/
      margin-right: 10px;
    }

   
  }

  @media only screen and (min-width: 1280px) and (orientation: landscape) { 

    .responsive-font-text {
      color: #004D68;
      /*color: magenta;*/
      font-size: calc(10px + 3vh);
      /*font-weight: 900;*/
      /*margin-top: 9vh;*/
      /*margin-right: 2vh;*/
    }

   
   }

   @media only screen and (min-width: 1280.01px) and (max-width: 1919px) and (orientation: landscape){ 
    /* 67% 80% 90%*/
    .responsive-font-text {
      color: #004D68;
      /*color: green;*/
      font-size: calc(2px + 3vh);
      /*font-weight: 900;*/
      /*margin-top: 7vh;
      margin-right: 1vv;*/
    }
    
   }


   @media only screen and (min-width: 1920.01px) and (orientation: landscape) { 
    /*50%*/
    
    .responsive-font-text {
      color: #004D68;
      /*color: yellow;*/
      font-size: calc(1px + 3vh);
      /*calc(4px + 2vw);*/
      /*font-weight: 900;*/
      /*margin-top: 7vh;*/      
      
    }
  
    
    
  

 
    
   }

  .img-thumbnail{
    background-color: transparent;
    border: 0px;
  } 

  
  .navbar .navbar-nav .nav-item .nav-link {
    display: block !important;
    padding: 0 0.5em;
  }
