/*
========================
  CODEGUARD GRID SYSTEM CSS v1.0.0
  http://codeguard.com/

  CODEGUARD CSS is a framework to create
  grid-based layouts.

  grid settings:
  	columns: 12
  	column width: 81px
  	column margin: 28px
  	container margin: 0px

=========================
*/
* { /* quick reset */
	margin: 0;
}

.container_12 {
	margin: 0 auto;
	position: relative;
	max-width: 1280px;

	-webkit-font-smoothing: antialiased
    -moz-osx-font-smoothing: grayscale
    font-smoothing: antialiased
}

* html .container_12 { /* Clearing nicely for IE6. */
	width:expression(((document.compatMode && document.compatMode=='CSS1Compat') ? document.documentElement.clientWidth : document.body.clientWidth) > 1282 ? "1280px" :  "auto");
}

.cg_container {
	clear: both;
	float: left;
	width: 100%;
	margin-bottom: 40px
}
.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {
	clear: none;
	display: block;
	float: left;
	margin-bottom: 10px;
	margin-right:2.1875%;
	padding: 0;
	position: relative;
}
 .grid_1 {
	width: 6.32812%;
}
.grid_2 {
	width: 14.84375%;
}
.grid_3 {
	width: 23.35937%;
}
.grid_4 {
	width: 31.87499%;
}
.grid_5 {
	width: 40.39062%;
}
.grid_6 {
	width: 48.90625%;
}
.grid_7 {
	width: 57.42187%;
}
.grid_8 {
	width: 65.9375%;
}
.grid_9 {
	width: 74.45312%;
}
.grid_10 {
	width: 82.96875%;
}
.grid_11 {
	width: 91.48437%;
}
.grid_12 {
	width: 100%;
	margin-right: 0;
}
 .grid_12 .grid_1 {
	width: 6.32812%;
	margin-right: 2.1875%;
}
.grid_12 .grid_2 {
	width: 14.84375%;
	margin-right: 2.1875%;
}
.grid_12 .grid_3 {
	width: 23.35937%;
	margin-right: 2.1875%;
}
.grid_12 .grid_4 {
	width: 31.87499%;
	margin-right: 2.1875%;
}
.grid_12 .grid_5 {
	width: 40.39062%;
	margin-right: 2.1875%;
}
.grid_12 .grid_6 {
	width: 48.90625%;
	margin-right: 2.1875%;
}
.grid_12 .grid_7 {
	width: 57.42187%;
	margin-right: 2.1875%;
}
.grid_12 .grid_8 {
	width: 65.9375%;
	margin-right: 2.1875%;
}
.grid_12 .grid_9 {
	width: 74.45312%;
	margin-right: 2.1875%;
}
.grid_12 .grid_10 {
	width: 82.96875%;
	margin-right: 2.1875%;
}
.grid_12 .grid_11 {
	width: 91.48437%;
	margin-right: 2.1875%;
}
.grid_12 .grid_12 {
	width: 100%;
	margin-right: 0;
}
.grid_11 .grid_1 {
	width: 6.91716%;
	margin-right: 2.39111%;
}
.grid_11 .grid_2 {
	width: 16.22544%;
	margin-right: 2.39111%;
}
.grid_11 .grid_3 {
	width: 25.53373%;
	margin-right: 2.39111%;
}
.grid_11 .grid_4 {
	width: 34.84201%;
	margin-right: 2.39111%;
}
.grid_11 .grid_5 {
	width: 44.15029%;
	margin-right: 2.39111%;
}
.grid_11 .grid_6 {
	width: 53.45858%;
	margin-right: 2.39111%;
}
.grid_11 .grid_7 {
	width: 62.76686%;
	margin-right: 2.39111%;
}
.grid_11 .grid_8 {
	width: 72.07514%;
	margin-right: 2.39111%;
}
.grid_11 .grid_9 {
	width: 81.38343%;
	margin-right: 2.39111%;
}
.grid_11 .grid_10 {
	width: 90.69171%;
	margin-right: 2.39111%;
}
.grid_11 .grid_11 {
	width: 100%;
	margin-right: 0;
}
.grid_10 .grid_1 {
	width: 7.62711%;
	margin-right: 2.63653%;
}
.grid_10 .grid_2 {
	width: 17.89077%;
	margin-right: 2.63653%;
}
.grid_10 .grid_3 {
	width: 28.15442%;
	margin-right: 2.63653%;
}
.grid_10 .grid_4 {
	width: 38.41807%;
	margin-right: 2.63653%;
}
.grid_10 .grid_5 {
	width: 48.68173%;
	margin-right: 2.63653%;
}
.grid_10 .grid_6 {
	width: 58.94538%;
	margin-right: 2.63653%;
}
.grid_10 .grid_7 {
	width: 69.20903%;
	margin-right: 2.63653%;
}
.grid_10 .grid_8 {
	width: 79.47269%;
	margin-right: 2.63653%;
}
.grid_10 .grid_9 {
	width: 89.73634%;
	margin-right: 2.63653%;
}
.grid_10 .grid_10 {
	width: 100%;
	margin-right: 0;
}
.grid_9 .grid_1 {
	width: 8.49947%;
	margin-right: 2.93809%;
}
.grid_9 .grid_2 {
	width: 19.93704%;
	margin-right: 2.93809%;
}
.grid_9 .grid_3 {
	width: 31.3746%;
	margin-right: 2.93809%;
}
.grid_9 .grid_4 {
	width: 42.81217%;
	margin-right: 2.93809%;
}
.grid_9 .grid_5 {
	width: 54.24973%;
	margin-right: 2.93809%;
}
.grid_9 .grid_6 {
	width: 65.6873%;
	margin-right: 2.93809%;
}
.grid_9 .grid_7 {
	width: 77.12486%;
	margin-right: 2.93809%;
}
.grid_9 .grid_8 {
	width: 88.56243%;
	margin-right: 2.93809%;
}
.grid_9 .grid_9 {
	width: 100%;
	margin-right: 0;
}
.grid_8 .grid_1 {
	width: 9.59715%;
	margin-right: 3.31753%;
}
.grid_8 .grid_2 {
	width: 22.51184%;
	margin-right: 3.31753%;
}
.grid_8 .grid_3 {
	width: 35.42654%;
	margin-right: 3.31753%;
}
.grid_8 .grid_4 {
	width: 48.34123%;
	margin-right: 3.31753%;
}
.grid_8 .grid_5 {
	width: 61.25592%;
	margin-right: 3.31753%;
}
.grid_8 .grid_6 {
	width: 74.17061%;
	margin-right: 3.31753%;
}
.grid_8 .grid_7 {
	width: 87.0853%;
	margin-right: 3.31753%;
}
.grid_8 .grid_8 {
	width: 100%;
	margin-right: 0;
}
.grid_7 .grid_1 {
	width: 11.0204%;
	margin-right: 3.80952%;
}
.grid_7 .grid_2 {
	width: 25.85034%;
	margin-right: 3.80952%;
}
.grid_7 .grid_3 {
	width: 40.68027%;
	margin-right: 3.80952%;
}
.grid_7 .grid_4 {
	width: 55.5102%;
	margin-right: 3.80952%;
}
.grid_7 .grid_5 {
	width: 70.34013%;
	margin-right: 3.80952%;
}
.grid_7 .grid_6 {
	width: 85.17006%;
	margin-right: 3.80952%;
}
.grid_7 .grid_7 {
	width: 100%;
	margin-right: 0;
}
.grid_6 .grid_1 {
	width: 12.93929%;
	margin-right: 4.47284%;
}
.grid_6 .grid_2 {
	width: 30.35143%;
	margin-right: 4.47284%;
}
.grid_6 .grid_3 {
	width: 47.76357%;
	margin-right: 4.47284%;
}
.grid_6 .grid_4 {
	width: 65.17571%;
	margin-right: 4.47284%;
}
.grid_6 .grid_5 {
	width: 82.58785%;
	margin-right: 4.47284%;
}
.grid_6 .grid_6 {
	width: 100%;
	margin-right: 0;
}
.grid_5 .grid_1 {
	width: 15.66731%;
	margin-right: 5.41586%;
}
.grid_5 .grid_2 {
	width: 36.75048%;
	margin-right: 5.41586%;
}
.grid_5 .grid_3 {
	width: 57.83365%;
	margin-right: 5.41586%;
}
.grid_5 .grid_4 {
	width: 78.91682%;
	margin-right: 5.41586%;
}
.grid_5 .grid_5 {
	width: 100%;
	margin-right: 0;
}
.grid_4 .grid_1 {
	width: 19.85294%;
	margin-right: 6.86274%;
}
.grid_4 .grid_2 {
	width: 46.56862%;
	margin-right: 6.86274%;
}
.grid_4 .grid_3 {
	width: 73.28431%;
	margin-right: 6.86274%;
}
.grid_4 .grid_4 {
	width: 100%;
	margin-right: 0;
}
.grid_3 .grid_1 {
	width: 27.0903%;
	margin-right: 9.36454%;
}
.grid_3 .grid_2 {
	width: 63.54515%;
	margin-right: 9.36454%;
}
.grid_3 .grid_3 {
	width: 100%;
	margin-right: 0;
}
.grid_2 .grid_1 {
	width: 42.63157%;
	margin-right: 14.73684%;
}
.grid_2 .grid_2 {
	width: 100%;
	margin-right: 0;
}
.grid_1 .grid_1 {
	width: 100%;
	margin-right: 0;
}
 .grid_12 .last-col {
	margin-right: 0;
}
.grid_11 .last-col {
	margin-right: 0;
}
.grid_10 .last-col {
	margin-right: 0;
}
.grid_9 .last-col {
	margin-right: 0;
}
.grid_8 .last-col {
	margin-right: 0;
}
.grid_7 .last-col {
	margin-right: 0;
}
.grid_6 .last-col {
	margin-right: 0;
}
.grid_5 .last-col {
	margin-right: 0;
}
.grid_4 .last-col {
	margin-right: 0;
}
.grid_3 .last-col {
	margin-right: 0;
}
.grid_2 .last-col {
	margin-right: 0;
}
.grid_1 .last-col {
	margin-right: 0;
}
.clear { /* Useful generic clearing class. */
	clear: both;
}
.last-col {
	margin-right: 0;
}

.align-right {
	text-align: right;
}

.align-left {
	text-align: left;
}

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

@media only screen and (max-width: 992px) {
 .container_12 {
    width: 95%;
  }
  .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {
    clear: both;
    display: block;
    float: none;
    width: 100%;
    margin: 20px 0;
  }
  .align-right, .align-left, .align-center {
  	text-align: left;
  }
}
@media (min-width: 768px) {
  .container_12 {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container_12 {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container_12 {
    width: 95%;
  }
}
@media (min-width: 1400px) {
  .container_12 {
    width: 1280px; 
  }
}

	/*
	Max width before this PARTICULAR table gets nasty
	This query will take effect for any screen smaller than 760px
	and also iPads specifically.
	*/
	@media only screen and (max-width: 1024px) {

		/* Force table to not be like tables anymore */
		table, thead, tbody, th, td, tr {
			/*display: block;*/
		}

		tr { border: 1px solid #ccc; }

		td {
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #eee;
			position: relative;
			padding-left: 50%;
			word-break: initial;
		}

		h1, .add_db_now h2 {
		    font-size: 24px;
		    font-weight: 400;
		}

		h2.subtitle {
		    font-size: 16px;
		}

		h2 {
		    font-size: 16px;
		}

		h3, aside h1 {
		    font-size: 16px;
		}

		p {
		    font-size: 14px;
		}

		dl dt, dl dd {
		    float: none;
		}

		.legend {
		    text-align: center;
		    float: none;
		}

		.footer_nav {
		    margin-top: -70px;
		    text-align: center;
		}

		footer[role="contentinfo"] p.copyright {
		    float: none;
		    text-align: center;
		    width: 100%;
		}

		.grid_6 .grid_2{
		    display: block;
		    width: 100%;
		}

		.actiona .a_contain .show,
		.actiona .a_contain .hide,
		.actionth,
		.hidestatusth,
		.graphtitle_1 .comliheader,
		.graphtitle_2 .comliheader,
		.percent,
		.number1,
		.number2,
		.backup_stats_graphs .g #website_graph,
		.g.websiteGraph.grid_4.last-col.numwrapper,
		.backup_stats_graphs .g #database_graph,
		.backup_stats_graphs .graph_under,
		.g.dbGraph.grid_4.last-col.numwrapper,
		.g.g_no_databases
		 {
			display: none !important;
			visibility: hidden !important;
		}

		.actiona ul {
		    margin-left: 0px;
		}

		.action_top {
		    height: 70px;
		}

		.grid_6.dgraph_1, .grid_6.dgraph_2{
		    clear: initial;
		    display: inline-table;
		    width: 46%;
		    min-height: auto;
    		padding: 0;
		}

		.grid_6.dgraph_1{
		    margin-right: 10px;
		}

		.grid_6.dgraph_2{
		    margin-left: 10px;
		}

		.actiona .a_contain {
			width: 85px !important;
		}

		.site-list {
		    font-size: 14px;
		}

		.site-list tbody td {
		    padding: 10px;
		}

		.site-list .site-database td.DatabaseBackup {
			padding-left: 50px;
		}

		.addnewsite .addnewsite_copy {
		    padding: 0;
		}

		#context {
		    padding: 0;
		    min-height: auto;
		}

		#context dl#health {
		    position: absolute;
		    text-align: left;
		    top: 66px;
		    width: 100%;
		}

		#context dl#health dt {
		    font-size: 20px;
    		font-weight: 600;
		}

		div.current_website {
		    float: none;
		    padding-top: 0;
		    text-align: left;
		    margin: 0;
		}

		div.current_website h3 {
		    display: inline-block;
		    float: none;
		    margin: 0 auto;
		    padding: 0;
		    text-align: left;
		    width: 100%;
		}

		div.current_website a.request_backup_button {
		    margin-top: 0;
		}

		div.current_website h3 em, div.current_website aside h1 em, aside div.current_website h1 em, div.current_website h3 sub, div.current_website aside h1 sub, aside div.current_website h1 sub {
		    display: inline-table;
		    float: none;
		}

		div.current_website h3 sub, div.current_website aside h1 sub, aside div.current_website h1 sub {
		    bottom: 0;
		    top: 0;
		}

		nav#website {
		    text-align: left;
		    width: 100%;
		    position: absolute;
    		top: 95px;
		}

		nav#website a {
		    font-size: 14px;
		    min-width: auto;
		    padding: 0 10px;
		}

		nav#website a.current::after {
		    width: auto;
		}

		.add_a_site_new {
		    margin-bottom: 15px;
		    width: 100%;
		}

		.add_button_new {
		    clear: both;
		    float: none;
		    margin-bottom: 0;
		    margin-top: 0;
		    position: relative;
		}

		ol.history li {
		    padding-bottom: 10px;
		    padding-top: 10px;
		}

		ol.history .empty, ol.history .actions {
		    text-align: left;
		}

		.cg_wizards li {
			display: inline-table !important;
		    padding-right: 20px !important;
		    padding-bottom: 20px;
		    width: 30%;
		}

		.cg_wizards .step {
		    font-size: 12px !important;
		    letter-spacing: 0px !important;
		}

		.db_step1_aside, .db_step3_aside {
		    width: 100% !important;
		    margin-bottom: 15px;
		}

		.wizardactions {
		    text-align: center !important;
		}

		.right_helpful_tips, .wp_helpful_tips {
		    width: 100% !important;
		}

		hr.wizardhr {
		    margin-top: 0px;
		}

		.website_search #search {
		    width: 72%;
		    margin-bottom: 15px;
		}

		form input#search {
		    width: 89%;
		}

	}


	/* Laptops (MDPI & Touch screen portrait and landscape) ----------- */
	@media only screen and (min-width: 1200px) and (max-width: 1280px) {

		form input#search {
		    width: 91%;
		}

	}

	/* Smartphones (portrait and landscape) ----------- */
	@media only screen and (min-width: 320px) and (max-width: 480px) {
		body {
			padding: 0;
			margin: 0;
		}

		.actiona .a_contain {
			width: 67px !important;
			height: 40px !important;
		}

		.actiona ul {
			font-size: 12px;
		    margin-left: 0px;
		    width: 100px;
		}

		.actiona ul a {
		    padding: 12px 0px;
		}

		.site-list {
		    font-size: 12px;
		}

		.site-list thead th {
		    padding: 12px;
		}

		.site-list .site-database td.DatabaseBackup {
			padding-left: 35px;
		}

		.cg_wizards li {
			display: inline-table !important;
		    padding-right: 20px !important;
		    padding-bottom: 20px;
		    width: 30%;
		}

		.cg_wizards .step {
		    font-size: 12px !important;
		    letter-spacing: 0px !important;
		}

		hr.wizardhr {
		    margin-top: 0px;
		}

		.website_search #search {
		    width: 64%;
		    margin-bottom: 15px;
		}

		form input#search {
		    width: 67%;
		}

		.right_helpful_tips, .wp_helpful_tips {
		    width: 100% !important;
		}
	}

	/* iPad Mini, iPad (portrait and landscape) ----------- */
	@media only screen and (min-width: 768px) and (max-width: 1023px) {
		body {
			width: 100%;
		}

		.actiona .a_contain {
			width: 85px !important;
		}

		.site-list .site-database td.DatabaseBackup {
			padding-left: 50px;
		}

		.right_helpful_tips, .wp_helpful_tips {
		    width: 100% !important;
		}

		.site-list thead th {
		    padding: 12px;
		}

		.cg_wizards li {
			display: inline-table !important;
		    padding-right: 20px !important;
		    padding-bottom: 20px;
		    width: 30%;
		}

		.cg_wizards .step {
		    font-size: 12px !important;
		    letter-spacing: 0px !important;
		}

		hr.wizardhr {
		    margin-top: 0px;
		}

		form input#search {
		    width: 87%;
		}
	}

	/* iPad Pro (landscape) ----------- */
	@media only screen and (min-width: 1300px) and (max-width: 1366px) {
		body {
			width: 100%;
		}

		.actiona .a_contain {
			width: 85px !important;
		}

		.site-list .site-database td.DatabaseBackup {
			padding-left: 40px;
		}

		.right_helpful_tips, .wp_helpful_tips {
		    width: 100% !important;
		}

		.site-list thead th {
		    padding: 12px;
		}

		.cg_wizards li {
			display: inline-table !important;
		    padding-right: 20px !important;
		    padding-bottom: 20px;
		    width: 30%;
		}

		.cg_wizards .step {
		    font-size: 12px !important;
		    letter-spacing: 0px !important;
		}

		hr.wizardhr {
		    margin-top: 0px;
		}

		.backup_stats_graphs .graph_under {
		    margin-left: 30px;
		}
	}