/*********************************************************

    Template Name:  Phoenix - Multipurpose one page HTML Template
    Author: MouriThemes
    Version: 1.0
    Design and Developed by: MouriThemes

    NB: This is the main stylesheet of this theme.

***********************************************************/

/*Table of Content


1. Default css 
2. Nav area css
3. Slider area css
4. About area css
5. Why choose us css
6. Statictic area css
7. Services area css
8. Portfolio area css
9. Blog Area css
10. Testimonial area css
11. Pricing table css
12. Contact Area css
13. Footer top area css
14. Footer bottom area css 


*/

/*--- 1. Default css starts ---*/

@import url("https://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");

i {
font-family: fontawesome !important;
}


html,body{
    height: 100%;
}

body{
    font-family: 'Poppins', sans-serif;
    width: 100%;
    height: 100%;
    font-size: 15px;
    line-height: 1.7;
    color: #333333;
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6{
    color: #333333;
    font-weight: 600;
}

p {
    letter-spacing: 0;
    line-height:1.8;
}

a{
    text-decoration: none;
    -webkit-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}

a:focus{
    outline:none;
    text-decoration: none;
}

ul,li{
    margin: 0;
    padding: 0;
}

img {
    max-width: 100%;
    height: auto;
}

.section-padding{
    padding: 100px 0;
}

.section-title {
    text-align: center;
    padding-bottom: 40px;
}
.section-title h2 {
	font-size: 30px;
	font-weight: bold;
	text-transform: uppercase;
	color: #3a3d41;
	letter-spacing: 4px;
    margin: 0;
}

.section-title p {
	color: #999;
	font-size: 18px;
    margin-top: 18px;
}

/*---Default css ends---*/


/*---------- 2. Nav area css starts -------------*/

.nav-area{
    height: 65px;
}

.nav-area.sticky_navigation{
    background: #ffffff;
    height: 55px;
}

.sticky_navigation{
    -webkit-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out ;
    transition: all 0.4s ease-out ;
    -webkit-box-shadow: 0px 3px 4.6px 0.3px rgba(0,0,0,0.25);
    box-shadow: 0px 3px 4.6px 0.3px rgba(0,0,0,0.25);
}

.sticky_navigation .main-menu{
    margin-top: 0;
}

.sticky_navigation .navbar-brand, .sticky_navigation .navbar-brand span {
    color: #262626;
}

.sticky_navigation .navbar-brand:hover, .sticky_navigation .navbar-brand:focus, .sticky_navigation .navbar-brand span {
    color: #ffffff;
}

.sticky_navigation .nav li a {
    color: #333333;
}

.sticky_navigation .nav li.active a {
	color: #428cd4;
}

.sticky_navigation .navbar-brand:hover{
    color: #ffffff;
}

.main-menu{
    -webkit-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
    margin-top: 10px;
}

.navbar{
    border:0;
    margin-bottom: 0;
}

.navbar-brand{
    padding: 15px 0;
    text-transform: uppercase;
    font-size: 25px;
    display: block;
    color: #ffffff;
    font-weight: 800;
}

.navbar-brand:focus, .navbar-brand:hover {
    text-decoration: none;
    color: #ffffff;
}

.navbar-right li{
    display: inline-block;
    float: none;
}

.navbar-right li a{
    color: #ffffff;
    text-transform: uppercase;
    font-weight: 600;
}

.navbar-right li.active a{
    font-weight: bold;
    color: #ffffff;
}

.nav > li > a:hover,
.nav > li > a:active,
.nav > li > a:focus{
    background: none;
}

.navbar-toggle .icon-bar{
    background: #FF1493;
}

/*---------- Nav area css ends -------------*/

/*----------- 3. Slider area css starts--------------*/

.banner-area{
    position: relative;
    height: 100%;
}

.carousel,
.carousel-inner,
.carousel-inner .item {
    height: 100%;
}

.carousel-inner .item:nth-child(1) {
    background-image: url(../images/home/1.jpg); /*--- edit image ---*/
    background-position: center center;
    background-size:cover;
}

.carousel-inner .item::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
    opacity: .8;
}

.carousel-inner .item:nth-child(2) {
    background: url(../images/home/2.jpg); /*--- edit image ---*/
    background-position: center center;
    background-size:cover;
}

.carousel-inner .item:nth-child(3) {
    background: url(../images/home/3.jpg); /*--- edit image ---*/
    background-position: center center;
    background-size:cover;
}

.carousel-caption {
    top: 30%;
    bottom: auto;
}

.carousel-caption h2{
    font-size: 70px;
    text-transform: uppercase;
    font-weight: bold;
    color: #fff;
}
.carousel-caption h2 span{
    color: #fff;
}

.carousel-caption h3{
    color: #fff;
}
.carousel-caption a {
	background-image: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
	padding: 15px 35px;
	display: inline-block;
	margin-top: 15px;
	color: #fff;
	text-transform: uppercase;
	border-radius: 50px;
	box-shadow: 0px 2px 5px #000;
}
.carousel-control.right{
    background-image: none;
}
.carousel-control.left{
    background-image: none;
}
.carousel-indicators .active {
    background-color: #fff;
    border-color: #fff;
}


/*-----------Slider area css ends--------------*/


/*-------- 4. About area starts-----------*/

.about-text h2{
    font-size: 30px;
font-weight: bold;
text-transform: uppercase;
color: #3a3d41;
letter-spacing: 4px;
}

.promoimage {
  overflow: hidden; }
  .promoimage img {
    width: 100%; }

.promoimage-animated > img {
  animation: crZoomInOut 20s ease-in-out infinite both; }


@-webkit-keyframes crZoomInOut {
  0% {
    transform: scale(1); }
  50% {
    transform: scale(1.3); }
  100% {
    transform: scale(1); } }
@keyframes crZoomInOut {
  0% {
    transform: scale(1); }
  50% {
    transform: scale(1.3); }
  100% {
    transform: scale(1); } }


.about-text a {
	border: 1px solid #428cd4;
	text-decoration: none;
	padding: 7px 35px;
	color: #fff;
	display: inline-block;
	margin-top: 20px;
	background-image: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
	text-transform: uppercase;
    border-radius: 50px;
}
.about-text a:hover{
    background-image: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
    color: #fff;
    transition: .5s;
}

/*-------- About area Ends----------*/


/*--- 5. Why choose us starts ----*/


.no-padding {
	padding: 0 !important;
}
.no-margin {
	margin: 0 !important;
}
.bg-primary {
	background: #2F3337 !important;
}
.why-choose-contentbox {
	padding: 25px 50px;
	color: #fff;
}
.why-choose-contentbox h2 {	
	margin-bottom: 55px;    
    font-size: 30px;
font-weight: bold;
text-transform: uppercase;
color: #ffffff;
letter-spacing: 4px;
}
.why-choose-col {
	position: relative;
	font-size:0;
}
.why-choose-col > i {
	font-size: 25px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
	text-align: center;
	line-height: 50px;
	display: inline-block;
	vertical-align: middle;
}
.why-choose-content {
	overflow: hidden;
	font-size: 14px;
	display:inline-block;
	vertical-align:middle;
	padding-left:30px;
	width: -moz-calc(100% - 90px);
    width: -webkit-calc(100% - 90px);
    width: calc(100% - 90px);
}
.why-choose-content h3 {
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	margin: 0 0 5px;
}
.why-choose-col + .why-choose-col {
	margin-top: 25px;
}
.why-choose-content p {
	margin: 0;
}
.video-col {
	height: 100%;
}
.video-col .video-popup {
	height: 100%;
	position: relative;
	display: block;
	-webkit-background-size: cover;
	background-size: cover;
	-webkit-background-position: 50% 0;
	background-position: 50% 0;
}



/*--- why choose us ends ----*/

/*-----------  6. Statistic area css starts --------------*/

.statistic-area {
    background-color: #2F3337;
    text-align: center;
}

.single-count i {
    color: #ffffff;
    font-size: 35px;
}

.single-count h2 {
	font-size: 50px;
	color: #428cd4;
}

.single-count p {
    font-size: 18px;
    color: #ffffff;
}


/*----------- Statistic area css ends --------------*/


/*------- 7. Services area starts -------*/

.services-icon i {
	color: #428cd4;
	font-size: 35px;
}
.single-services {
	padding: 25px;
}

/*------- services area ends -------*/


/*----------- 8. Portfolio area Starts --------*/

.project-item img {
    width: 100%;
}

.overlay {
	position: absolute;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	background: rgba(0, 0, 0, 0.7);
	opacity: 0;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	cursor: crosshair;
}

.overlay .overlay-inner {
    position: absolute;
    top: 35%;
    width: 100%;
    text-align: center;
}

.overlay .overlay-inner h4 {
	color: #428cd4 !important;
	margin-bottom: 0 !important;
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
	-webkit-transform: translateY(-30px);
	-moz-transform: translateY(-30px);
	-ms-transform: translateY(-30px);
	-o-transform: translateY(-30px);
	transform: translateY(-30px);
	text-transform: uppercase;
	font-size: 25px;
	letter-spacing: 1px;
    font-weight: 100;
}

.overlay .overlay-inner p {
    color: #fff;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    -o-transform: translateY(30px);
    transform: translateY(30px);
    margin-top: 10px;
    text-transform: uppercase;
}

.project-item:hover .overlay .overlay-inner h4 {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.project-item:hover .overlay .overlay-inner p {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.project-item a:hover .overlay {
    opacity: 1;
}

ul.port-nav-list {
    padding: 0 0 50px 0;
    list-style: none;
    text-align: center;
}

ul.port-nav-list li {
    display: inline-block;
    margin-right: 10px;
}

ul.port-nav-list li a {
    display: block;
    cursor: pointer;
    color: #777;
    font-size: 14px;
    padding: 8px 20px;
    text-decoration: none;
    text-transform: uppercase;
    border-radius: 50px;
}

ul.port-nav-list li a.active {
	color: #ffffff;
	border-color: #2F3337;
	background: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
}

.port-items {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.portfolio-items .port-items .single-port {
    overflow: hidden;
    margin-bottom: 25px;
}

.single-port {
    padding: 0;
}

/*-------- Portfolio area css ends---------*/

/*------- 9. Blog Area css starts ----------*/

.thumb {
	overflow: hidden;
	width: 100%;
	height: auto;
}
.single-blog:hover .thumb img {
	transform: scale(1.2);
	transition: .6s;
}
.date {
	display: inline-block;
	background: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
	color: #fff;
	padding: 5px 20px;
	margin-top: 15px;
    font-size: 16px;
}
.single-blog h4 a {
	text-decoration: none;
	color: #111;
	text-transform: uppercase;
}
.rea-area p:first-child {
	float: left;
}
.rea-area p:last-child {
	float: right;
}
.rea-area i {
	padding-right: 7px;
}

/*------- Blog Area ends ----------*/

/*-------- 10. Testimonial area css starts------------*/

.testimonial-area .section-header {
    margin-bottom: 30px;
}

.testimonial-area .section-header .sec-icon::before {
    background: #fff;
}

.testimonial-area .section-header .sec-icon::after {
    background: #fff;
}

.testimonial-area .section-header .line1 {
    background: #fff;
}
.testimonial-area .section-header .line2 {
    background: #fff;
}

.testimonial-area{
    background: url("../images/testimonial/testi.jpg"); /*edit image*/
    -webkit-background-size:cover;
    background-size:cover;
    background-position: center center;
    background-attachment:fixed;
    color: #fff;
    position: relative;
    z-index: 1;
}

.testimonial-area:before{
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.9);
    z-index: -1;
}

.testimonial-area .section-title h2 {
	color: #fff;
}

#testimonial-carousel .item p {
    width: 70%;
    margin: 0px auto;
    color: #babebc;
    cursor: e-resize;
    line-height: 30px;
}

#testimonial-carousel .item h5 strong {
    color: #fff;
    font-size: 18px;
    text-transform: uppercase;
}

.testimonial-area .section-header h2 {
    color: #ffffff;
}

.testimonial-area .section-header h3 {
    color: #ffffff;
}

#testimonial-carousel .item h6 {
    color: #fff;
    letter-spacing: 1px;
}

#testimonial-carousel .item {
    text-align: center;
    color: #fff;
}

#testimonial-carousel .item h5{
    color: #000000;
    margin-top: 20px;
}

#testimonial-carousel .item i {
    font-size: 45px;
    text-align: center;
    line-height: 45px;
    width: 100%;
    margin: 0px auto 30px;
    color: #000;
}

#testimonial-carousel .carousel-indicators {
    bottom: -45px;
}

#testimonial-carousel .carousel-indicators li {
    margin: 5px;
    cursor: pointer;
    opacity: 0.4;
    transition: all 0.4s;
    border-color: #000000;
}

#testimonial-carousel .carousel-indicators .active {
    opacity: 1;
    background: #000000;
}

.owl-dots{
    text-align: center;
}

.owl-dot {
    display: inline-block;
    height: 15px !important;
    width: 15px !important;
    background-color: #ffffff !important;
    opacity: 0.8;
    border-radius: 50%;
    margin: 0 5px;
}

.owl-dot.active {
    background-color: #428cd4 !important;
}



/*-------- Testimonial area css ends------------*/

/*-------- 11. Pricing table starts -----------*/

.pricing_table {
    position: relative;
    color: #fff;
    margin: 10px 0;
    text-align: center;
    background: #2F3337;
    transition: all 0.30s linear 0s;
}
.pricing_table::before {
    content: "";
    position: absolute;
    left: -10px;
    top: 55px;
    width: 30%;
    border: 20px solid #428cd4;
    border-right: 20px solid transparent;
}
.pricing_table::after{
    content:"";
    position:absolute;
    top:45px;
    left:-10px;
    border:5px solid #333;
    border-left:5px solid transparent;
    border-top:5px solid transparent;
}
.pricing_table_header{
    padding:40px;
}
.pricing_table_header .title {
    display: block;
    margin-bottom: 20px;
    text-transform: capitalize;
    color: #fff;
}
.pricing_table_header .price-plan {
    display: block;
    color: #fff;
    margin: 0 auto;
    background: #fff;
    color: #2F3337;
}
.pricing_table_header .price{
    font-size:40px;
}
.pricing_table_header .monthly_plan{
    font-size:20px;
}
.pricing_table .pricing_table_plan{
    border-top-right-radius:30px;
    border-top-left-radius:30px;
    padding:0 20px 30px;
}
.pricing_table .pricing_table_plan ul{
    margin:0 0 50px;
    padding:0;
}
.pricing_table .pricing_table_plan ul li{
    list-style:none;
    margin:15px 0;
}
.pricing_table .pricing_table_plan .btn-info {
    padding: 8px 40px;
    border: 0 none;
    background: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
    transition: all 0.30s linear 0s;
    text-transform: uppercase;
    border-radius: 50px;
}

/*-------- pricing table ends -----------*/

/*---- 12. Contact Area css Starts ----*/

.contact-area {
    background: #fff;
}

.form-group input, .form-group textarea {
	background: transparent;
	background: #E6E6E6;
}

.btn.btn-send.custom-button-4 {
	background: transparent;
	text-decoration: none;
	padding: 10px 30px;
	display: inline-block;
	margin-top: 25px;
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
	background: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
    border-radius: 50px;
}


.btn.btn-send.custom-button-4:hover,.btn.btn-send.custom-button-4:focus{
    text-decoration: none;
    color: #fff;
    background: #428cd4;
    border-color: #428cd4;
}

.btn.btn-send.custom-button-4:hover {
    box-shadow: 0px 14px 20px -9px rgba(0, 0, 0, 0.75);
    -webkit-transition: .5s;
    transition: .5s;
}

.contact-right h3 {
    margin-top: 0;
    font-size: 18px;
    text-transform: uppercase;
}

.contacDetails {
    text-align: center;
}

.contacDetails i {
    color: #f1c40f;
    margin-bottom: 15px;
    font-size: 25px;
}

.contact-area .form-control {
    color: #777
}

.contact-area .section-title h2:before {
    background: #333;
}

.contact-right p {
    font-weight: 100;
    color: #262626;
    margin: 0;
}


.contact-area input{
    height: 45px;
}

.connn-right {
	text-align: center;
}

.c-icon {
	background: -webkit-linear-gradient(0deg, #428cd4 0%, #004e9a 100%);
	display: inline-block;
	color: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50%;
    margin: 5px 0;
}
.c-icon i {
	padding: 12px;
	font-size: 18px;
}

/*---- Contact Area Ends ----*/

/*-------- 13. Footer top area css starts---------*/

.footer-top-area {
    background: #111111;
    padding: 50px 0;
}

.footer-top-area h4 {
    color: #fff;
    letter-spacing: 1.8px;
    font-weight: 400;
    text-transform: none;
}

.footer-top-area h6 {
    text-transform: none;
    font-weight: 400;
    font-size: 13px;
}

.footer-top-area h6 a {
    color: #777777;
    font-weight: 400;
}

.footer-top-area p {
    color: #777777;
    font-weight: 300;
    margin-bottom: 35px;
    line-height: 1.7;
    font-size: 13px;
    width: 90%;
}

ul.social-list {
    padding: 0;
    list-style: none;
}

ul.social-list li {
    display: inline-block;
    margin-right: 9px;
    margin-bottom: 3px;
}

ul.social-list li a {
	display: inline-block;
	text-decoration: none;
	color: #ffffff !important;
	transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	width: 40px;
	height: 40px;
	border: 1px solid #fff;
	text-align: center;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background: transparent;
}

ul.social-list li a:hover i {
    color: #ffffff;
}

ul.social-list li a:hover {
    background: #428cd4;
}

ul.social-list li a:hover i {
    color: #fff;
}

ul.social-list li a:hover {
    border: 1px solid #428cd4;
}

ul.social-list li a i {
    font-size: 14px;
    padding: 10px;
}

.footer-logo {
    margin-top: -10px;
}

.latest-news ul {
    margin: 0;
    padding: 0;
}

.latest-news ul li {
    list-style: none;
    padding-top: 15px;
    border-top: 1px solid #535353;
}

.latest-news ul li:first-child {
    padding-top: 0;
    border-top: none;
}

.latest-news ul li span {
    line-height: 1.8;
    margin: 0 0 15px;
    display: inline-block;
    font-size: 13px;
    color: #777777;
    margin-bottom: 10px;
}


.foo-no-padding{
    padding: 0;
}

.single-footer-top.photo-galleries h4 {
    margin-left: -15px;
}
.single-footer-top .form-group{
    display: block;
    position: relative;
}

.single-footer-top .form-group input[type="email"] {
    display: block;
    width: 100%;
    height: 42px;
    padding-left: 20px;
    padding-right: 70px;
    border: none;
    background: rgba(204, 204, 204, 0.1);
    -webkit-transition: background 0.3s;
    transition: background 0.3s;
    border-radius: 0 !important;
    color: #777;

}
.single-footer-top .form-group button {
    position: absolute;
    display: block;
    top: 0;
    right: 0;
    width: 50px;
    height: 42px;
    border: none;
    color: #fff;
    background: #428cd4;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.single-footer-top .form-group button:hover {
    background: #ececec;
    color: #111;
}


/*-------- Footer top area ends---------*/

/*---------- 14. Footer bottom area css starts---------*/

.footer-bottom {
    padding: 30px 0;
    background: #1f2021;
    border-top: 1px solid #535353;
}

.footer-bottom p {
    font-size: 15px;
    margin: 0;
    color: #ffffff;
}

.single-footer-top h4 {
	margin-bottom: 30px;
	border-bottom: 2px solid rgba(204, 204, 204, 0.2);
	padding-bottom: 20px;
	color: #ececec;
	text-transform: uppercase;
}

.foot-navs{
    margin-top: 15px;
    list-style: none;
}

.foot-navs li a {
    color: #777777;
    display: inline-block;
    font-family: "montserratlight",sans-serif;
    padding: 0 0 10px;
    font-size: 13px;
    font-weight: 700;
}

.single-footer-top h4 b span {
    color: #e74c3c;
}

/*---------- Footer bottom area css ends---------------*/