#media-banner{background: url(../images/aboutbanner.png) no-repeat;width: 100%; height: 540px;}
#media-banner h3{color: white; margin-top: 428px; margin-left:0; font-size: 46px;}
#media-banner h3 {margin-left: 69px; font-size: 45px; margin-top: 331px;}


/*Who we are*/
#media {padding-top: 60px; padding-bottom: 0;}
#media .container-fluid {width: 86%;}
#media .col-md-4{padding: 0;}
#media .image{position: relative; margin: 10px; transition: 0.5s; -webkit-transition: 0.5s;}
#media .image .box{transition: 0.5s; -webkit-transition: 0.5s; position: absolute; bottom: -20px; background: #fff; padding: 15px; width: 90%; border-radius: 5px; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
#media .image img{width: 100%;}
#media .image .box p{font-size: 13px;}
#media .image .box h5{font-size: 17px; margin-bottom: 4px; margin-top: 0px;}
#media .image:hover .box{background: #ef4423; transition: 0.5s; -webkit-transition: 0.5s;}
#media .image:hover .box p{color: #fff;}
#media .image .box a{display: none; position: relative; font-size: 13px;}
#media .image:hover .box h5{color: #fff;}
#media .image .box a:after{position: absolute; width: 30px; height: 1px; background: #fff; content: ''; left: 0; display: block; bottom: 8px;}
#media .image:hover .box a{display: block; color: #fff; text-decoration: none; padding-left: 40px;}

/*partners*/
#partners{padding-top: 40px; padding-bottom: 70px;}
#partners .container-fluid {width: 86%;}
#partners .lin {background: #ed1c24; width: 1px; height: 70px; margin-top: 14px; margin: auto;}
#partners img {width: 20%; margin: auto; display: block;}
#partners h3 {text-align: center; color: #000; font-size: 26px; margin-top: 30px;}
#partners p {text-align: center; color: #000; font-size: 14px; margin-top: 15px;}
#partners .bxslider img {width: 65%; margin-top: 50px;}
.bx-wrapper { width: 100%;}
.bx-wrapper li { margin-top: -16px !important;}




* { box-sizing: border-box;}

.row > .column { padding: 0 8px;}
.row:after { content: ""; display: table; clear: both;}
.column { float: left; width: 25%;}
/* The Modal (background) */
.modal { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; background-color: black;}

/* Modal Content */
.modal-content { position: relative; margin: auto; padding: 0; width: 1080px;top: 13%;    background: inherit; box-shadow: none; border: none; border-radius: 0px;}

/* The Close Button */
.close { color: #ffff; position: absolute; top: 10px; right: 25px; font-size: 40px; font-weight: normal; text-shadow: none;}

.close:hover,
.close:focus { color: #ed1c24; text-decoration: none; cursor: pointer;}

.mySlides {display: none;}
.cursor {cursor: pointer;}
.prev,.next {cursor: pointer; position: absolute; top: 50%; width: auto; padding: 16px; margin-top: -50px; color: white; font-weight: bold; font-size: 20px; transition: 0.6s ease; border-radius: 0 3px 3px 0; user-select: none; -webkit-user-select: none;}
.next {right: 0; border-radius: 3px 0 0 3px;}
.prev:hover,.next:hover {background-color: rgba(0, 0, 0, 0.8);}
.numbertext {color: #f2f2f2; font-size: 12px; padding: 8px 12px; position: absolute; top: 0;}
.caption-container {text-align: center; background-color: black; padding: 2px 16px; color: white;}
.demo {opacity: 0.6;}
.active,.demo:hover {opacity: 1;}
.hover-shadow:hover {box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}




@media only screen and (min-width : 1920px) and (max-width : 2560px){ 

#media {padding-top: 70px;}
}




@media only screen and (min-width : 1600px) and (max-width : 1919px){

#media-banner h3 {margin-left: 0; background-size: 100% 100%;}

}




@media only screen and (min-width : 1440px) and (max-width : 1599px){

#media-banner {height:450px; background-size: 100% 100%;} 
#media-banner h3 {margin-left: 0; margin-top: 320px;}

}




@media only screen and (min-width : 1366px) and (max-width : 1439px){
#media-banner {height:380px; background-size: 100% 100%;} 
#media-banner h3 {margin-left: 0; font-size: 36px; margin-top: 265px;}

}




@media only screen and (min-width : 1280px) and (max-width : 1365px){
#media-banner {height:380px; background-size: 100% 100%;} 
#media-banner h3 {margin-left: 0; font-size: 36px; margin-top: 265px;}

}




@media only screen and (min-width : 1200px) and (max-width : 1279px){
#media-banner {height:350px; background-size: 100% 100%;} 
#media-banner h3 {margin-left: 0; font-size: 34px; margin-top: 250px;}

#media .container-fluid {width: 90%;}


}




@media only screen and (min-width : 1024px) and (max-width : 1199px){
#media-banner {height:320px; background-size: 100% 100%;} 
#media-banner h3 {margin-left: 0; font-size: 30px; margin-top: 240px;}

}




@media only screen and (min-width : 768px) and (max-width :1023px){
#media-banner {height:300px; background-size: 100% 100%;} 
#media-banner h3 {margin-left: 12px; font-size: 28px; margin-top: 222px;}

#media {padding-top: 60px;}
#media .image .box {bottom: -40px;}


}




@media only screen and (min-width : 150px) and (max-width : 767px){

#media-banner h3{text-align: center; margin-top: 325px; margin-left: 0; font-size: 24px;}
#media-banner{background: url(../images/about-mobile.png) no-repeat; width: 100%; height: 440px;}
#media .image .box {bottom: -30px;}
 
 
}




@media only screen and (max-width : 375px){

#partners .container-fluid{padding-top: 0px;}
#media .image .box {bottom: -42px;}



}




@media only screen and (max-width : 360px){


}




@media only screen and (max-width : 320px){

#partners .container-fluid{padding-top: 0px;}

}