/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOME DESIGN
    04. START ABOUT US DESIGN
    05. START WHY CHOOSE US DESIGN
    06. START COUNTDOWN DESIGN
    07. START PORTFOLIO DESIGN
    08. START SPECIAL OFFER DESIGN
    09. START FEATURES DESIGN
    10. START OUR TEAM DESIGN
    11. START HOW IT WORKS DESIGN
    12. START PRICING DESIGN
    13. START TESTIMONIAL DESIGN
    14. START BLOG DESIGN
    15. START COMPANY PARTNER LOGO
    16. START CONTACT DESIGN
    17. START FOOTER DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    letter-spacing: 1px;
    height: 100%;
    font-family: 'Lato', sans-serif;
    background: #fff;
    color: #777;
}
html,
body { height: 100% }
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #333;
    font-family: "Montserrat",sans-serif;
    font-weight: 700;
}
a {
    font-family: "Montserrat",sans-serif;
    text-decoration: none;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}
a:hover {
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
p { line-height: 2 }
ul,
li {
    margin: 0;
    padding: 0;
}
fieldset {
    border: 0 none;
    margin: 0 auto;
    padding: 0;
}
/*START PRELOADER DESIGN*/
.preloader {
    background: #fff;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 9999;
}
.status,
.status-mes {
    background-image: url(../img/status.gif);
    background-position: center;
    background-repeat: no-repeat;
    height: 200px;
    left: 50%;
    margin: -100px 0 0 -100px;
    position: absolute;
    top: 50%;
    width: 200px;
}
.status-mes {
    background: none;
    left: 0;
    margin: 0;
    text-align: center;
    top: 65%;
}
.status-mes h4 {
    color: #333;
    margin-top: 30px;
	text-transform: uppercase;
	font-weight:400;
}
.no-padding { padding: 0 }
/*END PRELOADER DESIGN*/
/*START SCROLL TO TOP*/
.topcontrol {
    background: #E51A92 none repeat scroll 0 0;
    border-radius: 5px;
    bottom: 5px;
    box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
    color: #fff;
    cursor: pointer;
    font-size: 26px;
    height: 40px;
    line-height: 40px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    position: fixed;
    right: 5px;
    text-align: center;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    width: 40px;
}
.topcontrol:hover {
    background: #222;
    color: #fff;
}

#bestseller .section-title {
  margin-bottom: 20px;
}

/*END SCROLL TO TOP*/
.section-padding { padding: 60px 0 }
/*START SECTION TITLE DESIGN*/
.section-title {
  margin-bottom: 60px;
  padding: 5px;
}
.section-title  h2 {
    color: #333;
    margin: 0;
    position: relative;
    //text-transform: uppercase;
    padding-bottom: 10px;
}
@media only screen and (max-width:768px) {
    .section-title h2 { text-align: center }
}
@media only screen and (max-width:480px) {
    .section-title h2 { font-size: 30px }
}
@media only screen and (max-width:360px) {
    .section-title h2 { font-size: 24px }
}
.section-title  h2 span{color:#E51A92;}
.line {
    background: #E51A92 none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 15px auto;
    width: 70px;
    position: relative;
}
.section-title-white {
    color: #fff !important;
    position: relative;
}
.section-title p {
    margin: auto;
	margin-bottom: -20px;
    width: 90%;
}
@media only screen and (max-width:768px) {
    .section-title p {
        padding: 0 20px;
        width: 100%;
    }
}
/*END SECTION TITLE DESIGN*/
/*
* ----------------------------------------------------------------------------------------
* 01.END GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 02. START BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
.navbar-default {
    border: none;
    border-radius: 0;
    margin-bottom: 0;
    width: 100%;
    padding: 20px 0;
    background: #fff;
    transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
}
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
    color: #E51A92 !important;
    background-color: transparent;
}
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
    color: #E51A92 !important;
    background-color: transparent;
	   padding-bottom: 5px;
}
.navbar-brand { padding: 0px }
.navbar-brand img {
    width: 150px;
    margin-left: 10px;
}
@media only screen and (max-width:980px) {
.navbar-default {
  padding: 10px 0 5px 5px;
}
.navbar-brand img {width: 130px;}
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form { border-color: #fff }
.menu-top li a {
    color: #333 !important;
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
}
.menu-top li a:hover { color: #E51A92!important }
@media only screen and (max-width:980px) {
    .navbar-default .navbar-nav > li > a {
        margin-top: 10px;
        padding: 8px;
    }
	.menu-top li a {
		font-size: 11px;
		color: #333 !important;
	}
}
@media only screen and (max-width:480px) {
    .menu-top { background-color: #fff }
}
.navbar-default.menu-shrink {
    background-color: #fff;
    box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
    padding: 10px 0;
    width: 100%;
}
@media only screen and (max-width:980px) {
  .menu-top {
		background-color: #fff;
    color: #fff !important;
    margin-left: 0px;
  }
	.navbar-default .navbar-nav > li > a {
		color: #313131  !important
	}
  .navbar-socialmedia {
    float: left;
  }
}
.navbar-default.menu-shrink li { color: #313131!important }
.navbar-default.menu-shrink li a { color: #313131!important }
.navbar-default.menu-shrink li a:hover { color: #E51A92 !important }
.navbar-default .navbar-toggle { background: #fff none repeat scroll 0 0 }
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { background-color: #fff }
.navbar-default .navbar-toggle .icon-bar { background-color: #E51A92 }

.navbar-socialmedia {
  padding: 15px 10px !important;
}

.navbar-divider {
  padding:12px 10px;
}

/*
.dropdown:hover .dropdown-menu {
	display: block;
}*/
.dropdown-menu {
	background: #fff;
}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover {
	background: none !important;
}

/*
* ----------------------------------------------------------------------------------------
* 02.END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 03.START HOME DESIGN
* ----------------------------------------------------------------------------------------
*/
#home-slider {
    overflow: hidden;
    position: relative;
}
.caption {
    color: #fff;
    left: 0;
    margin-top: -104px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 50%;
    z-index: 15;
}
@media only screen and (max-width:375px) {
    .caption { top: 42% }
}
@media only screen and (max-width:360px) {
    .caption { top: 40% }
}
.caption h2 {
    color: #fff;
    font-size: 44px;
    margin-bottom: 20px;
    margin-top: 0;
    text-transform: uppercase;
}
@media only screen and (max-width:768px) {
    .caption h2 { font-size: 26px }
}
@media only screen and (max-width:480px) {
    .caption h2 {
        font-size: 30px;
        line-height: 40px;
    }
}
@media only screen and (max-width:320px) {
    .caption h2 { font-size: 24px }
}
.caption p {
    margin: auto auto 0px;
    width: 60%;
}
.caption a { margin: 30px 0 0 30px }
@media only screen and (max-width:480px) {
.caption a { margin: 30px 0 0 0px }
}
.carousel-fade .carousel-inner .item {
    margin-top: 84px;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -webkit-transition-property: opacity;
    transition-property: opacity;
    background-repeat: no-repeat;
    background-size: 100%; //cover;
    height: 800px;
}
@media only screen and (max-width:500px) {
    .carousel-fade .carousel-inner .item {
		margin-top: 64px;
    height: 230px;

	}
}
.carousel-fade .carousel-inner .item:after {
	//background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
	bottom: 0;
	content: " ";
	left: 0;
	opacity: 0.7;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
	position: absolute;
	right: 0;
	top: 0;
}
.carousel-fade .carousel-inner .active {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    left: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    z-index: 1;
}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-control { z-index: 2 }
.left-control,
.right-control {
    background: rgba(255,255,255,0.61) none repeat scroll 0 0;
    border-radius: 30px;
    color: #E51A92;
    font-size: 24px;
    height: 51px;
    line-height: 48px;
    position: absolute;
    text-align: center;
    top: 50%;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 51px;
    z-index: 20;
}
@media only screen and (max-width:480px) {
    .left-control,
    .right-control { display: none }
}
.left-control { left: -51px }
.right-control { right: -51px }
.left-control:hover,
.right-control:hover {
    background-color: rgba(255,255,255,0.81);
    color: #E51A92;
}
.left-control:focus,
.right-control:focus {
    background-color: rgba(255,255,255,0.81);
    color: #E51A92;
}
#home-slider:hover .left-control { left: 30px }
#home-slider:hover .right-control { right: 30px }
#home-slider .fa-angle-down {
    position: absolute;
    left: 50%;
    bottom: 50px;
    color: #fff;
    display: inline-block;
    width: 24px;
    margin-left: -12px;
    font-size: 24px;
    line-height: 24px;
    z-index: 999;
    -webkit-animation: bounce 3000ms infinite;
    animation: bounce 3000ms infinite;
}
.btn-light-bg {
background: #E51A92 none repeat scroll 0 0;
border: medium none;
border-radius: 0;
color: #fff;
padding: 13px 35px;
text-transform: uppercase;
-webkit-transition: all 0.2s ease 0s;
transition: all 0.2s ease 0s;
}
.btn-light-bg:hover,
.btn-light-bg:focus {
    background: #fff;
    color: #333;
}
@media only screen and (max-width:375px) {
.btn-light-bg {padding: 13px 45px;}
}
.btn-light-bg-two {
    background: #fff none repeat scroll 0 0;
    color: #333;
    padding: 13px 35px;
	border: medium none;
	border-radius: 0;
	margin-left:30px;
    text-transform: uppercase;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.btn-light-bg-two:hover,
.btn-light-bg-two:focus {
    background: #E51A92;
    color: #fff;
}
.btn-product {
  padding: 10px;
}
.btn-product h4 {
  margin-top: 40px;
}
.btn-product .border {
  border-right: #ddd solid 1px;
}
.btn-product img {
  float: left;
  width: 24%;
}

@media only screen and (max-width:768px) {
  .btn-product .border {
      border-right: 0;
  }
  .btn-product h4 {
    text-align: center;
  }
  .btn-product img {
    padding-top: 30px;
  }
  .btn-product img {
    float: none;
  }
}

/*START TEXT SLIDER*/
.text_slider {
position: relative;
height:700px;
}
.text_slider:before {
    background: rgba(0, 0, 0, 0.6);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 100%;
}

/*START TEXT SLIDER*/

/*START HTML5 VIDEO*/
.html-video {
    top: 0%;
    left: 0%;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.html-video:before {
    background: rgba(0, 0, 0, 0.6);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 100%;
}
.slider-caption {
    position: absolute;
    top: 33%;
    width: 100%;
    left: 0;
    text-align: center;
    z-index: 15;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
}
.slider-caption p {
  width: 60% !important;
}
video { min-width: 100% }
/*END HTML5 VIDEO*/
/*START YOUTUBE HOME DESIGN*/
.youtube_bg {
position: relative;
height:700px;
}
.youtube_bg:before {
    background: rgba(0, 0, 0, 0.6);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 100%;
}
.home_text h2 {
    color: #f8f8f8;
    font-size: 40px;
	padding-top:250px;
    margin-top: 0;
    text-transform: uppercase;
    margin-bottom: 20px;
}
.home_text p {
    color: #fff;
    margin: auto auto 30px;
    width: 70%;
}
@media only screen and (max-width:768px) {
    .home_text p { width: 100% }
}
/*END YOUTUBE HOME DESIGN*/
/*
* ----------------------------------------------------------------------------------------
* 03.END HOME DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 04.START ABOUT US DESIGN
* ----------------------------------------------------------------------------------------
*/
.about_img img {
  width: 100%;
}
@media only screen and (max-width:768px) {
    .about-us-content {margin-top:60px; }
}
.about-us-content h2 {
	margin: 0;
	text-transform: uppercase;
	font-size: 24px;
}

@media only screen and (max-width:768px) {
    .about-us-content h2 { font-size: 24px }
}
.about-line {
    background: #E51A92 none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 20px 0;
    width: 80px;
}
.about-us-content h2 span { color: #E51A92 }
.about-us-content p span { color: #E51A92 }
.about-us-content p {
line-height: 32px;
margin-bottom: 30px;
}
@media only screen and (max-width:768px) {
    .about_img { margin-top: 30px }
}

#hydra-soft h2,strong {
	color: #17A6DF;
}
#hydra-soft p {
	font-size: 14px;
}

#white-glow h2,strong {
	color: #CF3184;
}
#white-glow .line {
	background: #17A6DF none repeat scroll 0 0;
}
#white-glow p {
	font-size: 14px;
}


/*
* ----------------------------------------------------------------------------------------
* 04.END ABOUT US DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 05.START WHY CHOOSE US DESIGN
* ----------------------------------------------------------------------------------------
*/
.single_feature {
	margin-top: 50px;
  text-align: left;
}
.single_feature img {
	width: 140px;
}
@media only screen and (max-width:768px) {
    .single_feature { padding: 0px 20px 0 }
}
.feature_img {
    margin: auto auto 0;
    max-width: 450px;
}

#hydra-soft .single_feature i {
    border-radius: 50%;
    color: #fff;
	background:#17A6DF;
    display: inline-block;
    font-size: 24px;
    height: 60px;
    line-height: 62px;
    margin: 0 auto 15px;
    position: relative;
    text-align: center;
    width: 60px;
    z-index: 3;
	-webkit-transition: .5s;
	transition: .5s;
}
#hydra-soft .single_feature:hover i{
	background: #E51A92;
}

#white-glow .single_feature i {
    border-radius: 50%;
    color: #fff;
	background:#CF3184;
    display: inline-block;
    font-size: 24px;
    height: 60px;
    line-height: 62px;
    margin: 0 auto 15px;
    position: relative;
    text-align: center;
    width: 60px;
    z-index: 3;
	-webkit-transition: .5s;
	transition: .5s;
}
#white-glow .single_feature:hover i{
	background: #17A6DF;
}

#terkini .line {
  background: #17A6DF none repeat scroll 0 0;
}

#terkini {
  background: #f7f7f7;
}

.single_feature h3 {
    text-transform: uppercase;
    font-size: 14px;
}
.single_feature span {
    border-bottom: 1px dashed #ccc;
    width: 80px;
    display: block;
	margin-bottom: 10px;
}
.single_feature p {
  margin-bottom: 0;
  font-size: 14px;
  line-height: 1.5;
}
/*
* ----------------------------------------------------------------------------------------
* 05.END  WHY CHOOSE US DESIGN
* ----------------------------------------------------------------------------------------
*/



/*
 * ----------------------------------------------------------------------------------------
 *  06.START COUNTDOWN DESIGN
 * ----------------------------------------------------------------------------------------
 */
.counter { position: relative }
.counter:before {
	//background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
	content: "";
	height: 100%;
	left: 0;
	//opacity: 0.8;
	//-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	position: absolute;
	top: 0;
	width: 100%;
}

@media only screen and (max-width:480px) {
.timer {margin-bottom:20px;}
}
.time_counter {
color: #E51A92;
font-size: 40px;
font-weight: 700;
margin-top: 0;
}
.counter_title {
color: #fff;
font-size: 16px;
font-weight: 700;
letter-spacing: 1px;
margin-bottom: 0;
text-transform: uppercase;
}
/*
 * ----------------------------------------------------------------------------------------
 *  06.END COUNTDOWN DESIGN
 * ----------------------------------------------------------------------------------------
 */



 /*
* ----------------------------------------------------------------------------------------
* 07.START PORTFOLIO DESIGN
* ----------------------------------------------------------------------------------------
*/
#vitalis {
  background-color: #000;
}
#vitalis h2 {
	color: #fff;
}
#vitalis h3 {
  font-size: 16px;
  font-weight: 700;
	color: #fff;
}

#vitalis h4 {
	font-size: 21px;
	margin-top: -5px;
	color: #8c8c8c;
}
#vitalis p {
	color: #dadada;
}
.vitalisdark {
	padding:0 5%;
}
.grid figure {
    background: #00bcd4 none repeat scroll 0 0;
    overflow: hidden;
    position: relative;
}
.grid figure img {
    position: relative;
    opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
}
.grid figure figcaption {
    padding: 2em;
    color: #fff;
    //text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.grid figure figcaption,
.grid figure figcaption > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.grid figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}
.grid figure h2 span { font-weight: 700 }
.grid figure h2,
.grid figure p { margin: 0 }
.grid figure p {
    letter-spacing: 0px;
    font-size: 68.5%;
}
.effect-apollo p a {
	border-right: 4px solid #fff;
	font-weight: 700;
	color: #fff;
	font-size: 14px;
}
figure.effect-apollo {background: rgba(0,0,0,0.9);}
figure.effect-apollo img {
    opacity: 0.95;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)";
    filter: alpha(opacity=95);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s;
    -webkit-transform: scale3d(1.05,1.05,1);
    transform: scale3d(1.05,1.05,1);
}
figure.effect-apollo figcaption:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.5);
    content: '';
    -webkit-transition: -webkit-transform 0.6s;
    transition: -webkit-transform 0.6s;
    transition: transform 0.6s;
    transition: transform 0.6s, -webkit-transform 0.6s;
    -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
    transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
}
figure.effect-apollo p {
	bottom: 0;
	margin: 2em;
	max-width: 500px;
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	padding: 0;
	position: absolute;
	right: 0;
	text-align: right;
	-webkit-transition: opacity 0.35s ease 0s;
	transition: opacity 0.35s ease 0s;
	line-height: 21px;
}
@media only screen and (max-width:768) {
	figure.effect-apollo p {
		bottom: 0;
		margin: 1em;
		line-height: 21px;
	}
}


figure.effect-apollo h4{ text-align: left;color:#fff;position: absolute; }
figure.effect-apollo:hover img {
    opacity: 0.6;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    filter: alpha(opacity=60);
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
}
figure.effect-apollo:hover figcaption:before {
    -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
    transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
}
figure.effect-apollo:hover p {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}
.portfolio_btn { padding-top: 50px }

.btn-portfolio-bg {
	background: #E51A92 none repeat scroll 0 0 !important;
	border: 1px solid #E51A92;
	border-radius: 3px;
	box-shadow: none;
	color: #fff;
	font-size: 12px;
	padding: 12px 30px;
	text-transform: uppercase;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}
.btn-portfolio-bg:hover,
.btn-portfolio-bg:focus {
    background: #333!important;
    color: #fff;
    border: 1px solid #333!important;
}

.btn-hydrasoft-bg {
	background: #CF3184 none repeat scroll 0 0 !important;
	border: 1px solid #CF3184;
	border-radius: 3px;
	box-shadow: none;
	color: #fff;
	font-size: 12px;
	padding: 12px 30px;
	text-transform: uppercase;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}
.btn-hydrasoft-bg:hover,
.btn-hydrasoft-bg:focus {
    background: #F9ED32!important;
    color: #fff;
    border: 1px solid #F9ED32!important;
}

.btn-whiteglow-bg {
	background: #17A6DF none repeat scroll 0 0 !important;
	border: 1px solid #17A6DF;
	border-radius: 3px;
	box-shadow: none;
	color: #fff;
	font-size: 12px;
	padding: 12px 30px;
	text-transform: uppercase;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}
.btn-whiteglow-bg:hover,
.btn-whiteglow-bg:focus {
    background: #F9ED32!important;
    color: #fff;
    border: 1px solid #F9ED32!important;
}
/*
* ----------------------------------------------------------------------------------------
* 07.END PORTFOLIO DESIGN
* ----------------------------------------------------------------------------------------
*/



/*
* ----------------------------------------------------------------------------------------
* 08.START SPECIAL OFFER DESIGN
* ----------------------------------------------------------------------------------------
*/
.special_offer {
    position: relative;
}
.special_offer:before {
    background: rgba(15, 22, 30, 0.4) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    position: absolute;
    top: 0;
    width: 100%;
}
.offer h3{
color:#fff;
margin-top: 0;
margin-bottom: 20px;
text-transform: uppercase;
}
.offer p{margin-bottom: 30px;color:#ddd;}
.offer a {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: 1px solid #eee;
border-radius: 30px;
color: #fff;
padding: 10px 30px;
text-transform: uppercase;
-webkit-transition: all 0.2s ease 0s;
transition: all 0.2s ease 0s;
}
@media only screen and (max-width:480px) {
    .offer a{padding: 10px 26px; }
}
.offer a:hover,
.offer a:focus {
border: 1px solid #E51A92;
color: #E51A92;
}
.opening_hour h3{
color:#fff;
margin-top: 0;
margin-bottom: 20px;
text-transform: uppercase;
}
.opening_hour p{
color:#ddd;
margin-bottom: 30px;
}
.opening_hour ul{list-style:none;}
.opening_hour ul li{
color: #fff;
line-height: 24px;
}
.opening_hour ul li span{
color: #E51A92;
float: right;
font-weight: 700;
}
/*
* ----------------------------------------------------------------------------------------
* 08.END SPECIAL OFFER DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 09.START PRODUCTS DESIGN
* ----------------------------------------------------------------------------------------
*/

.single_offer {
border: 1px solid #eee;
padding: 20px;
-webkit-transition: all 0.2s ease 0s;
transition: all 0.2s ease 0s;
}
@media only screen and (max-width:480px) {
    .single_offer { margin-bottom: 20px }
}
.single_offer:hover {
border: 1px solid #E51A92;
box-shadow:0px 0px 20px 0px rgba(0,0,0,0.2);
}
.single_offer_img { overflow: hidden }
.single_offer_img img {
  border-radius: 500px;
  height: 250px;
  margin: auto;
  width: 250px;
}
@media only screen and (max-width:768px) {
.single_offer_img img {
  border-radius: 500px;
  height: 200px;
  margin: auto;
  width: 200px;
}
}
.single_offer h4 {
font-weight: 400;
margin-bottom: 0;
margin-top: 20px;
text-transform: uppercase;
-webkit-transition: all 0.4s ease 0s;
transition: all 0.4s ease 0s;
}
.single_offer h5{
color: #E51A92;
font-size: 18px;
}

.single_offer p {
    margin-bottom: 20px;
}
.btn-feature-bg {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
border: 1px solid #eee;
border-radius: 30px;
color: #333;
padding: 10px 30px;
text-transform: uppercase;
-webkit-transition: all 0.2s ease 0s;
transition: all 0.2s ease 0s;
}
.btn-feature-bg:hover,
.btn-feature-bg:focus {
border: 1px solid #E51A92;
    background: #fff;
    color: #E51A92;
}
/*
* ----------------------------------------------------------------------------------------
* 09.END FEATURE DESIGN
* ----------------------------------------------------------------------------------------
*/



/*
 * ----------------------------------------------------------------------------------------
 * 10.START OUR TEAM DESIGN
 * ----------------------------------------------------------------------------------------
 */

@media only screen and (max-width:768px) {
.single_team {margin-bottom: 60px;}
}
.single_team p{
	padding: 5px 0 30px 0;
	font-size: 13px;
	line-height: 16px;
}
.single_team h3{
	font-size: 18px;
	margin-top: 15px;
	text-transform: uppercase;
}
.single_team h4 {
color: #777;
font-size: 15px;
margin-bottom: 0;
text-transform: uppercase;
}
.img_wrap{
	position:relative;
}
.img_wrap img {
  width: 100%;
}
.online-link{
  padding-top: 80px;
	height: 100%;
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	position: absolute;
	text-align: center;
	top: 0;
	-webkit-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
	visibility: hidden;
	width: 100%;
	z-index: 1;

	-webkit-transform: scale(0);
	        transform: scale(0);
}
.online-link p{
	margin-top: 100px;
	margin-bottom: -35%;
	color: #333;
  font-weight: 700;
}

@media only screen and (max-width:768px) {
	.online-link p{
		color: rgba(229,26,146, .0);
		margin-bottom: -160px;
	}
}
.img_wrap:hover .online-link{
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	visibility: visible;
	-webkit-transform: scale(1);
	        transform: scale(1)
}
.social_table{
	display: table;
	height: 100%;
	width: 100%;
}
.social_table ul{
	list-style: none;
	display: table-cell;
	list-style: outside none none;
	padding: 0;
	vertical-align: middle;
}
.social_table ul a{
	color: #333;
	display: inline-block;
	-webkit-transition: all 0.5s ease 0s;
	-webkit-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
	width: 100px;
}
.social_table li{
	padding: 2px;
}
/*
 * ----------------------------------------------------------------------------------------
 * 10.END OUR TEAM DESIGN
 * ----------------------------------------------------------------------------------------
 */




/*
* ----------------------------------------------------------------------------------------
* 11.START HOW IT WORKS DESIGN
* ----------------------------------------------------------------------------------------
*/
.about_video {
    height: 450px;
    position: relative;
}
.about_video:before {
    //background: rgba(15, 22, 30, 0.4) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
   // opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    position: absolute;
    top: 0;
    width: 100%;
}
.video-container h3 {
    color: #fff;
    font-size: 40px;
    font-weight: 400;
    margin-top: 150px;
	   margin-bottom: 50px;
    text-transform: capitalize;
}
@media only screen and (max-width:320px) {
    .video-container h3 { font-size: 280px }
}
.play-video {
    background-color: rgba(255, 255, 255, 0.3);
    border: 7px solid #fff;
    border-radius: 500px;
    cursor: pointer;
    height: 150px;
    left: 50%;
    margin-left: -76px;
    position: absolute;
    top: 85%;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    width: 150px;
}
.video-container a { display: inline-block }
.video-container a:hover .play-video {
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
}
.video-container a:hover .fa-play { color: #fff }
.play-video .fa-play {
    color: #fff;
    font-size: 70px;
    left: 50px;
    position: absolute;
    top: 30px;
}
.modal-content {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    margin-top: 100px;
    text-align: center;
    box-shadow: none;
    border: none;
}
.modal-content iframe { border: none }

@media only screen and (max-width:768px) {
  .modal-content iframe {
    width: 90%;
    height: 200px;
  }
}
/*
* ----------------------------------------------------------------------------------------
* 11.END HOW IT WORKS DESIGN
* ----------------------------------------------------------------------------------------
*/



/*
* ----------------------------------------------------------------------------------------
* 12.START PRICING DESIGN
* ----------------------------------------------------------------------------------------
*/
.pricing-table {
background-color: #fff;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
position: relative;
-webkit-transition: all 0.4s ease 0s;
transition: all 0.4s ease 0s;
}
.pricing-table:hover{
 box-shadow: none;
}
@media only screen and (max-width:480px) {
    .pricing-table { margin-bottom: 40px }
}
.pricing-table.active { box-shadow: 0 0 4px rgba(0, 0, 0, 0.1) }
.pricing-table h3 {
	color: #333;
	font-size: 20px;
	margin-bottom: 0;
	margin-top: 0;
	padding: 25px 0 20px;
	text-align: center;
	text-transform: uppercase;
}
.price {
	color: #333;
	display: inline-block;
	font-family: montserrat,sans-serif;
	font-size: 14px;
	line-height: 26px;
	margin-bottom: 12px;
	padding-bottom: 25px;
	text-transform: uppercase;
	width: 100%;

}
.price.color-two h3{
	color: #fff;
}
.color-one {
    background: #f2f2f2;
}
.color-two {
background: #E51A92 none repeat scroll 0 0;
color: #fff;
}
.color-three {
    background: #dd3333;
    color: #fff;
}
.price span {
	display: block;
	font-size: 42px;
	font-weight: 700;
	padding-bottom: 20px;
}
.pricing-list {
    list-style: outside none none;
    margin-bottom: 0;
    text-align: center;
}
.pricing-list li {
	border-bottom: 1px dashed #eee;
	color: #333;
	font-size: 15px;
	padding: 10px 15px;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	position: relative;
}
.pricing-list li:hover {}
.pricing-btn { padding: 20px 0 }
.pricing-btn  button {
    background: #E51A92;
    border: 1px solid #E51A92;
    color: #fff;
    font-family: montserrat,sans-serif;
    padding: 8px 30px;
    text-transform: uppercase;
    -webkit-transition: all 0.2s ease 0s;
            transition: all 0.2s ease 0s;
}
.pricing-btn  button:hover {
    background: #333;
    border: 1px solid #333;
    color: #fff;
}
/*
* ----------------------------------------------------------------------------------------
* 12.END PRICING DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 13. START TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/
.testimonials {
    background: #f7f7f7;
    position: relative;
    height: auto;
    z-index: 1;
    padding: 60px 0;
}
.testimonials .flexslider {
    background-color: #fff;
    border: 0 none;
    box-shadow: 0 7px 33px 0 rgba(0, 0, 0, 0.12);
    margin: 0;
}
.testimonials .flexslider .testi-slider-item {
    padding: 30px 60px;
    text-align: center;
}
.testimonials .flexslider .testi-slider-item img {
border: 3px solid #E51A92;
border-radius: 50%;
height: 100px;
margin: 20px auto;
width: 100px;
}
.testimonials .flexslider .testi-slider-item h6 {
color: #E51A92;
font-size: 14px;
margin-bottom: 0;
text-transform: uppercase;
}
@media only screen and (max-width:360px) {
.testimonials .flexslider .testi-slider-item p  {line-height: 24px;font-size: 16px; }
}
.testimonials .flex-direction-nav a {
    background: #E51A92 none repeat scroll 0 0;
    border-radius: 100px;
    box-shadow: 0 10px 11px 0 rgba(0, 0, 0, 0.2);
    color: #fff;
    cursor: pointer;
    display: block;
    height: 45px;
    line-height: 50px;
    margin: -20px 0 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    overflow: hidden;
    position: absolute;
    text-align: center;
    text-decoration: none;
    text-shadow: none !important;
    top: 50%;
    -webkit-transition: all 0.3s ease 0s;
            transition: all 0.3s ease 0s;
    width: 45px;
    z-index: 10;
}
.testimonials .flex-direction-nav a i {
    display: inline-block;
    font-size: 25px;
}
.testimonials .flex-direction-nav a:before { display: none }
.testimonials .flex-direction-nav a.flex-next:before { display: none }
.testimonials .flex-control-paging li a {
    background: #222 none repeat scroll 0 0;
    border: 1px solid #222;
    border-radius: 20px;
    cursor: pointer;
    display: block;
    height: 6px;
    text-indent: -9999px;
    width: 6px;
}
.testimonials .flex-control-paging li a:hover {
    background: #00bcd4 none repeat scroll 0 0;
    border-color: #00bcd4;
}
.testimonials .flex-control-paging li a.flex-active {
    background: #00bcd4 none repeat scroll 0 0;
    border-color: #00bcd4;
    cursor: default;
}
.flex-control-nav {display: none;}
/*
* ----------------------------------------------------------------------------------------
* 13. END TESTIMONIAL DESIGN
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 14. START BLOG DESIGN
* ----------------------------------------------------------------------------------------
*/
.single-blog {
    background: #fff none repeat scroll 0 0;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.2s ease 0s;
            transition: all 0.2s ease 0s;
}
.single-blog:hover { box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25) }
@media only screen and (max-width:480px) {
    .single-blog { margin-bottom: 40px }
}
.single-img {
    position: relative;
    width: 100%;
}
.post-date {
    background: #fff none repeat scroll 0 0;
    display: inline-block;
    left: 0;
    padding: 15px;
    position: absolute;
    top: 5%;
}
.post-date  h4 {
    color: #333;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
}
.blog-social {
    background: #fff none repeat scroll 0 0;
    bottom: 5%;
    display: inline-block;
    padding: 20px;
    position: absolute;
    left: 0;
}
.blog-social h4 {
    border-bottom: 1px solid #e8e8e9;
    margin-top: 0;
    padding: 5px;
    text-align: center;
    text-transform: uppercase;
}
.blog-social ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.blog-social ul li { float: left }
.blog-social ul li a { }
.blog-social ul li a i {
    color: #fff;
    font-size: 18px;
    height: 40px;
    line-height: 45px;
    text-align: center;
    -webkit-transition: all 0.2s ease 0s;
            transition: all 0.2s ease 0s;
    width: 40px;
}
.blog-social ul li a i:hover {
    background: #E51A92;
    color: #fff;
}
.single_blog_dsc { padding: 20px }
.single_blog_dsc h3 {
    color: #333;
    display: block;
    font-size: 20px;
    margin: 0;
    padding-bottom: 15px;
    text-transform: uppercase;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
.single_blog_dsc h3 a:hover { color: #E51A92 }
.single_blog_dsc p {
    margin-bottom: 10px;
}
.single_blog_dsc a {
    color: #E51A92;
    font-weight: 400;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
    text-transform: uppercase;
    font-size: 14px;
}
.single_blog_dsc a:hover { padding-left: 10px }
.view_more { margin-top: 50px }
.facebook { background: #5D82D1 }
.twitter { background: #40BFF5 }
.google { background: #EB5E4C }
.linkedin { background: #238CC8 }
.youtube { background: #CC181E }
.instagram { background: #A4785F }
/*
* ----------------------------------------------------------------------------------------
* 14. END BLOG DESIGN
* ----------------------------------------------------------------------------------------
*/


/*
* ----------------------------------------------------------------------------------------
* 15.START COMPANY PARTNER LOGO
* ----------------------------------------------------------------------------------------
*/
.partner-logo { background: #f7f7f7 }
.partner { text-align: center }
.partner img {
    padding: 10px;
}
/*
* ----------------------------------------------------------------------------------------
* 15.END COMPANY PARTNER LOGO
* ----------------------------------------------------------------------------------------
*/

/*
* ----------------------------------------------------------------------------------------
* 16.START CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/
.single-address { margin-bottom: 60px }
.mb-none { margin-bottom: 0px }
.single-address i {
background: #E51A92 none repeat scroll 0 0;
color: #fff;
font-size: 18px;
height: 50px;
line-height: 50px;
text-align: center;
width: 50px;
}
.single-address:hover i{background: #333 none repeat scroll 0 0;}
.single-address h2 {
font-size: 16px;
text-transform: uppercase;
-webkit-transition: all 0.2s ease 0s;
transition: all 0.2s ease 0s;
 }
.single-address:hover h2{color:#E51A92;}
.single-address p {
font-size: 14px;
line-height: 24px;
margin-bottom: 0;
}
.form-control {
    background: #f9f9f9 none repeat scroll 0 0;
    border: 1px solid #eee;
    border-radius: 2px;
    box-shadow: none;
    color: #333;
    height: 50px;
    -webkit-transition: all 0.3s ease 0s;
            transition: all 0.3s ease 0s;
}
.form-control:focus {
    border: 1px solid #E51A92;
    box-shadow: none;
    outline: 0 none;
}
.description textarea { height: 220px }
.form-group  button { border: none }
.btn-contact-bg {
    background: #E51A92 none repeat scroll 0 0;
    border-radius: 0 !important;
    box-shadow: 0 5px 8px rgba(0, 0, 0, 0.15);
    color: #fff;
    font-family: montserrat,sans-serif;
    font-size: 14px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease 0s;
            transition: all 0.3s ease 0s;
}
.btn-contact-bg:hover,
.btn-contact-bg:focus {
    background: #333;
    color: #fff;
}
#map { height: 400px }
/*
* ----------------------------------------------------------------------------------------
* 16.END CONTACT DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 17.START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/
.footer {
    background-color: #121315;
}
.footer-logo img{
margin-bottom: 20px;
width: 200px;
}
.footer-padding {
  padding: 30px 0 50px;
}
@media only screen and (max-width:480px) {
    .footer_social {
        float: none !important;
        margin-top: 30px;
    }
}
.footer_social ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
@media only screen and (max-width:480px) {
    .footer_social ul { text-align: center }
}
.footer_social ul li {
    margin: 2px;
    display: inline-block;
}
.footer_social ul li a {
    background: none;
    border-radius: 30px;
	border:1px solid #1f2428;
    color: #fff;
    display: block;
    font-size: 16px;
    height: 40px;
    line-height: 40px;
    padding: 0;
    text-align: center;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    width: 40px;
}
@media only screen and (max-width:768px) {
    .footer_social ul li a { font-size: 12px }
}
@media only screen and (max-width:360px) {
    .footer_social ul li a { font-size: 14px }
}
@media only screen and (max-width:320px) {
    .footer_social ul li a {
        font-size: 14px;
        height: 40px;
        width: 40px;
        line-height: 40px;
    }
}
.footer_social ul li a:hover { color: #fff }
.footer_facebook:hover { background: #5D82D1 }
.footer_twitter:hover { background: #40BFF5 }
.footer_google:hover { background: #EB5E4C }
.footer_linkedin:hover { background: #238CC8 }
.footer_youtube:hover { background: #CC181E }
.footer_skype:hover { background: #00AFF0 }
.footer_instagram:hover { background: #7c5641 }
.footer_copyright {
    color: #fff;
    margin: 0;
    padding-top: 10px;
    font-size: 14px;
}
.footer_copyright a {
	font-size: 10px;
    color: #fff;
}
.footer_copyright a:hover {
    color: #E51A92;
}


@media only screen and (max-width:480px) {
    .footer_copyright {
        float: none !important;
        text-align: center;
    }
}
/*
* ----------------------------------------------------------------------------------------
* 17.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/