/*
Theme Name: Bopgun
Theme URI: 
Author: bopgun
Author URI: http://www.bopgun.com
Description: 
Version: 1.0.0
Text Domain: 
*/




/* 
-----------
BELOW 960PX 
-----------
*/
@media screen and (max-width: 959px) {

.fixed-width {
	width: 100%;
	padding: 0 20px;
}

/* Header */

.header .contact {
	width: 160px;
	float: left;
	margin: 0 0 0 -20px;
}
.header .logo {
	float: none;
	margin: 0 auto;
	position: absolute;
	left: 0;
	right: 0;
	z-index: 1;
}
.header .menu {
	width: 100vw;
    height: 100vh;
    padding: 25vh 0 60px 0;
    background-color: #36A9E1;
    border-top: 2px solid #F1F1F1;
    position: fixed;
    top: 70px;
    left: -100vw;
    overflow-y: scroll;
    overflow-x: hidden;
    box-sizing: border-box;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    -ms-transition: .5s ease-in-out;
    -webkit-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.header .menu.open {left: 0;}
.header .menu .item {
	width: 100%;
	text-align: center;
	padding: 0px;
	margin: 0 0 20px 0;
	border-right: 0px;
}
.header .menu .item p {font-size: 20px;}
.header .menu .item:hover p, 
.header .menu .item.active p {
	color: #FFFFFF;
	font-weight: 600;
}
.header .toggle {display: inline-block;}

/* Footer */

.footer {padding: 10px 20px;}
.footer .legal {
    width: 50%;
    padding: 10px 0 10px 20px;
    margin: 0 0 0 140px;
}

/* Home */

.home-hero .logo {text-align: left;}

/* About */

.aboutus-statement {background-image: none;}
.aboutus-statement h3 {
    width: 100%;
    text-align: center;
}
.aboutus-gallery img {width: 33.33%;}

/* Contact */

.contactus-intro .left {width: 30%;}
.contactus-intro .right {width: 65%;}

}



/* 
-----------
BELOW 768PX 
-----------
*/
@media screen and (max-width: 767px) {

h1 {font-size: 45px;}
h2 {font-size: 28px;}
h3 {font-size: 22px;}

.content {margin: 60px 0 0 0;}

/* Header */

.header {height: 60px;}
.header .contact {padding: 20px 0 0 0;}
.header .toggle {padding: 10px 0 0 0;}
.header .menu {
	top: 60px;
	border-top: 1px solid #F1F1F1;
}
.header .logo {width: 160px;}

/* Footer */

.footer {
	padding: 40px 0;
	text-align: center;
}
.footer .logo,
.footer .rics {
	margin: 0 auto;
	position: static;
    top: auto;
    transform: translateY(0%);    
}
.footer .legal {
    width: 100%;
    padding: 10px 0;
    margin: 0 auto;
    border-left: 0px;
}

/* Home */

.home-hero {
    height: auto;
    padding: 100px 0;
}
.home-hero .logo {display: none;}
.home-hero .copy {
	width: 100%;
	text-align: center;
}
.home-hero .copy h1 {margin: 0 0 10px 0;}
.home-intro {padding: 60px 0;}
.home-intro .left {width: 100%;}
.home-intro .right {width: 100%;}
.home-about .left {width: 100%;}
.home-about .left .inner {
    width: 100%;
    float: left;
    padding: 60px 20px 20px 20px;
}
.home-about .right {
    width: 100%;
    float: left;
    padding: 0 20px;
    box-sizing: border-box;
}

/* About us */

.aboutus-bio .left {width: 100%;}
.aboutus-bio .left .inner {
    width: 100%;
    float: left;
    padding: 0 20px 40px 20px;
    box-sizing: border-box;
}
.aboutus-bio .right {
    width: 100%;
    float: left;
    padding: 0 20px;
    box-sizing: border-box;
}

/* Services */

.services-intro {padding: 120px 0 40px 0;}
.services-intro .left {
    width: 100%;
    text-align: center;
    float: left;
    padding: 0px;
}
.services-intro .right {
	width: 100%;
	float: left;
}

/* Case studies */

.casestudies-title {padding: 120px 0 40px 0;}
.casestudies-other .item,
.casestudies-other .item:nth-child(3n+3) {
    width: 49%;
    float: left;
    margin: 0 2% 40px 0;
}
.casestudies-other .item:nth-child(2n+2) {margin: 0 0 40px 0;}

/* Contact us */

.contactus-title {
	padding: 120px 0 40px 0;
	text-align: center;
}
.contactus-intro .left {
    width: 100%;
    padding: 0 0 20px 0;
}
.contactus-intro .right {
    width: 100%;
    float: left;
}

}




/* 
-----------
BELOW 600PX 
-----------
*/
@media screen and (max-width: 599px) {

h1 {font-size: 30px;}
h2 {font-size: 24px;}
h3 {font-size: 18px;}
p, li {font-size: 15px;}

.carousel ul.slick-dots {bottom: 20px;}

/* Header */

.header .contact {
	width: auto;
	padding: 20px 0 0 20px;
	background-color: transparent;
}
.header .contact p {display: none;}
.header .contact i {display: block;}
.header .menu .item p {font-size: 18px;}
.header .logo {width: 140px;}

/* Home */

.home-intro {padding: 40px 0;}
.home-about .left .inner {padding: 40px 20px 20px 20px;}

/* About us */

.aboutus-intro {padding: 80px 0 20px 0;}
.aboutus-bio {padding: 0 0 20px 0;}
.aboutus-gallery img {width: 50%;}

/* Services */

.services-intro {padding: 80px 0 20px 0;}
.services-list {padding: 0px;}
.services-list .divider {padding: 0 0 30px 0;}

/* Case studies */

.casestudies-title {padding: 80px 0 20px 0;}
.casestudies-list .divider {padding: 0 0 30px 0;}
.casestudies-other .item,
.casestudies-other .item, .casestudies-other .item:nth-child(3n+3),
.casestudies-other .item, .casestudies-other .item:nth-child(2n+2) {
    width: 100%;
    margin: 0 0 40px 0;
}

/* Contact us */

.contactus-title {padding: 80px 0 20px 0;}

}