Others

MyTravel includes bunch of other predefined classes.

Background image hero

Specify the position of a background image:

Background top position:

Background center position:

Background bottom position:

Background fixed attachment:

                      
                        <div class="bg-img-hero mb-3" style="background-image: url(../assets/img/img24.jpg); height: 250px;"></div>
                        <div class="bg-img-hero-center mb-3" style="background-image: url(../assets/img/img24.jpg); height: 250px;"></div>
                        <div class="bg-img-hero-bottom" style="background-image: url(../assets/img/img24.jpg); height: 250px;"></div>
                        <div class="bg-img-hero-fixed" style="background-image: url(../assets/img/img24.jpg); height: 250px;"></div>

Font sizes

.font-size-1

.font-size-2

.font-size-3

.font-size-4

.font-size-5

.font-size-md-down-3

.font-size-md-down-5

                      
                        <p class="font-size-1">.font-size-1</p>
                        <p class="font-size-2">.font-size-2</p>
                        <p class="font-size-3">.font-size-3</p>
                        <p class="font-size-4">.font-size-4</p>
                        <p class="font-size-5">.font-size-5</p>
                        <p class="font-size-md-down-3 display-4">.font-size-md-down-3</p>
                        <p class="font-size-md-down-5 display-4">.font-size-md-down-5</p>

Line height 

                
                  <p class="text-lh-sm">This is a small line height text.</p>
                  <p class="text-lh-md">This is a medium line height text.</p>

Z-index 

                
                  <span class="z-index-n1"></span>
                  <span class="z-index-2"></span>
                  <span class="z-index-4"></span>

Overflow 

                
                  <span class="overflow-hidden"></span>

Opacity 

                
                  <span class="opacity-md"></span>
Contact Us