/*
Author       : Theme_Ocean.
Template Name: Isabella - Digital Agency One Page Template
Version      : 1.0
*/
/*=============================================================
    CSS INDEX
    =============================
    01. GENERAL STYLE (body, link color, section-title, preloader btn, overlay, section-padding etc)
    02. BOOTSTRAP NAVIGATION OVERRIDES
    03. START HOME REV SLIDER DESIGN
    04. START SERVICE DESIGN
    05. START PROMOTION DESIGN
    06. START PORTFOLIO DESIGN
    07. START TESTIMONIAL DESIGN
    08. START TEAM DESIGN
    09. START COMPANY PARTNER LOGO
    10. START CONTACT FORM AND MAP
    11. START CONTACT ADDRESS
    12. START FOOTER DESIGN
  =============================================================*/
/*
* ----------------------------------------------------------------------------------------
* 01.GENERAL STYLE
* ----------------------------------------------------------------------------------------
*/
body {
font-family: 'Lato', sans-serif;
font-size: 16px;
font-weight: 300;
line-height: 24px;
color: #777;
overflow-x: hidden;
margin: auto;


  }
html,
body { }
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "Montserrat",sans-serif;
    color: #333;
    font-weight: 700;
}
a {
	font-family: "Montserrat",sans-serif;
    text-decoration: none;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}
a:hover {
    color: #fff;
    text-decoration: none;
}
a:focus {
    outline: none;
    text-decoration: none;
}
p {
    margin-bottom: 0;
}
ul,
li {
    margin: 0;
    padding: 0;
}
.boxedcontainer{max-width: 1170px; margin:auto; padding:0px 30px;}
.tp-banner-container{
	width:100%;
	position:relative;
	padding:0;
}

.tp-banner{
	width:100%;
	position:relative;
}

.tp-banner-fullscreen-container {
		width:100%;
		position:relative;
		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: 99999;
}

.status-mes {
    width: 80px;
    height: 80px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -40px 0 0 -40px;
    font-size: 10px;
    text-indent: -12345px;
    border-top: 5px solid rgba(0, 0, 0, 0.08);
    border-right: 5px solid rgba(0, 0, 0, 0.08);
    border-bottom: 5px solid rgba(0, 0, 0, 0.08);
    border-left: 5px solid #ff5f83;
    border-radius: 50%;
    -webkit-animation: spinner 700ms infinite linear;
    animation: spinner 700ms infinite linear;
    z-index: 10000;
}

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.no-padding { padding: 0 }
/*END PRELOADER DESIGN*/
/*START SCROLL TO TOP*/
.topcontrol {
background: #03a9f4 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: 22px;
height: 35px;
line-height: 33px;
opacity: 1;
position: fixed;
right: 5px;
text-align: center;
transition: all 0.2s ease 0s;
width: 35px;
}
.topcontrol:hover {
    background: #222;
    color: #fff;
}
/*END SCROLL TO TOP*/
.section-padding { padding: 110px;
    position: relative;
    background: #fff;
    z-index:13;
     }
/*START SECTION TITLE DESIGN*/
.section-title { margin-bottom: 60px }
.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 span {
    background: #03a9f4 none repeat scroll 0 0;
    display: block;
    height: 2px;
    margin: 15px auto;
    width: 70px;
    position: relative;
}
.section-title-white {
        color: #5ec2e6 !important;
    position: relative;
    font-weight: bold;
    font-size: 70px;

}
.section-title p {
margin: auto;
width: 60%;
}
@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:#000000bd;
    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: #03a9f4 !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: #171717 !important;
    background-color: transparent;
}
.navbar-brand { padding: 0px }
.navbar-brand img {
    width: 150px;
    margin-left: 10px;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form { border-color: #fff }
.menu-top li a {
color: #fff !important;
font-family: lato,sans-serif;
font-size: 14px;
letter-spacing: 2px;
text-transform: uppercase;
font-weight: 600;
border-radius:50px;
}
.menu-top li a:hover { color: #03a9f4!important }
@media only screen and (max-width:768px) { 
    .navbar-default .navbar-nav > li > a {
        margin-top: 10px;
        padding: 8px;
    }
}
@media only screen and (max-width:480px) { 
    .menu-top { background-color: #fff }
    .navbar-default .navbar-nav > li > a { color: #313131  !important }
}
.navbar-default.menu-shrink {
background:#fff;
padding: 18px 0;
width: 100%;
 margin-top:0px
}
@media only screen and (max-width:480px) { 
    .menu-top {
        color: #fff !important;
        margin-left: 0px;
    }
}
.navbar-default.menu-shrink li a {color: #333 !important; }
.navbar-default.menu-shrink li a:hover { color: #03a9f4 !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: #03a9f4 }
/*
* ----------------------------------------------------------------------------------------
* 02.END BOOTSTRAP NAVIGATION OVERRIDES
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 03.START HOME REV SLIDER DESIGN
* ----------------------------------------------------------------------------------------
*/
@media only screen and (max-width:480px) { 
#home{margin-top:100px}
}
.home_bg {
    position: relative;
}
.home_bg:before {
    /*background: rgba(0, 0, 0, 0.6);*/
    content: "";
    height: 100%;
    filter: alpha(opacity=80);
    position: absolute;
    width: 100%;
}

.boxedcontainer		{max-width: 1170px; margin:auto; padding:0px 30px;}
.tp-banner-container{
	width:100%;
	position:relative;
	padding:0;

}
.tp-banner{
	width:100%;
	position:relative;
}
.tp-banner-fullscreen-container {
		width:100%;
		position:relative;
		padding:0;
}

/*START HTML5 VIDEO*/
.html-video {
    top: 0%;
    left: 0%;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.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*/
.btn-home-bg {
    background: #03a9f4 none repeat scroll 0 0;
    border: 2px solid #03a9f4;
    border-radius: 0;
    color: #fff;
    font-family: montserrat,sans-serif;
    font-size: 12px;
    padding: 12px 30px;
    text-transform: uppercase;
    transition: all 0.2s ease 0s;
}
.btn-home-bg:hover,
.btn-home-bg:focus {
    background: #fff;
    color: #333;
    border: 2px solid #fff;
}
/*
* ----------------------------------------------------------------------------------------
* 03.END HOME REV SLIDER DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
 * ----------------------------------------------------------------------------------------
 * 04.START SERVICE DESIGN
 * ----------------------------------------------------------------------------------------
 */
.service-content{
padding-bottom: 30px;
padding-top: 60px;
background: #f7f7f7;
}
.single_service{
background: #fff none repeat scroll 0 0;
padding: 60px 30px;
position:relative;
margin-bottom:30px;
border:1px solid #eee;
z-index:2;
transition: all 0.3s ease 0s;
}
@media only screen and (max-width:768px) { 
.single_service{padding: 60px 28px;}
}
.single_service:hover{
box-shadow:0px 40px 40px rgba(0,0,0,0.1);
position:relative;
z-index:100;
transform: translate(0, -10px);
}
.single_service:hover i{
background: #03a9f4 none repeat scroll 0 0;
border: 1px solid #03a9f4;
color: #fff;
}
.single_service i{
border: 1px solid #eee;
border-radius: 100px;
color: #03a9f4;
font-size: 30px;
height: 80px;
line-height: 80px;
margin-bottom: 15px;
text-align: center;
transition: all 0.3s ease 0s;
width: 80px;
}
.single_service h4{
font-size: 16px;
font-weight: 500;
margin-top: 0;
text-transform: uppercase;
}
/*
 * ----------------------------------------------------------------------------------------
 * 04.END SERVICE DESIGN
 * ----------------------------------------------------------------------------------------
 */
/*
* ----------------------------------------------------------------------------------------
* 05.START PROMOTION DESIGN
* ----------------------------------------------------------------------------------------
*/
.buy_now {
    background: #060606 none repeat scroll 0 0;
    padding: 25px 0;
    z-index:13;
    position: relative;
}
.buy_now_title {
    color: #fff;
    font-family: montserrat,sans-serif;
    font-weight: 300;
    margin: 0;
    text-transform: uppercase;
}
@media only screen and (max-width:768px) { 
    .buy_now_title { font-size: 22px }
}
@media only screen and (max-width:360px) { 
    .buy_now_title { font-size: 15px }
}
.btn-promotion-bg {
    background: #0288d1 none repeat scroll 0 0;
    border: 1px solid #0288d1;
    border-radius: 2px;
    box-shadow: 0 11px 11px 0 rgba(0, 0, 0, 0.06);
    color: #fff;
    font-size: 14px;
    margin-left: 100px;
    padding: 10px 30px;
    transition: all 0.2s ease 0s;
}
@media only screen and (max-width:480px) { 
    .btn-promotion-bg {
        margin-left: 0px;
        margin-top: 20px;
    }
}
@media only screen and (max-width:414px) { 
    .btn-promotion-bg {
        margin-left: 10px;
        margin-top: 10px;
    }
}
.btn-promotion-bg:hover,
.btn-promotion-bg:focus {
    background: #fff;
    border: 1px solid #fff;
    color: #333;
}
/*
* ----------------------------------------------------------------------------------------
* 05.END PROMOTION DESIGN
* ----------------------------------------------------------------------------------------
*/
/*
 * ----------------------------------------------------------------------------------------
 * 06.START PORTFOLIO DESIGN
 * ----------------------------------------------------------------------------------------
 */
.grid figure {
    position: relative;
    overflow: hidden;
    text-align: center;
    cursor: pointer;
}
.grid figure img {
    position: relative;
    display: block;
    width: 100%;
}
.grid figure figcaption {
    padding: 20px;
    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;
    filter: alpha(opacity=0);
}
.grid figure h4 {
    word-spacing: -0.15em;
    font-weight: 300;
}
.grid figure h4,
.grid figure p { margin: 0 }
.grid figure p {
    font-size: 16px;
    letter-spacing: 1px;
}
.grid figure p a { color: #fff }
figure.effect-sadie figcaption:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-linear-gradient(top, rgba(3, 169, 244, 0) 0%, rgba(3, 169, 244, 0.8) 75%);
    background: -webkit-linear-gradient(top, rgba(3, 169, 244, 0) 0%, rgba(3, 169, 244, 0.9) 75%);
    background: linear-gradient(to bottom, rgba(3, 169, 244, 0) 0%, rgba(3, 169, 244, 0.9) 75%);
    content: '';
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translate3d(0,50%,0);
    transform: translate3d(0,50%,0);
}
figure.effect-sadie h4 {
    background: #fff none repeat scroll 0 0;
    color: #222;
    font-size: 18px;
    left: 20%;
    letter-spacing: 1px;
    padding: 15px 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translate3d(0px, -50%, 0px);
    transform: translate3d(0px, -50%, 0px);
    -webkit-transition: -webkit-transform 0.35s ease 0s, color 0.35s ease 0s;
    transition: transform 0.35s ease 0s, color 0.35s ease 0s;
    width: 60%;
    opacity: 0;
    filter: alpha(opacity=0);
}
@media only screen and (max-width:768px) { 
    figure.effect-sadie h4 { font-size: 12px }
}
@media only screen and (max-width:480px) { 
    figure.effect-sadie h4 { font-size: 18px }
}
@media only screen and (max-width:320px) { 
    figure.effect-sadie h4 { font-size: 14px }
}
figure.effect-sadie figcaption:before,
figure.effect-sadie p {
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
}
figure.effect-sadie p {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 2em;
    width: 100%;
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: translate3d(0,10px,0);
    transform: translate3d(0,10px,0);
}
figure.effect-sadie:hover h4 {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate3d(0,-50%,0) translate3d(0,-40px,0);
    transform: translate3d(0,-50%,0) translate3d(0,-40px,0);
}
figure.effect-sadie:hover figcaption:before,
figure.effect-sadie:hover p {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
/*project modal*/
.modal-title {
    color: #333;
    margin: 0;
    text-transform: uppercase;
}
.modal-content {
    padding: 10px 30px;
    border-radius: 0px;
}
.modal-body { margin-bottom: 15px }
.modal-body p { margin: 15px 0 0 }
.project-list { margin-top: 30px }
.project-list label {
	color: #333;
	margin-bottom: 0;
	margin-right: 0;
	width: 120px;
}
.project-list li {
    padding: 7px 0;
    font-size: 14px;
}
.project-list li a {
    color: #333;
    margin-bottom: 0;
    margin-right: 7px;
    width: 125px;
}
.project-list li a:hover { color: #03a9f4 }
/*End project modal*/
.portfolio_btn { padding-top: 60px }
.btn-pricing-bg {
    background: #03a9f4 none repeat scroll 0 0;
    border: 2px solid #03a9f4;
    border-radius: 3px;
    box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.1);
    color: #fff;
    font-family: montserrat,sans-serif;
    font-size: 12px;
    padding: 8px 20px;
    text-transform: uppercase;
    -webkit-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}
.btn-pricing-bg:hover,
.btn-pricing-bg:focus {
    background: #333;
    color: #fff;
    border: 2px solid #333;
}
/*
 * ----------------------------------------------------------------------------------------
 * 06.END PORTFOLIO DESIGN
 * ----------------------------------------------------------------------------------------
 */
/*
 * ----------------------------------------------------------------------------------------
 * 07.START TESTIMONIAL DESIGN
 * ----------------------------------------------------------------------------------------
 */
.client-testimonial { position: relative }
.client-testimonial:before {
background: rgba(0,0,0,0.6);
content: "";
height: 100%;
left: 0;
opacity: 0.8;
position: absolute;
top: 0;
width: 100%;
}
.single_testimonial img {
	border: 4px solid #03a9f4;
	border-radius: 50px;
	height: 100px;
	margin-bottom: 10px;
	margin-right: 10px;
	width: 100px;
}
.single_testimonial h3 {
    color: #fff;
    font-size: 18px;
    margin-bottom: 12px;
    margin-top: 10px;
    text-transform: uppercase;
}
.single_testimonial p {
color: #fff;
font-size: 20px;
line-height: 28px;
}
.single_testimonial i { color: #ffc107 }

/*
 * ----------------------------------------------------------------------------------------
 * 07.END TESTIMONIAL DESIGN
 * ----------------------------------------------------------------------------------------
 */
/*
 * ----------------------------------------------------------------------------------------
 * 08.START TEAM DESIGN
 * ----------------------------------------------------------------------------------------
 */
 .our_team {
  background: #f7f7f7 none repeat scroll 0 0;
      z-index: 13;
    position: relative;
}
.single_team {
border: 1px solid #eee;
padding: 10px;
transition: all 0.2s ease 0s;
background: #fff;
border-radius: 10px;
}
@media only screen and (max-width:768px) { 
    .single_team {
        margin-bottom: 30px;
    }
}
.single_team:hover{box-shadow:0px 30px 30px rgba(0,0,0,0.2)}
.single_team h4{
text-transform: uppercase;
margin-bottom: 3px;
}
.team_social {margin-top:10px;}
.team_social ul {list-style: outside none none;
text-align: center; }
.team_social ul li { display: inline-block; }
.team_social ul li a i{
border-radius: 30px;
color: #fff;
display: block;
font-size: 16px;
height: 40px;
line-height: 40px;
margin: 2px;
text-align: center;
transition: all 0.2s ease 0s;
width: 40px;
}
@media only screen and (max-width:768px) { 
    .team_social ul li a i{ font-size: 12px }
}
@media only screen and (max-width:360px) { 
    .team_social ul li a i{ font-size: 14px }
}
.t_facebook {
    background: #5D82D1;
	box-shadow: 0 0 0 0px #5D82D1;
    border: 1px solid #5D82D1;
}
.t_twitter {
    background: #40BFF5;
    box-shadow: 0 0 0 0px #40BFF5;
    border: 1px solid #40BFF5;
}
.t_gplus {
    background: #EB5E4C;
    box-shadow: 0 0 0 0px #EB5E4C;
    border: 1px solid #EB5E4C;
}
.t_linkedin {
    background: #238CC8;
    box-shadow: 0 0 0 0px #238CC8;
    border: 1px solid #238CC8;
}
/*
 * ----------------------------------------------------------------------------------------
 * 08.END TEAM DESIGN
 * ----------------------------------------------------------------------------------------
 */
/*
* ----------------------------------------------------------------------------------------
* 09.START COMPANY PARTNER LOGO
* ----------------------------------------------------------------------------------------
*/
.partner { text-align: center }
.partner img {
    border: 1px solid #eee;
    padding: 40px;
}
.partner img:hover { border: 1px solid #03a9f4 }
@media only screen and (max-width:480px) { 
    .partner img { padding: 0px }
}
/*
* ----------------------------------------------------------------------------------------
* 09.END COMPANY PARTNER LOGO
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 10.START CONTACT FORM AND MAP
* ----------------------------------------------------------------------------------------
*/
.contact {
    padding-left: 50px;
    padding-right: 60px;
    padding-top: 30px;
}
@media only screen and (max-width:768px) { 
    .contact { padding: 60px 60px 60px 50px }
}
.contact input {
    background: #f9f9f9 none repeat scroll 0 0;
    border: 1px solid #01bbff;
    border-radius: 4px;
    box-shadow: none;
    font-family: montserrat,sans-serif;
    height: 52px;
    padding: 10px;
}
.contact textarea {
    background: #f9f9f9 none repeat scroll 0 0;
    border: 1px solid #01bbff;
    border-radius: 4px;
    box-shadow: none;
    font-family: montserrat,sans-serif;
    padding: 10px;
	height:200px;
}
.contact input:hover,
.contact input:focus {
    border: 1px solid #006fff;
    box-shadow: none;
    outline: 0 none;
}
.contact textarea:hover,
.contact textarea:focus {
    border: 1px solid #006fff;
    box-shadow: none;
    outline: 0 none;
}
.btn-contact-bg {
background: #03a9f4 none repeat scroll 0 0 !important;
border: 2px solid #03a9f4 !important;
border-radius: 3px;
box-shadow: none;
color: #fff;
font-size: 12px;
text-transform: uppercase;
transition: all 0.2s ease 0s;
padding: 10px 20px!important;
}
.btn-contact-bg:hover,
.btn-contact-bg:focus {
    background: #333!important;
    color: #fff;
    border: 2px solid #333!important;
}
/*
* ----------------------------------------------------------------------------------------
* 10.END CONTACT FORM AND MAP
* ----------------------------------------------------------------------------------------
*/
/*
* ----------------------------------------------------------------------------------------
* 11.START CONTACT ADDRESS
* ----------------------------------------------------------------------------------------
*/
.contact-address {
    background: #f7f7f7;
    padding: 60px 0;
}
.single_address {
background: #434343  none repeat scroll 0 0;
border: 1px solid #eee;
border-radius: 5px;
transition: 0.2s;
padding: 40px 20px;
color:#ffffff;
}
.single_address:hover{
box-shadow:0px 40px 40px rgba(0,0,0,0.1);
}
@media only screen and (max-width:768px) { 
    .single_address { margin-bottom: 30px }
}
.single_address i {
color: #fff;
font-size: 20px;
margin-bottom: 20px;
background: #03a9f4;
width: 50px;
height: 50px;
line-height: 50px;
border-radius: 30px;
}
@media only screen and (max-width:768px) { 
    .single_address p { font-size: 15px }
}
@media only screen and (max-width:480px) { 
    .single_address p { font-size: 14px }
}
/*
* ----------------------------------------------------------------------------------------
* 11.END CONTACT ADDRESS
* ----------------------------------------------------------------------------------------
*/
#map { height: 400px }

/*
* ----------------------------------------------------------------------------------------
* 12.START FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/



.footer { background: #25252a;
    z-index: 13;
    position: relative;
    padding: 50px 0px 0px 0px;
   /* margin-top:50px;*/
}
.footer_logo img {
    margin-bottom: 30px;
    width: 150px;
    text-align:justify;
}
.footer_logo p,.footer-links li,.footer-links li a{
color: #fff;
padding-top:10px;
 list-style-type:none;
 font-weight:400;
}
.footer-links li a:hover{
color: #5ec2e6;
}
.footer-links h4{
    color:#fff;
    padding-bottom:30px;
}
/*START FOOTER SOCIAL DESIGN*/
.footer_social { margin-bottom: 10px }
.footer_social ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.footer_social ul li { display: inline-block }
.footer_social ul li a {
    border-radius: 4px;
    color: #fff;
    display: block;
    font-size: 14px;
    height: 40px;
    line-height: 20px;
    margin: 2px;
    padding: 9px 12px;
    -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 }
}
.footer_social ul li a:hover { color: #fff }
.f_facebook {
    background: #5D82D1;
    border: 1px solid #5D82D1;
}
.f_twitter {
    background: #40BFF5;
    box-shadow: 0 0 0 0px #40BFF5;
    border: 1px solid #40BFF5;
}
.f_google {
    background: #EB5E4C;
    box-shadow: 0 0 0 0px #EB5E4C;
    border: 1px solid #EB5E4C;
}
.f_linkedin {
    background: #238CC8;
    box-shadow: 0 0 0 0px #238CC8;
    border: 1px solid #238CC8;
}
.f_youtube {
    background: #CC181E;
    box-shadow: 0 0 0 0px #CC181E;
    border: 1px solid #CC181E;
}
.f_skype {
    background: #00AFF0;
    box-shadow: 0 0 0 0px #00AFF0;
    border: 1px solid #00AFF0;
}
/*END FOOTER SOCIAL DESIGN*/
.copyright p {
color: #eee;
margin-bottom: 0;
padding: 30px 0;
}
.copyright a {
color: #03a9f4;
transition: all 0.2s ease 0s;
font-family: lato,sans-serif;
}
.copyright a:hover { color: #fff }
/*
* ----------------------------------------------------------------------------------------
* 12.END FOOTER DESIGN
* ----------------------------------------------------------------------------------------
*/

  ul.nav-pills {
      top: 100px;
      position: fixed;
      background-color:#ec3237;
      border-radius:8px;
      z-index:7;
  }
  #section1{
      height: 350px;
      font-size: 18px;
      padding-top:90px;
  }
  #section2{
      height: 360px;
      font-size: 18px;
      padding-top:120px;
  }  #section3{
      height: 350px;
      font-size: 18px;
       padding-top:180px;
  }  #section4{
      height: 350px;
      font-size: 18px;
       padding-top:190px;
  }  #section5{
      height: 550px;
      font-size: 18px;
       padding-top:200px;
  }

  .nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {
    color: #fff;
    background-color:#006fff  !important;
    border-radius:0px;
}
.nav-pills>li>a{
    color:#fff !important;
}

#myScrollspy h1{
    color:red;
    font-weight:bold;
    font-size:45px;
    top:400px;
    left:150px;
    position:fixed;
}
hr{
border:2px solid blue;
margin-top:0px;
width:25%;
float:left;
border-radius:5px;
}
  @media screen and (max-width: 810px) {
    #section1, #section2, #section3, #section41, #section42  {
        margin-left: 0px;
    }
  }


.figerd .fa-fighter-jet,.figerd .fa-server,.figerd .fa-desktop,.figerd .fa-hdd-o,.figerd .fa-sitemap{

 background-color:#006fff;
 color:#fff;
 top:-50px;
 left:170px;
 position: absolute;
 border-radius:50%;
 padding:20px;
}       

/*About  us*/

.about{
    padding-top:40px;
}
.Aboutus .abo{
    font-family: 'Nunito', sans-serif;
    color:#585858;
    font-size:17px;
    text-align:justify;
    padding:20px;
}
.Aboutus img{
    padding:30px 0px 0px 0px;
}
.herd{
    font-size:40px;
    font-weight:600;
    color:#000;
padding:40px 0px;
}

.page-heder img{
    padding:92px 0px 0px 0px;
}


/*plans */


                    .price-btn {
  font-size: 19px;
  line-height: 21px;
  color: #fff;
  font-weight: 500;
  border-radius: 4px;
  display: inline-block;
  vertical-align: middle;
  padding: 18px 35px 15px;
  background: #00d2c4;
  transition: all 0.25s linear;
}

.price-btn .fa {
  font-size: 21px;
  line-height: 23px;
  margin: 0 15px 0 0;
}

.price-btn:hover {
  background: #1c1c1c;
  color: #fff;
}









.price-list4 {
  /*font-size: 14px;*/
  line-height: 16px;
  font-weight: 600;
  margin: 0;
  padding: 1px 22px 25px;
  background: #f7f8fa;
  transition: all 0.25s linear;
}

.price-list4.active, .price-list4:hover {
  color: #fff;
  background: #0b7f77;
}

.price-list4.active .heading, .price-list4:hover .heading {
  color: #fff;
}

.price-list4.active .heading .txt, .price-list4:hover .heading .txt {
  color: #fff;
}

.price-list4.active li, .price-list4:hover li {
  border-top-color: rgba(255, 255, 255, 0.3);
}

.price-list4.active .price, .price-list4:hover .price {
  border: 10px solid #00d2c4;
  background: #fff;
  padding: 48px 13px 22px;
}

.price-list4.active .price .txt,
.price-list4.active .price .txt2, .price-list4:hover .price .txt,
.price-list4:hover .price .txt2 {
  color: #00d2c4;
}

.price-list4.active .price-btn, .price-list4:hover .price-btn {
  border-width: 1px;
  border-style: solid;
  border-color: #fff;
  color: #fff;
}

.price-list4.active .price-btn:hover, .price-list4:hover .price-btn:hover {
  color: #fff;
  background: #1c1c1c;
}

.price-list4.price2.active .price, .price-list4.price2:hover .price {
  border-width: 10px;
  border-style: solid;
  background: #fff;
  padding: 38px 13px 22px;
}

.price-list4.price2.active .price-btn, .price-list4.price2:hover .price-btn {
  color: #00d2c4;
  background: #fff;
}

.price-list4.price2.active .price-btn:hover, .price-list4.price2:hover .price-btn:hover {
  background: #1c1c1c;
  color: #fff;
}

.price-list4.price2 .heading {
  font-size: 24px;
  line-height: 26px;
  padding: 27px 27px 29px;
}

.price-list4.price2 .price {
  font-size: 23px;
  line-height: 23px;
  width: 130px;
  height: 130px;
  padding: 47px 23px 22px;
  margin: -61px auto 5px;
}

.price-list4.price2 .price .txt sup {
  margin: 0 -8px 0 0;
}

.price-list4.price2 .price .txt2 {
  font-size: 10px;
  line-height: 12px;
}

.price-list4.price2 li {
  padding: 15px;
}

.price-list4.price2 .btns {
  padding: 33px 0 0;
}

.price-list4.price2 .price-btn {
  font-size: 14px;
  line-height: 16px;
  padding: 12px 24px 11px;
}

.price-list4.price2 .price-btn:hover {
  color: #fff;
}

.price-list4 li {
  padding: 14px;
  overflow: hidden;
  border-top: 1px solid #e5e7ea;
  transition: all 0.25s linear;
}

.price-list4 li:first-child {
  border-top: none;
}

.price-list4 li .fa-check {
  font-size: 21px;
  line-height: 23px;
  margin: 0 16px 0 0;
}

.price-list4 .heading {
  font-size: 30px;
  line-height: 32px;
  color: #00d2c4;
  font-weight: 800;
  padding: 27px 27px 29px;
  margin: 0 -22px;
  transition: all 0.25s linear;
}

.price-list4 .heading .txt {
  font-size: 11px;
  line-height: 13px;
  font-weight: 300;
  color: #2f3542;
  display: block;
  padding: 4px 0 0;
  font-style: italic;
  transition: all 0.25s linear;
}

.price-list4 .border {
  border: none;
}

.price-list4 .price {
  font-size: 44px;
  line-height: 31px;
  font-weight: 700;
  color: #fff;
  padding: 56px 23px 22px;
  width: 159px;
  height: 159px;
  border-radius: 100%;
  margin: -78px auto 15px;
  position: relative;
  background: #00d2c4;
  transition: all 0.25s linear;
}

.price-list4 .price .txt {
  display: inline-block;
  vertical-align: bottom;
}

.price-list4 .price .txt sup {
  font-size: 24px;
  font-weight: 400;
  top: 0;
  margin: 0 -13px 0 0;
}

.price-list4 .price .txt2 {
  font-size: 12px;
  line-height: 14px;
  font-weight: 300;
  margin: 0 0 2px -6px;
  display: inline-block;
  vertical-align: bottom;
  transition: all 0.25s linear;
}

.price-list4 .btns {
  padding: 33px 0 0;
}

.price-list4 .price-btn {
  color: #00d2c4;
  border: 1px solid #00d2c4;
  background: none;
}

.price-list4 .price-btn:hover {
  color: #fff;
  border-color: #1c1c1c;
  background: #1c1c1c;
}

.middle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index:14;
    color:#fff;
    font-size:60px;
    font-weight:600px;
}


/*loader*/

#loader-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  overflow: hidden;
}
.no-js #loader-wrapper {
  display: none;
}

#loader {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #16a085;
  -webkit-animation: spin 1.7s linear infinite;
          animation: spin 1.7s linear infinite;
  z-index: 19;
}
#loader:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #e74c3c;
  -webkit-animation: spin-reverse .6s linear infinite;
          animation: spin-reverse .6s linear infinite;
}
#loader:after {
  content: "";
  position: absolute;
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #f9c922;
  -webkit-animation: spin 1s linear infinite;
          animation: spin 1s linear infinite;
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-webkit-keyframes spin-reverse {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
  }
}
@keyframes spin-reverse {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}
#loader-wrapper .loader-section {
  position: fixed;
  top: 0;
  width: 51%;
  height: 100%;
  background: #222;
  z-index: 10;
}

#loader-wrapper .loader-section.section-left {
  left: 0;
}

#loader-wrapper .loader-section.section-right {
  right: 0;
}

/* Loaded styles */
.loaded #loader-wrapper .loader-section.section-left {
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.loaded #loader-wrapper .loader-section.section-right {
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
  -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.loaded #loader {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}

.loaded #loader-wrapper {
  visibility: hidden;
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
  -webkit-transition: all 0.3s 1s ease-out;
  transition: all 0.3s 1s ease-out;
}

.reddddddd {
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    color: #0288d1;
    padding-top: 12px;
    padding-left: 50px;
    padding-right: 0px;
    margin-right: -43px;
}