/*-----------------------------------------------------------------------------------*/
/*	RESPONSIVE STYLES
/*-----------------------------------------------------------------------------------*/
@media only screen and (min-width: 1181px) {

	.wrapper { 
		width:						90%; 
		position:					relative;
	}
	
    .cols1 {
        position:                   relative;
        float:                      left;
        display:                    inline-block;
        width:                      23% !important;
        padding:                    6px;
    }
    
    .cols2 {
        position:                   relative;
        float:                      left;
        display:                    inline-block;
        width:                      76% !important;
        padding:                    6px;
    }

    .cols3 {
        position:                   relative;
        float:                      left;
        display:                    inline-block;
        width:                      55% !important;
        padding:                    6px;
    }

    .cols4 {
        position:                   relative;
        float:                      left;
        display:                    inline-block;
        width:                      45% !important;
        padding:                    6px;
    }
	
    .cols5l {
        position:                   relative;
        float:                      left;
        display:                    inline-block;
        width:                      49% !important;
        padding:                    6px;
    }
	
    .cols5r {
        position:                   relative;
        float:                      right;
        display:                    inline-block;
        width:                      49% !important;
        padding:                    6px;
    }
	
    .cols6 {
        position:                   relative;
        float:                      left;
        display:                    inline-block;
        width:                      100% !important;
        padding:                    6px;
    }
	
	.top-12 {
		top:                        -12px;
	}
	
	.fully {
		height: 					100%;
		width: 						100%;
	}
	

}

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

	.wrapper { 
		width:						1180px; 
		position:					relative;
	}
	

}

/* Standard 960 or larger (browsers) */
@media only screen and (min-width: 960px) {}

/* Standard 960 or Smaller (browsers) */
@media only screen and (max-width: 959px) {
	#container .item {
		width: 						33.1%;
	}
	.section-title {
		max-width: 					75%;
	}

}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {

	.wrapper { 
		/*width:						768px; */
		width:						90%;
		position:					relative;
	}

}

@media only screen and (min-width: 768px) {
	#main .three_fourths {
		display: 					block !important;
	}

}

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

	h1{
		font-size:					28px;
	}
	
	h3{
		font-size:					18px !important;
		padding-top:				10px !important;
	}
	
	.tbl1 {
		width:						88% !important;
	}

	.wrapper { 
		width:						479px; 
		margin: 					0 auto; 
		position:					relative; 
	}
	
	.one_half, .one_third, .two_thirds, .one_fourth, .one_fifth, .two_fifth, .three_fifth, .four_fifth, .one_sixth, .five_sixth, .three_fourths { 
		width: 						100%;
	}
	
	#container .item, #container.blog .item {
		width: 						50%;
	}
	
	#sub-header .social {
		display: 					none;
	}
	
	#sub-logo {
		display: 					block;
		text-align: 				center;
		float: 						none;
	}
	
	.section-title {
		max-width: 					80%;
	}
	
	#burger {
		display: 					inline-block;
		float: 						right;
		position: 					relative;
		/*top: 						-8px;*/
	}
	
	#logo {
		float: 						left !important;
		width: 						30% !important;
		height:						30% !important;
		padding:					0px !important;
		margin:						0px !important;
	}
	
	#main nav {
		float: 						none;
		margin-top: 				20px;
	}
	
	#main .three_fourths {
		display: 					none;
	}
	
	nav ul, nav li, nav ul li ul, nav li li, nav li:hover ul {
		float: 						none;
		display: 					block;
		position: 					static;
		padding: 					0;
		margin: 					0;
	}
	
	nav ul, nav ul ul, nav ul li, nav ul ul li:last-of-type, nav li:hover ul {
		border: 					none;
		background: 				none;
	}
	
	nav li a, nav li li a{
		border-bottom: 				1px solid #e5e5e5 !important;
		padding-bottom: 			10px;
		margin-bottom: 				10px;
		display: 					block;
	}
	
	.example > ul {
		display: 					block;
		width: 						94% !important;
		margin-bottom: 				10px;
	}

	.example2 > ul {
		display: 					block;
		width: 						94% !important;
		margin-bottom: 				10px;
	}

	p{
		text-align: 				justify !important;
	}

}
	
	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
		
	#intro {
			top: 						40%;
			margin-top: 				-20px;
		}
	
}


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	
	#container .item, #container.blog .item {
		width: 						100%;
	}
	
	.wrapper { 
		width:						300px; 
		margin: 					0 auto; 
		position:					relative;
	}
	
	.section-title {
		max-width: 					100%;
	}
	
	#intro {
		top: 						30%;
		margin-top: 				-20px;
	}
	
	.service .service-icon {
		float: 						none;
		margin: 					0 auto 30px;
		display: 					block;
	}
	
	.service {
		text-align: 				center;
	}
	
	#contactform {
		margin-bottom: 				30px;
	}

	.tbl1 {
		width:						88% !important;
	}

	h1 {
		font-size:					18px;
		padding:					0px !important;
		margin:						0px !important 
	}
	
	h3{
		font-size:					12px !important;
		padding-top:				20px !important
	}
	
	p{
		text-align: 				justify !important;
	}

	#logo {
		float: 						left !important;
		width: 						30% !important;
		height:						30% !important;
		padding:					0px !important;
		margin:						0px !important;
	}

	.example > ul {
		display: 					block;
		width: 						94% !important;
		margin-bottom: 				10px;
	}
	
	.-accordion__heading {
	  position: 					relative;
	  display: 						block;
	  padding: 						15px;
	  color: 						#9ea6aa;
	  font-size: 					10px;
	  cursor: 						pointer;
	  width: 						100% !important;
	  -webkit-box-sizing: 			border-box;
	  box-sizing: 					border-box;
	}

	.-accordion--horizontal .-accordion__expander {
		position: 					absolute;
		top: 						0;
		left: 						0;
		height: 					50px;
		width: 						205px !important;
		margin-left: 				10px;
		overflow-y: 				auto;
		-webkit-box-sizing: 		border-box;
		box-sizing: 				border-box;
	}

	.-accordion__heading2 {
	  position: 					relative;
	  display: 						block;
	  padding: 						15px;
	  color: 						#9ea6aa;
	  font-size: 					10px;
	  cursor: 						pointer;
	  width: 						100% !important;
	  -webkit-box-sizing: 			border-box;
	  box-sizing: 					border-box;
	}

	.-accordion--horizontal2 .-accordion__expander2 {
		position: 					absolute;
		top: 						0;
		left: 						0;
		height: 					50px;
		width: 						205px !important;
		margin-left: 				10px;
		overflow-y: 				auto;
		-webkit-box-sizing: 		border-box;
		box-sizing: 				border-box;
	}

}

/*-----------------------------------------------------------------------------------*/
/*	END RESPONSIVE STYLING
/*-----------------------------------------------------------------------------------*/
