*,
*::after,
*::before {
  padding: 0;
  margin: 0;
}
.html {
  font-size: 62.5%;
}

body {
  font-family: 'Abel', sans-serif;
    text-align: justify;
  text-justify: inter-word;
}

/* ///////////..utility classes..///////////*/

.container {
  max-width: 1200px;
  width: 90%;
  margin: auto;
}

.block-heading {
  font-size: 1.2rem;
  font-weight: 600;
}
.page-heading {
  font-size: 1.6rem;
}
.intro-para {
  font-size: 1.2rem;
}

.bold {
font-weight: bold;
}
.handwriting {
font-family: 'La Belle Aurore', sans-serif;
text-align: left;
  text-justify: none;
}

* {
  margin: 0;
  padding: 0;
}

.block-of-text{
  font-size: 1.1rem;
}

* {
  box-sizing: inherit;
  }
.grid-img {
width: 100%;
height: auto;
display:block;
margin: auto;
}
 .image_centre {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* ///////////..GRID DEFINITIONS..///////////*/





*{
padding: 0px;
margin: 0px;
box-sizing: border-box;
}


/* ///////////..ARTIST CONTENT GRID...///////////*/
.artist-content-grid {
  display: grid;
  font-size: 1.1rem;
  gap: 1rem;
  grid-auto-columns: 1fr;
  grid-template-areas:
  'one'
  'two'
  'three'
  'four'
  'five'
  'six'
  'seven'
  'eight'
  'nine'
  'ten'
  'eleven'
  'twelve'
grid-auto-rows: minmax(min-content, max-content);
}


.artist-content:nth-child(1){
   grid-area:one;
}
.artist-content:nth-child(2){
   grid-area:two;
}
.artist-content:nth-child(3){
   grid-area:three;
}
.artist-content:nth-child(4){
   grid-area:four;
}
.artist-content:nth-child(5){
   grid-area:five;
}
.artist-content:nth-child(6){
   grid-area:six;
}
.artist-content:nth-child(7){
   grid-area:seven;
}
.artist-content:nth-child(8){
   grid-area:eight;
}
.artist-content:nth-child(9){
   grid-area:nine;
}
.artist-content:nth-child(10){
   grid-area:ten;
}
.artist-content:nth-child(11){
   grid-area:eleven;
}
.artist-content:nth-child(12){
   grid-area:twelve;
}
.artist-content:nth-child(13){
   grid-area:thirteen;
}
.artist-content:nth-child(14){
   grid-area:fourteen;
}
.artist-content:nth-child(15){
   grid-area:fifteen;
}
.artist-content:nth-child(16){
   grid-area:sixteen;
}
.artist-content:nth-child(17){
   grid-area:seventeen;
}
.artist-content:nth-child(18){
   grid-area:eighteen;
}
.artist-content:nth-child(19){
   grid-area:nineteen;
}
.artist-content:nth-child(20){
   grid-area:twenty;
}
.artist-content:nth-child(21){
   grid-area:twentyone;
}
.artist-content:nth-child(22){
   grid-area:twentytwo;
}
.artist-content:nth-child(23){
   grid-area:twentythree;
}
.artist-content:nth-child(24){
   grid-area:twentyfour;
}
.artist-grid-area-padding {
	padding: 0rem 0rem 0rem 0rem;
}



.main-title {
    margin-top: 1.5em;
}

/* FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER  */
div.border {
   border-bottom: 1px solid #2a2c2e;
}

div.border_footer {
	 border-top: 1px solid #2a2c2e;
}

#footer_container {

	background-color: #2a2c2e;
	font-family: 'Abel', Arial, Helvetica, sans-serif;
	color: #ffffff;
	height: 120px;
}

#footer_left {
	padding-top: 10px;
	float: left;
	min-height: 20px;

}
#footer_centre {
	font-size: 1.2rem;
	line-height: 1.4;
	width: 100%;
	float: left;
	min-height: 17px;
	text-align: center;
}
#footer_right {
	float: right;
	min-height: 20px;
	text-align: right;
}

div.footer a:link {
	color: #ffffff;
	text-decoration: none;
}
div.footer a:visited {
	color: #ffffff;
	text-decoration: none;
}
div.footer a:active {
	color: #8e9091;
	text-decoration: none;
	}
div.footer a:hover {
	color: #8e9091;
	text-decoration: none;
}


/* FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER FOOTER  */



div.main a:link {
	color: #e4e4e4;
	text-decoration: underline;
}
div.main a:visited {
	color: #c4c4c4;
	text-decoration: underline;
}
div.main a:active {
	color: #d4d4d4;
	text-decoration: underline;
	}
div.main a:hover {
	color: #8e9091;
	text-decoration: none;
}

/* ......../ M E D I A /.......... */
/* ......../ M E D I A /.......... */
/* ......../ M E D I A /.......... */
/* ......../ M E D I A /.......... */
/* ......../ M E D I A /.......... */


/* ............/navbar/............ *
/* ......../ media query for nav/.......TWEAK POINT FOR  MENU COLLAPSE... */

@media only screen and (min-width: 220px) and (max-width: 959px) {
  .navbar {
    opacity: 0.95;
  }

  .navbar-container input[type="checkbox"],
  .navbar-container .hamburger-lines {
    display: block;
  }

  .navbar-container {
    display: block;
    position: relative;
    max-height: 64px;
  }

  .navbar-container input[type="checkbox"] {
    position: absolute;
    display: block;
    height: 32px;
    width: 30px;
    top: 20px;
    right: 20px;
    z-index: 5;
    opacity: 0;
  }

  .navbar-container .hamburger-lines {
    display: block;
    height: 23px;
    width: 35px;
    position: absolute;
    top: 17px;
    right: 20px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .navbar-container .hamburger-lines .line {
    display: block;
    height: 4px;
    width: 100%;
    border-radius: 10px;
    background: #333;
  }

  .navbar-container .hamburger-lines .line1 {
    transform-origin: 0% 0%;
    transition: transform 0.4s ease-in-out;
  }

  .navbar-container .hamburger-lines .line2 {
    transition: transform 0.2s ease-in-out;
  }

  .navbar-container .hamburger-lines .line3 {
    transform-origin: 0% 100%;
    transition: transform 0.4s ease-in-out;
  }

  .navbar .menu-items {
    padding-top: 100px;
    background: #fff;
    height: 100vh;
    max-width: 300px;
    transform: translate(-150%);
    display: flex;
    flex-direction: column;
/*    margin-left: -40px;
    padding-left: 50px;*/
    margin-right: -40px;
    padding-right: 50px;
    transition: transform 0.5s ease-in-out;
    box-shadow: 5px 0px 10px 0px #aaa;
  }

  .navbar .menu-items li {
    margin-bottom: 1.5rem;
    font-size: 1.3rem;
    font-weight: 500;
  }
.menu-items a {
  text-decoration: none;
  color: #2a2c2e;

  transition: color 0.6s ease-in-out;
}

.menu-items a:hover {
  opacity: 0.7;
  transition: color 0.7s ease-in-out;
}
 .logo {
    position: absolute;
    top: 5px;
    left: 15px;
    font-size: 2rem;
  }

  .logo img {
    max-width: 70%;
    width: 70%;
    float: left;
}
  .navbar-container input[type="checkbox"]:checked ~ .menu-items {
    transform: translateX(0);
  }
  .navbar-container input[type="checkbox"]:checked ~ .hamburger-lines .line1 {
    transform: rotate(35deg);
  }
  .navbar-container input[type="checkbox"]:checked ~ .hamburger-lines .line2 {
    transform: scaleY(0);
  }
  .navbar-container input[type="checkbox"]:checked ~ .hamburger-lines .line3 {
    transform: rotate(-35deg);
  }
  .img-container {
    margin: 0;
  }

	.grid-area-padding {
	padding: 0.5rem 0.5rem 0.5rem .5rem;
}
#wrapper-main-grid {
    height: 100vh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    grid-template-columns: 1fr;
    gap: 0rem;
    grid-template-areas:
    'page-header-gta'
    'page-body-gta'
    'page-footer-gta'
    }
#wrapper-main-grid > header {
    color: #fff;
	 grid-area:page-header-gta;
    min-height: 64px;
        }
#wrapper-main-grid > main {
     padding-top: 0rem;
     max-width: 1200px;
     width: 90%;
     margin: 0px auto 0px auto;
	  grid-area: page-body-gta;
        }
#wrapper-main-grid > footer {
    background-color: #2a2c2e;
    color: #fff;
	 grid-area:page-footer-gta;
        }

}

/* ......../ media query  max-width 960/.....DESKTOP DESKTOP..... */
/* ......../ media query  max-width 960/.....DESKTOP DESKTOP..... */

@media only screen and (min-width: 960px) {

.navbar input[type="checkbox"],
.navbar .hamburger-lines {
  display: none;
}

.navbar {
  position: fixed;
  width: 100%;
  background: #fff;
  color: #2a2c2e;
  height: 100px;
  z-index: 12;
}

.navbar-container {
  display: flex;
  justify-content: space-between;
  height: 100px;
  align-items: end;
}

.menu-items {
  order: 2;
  display: flex;
}

.menu-items li {
  list-style: none;
  margin-left: 1.5rem;
  margin-bottom: 1.4rem;
  font-size: 1.4rem;
}

.menu-items a {
  text-decoration: none;
  color: #2a2c2e;

  transition: color 0.6s ease-in-out;
}

.menu-items a:hover {
  opacity: 0.7;
  transition: color 0.7s ease-in-out;
}

.logo {
  order: 1;
  font-size: 2.3rem;
  margin-bottom: 0.5rem;
}

.logo img {
    max-width: 100%;
    width: 100%;
    height: auto !important;
}
#wrapper-main-grid {
    height: 100vh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    grid-template-columns: 1fr;
    gap: 0rem;
    grid-template-areas:
    'page-header-gta'
    'page-body-gta'
    'page-footer-gta'
    }
#wrapper-main-grid > header {
    color: #fff;
	 grid-area:page-header-gta;
    min-height: 100px;
        }
#wrapper-main-grid > main {
     padding-top: 0rem;
     max-width: 1200px;
     width: 90%;
     margin: 0px auto 0px auto;
	  grid-area: page-body-gta;
        }
#wrapper-main-grid > footer {
    background-color: #2a2c2e;
    color: #fff;
	 grid-area:page-footer-gta;
        }
.home-page {
   background-image: url(../page_images/home-image-lou_4_1200x700.jpg);
	height:100%;
	width: auto;
	background-size: cover;
   margin-left: auto;
 	margin-right: auto;
 	background-repeat: no-repeat;
 	background-position: left center;
}

}
/* ............/navbar - desktop - end/............ /*


/* ............SMALLEST SCREEN SIZE.....smallest mob....... */


@media only screen and (min-width: 220px)  {
  .artist-content-grid {
grid-template-areas:
'one one one one one one one one one one one one'
'two two two two two two two two two two two two'
'three three three three three three three three three three three three'
'five five five five five five five five five five five five'
'four four four four four four four four four four four four'
'six six six six six six six six six six six six'
'seven seven seven seven seven seven eight eight eight eight eight eight'
'nine nine nine nine nine nine ten ten ten ten ten ten'
'eleven eleven eleven eleven eleven eleven twelve twelve twelve twelve twelve twelve'
'thirteen thirteen thirteen thirteen thirteen thirteen fourteen fourteen fourteen fourteen fourteen fourteen'
'fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen'
'sixteen sixteen sixteen sixteen sixteen sixteen seventeen seventeen seventeen seventeen seventeen seventeen'
'eighteen eighteen eighteen eighteen eighteen eighteen nineteen nineteen nineteen nineteen nineteen nineteen'
'twenty twenty twenty twenty twenty twenty twentythree twentythree twentythree twentythree twentythree twentythree'
'twentytwo twentytwo twentytwo twentytwo twentytwo twentytwo twentyone twentyone twentyone twentyone twentyone twentyone'
}
}


/* ......../ media query  480/......largest mob.... */


@media only screen and (min-width: 480px) {
  .artist-content-grid {
grid-template-areas:
'one one one one one one one one one one one one'
'two two two two two two two two two two two two'
'three three three three three three three three three three three three'
'five five five five five five five five five five five five'
'four four four four four four four four four four four four'
'six six six six six six six six six six six six'
'seven seven seven seven seven seven eight eight eight eight eight eight'
'nine nine nine nine nine nine ten ten ten ten ten ten'
'eleven eleven eleven eleven eleven eleven twelve twelve twelve twelve twelve twelve'
'thirteen thirteen thirteen thirteen thirteen thirteen fourteen fourteen fourteen fourteen fourteen fourteen'
'fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen'
'sixteen sixteen sixteen sixteen sixteen sixteen seventeen seventeen seventeen seventeen seventeen seventeen'
'eighteen eighteen eighteen eighteen eighteen eighteen nineteen nineteen nineteen nineteen nineteen nineteen'
'twenty twenty twenty twenty twenty twenty twentythree twentythree twentythree twentythree twentythree twentythree'
'twentytwo twentytwo twentytwo twentytwo twentytwo twentytwo twentyone twentyone twentyone twentyone twentyone twentyone'
}
}


/* ......../ media query  630/......tweak.... */


@media only screen and (min-width: 630px) {
  .artist-content-grid {
grid-template-areas:
'one one one one one one one one one one one one'
'two two two two two two two two two two two two'
'three three three three three three three five five five five five'
' . . . . . . . five five five five five'
'four four four four four four four five five five five five'
'six six six six six six six six six six six six'
'seven seven seven eight eight eight nine nine nine ten ten ten'
'eleven eleven eleven twelve twelve twelve thirteen thirteen thirteen fourteen fourteen fourteen'
'fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen'
'sixteen sixteen sixteen seventeen seventeen seventeen eighteen eighteen eighteen nineteen nineteen nineteen'
'twenty twenty twenty twentyone twentyone twentyone twentytwo twentytwo twentytwo twentythree twentythree twentythree'
}
}

/* ......../ media query  768/.......largest tablet... */

@media only screen and (min-width: 768px)  {
  .artist-content-grid {
grid-template-areas:
'one one one one one one one one one one one one'
'two two two two two two two two two two two two'
' . . . . . . . five five five five five'
'three three three three three three three five five five five five'
' . . . . . . . five five five five five'
'four four four four four four four five five five five five'
' . . . . . . . five five five five five'
'six six six six six six six six six six six six'
'seven seven seven eight eight eight nine nine nine ten ten ten'
'eleven eleven eleven twelve twelve twelve thirteen thirteen thirteen fourteen fourteen fourteen'
'fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen'
'sixteen sixteen sixteen seventeen seventeen seventeen eighteen eighteen eighteen nineteen nineteen nineteen'
'twenty twenty twenty twentyone twentyone twentyone twentytwo twentytwo twentytwo twentythree twentythree twentythree'
}
}

/* ......../ media query  min-width 960/.....BREAK POINT FOR  MENU COLLAPSE..... */

@media only screen and (min-width: 960px) {
  .artist-content-grid {
grid-template-areas:
'one one one one one one one one one one one one'
'two two two two two two two two two two two two'
' . . . . . . . . five five five five'
'three three three three three three three three five five five five'
' . . . . . . . . five five five five'
'four four four four four four four four five five five five'
' . . . . . . . . five five five five'
'six six six six six six six six six six six six'
'seven seven seven eight eight eight nine nine nine ten ten ten'
'eleven eleven eleven twelve twelve twelve thirteen thirteen thirteen fourteen fourteen fourteen'
'fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen'
'sixteen sixteen sixteen seventeen seventeen seventeen eighteen eighteen eighteen nineteen nineteen nineteen'
'twenty twenty twenty twentyone twentyone twentyone twentytwo twentytwo twentytwo twentythree twentythree twentythree'
}
	}


/* ......../ media query  min-width 1050/...... TWEAK POINT FOR         .... */

@media only screen and (min-width: 1050px) {
  .artist-content-grid {
grid-template-areas:
'one one one one one one one one one one one one'
'two two two two two two two two two two two two'
' . . . . . . . . five five five five'
'three three three three three three three three five five five five'
' . . . . . . . . five five five five'
'four four four four four four four four five five five five'
' . . . . . . . . five five five five'
'six six six six six six six six six six six six'
'seven seven seven eight eight eight nine nine nine ten ten ten'
'eleven eleven eleven twelve twelve twelve thirteen thirteen thirteen fourteen fourteen fourteen'
'fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen'
'sixteen sixteen sixteen seventeen seventeen seventeen eighteen eighteen eighteen nineteen nineteen nineteen'
'twenty twenty twenty twentyone twentyone twentyone twentytwo twentytwo twentytwo twentythree twentythree twentythree'
}
}




/* ......../ media query  min-width 1140/...... TWEAK POINT FOR         .... */

@media only screen and (min-width: 1140px) {
  .artist-content-grid {
grid-template-areas:
'one one one one one one one one one one one one'
'two two two two two two two two two two two two'
' . . . . . . . . five five five five'
'three three three three three three three three five five five five'
' . . . . . . . . five five five five'
'four four four four four four four four five five five five'
' . . . . . . . . five five five five'
'six six six six six six six six six six six six'
'seven seven seven eight eight eight nine nine nine ten ten ten'
'eleven eleven eleven twelve twelve twelve thirteen thirteen thirteen fourteen fourteen fourteen'
'fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen'
'sixteen sixteen sixteen seventeen seventeen seventeen eighteen eighteen eighteen nineteen nineteen nineteen'
'twenty twenty twenty twentyone twentyone twentyone twentytwo twentytwo twentytwo twentythree twentythree twentythree'
}
}

/* ......../ media query  min-width /...... TWEAK POINT FOR         .... */

@media only screen and (min-width: 1200px) {
  .artist-content-grid {
grid-template-areas:
'one one one one one one one one one one one one'
'two two two two two two two two two two two two'
' . . . . . . . . five five five five'
'three three three three three three three three five five five five'
' . . . . . . . . five five five five'
'four four four four four four four four five five five five'
' . . . . . . . . five five five five'
'six six six six six six six six six six six six'
'seven seven seven eight eight eight nine nine nine ten ten ten'
'eleven eleven eleven twelve twelve twelve thirteen thirteen thirteen fourteen fourteen fourteen'
'fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen'
'sixteen sixteen sixteen seventeen seventeen seventeen eighteen eighteen eighteen nineteen nineteen nineteen'
'twenty twenty twenty twentyone twentyone twentyone twentytwo twentytwo twentytwo twentythree twentythree twentythree'
}

}



@media only screen and (min-width: 1300px) {
  .artist-content-grid {
grid-template-areas:
'one one one one one one one one one one one one'
'two two two two two two two two two two two two'
' . . . . . . . . five five five five'
'three three three three three three three three five five five five'
' . . . . . . . . five five five five'
'four four four four four four four four five five five five'
' . . . . . . . . five five five five'
'six six six six six six six six six six six six'
'seven seven seven eight eight eight nine nine nine ten ten ten'
'eleven eleven eleven twelve twelve twelve thirteen thirteen thirteen fourteen fourteen fourteen'
'fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen fifteen'
'sixteen sixteen sixteen seventeen seventeen seventeen eighteen eighteen eighteen nineteen nineteen nineteen'
'twenty twenty twenty twentyone twentyone twentyone twentytwo twentytwo twentytwo twentythree twentythree twentythree'
}

}





@media (orientation: landscape) and (min-height: 400px){
  font-size: 1rem;
  width: 16rem;
}

@media (orientation: landscape) and (min-height: 700px){
  font-size: 1.2rem;
  width: 16.5rem;
}