/*!
 * Start Bootstrap - Grayscale Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

body {
    width: 100%;
    height: 100%;
    font-family: 'Didact Gothic', sans-serif;
    color:#000000;
	font-size:14px;
    background-color:#FFFFFF;
}

html {
    width: 100%;
    height: 100%;
}


h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Didact Gothic', sans-serif;
}

#h1cont-fon
{
	font-family: 'Roboto Condensed', sans-serif;
	font-size:30pt;
	font-weight:bold;
	color:#FFFFFF;
	text-align:center;
}


#h4cont-fon-small
{
	font-size:12pt;
	font-weight:normal;
	color:#FFFFFF;
	text-align:center;
}

#h5cont-fon-small
{
	font-size:11pt;
	font-weight:normal;
	color:#FFFFFF;
}

.terms
{
	font-size:11pt;
	font-weight:normal;
	color:#666666;
}

p {
    margin: 15px 0 35px;
    font-size: 16px;
    line-height: 1.3;
	color:#a0a0a0;
}
ul li { 
	font-size:16px; 
	color:#464646; 
	line-height:1.3;
}
.space
{
padding-top:15px;
padding-bottom:15px;
border:0px;
outline:none;
}

.space_top
{
padding-top:3px;
padding-bottom:3px;
background-color:#FFFFFF;
border:0px;
outline:none;
}


	#section1 {color:#000000; padding-top:160px; border-bottom: 1px solid #D1D1D1; }
	#section2 {color: #000000; padding-top:160px; border-bottom: 1px solid #D1D1D1;}
	#section3 {color: #000000;  padding-top:160px; border-bottom: 1px solid #D1D1D1;}
	#section41 {color: #000000; padding-top:160px; border-bottom: 1px solid #D1D1D1;}
	#section42 {color: #000000;  padding-top:160px; border-bottom: 1px solid #D1D1D1;}
	
	
	

/* Three Coloum */


.list-pennant {
	position: relative;
	z-index: 989;
	margin-top: -75px;
	margin-right: 30px;
	margin-left: 30px;
}

.list-pennant:after {
	display: table;
	clear: both;
	content: '';
}

.list-pennant__item {
	position: relative;
	padding-right: 25px;
	padding-bottom: 20px;
	padding-left: 25px;
	padding-top:15px;
	float: left;
	width: 25%;
	height:250px;
	text-align: center;
	display:block;
}

.list-pennant__item:nth-child(1) {
	color: #fff;
	background-color: #f06d1b;
}

.list-pennant__item:nth-child(1):after {
	border-top-color: #f06d1b;
}

.list-pennant__item:nth-child(2) {
	color: #fff;
	background-color: #3d3d3d;
}

.list-pennant__item:nth-child(2):after {
	border-top-color: #3d3d3d;
}

.list-pennant__item:nth-child(3) {
	color: #fff;
	background-color: #f06d1b;
}

.list-pennant__item:nth-child(3):after {
	border-top-color: #f06d1b;
}
.list-pennant__item:nth-child(4) {
	color: #fff;
	background-color: #3d3d3d;
}

.list-pennant__item:nth-child(4):after {
	border-top-color: #3d3d3d;
}

.list-pennant__item:after {
	position: absolute;
	z-index: 1000;
	bottom: -48px;
	left: 0;
	display: block;
	width: 100%;
	content: '';
	border-top: 25px solid;
	border-right: 8em solid transparent;
	border-bottom: 25px solid transparent;
	border-left: 8em solid transparent;
}

.list-pennant__title {
	margin-bottom: 15px;
	font-size: 15px;
	font-weight:bold;
	margin-top:7px;
}


.registor-button
{
z-index:999;
padding-left:68px;
text-align:center;
margin-top:24px;
}

.login-overall
{
padding:20px;
}

.why_background
{
background-color:#f8f8f8;
}

.errorform 
{
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
    padding: 8px;
    list-style-type: none;
}
/* ======= HEADER ======= */

.header_top {
	font-weight: 400;
	color: #999;
	background-image:url(images/top_line_bg.jpg);
	background-repeat:no-repeat;
	border-bottom:1px solid #F3F3F3;
}
.headerline
{
border-left:1px solid #F3F3F3;
border-right:1px solid #F3F3F3;
margin-top:6px;
padding:2px;
text-align:center;
color:#999999;
}


/* 768 x 1024 (Laptop) */

@media (min-width:992px) and (max-width:1199px) {
	

	.list-pennant__item:after {
		border-right-width: 106px;
		border-left-width: 106px;
	}
}

@media (max-width:991px) {

.list-pennant__item:after {
		border-left-width: 81px;
		border-right-width: 81px;
		padding-top:1px;
	}

}



@media (max-width:767px) {
	.list-pennant__item {
		float: none;
		width: 270px;
		margin: auto;
		padding-left: 15px;
		padding-right: 15px;
	}
	
	list-pennant {
		margin-top: 0;
	}
	.list-pennant {
		margin-right: 0;
		margin-left: 0;
		padding-top:63px;
	}
	.list-pennant__item:after {
		border-left-width: 135px;
		border-right-width: 135px;
	}
	}
	
	
	
/*  Banner Design */

.txt-banner-hedding
	{
		background-color:#ee6b19;
		padding:6px 20px 6px 20px;
		width:auto !important;
		float:left;
	}
.txt-banner-caption
	{
		background-color:#3e3c3d;
		color:#FFFFFF;
		padding:11px 17px 11px 17px;
		width:auto !important;
		float:left;
	}
	

/* CSS used here will be applied after bootstrap.css */
.carousel {
    margin-top: 10px;
	margin-bottom:-3px;
}
.item .thumb {
	width: 33%;
/*	padding: 59px;*/
	cursor: default;
	float: left;
}
.item .thumb img {
	width: 50%;
	margin: 2px;
}
.item img {
	width: 100%;	
}


.text_h1_black
{
	color:#000000;
	font-size:34px;
	font-weight:bold;
}
.text_h1_white
{
	color:#FFFFFF;
}
.text_h1_orange
{
	color:#ff9900;
	font-size:30px;
	font-weight:bold;
}
.text_h1_orange_title
{
	color:#f06b18;
	font-size:48px;
	font-weight:bold;
	font-family: 'Roboto Condensed', sans-serif;
}
.text_p_grey
{
	color:#999999;
	font-size:16px;
	font-weight:normal;
}

.auto_content_height
{
width:100%; float:left; overflow:auto; overflow-x:hidden; height:300px;
}

.auto_content_height1
{
width:100%; float:left; overflow:auto; overflow-x:hidden; height:720px;

}
.demo-attention {
	background-color: #D35400;
	color: #fff;
	padding: 10px;
	width: 400px;
	margin: 0 auto;
	text-align: center;
	margin-bottom: 25px;
	border-radius: 3px;
}
.demo-iframe {
	background-color: #fff;
	padding: 10px 25px;
}
.demo-wrapper {
	width: 600px;
	margin: 0 auto;
}
.demo-wrapper iframe {
	border: 1px solid #ccc;
	width: 100%;
	background-color: #fff;
	height: 400px;
}
.demo-wrapper iframe::-webkit-scrollbar {
    width: 12px;
}
.demo-wrapper iframe::-webkit-scrollbar-track {
    background-color: #eaeaea;
    border-left: 1px solid #ccc;
}
.demo-wrapper iframe::-webkit-scrollbar-thumb {
    background-color: #ccc;
}
.demo-wrapper iframe::-webkit-scrollbar-thumb:hover {
	background-color: #aaa;
}

.sub_tit
{
color:#FFFFFF;
}

.orange-text
{
color:#f16c19;
}

.black-text
{
color:#000000;
}
.white-text
{
color:#FFFFFF;

}

#white-text a:hover
{
color:#FFFFFF;

}


.tit_sub1 {
        font-size: 11pt;
		color:#AEABAB;
		height:90px;
		
}
.tit_sub2 {
		color:#FFFFFF;
		
}
.client_txt
{
padding-top:45px;
height:110px;
}


.hideme
{
    opacity:0;
}


.title_padding
{
padding-top:100px;
}
	
.text-oranger
{
color:#f16c19;
}
.bg-oranger {
    background-color: #3366cc;
    color: #FFFFFF;
    padding-top: 15px;
    vertical-align: bottom;
}
.readmore {
        font-size: 12pt;
		color:#f27a30;
		padding-top:15px;
    }
.readmore a::hover {
        font-size: 12pt;
		color:#AEABAB;
    }
	
<!-- Social Media -->

.share-block {
	float: right;
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	text-align:center;
	width:235px;
}

.share-block .icon {
	display: inline-block;
	width: 21px;
	height: 21px;
	background-image:url(images/share_icons.png);
	background-repeat: no-repeat;
	margin-left: 10px;
	background-size: cover;
	vertical-align: middle;
}

.share-block .icon.fb {
	background-position: 0 0;
}

.share-block .icon.twitter {
	background-position: -29px; 0;
}

.share-block .icon.linkedin {
	background-position: -58px 0;
}

.share-block .icon.google {
	background-position: -85px 0;
}




<!-- Arro big bg  -->

.sec-cont_map {
	margin-top: 150px;
	padding-top: 40px;
}
.sec-cont_con
{
padding-bottom:70px;
background-color:#444142;
}

.arrow-top {
	position: relative;
}

.arrow-top:after {
	position: absolute;
	z-index: 700;
	display: block;
	
	content: '';
	border-right: 48vw solid transparent;
	border-left: 48vw solid transparent;
}

.arrow-top-top:after {
	top: -100px;
	border-top: 50px solid transparent;
	border-bottom: 50px solid #444142;
}

.arrow-top-top_mod-b:after {
	top: -80px;
	border-top-width: 39px;
	border-bottom-width: 39px;
}

.arrow-top-btm:after {
	top: 0;
	border-top: 50px solid #26c9ff;
	border-bottom: 50px solid transparent;
}

.arrow-top_mod-c:after {
	border-bottom-color: #444142;
}


<!-- Arro big bg bottom -->

.sec1-cont1_map1 {
	margin-bottom: 150px;
	padding-bottom: 40px;
}
.sec1-cont1_con1
{
padding-bottom:70px;
background-color:#FFFFFF;
}

.arrow1-top1 {
	position: relative;
}

.arrow1-top1:after {
	position: absolute;
	z-index: 700;
	display: block;
	
	content: '';
	border-right: 48vw solid transparent;
	border-left: 48vw solid transparent;
}

.arrow1-top1-top1:after {
	top: 204px;
	border-bottom: 48px solid transparent;
	border-top: 48px solid #FFFFFF;
}

.arrow1-top1-top1_mod-b1:after {
	top: 204px;
	border-bottom-width: 39px;
	border-top-width: 39px;
}

.arrow1-top1-btm1:after {
	bottom: 0;
	border-bottom: 48px solid #26c9ff;
	border-top: 48px solid transparent;
}

.arrow1-top1_mod-c1:after {
	border-top-color: #FFFFFF;
}
  
 
  

@media(min-width:768px) {
    p {
        margin: 15px 0 35px;
        font-size: 12pt;
        line-height: 1.6;
		color:#464646;
    }
	.tit_sub {
        margin: 0 0 35px;
        font-size: 14pt;   
		color:#464646;
    }
	
	}

a {
    color:#2C2424;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

a:hover,
a:focus {
    text-decoration: none;
    color:#f06b18;
}

.light {
    font-weight: 400;
}

.navbar-custom {
    margin-bottom: 0;
    border-bottom: 1px solid rgba(255,255,255,.3);
   /* text-transform:capitalize;*/
  	font-family: 'Didact Gothic', sans-serif;
   	font-weight:bold;
   	background-color:#FFFFFF;
}

.navbar-custom .navbar-brand {
    font-weight: 700;
}

.navbar-custom .navbar-brand:focus {
    outline: 0;
}

.navbar-custom .navbar-brand .navbar-toggle {
    padding: 4px 6px;
    font-size: 16px;
    color:#000000;
}

.navbar-custom .navbar-brand .navbar-toggle:focus,
.navbar-custom .navbar-brand .navbar-toggle:active {
    outline: 0;
    color:#FF6600;
}

.navbar-custom a {
    color:#000000;
}

.navbar-custom .nav li a {
  /*  -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;*/
}

.navbar-nav>li>a {
        _padding-top: 52px;
        _padding-bottom: 15px;
		line-height:80px;
		font-size:14px;
    }

.navbar-custom .nav li a:hover {
    outline: 0;
    color:#999999;
    background-color: transparent;
}

.navbar-custom .nav li a:focus,
.navbar-custom .nav li a:active {
    outline: 0;
    background-color: transparent;
    color:#FF6600;
}

.navbar-custom .nav li.active {
    outline: 0;
     color:#FF6600;
}

.navbar-custom .nav li.active a {
    /*background-color: rgba(255,255,255,.3);*/
     color:#FF6600;
}

.navbar-custom .nav li.active a:hover {
    color:#FF6600;
}

.navbar-nav>li.disabled-txt a  
{
    /*color:#999999;  */
    cursor:default;  
}

.auto-scorll
{
	height:430px;
	float:left;
	overflow:auto;
	overflow-x:hidden;
	padding:5px;
	display:block;
	-moz-appearance: none !important;
}
.auto-heightpop
{
height:520px;
}

@media(min-width:768px) {

    .navbar-custom {
        _padding: 20px 0;
        border-bottom: 0;
       /* letter-spacing: 1px;*/
        _background: 0 0;
        -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
        -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
        transition: background .5s ease-in-out,padding .5s ease-in-out;
    }

    .navbar-custom.top-nav-collapse {
        padding: 0;
     
        background:#FFFFFF;
		border-bottom:solid 1px #CCCCCC;
    }
}

.intro {
    display: table;
    width: 100%;
    height: auto;
   /* padding: 100px 0;*/
    text-align: center;
    color: #fff;
    background:url(images/banner.png) no-repeat bottom center scroll;
    background-color: #000;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

.intro .intro-body {
    display: table-cell;
    vertical-align: middle;
	background: rgba(0, 0, 0, 0.4) 0%;
	
}

.intro .intro-body .brand-heading {
   
	font-weight:bold;
}

.intro .intro-body .intro-text {
    font-size: 21pt;
	color:#f16c19;
}

@media(min-width:768px) {
    .intro {
        height: 100%;
        padding: 0;
    }

    .intro .intro-body .brand-heading {
        font-size: 42pt;
    }

    .intro .intro-body .intro-text {
        font-size: 21pt;
    }
	
	
}

.btn-circle {
    width: 70px;
    height: 70px;
    margin-top: 15px;
    padding: 7px 16px;
    border: 2px solid #fff;
    border-radius: 100%!important;
    font-size: 40px;
    color: #fff;
    background: 0 0;
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
}

.btn-circle:hover,
.btn-circle:focus {
    outline: 0;
    color: #fff;
    background: rgba(255,255,255,.1);
}

.btn-circle i.animated {
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 1s;
    -moz-transition-property: -moz-transform;
    -moz-transition-duration: 1s;
}

.btn-circle:hover i.animated {
    -webkit-animation-name: pulse;
    -moz-animation-name: pulse;
    -webkit-animation-duration: 1.5s;
    -moz-animation-duration: 1.5s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
}

@-webkit-keyframes pulse {    
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-moz-keyframes pulse {    
    0% {
        -moz-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -moz-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -moz-transform: scale(1);
        transform: scale(1);
    }
}

.about-container {
    padding-top: 100px;
}

.about-section {
    width: 100%;
    padding: 50px 0;
    color: #fff;
    background:url(../img/about-bg.jpg) no-repeat center center scroll;
    background-color: #000;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.client-section {
    padding-top: 100px;
}
.client-section {
    width: 100%;
    padding: 50px 0;
    color: #fff;
    background: url(../img/client_gb.jpg) no-repeat center center scroll;
    background-color: #000;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

#map {
    width: 100%;
   /* height: 200px;*/
    margin-top: 5px;
}

@media(min-width:767px) {
    
    .download-section {
        padding: 100px 0;
    }
  .map_button
  {
  background-image:url(../img/conatcus_icon.png);
  width:128px;
  height:119px;
  background-color: transparent;
  border:0px;
  outline:none;
 
  }
    #map {
       /* height: 400px;*/
      /*  margin-top: -54px;*/
		/*z-index:-99		*/
    }
}

.btn {
    border-radius: 0;
   
    font-weight: 400;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.btn-default {
    /*    background-color: transparent;*/
		
}

.btn-default:hover,
.btn-default:focus {
        outline: 0;
    color: #000;
  
}

ul.banner-social-buttons {
    margin-top: 0;
}

@media(max-width:1199px) {
    ul.banner-social-buttons {
        margin-top: 15px;
    }
}

@media(max-width:767px) {
    ul.banner-social-buttons li {
        display: block;
        margin-bottom: 20px;
        padding: 0;
    }

    ul.banner-social-buttons li:last-child {
        margin-bottom: 0;
    }
	
.carousel {
    /*margin-top: 210px;*/
	
}	
}

footer {
    padding: 10px 0;
}

footer p {
    margin: 0;
}

.footer-img { position:relative; margin:-6px 0 0 0;}

::-moz-selection {
    text-shadow: none;
    background: #fcfcfc;
    background: rgba(255,255,255,.2);
}

::selection {
    text-shadow: none;
    background: #fcfcfc;
    background: rgba(255,255,255,.2);
}

img::selection {
    background: 0 0;
}

img::-moz-selection {
    background: 0 0;
}

body {
    webkit-tap-highlight-color: rgba(255,255,255,.2);
}




<!-- ANIMATION START -->

.revealOnScroll
{
    opacity:0;
}
#first {
  animation-duration: 1s;
  animation-delay: 1s;
   animation-iteration-count: 1;
}

#second {
  animation-duration: 1s;
  animation-delay: 2s;
  animation-iteration-count: 1;
}

#third {
  animation-duration: 1s;
  animation-delay: 3s;
  animation-iteration-count: 1;
}
#four {
  animation-duration: 1s;
  animation-delay: 4s;
  animation-iteration-count: 1;
}
#five {
  animation-duration: 1s;
  animation-delay: 5s;
  animation-iteration-count: 1;
}
#six {
  animation-duration: 1s;
  animation-delay: 6s;
  animation-iteration-count: 1;
}
#seven {
  animation-duration: 1s;
  animation-delay: 7s;
  animation-iteration-count: 1;
}


#about_first
{
	animation-duration: 1s;
 	animation-delay: 1s;
}



/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
 .content-section {
        padding-top: 236px;
    }
.arrow1-top1-top1:after
{
display:none;
}
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
  .content-section {
        padding-top: 192px;
    }
	.arrow1-top1-top1:after
	{
	display:none;
	}

}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
 .content-section {
        padding-top: 110px;
    }
	.arrow1-top1-top1:after
	{
	display:none;
	}

}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
.content-section {
        padding-top: 204px;
    }

}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
  .content-section {
        padding-top: 204px;
    }

}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
 .content-section {
        padding-top: 204px;
    }

}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
 .content-section {
        padding-top:204px;
    }

}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
 .content-section {
        padding-top:179px;
    }

.content-section1222 {
        padding-top: 140px;
    }
}

/* iPhone 4 - 5s ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
 .content-section {
        padding-top: 180px;
    }

}

/* iPhone 6 ----------- */
@media
only screen and (max-device-width: 667px) 
only screen and (-webkit-device-pixel-ratio: 2) {
 .content-section {
        padding-top: 180px;
    }

}

/* iPhone 6+ ----------- */
@media
only screen and (min-device-width : 414px) 
only screen and (-webkit-device-pixel-ratio: 3) {
 .content-section {
        padding-top: 200px;
    }

}


.text-white {
	color:#ffffff;
}

#landing-img {
	background:	linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(images/top-bg.jpg)  50% 0 no-repeat fixed;
	min-height: 100%;
	margin: 0 auto;
	width: 100%;
	position: relative;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#about-sec {
	position: relative;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#buyline-1 {
/*linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),*/
	background:url(images/banner_img2.png)  50% 0 no-repeat fixed;
	min-height: 450px;
	width: 100%;
	_position: relative;
	/*	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.4);
	box-shadow: 0 0 20px rgba(0,0,0,0.4);*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
		
#clients-sec {
	position: relative;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#buyline-2 {
	background: url(images/banner_img3.png)  50% 0 no-repeat fixed;
	min-height: 800px;
	margin: 0 auto;
	width: 100%;
	padding-bottom:57px;
	_position: relative;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.sec5 .sec5-body {
	display: table-cell;
	vertical-align: middle;
	background: rgba(0, 0, 0, 0.8) 0%;
}

a { outline:none !important;}

.carousel-inner > .item > img,
  .carousel-inner > .item > a > img {
      width: 100%;
      margin: auto;
  }
  

.auto-scroll-full .img-border { height:auto;}


.img-border { width:542px; border:1px solid #ccc; padding:5px;height:400px; margin:0 auto;  -webkit-box-shadow: 1px 3px 5px 1px rgba(0,0,0,0.27); -moz-box-shadow: 1px 3px 5px 1px rgba(0,0,0,0.27); box-shadow: 1px 3px 5px 1px rgba(0,0,0,0.27);}

@media only screen and (max-width: 979px) {}
@media only screen and (min-width: 768px) and (max-width: 979px) {

.img-border { height:400px !important;}

}

@media only screen and (min-width: 480px) and (max-width: 767px) {

.img-border { height:200px !important;}
.navbar-nav>li>a { font-size:15px; line-height:20px;}
.content-section { padding-top:232px !important;}

}

@media only screen and (min-width: 320px) and (max-width: 480px) {

.img-border { height:200px !important;}
.navbar-nav>li>a { font-size:15px; line-height:20px;}
.content-section { padding-top:96px !important;}

}

@media only screen and (max-width: 479px) {

.img-border { height:100px !important;}
.h1, h1 { font-size:20pt;}
.h2, h2 { font-size:18pt !important;}
.h3, h3 { font-size:15pt !important; font-weight:bold;}
.h5, h5 { font-size:14px;}
p { font-size:13px;}
ul li { 
	font-size:13px; 
}
.navbar-nav>li>a { font-size:12px; line-height:20px;}
.navbar-brand { width:270px;  } 
.content-section { padding-top:80px !important;}
.carousel-inner { /*height:80px !important;*/}
}

.holder {
  position: relative;
}
.no-radius {
  border-radius: 0;
}
.opacity-25 {
  opacity: 0.25;
  filter: alpha(opacity=25);
}
.opacity-50 {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
.opacity-75 {
  opacity: 0.75;
  filter: alpha(opacity=75);
}
.opacity-100 {
  opacity: 1;
  filter: alpha(opacity=100);
}
.no-margin {
  margin: 0 !important;
}
.margin-bottom-lg {
  margin-bottom: 5px;
}
.margin-bottom-xl {
  margin-bottom: 10px;
}
.margin-bottom-xxl {
  margin-bottom: 20px;
}
.no-padding {
  padding: 0 !important;
}
.force-padding {
  padding: 24px;
}
.large-padding {
  padding: 48px;
}
.small-padding {
  padding: 12px;
}
.no-y-padding {
  padding: 0 24px;
}
.no-side-padding {
  padding: 24px 0;
}

.no-background { background:none !important;}
.border-gray,
.border-black,
.border-white,
.border-lg,
.border-xl,
.border-xxl {
  border-style: solid;
  border-width: 1px;
  border-color: #0c0c0c;
}
.border-lg {
  border-width: 2px;
}
.border-xl {
  border-width: 3px;
}
.border-xxl {
  border-width: 5px;
}
.border-white {
  border-color: #ffffff;
}
.border-gray {
  border-color: #969c9c;
}
.border-transparent {
  border-color: transparent;
}
.hidden-border {
  border-color: transparent !important;
}
.border-dashed {
  border-style: dashed;
}
.overlay {
  position: absolute;
  left: 0;
  right: 0;
  padding: 15px;
}
.overlay-default {
  background-color: rgba(150, 156, 156, 0.75);
  color: #ffffff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}
.overlay-primary {
  background-color: rgba(10, 168, 158, 0.75);
  color: #ffffff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}
.overlay-shade-top {
  background-image: -webkit-linear-gradient(top, rgba(12, 12, 12, 0.6) 0%, rgba(12, 12, 12, 0) 100%);
  background-image: -o-linear-gradient(top, rgba(12, 12, 12, 0.6) 0%, rgba(12, 12, 12, 0) 100%);
  background-image: linear-gradient(to bottom, rgba(12, 12, 12, 0.6) 0%, rgba(12, 12, 12, 0) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#990c0c0c', endColorstr='#000c0c0c', GradientType=0);
}
.overlay-shade-bottom {
  background-image: -webkit-linear-gradient(top, rgba(12, 12, 12, 0) 0%, rgba(12, 12, 12, 0.6) 100%);
  background-image: -o-linear-gradient(top, rgba(12, 12, 12, 0) 0%, rgba(12, 12, 12, 0.6) 100%);
  background-image: linear-gradient(to bottom, rgba(12, 12, 12, 0) 0%, rgba(12, 12, 12, 0.6) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000c0c0c', endColorstr='#990c0c0c', GradientType=0);
}
.mask {
  position: relative;
  overflow: hidden;
}
.bottom-layer {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 0;
}
.top-layer {
  position: relative;
  z-index: 1;
}
.stick-top-left,
.stick-top-right,
.stick-top-left-right {
  position: absolute;
  top: 0;
}
.stick-bottom-left,
.stick-bottom-right,
.stick-bottom-left-right {
  position: absolute;
  bottom: 0;
}
.stick-top-left,
.stick-bottom-left,
.stick-top-left-right,
.stick-bottom-left-right {
  left: 0;
}
.stick-top-right,
.stick-bottom-right,
.stick-top-left-right,
.stick-bottom-left-right {
  right: 0;
}
.height-1,
.size-1 {
  height: 40px;
}
.height-2,
.size-2 {
  height: 80px;
}
.height-3,
.size-3 {
  height: 120px;
}
.height-4,
.size-4 {
  height: 160px;
}
.height-5,
.size-5 {
  height: 200px;
}
.height-6,
.size-6 {
  height: 240px;
}
.height-7,
.size-7 {
  height: 280px;
}
.height-8,
.size-8 {
  height: 320px;
}
.height-9,
.size-9 {
  height: 360px;
}
.height-10,
.size-10 {
  height: 400px;
}
.height-11,
.size-11 {
  height: 440px;
}
.height-12,
.size-12 {
  height: 480px;
}
.width-1,
.size-1 {
  width: 40px;
}
.width-2,
.size-2 {
  width: 80px;
}
.width-3,
.size-3 {
  width: 120px;
}
.width-4,
.size-4 {
  width: 160px;
}
.width-5,
.size-5 {
  width: 200px;
}
.width-6,
.size-6 {
  width: 240px;
}
.width-7,
.size-7 {
  width: 280px;
}
.width-8,
.size-8 {
  width: 320px;
}
.width-9,
.size-9 {
  width: 360px;
}
.width-10,
.size-10 {
  width: 400px;
}
.width-11,
.size-11 {
  width: 440px;
}
.width-12,
.size-12 {
  width: 480px;
}
.auto-width {
  width: auto !important;
}

.auto-height { height:auto !important;}
.policy-link { font-weight:bold; text-decoration:underline; color:#D9E80A}

span.question{width: 16px;height: 16px;font-size: 15px;font-weight: normal;text-align: center;position: absolute; right:-5px; top:6px; color:#fff; display:none;}
.crt-user span.question {right:35px;}
div.tooltip .questionarrow{margin-bottom: 8px;margin-top: -5px;color: White;}
div.tooltip{border: 1px solid #9a9a9a;background-color: #f1f1f1;position: absolute;left: 25px;top: -25px;z-index: 1000000;overflow-y: scroll border-radius: 5px;word-wrap: normal;-ms-word-break: break-all;word-break: break-all;}
div.tooltip:before{border-color: transparent #9a9a9a transparent transparent; content: "";display: block;height: 0;width: 0;line-height: 0;position: absolute;top: 40%;left: -6px;}
div.tooltip table{padding: 1px;text-align: left;width: 100%;}
div.tooltip td{font-size: 11px;color: #333333;line-height: 20px;}
div.tooltip th{font-size: 11px;color: #ff9900;font-weight: bold;text-align: left;border: 0px dotted #ccc;border-bottom-width: 1px;}
div.tooltip p{margin: 0px 0px;position: relative;font-size: 10px; page-break-before: always;word-wrap: break-word;-moz-hyphens: auto;-webkit-hyphens: auto;-o-hyphens: auto;hyphens: auto;width: 350px;}
.Active{color:Blue;}

::selection {
  background: #ff9900; color:#000; /* WebKit/Blink Browsers */
}
::-moz-selection {
  background: #ff9900; color:#000; /* Gecko Browsers */
}

 

.scrolling-div::-webkit-scrollbar-track
{
	-moz-appearance: none !important;
	border-radius: 10px;
	background-color: #F5F5F5;
}

.scrolling-div::-webkit-scrollbar
{
	-moz-appearance: none !important;
	width: 6px;
	background-color:#CCCCCC;
}

.scrolling-div::-webkit-scrollbar-thumb
{
	-moz-appearance: none !important;
	border-radius: 10px;
	background-color:#CCCCCC;
}



.space-bot{
	padding-bottom:20px;
	display:block;
	-moz-appearance: none !important;
}

/* Button styles */
/* Container for centering */
.button-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* Ensures the content is centered vertically */
}

/* Wrapper for buttons */
.buttons-wrapper {
    display: flex;
    justify-content: center;
    gap: 20px; /* Space between buttons */
}

/* Button styling */
.btn {
    padding: 10px 20px;
    font-size: 16px;
    background-color: #003399;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .btn:hover {
        background-color: #002080; /* Darken the button color on hover */
    }


/* General Styles */
.table {
    width: 100%;
}

.responsive-table {
    width: 100%;
    border-collapse: collapse;
    margin: 10px 0;
}

.btn-lg {
    margin: 5px;
    padding: 10px 20px;
    font-size: 16px;
    background-color: #003d87;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

.footer-img {
    max-width: 100%; /* Ensures image is responsive */
    height: auto;
}

/* Media Queries for responsiveness */

/* For screens smaller than 768px (tablets and phones) */
@media (max-width: 768px) {
    /* Hide the table layout on small screens */
    .responsive-table {
        display: none;
    }

    /* Show the button-container as a div layout for smaller screens */
    .button-container {
        display: block;
        width: 100%;
        text-align: center;
    }

        .button-container button {
            width: 100%; /* Make buttons stack vertically on smaller screens */
            font-size: 14px;
            padding: 12px 0;
            margin-bottom: 10px;
        }

    .container_2 .row {
        display: block; /* Stack columns vertically on smaller screens */

    }

    .col-lg-6 {
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }
}

/* For screens larger than 768px */
@media (min-width: 769px) {
    /* Ensure the table is visible again on larger screens */
    .responsive-table {
        display: table;
    }

    .button-container {
        display: none; /* Hide button-container on large screens */
    }

    .footer-img {
        max-width: 200px; /* You can set a max size for larger screens */
    }
}

/* Footer styles */
footer {
    padding: 15px;
    background-color: #003d87;
    color: white;
}

.font1 {
    font-size: 14px;
}

.white-text {
    color: white;
}

.pull-right {
    float: right;
}

/* Ensure footer elements stack properly on small screens */
@media (max-width: 768px) {
    .pull-right {
        float: none;
        text-align: center;
    }
}


.content-div {
    width: 300px;
    height: 100px;
    background-color: lightblue;
    padding: 20px;
    margin-top: 10px;
    border: 1px solid #ccc;
    text-align: center;
    display: none; /* Initially hidden */
}

.show {
    display: block;
}



/* Centering the clientlogin container */
.clientlogin-container {
    display: flex;
    justify-content: center;
    /*align-items: center;*/
    /*margin-top: 50px;
    margin-bottom: 50px;*/
    /*height: 50%;*/ /* Full viewport height */
    /*background-color: rgba(0, 0, 0, 0.1);*/ /* Optional background */
}

/* Centering the clientlogin container */
.container_btn {
    display: flex;
    justify-content: center;
    /*width:2000px;*/
    align-items: center;
    margin-top: 50px;
    /*margin-bottom: 50px;*/
    height: 4000%;   
}

.clientlogin-box {
    /*width: 400px;
    padding: 20px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    text-align: center;*/
}

.clientlogin-header h4 {
    margin-bottom: 20px;
    font-weight: 600;
}

.clientlogin-header .close {
    font-size: 30px;
    border: none;
    background: transparent;
    cursor: pointer;
}

/* Style for the form fields */
.form-group {
    margin-bottom: 15px;
}

.input-group-addon {
    background-color: #f1f1f1;
}

.btn {
    padding: 10px;
    font-size: 16px;
    border-radius: 5px;
}

.btn-new {
    padding: 10px;
    font-size: 16px;
    border-radius: 5px;
    border-color:white;
    color: white;
    background-color: #003d87
}
    .btn-new:hover {
        color: black;
        background-color: #003d87
    }

    .help-block {
        font-size: 14px;
    }

.checkbox label {
    font-size: 14px;
}

/* Optional styling for alerts */
.alert {
    font-size: 14px;
    margin-bottom: 15px;
}

/* Loader styling */
#imgLoader {
    width: 30px;
    height: 30px;
}


.btn-custom {
    width: 100%; /* Makes sure buttons stretch across the column */
}

/* Center modal for large screens */
.modal-dialog {
    position: relative;
    top: 35%;
}

/*body.modal-open {
    overflow: visible !important;
}*/

/*.modal-backdrop {
    background-color: rgba(0, 0, 0, 0.1); /* Change the opacity to a lighter value */
/*}*/


/* Basic styling for the phone link */
.phone-link {
    color: white;
    text-decoration: none;
    position: relative; /* Required for positioning the tooltip */
}

    /* Tooltip styling */
    .phone-link::after {
        content: "650-472-0644"; /* Tooltip text */
        position: absolute;
        bottom: 100%; /* Position above the link */
        left: 50%;
        transform: translateX(-50%);
        background-color: #333;
        color: white;
        padding: 5px 10px;
        border-radius: 5px;
        opacity: 0; /* Hide the tooltip by default */
        visibility: hidden;
        white-space: nowrap;
        font-size: 12px;
        z-index: 1;
        transition: opacity 0.3s, visibility 0.3s;
    }

    .phone-link:hover{
        color:black;
    }
    /* Show the tooltip on hover */
    .phone-link:hover::after {
        opacity: 1;
        visibility: visible;
    }

/* Basic styling for the phone link */
.Email-link {
    color: white;
    text-decoration: none;
    position: relative; /* Required for positioning the tooltip */
}
    .Email-link:hover {
        color: black;
    }
    /* Tooltip styling */
    .Email-link::after {
        content: "info@annuitypayer.com"; /* Tooltip text */
        position: absolute;
        bottom: 100%; /* Position above the link */
        left: 50%;
        transform: translateX(-50%);
        background-color: #333;
        color: white;
        padding: 5px 10px;
        border-radius: 5px;
        opacity: 0; /* Hide the tooltip by default */
        visibility: hidden;
        white-space: nowrap;
        font-size: 12px;
        z-index: 1;
        transition: opacity 0.3s, visibility 0.3s;
    }

    /* Show the tooltip on hover */
    .Email-link:hover::after {
        opacity: 1;
        visibility: visible;
    }


    .link-button {
        color: #003399;
    }

    a.link-button:hover,
    a.link-button:focus {
        color: #000099;
    }

/* Basic button styling */
.custom-button {
    background-color: transparent; /* Transparent background */
    color: white; /* White text */
    border: 3px solid blue; /* Blue border with bold thickness */
    padding: 10px 20px; /* Padding for the button */
    font-weight: bold; /* Bold text */
    font-size: 16px; /* Font size */
    border-radius: 5px; /* Optional: rounded corners */
    cursor: pointer; /* Pointer cursor on hover */
    transition: background-color 0.3s, color 0.3s; /* Smooth transition on hover */
}

    /* Button hover effect */
    .custom-button:hover {
        background-color: white; /* Background turns white */
        color: blue; /* Text color turns blue */
        border: 3px solid blue; /* Keeps the blue border */
    }


.footer-text {
    color: white;
    text-decoration: none;
    position: relative; /* Required for positioning the tooltip */
}
    .footer-text:hover {
        color: black;
    }
    .footer-text:active {
        color: black;
    }


.poppins-semi-bold {
    font-weight: 600;
    font-size: 35px;
    font-family: 'Poppins', sans-serif;
    /*margin-top: 200px;*/
    /*margin-bottom: 30px;*/
    padding-left: 40px;
}

.roboto-regular {
    padding-left: 10px;
    color: white;
    font-size: 23px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    padding-left: 40px;
}

.roboto-medium {
    padding-left: 20px;
    color: white;
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
}

.content-font {
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
}

.content-medium {
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
}


/* Style for the full-width container */
.responsive-container {
    width: 100%; /* Make container take full width of the viewport */
    max-width: 100%; /* Ensures no overflow */
    display: flex;
    justify-content: unset; /* Centers the image horizontally */
}

    /* Style for the image inside the container */
    .responsive-container img {
        width: 50%; /* Makes the image take full width of the container */
        height: 50%; /* Maintains aspect ratio */
         
    }


/* Container for the image */
        .image-container {
            position: relative;
            width: 100%; /* Makes the container take up the full width of its parent */
            max-width: 600px; /* Limits the maximum width of the image */
            float: right; /* Floats the container to the right */
            margin-left: 20px; /* Adds space between the floated image and other content */
            overflow: visible; /* Allows overflow of the text outside the container */
        }

        /* Image styling */
        .overlay-image {
            width: 100%; /* Makes the image responsive */
            height: auto; /* Maintains aspect ratio */
            display: block; /* Removes any spacing below the image */
            object-fit: cover; /* Ensures the image covers the container area */
        }

        /* Separate container for overlay text */
        .text-container {
            position: absolute;
            top: 50%; /* Centers the text vertically */
            left: 0%; /* Positions the text at the left edge of the image container */
            transform: translate(0%, -50%); /* Centers the text vertically */
            width: 120%; /* Makes the text container wider than the image container */
            white-space: nowrap; /* Prevents the text from wrapping */
            overflow: visible; /* Allows the text to overflow outside the container */
            color: black; /* Text color */
            font-size: 5vw; /* Responsive font size based on viewport width */
            font-family: Arial, sans-serif; /* Font family */
            text-align: left; /* Aligns the text to the left */
            font-weight: normal; /* Optional: Makes the text normal weight */
        }


/* Specific table class to isolate this layout */
.image-text-table {
    width: 100%; /* Table takes full width */
    border: none; /* Remove borders */
    table-layout: fixed; /* Table layout ensures cells are of equal width */
    background-color: #003d87;
}

    /* Table cells within the image-text table */
    .image-text-table td {
        position: relative;
        vertical-align: middle; /* Vertically center content in the table cells */
    }

/* Image styling */
.overlay-image {
    width: 80%; /* Image takes up full width of its cell */
    height: auto; /* Maintains aspect ratio */
    display: block; /* Prevents space below the image */
    object-fit: cover; /* Ensures image covers the container area */
    float:right;
}

/* Text container styling */
.text-container {
    position: absolute;
    top: 50%; /* Centers the text vertically */
    left: 0%; /* Positions it at the left side of the image */
    transform: translate(0%, -50%); /* Centers the text vertically */
    color: black; /* Text color */
    font-size: 3vw; /* Responsive font size based on viewport width */
    font-family: Arial, sans-serif; /* Font family */
    font-weight: bold; /* Makes text bold */
    width: 100%; /* Ensures the text takes up full width of the left side */
    text-align: left; /* Aligns text to the left */
    z-index: 1; /* Keeps the text above the image */
}

/* Image cell (right side) */
.image-cell {
    width: 50%; /* Right side image cell */
}

/* Text cell (left side) */
.text-cell {
    width: 50%; /* Left side text cell */
    position: relative; /* Ensures text can be absolutely positioned */
}