@charset "utf-8";

/*--------------media query css------------------*/	
/*------------tablet landscape view------*/
@media (max-width:1024px) {
.f-navigation ul li.qualifi { padding-right: 0px; }
.f-navigation ul li {  display: inline-block; line-height: 11px; float: none; padding:0 6px 0 2px; }
.footermenu { padding-bottom: 10px; }
.trainshipss { width: 81%; }
}

@media (max-width:980px) {
.main, .footer { width: 96%; }
iframe { width: 100%; }
.copyright p { padding-left: 0; }
}

/*------------tablet portrait  view------*/
@media (max-width:900px) {
.logo { left: 0; position: absolute; top: 13px; }
.professional-trainers { background-size: 91%; padding: 15px 0 0 29px;    left: -16px;}
.professional-trainers span { display: inline-block; font-size: 18px; }
}

@media (max-width:800px) {
.copyright { float: none; text-align: center; }
.footermenu { float: none; margin: 0 auto; padding-top: 9px; text-align: center; width: 100%; }
.f-navigation ul li { display: inline-block; line-height: 11px; float: none; }
.sidebar-bg { float: left }
.logo img { width: 100%; }
.professional-trainers { background-size: 86% auto; left: 0; padding: 15px 0 0 25px; }
.specialising { float: none; font-family: "myriad-pro"; font-weight: 400; text-align: center; }
.contact-info { float: none; margin: 0 auto; }
header { padding-top: 0; }
.enquire-detail ul li { float: left; margin: 0 7.4% 3% 4%; text-align: center; width: 24%; }
.footer-enquire-detail ul { margin: 0 auto; width: 78.35%; }
}

@media (min-width:768px) {
nav ul { display: block !important }
}

@media (max-width:768px) {
.content { float: right; width: 63.354%; }
.footermenu { padding-bottom: 10px; }
.trainshipss { width: 78%; }
}

/*------------mobile landscape  view------*/
@media (max-width:767px) {
.video-area { padding-bottom: 25.9%; min-height: inherit; height: 100% }
.video-area-home { padding-bottom: 10%; }
iframe { border: 0 none; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
embed, iframe, object, video { max-width: 100%; }
body { background: url("../images/body-bg.gif") repeat-x scroll center 192px #fff; }
.wrapper { padding-top: 16px; }
.sidebar { background: none; float: none; position: relative; width: 100%; }
.sidebar-bg { background: none; float: none; margin-right: 0; width: 100%; }
.logo { display: none }
.mobile-logo { display: block; margin: 0 auto; position: relative; text-align: center; }
.elearning-logo { float: right; position: relative; margin: 100px 0 0 0; }
.professional-trainers { display: none }
.professional-trainers-mobile { display: block; left: 232px; position: absolute; top: 50px; width: 297px; z-index: 99; height: 82px; background: url(../images/professional-trainer-bg.png) no-repeat; color: #fff; font-size: 12px; font-family: 'myriad-pro'; font-weight: 700; padding: 14px 0 0 29px; }
.professional-trainers-mobile span { font-size: 21px; display: inline-block; }
.professional-trainers-mobile span.trainers { padding-left: 12px; }
.specialising-mobile { font-family: 'myriad-pro'; font-weight: 400; text-align: center; display: block; clear: both; padding-top: 6px; }
.specialising-mobile p { color: #000000; font-size: 24px; padding-bottom: 1px; }
.specialising-mobile p span { /*color: #ca0000;*/ font-size: 27px; display: inline-block; }
.contact-info-mobile { width: 268px; float: left; background: url(../images/contact-mail-icon.png) no-repeat left 0; margin-left: 0px; margin-top: 100px; display: inline }
.contact-info-mobile h2 { color: #3f3e3e; font-size: 30px; font-family: 'myriad-pro'; font-weight: 400; margin-bottom: 0px; text-align: right; line-height: 30px; padding-top: 3px; }
.contact-info-mobile h3 { color: #ca0000; text-align: right; font-size: 15px; font-family: 'myriad-pro'; font-weight: 400; letter-spacing: 0.01em; }
.contact-info-mobile span { color: #ca0000; }
.contact-info-mobile h2 a { color: #3f3e3e; }
.contact-info-mobile h2 a:hover { color: #ca0000; }
.contact-info-mobile h3 a { color: #3f3e3e; }
.contact-info-mobile h3 a:hover { color: #ca0000; }
.header_menus { background: none; float: right; height: 37px; margin-top: 50px; position: relative; width: 100%; z-index: 999; }
#menu-icon { background: #d53233; cursor: pointer; font-size: 17px; display: block; font-family: 'myriad-pro'; font-weight: 400; text-align: center; height: 38px; line-height: 38px; color: #fff; position: relative; width: 100%; }
.navigation { float: none; position: relative; width: 100%; z-index: 99; max-width: 100%; }
.navigation nav ul { display: none; float: right; position: absolute; top: 38px; width: 100%; z-index: 99; }
.navigation nav li { background: #3f3e3e !important; border-bottom: 1px solid #383939; float: right; height: auto !important; line-height: 30px !important; margin: 0 !important; text-align: left; width: 100%; -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; padding: 7px 0; }
.navigation nav li a { padding: 4px 17px; line-height: normal !important; height: auto !important; color: #fff; display: block; }
.navigation nav li a:hover { color: #d53233 }
.navigation nav li:hover, nav li a.active { background: #d53233; border-radius: 0px; color: #fff }
.navigation nav { padding-left: 0; padding-right: 0; }
header { display: none; }
.content { float: none; width: 100%; margin-top: 0; }
.call-us-today { display: none }
.call-us-today-mobile > img { border-bottom: 3px solid #ca0000; vertical-align: top; }
.call-us-today-mobile { display: block; text-align: center; width: 255px; margin: 20px auto 0; }
.call-us h2 { color: #3f3e3e; font-size: 40px; font-family: 'myriad-pro'; font-weight: 400; margin-bottom: 0px; text-align: right; line-height: 36px; }
.call-us h3 { color: #ca0000; text-align: right; font-size: 21px; font-family: 'myriad-pro'; font-weight: 400; letter-spacing: -0.02em; }
.call-us h2 span { color: #ca0000 }
.call-us h2 a { color: #3f3e3e; }
.call-us h2 a:hover { color: #ca0000; }
.video-area { margin-left: 0; padding-bottom: 35.4%; position: relative; width: 100%; min-height: auto; margin-top: 21px; }
.video-area-home { padding-bottom: 10%; }
.video-shadow { display: block; background: url("../images/video-box-shadow.png") no-repeat scroll center bottom; height: 27px }
.wide-content h1, .wide-content h2 { text-align: center; }
.enquire-detail { margin-bottom: 30px; }
.copyright { display: none }
.copyright-mobile { display: block; text-align: center; position: relative; }
.copyright-mobile p { font-size: 12px; padding-left: 0px; padding-bottom: 0 }
.footermenu { float: none; padding-top: 1px; position: relative; }
.wide-content { padding-left: 0; }
.f-navigation { float: none; position: relative; width: 100%; z-index: 99; max-width: 100%; }
.f-navigation nav ul { display: none; position: relative; width: 100%; z-index: 99; }
.f-navigation nav li { background: #3f3e3e !important; border-bottom: 1px solid #383939; float: right; height: auto !important; line-height: 30px !important; margin: 0 !important; text-align: left; width: 100%; -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; padding: 7px 0; }
.f-navigation li a { padding: 4px 17px; line-height: normal !important; height: auto !important; color: #fff !important; display: block; }
.f-navigation li a:hover { color: #ff5c5d !important; }
.f-navigation li:hover, nav li a.active { color: #ff5c5d !important; background: none }
.f-navigation { padding-left: 0; padding-right: 0; }
.copyright-mobile { padding-bottom: 9px; padding-top: 9px; }
}

@media (max-width:720px) {
.professional-trainers-mobile { left: 208px; }
.footer-enquire-detail ul { margin: 0 auto; width: 100%; }
}


/*------------mobile portrait view------*/
@media (max-width:640px) {
h1 { font-size: 28px; }
.professional-trainers-mobile { left: 167px; }
 
.trainshipss { width: 78%; }
}
@media (max-width:600px) {
.video-area { padding-bottom: 38.4%; }
.video-area-home { padding-bottom: 10%; }
.enquire-detail ul li.compliance { width: 58%; }
.professional-trainers-mobile { left: 146px; }
}

@media (max-width:568px) {
.professional-trainers-mobile { left: 127px; }
.video-area { padding-bottom: 41.4%; }
.video-area-home { padding-bottom: 10%; }
.specialising-mobile p span { font-size: 26px; }
.specialising-mobile p { font-size: 22px; }
.enquire-detail ul li.compliance { width: 55%; }
.footer-enquire-detail ul li { margin: 0 12% 1% 4.6%; }
}

@media (max-width:533px) {
.professional-trainers-mobile { left: 113px; }
.video-area { padding-bottom: 43.4%; }
.video-area-home { padding-bottom: 10%; }
.enquire-detail ul li.compliance { width: 52%; }
}

/*----------optional css------*/
@media (max-width:480px) {
.enquire-detail ul li.professional-dev { width: 100%; }
.enquire-detail ul li.compliance { width: 100%; float: none; }
.enquire-detail ul li.qualification { width: 100%; float: none; }
.footer-enquire-detail ul li { margin-left: 0; margin-right: 0 }
.enquire-detail ul li { margin: 20px 0; float: none; }
.footer-enquire-detail ul li { margin: 20px 0; float: none; }
.footer-enquire-detail ul li.professional-dev { width: 100%; float: none }
.footer-enquire-detail ul li.compliance { float: none; width: 100%; }
.footer-enquire-detail ul li.qualification { float: none; width: 100%; }
.specialising-mobile p span { font-size: 26px; padding-top: 7px; }
body { background: url("../images/body-bg.gif") repeat-x scroll center 219px #fff; }
.video-area { padding-bottom: 48.4%; }
.video-area-home { padding-bottom: 10%; }
.professional-trainers-mobile { left: 87px; }
}

@media (max-width:360px) {
.wide-content h1 { font-size: 23px; line-height: 24px; }
.professional-trainers-mobile { left: 24px; }
.contact-info-mobile { display: block; float: none; margin: 84px auto 0; width: 268px; }
.elearning-logo { float: none; margin: 20px auto 0; position: relative; }
body { background: url("../images/body-bg.gif") repeat-x scroll center 266px #fff; }
.specialising-mobile p span { padding-top: 6px; }
.video-area { padding-bottom: 62.4%; }
.video-area-home { padding-bottom: 10%; }
.trainshipss { max-width: 237px; }
}

@media (max-width:320px) {
.professional-trainers-mobile { left: 5px; }
.video-area { padding-bottom: 71.4%; }
.video-area-home { padding-bottom: 10%; }
.trainshipss { max-width: 193px; width: 78%; }
}

/*---------use only when design is customise-----------*/
@media screen and (min-width:700px) and (max-width:990px) {
}
/*include browser specific css styles here*/