/*

 1.) Eric Meyer's Reset

 ----------------------------------------*/

/**

 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)

 * http://cssreset.com

 */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {

	margin: 0;

	padding: 0;

	border: 0;

	font-size: 100%;

	font: inherit;

	vertical-align: baseline;

}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }



/*

 1.) Global Typography

 ----------------------------------------*/

*, :before, :after{

	box-sizing: border-box;

	-moz-box-sizing: border-box;

	-webkit-box-sizing: border-box;

}

html {

	-ms-text-size-adjust: 100%;

	-webkit-text-size-adjust: 100%;

	font-size: 100%;

}

body { font-family: 'myriad_set_promedium'; }

img{ vertical-align: top; max-width: 100%; }

a{color: #ff0000;}

a:hover{color: #333333;}

/*

 2.0.2) Global Headings

 -----------------------------*/

h1, h2, h3, h4, h5, h6 { font-weight: normal; color: #161e21; }

h1 { margin-bottom: 0; }

h2 { font-size: 36px; line-height: 28px; color:#000000; margin: 0 0 10px 0; font-family: 'myriad_set_probold'; letter-spacing: 1px }

h3 { font-size: 36px; line-height: 28px; color:#000000; margin: 0 0 10px 0; font-family: 'myriad_set_probold'; text-transform: uppercase; letter-spacing: 1px }

h3 span{display: inline-block; text-transform: initial;}

h4 { font-size: 2.1em; line-height: 1; margin: 0 0 1em 0; }

h5 { font-size: 1.8em; line-height: 1.16667; margin: 0 0 1.16667em 0; }

h6 { font-size: 1.4em; line-height: 1.5; margin: 0 0 1.5em 0; }

p { font-size: 18px; line-height: 28px; color: #333333 ; font-family: 'myriad_set_protext'; }



.h2{ position: relative; text-align: center; text-transform:uppercase; padding-bottom: 22px; margin-bottom: 36px; }

.h2:after{ position: absolute; left: 0; right: 0; margin: 0 auto; width: 43px; height: 3px; background: #ff0000; bottom: 0px; content: ""; }

.h3{ border-bottom: 3px solid #dadada; padding-bottom: 32px;  }





/*

 2.0.6) Link style

 -------------------------*/

a { text-decoration: none; }

a:hover, a:focus {  text-decoration: none; outline: none; }

a:active { outline: none; }

:focus {  text-decoration: none; outline: none; }



a, button, input, .transition-efct {

	transition: all 0.3s linear 0s;

	-webkit-transition: all 0.3s linear 0s;

	-ms-transition: all 0.3s linear 0s;

	-o-transition: all 0.3s linear 0s;

	-moz-transition: all 0.3s linear 0s;

}



.btn{ display: inline-block; font-size: 20px; line-height: 24px; color: #fff; background: #ff0000; font-family: 'myriad_set_prosemibold'; padding: 18px 20px 14px; min-width: 208px; text-transform: uppercase; outline: none; border: none; cursor: pointer;}
   
   
.btn.grey{
	background: #dadada;
    color: #000;
    padding: 12px 20px 6px;
    text-transform: inherit;
}
 
.btn.grey:hover{
	background: #333333;
    color: #fff;
}   

.btn:hover{ background: #333333; color: #fff; }



input.btn{ -webkit-appearance:none; -moz-appearance:none; border-radius: 0; }





/* `Clear Floated Elements*/



.clear {

  clear: both;

  display: block;

  overflow: hidden;

  visibility: hidden;

  width: 0;

  height: 0;

}



.clearfix:before,

.clearfix:after {

  content: '\0020';

  display: block;

  overflow: hidden;

  visibility: hidden;

  width: 0;

  height: 0;

}



.clearfix:after {

  clear: both;

}



/*

 3.) Site Wide Content

 ------------------------------*/

body.information-form{ background: url(../images/pages/information_form.jpg) no-repeat top center; min-height: 1360px; }

#wrapper { }

.page{ width:100%; max-width: 1200px; padding: 0 15px; margin: 0 auto; }



.info-msg{ font-size: 18px; line-height: 22px; color: #6590b6; background: #e8f7ff; border: 1px solid #cde8f6; padding: 10px 20px; text-align: center; position: relative; }

.success-msg{ font-size: 18px; line-height: 22px; color: #85ad78; background: #f2feed; border: 1px solid #ddf3d5; padding: 10px 20px; text-align: center; position: relative; }

.warning-msg{ font-size: 18px; line-height: 22px; color: #96722f; background: #fffce9; border: 1px solid #f1ecc6; padding: 10px 20px; text-align: center; position: relative; }

.error-msg{ font-size: 18px; line-height: 22px; color: #e42e2e; background: #fdf8f8; border: 1px solid #f4cfcf; padding: 10px 20px; text-align: center; position: relative; }



.info-msg span,

.success-msg span,

.warning-msg span,

.error-msg span{ position: absolute; top: 0; right: 0; cursor: pointer; padding: 5px; line-height: 1; }







/*

 4.) Header Styles

 ------------------------------*/

#header{ position: relative; z-index: 100; border-bottom: 1px solid #dddddd; }

#header.fix{ position: fixed; left: 0; top: 0; width: 100%; z-index: 100; background: #fff; padding: 10px 0; }

#header.fix .logo{ width: 50px ; margin-top: 0; }

#header.fix nav ul{ padding: 10px 0 15px; }

#header .logo{ float: left;/* margin: 12px 0 0 2px;*/ transition: none; -webkit-transition: none; -ms-transition: none; -o-transition: none; -moz-transition: none; }

#header nav{ float: right;  }

#header nav ul{ padding: 48px 0 52px; }

#header nav li{ float: left; margin-left: 65px; }

#header nav li a{ display: inline-block; position: relative; font-size: 20px; line-height: 1.5; color: #333333; position: relative; }

#header nav li a:before{ background: #ff0000; bottom: -3px; content: ""; height: 3px; left: 50%; position: absolute; right: 50%; transition-duration: 0.3s; transition-property: left, right; transition-timing-function: ease-out; z-index: 1;  }

#header nav li a:hover:before { left: 0; right: 0; }

#header nav li.active a:before { left: 0; right: 0; }

#header nav li a.btn:before{ display: none; }

#header nav li a.btn { min-width: 100px; padding:5px 15px; color: #fff; min-width: 100px; font-family: 'myriad_set_promedium'; letter-spacing: 0.5px; font-size: 14px; font-weight: bold; border-radius: 5px; background: #ff0000;}

#header nav li a.btn:hover{
	background: #333333;
    color: #fff;
} 

#header .header-top{
	display: flex;
    justify-content: flex-end;
	padding-top: 10px;
}

#header .header-top .header-right{
	margin-left:10px;
}

#header .header-top .header-right .lang,
#header .header-top .header-right .user{
	display: inline-block;
	margin-left: 30px;
}

@media(max-width: 991px) and (min-width: 768px){
	#header .header-top .header-right .lang, #header .header-top .header-right .user{
		margin-left: 20px;	
	}
}

#header .header-top .header-right .user .icon{
	color: #ff0000;
    margin-right: 4px;
}

#header .header-top .header-right .user ul{
	display: inline-block;
}

#header .header-top .header-right .lang ul li,
#header .header-top .header-right .user ul li{
	display: inline-block;
	margin: 0 3px;
}

#header .header-top .header-right .lang ul li a,
#header .header-top .header-right .user ul li a{
	font-size: .9rem;
	color: #333333;
}

#header .header-top .header-right .user ul li.signin,
#header .header-top .header-right .user ul li.signup{
	margin: 0;
}

#header .header-top .header-right .lang ul li.active a,
#header .header-top .header-right .user ul li.ur_acc a,
#header .header-top .header-right .lang ul li a:hover,
#header .header-top .header-right .user ul li a:hover{
	color: #ff0000;
}

#header .header-top .header-right .lang ul li:first-child:after{
	content: '|';
	margin-left: 6px;
}

#header .header-top .header-right .user ul li.signin:after{
	content: '/';
}

#header .header-top .header-right .user ul li.ur_acc:after{
	content: '|';
	margin-left: 6px;
}

#header .header-top .header-right .order-btn{
	display: inline-block;
}

#header .header-top .header-right .order-btn .btn{
	background: #ff0000;
    border: none;
    outline: none;
    color: #fff;
    padding: 5px 15px;
    color: #fff;
    font-family: 'myriad_set_promedium';
    letter-spacing: 0.5px;
    font-size: 14px;
    font-weight: bold;
    text-transform: capitalize;
    cursor: pointer;
    min-width: auto;
    line-height: 21px;
}

/*mobile menu*/

.menu-btn {

  display: none;

  position: relative;

  overflow: hidden;

  width: 28px;

  height: 23px;

  font-size: 0;

  cursor: pointer;

  -webkit-transition: background 0.3s;

  transition: background 0.3s;

  margin-bottom: 10px; }



.menu-btn:focus { outline: none; }

.menu-btn span { display: block; position: absolute; top: 10px; left: 0; right: 0; margin: auto; height: 3px; background: #ff0000; }

.menu-btn span:before,

.menu-btn span:after { position: absolute; display: block; left: 0; width: 100%; height: 3px; background-color: #ff0000 ; content: ""; }

.menu-btn span:before { top: -10px; }

.menu-btn span:after { bottom: -10px; }



.menu-btn-eft { background: none; }

.menu-btn-eft span { -webkit-transition: background 0s 0.3s; transition: background 0s 0.3s; }

.menu-btn-eft span:before,

.menu-btn-eft span:after { -webkit-transition-duration: 0.3s, 0.3s; transition-duration: 0.3s, 0.3s; -webkit-transition-delay: 0.3s, 0s; transition-delay: 0.3s, 0s; }

.menu-btn-eft span:before { -webkit-transition-property: top, -webkit-transform; transition-property: top, transform; }

.menu-btn-eft span:after { -webkit-transition-property: bottom, -webkit-transform; transition-property: bottom, transform; }

/* active state, i.e. menu open */

.menu-btn-eft.active span {  background: none; }

.menu-btn-eft.active span:before { top: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

.menu-btn-eft.active span:after { bottom: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }

.menu-btn-eft.active span:before,

.menu-btn-eft.active span:after { -webkit-transition-delay: 0s, 0.3s; transition-delay: 0s, 0.3s; }







/*

 5.) Footer Styles

 ------------------------------*/

#footer{ background: #0f0f0f; color: #fff; padding: 43px 0 42px; margin-top:50px; }

#footer .copyright-row{ /*float: left;*/ padding: 7px 0; margin-left:10px; }

#footer .nav{ display: inline-block; padding: 7px 0; margin-left: 48px; }

#footer .nav li{ float:left; border-left: 1px solid #fff; padding: 0 9px; }

#footer .nav a{ color: #fff; }

#footer .nav a:hover{ text-decoration: underline; }

#footer .nav li:first-child{ border: none; }

#footer .pay-by{ float: right; }

#footer .pay-by li{ float:left; margin-left: 17px; }

#footer .phoneno {vertical-align: middle; display: inline-block;}





/* Contact page ******************/



.contact-address h3 {

	font-size:20px;

	margin-bottom:20px;

	padding-bottom: 10px;	

}

.contact-address li {

	padding:5px 0;

	overflow:hidden;

}

.contact-address li label {

	min-width:100px;

	font-weight:600;

	display: inline-block;

	float:left;

}

.contact-address li span {

	float:left;

}

.contact-address p {

    line-height: normal; 

}

@media (max-width:1220px) {
#header nav li{
	margin-left: 33px;
}
}

@media (max-width:767px) {

	.contact-address {

		margin-bottom:20px;

	}

}

@media (max-width:479px) {

	.contact-address li {

		    padding: 7px 0;

			overflow: hidden;

			font-size: 14px;

			line-height: normal;

	}

	.contact-address li label {

		float:none;

		display:block;

		font-size: 15px;

	}

	.contact-address li span {

		max-width: none;

		margin-top: 0px;

		display: block;

	}

	.contact-address p {

		font-size:14px;

		font-weight:600;

		margin-bottom:20px;

	}

}



/**** dropdown start *****/

.dropdown{
	display: inline-block;
	position:relative;
	min-width: 100px;
}

.dropdown .dropdown-toggle{
	background: #333333;
    border: none;
    outline: none;
    color: #fff;
    padding: 15px 10px;
    color: #fff;
    font-family: 'myriad_set_promedium';
    letter-spacing: 0.5px;
    font-size: 14px;
    font-weight: bold;
    text-transform: capitalize;
    cursor: pointer;
	width: 100%;
    text-align: left;
	position: relative;
}

.dropdown .dropdown-toggle i{
	position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    padding: 12px;
    border-left: 1px solid #fff;
    font-size: 20px;
}

.dropdown .dropdown-menu{
	display: none;
	position: absolute;
    right: 0;
    top: 44px;
    width: max-content;
    
    border: 1px solid #333333;
	z-index: 1;
	background: #fff;
}

.dropdown .dropdown-menu ul li{
	padding: 5px 15px;
	text-align: left;
	float: none;
    width: 100%;
}

.dropdown .dropdown-menu ul li a{
	display: inline-block;
    width: 100%;
    color: #333333;
}

.dropdown .dropdown-menu ul li:hover a{
	color: #ff0000;
}

/** menu on tablet view **/

@media(max-width: 767px){
	
#header .header-top{
	flex-direction: column;
}

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

#header .header-top .header-right{
	text-align: right;
    margin-top: 15px;
    margin-left: 0;
}

#header .header-top{
	padding: 0 15px;
}
	
}

body.app-lang-fr #header nav li {
	margin-left:60px;
}

@media (max-width:1220px) {
body.app-lang-fr #header nav li{
	margin-left: 28px;
}
}

@media (max-width:850px) and (min-width: 768px) {
body.app-lang-fr #header nav li{
	margin-left: 14px;
}

body.app-lang-fr #header .header-top .header-right .lang ul li a, body.app-lang-fr #header .header-top .header-right .user ul li a, body.app-lang-fr #header span{
	font-size: .89rem;
}

body.app-lang-fr .add-detail .phonenumber{
	margin-right: 8px;
}

body.app-lang-fr #header .header-top .header-right .lang, body.app-lang-fr #header .header-top .header-right .user{
	margin-left: 8px;
}

}