/*
==================================================
SMITECH WEBSITE
FILE      : responsive.css
PURPOSE   : Global Responsive Design
==================================================
*/


/* ==========================
   GLOBAL
========================== */

img{

max-width:100%;

height:auto;

}


.container{

width:90%;

max-width:1200px;

margin:auto;

}




/* ==========================
   TABLET
========================== */

@media(max-width:992px){


h1{

font-size:42px;

}


h2{

font-size:32px;

}


/* Services */

.services{

grid-template-columns:repeat(2,1fr);

}


/* General Sections */

.section-title p{

font-size:15px;

}



}




/* ==========================
   MOBILE
========================== */

@media(max-width:600px){


.container{

width:92%;

}


/* Typography */

h1{

font-size:32px;

line-height:1.3;

}


h2{

font-size:26px;

}


h3{

font-size:20px;

}



/* Buttons */

.btn{

display:block;

width:100%;

text-align:center;

margin-bottom:12px;

}


/* Hero */

.hero-content{

text-align:center;

}


.hero-buttons{

flex-direction:column;

}



/* Services */

.services{

grid-template-columns:1fr;

}


.service-box{

padding:25px;

}



/* Section spacing */

section{

padding:50px 0;

}


/* Paragraph */

.section-title p{

line-height:1.7;

}



/* Hide unwanted desktop breaks */

br{

display:none;

}


}