/*Generic Site Styles*/
html {
	height:100%;
}

body {
	min-height:100%;
	-webkit-font-smoothing:antialiased;
	-ms-overflow-style:scrollbar;
	-webkit-text-size-adjust:none;
	-ms-interpolation-mode:bicubic;
}

iframe,
img {
  border:0;
}

a:focus {
  outline:none !important;
}

@media only screen and (max-width:767px) {

	body {
		overflow-x:hidden !important;
	
	}
	
	.container {
		width:100% !important;
        overflow-x:hidden !important;
		padding-left:0;
		padding-right:0;
		margin-left:0;
		margin-right:0;
    }

}

/*This is a fix for mobile users for when you click on a form field, the page zooms in
/*Making all input fields 100% font size, which is 16px, then it wont zoom in*/
@media screen and (-webkit-min-device-pixel-ratio:0) {

	input[type="color"],
	input[type="date"],
	input[type="datetime"],
	input[type="datetime-local"],
	input[type="email"],
	input[type="month"],
	input[type="number"],
	input[type="password"],
	input[type="search"],
	input[type="tel"],
	input[type="text"],
	input[type="time"],
	input[type="url"],
	input[type="week"],
	select:focus,
	textarea,
	.form-control {
		font-size:16px !important;
	}
	
}

input[type="text"]:hover,
input[type="text"]:active,
input[type="text"]:focus,
input[type="email"]:hover,
input[type="email"]:active,
input[type="email"]:focus,
textarea:hover,
textarea:active,
textarea:focus,
select:hover,
select:active,
select:focus {
	outline:none !important;
	box-shadow:none !important;
	border:1px #ccc solid !important;
}

/* Bootstrap Specific */
@-moz-document url-prefix() {
	
	fieldset {
		display:table-cell;
	}

}

.row.no_gutters {
  padding:0;
  margin:0;
}

.row.no_gutters > [class^="col-"],
.row.no_gutters > [class*=" col-"] {
  padding:0;
  margin:0;
}

.hello_world_test {
	background:blue;
	min-height:100px;
	overflow:hidden;
	color:#fff;
}

.hello_world_test h1 {
	font-size:25px;
	margin:0;
	padding:0 0 10px 0;
}

.hello_world_test ul {
	margin-top:0;
	margin-right:0;
	padding-top:0;
	padding-right:0;
	padding-left:18px;
}

.hello_world_test ul li {
	line-height:30px;
}

.hello_world_test ul li a {
	color:#fff;
	text-decoration:underline;
}

/* Utilities Classes */
.css-table {
	display:table;
}

.css-table-cell {
	display:table-cell;
	vertical-align:middle;
}

.align-top {
	vertical-align:top;
}

.align-bottom {
	vertical-align:bottom;
}

.align-middle {
	vertical-align:middle;
}

.list-default {
	padding:0;
	margin:0;
	list-style:none;
}

.list-unstyled {
	padding-left:0;
	list-style:none;
}

.fixed-pos {
	position:fixed;
}

.relative-pos {
	position:relative;
}

.absolute-pos {
	position:absolute;
}

.static-pos {
	position:static;
}

.zindex-1 {
	z-index:1;
}

.zindex-2 {
	z-index:2;
}

.zindex-3 {
	z-index:3;
}

.pin-top-right {
	top:0;
    right:0;
}

.pin-bottom-right {
	bottom:0;
    right:0;
}

/*Typography*/
.bold-type {
	font-weight:bold;
}

.regular-type {
	font-weight:normal;
}

.italic-type {
	font-style:italic;
}

.ell-type {
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.break-word {
	word-wrap:break-word;
}

.no-wrap {
	white-space:nowrap;
}

/* Margins */
.m60 {margin:60px;}
.m55 {margin:55px;}
.m50 {margin:50px;}
.m45 {margin:45px;}
.m40 {margin:40px;}
.m35 {margin:35px;}
.m30 {margin:30px;}
.m25 {margin:25px;}
.m20 {margin:20px;}
.m15 {margin:15px;}
.m10 {margin:10px;}
.m5 {margin:5px;}
.m0 {margin:0;}

.mt60 {margin-top:60px !important;}
.mt55 {margin-top:55px !important;}
.mt50 {margin-top:50px !important;}
.mt45 {margin-top:45px !important;}
.mt40 {margin-top:40px !important;}
.mt35 {margin-top:35px !important;}
.mt30 {margin-top:30px !important;}
.mt25 {margin-top:25px !important;}
.mt20 {margin-top:20px !important;}
.mt15 {margin-top:15px !important;}
.mt10 {margin-top:10px !important;}
.mt5 {margin-top:5px !important;}
.mt0 {margin-top:0;}

.mb60 {margin-bottom:60px;}
.mb55 {margin-bottom:55px;}
.mb50 {margin-bottom:50px;}
.mb45 {margin-bottom:45px;}
.mb40 {margin-bottom:40px;}
.mb35 {margin-bottom:35px;}
.mb30 {margin-bottom:30px;}
.mb25 {margin-bottom:25px;}
.mb20 {margin-bottom:20px;}
.mb15 {margin-bottom:15px;}
.mb10 {margin-bottom:10px;}
.mb5 {margin-bottom:5px;}
.mb0 {margin-bottom:0;}

/* Paddings */
.p60 {padding:60px;}
.p55 {padding:55px;}
.p50 {padding:50px;}
.p45 {padding:45px;}
.p40 {padding:40px;}
.p35 {padding:35px;}
.p30 {padding:30px;}
.p25 {padding:25px;}
.p20 {padding:20px;}
.p15 {padding:15px;}
.p10 {padding:10px;}
.p5 {padding:5px;}
.p0 {padding:0;}

.pt60 {padding-top:60px;}
.pt55 {padding-top:55px;}
.pt50 {padding-top:50px;}
.pt45 {padding-top:45px;}
.pt40 {padding-top:40px;}
.pt35 {padding-top:35px;}
.pt30 {padding-top:30px;}
.pt25 {padding-top:25px;}
.pt20 {padding-top:20px;}
.pt15 {padding-top:15px;}
.pt10 {padding-top:10px;}
.pt5 {padding-top:5px;}
.pt0 {padding-top:0;}

.pb60 {display:block;padding-bottom:60px;}
.pb55 {display:block;padding-bottom:55px;}
.pb50 {display:block;padding-bottom:50px;}
.pb45 {display:block;padding-bottom:45px;}
.pb40 {display:block;padding-bottom:40px;}
.pb35 {display:block;padding-bottom:35px;}
.pb30 {display:block;padding-bottom:30px;}
.pb25 {display:block;padding-bottom:25px;}
.pb20 {display:block;padding-bottom:20px;}
.pb15 {display:block;padding-bottom:15px;}
.pb10 {display:block;padding-bottom:10px;}
.pb5 {display:block;padding-bottom:5px;}
.pb0 {display:block;padding-bottom:0;}

/*
==========  Mobile First Method  ==========

Custom, iPhone Retina 
@media only screen and (min-width:320px) {}

Extra Small Devices, Phones 
@media only screen and (min-width:480px) {}

Small Devices, Tablets
@media only screen and (min-width:768px) {}

Medium Devices, Desktops
@media only screen and (min-width:992px) {}

Large Devices, Wide Screens
@media only screen and (min-width:1200px) {}
    
==========  Non-Mobile First Method  ==========

Large Devices, Wide Screens
@media only screen and (max-width:1200px) {}

Medium Devices, Desktops
@media only screen and (max-width:992px) {}

Small Devices, Tablets
@media only screen and (max-width:768px) {}

Extra Small Devices, Phones
@media only screen and (max-width:480px) {}

Custom, iPhone Retina
@media only screen and (max-width:320px) {}
*/

/*
==========  Additional CSS Media Queries  ==========

Smartphones (portrait and landscape)
@media only screen
and (min-device-width:320px)
and (max-device-width:480px) {}
 
Smartphones (landscape)
@media only screen
and (min-width:321px) {}
 
Smartphones (portrait)
@media only screen
and (max-width:320px) {}
 
iPads (portrait and landscape)
@media only screen
and (min-device-width:768px)
and (max-device-width:1024px) {}
 
iPads (landscape)
@media only screen
and (min-device-width:768px)
and (max-device-width:1024px)
and (orientation : landscape) {}
 
iPads (portrait)
@media only screen
and (min-device-width:768px)
and (max-device-width:1024px)
and (orientation : portrait) {}
 
Desktops and laptops
@media only screen
and (min-width:1224px) {}
 
Large screens
@media only screen
and (min-width:1824px) {}
 
iPhone 5 (portrait & landscape)
@media only screen
and (min-device-width:320px)
and (max-device-width:568px) {}
 
iPhone 5 (landscape)
@media only screen
and (min-device-width:320px)
and (max-device-width:568px)
and (orientation : landscape) {}
 
iPhone 5 (portrait)
@media only screen
and (min-device-width:320px)
and (max-device-width:568px)
and (orientation : portrait) {}
*/