body                { font-family: "open_sansregular"; font-size: 14px; color: #585858; }
body p              { font-size: 17px; line-height: 160%;}

/**
FONTs
*/


.alignCenter        { text-align: center; }
.alignLeft          { text-align: left; }
.alignright         { text-align: right; }

.allmenu ul li            { background: #fff; position: relative; z-index: 100;}
.leftsmalllogo              { margin-left: 15px;}

.ralewaylight       { font-family: "ralewaylight"; }
.ralewaybold        { font-family: "ralewaybold"; }
.opensan            { font-family: "open_sansregular"; }
.opensanbold        { font-family: "open_sansbold"; }
.opensansemibold    { font-family: "open_sanssemibold"; }


.serviceheader      { font-size: 18px !important; }

.errorDisplay       { color: red; text-align: right; padding-right: 15px;}





.bold               { font-weight: bold;}
.upper              { text-transform: uppercase;}




.topmenu            { height: 128px; background: url(img/topmenu.jpg) repeat-x;}
.topbanner          { height: 706px; background: url(img/topbanner.jpg) repeat-x; background-position: center; background-size: cover; overflow-y: hidden; }
.topbanner.inner    { height: 200px !important;  }

.btwixtlogo         { width: 100%; height: 187px; background: url(img/btwixt_logo.png) no-repeat center; position: absolute; magin-left: auto; margin-right: auto;}
.btwixtlogo span    { display: none;}



.btwixtlogo .phonebar               { height: 48px;}
.topmenu .phonebar  .phonemenu      { list-style: none; margin: 0px; padding: 0px;}
.topmenu .phonebar  .phonemenu li   { list-style: none; margin: 0px; padding: 0px; display: inline-block; color: #414950; font-weight: bold; padding-top: 5px; padding-right: 20px;}
.topmenu .phonebar  .phonemenu li span.mobilep    { font-size: 30px !important; color: #ffaf36; }
.topmenu .phonebar  .phonemenu li span.emailp     { font-size: 22px !important; color: #ffaf36; }
.topmenu .phonebar  .phonemenu li .menutext       { top: -3px; position: relative; padding-left: 10px;}
.topmenu .phonebar  .phonemenu li .menutext a     {  color: #414950 !important; text-decoration: none;}

.topmenu .phonebar  .phonemenu li:last-child        { padding-left: 20px;}
.topmenu .phonebar  .phonemenu li:first-child       { padding-right: 20px; border-right: 1px solid #ced2d5; height: 48px;}

.topmenu .phonebar  .donwloadfree                   { display: block; padding: 13px; background: #0f75c0; text-transform: uppercase; color: #fff; text-align: left; width: 60%; height: 48px; font-weight: bold; padding-left: 25px; text-decoration: none; margin-left: 39%;}


.topmenu .menubar ul            { list-style: none; margin: 0px; padding: 0px;}
.topmenu .menubar ul li         { list-style: none; margin: 0px; padding: 0px; display: inline-block; margin-top: 30px; text-transform: uppercase; padding-left: 15px; padding-right: 15px; color: #000; border-right: 1px solid #eaeff3;}
.topmenu .menubar ul li:last-child      { border-right: 0px solid #eaeff3;}
.topmenu .menubar ul li a       { font-family: "open_sanssemibold";display: block; width: 100%; color:#a0a1a2; text-decoration: none; font-weight: 500;}
.topmenu .menubar ul li a.select    { color: black;}



.topbanner .middlecontent                   { margin-top: 15%; position: relative; max-width: 50%; color: white;}
.topbanner .middlecontent .yellowbar        { background: #ffaf36; padding: 10px 20px; max-width: 150px; text-transform: uppercase; }
.topbanner .middlecontent .message          { background: rgba(14,108,183,0.7); padding: 10px 20px;}
.topbanner .middlecontent .message .readmore    { background: #0e111a; position: absolute; right: -60px; padding: 10px 20px; bottom: 0px; text-transform: uppercase; text-decoration: none; font-size: 14px; color: #fff;}

.padding10  { padding-top: 10px; }
/**
Service section
*/
.servicesection     { padding-top: 60px; padding-bottom: 100px; background: url(img/servicetriangle.png) no-repeat bottom left;}
.servicesection h2      { margin-top:  0px; padding-top: 0px;}
.viewmore               { background: #000; color: #fff; padding: 10px 20px; text-decoration: none; display: inline-block; margin-top: 10px; text-transform: uppercase;}
.viewmore:hover         { color: #fff; text-decoration: none;}

.servicetext            { background: url(img/text1.png) no-repeat; width: 262px; height: 161px; padding: 35px 20px;}
.servicetext p       { color: #fff; font-size: 22px; text-align: center; display: inline-block; padding: 0px; margin: 0px;}
.servicetext p.fa    { font-size: 30px;}

.servicetext span       { color: #fff; font-size: 22px; text-align: center; display: inline-block; padding: 0px; margin: 0px;}
.servicetext span.fa    { font-size: 30px;}


/**
Screen Shot
*/
.screenshot         { background-color: #eaeff3; padding-top: 40px; padding-bottom: 40px; }
.screenshotback     { background: url(img/screenshoot.png) no-repeat center bottom; min-height: 815px;}



/**
Featured Product
*/

.featuredproduct    { padding-top: 40px; padding-bottom: 40px;}
.contentarea p      { display: inline-block; padding-bottom: 30px;}
.contentarea .termsandcondition p      { display: block; padding-bottom: 15px;}
.package            { width: 100%; min-height: 300px; background: #eaeff3; border:1px solid #cdd1d5; padding: 30px 15px; text-align: center; position: relative;}
.package .heading       { font-size: 22px; padding-bottom: 10px;}
.package h4             { font-size: 18px;color: #55595f;}
.package h4 span        { color: #f7941d; }
.package                { color: #55595f; line-height: 300%; display: inline-block;}
.package .startnow      { border-radius: 10px; background: #0f75c0; color: #fff; padding: 10px 30px; text-decoration: none; }

.package.recommend .startnow      { border-radius: 10px; background: #f7941d; color: #fff; padding: 10px 30px; text-decoration: none; }
.package.recommend .rbanner       { position: absolute; top: 0px; left: 0px;}


/**Contact */
.homecontact        {  padding-top: 50px; padding-bottom: 50px; background-color: #eaeff3;}
.smallheader        { font-size: 20px;}

/**footer */

.footer                 {  background-color: #0f75c0;}
.backgroundblack        { background: url(img/black.png) no-repeat; padding-top: 50px; padding-bottom: 50px; background-size: cover; background-position-x: 500px;}
.footermenu             { list-style: none; margin: 0px; padding: 0px;}
.footermenu li          { list-style: none; margin: 0px; padding: 0px; display: inline-block; }
.footermenu li a        { color: #fff; text-transform: uppercase; display: inline-block; padding: 10px; }

@media screen and (min-width: 768px) and (max-width: 1024px) {
    .topbanner          { height: 500px; }    
    .backgroundblack    { background: url(img/black.png) no-repeat; padding-top: 50px; padding-bottom: 50px; background-position: right top; background-size: cover;}    
}

@media screen and (min-width: 320px) and (max-width: 350px) {
    .topmenu .phonebar  .phonemenu li   { padding-top: 5px; padding-right: 0px;}
    .topmenu .phonebar  .phonemenu li .menutext span                  { display: none;}
    .topmenu .menubar ul li         { display: inline-block; margin-top: 30px; padding-left: 5px; padding-right: 5px; }
    .topmenu .menubar ul li a       { font-family: "open_sanssemibold";display: block; width: 100%; color:#a0a1a2; text-decoration: none; font-weight: 500; font-size: 12px;}
    
    .topbanner .middlecontent                   { margin-top: 15%; position: relative; max-width: 100%; color: white;}
    .topbanner .middlecontent .message          { background: rgba(14,108,183,0.7); padding: 10px 10px;}
    .topbanner .middlecontent .message .readmore    { background: #0e111a; position: absolute; right: 60px; padding: 10px 20px; bottom: -40px; text-transform: uppercase; text-decoration: none; font-size: 14px; color: #fff;}
    
}

@media screen and (min-width: 350px) and (max-width: 768px) {
    
    .topmenu .menubar ul li         { display: inline-block; margin-top: 30px; padding-left: 7px; padding-right: 7px; }
    .topmenu .phonebar  .phonemenu li   { padding-top: 5px; padding-right: 0px;}
    .topmenu .phonebar  .phonemenu li .menutext span                  { display: none;}
    .topbanner .middlecontent                   { margin-top: 15%; position: relative; max-width: 100%; color: white;}
    .topbanner .middlecontent .message .readmore    { background: #0e111a; position: absolute; right: 60px; padding: 10px 20px; bottom: -40px; text-transform: uppercase; text-decoration: none; font-size: 14px; color: #fff;}
}