/* general styles */

p {
	font-size: 16px;	
}

h1 {
	font-size: 34px;
	line-height: 54px;
}

h2 {
	font-size: 30px;
}

h3 {
	font-size: 26px;
}

h4 {
	font-size: 22px;
}

h5 {
	font-size: 18px;
}

.light {
	font-weight: 400;
}

form .row {
	margin-bottom: 20px;
}

#page {
	
}

.item {
	
}

.item.header {
	padding-bottom: 50px;
}

.item.content, .item.portfolio, .item.team, .item.pricing, .item.contact {
	padding-top: 60px;
	padding-bottom: 60px;
}

.item.footer {
}

.margin-top-100 {
	margin-top: 100px !important;
}

.margin-top-60 {
	margin-top: 60px !important;
}

.margin-top-80 {
	margin-top: 80px !important;
}

.margin-top-20 {
	margin-top: 20px !important;
}

.margin-bottom-0 {
	margin-bottom: 0px !important;
}

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

.margin-bottom-40 {
	margin-bottom: 40px !important;
}

.margin-bottom-60 {
	margin-bottom: 60px !important;
}

.margin-bottom-80 {
	margin-bottom: 80px !important;
}

.padding-top-0 {
	padding-top: 0px !important;
}

.padding-top-20 {
	padding-top: 20px !important;
}

.padding-top-100 {
	padding-top: 180px !important;
}

.padding-bottom-60 {
	padding-bottom: 60px !important;
}

.padding-bottom-0 {
	padding-bottom: 0px !important;
}

.margin-top-0 {
	margin-top: 0px !important;
}

.width-100 {
	width: 100%;
}

header .navbar.plain li.active a {
	color: #1ABC9C;
}

header .navbar-white {
	background: #fff;
}

header .navbar-white a {
	color: #3D566E;
}


/* videos */

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}

.videoWrapper > iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.videoWrapper > .frameCover {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background: none;
}

.service-item {
    width: 100%;
    height: 320px;
    margin: 10px 0;
    text-align: center;
    border: 1px solid #f2f2f2;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.service-item .service-icon {
    position: relative;
    color: black;
    top: 100px;
    display: inline-block;
    margin-bottom: 40px;
    background: white;
    padding: 10px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
    font-size: 60px;
}
.service-item h3 {
    color: black;
    position: relative;
    top: 80px;
    margin: 0px;
    -webkit-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -moz-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -o-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -ms-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.service-item .service-desc {
    width: 80%;
    margin: 0 auto;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -webkit-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -moz-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -o-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -ms-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -o-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    color: white;
}



.service-item:hover {
    border-color: #ff4c05;
}

.service-item:hover .service-icon {
	top: -30px;
}

.service-item:hover h3 {
    top: -30px;
}

.service-item:hover .service-desc {

    opacity: 1;
    -ms-filter: none;
    filter: none;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}





.what-we-do-item {
    width: 100%;
    height: 320px;
    margin: 10px 0;
    text-align: center;
    border: 1px solid #f2f2f2;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.what-we-do-item .service-icon {
    position: relative;
    color: white;
    top: 100px;
    display: inline-block;
    margin-bottom: 40px;
    padding: 10px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
    font-size: 60px;
}
.what-we-do-item h3 {
    color: #777;
    position: relative;
    top: 80px;
    margin: 0px;
    color: white;
    -webkit-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -moz-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -o-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -ms-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.what-we-do-item .service-desc {
    width: 80%;
    margin: 0 auto;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -webkit-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -moz-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -o-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -ms-transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: all 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -o-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    color: white;
}



.what-we-do-item:hover {
    border-color: #ff4c05;
}

.what-we-do-item:hover .service-icon {
	top: 10px;
}

.what-we-do-item:hover h3 {
    top: -30px;
}

.what-we-do-item:hover .service-desc {
    opacity: 1;
    -ms-filter: none;
    filter: none;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

