/* GLOBAL */
html, body {
height: 100%;
width: 100%;
max-width: 100%;
margin: 0;
padding: 0;
}
body {
font-family: 'Open Sans', sans-serif;
font-size: 14px;
line-height: 24px;
font-weight: 300;
color: #333;
background: #fff;/*url(../img/patterns/paper.png);*/
margin-top: 120px;
}
/*body.home {
margin-top:155px;
}*/
.pageHeading {
background: #233242;
color: #fff;
margin-bottom: 25px;
}
h3, h2.h3 {
font-size: 17px !important;
color: #0b6ebb !important;
font-weight: 700 !important;
text-transform: uppercase !important;
}
h4 {
color: #0b6ebb;
}
a {
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
}
a, a:hover {
text-decoration: none;
}
.fakeLink {
  color: #337ab7;
  cursor: pointer;
  border-bottom: 1px dotted #337ab7;
}
.fs_branding {
background: #0b6ebb;
color: #fff;
padding-top: 5px;
padding-bottom: 5px;
height: 120px;
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
.fs_branding a {
color: #fff;
}
.fs_branding .fs_logo {
height: 100px;
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
/* make the nav smaller on scroll */
.fs_branding.shrink {
height: 60px;
}
.fs_branding.shrink .fs_logo {
height: 50px;
padding: 5px;
}
a.social-icon {
color: #233242;
}
a.social-phone:hover {
color: #212324;
}
a.social-twitter:hover {
color: #0084b4;
}
a.social-facebook:hover {
color: #3b5998;
}
a.social-google:hover {
color: #d34836;
}
a.social-linkedin:hover {
color: #007bb6;
}
.fs_cart {
font-size: 3rem;
}
.fs_nav {
background: #0b6ebb;
color: #fff;
border-radius: 0;
border: none;
}
.navbar-default .navbar-nav>li>a {
color: #fff;
}
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a.active {
background: #233242;
color: #fff;
}
.main {
min-height: 800px;
}
ul.hp_list {
list-style-image: url('/_a/img/checkmark.png');
list-style-position: outside;
text-align: left;
padding: 0 0 0 45px;
}
h4.h4-hp {
margin: 30px 0 !important;
}
.bx-pager-item {
display: none !important;
}
.bx-prev {
margin: 0 20px 0 0;
}
.bx-controls, .bx-controls-direction {
display: inline !important;
width: 150px;
float: left !important;
}
a.bx-prev {
border: 1px solid #0b6ebb;
color: #0b6ebb;
display: inline-block;
padding: 0 5px;
font-size: 10px;
line-height: 22px;
}
a.bx-next {
border: 1px solid #0b6ebb;
color: #0b6ebb;
display: inline-block;
padding: 0 5px;
font-size: 10px;
line-height: 22px;
}
footer {
background: #233242;
color: #fff;
padding-top: 40px;
padding-bottom: 40px;
margin-top: 50px;
}
.pad50 {
height: 50px;
display: block;
}
.pad25 {
height: 25px;
display: block;
}
a.faq {
display: block;
height: 100%;
color: #da590a;
padding: 10px 0;
border-radius: 3px;
}
a.faq .cbp-ig-category {
color: #fff;
}
a.faq:hover, a.faq:hover h3 {
background: #da590a;
color: #fff;
}
/*-----------------------------------------------------------------------------------*/
/*	HOME PAGE HERO
/*-----------------------------------------------------------------------------------*/
.hero {
height: calc(100%-100px);
min-height: calc(100%-100px);
width: 100%;
margin-top: 120px;
display: block;
overflow: hidden;
position: relative;
background: url('../img/slider/bg.jpg') center top no-repeat fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.hero h2 {
color: #fff;
font-size: 4rem;
background: rgba(0,0,0,0.3);
padding: 10px;
text-align: center;
}
.hero h3 {
color: #fff !important;
font-size: 3rem;
padding-top: 1rem;
padding-bottom: 1rem;
}
.hero h4 {
color: #fff;
font-size: 2.5rem;
padding-top: 3rem;
padding-bottom: 1rem;
}
}
/* VIDEO */
figure {
display: block;
background: #eee;
padding: 10px;
}
video {
width: 100% !important;
height: auto !important;
}
/*-----------------------------------------------------------------------------------*/
/*	TESTIMONIALS
/*-----------------------------------------------------------------------------------*/
.t_box {
float: left;
border: 1px solid #ccc;
padding: 10px;
margin: 0 50px 50px 0;
}
.t_box {
float: left;
border: 1px solid #ccc;
padding: 10px;
}
.t_box_orange {
background: #0b6ebb;
border: 1px solid #ccc;
padding: 80px 10px 60px;
margin: 0 50px 50px 0;
clear: both;
}
.t_box_orange p {
color: #fff !important;
font-weight: 700;
font-size: 18px;
text-align: center;
}
.t_box2 {
float: left;
border: 1px solid #ccc;
padding: 10px;
margin: 0 0 50px 0;
}
.t_box span, .t_box2 span {
font-size: 19px;
font-weight: 700;
}
.t_box div, .t_box2 div {
border-top: 1px dashed #ccc;
text-align: right;
margin: 5px 0 0 0;
padding: 10px 0 0 0;
font-weight: 700;
color: #a7c906;
}
.t_box div span, .t_box2 div span {
display: block;
font-weight: 700;
color: #a7c906;
font-size: 14px;
color: #233242;
}
.t_heart {
position: relative;
width: 1px;
height: 1px;
}
.t_heart > div {
position: relative;
left: -6px;
width: 14px;
height: 12px;
top: -12px;
}
/*-----------------------------------------------------------------------------------*/
/*	PLANS
/*-----------------------------------------------------------------------------------*/
.simcardprice {
display: inline-block;
width: 140px;
height: 140px;
border-radius: 50%;
background: #0b6ebb;
color: #fff;
/*line-height: 70px;*/
text-align: center;
/*font-size: 20px;*/
/*float: left;*/
/*margin-right: 20px;*/
margin-top: -10px;
}
.simcardprice span {
  display:block;
  margin-top:36px;
  font-size: 16px;
}
.simcardprice span strong{
  margin-top:30px;
  font-size: 22px;
}
/* Plan Navigation */
.plan-nav-holder {
background: #0b6ebb;
margin-top: -25px;
min-height: 60px;
padding-top: 3px;
padding-bottom: 3px;
}
.plan-nav {
display: block;
width: 100%;
color: #fff;
text-transform: uppercase;
font-weight: 600;
padding: 14px;
}
.plan-nav:hover {
display: block;
width: 100%;
background: #233242;
color: #fff;
text-transform: uppercase;
}
.plan-nav.selected {
display: block;
width: 100%;
background: #233242;
color: #fff;
text-transform: uppercase;
}
.plan-nav.selected:after {
content: '';
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #233242;
left: 45%;
position: absolute;
bottom: -10px;
}
.section-header {
border: 1px solid #ccc;
color: #000;
font-weight: 800;
text-transform: uppercase;
font-size: 26px;
margin: 50px 0;
}
.section-header div {
border: 5px solid #fff;
background: url(../img/bg-stripes.png) repeat;
padding: 5px 10px;
}
.plans, .sims {
border: 1px solid #fff;
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
padding-top: 10px;
cursor: pointer;
}
.plans.data {
cursor: default;
}
.plans:hover, .sims:hover {
border: 1px solid #ddd;
background: #eee;
}
.plans .title, .sims .title, .extras .title {
padding: 1rem;
text-align: center;
margin-bottom: 2rem;
}
.plans .title h4, .plans .title h5, .sims .title h4, .sims .title h5 {
color: #fff;
}
.data .title {
background: #3f6b9a;
}
.plan-none .title {
background: #233242;
}
.plan-extreme .title {
background: #cc1111;
}
.plan-max .title {
background: #cc3311;
}
.plan-saver .title {
background: #cc7711;
}
.btn-plans {
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
margin-bottom: 2rem;
}
/* Selected No plan */
.plan-selected.plan-none {
border: 1px solid #233242
}
.plan-selected .btn-plans.btn-none {
background: #233242;
color: #fff;
}
/* Selected Extreme */
.plan-selected.plan-extreme {
border: 1px solid #cc1111;
}
.plan-selected .btn-plans.btn-extreme {
background: #cc1111;
color: #fff;
}
/* Selected Max */
.plan-selected.plan-max {
border: 1px solid #cc3311;
}
.plan-selected .btn-plans.btn-max {
background: #cc3311;
color: #fff;
}
/* Selected Saver */
.plan-selected.plan-saver {
border: 1px solid #cc7711;
}
.plan-selected .btn-plans.btn-saver {
background: #cc7711;
color: #fff;
}
/* Plan LIst Styles */
.plan-deets {
display: block;
list-style: none;
padding: 5px;
margin: 0;
}
.plan-deets li {
border-bottom: 1px solid #ddd;
padding: 5px;
}
.plan-deets>li:nth-of-type(even) {
background: #eee;
}
/* SIMS */
.sims {
padding-bottom: 1rem;
}
.sims .title {
background: #233242;
}
.sim-selected {
border: 1px solid #233242;
}
.sim-selected .btn-sims {
background: #233242;
color: #fff;
}
/* EXTRAS */
.extras .title {
background: #233242;
}
.extras .title h4 {
color: #fff;
}
.plan-radio {
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
margin-bottom: 2rem;
display: block;
overflow: hidden;
width: 100%;
padding: 3px;
border-radius: 3px;
}
.plan-radio.radio-selected {
background: #233242;
/*background:#306afd;*/
color: #fff;
}
.plan-radio i.radioon {
display: none;
}
.plan-radio i.radiooff {
display: inline-block;
}
.plan-radio.radio-selected i.radiooff {
display: none;
}
.plan-radio.radio-selected i.radioon {
display: inline-block;
}
.plan-radio input[type='radio'] {
opacity: 0;
}
.toggleSim, .toggleLate {
cursor: pointer;
}
.toggleIntl {
cursor: pointer;
color: #233242;
}
/* buy bar */
.fs-buy-bar {
background: #eee;
color: #0b6ebb;
padding-top: 5px;
padding-bottom: 5px;
height: 55px;
line-height: 45px;
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
.fs-buy-bar a {
color: #0b6ebb;
}
.barPlan, .barSim {
text-overflow: ellipsis;
}
.buy-bar-plan.plan-extreme {
background: #cc1111;
color: #fff;
}
.buy-bar-plan.plan-max {
background: #cc3311;
color: #fff;
}
.buy-bar-plan.plan-saver {
background: #cc7711;
color: #fff;
}
.buy-bar-sim.done {
background: #233242;
color: #fff;
}
.buy-bar-extra.done {
background: #233242;
color: #fff;
}
.popover { width:400px; max-width:90%; }
/*-----------------------------------------------------------------------------------*/
/*	SHOPPING CART
/*-----------------------------------------------------------------------------------*/
.cart_item_row {
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
.cart_item_row.highlight {
background: #ff0000;
}
#customerDeets input[type='text'] {
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
#customerDeets input[type='text'].form-control.error {
border: 1px solid #ff0000;
}
#customerDeets {
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
}
#customerDeets .errorMessage {
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
display: none;
height: 0px;
}
#customerDeets.showError .errorMessage {
display: block;
height: auto;
}
.toggle-info {
color: #233242;
cursor: pointer;
}
.pleaseWait {
width: 100%;
height: 100%;
padding-top: 20%;
display: block;
background: rgba(255,255,255,0.9);
text-align: center;
color: #233242;
position: fixed;
z-index: 9001;
top: 0;
}
.change-country {
display: block;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
background: #141414;
color: #fff;
padding: 10px 10px 40px 9px;
}
.simplans .change-country {
bottom: 55px;
}
/*-----------------------------------------------------------------------------------*/
/*	MEDIA QUERIES
/*-----------------------------------------------------------------------------------
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
body{
margin-top:60px;
}
.hero {
margin-top:60px;
}
.fs_branding, .fs_branding.shrink {
height:60px;
}
.fs_branding .fs_logo, .fs_branding.shrink .fs_logo {
height:auto;
padding: 5px;
}
}*/
@media only screen and (max-device-width : 1024px) {
/* make the nav smaller on scroll */
body {
margin-top: 60px;
}
.hero {
margin-top: 60px;
}
.fs_branding, .fs_branding.shrink {
height: 60px;
}
.fs_branding .fs_logo, .fs_branding.shrink .fs_logo {
height: 50px;
padding: 5px;
}
.navbar-default .navbar-toggle .icon-bar {
background-color: #fff;
}
.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
max-height: 100%;
}
.navbar-collapse.in {
display: inline-block;
}
.tagline {
display: none;
position: absolute;
left: -9999px;
}
/* NAV */
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
color: #fff;
background-color: #0b6ebb;
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
color: #fff;
background-color: #0b6ebb;
}
.navbar-nav .open .dropdown-menu {
background-color: #0b6ebb;
}
.navbar-default .navbar-nav .open .dropdown-menu>li>a {
color: #fff;
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
border-color: #e7e7e7;
background-color: #0b6ebb;
}
}
.titleh1, .titleh2, .titleh3, .titleh4, .titleh5, .titleh6 {
color: inherit;
font-family: inherit;
font-weight: 500;
line-height: 1.1;
}
.titleh1, .titleh2, .titleh3 {
margin-bottom: 10px;
margin-top: 20px;
}
.titleh1 {
font-size: 36px;
margin-bottom: 10px;
margin-top: 20px;
color: inherit;
font-family: inherit;
font-weight: 500;
line-height: 1.1;
}
.titleh3 {
color: #0b6ebb !important;
font-size: 17px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
}
.titleh4 {
color: #0b6ebb;
font-size: 18px;
margin-bottom: 10px;
margin-top: 10px;
font-family: inherit;
font-weight: 500;
line-height: 1.1;
}
.cbp-ig-titleh3 {
color: #0b6ebb !important;
font-size: 17px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
margin-bottom: 10px;
margin-top: 20px;
font-family: inherit;
line-height: 1.1;
}
.panel-titleh4 {
  color: inherit !important;
  font-family: inherit;
  font-size: 16px;
  font-weight: 500 !important;
  line-height: 1.1;
  margin-bottom: 0;
  margin-top: 0;
  text-transform: inherit !important;
}
.hero .titleh4 {
color: #ffffff;
font-size: 2.5rem;
padding-bottom: 1rem;
padding-top: 3rem;
margin-bottom: 10px;
margin-top: 10px;
font-family: inherit;
font-weight: 500;
line-height: 1.1;
}
.hero .titleh2 {
background: rgba(0, 0, 0, 0.3) none repeat scroll 0 0;
color: #ffffff;
font-size: 4rem;
padding: 10px;
text-align: center;
backface-visibility: visible !important;
margin-bottom: 10px;
margin-top: 20px;
font-family: inherit;
font-weight: 500;
line-height: 1.1;
}
