@font-face {
  font-family:Gotham;
  src: url(../font/Gotham-Medium.otf);
  src: url(../font/GOTHAM-BOLD.otf);
}

@font-face {
  font-family:DINNextLTArabic;
  src: url(../font/DINNextLTArabic-Black.ttf);
  src: url(../font/DINNextLTArabic-Bold.ttf);
}

.background-banner {position: relative;background: url(../img/bn.jpg);background-size: 100% 100%;height: 650px;}
.logo img{width: 150px;}
.text-pear h2{font-weight: bold;font-size: 32px;font-family: DINNextLTArabic;color:#062f87;text-align: right;}
.text-pear h3 {font-weight: 400;font-size: 34px;font-family: Gotham;color:#062f87;letter-spacing: 0px;text-transform: uppercase;}
.text-pear .bottom{font-weight: 500;}
.body-part {background: #062f87;float: left; width: 100%;}
.pd1 {padding: 0px;}
.form-cn {padding:35px 20px;}
.form-cn .form-group {margin-bottom: 40px;}
.form-cn ::-ms-input-placeholder { color: #fff;}
.form-cn .form-group {padding-left: 0px;}
input[type=text] {color: #fff;}
.btn.btn-default.btn-1 {font-family: Gotham;border-radius: 100px;margin-bottom: 20px !important;background: #000;color:#fff;border: none;font-size: 15px;padding: 5px;width: 34%;margin: 0 auto;}
.form-cn .form-control {box-shadow: none;background: no-repeat;border-bottom: 1px solid #fff !important;border: none;border-bottom-color: currentcolor;border-bottom-style: none;border-bottom-width: medium;border-radius: 0px;color:#fff;padding: 0px;}
.form-cn form {float: left;width: 100%;}
.heading hr {width: 10%;float: left;border: 2px solid #fff;margin-top: 10px;}
.form-cn  h1 {color:#fff;font-family: Gotham;font-weight: 500;margin-bottom: 0px;}
.text-pear {width: 96%;}
.text-pear hr {border: 2px solid #062f87;}
.mobile{text-align: right;}
.mobile img{max-width: 100%;position: absolute;right: -8px;top: -20px;height: 600px;}
.link-soceil a {color: #fff;font-family: Gotham;font-weight: 500;}
.instagram{margin-top: 16px;text-align: center; margin-left: 14px;}
.twitter{ margin-top: 16px;text-align: center; margin-left: 14px;}
.facebook { margin-left: 51px;margin-top: 16px;text-align: center;}
.link-soceil li{float: left;list-style: none;}
.footer .fa{width: 100%;text-align: center;}
.footer {height: 80px;float: left;width: 100%;background:url(../img/ft1.png);background-size: auto;background-size: 100%;}
.ftt-1 {float: left;width: 100%;padding: 10px;background:#000;text-align: center;}
.cp1 {margin: 0px;color: #fff;}
.mobile1{display: none;}
.app-img{width: 200px;float:left;margin: 50px 2px;}
.screen-height{height:70VH;}

@media only screen and (max-width:1800px) {
    .facebook {margin-left: 18% !important;}
    .twitter {margin-left: 7%!important;}
    .instagram {margin-left:7% !important;}
}
@media only screen and (max-width:1700px) {
    .facebook {margin-left: 18% !important;}
    .twitter {margin-left: 7%!important;}
    .instagram {margin-left:7% !important;}
}
@media only screen and (max-width:1500px) {
    .facebook {margin-left: 12% !important;}
    .twitter {margin-left: 5% !important;}
    .instagram {margin-left:5% !important;}
}
@media only screen and (max-width:1200px) {
    .mobile img{top: -10px;}
    .app-img {width: 165px;}
    .facebook {margin-left: 10% !important;}
    .twitter {margin-left: 2% !important;}
    .instagram {margin-left: 2% !important;}
    .logo img {width: 100px;margin-top: 15px;}
    .text-pear h2, .text-pear h3{font-size: 22px;}
}
@media only screen and (max-width:768px) {
    .mobile img{top: 13px;z-index: 999;}
    .text-pear h2 {font-size: 40px !important;}
    .link-soceil {width: 44%;margin: 0 auto;}
    .background-banner{height: auto;}
    .footer {background: #12235f !important;}
}

@media only screen and (max-width: 767px) {
    .background-banner{overflow:hidden;background: url(../img/bn_mobile.jpg);background-size: cover;height: 85VH; }
    .logo img {width: 65px;}
    .text-pear hr{margin: 10px 0;}
    .pd1.destop1 {display: none;}
    .mobile1{display:block ! important;}
    .link-soceil { width: 90%;margin: 0 auto;}
    iframe {height: 300px !important;}
    .text-pear {position: relative; top: 50%;transform: translateY(-50%);}
    .facebook {margin-left: 0px !important;}
    .text-pear h2{font-size: 20px !important;margin: 5px 0;}
    .text-pear h3{font-size: 20px !important;margin: 5px 0;}
    .footer {background: #12235f !important;}
    .btn.btn-default.btn-1 {width: 100% !important;}
    .mobile img{top: 225px;right:10px;height: 250px;}
    .form-cn .form-group {margin-bottom: 15px;}
    .form-cn h1{font-size: 22px;}
    .form-cn h1{font-size: 22px;margin-top: 0px;}
    .form-cn .form-control{font-size: 12px;}
    .app-img{width: 150px;}
    .mobile-screen{margin-top: 30px;}
}