@charset "utf-8";

/* google webfont open sans */
 @import url(http://fonts.googleapis.com/css?family=Open+Sans:regular,600,700);

/* body layout */


/* Targets all elements */
[class*='col-'] {
	float: left;
	padding: 0;
	margin: 0;
}

/* Clearfix */
.frame:after {
	content: "";
	display: table;
	clear: both;
}

/* flexible grid system */
#flat_menu .col-1 { width: 100%; }
#flat_menu .col-2 { width: 50%; }
#flat_menu .col-3 { width: 33.33%; }
#flat_menu .col-4 { width: 25%; }
#flat_menu .col-5 { width: 20%; }
#flat_menu .col-6 { width: 16.6666666667%; }
#flat_menu .col-7 { width: 14.2857142857%; }
#flat_menu .col-8 { width: 12.5%; }
#flat_menu .col-9 { width: 11.1111111111%; }
#flat_menu .col-10 { width: 10%; }
#flat_menu .col-11 { width: 9.09090909091%; }
#flat_menu .col-12 { width: 8.33%; }

#flat_menu>a {
  text-transform: uppercase;
}

/* Removes padding, margin behavior */
#flat_menu ul,
#flat_menu li,
#flat_menu #submenu a {
	margin: 0;
	padding: 0;
	display: block;
	list-style: none;
	text-decoration: none;
  color: #274a9e;
}

#flat_menu #submenu li:hover a {
  color: #444;
}

/* flat menu layout */

/* menu parent unorder list position absolute */
#flat_menu > ul { position: absolute; }

/* submenu layout */
#flat_menu #submenu {
  left: 0;
  top: 44px;
  width: 100%;
  padding: 0 !important;
  overflow: hidden;
	background: #fff;
	position: absolute;
	z-index: 999;
	min-width: 200px;
	visibility: hidden;
	opacity: 0;
  border: 2px solid #000;
}

/* h1 tag layout */
#flat_menu #submenu h1 {
	font-size: large;
	color: #34495e;
	font-weight: bold;
	text-transform: uppercase;
	margin: 14px 22px 20px;
	border-bottom: 1px solid rgba(221,226,230,0.50);
	padding-bottom: 8px;
	position: relative
}

/* h2 tag layout */
#flat_menu #submenu h2 {
	margin: 21px 0px 0px 10%;
	padding: 0px;
	font-weight: bold;
	text-transform: uppercase;
	font-size: medium;
	color: #6E6E6E;
}

/* h3 tag layout */
#flat_menu #submenu h3 {
	padding: 0px;
	margin: 0px;
}

/* align-center + align-right + align-left class only for h2 */
#flat_menu .align-center h2 {margin-left: 0px !important;text-align: center;}
#flat_menu .align-right h2 { text-align: right; }
#flat_menu .align-left h2 {text-align: left;margin-left: 0px !important;}

/* float-left + float-right class for float the elements */
#flat_menu .float-left { float: left !important }
#flat_menu .float-right { float: right !important }
#flat_menu #submenu #submenu {
	position: absolute;
	left: 100%;
	top: -19px;
}

/* table layout */
#flat_menu table {
	border: 1px solid #E0E0E0;
	border-radius: 5px;
	overflow: hidden;
	margin: 16px 16px 16px 10%;
	border-spacing: 0px 0px;
	position: relative;
	width: 80%;
	overflow:hidden;
}

/* table td, th layout */
#flat_menu table td,th {
	border-bottom: 1px solid #E0E0E0;
	padding: 2.5% 18px 2.5% 2.5%;
	font-size: 14px;
	text-indent: -2px;
	color: #3E3E3E;
}

/* table td hover effect */
#flat_menu table td:hover { background: #f0f0f0 }

/* fontawesome icons layout with in table */
#flat_menu table td i {
	position: relative;
	left: -12px;
	top: 0px;
}

/* a tag layout with in table */
#flat_menu table td a {
	display: inline-block;
	color: #34495e;
}

/* input + textarea layout */
#flat_menu input,textarea {
	border: none;
	padding: 10px;
	border-radius: 5px;
	margin: 17px 16px -9px 10%;
	width: 72%;
	color: rgba(104,104,104,1.00);
	background-color: rgba(0,0,0,0.02);
	border: 1px solid #E0E0E0;
}

/* textarea layout */
#flat_menu textarea { min-height: 100px; }

/* submit button layout */
#flat_menu input[type="submit"] {
	margin-top: 27px;
	margin-right: 44px;
	margin-bottom: 31px;
	width: 26%;
	cursor: pointer;
	-webkit-box-shadow: 2px 2px rgba(0,0,0,0.30);
	box-shadow: 2px 2px rgba(0,0,0,0.30);
	font-size: large;
	padding: 7px;
	border:none;
	background: #34495e;
	color: #FFFFFF
}

/* submit button hover effect */
#flat_menu input[type="submit"]:hover { background: #1abc9c; }

/* with in table every last td bodder bottom none */
#flat_menu table tr:last-child td { border-bottom: none; }

/* submenu fontawsome arrow icon layout */
#flat_menu #submenu .fa.fa-angle-right {
	position: absolute;
	top: 5px;
	right: 20px;
	color: #34495e;
	cursor: pointer
}

/* image layout */
#flat_menu #submenu img {
	width: 85%;
	position: relative;
	height: auto;
	border-radius: 5px;
	-webkit-box-shadow: 0px 0px 9px rgba(0,0,0,0.11);
	box-shadow: 0px 0px 9px rgba(0,0,0,0.11);
	cursor: pointer;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	margin-top: 20px;
	margin-bottom: 10px;
}

/* badge class layout */
#flat_menu .badge {
	position: absolute;
	color: black;
	right: 30px;
	top: 4px;
	font-size: x-small;
	font-weight: bold;
	padding: 5px;
	border-radius: 100px;
	-webkit-box-shadow: inset 0px 1px 7px rgba(0,0,0,0.27);
	box-shadow: inset 0px 1px 7px rgba(0,0,0,0.27);
}

/* text-box class layout */
#flat_menu #submenu .text-box {
	background-color: rgba(0,0,0,0.03);
	width: 100%;
	height: auto;
	display: block;
	border-radius: 5px;
	padding: 15px;
	font-size: medium;
	color: #343434;
	border: 20px solid rgba(255,255,255,1.00);
	border-bottom-width: 10px;
	border-top: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
	top: 3px;
}

/* text-box hover effct */
#flat_menu #submenu .text-box:hover { color: #0B0B0B; }

/* fontawesome arrow icon layout only for h1 */
#flat_menu #submenu h1 .fa.fa-angle-right {
	font-size: x-large;
	position: absolute;
	right: -20px;
	top: -3px;
}

/* fontawesome every main first icon margin left */
#flat_menu #submenu i:first-of-type { margin-left: 22px; }

/* fontawsome facebook icon layout */
#flat_menu #submenu .fa.fa-facebook {
	background: #3b5997;
	color: #FFFFFF;
	padding: 14px 18px;
	border-radius: 5px;
	cursor: pointer;
	margin-bottom: 10px;
}

/* fontawsome twitter icon layout */
#flat_menu #submenu .fa.fa-twitter {
	background: #00b8f4;
	color: #FFFFFF;
	padding: 14px 13px;
	border-radius: 5px;
	cursor: pointer;
	margin-bottom: 10px;
}

/* fontawsome google plus icon layout */
#flat_menu #submenu .fa.fa-google-plus {
	background: #d94a39;
	color: #FFFFFF;
	padding: 14px 13px;
	border-radius: 5px;
	cursor: pointer;
	margin-bottom: 10px;
}

/* grid-center extra class which only used for
 grid system represent you can remove it */
#flat_menu .grid-center {
	text-align: center;
	color: #363636;
	padding: 10px 0px;
	position: relative;
	overflow: hidden;
	line-height: 14px;
	height: 210px;
	border: 4px solid #FFFFFF;
	top: 0px;
	background: #F0F0F0;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
}

/* tablet layout */

@media (min-width: 768px) {

/* li hover to display submenu */
#flat_menu:hover > #submenu {
	visibility: visible;
	opacity: 1;
	height: auto;
	overflow: visible;
	transition: all 0.2s linear 0s;
	-moz-transition: all 0.2s linear 0s;
	-webkit-transition: all 0.2s linear 0s;
	-o-transition: all 0.2s linear 0s;
	-ms-transition: all 0.2s linear 0s;
}
}

/* tablet layout */

@media (max-width: 768px) {

/* flexible grid system */
#flat_menu .col-1,
#flat_menu .col-2,
#flat_menu .col-3,
#flat_menu .col-4,
#flat_menu .col-5,
#flat_menu .col-6,
#flat_menu .col-7,
#flat_menu .col-8,
#flat_menu .col-9,
#flat_menu .col-10,
#flat_menu .col-11,
#flat_menu .col-12 {
	width: 100%;
	position: relative
}

/* half class only works on tablet layout,
this class for half the column width */
#flat_menu .half { width: 50% !important }

/* half-third class for divide the column into three sections */
#flat_menu .half-third { width: 33.3333333333% !important }

/* half-fourth class for divide the column into four sections */
#flat_menu .half-fourth { width: 25% !important }

/* menu list items layout */
#flat_menu > ul > li {
	position: relative;
	background: #d42226;
	border-left: none;
	border-bottom: 1px solid #22303E;
}

/* submenu hover effect */
#flat_menu li:hover > #submenu {
	visibility: visible;
	opacity: 1;
	height: auto;
	overflow: visible;
	transition: all 0.2s linear 0.2s;
	-moz-transition: all 0.2s linear 0.2s;
	-webkit-transition: all 0.2s linear 0.2s;
	-o-transition: all 0.2s linear 0.2s;
	-ms-transition: all 0.2s linear 0.2s;
}

/* second level submenu layout */
#flat_menu #submenu #submenu {
	position: relative;
	left: 0px;
	top: -2px;
	visibility: visible;
	opacity: 1;
	height: auto;
	overflow: visible;
	box-shadow: none;
}

/* fontawesome arrow icon layout */
#flat_menu #submenu .fa.fa-angle-right {
	transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
}

/* h1 fontawesome arrow icon layout */
#flat_menu #submenu h1 .fa.fa-angle-right { right: 10px; }

/* submenu a tag layout */
#flat_menu #submenu li a {
	width: auto;
	float: left;
	padding-right: 10%;
	text-indent: 2%;
}

/* table layout */
#flat_menu table {
	margin: 16px 16px 16px 7%;
	width: 87%;
}
}

/* mobile layout */

@media (max-width: 480px) {

/* flexible grid system */
#flat_menu .col-1,
#flat_menu .col-2,
#flat_menu .col-3,
#flat_menu .col-4,
#flat_menu .col-5,
#flat_menu .col-6,
#flat_menu .col-7,
#flat_menu .col-8,
#flat_menu .col-9,
#flat_menu .col-10,
#flat_menu .col-11,
#flat_menu .col-12 {
	width: 100% !important;
	position: relative
}

/* table layout */
#flat_menu table {
	margin: 16px 16px 16px 7%;
	width: 85%;
}

/* table td, th layout */
#flat_menu table td,th {
	padding: 2%;
}
}


/* Form */

.wForm{
	text-align: left;
}

.wForm textarea{
    border: 1px solid #cccccc;
    background-color: #ffffff;
    border-radius: 0;
    color: #666666;
}

.wForm input{
	border: 1px solid #cccccc;
	padding: 1px;
	width: 210px;
	height: 20px;
}

.wForm input[type="file"]{
	border: none;
}