

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
   
.wow {
   visibility: hidden;
}

body {
    padding-top: 50px; /* set this equal to navbar's height */
    font-family: "Helvetica Neue","Open Sans",Arial,sans-serif;
	background: #87e0fd;
}
   
   html,body {
height:100%;
}

.section{
padding-bottom:35px;
padding-top:50px;
}

.header-text{
padding-left:10px;
font-size:2.4em;
}

h1, h2, h3 {
text-align: center;
}

h1, h2, h3, p{
padding:10px;
}

h1{
padding-bottom:30px;
font-size:2.1em;
}

h2{
padding-bottom:50px;
font-size:1.5em;
max-width:95%;
margin:0 auto;
}

#MSCnav{
background:rgb(26, 26, 26);
background:rgba(26, 26, 26,.85);
border:none;
}

#MSCnav a{
color:white;
}

#MSCnav a:hover{
color:#737373;
}


#navbrand{
padding-top:5px;
}

#logo{
height:40px;
}

.jumbotron {
min-height:105%;
padding-top: 10%;
padding-bottom: 0%;
/*background: rgba(0, 0, 0, 0) url("../img/hero.jpg") no-repeat scroll left top / cover ;*/
background:none;

margin-bottom:0px;
}

nav{
border:none;
}

.bigdiv{
color:white;
background: #00c7f9;
background: -moz-linear-gradient(top, #00c7f9 0%, #0794ed 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00c7f9), color-stop(100%,#0794ed));
background: -webkit-linear-gradient(top, #00c7f9 0%,#0794ed 100%);
background: -o-linear-gradient(top, #00c7f9 0%,#0794ed 100%);
background: -ms-linear-gradient(top, #00c7f9 0%,#0794ed 100%);
background: linear-gradient(to bottom, #00c7f9 0%,#0794ed 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00c7f9', endColorstr='#0794ed',GradientType=0 );
}

#topimg{
display:block;
max-width:389px;
max-height:389px;
width: 70% !important;
height: auto !important;
margin-left:20%;
}

#inner{
padding:10px;
background: rgb(0, 0, 0); /* Fall-back for browsers that don't support rgba */
background: rgba(0,0,0, .3);
}

#inner h2{
max-width: 90%;
}

.img-circle, #apps img {
    display:block;
    margin:auto;
	max-width:90%;
}

.fa-linkedin-square{
font-size:2em;
}


.social-buttons{
 text-align:center;
}

.ui-widget-header{
border: 1px solid #fff;
background: #03B3F4 url("images/ui-bg_gloss-wave_35_f6a828_500x100.png") repeat-x scroll 50% 50%;
}

.ui-dialog, .ui-button-text, .ui-state-active{
outline-width: 0px !important;
}

.ui-state-hover, .ui-state-focus, .ui-widget-content, .ui-widget-header{
outline-width: 0px !important;
color: #1c94c4;
}

#clients p{
text-align:center;
}

#clients img{
max-height:100px;
padding-bottom:20px;
}

#rice {
    background: rgba(0, 0, 0, 0) url("../img/riceubig.png") no-repeat scroll left top / cover ;
    width: 90%;
	margin-left: 5%;
}

#rice h1{
    font-size:1.8em;
}

.riceOverlay {
    background: rgb(0, 0, 0); /* Fall-back for browsers that don't support rgba */
    background: rgba(0,0,0, .3);
    margin-top: 40px;
    padding: 5px;
	padding-top: 95px;
    position: relative;
    top: 50%;
    transform: translateY(+10%);
    width: 98%;
	color:white;
}

#ricetext{
max-width:100%;
}

/* The ribbons */

.box {
  width: 200px; height: 300px;
  position: relative;
  border: 1px solid #BBB;
  background: #EEE;
}
.ribbon {
  position: absolute;
  left: -5px; top: -5px;
  z-index: 1;
  overflow: hidden;
  width: 175px; height: 175px;
  text-align: right;
}
.ribbon span {
  font-size: 10px;
  font-weight: bold;
  color: #FFF;
  text-transform: uppercase;
  text-align: center;
  line-height: 40px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  width: 200px;
  display: block;
  background: #2561AA;
  background: linear-gradient(#2561AA 0%, #2561AA 100%);
  box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
  position: absolute;
  top: 39px; left: -41px;
}
	
.ribbon span::before {
  content: "";
  position: absolute; left: 0px; top: 100%;
  z-index: -1;
  border-left: 3px solid #1e5799;
  border-right: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #1e5799;
}
.ribbon span::after {
  content: "";
  position: absolute; right: 0px; top: 100%;
  z-index: -1;
  border-left: 3px solid transparent;
  border-right: 3px solid #1e5799;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #1e5799;
}

#app1{
	max-height:300px;
}

#app2{
	max-height:200px;
}

#app3{
	max-height:250px;
}

.buttons{
	display:block;
	text-align:center;
}

.btn{
	margin-bottom:20px;
}

#actionbtn{
	display:block;
	text-align:center;
}

#footer {
	right:10%;
    bottom:0px;
	text-align:right;
	padding-bottom:40px;
}

.footspan{
    margin-right:30px;
	text-decoration:none;
	color: #337ab7;
}
.footspan a:hover {
	text-decoration:none;
}

/*Privacy Page*/

#privacy-container{
	text-align:left;
	height: auto !important;
    margin: 0 auto -40px;
    min-height: 255px;
    width: 95%;
    padding-bottom:100px;
}

#prilogo{
max-width:90%;
margin: 0 auto;
display:block;
}

#pribody{
background:#0794ed;
color:white;
}



#privacy-container h1{
	padding:10px;
	font-size:1.8em;
}

#privacy-container h2{
	padding:10px;
}

#privacy-container p{
	padding:10px;
}

#linkr{
	font-size:.8em;
}

.Title{
	font-size:2em;
	padding:10px;
	font-weight:bold;
	text-align:center;
}

.footer {
	width:100%;
	text-align:center;
	position:relative;
	font-size:1.3em;
}

#credits {
	margin-top:10px;
	font-size:.8em;
}

*{    
    outline:none;
}

.ui-dialog { z-index: 1000 !important ;}

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 480px) {

/* ====================
    INTERMEDIATE
   ==================== */
	h1{
	padding-bottom:30px;
	font-size:2.8em;
	}
	
	.section{
	padding-bottom:75px;
	padding-top:50px;
	}
	
	#rice h1{
    font-size:2.8em;
	}
   
   #clients img{
	max-height:150px;
	}
	
	.riceOverlay {
    padding: 45px;
	}
	
	.topgif{
	width:400px;
	height:136px;
	}
	
	#announcement .container{
	width:70%;
	}

	#inner{
	padding:20px;
	}
   
}

@media only screen and (min-width: 768px) {

/* ====================
    WIDE
   ==================== */
   h2{
	max-width:60%;
	}
	
	.topgif{
	width:570px;
	height:194px;
	margin-top:25px;
	}
   
}