body{
    
}

@media (max-width: 575px){
    p, li {
        font-size: 16px;
    }
}

/* Section 5 - Advatange 2 */


.st-advantage-2 {
	background: #F5F7FB;
	position: relative;
	overflow: hidden;
	margin-top: 100px;
}


.st-advantage-2 .mockups {
	position: absolute;
	transform: rotate(30deg);	
}








.section-05 .decors .decor-wrapper {
	position: absolute;		
	transition: all ease-in-out 1.5s;
	transition-timing-function: cubic-bezier(.07,.7,.14,.89);
}


.section-05 .decors .decor-wrapper img {
	transition: all ease-in-out 2s;
	transition-timing-function: cubic-bezier(.07,.7,.14,.89);
}


.section-05 .decors .decor_1 {
	width: 10px; height: auto;
	top: 10%; left: 55%;	
}

.section-05 .decors .decor_2 {
	width: calc(1% + 10px); height: auto;
	max-width: 20px;
	top: 20%; right: 10%;		
}

.section-05 .decors .decor_3 {
	width: calc(1% + 10px); height: auto;
	min-width: 20px;
	max-width: 30px;		
	bottom: 20%; left: 40%;
}


















@media (max-width: 575px) {	
    .default-container{
        /*padding: 20px 0;*/
    }
    
    .st-advantage-2 {
        margin-top: 80px;
    }
	.st-advantage-2 .intro-content .wrapper {
		padding-top: 5%;
	}
	.st-advantage-2 .mockups {
		width: 100%;
		left: 5%;
		top: -10%;
		display: none;
	}
}




@media (min-width: 576px) and (max-width: 767px) {	
	.st-advantage-2 .intro-content .wrapper {
		padding-top: 45%;
	}
	.st-advantage-2 .mockups {
		width: 90%;
		right: 0;
		top: -10%;
	}
}

@media (min-width: 768px) and (max-width: 991px) {	
	.st-advantage-2 .intro-content .wrapper {
		padding-top: 40%;
	}
	.st-advantage-2 .mockups {
		width: 80%;
		right: 0;
		top: -10%;
	}
}









@media (max-width: 991px) {
	.st-advantage-2 .mockups .image-2, 
	.st-advantage-2 .mockups .image-5 {
		display: none;
	}	
}





@media (min-width: 992px) {
	.st-advantage-2 .mockups .image-6 {
		margin-top: 90%;
	}
	.st-advantage-2 .mockups {
		width: 60%;
		left: 47%;
		top: 10%;
		transform: scaleX(-1);
	}
	.st-advantage-2 .intro-content .wrapper {
		padding-right: 54%;
	}
}



@media (min-width: 1400px){
    .st-advantage-2 .mockups .image-6 {
		margin-top: 90%;
	}
	.st-advantage-2 .mockups {
		width: 50%;
		left: 55%;
		top: 10%;
		transform: scaleX(-1);
	}
	.st-advantage-2 .intro-content .wrapper {
		padding-right: 50%;
	}
}












.st-advantage-2 .st-heading .title {
	color: #403C56;
}



@media (max-width: 575px) {
	.st-advantage-2 .st-heading  {
		margin-bottom: 20px;
	}
}


@media (min-width: 576px) and (max-width: 767px) {
	.st-advantage-2 .st-heading  {
		margin-bottom: 30px;
	}
}


@media (min-width: 768px) {
	.st-advantage-2 .st-heading  {
		margin-bottom: 40px;
	}
}










@media (max-width: 575px) {
	.st-advantage-2 .image-wrapper img {
		border-radius: 4px;
		box-shadow: 2px 7px 22px rgba(0,0,0,.1);
	}
}

@media (min-width: 576px) and (max-width: 767px) {
	.st-advantage-2 .image-wrapper img {
		border-radius: 6px;
		box-shadow: 3px 8px 23px rgba(0,0,0,.1);
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.st-advantage-2 .image-wrapper img {
		border-radius: 8px;
		box-shadow: 4px 9px 24px rgba(0,0,0,.1);
	}
}

@media (min-width: 992px) {
	.st-advantage-2 .image-wrapper img {
		border-radius: 10px;
		box-shadow: 5px 10px 25px rgba(0,0,0,.1);
	}
}






@media (max-width: 575px) {
	.st-advantage-2 .image-wrapper {
		padding-right: 17.5px;
		padding-bottom: 17.5px;
	}
}


@media (min-width: 576px) and (max-width: 767px) {
	.st-advantage-2 .image-wrapper {
		padding-right: 20px;
		padding-bottom: 20px;
	}
}


@media (min-width: 768px) and (max-width: 991px) {
	.st-advantage-2 .image-wrapper {
		padding-right: 22.5px;
		padding-bottom: 22.5px;
	}
}

@media (min-width: 992px) {	
	.st-advantage-2 .image-wrapper {
		padding-right: 15px;
		padding-bottom: 15px;
	}
}





/*-----1234567890--*/


.page-template-page-about-us h2 {
	color: #312D51;
}


.page-template-page-about-us .main-header {
	position: relative;
}



/* Section - Intro */

#st-intro h2 {
	max-width: 550px;
}

#st-intro .img-intro {
	display: flex;
}

#st-intro .img-intro img {
	margin: auto;
}


#st-intro .col_1 p {
	margin-bottom: 2.35em;
}


@media (max-width: 767px) {
	#st-intro .col_1 {
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
		padding: 80px 5%;
	}	
	#st-intro .col_2 {
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;		
	}
}


@media (min-width: 768px) {
	#st-intro .col_1 {
		padding-right: 5%;
	}	
	#st-intro .col_2 {
		padding-left: 5%;
	}
	#st-intro .img-intro img {
		max-width: 600px;
		border-radius: 5px;
	}	
	#st-intro .row {
		align-items: center;
	}
}




/* Section - Intro 1 */

#st-intro-1 h2 {
	max-width: 480px;
}

#st-intro-1 .img-intro {
	display: flex;
}

#st-intro-1 .img-intro img {
	margin: auto;
}


#st-intro-1 .col_1 p {
	margin-bottom: 2.35em;
}


@media (max-width: 767px) {
	#st-intro-1 .col_1 {
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
		padding: 20px 0;
		display: contents;
	}	
	#st-intro-1 .col_2 {
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;		
	}
}


@media (min-width: 768px) {
	#st-intro-1 .col_1 {
		padding-right: 5%;
	}	
	#st-intro-1 .col_2 {
		/*padding-left: 5%;*/
	}
	#st-intro-1 .img-intro img {
		max-width: 550px;
		border-radius: 5px;
	}
	#st-intro-1 .img-intro2 img{
	    max-width: 650px;
		border-radius: 5px;
		margin-left: 1%;
	}
	#st-intro-1 .row {
		align-items: center;
	}
}








/* Container */
#st-intro{
    margin-top: 100px;
    background-color: #312D51;
}

@media (max-width: 767px) {
	#st-intro .default-container {
		padding: 0;
		width: 100%;
		max-width: none;
	} 
}

@media (min-width: 768px) {
	#st-intro .default-container {
	    margin-top: 100px;
		padding: 100px 0;
	}
}






/* Section - Features */



#st-features .info {
	text-align: center;
	border-radius: 2.5px;
	transition: all ease-in-out .3s;
}

/* Hover */

@media (max-width: 991px) {
	#st-features .info:nth-child(1) {
		border-right: 1px solid rgba(0,0,0,.1);
		border-bottom: 1px solid rgba(0,0,0,.1);
	}
	#st-features .info:nth-child(2) {
		border-bottom: 1px solid rgba(0,0,0,.1);
	}
	#st-features .info:nth-child(3) {
		border-right: 1px solid rgba(0,0,0,.1);
	}
	#st-features .info:nth-child(4) {
	
	}
}


@media (min-width: 992px) {
	#st-features .info:hover {
		background: #fff;
		border-radius: 20px;
		box-shadow: 0px 20px 40px rgba(0,0,0,.1);
	}
}















/** Info Spacing **/

@media (max-width: 767px) {
	#st-features .info .icon {
		margin-bottom: 30px;
	}
	#st-features .info h2 {
		margin-bottom: 15px;
	}
}


@media (min-width: 768px) and (max-width: 991px) {
	#st-features .info .icon {
		margin-bottom: 35px;
	}
	#st-features .info h2 {
		margin-bottom: 20px;
	}
}


@media (min-width: 992px) {
	#st-features .info .icon {
		margin-bottom: 40px;
	}
	#st-features .info h2 {
		margin-bottom: 25px;
	}
}



/* Container */

#st-features .default-container {
	padding-top: 20px;
}



@media (max-width: 576px) {
	#st-features .default-container {
		width: 100%;
		max-width: none;
	}
}











/* Section - Team */

.row.members-row {
    display: none;
}

#st-team {
	background: #FFF;
}


#st-team .heading h2 {
	color: #fff;
}

#st-team .heading p {
    text-align: left;
	color: #000;
	font-size: 20px;
	font-weight: 600;
	line-height: 40px;
}

#st-team .dscr-m p{
    color: #707097;
    font-size: 20px;
    font-weight:600;
    line-height:40px;
    text-align: left;
}

#st-team .member {
	transition: all ease-in-out .3s;
	border-radius: 20px;
	margin-bottom: 30px;
}


@media (max-width: 576px) {
    #st-team .dscr-m p{
    color: #707097;
    font-size: 16px;
    font-weight:400;
    line-height:30px;
    text-align: left;
    }
    
	#st-team .member .dscr {
		width: 80%;
		margin: auto;
	}
}


@media (max-width: 991px) {
	#st-team .member {
		background: rgba(0,0,0,.1);	
	}
}


@media (min-width: 992px) {
	#st-team .member:hover {
		background: rgba(0,0,0,.1);		
	}
	#st-team .member:hover .name {
		color: #34C4F3;
	}
}

#st-team h2 {
	max-width: 600px;
}

#st-team .img-intro {
	display: flex;
}

#st-team .img-intro img {
	margin: auto;
}


#st-team .col_1 p {
	margin-bottom: 2.35em;
}


@media (max-width: 767px) {
	#st-team .col_1 {
		-ms-flex-order: 2;
		-webkit-order: 2;
		order: 2;
		padding: 20px 5%;
	}	
	#st-team .col_2 {
		-ms-flex-order: 1;
		-webkit-order: 1;
		order: 1;		
	}
}


@media (min-width: 768px) {
	#st-team .col_1 {
		float:left;
	}	
	#st-team .col_2 {
		padding-left: 5%;
	}
	#st-team .img-intro img {
		max-width: 700px;
		border-radius: 30px;
	}	
	#st-team .row {
		align-items: center;
	}
}






/* Bootstrap Row with 3 Columns */


@media (max-width: 575px) {
	#st-team .members-row .member:last-child {
		margin-bottom: 0;
	}	
}


@media (min-width: 576px) and (max-width: 991px) {
	#st-team .members-row .member {
		width: 47.5%;
		margin-right: 5%;
	}
	#st-team .members-row .member:nth-child(2n) {
		margin-right: 0;
	}	
}




@media (min-width: 992px) {
	#st-team .members-row .member {
		width: 32%;
		margin-right: 2%;
	}
	#st-team .members-row .member:nth-child(3n) {
		margin-right: 0;
	}	
}








#st-team .member .photo {
	display: flex;
}

#st-team .member .photo img {
	margin: auto;
	border-radius: 320px;
}

#st-team .member .name {
	font-weight: 600;
	color: #fff;
	text-align: center;
	transition: all ease-in-out .3s;
}

#st-team .member .job-title {
	color: #707097;
	text-align: center;
	display: block;
	font-family: SVN-Gilroy;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 3px;
	text-transform: uppercase;
}

#st-team .member .dscr {
	text-align: center;
}



@media (max-width: 575px) {
	#st-team  .member {
		padding: 40px 5%;
	}
	#st-team .member .photo{
		margin-bottom: 15px;
	}
	#st-team .member .photo img {
		max-width: 100px;
	}
	#st-team .member .job-title {
		margin-bottom: 10px;
	}
}


@media (min-width: 576px) and (max-width: 767px) {
	#st-team  .member {
		padding: 40px 5%;
	}
	#st-team .member .photo {
		margin-bottom: 20px;
	}
	#st-team .member .photo img {
		max-width: 120px;
	}
	#st-team .member .job-title {
		margin-bottom: 15px;
	}
}


@media (min-width: 768px) and (max-width: 991px) {
	#st-team  .member {
		padding: 50px 5%;
	}
	#st-team .member .photo {
		margin-bottom: 25px;
	}
	#st-team .member .photo img {
		max-width: 140px;
	}
	#st-team .member .job-title {
		margin-bottom: 20px;
	}
}


@media (min-width: 992px) {
	#st-team  .member {
		padding: 60px 5%;
	}
	#st-team .member .photo{
		margin-bottom: 30px;
	}
	#st-team .member .photo img {
		max-width: 160px;
	}
	#st-team .member .job-title {
		margin-bottom: 25px;
	}
}






@media (max-width: 575px) {
	#st-team .default-container {
		padding: 50px 0;
	} 
}


@media (min-width: 576px) and (max-width: 767px) {
	#st-team .default-container {
		padding: 70px 0;
	}
}


@media (min-width: 768px) and (max-width: 991px) {
	#st-team .default-container {
		padding: 90px 0;
	} 
}


@media (min-width: 992px) and (max-width: 1199px) {
	#st-team .default-container {
		padding-bottom: 110px;
	}
}


@media (min-width: 1200px) and (max-width: 1399px) {
	#st-team .default-container {
		padding-bottom: 80px;
	}
}


@media (min-width: 1400px) {
	#st-team .default-container {
		padding-bottom: 80px;
	}
}












/* Section Exp */
#st-exp{
    display:none;
}


#st-exp .heading h2 {
	font-weight: 700;
	color: #312D51;
}


#st-exp .exp {
	transition: all ease-in-out .3s;
}


@media (max-width: 991px) {
	#st-exp .exp {
		padding: 50px 5%;
	}
}


@media (min-width: 992px) {
	#st-exp .exp:hover {
		background: #fff;
		box-shadow: 0px 20px 40px rgba(0,0,0,.1);
	}

}












#st-exp .exp h4 {
	font-weight: 700;
	color: #312D51;
	text-align: center;
}

#st-exp .exp .feature-img {
	max-width: 200px;
	margin: auto;
	margin-bottom: 40px;
}






@media (max-width: 575px) {
	#st-exp .exp {
		padding: 40px 5%;
	}
}


@media (min-width: 576px) and (max-width: 767px) {
	#st-exp .exp {
		padding: 40px 5%;
	}
}


@media (min-width: 768px) and (max-width: 991px) {
	#st-exp .exp {
		padding: 50px 5%;
	}
}


@media (min-width: 992px) {
	#st-exp .exp {
		padding: 60px 2.5%;
	}

}


















#st-cnp {
    display:none;
	background: #F5F4FF;
}

#st-cnp .heading h2 {
	font-weight: 700;
	margin-bottom: 0;
}


#st-cnp .logo-item img {
	border-radius: 10px;
	transition: all ease-in-out .3s;
	mix-blend-mode: multiply;
}

#st-cnp .logo-item:hover img {
	box-shadow: 0px 10px 20px rgba(0,0,0,.1);
}








/*hình ảnh*/
 
/* Section 3 - Portfolio */


.st-portfolio {
	background: #F5F7FB;
	overflow: hidden;
}

.st-portfolio .st-heading .title h2 {
	color: #2C234D;
	display: block;
	text-align: center;
	font-weight: bold;
}

.st-portfolio .st-heading .dscr p {
	text-align: center;
}


@media (min-width: 992px) {
	.st-portfolio .st-heading .dscr p {
		width: 80%;
		max-width: 720px;	
		margin-left: auto;
		margin-right: auto;
	}	
}


.st-portfolio .project-cat {
	display: block;
	float: left;
	transition: all ease-in-out .5s;
}




@media (min-width: 992px) {
	.st-portfolio .project-cat:hover {
		transform: translateY(-10px);
	}

	.st-portfolio .project-cat:hover .featured-image {
		box-shadow: 5px 10px 30px rgba(0,0,0,.2);
	}
	
}








.st-portfolio .featured-image {
    position: relative;
    background: #000;
    overflow: hidden;	
	display: block;
	box-shadow: 5px 10px 25px rgba(0,0,0,.1);
}





@media (max-width: 575px) {
	.st-portfolio .featured-image {
		margin-bottom: 20px;
	}
}

@media (min-width: 576px) and (max-width: 767px) {
	.st-portfolio .featured-image {
		margin-bottom: 20px;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.st-portfolio .featured-image {
		margin-bottom: 25px;
	}	
}

@media (min-width: 992px) {	
	.st-portfolio .featured-image {
		margin-bottom: 30px;
	}	
}









.st-portfolio .featured-image:after {
    content: "";
    display: block;
	padding-top: 125%;
}

.st-portfolio .featured-image img {
	border-radius: 2.5px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: all ease-in-out .5s;
}












.st-portfolio .project-cat .title {
	display: block;
	color: #403C56;
	text-align: center;
	
}


.st-portfolio .featured-image {
	border-radius: 10px;
	border-top: 10px solid #fff;
	border-bottom: 10px solid #fff;
	border-left: 5px solid #fff;
	border-right: 5px solid #fff;
}




@media (max-width: 575px) {
	
	.st-portfolio .project-cat {
		margin-bottom: 40px;
		width: 100%;
	}
	
	.st-portfolio .project-cat:last-child {
		margin-bottom: 0;
	}
	
	.st-portfolio .st-body {
	/*	padding-left: 15px;
		padding-right: 15px;
	*/	
	}
}

@media (min-width: 576px) and (max-width: 767px) {
		
	.st-portfolio .project-cat {
		width: 47.25%;
		margin-right: 5.5%;
		margin-bottom: 50px;
	}
	
	.st-portfolio .project-cat:nth-child(2n) {
		margin-right: 0;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.st-portfolio .project-cat {
		width: 47.25%;
		margin-right: 5.5%;
		margin-bottom: 60px;
	}
	
	.st-portfolio .project-cat:nth-child(2n) {
		margin-right: 0;
	}
}

@media (min-width: 992px) {	
	.st-portfolio .project-cat {
		width: 31%;
		margin-right: 3.5%;
		margin-bottom: 40px;
	}
	
	.st-portfolio .project-cat:nth-child(3n) {
		margin-right: 0;
	}	
}







/* Section 3 - Portfolio Decors */



.st-portfolio .decors .decor-wrapper {
	position: absolute;		
	transition: all 1s;	
}


.st-portfolio .decors .decor-wrapper img {
	transform-style: preserve-3d;
	transition-timing-function: cubic-bezier(.07,.7,.14,.89);
}

.st-portfolio .decors .decor_1 img {
	transition: all ease-in-out 2s;
}

.st-portfolio .decors .decor_2 img {
	transition: all ease-in-out 2.5s;
}

.st-portfolio .decors .decor_3 img {
	transition: all ease-in-out 2.5s;
}

.st-portfolio .decors .decor_4 img {
	transition: all ease-in-out 1.5s;
}












.st-portfolio .decors .decor_1 {
	width: calc(1.5% + 10px); height: auto;
	top: 3%; left: 4%;	
}

.st-portfolio .decors .decor_2 {
	width: calc(0.5% + 5px); height: auto;
	top: 8%; right: 12%;
}


.st-portfolio .decor_3 {
	width: calc(0.5% + 5px); height: auto;
	top: 20%; left: 10%;	
}

.st-portfolio .decor_4 {
	width: calc(1.5% + 5px); height: auto;
	top: 25%; right: 10%;	
}