/* For Novaro's Theme Customization Style */

/* Main Menu - ADDING DROP DOWN ARROWS TO INDICATE SUBMENU*/
.topnav li > a:after {
    color: #888;
    content: ' ▾';
}

.topnav li > a:hover:after {
    color: #444;
    content: ' ▾';
}

.topnav li > a:only-child:after {
    content: '';
}

.sf-menu > li{padding:0 10px;}

h2.wpb_widgetised_column_heading{font-size:18px;}

marquee a, marquee p, marquee span{color:#333333!important;}

@media only screen and (min-width: 1024px) and (max-width: 1200px) {
.sf-menu, .sf-menu * {font-size:10px;}
}
@media only screen and (max-width: 1070px){
a.nav-toggle{display:block; width:70px; font-size:18px; text-align:center; cursor:pointer; color:#5f6f81;border-right: 1px solid #c6d0da;
border-left: 1px solid #c6d0da; }
	nav{margin:0; float:none;}
    .js .topnav { display: none; position:absolute; left:0px; width:100%; padding:0px; top:100%; z-index:300;}
	.js .topnav li, .js .topnav ul{padding:0px !important; margin:0px !important; border:0px !important; background:none !important;display:block !important; width:100%;}
	.js .topnav ul.sub-menu{visibility:visible !important; position:static !important; width:100% !important;}
	.js .topnav a{width:100% !important; position:static; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; padding:16px 22px !important; background-color:#1f1f1f; color:#8b8b8b; border-bottom:1px solid #252525; background-image:none; text-align:left; font-size:13px; line-height:13px !important; height:auto; font-weight:700; text-transform:uppercase;}
	.js .topnav ul.sub-menu a{padding:16px 22px 16px 34px !important;}
	.js .topnav a:hover, .js .topnav a.current-menu-item{background-color:#9e070c !important; background-image:none !important; color:#fff !important;}
}

.gn-menu-main{display:none;}
div.logoimg{padding:20px 0px;}
div.logoimg img{height:50px;}


@media only screen and (min-width:769px) and (max-width: 1150px) {
	div.logoimg img{height:40px;}
}

@media only screen and (min-width:300px) and (max-width: 769px) {

  .cost-calculator-table tr td {
    padding:5px;
    display: block;
}

.cost-calculator button {
    margin: 15px;
    padding: 20px;
    vertical-align: bottom;
    display: block;
}

	div.logoimg img{height:30px;}

	.downloads tr th, .downloads tr td{width:100%; display:block; padding-right:0; padding-left:0; text-align:center!important;}
	.downloads tr .download-title2{display:none;}
}

#headertext{height:75px;}

.testiinfo .testititle{color: #fff;}

/* 	MENU ACTIVE LINK */
.sf-menu li.current-menu-ancestor{border-top:2px solid #9e070c;}

.sf-menu li.current-menu-ancestor > a { line-height:90px;}
/* END OF MENU ACTIVE LINK */

.main-price,
.partner-price {
  font-family: "Raleway", sans-serif;
}

.main-price {
  background:#EEE;
}

.main-price h1,
.main-price h2,
.main-price h3,
.partner-price h2,
.partner-price h3 {
  font-weight:400;
}

.main-price h1,
.main-price h2,
.main-price h3 {
  margin-left:20px;
}

.main-price h1 {
  font-size:54px;
  margin-top:20px;
  margin-bottom:8px;
}

.main-price h3 {
  font-size:16px;
}

.main-price ul {
  color: #000;
  margin-top: 32px;
}

.main-price li {
  list-style:none;
  padding: 3px 0;
}

.price-left {
  background:#FFF;
  float:left;
}

.price-right{float:left;}

@media only screen and (min-width:770px) and (max-width:850px){
.price-left, .price-right {padding:0 10px!important;}
}

@media only screen and (min-width:479px) and (max-width:770px){
.main-price h1 {
  font-size:30px;
  margin-top:20px;
  margin-bottom:8px;
}
}

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

.main-price h1 {
  font-size:25px;
  margin-top:20px;
  margin-bottom:8px;
}

.main-price h2 {
  font-size:20px;

}

}


.partner-price {
  text-align:center;
  background:#FFF;
  min-height:264px;
}

.partner-logo img {
  margin-bottom:8px;
}

.partner-price ul {
  min-height:70px;
}

.partner-price li {
  list-style:none;
}

.partner-price h2 {
  background:#1e3c78;
  font-size: 22px;
  padding:10px 0;
  color:#FFF;
}

.partner-price h3 {
  color:#1e3c78;
}

a.partner-subscribe {
  background:#1e3c78;
  color:#FFF;
  display: inline-block;
  padding:20px 0;
  margin: 0 auto 20px auto;
  width: 240px;
  font-size: 18px;
  font-weight: 500;
}


/*Contact Form Update - URL text box */
.wpcf7 input,
.wpcf7 input[type="url"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea,
.wpcf7 input[type="password"]{
  margin-top: 0;
  margin-bottom: 12px;
  font-size: 14px;
  padding: 10px 12px;
  width: 100%;
  box-sizing: border-box;
}

input[type="text"], input[type="email"], textarea, input[type="password"], input[type="url"], input[type="tel"]
{
	margin-top:0;
  font-size: 14px;
  padding: 10px 12px;
  color:#000;
  border:1px solid #a7a9ac;
}

/* Pricing tables */
.hostingtitle{background-color: #9e070c;}
.hostingprice{
	color: #ffffff;
 	background-color: #1f262d;
}
.hostingprice span.priceinfo
{
  color: #fff;
}

/* REVOLUTION SLIDER */
.tp-button{
  padding: 6px 13px;
  border-radius: 3px;
  height: 30px;
  cursor: pointer;
  color: #ffffff;
  text-shadow: 0;
  font-size: 15px;
  line-height: 45px;
  background-color:transparent;
  background-image: none;
  font-family: 'Open Sans', arial,sans-serif;
  font-weight: bold;
  letter-spacing: 1px;
}

.purchase:hover, .tp-button:hover, .tp-button.big:hover
{
  background-position: center bottom, 15px 11px;
}

.tp-button.blue, .tp-button.blue:hover, .purchase.blue, .purchase.blue:hover
{
  background-color:#1e3c78;
  box-shadow: none;
}

.tp-button.blue:hover{background-color:#1c1c1c;}

.colorred{background-color:#9e070c!important;}
.colorred:hover{background-color:#d30c13!important;}


#pricing-benefits.vc_row{margin-left:0; margin-right:0;}

.pricing-instructions h3{
  font-family:"Open Sans";
  font-weight:400;
  font-size:20px;
  line-height:25px;
}
#Users, #price-slide{
display:inline-block;
}
#price-slide{width:90%;}

#Users{
    background: rgb(0, 0, 0) none repeat scroll 0% 0%;
    color: rgb(255, 255, 255);
    position:relative;
    line-height: 20px;
  text-align: center;
  border-radius: 3px;
  padding: 5px 10px;
  margin-left: 8px;
vertical-align:middle;
}

#sliderAmount:after {
    position: absolute;
    top: 8px;
    right: -7px;
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-left: 7px solid #000;
    border-bottom: 7px solid transparent;
    content: '';
  }

.cost-calculator{
  text-align:center;
  margin:50px 0;
}

#newusers{ display:inline-block; vertical-align:bottom;}
#newusers i{font-size:40px;}
#newusers input[type="text"]{
  border-radius: 5px;
  padding:10px;
  font-size:40px;
  width:200px;
  text-align:center;
  border:1px solid #ddd;
}

.cost-calculator-table {
    display: table;
    margin: 0 auto;
    border: 0;
    align-content: center;
    width: auto;
}

.cost-calculator-table tr td{vertical-align:bottom; text-align:center; padding:0 5px;}
.cost-calculator-table tr td p{margin-bottom:0;}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    background: transparent;
    width: 16px;
    height: 100%;
    opacity: 1; /* shows Spin Buttons per default (Chrome >= 39) */
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}
  input[type="number"].mod::-moz-inner-spin-button:hover,
  input[type="number"].mod::-moz-inner-spin-button:active{
      border: none;
  }

.cost-calculator i{font-size:40px; vertical-align:bottom; margin-bottom:10px; margin-right:10px}
.cost-calculator button{margin:0 15px; padding:20px; vertical-align:bottom; display:inline-block;}
#total{display:inline-block; vertical-align:bottom;}
#totalAmount{
  display:inline-block;
  vertical-align:middle;
  border-radius: 5px;
  padding:20px;
  font-size:40px;
  color:#fff;
  background:#ddd;
  width:200px;
  text-align:center;
}

input[type=range] {
  -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
  width: 100%; /* Specific width is required for Firefox. */
  max-width:1000px;
  background: transparent; /* Otherwise white in Chrome */
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
}

input[type=range]:focus {
  outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
  outline: 0;
}

input[type=range]::-ms-track {
  width: 100%;
  cursor: grabbing;
  /* Hides the slider so custom styles can be added */
  background: transparent;
  border-color: transparent;
  color: transparent;
}
::-moz-range-track {
    background: transparent;
    border: 0;
}

input[type=range] {
  -webkit-appearance: none;
  width: 100%;
  height: 20px;
  border-radius: 5px;
  background: #ddd;
  outline: none;
  padding: 0;
  margin: 0;
  vertical-align:middle;
}


/* Special styling for WebKit/Blink */
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 25px;
  height: 25px;
  border-radius: 25px;
  background: #000;
  cursor: grabbing;
  margin-top: -14px; /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; /* Add cool effects to your sliders! */

  outline: none;
  padding: 0;
  margin: 0;
}

/* All the same stuff for Firefox */
input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  width: 25px;
  height: 25px;
  border-radius: 25px;
  background: #ffffff;
  cursor: grabbing;
}

/* All the same stuff for IE */
input[type=range]::-ms-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  width: 25px;
  height: 25px;
  border-radius: 25px;
  background: #ffffff;
  cursor: grabbing;
}

output {
  position: absolute;
  background-image: linear-gradient(#444444, #999999);
  width: 40px;
  height: 30px;
  text-align: center;
  color: white;
  border-radius: 10px;
  display: inline-block;
  font: bold 15px/30px Georgia;
  bottom: 175%;
  left: 0;
}
output:after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: 10px solid #999999;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  margin-top: -1px;
}


@media screen and (max-width:500px){
  #price-slide {
    width: 75%;
}

#totalAmount {
    display: block;
    margin:50px auto;
}

.pricing-instructions h3 {
    font-size: 16px;
}

}