/*! custom.css v1.0 */

/* ==========================================================================

   Custom CSS Stylesheet. This is where you should add your own styles!

   ========================================================================== */

/*
* Simple style overrides or custom adds
*/

ul.cust-list1 {
    padding-left: 20px;
}
ul.cust-list1 li {
    list-style: disc;
    font-family: Open Sans;
    font-size: 18px;
    line-height: 28px;
    font-weight: 300;
    font-style: normal;
}
#LV-popup {
	position:fixed; z-index: 1000; height: 100%; width: 100%; background-color: rgba(0,0,0,0.6);
}
.opaque-header{
	background: #223f8c !important;
    opacity: 1 !important;
    max-height: 160px;
}

.no-click {
    pointer-events: none;
}
.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}
.MultiSelect.form-control {
	height: 52px;
}
.MultiSelect {
	width: 100%;
	overflow: hidden;
	transition: height 0.3s ease;
	position: relative;
	padding: 50px 0 0 0 !important;
}
.MultiSelect .inner-wrapper {
	height: 52px;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0px;
	z-index: 1;
}
.MultiSelect > label {
	position: absolute;
	left: 9px !important;
}
.MultiSelect p {
	position: absolute;
	top: 26px;
	left: 16px;
	margin: 0;
}
.MultiSelect .select-arrow {
	height: 12px;
    width: 6px;
    position: absolute;
    right: 10px;
    top: 20px;
	background-image: url(../images/select-arrow.svg); background-repeat: no-repeat; background-size: 6px 12px; background-position: center; 
	z-index: 0;
}
.MultiSelect ul li {
	padding: 0px 16px;
	position: relative;
}
.MultiSelect ul li label {
	top: 3px;
	left: 35px !important;
	color: #969696 !important;
}
.MultiSelect ul li.hover,
.MultiSelect ul li.selected.hover {
	background-color: #f4f4f4;
}
.pricing-content-1 .price-column-container {
	text-align: center;
	background-color: #fff;
}
.pricing-content-1 .price-table-head {
    color: #fff;
    padding: 20px 0;
}
.pricing-content-1 .price-table-footer {
    padding: 20px 0;
}
.pricing-content-1 .price-table-pricing>h3 {
    font-size: 60px;
    position: relative;
    font-weight: 400;
    color: #333;
}
.pricing-content-1 .price-table-pricing>h3>.price-sign {
    font-size: 24px;
    line-height: 24px;
    position: absolute;
    margin-left: -15px;
}
.price-table-content .row {
	margin: auto;
}
.pricing-content-1 .price-ribbon {
    position: absolute;
    top: 75px;
    right: -4px;
    width: 90px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 300;
    padding: 6px 20px 6px 15px;
    color: #fff;
    background-color: #D91E18;
    text-shadow: 0 1px 2px #bbb;
    -webkit-box-shadow: 0 2px 4px #888;
    -moz-box-shadow: 0 2px 4px #888;
    box-shadow: 0 2px 4px #888;
    z-index: 2;
}
.pricing-content-1 .price-ribbon:after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    right: 0;
    top: 100%;
    border-width: 5px 6px;
    border-style: solid;
    border-color: #64120f transparent transparent #64120f;
}
.bg-blue { background: #3598dc!important; }
.bg-red { background: #e7505a!important; }
.bg-green { background: #32c5d2!important; }
.bg-purple { background: #8E44AD!important; }
.p-5 { padding: 5px; }
.p-8 { padding: 8px; }
.no-margin { margin: 0; }

/* ==========================================================================
   ** Responsive styles custom rules
   * These rules are ready to be used for either overrides
   * or just your own custom rules.
   ========================================================================== */

@media only screen and (min-width : 1921px){
}

@media only screen and (max-width : 1921px){
	#managed_button{
		margin-right: 30px;
	}
}

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

}

@media only screen and (min-width : 1200px) and (max-width : 1440px){

}

@media only screen and (min-width : 1200px){
	h3.cust-font-size-1 {
		font-size: 23px !important;
	}
}

@media only screen and (max-width: 1199px){
	span#resolutiontext {
		/* font-size: 108pt !important; */
		font-size: 100pt !important; 
	}
	.fun-fact {
		margin-top: 20px;
	}
}

@media only screen and (min-width: 992px) and (max-width: 1199px){
	a#managed_button.btn.btn-fullcolor.btn-third {
		font-size: 10px;
	}
	a#dedicated_button.btn.btn-fullcolor.btn-third {
		font-size: 10px;
	}
	a#managed_button.btn.btn-fullcolor.btn-third {
		font-size: 10px;
	}
	a#dedicated_button.btn.btn-fullcolor.btn-third {
		font-size: 10px;
	}
	.center-block {
		padding-top: 550px;
	}
	.tbk__title.lh-160.fw-thin.white.text-shadow.getsmaller {
		font-size: 100pt !important;
		line-height: 100pt !important;
	}
	.fw-semibold.white.text-shadow {
		font-size: 160pt !important;
		line-height: 160pt !important;
	}
}

@media only screen and (min-width: 992px){
	.sadcenter {
		margin-top: 50px;
	}

	.spaceme {
		display: none;
	}

}

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

	div#captiontest.captiontest.container.kl-iosslide-caption.kl-ioscaption--style4.s4ext.fromleft.klios-alignleft.kl-caption-posv-middle {
		top: 225px;
	}
	div#captiontest.captiontest.container.kl-iosslide-caption.kl-ioscaption--style4.fromright.klios-alignright.kl-caption-posv-middle.mt-0 {
		top: 225px;
	}

	.opaque-header {
		max-height: 128px;
	}
}

@media only screen and (min-width: 768px) and (max-width: 991px){
	/*.freshwidget-theme {display:none;}*/
	a#managed_button.btn.btn-fullcolor.btn-third {
		font-size: 10px;
	}
	a#dedicated_button.btn.btn-fullcolor.btn-third {
		font-size: 10px;
	}
	.center-block {
		padding-top: 450px;
	}
	.tbk__title.lh-160.fw-thin.white.text-shadow.getsmaller {
		font-size: 48pt !important;
		line-height: 48pt !important;
	}
	.fw-semibold.white.text-shadow {
		font-size: 108pt !important;
		line-height: 108pt !important;
	}
}

@media only screen and (min-width: 768px) {
	.ptop-180-sm-up {padding-top: 180px;}
	.pbottom-180-sm-up {padding-bottom: 180px;}
}

@media only screen and (max-width: 767px) {
	/* to make the logo container inline with the icon */
	.site-header .logo-container {
    	float: left;
    	width: calc(100% - 120px);
    	margin-left: 60px;
	}
	/* to remove the extra space under the separator */
	#header > .container > .separator {
		margin-bottom: 0;
	}
	/* to vertically center the menu icon */
	#header .zn-res-trigger {
		margin-top: 26px;
	}

	/*.freshwidget-theme {display:none;}*/
	#managed_button{
		margin-bottom: 20px;
		margin-right: 0px;
	}
	.center-block {
		padding-top: 250px;
	}
	.tbk__title.lh-160.fw-thin.white.text-shadow.getsmaller {
		font-size: 48pt !important;
		line-height: 48pt !important;
	}
	.fw-semibold.white.text-shadow {
		font-size: 108pt !important;
		line-height: 108pt !important;
	}
	.row.stretchme {
		margin-left: -30px;
		margin-right: -30px;
	}
	span#resolutiontext {
		font-size: 82pt !important;
	}
	#addbottompadding {
		margin-bottom: 10px;
	}
}

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

	div#captiontest.captiontest.container.kl-iosslide-caption.kl-ioscaption--style4.s4ext.fromleft.klios-alignleft.kl-caption-posv-middle {
		top: 125px;
	}
	div#captiontest.captiontest.container.kl-iosslide-caption.kl-ioscaption--style4.fromright.klios-alignright.kl-caption-posv-middle.mt-0 {
		top: 125px;
	}
	span#resolutiontext {
		font-size: 62pt !important;
	}

}

@media only screen and (max-width : 480px) {
	/* have to center menu icon in a more dynamic way for tiny screens */
	.site-header .logo-container {
	    float: left;
	    width: 100%;
	    margin-left: 0;
    	/* width: calc(100% - 50px);
    	margin-left: 25px; */
	}
	#header #zn-res-menuwrapper {
		position: absolute;
		right: 0;
		height: calc(100% - 46px);
	}
	#header .zn-res-trigger {
		margin-top: 0;
		margin-left: 10px;
		margin-right: 15px;
		height: 100%;
		line-height: 100%;
	}

	#mumbai-text {
		font-size: 18pt !important;
	}
	a#managed_button.btn.btn-fullcolor.btn-third {
		font-size: 10px;
	}
	a#dedicated_button.btn.btn-fullcolor.btn-third {
		font-size: 10px;
	}
	.center-block {
		padding-top: 150px;
	}
	.tbk__title.lh-160.fw-thin.white.text-shadow.getsmaller {
		font-size: 48pt !important;
		line-height: 48pt !important;
	}
	.fw-semibold.white.text-shadow {
		font-size: 108pt !important;
		line-height: 108pt !important;
	}
}
@media only screen and (max-width: 414px) {

	div#captiontest.captiontest.container.kl-iosslide-caption.kl-ioscaption--style4.s4ext.fromleft.klios-alignleft.kl-caption-posv-middle {
		top: 75px;
	}
	div#captiontest.captiontest.container.kl-iosslide-caption.kl-ioscaption--style4.fromright.klios-alignright.kl-caption-posv-middle.mt-0 {
		top: 75px;
	}

}

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

	span#resolutiontext {
		font-size: 42pt !important;
	}
}

@media only screen and (max-width : 320px) {
	a#managed_button.btn.btn-fullcolor.btn-third {
		font-size: 8px;
	}
	a#dedicated_button.btn.btn-fullcolor.btn-third {
		font-size: 8px;
	}
	.center-block {
		padding-top: 150px;
	}
	.tbk__title.lh-160.fw-thin.white.text-shadow.getsmaller {
		font-size: 48pt !important;
		line-height: 48pt !important;
	}
	.fw-semibold.white.text-shadow {
		font-size: 48pt !important;
		line-height: 48pt !important;
	}
	div#captiontest.captiontest.container.kl-iosslide-caption.kl-ioscaption--style4.s4ext.fromleft.klios-alignleft.kl-caption-posv-middle {
		top: 0px;
	}
	div#captiontest.captiontest.container.kl-iosslide-caption.kl-ioscaption--style4.fromright.klios-alignright.kl-caption-posv-middle.mt-0 {
		top: 0px;
	}
}