/*
	Mosaic - Sliding Boxes and Captions jQuery Plugin
	Version 1.0.1
	www.buildinternet.com/project/mosaic
	
	By Sam Dunn / One Mighty Roar (www.onemightyroar.com)
	Released under MIT License / GPL License
*/


/*General Mosaic Styles*/
.mosaic-block {
	float:left;
	position:relative;
	overflow:hidden;
	width:100%;
	height:250px;
	background:url(../images/progress.gif) no-repeat center center transparent;
}
.mosaicBlockFourT {
	float:left;
	position:relative;
	overflow:hidden;
	width:100%;
	height:130px;
	background:url(../images/progress.gif) no-repeat center center transparent;
}
.mosaicBlockFourC {
	float:left;
	position:relative;
	height:150px;
	overflow:hidden;
	width:100%;
	
	background:url(../images/progress.gif) no-repeat center center transparent;
	  border-radius: 50%;
}
.mosaicBlockOneThirdC {
	float:left;
	position:relative;
	overflow:hidden;
	width:100%;
	height:280px;
	background:url(../images/progress.gif) no-repeat center center transparent;
}
.mosaicBlockOneThirdT {
	float:left;
	position:relative;
	overflow:hidden;
	width:100%;
	height:187px;
	background:url(../images/progress.gif) no-repeat center center transparent;
}

	.mosaic-backdrop {
		display:none;
		position:absolute;
		top:0;
		height:100%;
		width:100%;
	}
	
	.mosaic-overlay {
		display:none;
		z-index:5;
		position:absolute;
		width:100%;
		height:100%;
		background:#111;
	}
	
		/*** Custom Animation Styles (You can remove/add any styles below) ***/
		.circle .mosaic-overlay:hover {
		display:flex !important;
		
		}
		.hover:hover {
		background:url(../images/hover-magnify.png) no-repeat center;
		display:block;
		
		}
		.hover {
		background:url(../images/hover-magnify.png) no-repeat center;
		display:none;
		
		
		}
		.circle .mosaic-overlay:hover {
		display:block !important; 
		
		
		
		}
		.circle .mosaic-overlay {
			
			opacity:0;
			-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
			filter:alpha(opacity=00);
			display:none;
		}
		/*** End Animation Styles ***/
/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		.mosaicBlockFourT {height:100px;}
		.mosaicBlockFourC {height:152px;}
		.mosaicBlockOneThirdC {height:216px;}
		.mosaicBlockOneThirdT {height:144px;}
}

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

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		.mosaicBlockFourT {height:250px;}
		.mosaicBlockFourC {height:340px;}
		.mosaicBlockOneThirdC {height:340px;}
		.mosaicBlockOneThirdT {height:253px;}
}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		.mosaicBlockFourT {height:170px;}
		.mosaicBlockFourC {height:240px;}
		.mosaicBlockOneThirdC {height:240px;}
		.mosaicBlockOneThirdT {height:174px;}
}




@media only screen and (min-width: 800px) and (max-width: 959px) {
.con{
color:rgb(255, 255, 255);
padding-left: 2px;
}

#nav {
    margin-left: 12px;
}

.navigationBar nav ul li a {
    color: #ffffff;
    display: block;
    font-weight: bold;
    padding: 0 34px;
    text-decoration: none;
    text-transform: uppercase;
}


.mosaicBlockFourC {
    height: 110px;
}

.container .three.columns {
    width: 122px;
}

h2 {
    font-size: 37px;
    line-height: 20px;
    margin-bottom: 10px;
}



.img2 {
    border: 5px solid #e8e8e8;
    height: 180px;
    width: 210px;
	margin-left: 20px;
	}
	
.mosaicBlockFourC circle cheght
{
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height: 65px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.pro{
height:75px;}




.mosaicBlockFourC {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height: 110px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.mosaicBlockFourC1 {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height:60px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.mleft {
    margin-bottom: 20px;
    margin-left: 20px !important;
}

}

@media only screen and (min-width: 768px) and (max-width: 790px) {
.con{
color:rgb(255, 255, 255);
padding-left: 2px;
}

#nav {
    margin-left: 12px;
}

.navigationBar nav ul li a {
    color: #ffffff;
    display: block;
    font-weight: bold;
    padding: 0 34px;
    text-decoration: none;
    text-transform: uppercase;
}


.mosaicBlockFourC {
    height: 110px;
}



.container .three.columns {
    width: 120px;
}

h2 {
    font-size: 37px;
    line-height: 20px;
    margin-bottom: 10px;
}

.img2 {
    border: 5px solid #e8e8e8;
    height: 180px;
    width: 210px;
	margin-left: 20px;
}


	


.pro{
height:75px;}




.mosaicBlockFourC {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height: 110px;
    overflow: hidden;
    position: relative;
    width: 100%;
}


.mosaicBlockFourC1 {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height:60px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.mleft {
    margin-bottom: 30px;
    margin-left: 20px !important;
}


}



@media only screen and (min-width: 640px) and (max-width: 760px) {
.con{
color:rgb(255, 255, 255);
padding-left: 2px;
}

#nav {
    margin-left: 12px;
}

.navigationBar nav ul li a {
    color: #ffffff;
    display: block;
    font-weight: bold;
    padding: 0 34px;
    text-decoration: none;
    text-transform: uppercase;
}


.mosaicBlockFourC {
    height: 110px;
}



.imgCircle {
    margin: 30px 51px 8px 10px;
}


.container .three.columns {
    width: 190px;
}


h2 {
    font-size: 37px;
    line-height: 20px;
    margin-bottom: 10px;
}


#footerlogo {
    padding-top: 3px;
    text-align: center;
}

.last-pro{
margin-left:110px !important; }


.mgp{
display:none !important;}



.img1 {
    height: 160px;
    margin-left: 98px;
    text-align: center;
    width: 222px;
}

.img2 {
    height: 180px;
    width: 212px;
	border:5px solid #e8e8e8;
	
}
.imgs{
text-align:center;
}


p.right {
    float: right;
    margin-right: 64px;
}



.pro{
height:75px;}


.mosaicBlockFourC1 {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height:320px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.mleft {
    margin-bottom: 30px;
    margin-left: 20px !important;
}



.mosaicBlockFourC {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height: 110px;
    overflow: hidden;
    position: relative;
    width: 100%;
}


.remove-bottom {
    margin-bottom: 20px !important;
    margin-left: 10px;
}
.tab-pro{
margin-left:10px;
padding-left:10px;
padding-right:10px;
}
table {
	width:95%;
	border: 1px solid #D1D1D1;
	border-top: 2px solid #3DA0BF;
	-webkit-box-shadow:0 2px 1px rgba(0, 0, 0, .08);
	box-shadow:0 1px 1px rgba(0, 0, 0, .08);
}

#logo {
    padding-top: 18px;
    text-align: center;
}


}



@media only screen and (min-width: 480px) and (max-width: 630px) {


.mleft {
    margin-left: -3px !important;
}

.mgp{
display:none !important;}

#footerlogo {
    padding-top: 5px;
    text-align: center;
}
.img1 {
    height: 160px;
    margin-left: 98px;
    text-align: center;
    width: 222px;
}

.img2 {
    height: 180px;
    width: 212px;
	border:5px solid #e8e8e8;
	
}
.imgs{
text-align:center;
}


p.right {
    float: right;
    margin-right: 64px;
}


.pro{
height:75px;}





.mosaicBlockFourC {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height: 336px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.add-top {
    margin-top: 20px;
    margin-left: -40px;
}

#logo {
    padding-top: 18px;
    text-align: center;
}

.remove-bottom {
    margin-bottom: 20px !important;
    margin-left: 10px;
}
.tab-pro{
margin-left:10px;
padding-left:10px;
padding-right:10px;
}
table {
	width:95%;
	border: 1px solid #D1D1D1;
	border-top: 2px solid #3DA0BF;
	-webkit-box-shadow:0 2px 1px rgba(0, 0, 0, .08);
	box-shadow:0 1px 1px rgba(0, 0, 0, .08);
}


.mosaicBlockFourC1 {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height:320px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.mleft {
    margin-bottom: 30px;
    margin-left: 20px !important;
}

.imgCircle {
    margin: 30px 50px 0 14px;
}

}


@media only screen and (min-width: 360px) and (max-width: 460px) {


.mleft {
    margin-left: -3px !important;
}

.mgp{
display:none !important;}

#footerlogo {
    padding-top: 5px;
    text-align: center;
}
.img1 {
    height: 160px;
    margin-left: 39px;
    text-align: center;
    width: 222px;
}

p.right {
    float: left;
    margin-left: 1px;
}

.img2 {
    height: 180px;
    width: 212px;
	border:5px solid #e8e8e8;
	
}
.imgs{
text-align:center;
}


.pro{
height:75px;}

.add-top {
    margin-top: 20px;
    margin-left: -40px;
}

#logo {
    padding-top: 18px;
    text-align: center;
}




.mosaicBlockFourC {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height: 220px;
    overflow: hidden;
    position: relative;
    width: 100%;
}


.remove-bottom {
    margin-bottom: 20px !important;
    margin-left: 10px;
}
.tab-pro{
margin-left:10px;
padding-left:7px;
padding-right:10px;
}
table {
	width:95%;
	border: 1px solid #D1D1D1;
	border-top: 2px solid #3DA0BF;
	-webkit-box-shadow:0 2px 1px rgba(0, 0, 0, .08);
	box-shadow:0 1px 1px rgba(0, 0, 0, .08);
}

.mosaicBlockFourC1 {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height:220px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.mleft {
    margin-bottom: 30px;
    margin-left: 20px !important;
}

.imgCircle {
    margin: 30px 50px 0 14px;
}

}

@media only screen and (min-width: 320px) and (max-width: 355px) {


.mleft {
    margin-left: -3px !important;
}

.mgp{
display:none !important;}

#footerlogo {
    padding-top: 5px;
    text-align: center;
}
.img1 {
    height: 160px;
    margin-left: 39px;
    text-align: center;
    width: 222px;
}

.img2 {
    height: 180px;
    width: 212px;
	border:5px solid #e8e8e8;
	
}
.imgs{
text-align:center;
}


p.right {
    float: left;
    margin-left: 1px;
}

.pro{
height:75px;}


.remove-bottom {
    margin-bottom: 20px !important;
    margin-left: 10px;
}


.mosaicBlockFourC {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height: 220px;
    overflow: hidden;
    position: relative;
    width: 100%;
}


.add-top {
    margin-top: 20px;
    margin-left: -40px;
}

#logo {
    padding-top: 18px;
    text-align: center;
}

table {
	width:95%;
	border: 1px solid #D1D1D1;
	border-top: 2px solid #3DA0BF;
	-webkit-box-shadow:0 2px 1px rgba(0, 0, 0, .08);
	box-shadow:0 1px 1px rgba(0, 0, 0, .08);
}
.tab-pro{
margin-left:10px;
padding-left:7px;
padding-right:10px;
}


.mosaicBlockFourC1 {
    background: url("../images/progress.gif") no-repeat scroll center center transparent;
    border-radius: 50%;
    float: left;
    height:220px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.mleft {
    margin-bottom: 30px;
    margin-left: 20px !important;
}

.imgCircle {
    margin: 30px 50px 0 14px;
}

}