Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <div class="home-background-color">
- <div class="container-fluid height-100vh padding-left-top-20px">
- <div class="outer-div-height">
- <div class="inner-div-height padding-left-top-20px inner-div-border">
- <div class="logo-div-position">
- <img src="../../assets/img/intro1/Logo.png" alt="logo">
- </div>
- <div class="humburger-icon" data-toggle="modal" data-target="#myModal">
- <i style="font-size: 2em;color:white;opacity:0.8;" class="glyphicon glyphicon-menu-hamburger" alt="menu-button"></i>
- </div>
- <div class="row img-text-container">
- <div class="col-md-6 col-sm-12 margin-top50">
- <img class="img-responsive custom-height" src="../../assets/img/intro1/boy.png">
- </div>
- <div class="col-md-5 col-sm-12 font padding-left0">
- <p class="home-description">
- WE <strong>STRIVE</strong> TO FIND NEW WAYS TO <strong>SOLVE PROBLEM </strong> UNTIL WE ACHIEVE
- OUR <strong>DESTINY</strong></p>
- </div>
- <div class="page-indicator col-sm-1">
- <!--<img src="../../assets/img/intro1/side-Button.png">
- -->
- <div class="indicator">
- <a href="#home">
- <div>
- </div>
- </a>
- <a href="#intro1">
- <div class="active">
- </div>
- </a>
- <a href="#intro2">
- <div>
- </div>
- </a>
- <a href="#intro3">
- <div>
- </div>
- </a>
- <a href="#intro4">
- <div>
- </div>
- </a>
- </div>
- </div>
- </div>
- <div class="bottom-div">
- <!--<img src="img/bottom-image.png">-->
- <span data-menuanchor="intro2">
- <a href="#intro2"><img src="../../assets/img/intro1/bottom-image.png" alt="bottom image"></a>
- </span>
- </div>
- <div class="footer">
- <div class="btm-indicator" align="centre">
- <div class="indicator">
- <a href="#home">
- <div>
- </div>
- </a>
- <a href="#intro1">
- <div class="active">
- </div>
- </a>
- <a href="#intro2">
- <div>
- </div>
- </a>
- <a href="#intro3">
- <div>
- </div>
- </a>
- <a href="#fifthSection">
- <div>
- </div>
- </a>
- </div>
- <!--<img src="../../assets/img/intro1/bottomButton.png">-->
- </div>
- <div class="btm-slider">
- <!--<img src="img/slider-arrow.png">-->
- <a href="#intro2"><img src="../../assets/img/intro1/slider-arrow.png" alt="bottom image"></a>
- </div>
- </div>
- </div>
- </div>
- </div>
- .padding-left0{
- padding-left: 0;
- }
- .border{
- border: solid; }
- .height-100vh{
- height: 100vh; }
- .inner-div-height{
- position: relative;
- left: 0;
- right: 0;
- height: calc(100% - 40px);
- min-height: calc(100vh - 40px);
- }
- .outer-div-height{
- padding-bottom: 10px;
- }
- .home-background-color{
- background-color: #FFC001;}
- .padding-left-top-20px{
- padding-left: 20px;
- padding-top: 20px;
- }
- .inner-div-border{
- border:18px solid #DBF1ED;
- }
- .logo-div-position{
- display: inline-block;
- position: relative;
- top: -40px;
- left: -40px;
- background-color: #FFC001;
- width: 120px;
- padding-right: 18px;
- padding-bottom: 18px;
- }
- .logo-div-position img{
- width: 100%;
- }
- .humburger-icon{
- float: right;
- margin-top: -40px;
- background-color: #FFC001;
- width: 58px;
- height: 52px;
- text-align: center;
- margin-right: -21px;
- padding-top: 10px;
- }
- .menu-width{
- width: 23px;
- }
- .text-color{
- color: white;
- }
- .margin-top{
- margin-top: 93px;
- }
- .page-indicator{
- margin-top: 128px;
- }
- .page-indicator img{
- max-height: 110px;
- float: right;
- margin-right: 48px;
- margin-top: 50%;
- }
- .custom-height{
- max-height: 340px;
- margin-top: 35px;
- float: right;
- }
- .home-description{
- color: white;
- font-size: 2.5vw;
- margin-top: 24%;
- }
- .bottom-div{
- width: 0;
- height: 30px;
- margin: 0 auto;
- position: absolute;
- left: 0;
- right: 0;
- bottom: 80px;
- }
- .bottom-div img {
- margin-top: 3%;
- margin-bottom: 15px;
- height: 65px;
- }
- @media screen and (max-width: 500px) {
- .home-description {
- font-size: 16px !important;
- }
- }
- .footer{
- width: 100%;
- height: 50px;
- display: none;
- }
- .footer > .btm-indicator img {
- width: 90px;
- height: 10px;
- margin: 0 auto;
- position: absolute;
- left: 0;
- right: 0;
- bottom: 30px;
- padding-right: 10px;
- }
- .footer > .btm-slider img{
- height: 4vw;
- min-height: 15px;
- margin: 0 auto;
- position: absolute;
- right: 0;
- bottom: 30px;
- padding-right: 10px;
- }
- .footer > div{
- display: block;
- }
- @media screen and (max-height: 600px) {
- }
- @media screen and (max-width: 990px) {
- .footer{
- display: block;
- }
- .custom-height {
- margin: 0 auto;
- float: none;
- }
- .home-description{
- margin-top: 8vh;
- text-align: center;
- font-size:30px;
- }
- .logo-div-position{
- width: 100px;
- }
- .page-indicator{
- display: none;
- }
- .bottom-div{
- display: none;
- }
- .inner-div-border{
- border:15px solid #DBF1ED;
- }
- .bottom-page-indicator{
- display: block;
- }
- .bottom-page-slider img{
- display: block;
- }
- .logo-div-position {
- top: -35px;
- left: -35px;
- }
- }
- .img-text-container{
- margin-top:5%;
- }
- @media screen and (max-device-width: 1500px){
- .img-text-container{
- margin-top:0;
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement