/* =======================================================
 *
 *    (1) GRAPHIC STYLE (Play around in this section)
 *
 *      [1] MAIN STUFF
 *      [2] HEADER NAVBAR
 *      [3] MENU NAVBAR
 *      [8] TO TOP

 *
 * ======================================================= */


/* ====================================================================== *
      [1] MAIN STUFF
 * ====================================================================== */

	html {

	}

	body{
		font-family: 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
		margin-top: 66px;

		-webkit-transition: margin-top 0.4s ease;
	       -moz-transition: margin-top 0.4s ease;
	         -o-transition: margin-top 0.4s ease;
	            transition: margin-top 0.4s ease;
	}

	h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{
		font-family: 'Open Sans';
		font-weight: 500;
	}

	.responsive-image {
		position: relative;
		width: 100%;

	}

	::selection {
	    background: #e54e53;
	    color: #fff;
	}


/*	hack to fix bootstrap horizontal scrollbar */
/*	hack to fix bootstrap horizontal scrollbar */
/*	hack to fix bootstrap horizontal scrollbar */

	.row {
	    margin-right: 0px;
	    margin-left: 0px;
	}


/*	Word Wrap   Remove them, or override them with "unset" or "normal": */
/*	Word Wrap 	Remove them, or override them with "unset" or "normal": */
/*	Word Wrap 	Remove them, or override them with "unset" or "normal": */

	h1, h2, h3, h4, h5, h6, p {
		/*
					word-break: break-all;
					word-wrap: break-word;
					overflow-wrap: break-word;
					-webkit-hyphens: auto;
					-moz-hyphens: auto;
					-ms-hyphens: auto;
					hyphens: auto;
					*/

					word-break: unset !important;
					word-wrap: unset !important;
					overflow-wrap: unset !important;
					-webkit-hyphens: unset !important;
					-moz-hyphens: unset !important;
					-ms-hyphens: unset !important;
					hyphens: unset !important;
}

/* ====================================================================== *
      [2] HEADER
 * ====================================================================== */

	.header{
		position: fixed;
		top:0;
		z-index: 999;
		background: #fff;
		width: 100%;

		-webkit-box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.07);
		   -moz-box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.07);
				box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.07);
	}

	.scrolling .header{
		-webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.22);
		   -moz-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.22);
				box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.22);
	}

	@media only screen and (max-width: 768px) {
		.header{
			position: relative;
		}
		body{
			margin-top:0;

		}
	}

/* ====================================================================== *
      [3] MENU
 * ====================================================================== */

	.navbar-default {
	    background-color: transparent;
	    border: none;
	    margin: 0;
			background-color:#90011a;
			color:#ffffff;
	}

	.navbar-collapse {
    	max-height: inherit !important;
	}

	.content .navbar-nav>li>a{
		text-transform: uppercase;
		font-family: 'Montserrat', sans-serif;
		font-weight: 700;
		font-size: 12px;
	 	color: #fff;
	}

	.navbar-brand{
		padding: 13px 15px;
		padding-left: 0;
	}
	.navbar-brand img{
		height: 40px;
	}
	.navbar-collapse>ul>li>a{
	 	line-height: 46px;/* the line height of the items must be the same as the height of the logo image */
	 	padding: 10px 25px;
	}
	.navbar-collapse>ul>li:last-child>a{
		padding-right: 10px;
	}

	@media only screen and (max-width: 992px) {
		.navbar-collapse>ul>li>a{
		 	line-height: 15px;
		}
		/* this is the hamburger icon for mobile */
		.navbar-toggle {
    		margin-top: 26px;
    		outline: 0;
    		background: transparent !important;
		}
		.navbar-default .navbar-collapse, .navbar-default .navbar-form {
		    border-color: rgb(250, 250, 250);
		}
	}

	/* drop down menu style */

	/* remove background of all items on the menu (including the drop down title) */
	.content .navbar-nav>li.active>a,
	.content .navbar-nav>li>a:hover,
	.nav>li.open>a,
	.nav>li.open>a:hover,
	.nav>li.open>a:focus,
	.nav>li.dropdown>a.selected,
	.nav>li.dropdown>a.selected:hover,
	.nav>li.dropdown>a.selected:focus {
		background: none !important;
		color: #e54e53 !important;
	}

	/* the arrow pointing down of the drop down menu title */
	.dropdown-toggle .fa{
		font-size: 10px;
		margin-left: 5px;
	}

	/* drop down menu */
	.navbar-nav>li>.dropdown-menu{
		padding:0;
		background: #333333;
		width: 450px;
		color: #fff;
		border: 0 !important;
		 -webkit-border-radius: 0px;
  		    -moz-border-radius: 0px;
  				 border-radius: 0px;

		-webkit-box-shadow: none !important;
  		   -moz-box-shadow: none !important;
				box-shadow: none !important;
	}

	/* drop down content */
	.dropdown-menu-content{
  		padding: 25px 0 !important;
	}

	.dropdown-menu-content ul:first-child{
		border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
	}

	/* drop down menu column */
	.dropdown-menu-column{
		width: 50%;
		float: left;
		padding: 0 !important;
		margin: 0 !important;
	}

	.dropdown-menu-column li{
		position: relative;
		list-style: none !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	.dropdown-menu-column a{
		font-size: 12px;
		width: 100%;
		padding: 12px 40px;
		height: auto;
		color: gray !important;
		display: block;
	}

	.dropdown-menu-column a:hover,
	.dropdown-menu-column a.selected{
		color: #fff !important;
		text-decoration: none;
	}

	.dropdown-menu-column a:hover{
		background: rgba(255, 255, 255, 0.1);
	}

	/* popover for each item of the drop down menu */
	.popover{
		margin-left: -15px !important;
	}
	.popover-with-margin .popover{
		margin-left: -240px !important;
	}

	.popover{
		border-radius: 0px;
		border: 1px solid #D8D8D8 !important;
		-webkit-box-shadow: 0px 0px 14px rgba(0,0,0,0.3);
		   -moz-box-shadow: 0px 0px 14px rgba(0,0,0,0.3);
			-ms-box-shadow: 0px 0px 14px rgba(0,0,0,0.3);
			 -o-box-shadow: 0px 0px 14px rgba(0,0,0,0.3);
			    box-shadow: 0px 0px 14px rgba(0,0,0,0.3);
	}

	.popover .arrow {
		border-left-color: #D8D8D8 !important;
	}

	.popover_img_container{
		width: 244px;
		height: 160px;
		overflow: hidden;
	}

	.popover_img_container img{
		max-width: 100%;
		width: 100%;
	}

	/* reponsive style of the drop down menu */
	@media only screen and (max-width: 992px) {
		.dropdown-menu-column{
			width: 100%;
		}
		.dropdown-toggle .fa{
			float: right;
			font-size: 15px;
		}
		.dropdown-menu-column a:hover, .dropdown-menu-column a.selected{
			color: #e54e53 !important;
		}
		.dropdown-menu-column a{
			padding: 5px 50px;
		}
		.popover_img_container{
			display: none;
		}
	}



/* ====================================================================== *
      [8] TO TOP
 * ====================================================================== */

	.fixed{
		position: fixed;
		left: 24px;
		bottom: 10px;
		display: none;
		z-index: 999;
	}

	.to-top{
		height: 56px;
		line-height: 36px;
		width: 52px;
		background-color: rgba(0,0,0,.8);
		color: #fff;
		cursor: pointer;
		text-align: center;
		font-size: 18px;

		-webkit-border-radius: 3px 3px 0 0;
		   -moz-border-radius: 3px 3px 0 0;
		     -o-border-radius: 3px 3px 0 0;
		        border-radius: 3px 3px 0 0;

		-webkit-transition: all 0.2s;
		   -moz-transition: all 0.2s;
		    -ms-transition: all 0.2s;
		     -o-transition: all 0.2s;
		        transition: all 0.2s;
	}

	.to-top i{
		margin-top: 10px;
	}

	.to-top:hover{
		transform: scale(1.1,1.1);
		background-color: #90011a !important;
	}


	/* ====================================================================== *
	      [8] Email
	 * ====================================================================== */

		.email-fixed {
			position: fixed;
			right: 5px;
			bottom: 70%;
			display: block;
			z-index: 999;
		}

		.glyphicon {
		color: #fff;


		}

		.email {
			height: 52px;
			line-height: 36px;
			width: 52px;
			background-color: rgba(0,0,0,.8);
			color: #fff;
			cursor: pointer;
			text-align: center;
			font-size: 26px;

			-webkit-border-radius: 3px 3px 0 0;
			   -moz-border-radius: 3px 3px 0 0;
			     -o-border-radius: 3px 3px 0 0;
			        border-radius: 3px 3px 0 0;

			-webkit-transition: all 0.2s;
			   -moz-transition: all 0.2s;
			    -ms-transition: all 0.2s;
			     -o-transition: all 0.2s;
			        transition: all 0.2s;
		}

		.email i{
			margin-top: 10px;
		}

		.email:hover{
			transform: scale(1.1,1.1);
			background-color: #90011a !important;
		}


		/* ====================================================================== *
		      [8] Phone
		 * ====================================================================== */

			.phone-fixed {
				position: fixed;
				right: 5px;
				bottom:80%;
				display: block;
				z-index: 999;
			}

			.phone {
				height: 52px;
				line-height: 36px;
				width: 52px;
				background-color: rgba(0,0,0,.8);
				color: #fff;
				cursor: pointer;
				text-align: center;
				font-size: 26px;
				border-radius: 5px !important;
				border-width: 20px !important;

				-webkit-border-radius: 3px 3px 0 0;
				   -moz-border-radius: 3px 3px 0 0;
				     -o-border-radius: 3px 3px 0 0;
				        border-radius: 3px 3px 0 0;

				-webkit-transition: all 0.2s;
				   -moz-transition: all 0.2s;
				    -ms-transition: all 0.2s;
				     -o-transition: all 0.2s;
				        transition: all 0.2s;
			}

			.phone i{
				margin-top: 10px;
			}

			.phone:hover{
				transform: scale(1.1,1.1);
				background-color: #90011a !important;
			}
