body{
  position: relative;
  background: #041642;
}   

#history_gills{
  display:block;
  position: absolute;
  width: 911.96px;
 
  left: -300px;
  top: 400px;
  
  font-family: Gill Sans;
  font-style: normal;
  font-weight: 600;
  font-size: 400px;
  line-height: 477px;
  
  color: #860101;
  
  transform: rotate(-90.42deg);
  }
  #desc_gill{
    position: absolute;
width: 40%;
height: 283px;
left: 386.26px;
top: 211px;

font-family: Gill Sans;
font-style: normal;
font-weight: normal;
font-size: 30px;


color: #EEF3FF;

transform: rotate(0.46deg);
  }
  #about_gill{

position: absolute;
width: 100%;
height: 57px;
left: 384px;
top: 132px;

font-family: Gill Sans;
font-style: normal;
font-weight: 300;
font-size: 50px;
/* identical to box height */

color: #FFFFFF;
  }

  #history_gills2{
    position: absolute;
 width: 911.96px;
 height: 1200px;
 left:1100px;
 top: -30px;
 
 font-family: Gill Sans;
 font-style: normal;
 font-weight: 600;
 font-size: 400px;
 line-height: 477px;
 
 color: #860101;
 
 transform: rotate(-90.42deg);
  }

  #history_g{
    display:block;
    position: absolute;
width: 100%;

left:-100px;
top: -750px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 500px;
line-height: 477px;

color: #FFFFFF;

transform: rotate(-90.42deg);
  }
  #history_ills{
    display:block;
    position: absolute;
width: 100%;

left:-100px;
top: 430px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 500px;


color: #FFFFFF;

transform: rotate(-90.42deg);
  }
  #linkback{
    position: absolute;
    width: 138px;
    height: 26px;
    left: 400px;
    top:900px;
    
    font-family: Gill Sans;
    font-style: normal;
    font-weight: normal;
    font-size: 50px;
    line-height: 23px;
    
    color: #F2F6FF;
  }
  #link1{
    position: absolute;
    width: 138px;
    height: 26px;
    left:  510px;
    top:900px;
    
    font-family: Gill Sans;
    font-style: normal;
    font-weight: normal;
    font-size: 30px;
  
    
    color: #F2F6FF;
  }
  #link2{
    position: absolute;
    width: 138px;
    height: 26px;
    left: 700px;
    top:900px;
    
    font-family: Gill Sans;
    font-style: normal;
    font-weight: normal;
    font-size: 50px;
    line-height: 23px;
    
    color: #F2F6FF;
  }

  :root {
    --mainColor: white;
  }
   a {
    color: var(--mainColor);
    text-decoration: none;
  }
  
  a:hover {
    color: transparent;
    text-decoration: none;
    -webkit-text-stroke: 2px var(--mainColor);
  }
  
  @supports not(-webkit-text-stroke: 2px red) {
    a:hover {
      text-shadow:
        3px 3px 0 var(--mainColor),
        -1px -1px 0 var(--mainColor),
        1px -1px 0 var(--mainColor),
        -1px 1px 0 var(--mainColor),
        1px 1px 0 var(--mainColor);
    }
  }
@keyframes text-focus-in{0%{filter:blur(12px);opacity:0}100%{filter:blur(0);opacity:1}}

/****** FOR MININMIZED BROWSER****/


@media screen and (max-width:800px) {
  body{
    position: relative;
    background: #041642;
 }   
#history_g{
display:block;
position: absolute;
width: 176.24px;

left: 100px;
top: -80px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;

color: #FFFFFF;

transform: rotate(-90.42deg);
}
#history_gills{
display:block;
position: absolute;

width:100%;

left: -205.09px;
top: 300px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #860101;

transform: rotate(-90.42deg);
}
#history_gills2{
position: absolute;
width: 100%;

left:600px;
top: -150px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;

/* identical to box height */

color: #860101;

transform: rotate(-90.42deg);
}
#history_ills{
display:block;
position: absolute;
width: 100%;
height: 358px;
left: 16.91px;
top: 460px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #FFFFFF;

transform: rotate(-90.42deg);
}
#about_gill{

position: absolute;
width: 161px;
height: 41px;
left: 180px;
top: 173px;

font-family: Gill Sans;
font-style: normal;
font-weight: 300;
font-size: 30px;
line-height: 34px;
text-align: center;

color: #FFFFFF;
}
 #desc_gill{
    text-rendering: optimizeLegibility;
    position: absolute;
    width: 215.41px;
    height: 192.59px;
    left:170px;
    top: 277px;
    
    font-family: Gill Sans;
    font-style: normal;
    font-weight: normal;
    font-size: 14.8px;
    line-height: 14px;
    
    color: #EEF3FF;
    animation:text-focus-in 3s;
    animation-iteration-count: 1;
    transform: rotate(0.46deg);
 }

 #linkback{
  position: absolute;
  width: 550px;
  height: 27px;
  left: 160px;
  top: 640px;
  
  font-family: Gill Sans;
  font-style: normal;
  font-weight: normal;
  font-size: 25px;
  line-height: 34px;
  
  color: #FFFFFF
 }
 #link1{
  position: absolute;
  width: 550px;
  height: 27px;
  left: 240px;
  top: 640px;
  
  font-family: Gill Sans;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 34px;
  
  color: #FFFFFF
 }

#link2{
  position: absolute;
  width: 550px;
  height: 27px;
  left: 350px;
  top: 640px;
  font-family: Gill Sans;
  font-style: normal;
  font-weight: normal;
  font-size: 25px;
  line-height: 34px;
  
  color: #FFFFFF
 }

 

 :root {
    --mainColor: white;
  }
   a {
    color: var(--mainColor);
    text-decoration: none;
  }
  
  a:hover {
    color: transparent;
    text-decoration: none;
    -webkit-text-stroke: 2px var(--mainColor);
  }
  
  @supports not(-webkit-text-stroke: 2px red) {
    a:hover {
      text-shadow:
        3px 3px 0 var(--mainColor),
        -1px -1px 0 var(--mainColor),
        1px -1px 0 var(--mainColor),
        -1px 1px 0 var(--mainColor),
        1px 1px 0 var(--mainColor);
    }
  }


}
/* ----------- iPhone X ----------- */




  
@media only screen 
    and (device-width : 375px) 
    and (device-height : 812px) 
    and (-webkit-device-pixel-ratio : 3) {

     body{
        position: relative;
        background: #041642;
     }   
#history_g{
    display:block;
    position: absolute;
width: 176.24px;

left: 100px;
top: -80px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;

color: #FFFFFF;

transform: rotate(-90.42deg);
}
#history_gills{
    display:block;
    position: absolute;

width:100%;

left: -205.09px;
top: 300px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #860101;

transform: rotate(-90.42deg);
}
#history_gills2{
position: absolute;
width: 100%;

left: 228.91px;
top: 300px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #860101;

transform: rotate(-90.42deg);
}
#history_ills{
    display:block;
position: absolute;
width: 100%;
height: 358px;
left: 16.91px;
top: 460px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #FFFFFF;

transform: rotate(-90.42deg);
}
    #about_gill{

position: absolute;
width: 161px;
height: 41px;
left: 116px;
top: 173px;

font-family: Gill Sans;
font-style: normal;
font-weight: 300;
font-size: 30px;
line-height: 34px;
text-align: center;

color: #FFFFFF;
    }
     #desc_gill{
        text-rendering: optimizeLegibility;
        position: absolute;
        width: 215.41px;
        height: 192.59px;
        left: 89.54px;
        top: 293px;
        
        font-family: Gill Sans;
        font-style: normal;
        font-weight: normal;
        font-size: 12px;
        line-height: 14px;
        
        color: #EEF3FF;
        animation:text-focus-in 3s;
        animation-iteration-count: 1;
        transform: rotate(0.46deg);
     }

     #linkback{
      position: absolute;
      width: 550px;
      height: 27px;
      left: 130px;
      top: 580px;
      
      font-family: Gill Sans;
      font-style: normal;
      font-weight: normal;
      font-size: 25px;
      line-height: 34px;
      
      color: #FFFFFF
     }
     #link1{
      position: absolute;
      width: 550px;
      height: 27px;
      left: 170px;
      top: 580px;
      
      font-family: Gill Sans;
      font-style: normal;
      font-weight: normal;
      font-size: 20px;
      line-height: 34px;
      
      color: #FFFFFF
     }

  #link2{
      position: absolute;
      width: 550px;
      height: 27px;
      left: 250px;
      top: 580px;
      
      font-family: Gill Sans;
      font-style: normal;
      font-weight: normal;
      font-size: 25px;
      line-height: 34px;
      
      color: #FFFFFF
     }
  
     

     :root {
        --mainColor: white;
      }
       a {
        color: var(--mainColor);
        text-decoration: none;
      }
      
      a:hover {
        color: transparent;
        text-decoration: none;
        -webkit-text-stroke: 2px var(--mainColor);
      }
      
      @supports not(-webkit-text-stroke: 2px red) {
        a:hover {
          text-shadow:
            3px 3px 0 var(--mainColor),
            -1px -1px 0 var(--mainColor),
            1px -1px 0 var(--mainColor),
            -1px 1px 0 var(--mainColor),
            1px 1px 0 var(--mainColor);
        }
      }

  }

















  
  @media only screen and (min-device-width : 375px) and (max-device-width : 667px) {
    /* STYLES GO HERE */
    body{
        position: relative;
        background: #041642;
     }   
#history_g{
    display:block;
    position: absolute;
width: 176.24px;

left: 100px;
top: -80px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;

color: #FFFFFF;

transform: rotate(-90.42deg);
}
#history_gills{
    display:block;
    position: absolute;

width:100%;

left: -205.09px;
top: 300px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #860101;

transform: rotate(-90.42deg);
}
#history_gills2{
position: absolute;
width: 100%;

left: 228.91px;
top: 300px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #860101;

transform: rotate(-90.42deg);
}
#history_ills{
    display:block;
position: absolute;
width: 100%;
height: 358px;
left: 16.91px;
top: 460px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #FFFFFF;

transform: rotate(-90.42deg);
}
    #about_gill{

position: absolute;
width: 161px;
height: 41px;
left: 116px;
top: 173px;

font-family: Gill Sans;
font-style: normal;
font-weight: 300;
font-size: 30px;
line-height: 34px;
text-align: center;

color: #FFFFFF;
    }
     #desc_gill{
        text-rendering: optimizeLegibility;
        position: absolute;
        width: 215.41px;
        height: 192.59px;
        left: 89.54px;
        top: 293px;
        
        font-family: Gill Sans;
        font-style: normal;
        font-weight: normal;
        font-size: 12px;
        line-height: 14px;
        animation:text-focus-in 3s;
        animation-iteration-count: 1;
        color: #EEF3FF;
        
        transform: rotate(0.46deg);
     }
     #linkback{
      position: absolute;
      width: 550px;
      height: 27px;
      left: 130px;
      top: 580px;
      
      font-family: Gill Sans;
      font-style: normal;
      font-weight: normal;
      font-size: 25px;
      line-height: 34px;
      
      color: #FFFFFF
     }
     #link1{
      position: absolute;
      width: 550px;
      height: 27px;
      left: 170px;
      top: 580px;
      
      font-family: Gill Sans;
      font-style: normal;
      font-weight: normal;
      font-size: 20px;
      line-height: 34px;
      
      color: #FFFFFF
     }

  #link2{
      position: absolute;
      width: 550px;
      height: 27px;
      left: 250px;
      top: 580px;
      
      font-family: Gill Sans;
      font-style: normal;
      font-weight: normal;
      font-size: 25px;
      line-height: 34px;
      
      color: #FFFFFF
     }
  

     :root {
        --mainColor: white;
      }
       a {
        color: var(--mainColor);
        text-decoration: none;
      }
      
      a:hover {
        color: transparent;
        text-decoration: none;
        -webkit-text-stroke: 2px var(--mainColor);
      }
      
      @supports not(-webkit-text-stroke: 2px red) {
        a:hover {
          text-shadow:
            3px 3px 0 var(--mainColor),
            -1px -1px 0 var(--mainColor),
            1px -1px 0 var(--mainColor),
            -1px 1px 0 var(--mainColor),
            1px 1px 0 var(--mainColor);
        }
      }

 }


  
  @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { 
    /* STYLES GO HERE */
    body{
        position: relative;
        background: #041642;
     }   
#history_g{
    display:block;
    position: absolute;
width: 176.24px;

left: 100px;
top: -80px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;

color: #FFFFFF;

transform: rotate(-90.42deg);
}
#history_gills{
    display:block;
    position: absolute;

width:100%;

left: -390px;
top: 300px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #860101;

transform: rotate(-90.42deg);
}
#history_gills2{
position: absolute;
width: 100%;

left: 10px;
top: 300px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #860101;

transform: rotate(-90.42deg);
}
#history_ills{
    display:block;
position: absolute;
width: 100%;
height: 358px;
left: -190px;
top: 290px;

font-family: Gill Sans;
font-style: normal;
font-weight: 600;
font-size: 300px;
line-height: 358px;
/* identical to box height */

color: #FFFFFF;

transform: rotate(-90.42deg);
}
    #about_gill{

position: absolute;
width: 161px;
height: 41px;
left: 116px;
top: 173px;

font-family: Gill Sans;
font-style: normal;
font-weight: 300;
font-size: 30px;
line-height: 34px;
text-align: center;

color: #FFFFFF;
    }
     #desc_gill{
        text-rendering: optimizeLegibility;
        position: absolute;
        width: 215.41px;
        height: 192.59px;
        left: 89.54px;
        top: 293px;
        
        font-family: Gill Sans;
        font-style: normal;
        font-weight: normal;
        font-size: 12px;
        line-height: 14px;
        animation:text-focus-in 3s;
        animation-iteration-count: 1; 
        color: #EEF3FF;
        
     }
     #linkback{
      position: absolute;
      width: 550px;
      height: 27px;
      left: 130px;
      top: 580px;
      
      font-family: Gill Sans;
      font-style: normal;
      font-weight: normal;
      font-size: 25px;
      line-height: 34px;
      
      color: #FFFFFF
     }
     #link1{
      position: absolute;
      width: 550px;
      height: 27px;
      left: 170px;
      top: 580px;
      
      font-family: Gill Sans;
      font-style: normal;
      font-weight: normal;
      font-size: 20px;
      line-height: 34px;
      
      color: #FFFFFF
     }

  #link2{
      position: absolute;
      width: 550px;
      height: 27px;
      left: 250px;
      top: 580px;
      
      font-family: Gill Sans;
      font-style: normal;
      font-weight: normal;
      font-size: 25px;
      line-height: 34px;
      
      color: #FFFFFF
     }
  

     :root {
        --mainColor: white;
      }
       a {
        color: var(--mainColor);
        text-decoration: none;
      }
      
      a:hover {
        color: transparent;
        text-decoration: none;
        -webkit-text-stroke: 2px var(--mainColor);
      }
      
      @supports not(-webkit-text-stroke: 2px red) {
        a:hover {
          text-shadow:
            3px 3px 0 var(--mainColor),
            -1px -1px 0 var(--mainColor),
            1px -1px 0 var(--mainColor),
            -1px 1px 0 var(--mainColor),
            1px 1px 0 var(--mainColor);
        }
      }



  }