﻿html, body{
    height:100%;
}

* {
  padding: 0;
  margin: 0; }

.content {
  background-color: #ffffff !important; }

div.android {
  float: left;
  display: inline; }

.android img {
  width: 350px; }

div.samsung {
  float: left;
  display: inline; }

.samsung img {
  width: 350px; margin-left:15px; }

div.android-Landscape {
  float: left;
  display: inline; }

.android-Landscape img {
  width: 550px; }

.navbar.navbar-default {
    background: url('../../Images/header-banner - Copy.png') #090C13 no-repeat bottom right !important;
    /*background:  #394263  !important;*/
}

.one-third {
  width: 30%;
  margin-right: 5%;
  float: left;
  background-color: red; }

.one-third-second {
  background-color: yellow; }

.one-third-last {
  background-color: green;
  margin-right: 0; }

.rmm {
  display: none !important; }

.panel-sbinfo {
    float:left; width:20%;padding-left:20px; padding-right:40px;
}

.panel-sbinfo-image{
    float:left; width:80%;
}

panel-sbinfo2 {
    float:left; width:100%;;
}

.web-stats.success {
    height: 80px; background-color: #ffffff; padding: 10px; border-top-right-radius: 5px; border-bottom-right-radius: 5px;
}

.web-stats.success.first {border-left: 4px solid lightblue;}
.web-stats.success.second {border-left: 4px solid #0099FF;}
.web-stats.success.third {border-left: 4px solid #4AB7FF;}
.web-stats.success.fourth {border-left: 4px solid lightblue;}

.mini-graph.success.first { background-color:lightblue; }
.mini-graph.success.second { background-color:#0099FF; }
.mini-graph.success.third { background-color:#4AB7FF; }
.mini-graph.success.fourth { background-color:lightblue; }

.panel panel-default{ border-radius: 10px; border-color: #efefef; border-collapse: collapse;}
.panel-heading { background: url('../../Images/header-banner - Copy.png') #090C13 no-repeat bottom right; border-color: #efefef; height: 40px; }
.panel-body { margin: 20px; }

.panel-body.grey { margin: 20px; background-color: #EFEFEF !important; }

h1{ font-size:24px !important; margin-bottom:20px !important; }
h2{ color:white !important; margin:0 0 10px 0 !important; padding:0 !important; font-size:18px !important; }
p{ display: block !important;
    margin-top: 1em !important;
    margin-bottom: 1em !important;
    margin-left: 0 !important;
    margin-right: 0 !important;}

.SmallGraph {  padding: 5px; display: inline-block; width: 69px; height: 40px; vertical-align: top; }
.sbpanel-image{ width:100%; border-radius: 10px; }


@media only screen and (max-width : 1642px) {
      .android img {
  width: 250px; }

      .samsung img {
  width: 250px; margin-top:10px; }
}


@media only screen and (max-width : 1238px) {

    div.android {
    clear:both; 
    }

   .android img {
    width: 250px; 
   }

   div.samsung {
    clear:both; 
    }

   .samsung img {
    width: 250px; 
   }
    .col-md-3 {
        width:100% !important;
        margin-bottom:5px;
    }

    .panel-sbinfo {
        padding:0;
        width:100%;
    }

    .panel-sbinfo-image{
        padding:10px 0 0 0;
        width:100%;
    }
}


/* 360px Samsung Galaxy S4 http://i-skool.co.uk/mobile-development/web-design-for-mobiles-and-tablets-viewport-sizes/ */
@media screen and (max-width: 360px){
      .android img {
    width: 250px; }

       .samsung img {
    width: 250px; }

}
