

/*  1680px  */
@media all and (max-width: 1800px) {

.services div figure {height:395px;}

.service-content p {  max-width: 80%;}

.service-content h2 {margin-bottom:0px; font-size:40px; line-height:60px;}

.service-content {padding:30px!important;}
	
.service-content img {  width: 120px !important;  margin: 20px auto 0px auto;}	

.service-content .readmore {  margin: 20px auto;}



}











/*  1350px  */
@media all and (max-width: 1479px) {

.grid-1280 { width:1280px;}
	
.slider-container,  #banner1, #banner2, #banner3, #banner4  { height:650px;	}

#banner1 .small-heading, #banner2 .small-heading, #banner3 .small-heading, #banner4 .small-heading { padding-top:200px;}

.controls-container {  bottom: 50px;}

.services div figure {height:335px;}

.service-content p {  max-width: 100%;}

.service-content h2 {margin-bottom:0px; font-size:40px; line-height:60px;}

.service-content {padding:30px!important;}
	
.service-content img {  width: 100px !important;  margin: 0px auto 0px auto;}	

.service-content .readmore {  margin: 20px auto;}

.inside-banner {  height: 450px;}

.inside-banner .small-heading {  padding-top: 160px;}

.vline img {  position: absolute;  margin-top: -60px;  height: 120px; width:4px;}
	
}




/*  1240px  */
@media all and (max-width: 1339px) {
 
.grid-1280 { width:1200px;}
	
.top-navigation ul li {  margin-right: 80px;}

.group-pics-left img,  .group-pics-right img {  width: 175px;}

.mission-and-vision-box {  padding: 87px 84px;}

.mission-and-vision .readmore {  margin-top: 44px;}

#banner1 h2, #banner2 h2, #banner3 h2, #banner4 h2 { font-size:250px; line-height:250px; }

.services div figure {    height: 310px;  }

.service-content h2 {    margin-bottom: 0px;    font-size: 30px;    line-height: 45px;  }

h2 {  font-size: 50px; margin: 0px 0px 20px 0px;}

.fullsize-video {height:670px; }
	
.day-right::before {  margin-left: -66px;}

.day-left::before {margin-right: -65px;}	

.t-training-days .day-left::before {    margin-right: -64px;  }

.t-training-days .day-right::before {    margin-left: -64px;  }

.month-box2 {  height: 1560px;}

}












/*  980px  */
@media all and (max-width: 1239px) {

.grid-1280 { width:920px;}
	
.col-1-of-1, .col-1-of-2, .col-1-of-3, .col-1-of-4, .col-1-of-5, .col-1-of-6, .col-1-of-7, .col-1-of-8, .col-1-of-9, .col-1-of-10, .col-1-of-11, .col-1-of-12, .col-2-of-3, .col-2-of-5,  .col-3-of-5, .col-4-of-5, .col-3-of-4, .col-5-of-6, .col-4-of-6, .col-3-of-6, .col-2-of-6, .col-6-of-7, .col-5-of-7, .col-4-of-7, .col-3-of-7, .col-2-of-7, .col-7-of-8, .col-6-of-8, .col-5-of-8, .col-4-of-8, .col-3-of-8, .col-2-of-8, .col-8-of-9,  .col-7-of-9,  .col-6-of-9, .col-5-of-9, .col-4-of-9, .col-3-of-9, .col-3-of-9, .col-2-of-9 {padding: 0px 10px;} 	
	

.responsive-menu-icon {display: block;}
	
.top-navigation {display:none; background-color:#222; position:fixed; left:0px; top:0px; margin:0px; padding:0px; background-image:url(../images/touch-of-ink-logo.png); background-repeat:no-repeat; background-position: 20px 12px; background-size:45px;  transition: all 1s linear;} 	

.top-navigation ul, header.darker .top-navigation ul {  margin: 65px 0px 0px 0px; }

.top-navigation ul li {width:100%; border-top:1px solid #666; }

.top-navigation ul li a {display:block; padding: 10px 20px;}

.top-navigation ul li a:hover {background-color:#111;}

.top-navigation ul li:last-child {border-bottom:1px solid #666;}

.logo-gap {display:none;}

header.darker .logo a img {  width: 70px;}

header.darker .logo a {width:90px;}

header.darker {height:66px;}
	
.slider-container,  #banner1, #banner2, #banner3, #banner4  { height:500px;	}	

#banner1 .small-heading, #banner2 .small-heading, #banner3 .small-heading, #banner4 .small-heading {    padding-top: 170px;  }

#banner1 h2, #banner2 h2, #banner3 h2, #banner4 h2 {    font-size: 200px;    line-height: 200px;  }

.vline img {height:100px; width:3px; margin-top: -45px;}

.group-pics-left img, .group-pics-right img { width: 130px; }

.big-para {  font-size: 17px;}

body {  font-size: 14px;  line-height: 24px;}

.mission-and-vision-box {  background-size: auto 109%;  background-position: center top; padding:0px;}

.cream-box {width:80%; margin:74px auto;}

.services div {  width: 50%;}

.services div figure {    height: 370px;  }

.service-content {    padding: 60px !important;    width: 100% !important;  }

.artist {  padding: 38px 0px 38px 0px;}

#footer-logo-holder {display:none;}

footer .col-2-of-6 {width:50%;}
	
.submit-button, .textbox1 {width:80%;}

.inside-banner {  height: 350px;}

.inside-banner .small-heading {  padding-top: 130px;}

.inside-banner h2 {  font-size: 150px;  line-height: 150px;}

.logo a img {  width: 80px;}

.logo a  {  width: 100px;}

.fullsize-video {height:520px; }

.p-training-darkarea {  margin: 0px 0px;}

.day-right::before {  margin-left: -52px;}

.day-left::before {margin-right: -52px;}	


.day-left li img, .day-right li img { margin-bottom: 16px;}

.day-left li, .day-right li {  margin-bottom: 14px;}

.p-training-darkarea .t-training-days { background-position: center 200px;  background-size: 2px 765px;}	
	
.t-training-days .day-left::before {    margin-right: -64px;  }

.t-training-days .day-right::before {    margin-left: -64px;  }
	
.t-training-days {  background-position: center 159px;  background-size: 2px 1120px;}	

.t-training-days .day-right::before {    margin-left: -51px;  }

.t-training-days .day-left::before {    margin-right: -52px;  }

.t-training-darkarea {margin:0px;}
	
.month-box {height:1200px;}	
	
.clear {  clear: both;  height: 20px;}	

.about-course {  padding: 60px 0px 30px 0px;}

.t-training-days {    background-position: center 159px;    background-size: 2px 1180px;  }

.kit-box {  height: 230px;}

.training-kit {  padding: 50px 0px 20px 0px;}

.t-training-darkarea.second-option .t-training-days {  background-position: center 205px;  background-size: 2px 845px; margin:0px;}
  
  

	
}




/*  768px  */
@media all and (max-width: 979px) {

.grid-1280 { width:740px;}	

.col-1-of-4  {width: 50%;}	

.col-1-of-5  {width: 33.33%;}	

.col-1-of-6  {width: 33.33%;}	

.col-1-of-7  {width: 25%;}	

.col-1-of-8  {width: 25%;}	
		
.col-1-of-9  {width: 20%;}	
		
.col-1-of-10  {width: 20%;}	
	
.col-1-of-11  {width: 16.66%;}
	
.col-1-of-12 {width: 16.66%;}
	
.col-5-of-8 {    width: 75%;	}
	
.col-3-of-9 {    width: 40.00%;	}
	
.col-1-of-9 {    width: 25%;}	
	
.col-2-of-9 {    width: 25%	}
	
.col-3-of-9 {    width: 50%;}	
	
.col-3-of-8 {    width: 50%;	}

.col-2-of-3, .col-2-of-5, .col-3-of-5, .col-4-of-5, .col-3-of-4, .col-5-of-6, .col-4-of-6, .col-3-of-6, .col-2-of-6,  .col-6-of-7, .col-5-of-7, .col-4-of-7, .col-3-of-7, .col-2-of-7, .col-7-of-8, .col-6-of-8, .col-8-of-9,  .col-7-of-9, .col-6-of-9, .col-5-of-9, .col-4-of-9 {width: 100%;}	

	
.slider-container,  #banner1, #banner2, #banner3, #banner4  { height:400px;	}	

#banner1 .small-heading, #banner2 .small-heading, #banner3 .small-heading, #banner4 .small-heading {    padding-top: 120px;  }

#banner1 h2, #banner2 h2, #banner3 h2, #banner4 h2 {    font-size: 150px;    line-height: 150px;  }

.logo a {width:80px;}

.logo a img {width:60px;}

.logo {  margin-top: 5px;}

.aboutus, .training {  padding: 70px 0px 70px 0px;}	

.aboutus .col-1-of-2, .training .col-1-of-2 {width:100%;}

.aboutus p, .training p, .artist p {  max-width: 100%; text-align:justify;}
	
.aboutus .small-heading, .aboutus h2, .training .small-heading, .training h2, .artist .small-heading, .artist h2 {text-align:center;}	

.aboutus .readmore, .training .readmore, .artist .readmore {margin:30px auto;}

.group-pics-left, .group-pics-right {text-align:center;}

.group-pics-left img, .group-pics-right img {    width: 150px;  }

.training p, .training h2, .training .small-heading {  padding-left: 0;}

.copyright a {  margin: 5px 10px;}

footer {  padding: 90px 0px 90px 0px;}

.copyright {border-top:1px solid #333; border-bottom:1px solid #333;}

h2 {    font-size: 40px; line-height:50px;  }

.small-heading {  font-size: 16px;}
	
.cream-box { width: 100%; margin: 50px auto; background-color:#c59d5f; margin:0px;  }	

.mission-and-vision {  padding: 0px 0px 30px 0px;}

.services div {    width: 100%;  }

.services div figure {    height: 570px;  }

.service-content img {    width: 150px !important;    margin: 100px auto 0px auto;  }

.mission-and-vision .readmore {    margin-top: 30px;  }

.artist .col-1-of-2 {width:100%;}

.artist {  background-position: left top;  background-repeat: no-repeat;  background-size: 100% auto; padding-top:730px;}

.artist p {  padding-right: 0px;}

.showcase {  width: 50%;}

.inside-content .col-1-of-2 {width:100%;}

.inside-content .col-1-of-2 p {text-align:justify;}

.inside-content .small-heading, .inside-content .col-1-of-2 h2 {text-align:center;}

.extra-gap {  padding: 30px 0px;}
	
.fullsize-video {height:425px; }	
	
.inside-banner h2 {    font-size: 120px;   line-height: 120px;  }	
	
.kit-box {  height: 240px;}

.training-kit {  padding: 80px 0px 10px 0px;}

.p-training-darkarea .t-training-days {    background-position: center 178px;  background-size: 2px 781px;}

.day-right::before {    margin-left: -45px;  }

.day-left::before {    margin-right: -44px;  }

.t-training-days .day-right::before {    margin-left: -43px;  }

.t-training-days .day-left::before {    margin-right: -43px;  }

.t-training-days {    background-position: center 139px;    background-size: 2px 1320px;  }
	
.about-course .col-1-of-3 { width:100%;}

.month-box {padding:20px;  height:auto; margin: 10px 0px;}

.month-box p {text-align:justify;}	

.piercing-photos-silder {    margin-top: -30px;  }

.month-box2 {    height: auto;  }

.training-kit {    padding: 60px 0px 10px 0px;  }

.t-training-darkarea.second-option {margin-bottom:0px;}

.inside-content {  padding: 40px 0px;}

.t-training-darkarea.second-option .t-training-days {    background-position: center 177px;    background-size: 2px 973px;    margin: 0px;  }
	

	
}





/*  640px  */
@media all and (max-width: 767px) {

.grid-1280 { width:600px;}	
	
.col-1-of-1, .col-1-of-2, .col-1-of-3, .col-1-of-4, .col-1-of-5, .col-1-of-6, .col-1-of-7, .col-1-of-8, .col-1-of-9, .col-1-of-10, .col-1-of-11, .col-1-of-12, .col-2-of-3, .col-2-of-5,  .col-3-of-5, .col-4-of-5, .col-3-of-4, .col-5-of-6, .col-4-of-6, .col-3-of-6, .col-2-of-6, .col-6-of-7, .col-5-of-7, .col-4-of-7, .col-3-of-7, .col-2-of-7, .col-8-of-9, .col-7-of-9,  .col-6-of-9, .col-5-of-9, .col-4-of-9, .col-3-of-9, .col-2-of-9, .col-7-of-8, .col-6-of-8, .col-5-of-8, .col-4-of-8, .col-3-of-8, .col-2-of-8 {padding: 0px 5px;} 
	
.slider-container,  #banner1, #banner2, #banner3, #banner4  { height:360px;	}	

#banner1 .small-heading, #banner2 .small-heading, #banner3 .small-heading, #banner4 .small-heading {    padding-top: 100px;  }

#banner1 h2, #banner2 h2, #banner3 h2, #banner4 h2 {    font-size: 150px;    line-height: 150px;  }

.services div figure {    height: 470px;  }

.service-content img {    width: 150px !important;    margin: 30px auto 0px auto;  }

.artist {    padding-top: 620px;  }
	
footer .col-2-of-6 {    width: 100%;  }

footer .small-heading {  text-align: center;  padding-left: 0px;}

footer h2 {  color: #fff;  text-align: center;}

.submit-button, .textbox1 {    width: 100%;  }

.col-2-of-6.footer-contact { padding-top:50px;}

.footer-contact	.small-heading {  text-align: center!important;  padding-left: 0px; width: 100%;}

.footer-contact {  text-align: center;}

.footer-contact span  {text-align:left;}

.footer-contact span img {  float: left;  margin-left: 0px;  width: 50px; margin-right:20px;}

.footer-contact span {  display: block;  margin: 30px auto;  width: 310px;}

.inside-banner {    height: 300px;  }

.inside-banner .small-heading {    padding-top: 100px;  }

.inside-banner h2 {    font-size: 120px;   line-height: 120px;  }

.page-intro {  padding: 30px 0px 50px 0px;}

.inside-banner h2 { word-spacing: -12px;}
	
.fullsize-video {height:335px; }	
	
.col-1-of-3 .kit-box {    height: 255px;  margin-bottom: 10px; }	

.col-1-of-4 .kit-box {    height: 170px;  margin-bottom: 10px; }	

.training-kit {    padding: 80px 0px 20px 0px;  }

.day-left li, .day-right li {    font-size: 13px;  }

.day-right::before {    margin-left: -38px;  }

.day-left::before {    margin-right: -37px;  }

.p-training-darkarea .t-training-days {    background-position: center 178px;    background-size: 2px 873px;  }

.inside-content {  padding: 40px 0px;}

.clear {  clear: both;  height: 20px;}

.small-heading {  letter-spacing: 2px;	}

.col-1-of-4 .kit-box, .col-1-of-5 .kit-box {    height: 188px;   margin-bottom: 10px;  }
	
.t-training-days .day-right::before {    margin-left: -38px;  }

.t-training-days .day-left::before {    margin-right: -37px;  }

.t-training-days {    background-position: center 139px;   background-size: 2px 1430px;  }

.day-left b, .day-right b {font-size:25px; line-height:15px;}

.day-left {padding-left:0px;}

.day-right {padding-right:0px;}

.t-training-days {    background-position: center 139px;    background-size: 2px 1330px;  }

.training-kit {    padding: 50px 0px 20px 0px;  }	
	
}





/*  480px  */
@media all and (max-width: 639px) {

.grid-1280 { width:440px;}	
	
.col-1-of-2, .col-5-of-8, .col-4-of-8, .col-3-of-8, .col-2-of-8, .col-3-of-9, .col-2-of-9  {width: 100%; float: none;}	

.col-1-of-3  {width: 100%; float: none;}	
	
.col-1-of-4  {width: 100%; float: none;}	

.col-1-of-5  {width: 100%; float: none;}	

.col-1-of-6  {width: 50%;}	

.col-1-of-7  {width: 33.33%;}	

.col-1-of-8  {width: 33.33%;}
		
.col-1-of-9  {width: 33.33%;}
		
.col-1-of-10  {width: 33.33%;}
	
.col-1-of-11  {width: 33.33%;}
	
.col-1-of-12 {width: 33.33%;}
	
	
.cream-box {  padding: 40px;}

.group-pics-left img, .group-pics-right img {    width: 120px;  }

.aboutus, .training {    padding: 70px 0px 30px 0px;  }

.services div figure {    height: 360px;  }

.service-content img {    width: 100px !important;    margin: 0px auto 0px auto;  }

.artist {    padding-top: 470px;  }

.showcase {    width: 100%;  }	
	
.copyright a {    margin: 5px 3px;  }	

.listing li, p {text-align:justify;}
	
.fullsize-video {height:245px; }		
	
.inside-banner h2 {    font-size: 70px;    line-height: 80px;  }	

.inside-banner .small-heading {    padding-top: 110px;  }

.col-1-of-3 .kit-box {    height: auto;    margin-bottom: 10px;  }

.p-training-darkarea .t-training-days {    background-position: 20px 178px;    background-size: 2px 873px;  }

.day-right {  width: 90%;  float: right;  min-height: 150px;  padding-right: 0px;}
	
.day-left {  width: 90%;  float: right;  text-align: left;  min-height: 150px;  padding-left: 0px;}

.day-left::before, .day-right::before {    margin-left: -33px; float:left;  }

.day-left li img {  float: left;  margin-left: 0px;  margin-right: 10px; margin-top: 7px;}

.day-right li img {  float: left;  margin-right: 10px;  margin-top: 7px;}

.p-training-darkarea .t-training-days {    background-position: 20px 178px;    background-size: 2px 825px;  }

.small-heading {    letter-spacing: 1px;    font-size: 14px;  }

.t-training-days {    background-position: 24px 139px;    background-size: 2px 1130px;  }

.t-training-days .day-right::before {   margin-left: -33px;  }

.about-course p, .page-intro p {text-align:justify;}

.training-kit {    padding: 40px 0px 20px 0px;  }

.t-training-darkarea.second-option .t-training-days {    background-position: 20px 177px;    background-size: 2px 790px;    margin: 0px;  }



}











/*  360px  */
@media all and (max-width: 479px) {

.grid-1280 { width:320px;}	
	
.col-1-of-6  {width: 100%; float: none;}	

.col-1-of-7  {width: 50%;}	

.col-1-of-8  {width: 50%;}
		
.col-1-of-9  {width: 50%;}
		
.col-1-of-10  {width: 50%;}
	
.col-1-of-11  {width: 50%;}
	
.col-1-of-12 {width: 50%;}	


.slider-container,  #banner1, #banner2, #banner3, #banner4  { height:640px;	}	

#banner1 .small-heading, #banner2 .small-heading, #banner3 .small-heading, #banner4 .small-heading {    padding-top: 130px;  }

#banner1 h2, #banner2 h2, #banner3 h2, #banner4 h2 {    font-size: 100px;    line-height: 100px; padding: 20px 50px;  }

.whatsapp, .call {width:43%; bottom:0px; left:0px; z-index: 10;  height: 50px; border:0px!important; font-size: 13px; border-top:1px solid #444!important; border-left:1px solid #444!important;}

.whatsapp {left: 43%; }

.whatsapp:hover, .call:hover {border:0px!important; border-top:1px solid #444!important; border-left:1px solid #444!important; }

.scrolltop {  right: 0px;  bottom: 0px;  z-index: 10000000!important; display:block!important;}

.scroll {right: 0px;  bottom: 0px; display:block!important; z-index: 10000000!important;}

.scroll a {display:block!important; }

.fixed-bottom-links { background-color:#111; width:100%; display:table; position:fixed; left:0px; bottom:0px;  z-index: 1000; height:50px; }

.call img, .whatsapp img {    width: 25px;    margin-top: 5px;    margin-left: 2px;  }

.call, .whatsapp {  line-height: 34px;  }

.controls-container {    bottom: 90px;  }

.small-heading {    font-size: 12px;    letter-spacing: 3px;  }
	
.group-pics-left img, .group-pics-right img {    width: 94px; margin: 0px 0px 0px 5px; }

.cream-box {    padding: 30px;  }

h2 {    font-size: 36px;    line-height: 46px;  }

.services div figure {    height: 270px;  }

.service-content {    padding: 30px !important;    width: 100% !important;  }

.services div figure {    height: 330px;  }

.services div figure img {  width: 150%; margin: -15% -30%; }

.services div:hover figure img {  width: 180%;  margin: -30% -45%;  transition: all 0.5s ease-in 0s;}

.service-content img {    width: 130px !important;  }

.artist {   padding-top: 350px;  }

.middle-image {  margin-bottom: 70px !important;}

header.darker .logo a img {    width: 60px;  }

header.darker .logo a {    width: 80px;  }


#banner1 {background-image:url(../images/banner1-mobile.webp); background-position:center center; background-size:cover;}
#banner2 { background-image:url(../images/banner2-mobile.webp); background-position:center center; background-size:cover;}
#banner3 {background-image:url(../images/banner3-mobile.webp); background-position:center center; background-size:cover;}
#banner4 { background-image:url(../images/banner4-mobile.webp); background-position:center center; background-size:cover;}


.copyright a {    margin: 5px 5px;  }

.inside-banner h2 {    font-size: 80px;    line-height: 80px;  word-spacing: -12px;}

.inside-banner {    height: 260px;   }

.clear {  clear: both;  height: 10px;}

.fullsize-video {height:175px; }		
	
.inside-banner .small-heading {    padding-top: 110px;  }

.inside-banner h2 {    font-size: 60px;    line-height: 70px;    word-spacing: -8px;    letter-spacing: 3px;  }

.big-para {    font-size: 15px;  }

.day-left , .day-right {    width: 86.2%;}

.p-training-darkarea .t-training-days {    background-position: 20px 207px;    background-size: 2px 807px;  }

.day-left b, .day-right b {  font-size: 24px;  line-height: 14px;}

.t-training-days {    background-position: 24px 168px;   background-size: 2px 1310px;  }

.about-course {    padding: 30px 0px 30px 0px;  }

.t-training-darkarea.second-option .t-training-days {    background-position: 20px 212px;    background-size: 2px 965px;    margin: 0px;  }

.vline img {    height: 80px;    width: 3px;    margin-top: -45px;  }

}
