/*==================================================
Author: http://themeforest.net/user/navigator
Only At: ThemeForest.net


	* * * CONTENTS * * *

	0. Media screen up to 980 px
	
	1. Media screen up to 810 px
	
	2. Media screen up to 680 px

	3. Table Columns and Small Fixes
	
==================================================*/


/*------------------------------------------------
    0. Media screen up to 980 px
------------------------------------------------*/

@media screen and (max-width: 980px) {

	.wrap {width: 94%;}

	.content {width: 64%;}

	aside {width: 30%;}

	aside.left {
	    margin-right: 3%;
	    padding-right: 3%;
	}
	
	
	aside.right {
	    margin-left: 3%;
	    padding-left: 3%;
	}

	#middle_header .highlight {line-height: 36px;}
	.roundabout {display: none;}

	article .content {width: 100%;}

	.related_articles .third.last {margin-right: 0%;}
	.related_articles .third img {width: 100%; height: auto;}
	
	#top_header {
    padding:0px;
	margin:0px;
    background-color: #25292d;
	height:100%;
	width:100%;
	float:left;
   font-family: 'IBM Plex Sans', sans-serif;
}
#logo {
	float:left;
	width:25%;
	height:300px;
	margin:0px;
	padding:0px;
	background-color:#333333;
	background-image: url("../images/weblogo-big.svg");
	background-repeat:no-repeat;
    background-position: fixed;
 }
#main {
  width: 75%;
  float: left;
  padding: 0px;
  margin:0px;
}
#main .flexslider img{
 object-fit:cover;
 height:300px;
 float: left;
	}
}


/*------------------------------------------------
    1. Media screen up to 710 px 
------------------------------------------------*/

@media screen and (max-width: 710px) {
	
	

	.article_thumb {display: none;}
	.article_data {margin: 0px;}

	article ul.share_icons {
		float: left;
		margin: 5px 0px 10px -5px;
	}

	article a.btn.right {float: none;}
	
	.fourth {width: 50%; float:left; margin-right: 0%;margin-bottom:0px;}
	.fourth:nth-of-type(2n):not(.last):not(.fix_responsive) {margin: 0px 0px 0px 0px;}

	.full_responsive {width: 50%;float:left;}
	.last {margin: 0px;}

	#map {height: 220px;}
	
	#top_header {
    padding:0px;
	margin:0px;
    background-color: #25292d;
	height:100%;
	width:100%;
	float:left;
   font-family: 'IBM Plex Sans', sans-serif;
}
#logo {
	float:left;
	width:35%;
	height:250px;
	margin:0px;
	padding:0px;
	background-color:#333333;
	background-image: url("../images/weblogo-big.svg");
	background-repeat:no-repeat;
    background-position: fixed;
 }
#main {
  width: 65%;
  float: left;
  padding: 0px;
  margin:0px;
}
#main .flexslider img{
 object-fit:cover;
 height:250px;
 float: left;
	}
#services-container h1 {
	font-weight:bold;
	font-size:1.5em;
	color:#fff;
	padding-top:12px;
	

}
#services-container h2 {
	font-weight:normal;
	font-size:18px;
	color:#fff;
	padding:7px;
	line-height:20px;
	}
#services-container h3 {
	font-weight:normal;
	font-size:16px;
	color:#fff;
	padding:9px;

}
	#service-content3-left {
		width:100%;
		float:left;
	}


#service-content3-right {
		width:100%;
		float:left;
	}
	
	#service-content3-right p {
	text-align:center;
	font-style:italic;
	font-size:18px;
	line-height:20px;
	padding-bottom:10px;
	margin-bottom:5px;
	border-bottom: solid 1px #DCDCDC;

}
#service-content3-right p img {
	width:60%;
	margin-left:20%;
	margin-right:20%;
}
	
.back ul {font-size:17px;line-height:25px;padding-top:20px;}
.back p {font-size:19px;line-height:30px;padding:15px;}
	
	#contact-cta-container h1 {
	width:100%;
	text-align:center;
	color:#000;
	font-size:1.5em;
	font-weight:bold;
	padding-bottom:3px;
	
}
#contact-cta-container h2 {
	width:100%;
	text-align:center;
	color:#000;
	font-size:1.25em;
	font-weight:normal;
	padding-bottom:15px;
	
}
	
	#card {
	height:250px;
	margin:2%;
}
#card .front {
	background-color:#555;
}
#card .back {
	background-color:#555;
}

#card2 {
	height:250px;
	margin:2%;
}
#card2 .front {
	background-color:#555;
}
#card2 .back {
	background-color:#555;
}
#card3 {
	height:250px;
	margin:2%;
}
#card3 .front {
	background-color:#555;
}
#card3 .back {
	background-color:#555;
}
#card4 {
	height:250px;
	margin:2%;
}
#card4 .front {
	background-color:#555;
}
#card4 .back {
	background-color:#555;
}
}



/*------------------------------------------------
    2. Media screen up to 580 px
------------------------------------------------*/

@media screen and (max-width: 580px) {

	.wrap {width: 92%;}

	.content {width: 100%;}
	
	
	aside {width: 100%;}

	aside.left,
	aside.right {
	    float:none;
	    margin: 0px;
	    padding: 0px;
		
	
	}
	
	
	.article_thumb {display: block;}
	.article_data {margin-left: 50px;}

	.js #top_nav {display: none;}
	.js .selectnav {display: block;}

	#middle_header .wrap {padding-bottom: 30px;}

	#middle_header h1 {
		padding: 20px 20px 5px 20px;
	    line-height: 36px;
	    font-size: 28px;
	}
	
	#middle_header .highlight {
		padding: 3px 6px 4px;
	    line-height: 26px;
	    font-size: 14px;
	}

	.half, .third, .fifth, .sixth, 
	.two_third, .three_fourth {width: 100%; margin-bottom: 25px;}
	.half.fix_responsive {margin-bottom: 25px;}

	.fourth {width: 47%; margin-bottom:0px;}
	.fourth:nth-of-type(2n):not(.last):not(.fix_responsive) {margin: 0px 0px 0px 0px;}

	.full_responsive {width: 100%;}
	.last {margin: 0px;}
	
	#contact label {
    display: block;
    margin-bottom: 4px;
    color: #000;
		font-size:17px;
}

	#subscribe input[type="text"] {width: 130px;}

	#middle_footer .blogroll,
	#middle_footer .our_address {display: none;}
	#middle_footer .col {width: 100%;}
	#middle_footer .follow {margin-bottom: 25px;}

	#bottom_footer {
    padding: 0px 0px;
    background-color: #25292d;
    font-size: 11px;
    text-align: center;
    overflow: hidden;
	height:100%;
	border-top:9px solid #669933;
}

#bottom_footer img {
	width:80%;
	margin-left:10%;
	margin-right:10%;
	height:125px;
	postion:fixed top;
	
}
	#bottom_footer ul#social_networks {
		margin: 0px; 
		padding: 0px;
	}

	#to_top {margin-top: 0px;}
	#bottom_footer span {display: none;}

	.service {margin: 15px 0px 0px 0px;}

	.button_bar {margin-bottom: 30px; overflow: hidden;}

	.related_articles .third {
		width: 30%;
		margin: 0 5% 0 0;
	}

	.portfolio_content.col2,
	.portfolio_content.col3,
	.portfolio_content.col4 {background: none;}

	.portfolio_content li.item {
		width: 100%;
		height: auto;
		margin-bottom: 25px;
    	padding-bottom: 25px;
	}
	.portfolio_content li.item a img {width: 100%; height: auto;}

	#contact {margin-bottom: 30px;}
	#contact fieldset.third {margin: 0px 0px 5px;}
	#contact input[type=text],
	#contact textarea {width: 90%;}
	
	
	
	#top_header {
    padding:0px;
	margin:0px;
    background-color: #25292d;
	height:100%;
	width:100%;
	float:left;
   font-family: 'IBM Plex Sans', sans-serif;
}
	nav {
    
	width:100%;
	margin-top:15px;
	height:45px;
		text-align: center;

}
#logo {
	float:left;
	width:100%;
	height:240px;
	margin:0px;
	padding:0px;
	background-color:#333333;
	background-image: url("../images/weblogo-small-01-01.svg");
	background-repeat:no-repeat;
    background-position: fixed;
 }
#main {
  width: 100%;
  float: left;
  padding: 0px;
  margin:0px;
}
#main .flexslider img{
 object-fit:cover;
 height:240px;
 float: left;
	}
	
	#card {
	height:300px;margin:2%;
}
		#card2 {
	height:300px;margin:2%;
}
		#card3 {
	height:300px;margin:2%;
}
		#card4 {
	height:300px;margin:2%;
}
	
	#services-container h1 {
	font-weight:bold;
	font-size:22px;;
	color:#fff;
	padding-top:20px;
	

}
	#service-content h1 {
	font-size:28px;
		line-height: 30px;
		
	margin-top:30px;
	margin-bottom:10px;
	color:#fff;
	padding-left:3%;
	padding-bottom:3%;
	border-bottom: solid 1px white;
}
#services-container h2 {
	font-weight:normal;
	font-size:19px;
	color:#fff;
	padding:17px;
	line-height:22px;
	}
#services-container h3 {
	font-weight:normal;
	font-size:18px;
	color:#fff;
	padding:12px;
	}
#menu-content {
	height: auto;
	background-color:#ccc;
	color:#000;
}

#menu-content .container {
	width:100%;

}
#menu-content .third {
	text-align:center;
	font-weight:bold;
	margin:0px;
	padding:0px;
	height:auto;
	width:100%;
	}
#menu-content .two_third {
	width:100%;
	text-align:center;
}

.back ul {font-size:20px;line-height:30px;padding-top:20px;}
.back p {font-size:19px;line-height:30px;padding:15px;}
	.btn {font-size:20px;padding:15px;}
	
	#contact-cta-container h1 {
	width:90%;
		margin-left:5%;
		margin-right:5%;
	text-align:center;
	color:#000;
	font-size:1.5em;
	font-weight:bold;
	
	
}
#contact-cta-container h2 {
	width:80%;

	margin-top:3px;
	margin-bottom:3px;
	text-align:center;
	color:#000;
	font-size:16px;
	font-weight:normal;
	line-height:19px;
	}
	
	#service-content3-left {
		width:100%;
	}
	
	#service-content3-left h2 {
		font-size:24px;
		width:250px;
		line-height:30px;
		padding-bottom:3%;
	}
	
	.consulting-img {
	float:left;
	width:30%;
		height:20%;
	padding-top:5%;
	padding-bottom:5%;
	
}
.consulting-item {
	float:left;
	width:80%;
	font-size:20px;
	line-height:27px;
	padding-left:10%;
	padding-bottom:10%;
	
	
}
	
	
#service-content3-right {
		width:100%;
		padding-bottom:30px;
		line-height:25px;
	}
	
#service-content3-right p {
	text-align:center;
	font-style:italic;
	font-size:18px;
	line-height:20px;
	padding-bottom:3%;
	padding-top:3%;
	margin-bottom:5px;
	border-bottom: solid 1px #DCDCDC;

}
#service-content3-right p img {
	width:80%;
	margin-left:10%;
	margin-right:10%;
}
/*CSS For Menu*/

#menu-container {
	width: 100%;
	float:left;
	background-color:#cc3300;
	padding: 0%;
	margin: 0px;
	
}

.uberAccordion {
   padding: 0;
	}

.uberAccordion > li {
    list-style:none;
    margin: 0;
	}

.uberAccordion > li > h1 {
    background-color: #669933;
    margin: 0;
    font-size: 20px;
    padding:  15px;
    cursor: pointer;
	color:#fff;
	letter-spacing: 2px;
	text-align:center;
	}

.uberAccordion > li:nth-child(2) h1 {
	background-color: #6699cc;
    margin: 0;
    font-size: 20px;
    padding:  15px;
    cursor: pointer;
	color:#fff;
	letter-spacing: 2px;
}

.uberAccordion > li:nth-child(3) h1 {
	background-color: #550773;
    margin: 0;
    font-size: 20px;
    padding:  15px;
    cursor: pointer;
	color:#fff;
	letter-spacing: 2px;
}

.uberAccordion > li:nth-child(4) h1 {
	background-color: #6699cc;
    margin: 0;
    font-size: 20px;
    padding:  15px;
    cursor: pointer;
	color:#fff;
	letter-spacing: 2px;
}

.uberAccordion h2 {
	width: 100%;
    font-size: 18px;
	line-height: 27px;
	margin-bottom: 1%;
 
}

.uberAccordion a {
    font-size: 17px;
    color:#555;
	
	
 }
.uberAccordion a:hover {
    font-size: 17px;
   color:#cc3300;
	text-decoration: none;
 }

.uberAccordion > li > div {
    background-color: #fff;
    padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 3%;
	padding-right: 2%;
	width: 95%;

}
.uberAccordion > li > div ul {
	padding-top: 2%;
	
	}

.uberAccordion > li > div ul li {
	
	
	}


/* Default CSS for sub-accordion */

.uberAccordion .uberAccordion > li > h1 {
    font-size: 12px;
    padding: 5px;
}

.uberAccordion .uberAccordion > li > div {
   background-color: #666666;
   color: #FFF;
}


/* Default CSS for vertical orientation */

.uberAccordion.accordion-vertical {
    height: 450px;
}

.uberAccordion .uberAccordion.accordion-vertical {
    height: 260px;
}


	
}


/*------------------------------------------------
    3. Table Columns and Small Fixes
------------------------------------------------*/

@media screen and (max-width: 950px) {
	table th:nth-child(7),
	table td:nth-child(7) {display: none;}
}

@media screen and (max-width: 810px) {
	table th:nth-child(6),
	table td:nth-child(6) {display: none;}
}

@media screen and (max-width: 680px) {
	table th:nth-child(6),
	table td:nth-child(6),
	table th:nth-child(7),
	table td:nth-child(7) {display: table-cell;}
}

@media screen and (max-width: 600px) {
	table th:nth-child(7),
	table td:nth-child(7) {display: none;}
}

@media screen and (max-width: 510px) {
	table th:nth-child(6),
	table td:nth-child(6) {display: none;}
}

@media screen and (max-width: 420px) {
	table th:nth-child(5),
	table td:nth-child(5) {display: none;}
}

@media screen and (max-width: 340px) {
	table th:nth-child(4),
	table td:nth-child(4) {display: none;}

	#top_header {height: 50px;}

	#logo {
		float: none;
		margin: 0px auto 15px auto;
		background-position:fixed;
	}
	
	nav {
		float: none;
		width: 170px;
		margin: 0px auto;
	}
	
	.fourth {width: 100%; margin-bottom: 25px;}
}