@font-face
{
    src:url(../fonts/AraAsmaaBeltajie-Regular.otf);
    font-family:ara;
}

@font-face
{
    src:url(../fonts/Muslimah_Light.otf);
    font-family:light;
}

@font-face
{
    src:url(../fonts/Ara_Ahrar.otf);
    font-family:ahrar;
}

/*header*/

.row
{
    margin-right: 0px;
    margin-left: 0;
}

.article_text
{
    overflow:hidden;
    max-height:200px;
}
.mainheader
{
    text-align:center;
    background-image:url('../images/sora.jpg') ;
    background-repeat: no-repeat;
    background-size:cover;
}

.overlay
{
    background-color: rgba(242, 242, 250, 0.35);
}


.logo
{
    border:2px #2c1154 solid ;
    margin: 0px auto;
    margin-top:70px;
    border-radius:50%;
    box-shadow: 5px 5px 2px rgba(38, 17, 56, 0.49);
}

.header h1
{
   color: white;
    width:30%;
    font-size:70px;
    text-align:center;
    margin:auto;
    font-family: light;
    margin-top: 3px;
    margin-bottom: 30px;
    font-weight:900;
    border:1px solid white;
    box-shadow: 5px 5px 2px rgba(4, 4, 25, 0.15);
    border-radius:20px;
    background-color:rgba(4, 4, 25, 0.30);
}

.header h3
{
    color:white;
    width:40%;
    font-size:18px;
    text-align:center;
    margin:auto;
    font-family:Ahlan;
    margin-bottom:80px;
    background-color:rgba(38, 17, 56, 0.59);
    box-shadow: 5px 5px 2px rgba(4, 4, 25, 0.15);
    padding:20px;
    border-radius:20px;
    line-height:22px;
}

@media (max-width: 1020px)
{

.mainheader
{
    text-align:center;
    background-image:url('../images/sora.jpg') ;
    background-repeat: no-repeat;
    background-size:100% 100%;

}

.logo
{
    margin-top:30px;
}

.header h1
{
    font-size:50px;
    width:50%;
    margin-bottom: 25px;
}

.header h3
{
    width:60%;
    margin-bottom:30px;
}

}


/*nav*/

.nav
{
    margin-top:10px;
    margin-bottom:10px;
}

.navbar-header button
{
    background-color:#adabab;
}

.dropdown-menu li a
{
      color: #3c1870;
      font-family:ara;
      font-size: 19px;
}

.navbar-header a
{
     padding: 14px 16px;
     margin-top:20px;
     font-size: 35px;
     font-family:light;
     font-weight:900;
     margin-right:20px;
     margin-left:10px;
     margin-bottom:10px;
     color:#ad74ac;
     border-bottom:2px solid;
}

.style
{
      color: #3c1870;
      text-align: center;
      padding: 14px 16px;
      font-size: 20px;
      border-radius: 25px;
      font-family:ara;
      margin-right:10px;
      margin-left:10px;
      margin-top:5px;
      margin-bottom:10px;
      background-color:white;
      box-shadow: 5px 5px 2px rgba(4, 4, 25, 0.25);
      border-radius:20px;
      border-bottom:1px solid #3c1870;
}

.nav li a:hover
{
	background-color:#f6f000;
}


/*gallary*/



.gallary
{
    background-color:#cccbcb;
    border-radius:20px;
    box-shadow: 5px 5px 2px rgba(38, 17, 56, 0.49);
    padding:20px;
    margin-bottom:40px;
}

.gallary h1
{
    margin-left:10px;
    color:white;
    width:100%;
    margin:auto;
    text-align:center;
    border : 1px solid #808080;
    background-color:#3c1870;
    font-family:ara;
    padding:20px;
    border-radius:50px;
    font-size:25px;
    box-shadow: 5px 5px 2px rgba(38, 17, 56, 0.49);
    margin-bottom:15px;
}

.thumb
{
    margin-right:0px;
}

.first-child
{
    margin-left:0px;
}

.last-child
{
    margin-right:0px;
}

.gallary img:hover
{
    box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
#gal div{
    float:right;
    margin-left:-16px;
}
/*social media items*/

.l_item
{
    border-radius: 25px;
}

/*slider*/

.carousel-inner > .item > img ,
.carousel-inner > .item > a > img
{
      width: 50%;
      margin: auto;
}


/*content*/

.content
{
    padding:30px;
    text-align:center;
}

.content .float
{
    float:right;
}
.text_container
{
text-align: center;
text-align: -webkit-center;
}
.home_title
{
    color:white;
    width:60%;
    margin:auto;
    text-align:center;
    border : 1px solid #808080;
    background-color:#3c1870;
    font-family:ara;
    padding:15px;
    border-radius:50px;
    font-size:25px;
    box-shadow: 5px 5px 2px rgba(38, 17, 56, 0.49);
    margin-bottom:15px;
}

.content  img
{
    margin:20px;
    box-shadow: 5px 5px 2px rgba(38, 17, 56, 0.49);

}

.content  p
{
     margin:20px;
     font-size:22px;
     font-family: 'Arabic Typesetting';
     color:#3c1870;
}

.content .subP
{
    text-align:right;
}

.content  .subRow
{
    text-align:center;
}

.content .subRow .first
{
    margin-right:5px;
}

.content  .subRow .second
{
    margin-left:5px;
}

.content .mainRow
{
    text-align:center;
    margin-bottom:15px;
    border : 1px solid #808080;
    background-color:#cccbcb;
    box-shadow: 5px 5px 2px rgba(38, 17, 56, 0.49);
    border-radius:20px;


}

.content  .subCol
{
     border : 1px solid #808080;
     background-color:#cccbcb;
    border-radius:20px;

}

.content .first
{
    margin-right:5px;
}

.content .second
{
    margin-left:5px;
}

.content .subRow
{
    margin-bottom:10px;
}

.content .btn-primary {
    color: white;
    background-color: #7b51b7;
    margin-bottom: 40px;
    font-size: 18px;
    border-radius:50px;
    font-family:'Simplified Arabic Fixed';
        box-shadow: 5px 5px 2px rgba(38, 17, 56, 0.49);


}

.content .button
{
    text-align:center;
}

.content .btn-primary:hover
{
	background-color:#b7b7b7;
}

.content img
{
    float:right;
}

.last_col
{
    width:100%;
    text-align:center;
}

.last_col h1
{
    width:35%;
}


/*footer*/

.footer h1
{
    color:#cccbcb;
    text-align:center;
    font-family:ara;
    margin-bottom:20px;
}

.footer
{
    padding:30px;
    background-color:#3c1870;
    text-align:center;
}

.footer img
{
    margin-right: 10px;
    margin-bottom:20px;
    box-shadow: 5px 5px 8px rgba(171, 88, 245, 0.43);
    border-radius:50%;
}


.footer p
{
    color:white;
    font-family:'Simplified Arabic';
    font-size:18px;
}


.btn-primary {
    color: #3c1870;
    background-color: white;
    margin-bottom:10px;
    font-size:18px;
    box-shadow: 3px 3px 8px rgba(171, 88, 245, 0.43);

}

.footer .copywrite p
{
    margin-top:40px;
    color:#cccbcb;
    font-size:20px;
    font-family:'Bookman Old Style';
}

.btn-primary:hover
{
	background-color:#808080;
}