body { font-family: 'Montserrat', sans-serif; background-color: #F5F5F5; }
body:not(.home) { background-color: #fff; }
img { outline: none; max-width: 100%;}
a { text-decoration: none;}
ul { margin: 0px; padding: 0px; list-style: none; }

/* Website branding colors*/
.gray-color { background-color: #F8F8F8;}
.white-color { background-color: #fff;}
.red-color { background-color: #EE2010;}
.aqua-color { background-color: #0098DA;}
.text-color { background-color: #333333;}
.green-color { background-color: #8FC74A;}
.bg-light { background-color: #ffffff !important;}

.white-text-color { color: #fff;}
.red-text-color { color: #EE2010;}
.aqua-text-color { color: #0098DA;}
.text-text-color { color: #333333;}
.green-text-color { color: #8FC74A;}

/* Website font sizes */
.font-14 { font-size: 14px; }
.font-16 { font-size: 16px; }
.font-18 { font-size: 18px; }
.font-20 { font-size: 20px; }
.font-24 { font-size: 24px; }
.font-26 { font-size: 26px; }
.font-28 { font-size: 28px; }
.font-40 { font-size: 40px; }

/* Common padding */
.section-padding { padding-top: 130px; padding-bottom: 130px; }
.section-padding-2 { padding-top: 100px; padding-bottom: 100px; }
.section-padding-3 { padding-top: 80px; padding-bottom: 80px; }


.font-bold-500 { font-weight: 500;}
.font-bold-600 { font-weight: 600;}
.font-bold-700 { font-weight: 700;}

.inner-shadow { box-shadow: inset 0 0 10px rgba(0,0,0,0.2); }
.button-link { border: 1px solid #EE2010; padding: 10px 70px 10px 25px; border-radius: 25px; display: inline-block; color: #EE2010; background-image: url(../images/button-arrow.svg); background-repeat: no-repeat; background-position: 88% center; background-size: 20px;  }
.button-link.white { border: 1px solid #fff; color: #fff; background-image: url(../images/button-arrow-white.svg); }
.sub-title { position: relative; }
.sub-title:before { background-color:#EE2010; width: 80px; height: 6px; border-radius: 20px; position: absolute; content: ''; top: -60px; left: 0px; }


/* CSS STYLE FOR HEADER & Navigation */
.header-text { line-height: 30px; }
.header .navbar { width: 100%; }
.header .navbar-nav .nav-item { margin-left: 15px; }
.header .navbar-nav .dropdown-menu .nav-item { margin-left: 0px; }
.header.navbar-light .navbar-nav .nav-link { color: #333333; }
.header.navbar-light .navbar-nav .nav-link:hover { color: #EE2010; }

.modasa-menu-section { display: none;}
.dropdown-menu.show { border: none; background-color: #fff; box-shadow: 0px 0px 5px rgba(0,0,0,0.1);}
.dropdown-menu.show a:hover { background-color: #D4F0FD;}

/* CSS STYLE FOR Home Banner */
.home-banner { background-image: url(../images/bg.svg); background-repeat: no-repeat; background-position: right top;  }
.home-gallery img { margin-bottom: 15px; }
.home-gallery .carousel-indicators { bottom: -50px;}
.home-gallery .carousel-indicators button { background-color: #CCCCCC; height: 6px; border-radius: 5px; border: none; }
.home-gallery .carousel-indicators button.active { background-color: #EE2010; }
.bullet-list li { background-image: url(../images/button-arrow.svg); padding-left: 35px; background-size: 20px; background-position: left 3px; margin-bottom: 12px; line-height: 22px; background-repeat: no-repeat; }
.assosiation-section { margin: 0px auto; width: 550px; }
.values li { flex-grow: 1; width: 33%; height: 100px; display: inline-flex; align-items: center; position: relative; }
.values li span { position: absolute; top: 10px; }
.value-section { background-image: url(../images/value-image.svg), url(../images/value-image.svg); background-position: left bottom, right top; background-repeat: no-repeat, no-repeat; }
.report-box { width: 100%; background-color: #fff; border-radius: 5px; padding: 20px 15px 15px 15px; display: inline-flex; flex-direction: column; align-items: center; margin-bottom: 20px; }
.download-link { position: relative; padding-right: 30px; width: 100%; color: #333; }
.download-link:hover { color: #333; }
.download-link:before { position: absolute; right: 0px; background-image: url(../images/icon-download.svg); background-repeat: no-repeat; background-position: right top; top: 5px; content: ''; width: 20px; height: 20px; animation-name: download; animation-duration: 1s; animation-iteration-count: infinite; }

/* The animation code */
@keyframes download {
    0% { top: 0px;}
    25% { top: 5px;}
    50% { top: 10px;}
    75% { top: 5px;}
    100% { top: 0px;}
}

/* CSS STYLE FOR Footer */
.contact-section { background-image: url(../images/contact-bg.svg); background-repeat: no-repeat; background-position: right top; }
.social-icons { text-align: right; }
.social-icons li { display: inline-block; }
.i-facebook, .i-twitter, .i-linkedin, .i-instagram { width: 26px; height: 26px; display: inline-block; background-repeat: no-repeat; background-position: center center; margin-left: 10px; }
.i-facebook { background-image: url(../images/facebook.svg); }
.i-twitter { background-image: url(../images/twitter.svg); }
.i-linkedin { background-image: url(../images/linkden.svg); }
.i-instagram { background-image: url(../images/instagram.svg); }


#google_language_translator { position: relative;  height:35px}
.goog-te-gadget .goog-te-combo { margin: 2px 0px!important; }
.register-info { padding-top:5px;  padding-bottom:5px; }



/* CSS Style for inner pages */

.page .content-part { padding: 20px 0px; margin-bottom: 20px; font-size: 16px; }
/*==== CSS Style For Banner ====*/
.page .container .banner {
    /* background-color: #EAF4F4;
    border-bottom: 4px solid #EE2010; */
    padding: 40px 0px;
}
.page .container .banner h1 {
    border-left:4px solid #EE2010;
    font-size: 46px;
    padding-left: 15px;
    margin: 0px;
    font-weight: bold;
}
.page .content-part h2 {
    color: #EE2010;
    font-size: 26px;
    margin: 50px 0px 20px 0px;
    font-weight: bold;
}
.page .content-part h3 {
    color: #0098DA;
    font-size: 20px;
    margin: 50px 0px 20px 0px;
    font-weight: bold;
}
.page .content-part ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}
.page .content-part ul li {
    background-image: url(../images/button-arrow.svg);
    background-repeat: no-repeat;
    background-position: left 4px;
    background-size:16px;
    padding-left: 25px;
    margin-bottom: 8px;
}

.interest-section table { width: 100%; border: 1px solid #ccc;}
.interest-section table tr td { border-bottom: 1px solid #ccc; text-align:left; padding:5px 5px; border-right: 1px solid #ccc; }
.interest-section table tr:nth-child(even) td { background-color: #f5f5f5;}
.interest-section table tr:last-child td { border-bottom: none; }
.interest-section table tr td:last-child { border-right: none; }

.sub-menu-toggle { display: none; }



/* CSS STYLE FOR RESPONSIVE */
@media screen and (max-width: 992px) {
#google_language_translator { position: relative;  height:30px}
    .section-padding { padding-top: 90px; padding-bottom: 90px; }
    .section-padding-2 { padding-top: 60px; padding-bottom: 60px; }
    .section-padding-3 { padding-top: 40px; padding-bottom: 40px; }
    .sub-title:before {  display: none; }
    .header .navbar-nav .nav-item { margin-left:0px; }
    .header .navbar-nav .nav-item .nav-link { padding-left:15px; padding-right:15px; }
    .value-section { background-image: none; }
    .header .navbar-toggler { position: absolute; right: 15px; }
    .navbar-collapse { width: 0px; transition: 0.2s ease-in-out;}
    .navbar-collapse.collapsing, .navbar-collapse.collapse.show { width: 250px; position: fixed; height: 100%!important; left: 0px; top: 0px; background-color: #F8F8F8; box-shadow: 0px 0px 10px rgba(0,0,0,0.2); z-index: 5; padding: 0px;  transition: 0.2s ease-in-out; }
    .modasa-menu-section { display: block; padding: 15px 0px; text-align: center; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd;}
    .modasa-menu-section img { width: 100px; }
    .header-text { display: none; }
    .modasa-menu-section .header-text { display: block; text-align: center; }
    .modasa-menu-section .header-text span { display: block !important; }
    .dropdown-menu.show { border: none; background-color: #D4F0FD; padding-left: 25px;}
    .dropdown-item.active, .dropdown-item:active, .dropdown-menu.show a:hover, .dropdown-menu.show a:focus { background-color: #fff; color: #333; border-radius: 5px 0px 0px 5px; }
    
}

@media screen and (max-width: 768px) {
    .assosiation-section { width: 100%; }
	.button-link { font-size: 15px; }
	.page .container .banner h1 {
    font-size: 26px;
    padding-left: 15px;
}
	div.skiptranslate.goog-te-gadget { text-align: center;}
}
