/* ======================= Media Queries ==================== */

/* ====== Desktop ================================================================== */

@media only screen and (min-width: 979px) {
	/* ==================================================================
	ScrollBar
	================================================================== */

	::-webkit-scrollbar {
	    width: 12px;
	}
	 
	::-webkit-scrollbar-track {
	    -webkit-box-shadow: none; 
	    -webkit-border-radius: 0px;
	    border-radius: 0px;
	}
	 
	::-webkit-scrollbar-thumb {
	    -webkit-border-radius: 0px;
	    border-radius: 0px;
	    background: rgba(25,140,147,0.8); 
	    -webkit-box-shadow: none; 
	}

	::-webkit-scrollbar-thumb:window-inactive {
		background: rgba(25,140,147,0.4); 
	}


}
@media only screen and (min-width: 1200px)
{
	.span12 {
		width: 1024px;
	}
}


/*@media only screen and (min-width: 979px) and (max-width: 1200px) {

	.logo-text
	{
		display:none;
	}
}*/

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

	section .container {
	padding-top: 142px;
	}

	nav#main-nav {

		width: 100%;
		height: auto;
	}

	nav#main-nav ul li a {

		width: 90px;
		height:60px;
		padding-top: 15px;
		padding-bottom: 15px;
		padding-left: 5px;
		padding-right: 5px;
		font-size:14px;
	}

	a.logo
	{
		margin: 0;
		height: 20px;
	}
	.fa-2x
	{
		display:none;
	}
}

/* ========  Tablet Portrait size to Tablet Landscape (devices and browsers)=============================================================== */
@media only screen and (min-width: 768px) and (max-width: 979px) {
		

::-webkit-scrollbar {
	    width: 12px;
	}
	 
	::-webkit-scrollbar-track {
	    -webkit-box-shadow: none; 
	    -webkit-border-radius: 0px;
	    border-radius: 0px;
	}
	 
	::-webkit-scrollbar-thumb {
	    -webkit-border-radius: 0px;
	    border-radius: 0px;
	    background: rgba(25,140,147,0.8); 
	    -webkit-box-shadow: none; 
	}

	::-webkit-scrollbar-thumb:window-inactive {
		background: rgba(25,140,147,0.4); 
	}





section .container {
padding-top: 112px;
}

	.portfolio .portfolio-item {
		height: 149px;
	}

	/*nav#main-nav {

		width: 100%;
		height: auto;
	}

	nav#main-nav ul li a {

		width: 86px;
		height:48px;
		padding-top: 15px;
		padding-bottom: 15px;
		padding-left: 10px;
	}

	a.logo
	{
		margin: 0;
		width: 100px;
		height: auto;
	}
	nav#main-nav ul li a img
	{
		display:none;
	}*/
	
	
	/* =========================  Home Styles  =============================================== */
	
	nav#main-nav {   
        height: auto;
        width: 100%;

    }


	nav#main-nav > ul {
		display: none;
		background: #333333;
		width: 100%;
		height: auto;
		margin-right: 0px;
	}

    nav#main-nav > ul li {  
        width: 100%;  
        float: left;  
        position: relative;
        border-top: 1px solid #3d3d3d;
    }

    nav#main-nav > ul li a {  
  		color: #ffffff;
  		padding: 15px 20px;
  		width: 100%;
    }

    nav#main-nav ul li a.active {
		color: #ffffff;
	}

	a.logo {
		margin: 0;
	}
	/*.logo-text h3
	{
		font-size:14px;
		line-height:inherit;
	}*/
	
	/* ================================================= Responsive Navigation ================================================== */

	#main-nav #responsive-nav {
		display: block;
	}

	#home .container {
		padding-top: 50px;
	}

	#home {
		padding-top: 39px;
	}
	.tile .h5
	{
		font-size:16px;
	}

.srv-block {
width: 538px;
float: left;
margin-left: 20px;
}
.srv-block1, .srv-block2, .srv-block3, .srv-block4 {
margin-left: 0;
margin-right: 0;
padding-left: 0;
padding-right: 0;
width: auto;
border: none;
}

.quartercircletopleft, .quartercircletopright, .quartercirclebottomright, .quartercirclebottomleft {
display: none;
}


.porto {
width: 706px;
}

.og-fullimg {
width: 35%;
}
.og-details h3 {

font-size: 40px;
}


}

/* ========== All Mobile Sizes (devices and browsers)=========================== */
@media only screen and (max-width: 767px) {

	body {
		overflow: visible;
	}

	section {
		width: 100%;
		height: 100%;
		position: relative;
		z-index: 50;
		overflow: hidden;
		background: #f2f2f2;
		float: left;
	}

	section .container {
		padding-top: 70px;	
	}

	section > .container {
		padding-bottom: 40px;
	}

	#portfolio {
		overflow: hidden;
	}

	/* =========================  Home Styles  =============================================== */
	
	nav#main-nav {   
        height: auto;
        width: 100%;

    }


	nav#main-nav > ul {
		display: none;
		background: #333333;
		width: 100%;
		height: auto;
		margin-right: 0px;
	}

    nav#main-nav > ul li {  
        width: 100%;  
        float: left;  
        position: relative;
        border-top: 1px solid #3d3d3d;
    }

    nav#main-nav > ul li a {  
  		color: #ffffff;
  		padding: 15px 20px;
  		width: 100%;
    }

    nav#main-nav ul li a.active {
		color: #ffffff;
	}

	a.logo {
		margin: 0;
	}

	/*.logo-text h3
	{
		font-size:14px;
		line-height:inherit;
	}*/
	
	/* ================================================= Responsive Navigation ================================================== */

	#main-nav #responsive-nav {
		display: block;
	}

	/* =========================  Home Styles  =============================================== */

	#home .container {
		padding-top: 50px;
	}

	#home {
		padding-top: 39px;
	}

	.fa-4x {
		font-size: 2em;
	}

	.tile .h5 {
		font-size: 13px;
	}
	.tile img
	{
		width:60px;
	}
	.tile
	{
		height:130px;
	}


	/* =========================  About Styles  =============================================== */


	#about h1 span {
color: #F0F0F0;
padding-left: 38px;
font: 11px/18px "Century Gothic";
line-height: 1px!important;
margin-left: 5px;
}


/* =========================  Team Styles  =============================================== */


.card {
height: 637px;
width: 323px;

}


.card header {
width: 91%;
padding-top: 50px;
padding-bottom: 25px;
padding-left: 10px;
}

.team-social {
font-size: 13px;
width: 24px;
height: 24px;
}
.card article .area {
width: 284px;

}


/* =========================  Services Styles  =============================================== */
.srv-block {
width: 299px;
float: left;
margin-left: 20px;
}
.srv-block1, .srv-block2, .srv-block3, .srv-block4 {
margin-left: 0;
margin-right: 0;
padding-left: 0;
padding-right: 0;
width: auto;
border: none;
}

.quartercircletopleft, .quartercircletopright, .quartercirclebottomright, .quartercirclebottomleft {
display: none;
}

	/* =========== Portfolio===================================================== */
.porto {
width: 0;
}


	/* =========================== Contacts =============================================== */
	.contact-form, .contact-info {
		margin-bottom: 20px;
	}

	.metroblock {
		width: 20em;
	}
.metroblock h3, .metroblock .icon {

	font-size: 5em;
}
}

/* ==============================Mobile Landscape Size to Tablet Portrait (devices and browsers) ================================================ */
@media only screen and (min-width: 480px) and (max-width: 767px) {
		
	.container {
		width: 460px;
	}
	
	/* =========  Portfolio ========================================== */
	.portfolio .portfolio-item {
		height: 300px;
	}

}

/* ==================== Mobile Portrait Size to Mobile Landscape Size (devices and browsers)================================================ */
@media only screen and (max-width: 479px) {

	.container {
		width: 300px;
	}

	/* ==========Portfolio===================================================== */
	
	.portfolio .portfolio-item {
		height: 196px;
	}
	.tile
	{
		height:145px;
	}


}

@media only screen and (max-width:1135px) 
{
	nav#main-nav ul li a {
		width: 78px;
		height:60px;
		padding-top: 15px;
		padding-bottom: 15px;
		padding-left: 5px;
		padding-right: 5px;
		font-size:12px;
	}
}