@font-face {
    font-family: 'Karla';
    src: url("../fonts/Karla-Regular.ttf");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Karla';
    src: url("../fonts/Karla-Bold.ttf");
    font-weight: bold;
    font-style: bold;
}
#Body, body { font-size:14px; font-family: 'Karla',Helvetica,Arial,sans-serif; line-height: 16px; color: #333; background: #f4f6fb; }

body,
#shortcuts,
#shortcuts .loginform li a,
#mainNav ul li a,
.bannerGrid,
.bannerGrid .indexPanel .index-1 input,
.tableHeader .BlockName,
.buttonContinue, .buttonLogin, .buttonAdd, .buttonPlaceOrder, a.more {
    font-family: 'Karla';
}

#shortcuts{
    float: none;
    height: auto;
}
#header, #shortcuts, div.innerPath{
    width:961px;
    margin: 0 auto;
}
.bannerGrid .indexPanel.bigger{
    width: 100%;
}
#contentContainer{
    padding: 20px 0;
    border: none;
}
#mainNav{
    text-shadow: none;
    background-color: transparent;
    box-shadow: none;
    height: 80px;
}
#topLayout{
    background-color: #4D4D4D;
}
#topShortcuts{
    background-color:#333;
}
#footer{
    border: none;
}
.bannerGrid .bigger form{
    width: 500px;
    margin:35px;
}
#contentContainer h2, .bannerGrid, .bannerGrid h2, .bannerGrid .bigger form span{
    color: #4d4d4d;
    font-weight: bold;
}

#contentContainer .bannerGrid .bigger form h2{
    margin-bottom: 20px;
}
#mainNav ul li{
    border: none;
}
#mainNav ul{
    padding-top:25px;
    float: right;
}
#logo{
    margin-top: 25px;
}
#logo a img{
    width: 180px;
    padding-left:5px;
}
#shortcuts .loginform li a{
    color: #CCC;
    text-decoration: none;
}
#mainNav ul li a{
    min-width: auto;
    margin-left: 20px;
    font-weight: normal;
}
#mainNav ul li a span{
    font-weight: normal;
}
#shortcuts .loginform, #shortcuts .localize{
    margin-right: 5px;
}
.bannerGrid{
    margin-top:-15px !important;
    font-weight: bold;
}
.bannerGrid .bigger.indexPanel .index-1{
    background:#00dbff;
    background-size: cover;
    background-position: bottom right;
}
.bannerGrid .indexPanel .index-1 input{
    font-size: 14px;
    border: none;
    border-radius: 4px 0 0 4px !important;
    height:40px;
    padding: 0;
    text-indent: 20px;
}
.bannerGrid .indexPanel .index-1 a.more:before{
  content:"";
  display: inline-block;
  width: 12px;
  height:12px;
  background: url(../images/magnifier.png) no-repeat center center;
  background-size: cover;
  margin-right: 10px;
  vertical-align: text-bottom;
}
.bannerGrid .indexPanel .index-1 a.more{
    background-color: #ffe32a;
    border: none;
    color: #4d4d4d;
    font-weight: bold;
    height:40px;
    padding: 0 25px;
    margin-left: 0px;
    border-radius: 0 4px 4px 0 !important;
    line-height: 40px;
}
.bannerInside{
    padding: 15px;
}
.bannerGrid .indexPanel .index-1,
.bannerGrid .indexPanel .index-2,
.bannerGrid .indexPanel .index-3,
.bannerGrid .indexPanel .index-4{
    /* background-image: none !important; */
    background-color: #ffe32a;
}
.bannerGrid .indexPanel a.more{
    border-radius: 3px !important;
    background-color: #00dbff;
    border: none;
    padding: 5px 20px;
    display: inline-block;
    text-transform: none;
    font-size: 12px;
}
.bannerGrid .indexPanel{
    width: 33.33%;
}
.tableHeader .BlockName{
    text-transform: unset;
    font-size: 20px;
    color: #222223;
}
.planSmallPanel, .planSmallPanel .tableHeader .BlockName, .tablePlanCompareTDHeader{
    box-shadow: none;
    border: none;
    background-color: #f8f8f8;
}
.planSmallPanel .tableHeader{
    box-shadow: none;
    background-color: transparent;
}
.planSmallPanel .tableHeader .BlockName, .tablePlanCompareTDHeader{
    color: #00dbff;
    font-size: 18px;
    margin-top:20px
}
.planSmallPanel .tablePlanPeriod{
    width: 100%;
}
.planSmallPanel .tableContentTD,
.planSmallPanel .tableFooterTD{
    padding: 10px;
}
.buttonContinue, .buttonLogin, .buttonAdd, .buttonPlaceOrder, a.more{
    background-color: #00dbff;
    border: none;
    border-radius: 4px !important;
    display: block;
    text-align: center;
    text-transform: uppercase;
}
.planSmallPanel{
    width: 300px;
}
.topPath{
    background-color: #efefef;
}
.topPath .tablePath ul li, .tablePath ul li span.passedStep, .tablePath ul li span.visitedStep, .tablePath ul li span.currentStep, .tablePath ul li span.followingStep{
    background-image: none;
}
.topPath .tablePath ul li{
  background-color: #F8F8F8;
}
.tablePath ul li:first-child{
    border: none;
    box-shadow: none;
}
.tableContentTD{
    padding: 15px;
}
#configurationSettings .tableContentTD{
    padding: 0;
}
.tableContentTD .OrderRowTD{
    padding: 20px 0px;
}
.tableOrderContent{
    background-color: #FFF;
    margin-bottom:40px;
}
.OrderRowTD.Line.OrderTotalTopLine{
    border-bottom: 1px solid #CCC;
}
.tableContentTD .oddRowTable{
    background-color: #FFF;
}
.tableHeader .BlockName.BlockNameOrder{
    text-transform: unset;
    background-color: #F8F8F8;
    padding: 10px 15px;
    font-size: 20px;
}
.planRateCategoryDescription{
    background-color: #FFF;
}
legend.editPlanRate{
    text-transform: unset;
    background-color: #F8F8F8;
    padding: 10px 15px;
    font-size: 20px;
    box-shadow: none;
    color: #222223;
}
.planRateCategoryTable{
    margin-top:20px;
}
.planRateWrapper{
    background-color:#FFF;
}
.tablePath ul li:not(:first-child) span,
.tablePath ul li:last-child span{
    padding-left:40px;
}
.tablePath ul li span{
  text-shadow: none;
  padding: 0 40px;
}
.tablePath ul li{
    position: relative;
    height: 60px;
    line-height: 60px;
    margin-right: 0;
}
.tablePath ul > li:not(:first-child) > span:before {
  width: 0px;
  height: 0px;
  border-top: 30px inset transparent;
  border-bottom: 30px inset transparent;
  border-left: 20px solid #efefef;
  position: absolute;
  content: "";
  top: 0;
  left: 0;
}
.tablePath ul li:after {
  width: 0px;
  height: 0px;
  border-top: 30px inset transparent;
  border-bottom: 30px inset transparent;
  border-left: 20px solid #F8f8f8;
  position: absolute;
  content: "";
  top: 0;
  right: -20px;
  z-index: 2;
}
.tablePath ul > li.currentStep > span {
  color: #ffffff;
  background-color: #00dbff;
}
.tablePath ul > li.currentStep:after {
  border-left-color: #00dbff;
}
.tablePath ul li span.passedStep a, .tablePath ul li span.visitedStep a{
  text-decoration: none;
}
.buttonContinue, .buttonLogin, .buttonAdd, .buttonPlaceOrder{
  text-transform: unset;
  padding: 5px 50px;
  background-color: #00dbff;
}
.buttonContinue, .buttonBack, .SWbutton, .SWbutton_Over,
.buttonContinue, .buttonBack, .SWbutton, .SWbutton_Over, .buttonOk, a.IconModify, .more, .SWCombo label, #termsForm span.cloudConfig {
  padding: 5px 20px;
  border: none;
  font-size: 14px;
  font-family: 'Karla';
}
.buttonBack, .buttonCancel{
  background-color: #F8F8F8;
  color: #00dbff;
}
.tableFooter{
  margin-top: 40px;
  box-shadow: none;
}
#shortcuts a.support { background-image: url("../images/help_icon.png"); }
.bannerGrid .indexPanel div {height: 200px;margin: 10px;border-radius: 5px;overflow: hidden;background-size: cover;background-position: right bottom;}

.bannerGrid .indexPanel{
  height: auto;
}
#contentContainer .bannerGrid h2 {
    margin-bottom: 5px;
}
#mainNav a:hover, #mainNav li.Sel a{
  background-color: transparent;
  color: #FFF;
}
#mainNav ul li ul{
  background-color:transparent;
  box-shadow: none;
}
#mainNav ul li ul li{
  background-color: #4d4d4d;
  box-shadow: none;
  border-top: none;
}
#mainNav ul li ul li:first-child{
  border-top: 3px solid #00dbff;
}
#mainNav ul a:hover{
  color: #00dbff;
}
#mainNav ul li ul li a span:hover{
  background-color: transparent;
}
#mainNav li.Sel ul li a:hover { background: transparent; }
.buttonContinue:hover, .buttonLogin:hover, .buttonAdd:hover, .buttonPlaceOrder:hover, a.more:hover{
  background-color: #003f42;
}
.OrderRowTD.Line.OrderTotalTopLine b{
  font-weight: normal;
}
.tableContentTD .OrderRowTD b{
  font-weight: normal;
}
.OrderRowTD.Line.OrderTotalBottomLine div{
  font-weight: bold;
}
#totalOrderDIV{
  color: #00dbff;
}
.OrderRowTD.Line.OrderTotalBottomLine div:last-child{
  margin-top:15px;
}
.OrderRowTD.Line.OrderTotalBottomLine div:last-child b{
  display: inline-block;
  background-color: #F8F8F8;
  padding:5px 20px;
  margin-right: -20px;
}
.OrderRowTD.Line.OrderTotalBottomLine .totalLabel{
  font-weight: bold;
  display: inline-block;
  margin-right: 20px;
}