@import url('DroidKufiWeb/DroidKufiWeb.css');


body
{
    margin: 0px;
    background: url('../Images/body_bg.png') repeat !important;
    font-family: "HelveticaNeueLTW20",sans-serif;
    direction: rtl;
}




#HeaderContainer{
    background-image: url('../Images/BackContainer1.jpg');
}

#container
{
    margin-top:3px;
    margin-right: auto;
    margin-left: auto;
    width: 960px;
    box-shadow:0 0 20px 2px #ccc inset;
    /*background-color:#c6cd9a;*/
    /*background-color:#f7ffdc;*/
    /*background-color:white;*/
    background-color:white;
}


     #Banner
    {
        width: 960px;
        height: 170px;
        clear: both;
        background-image: url('../Images/BannerAR.jpg');
        margin:0 auto;
    }



    /******************* Top Menu *******************/

     #topmenu
    {
        padding-top: 3px;
        margin:0 auto;
        width: 960px;
        background-color: black;
        height: 30px;
        clear: both;
    }

     #topmenu #search{
         display:inline;
         float:left;
         height: 25px;
     }

         #topmenu .mastermenu
        {
            width: 670px;
            list-style-type: none;
            float: right;
            margin: 0;
            padding: 0px;
        }

             #topmenu .mastermenu li
            {
                display: inline-block;
                float: right;
            }

             #topmenu .mastermenu a
            {
                font-size: 15px;
                font-weight:bold;
                line-height:1;
                color: white;
                float: right;
                text-decoration: none;
                text-align: center;
                height: 25px;
                padding-left: 15px;
                padding-right: 15px;
                padding-top: 4px;
            }

                 #topmenu .mastermenu a:visited
                {
                    font-weight: bold;
                }

                 #topmenu .mastermenu a:hover
                {
                    color: cornflowerblue;
                }
         
 .txtsearch{direction:rtl;padding-right:3px;padding-left:27px;vertical-align:super;font-family:'Sakkal Majalla';float:left;background-color:#ccc;}
 .txtsearch:focus{background-color:white}
 .Imgbtn{position:relative;left:27px;top:2px; float:left}

    /******************* Master Menu *******************/
#HMenuContainer
{
            background-color:#c6c6c6;
        background-position: 0% 0%;
    box-shadow: 0 1px 2px #000;
        background-image: linear-gradient(to bottom, #fff, #A8A8A8);
    background-color: #A8A8A8;
    background-repeat: repeat;
    background-attachment: scroll;
}
 .Hmenu
{
    
        margin:0 auto;
        width:960px;
         height:30px;

}

 .Hmenu .mastermenu
{
    position:relative;
    width:960px;
    list-style-type:none;
    float:right;
    margin:0; padding:0px;
}

 .Hmenu .mastermenu li
{
    display:inline-block;
    float:right;
    position:relative;
}

 .Hmenu .mastermenu a
{
    font-size:14px;	
    font-weight:bold;
    line-height:1.8;
    color:Black;
    float:right;
    text-decoration:none;
    text-align:center;
    height:30px;
    border-left:2px solid #818181;
    padding:0 8px;
}

 .Hmenu .mastermenu a:hover {background-color:white;}



            /**************** Sub-Menu ***********************/
            
 .Hmenu .mastermenu .sm .submenu
{
     display:none;
     position:absolute; 
     top:30px;
     right:-150px;
     width:405px;
     border:1px solid #c6c6c6;
     border-top:0;
     border-bottom:4px solid #004386;
     padding:0px; margin:0px;
     background: #fff;
  z-index:100;
}   
 
 .Hmenu .mastermenu .sm .submenu li{
     width:180px;
     border-bottom:1px solid #ccc;
     margin-right:15px;
     height:30px;
 } 

  .Hmenu .mastermenu .sm .submenu a
 {
     text-align:right;
     cursor:pointer;
     font-size:13px;
     text-decoration:none;
     width:170px; height:18px;
     border-left:0;
     font-family:HelveticaNeueLTW20;
     padding-left:0;
     float:right;
 }

 .Hmenu .mastermenu .sm .submenu a:hover
 {
     color:blue;
     background:0;
 }   


    /**************** MainScript ***********************/

    #container #MainScript
    {
        width: 700px;
        height: 315px;
        float:left;
        padding:6px;
        /*-moz-box-shadow: 0 1px 5px #808080;
    -webkit-box-shadow: 0 1px 5px #808080;
    box-shadow: 0 1px 5px #808080;
    background-color: #eee;*/
        /*background: url('../Images/BackContainer.jpg') repeat;*/
    }
    #more{
        float: left;
        position:absolute;
        top:260px; left:20px;
        color: white;
        font-weight:bold;
    }
    #more:hover{color:red}
    /*********************** Tabs ***********************/
    #container #Tabs
    {
        margin-top: 40px;
        float:right;
        height:255px;
        
            border-bottom:3px solid #004386;
        background-color: #eee;
        -moz-box-shadow: 0 1px 5px #808080;
        -webkit-box-shadow: 0 1px 5px #808080;
         box-shadow: 0 1px 5px #808080;
    }

#tabs
{
    overflow: hidden;
    width: 575px; height:30px;
    margin: 0 ;
    padding: 0;
    list-style: none;
    /*background: #A8A8A8;
  background-image: -webkit-gradient(linear, right top, right bottom, from(#fff), to(#A8A8A8));
  background-image: -webkit-linear-gradient(top, #fff, #A8A8A8);
  background-image: -moz-linear-gradient(top, #fff, #A8A8A8);
  background-image: -ms-linear-gradient(top, #fff, #A8A8A8);
  background-image: -o-linear-gradient(top, #fff, #A8A8A8);
  background-image: linear-gradient(top bottom, #fff, #A8A8A8);
    -moz-box-shadow: 0 1px 5px #808080;
    -webkit-box-shadow: 0 1px 5px #808080;
    box-shadow: 0 1px 5px #808080;*/

}

    #tabs li
    {
        float: right;
        border-left:1px solid #004386;
        height:30px;
    }

    #tabs a
    {
        position: relative;
        padding: 0 18px;
        line-height:1.5;
        float: right;
        height:28px;
        text-decoration: none;
        color: white;
        font-size: 15px;
        font-weight: bold;
    }

       
        #tabs a:hover::after,
        #tabs a:focus,
        #tabs a:focus::after
        {
            color: black;
        border-bottom:2px solid #004386;
        background-color:white;
        }

        #tabs a:focus,#tabs #current a
        {
            outline: 0;
            color: black;
        border-bottom:2px solid #004386;
        background-color:rgb(207, 237, 253);
        }

    #tabs #current a,
    #tabs #current a::after
    {
        z-index: 3;
        color: black;
        border-bottom:2px solid #004386;
        background-color:rgb(207, 237, 253);
    }

#content
{
    position: relative;
    top:3px;
    z-index: 2;
    width:574px
}

.More{
    padding:0 !important;
    width:50px;height:29px;
    float:left;
    font-size:15px;
    color:#eee;
    font-weight:bold;
    text-decoration:none;
}
.More:hover{
    border-bottom:0 !important;
    color:black;
}
.DivMore{
    float:left;
    position:relative;
    bottom:249px;left:5px;
}

/*********************** More News ***********************/
   #container #MoreNews
    {
        margin-top: 20px;
        float:right;
        margin-left:5px;

        background-color: #eee;
        -moz-box-shadow: 0 1px 5px #808080;
        -webkit-box-shadow: 0 1px 5px #808080;
         box-shadow: 0 1px 5px #808080;
    }

#monews
{
    overflow: hidden;
    width: 375px; height:30px;
    margin: 0 ;
    padding: 0;
    list-style: none;
}

    #monews li
    {
        float: right;
        border-left:1px solid #004386;
        height:30px;
    }

    #monews a
    {
        position: relative;
        padding: 0 52px;
        line-height:1.5;
        float: right;
        height:28px;
        text-decoration: none;
        color: white;
        font-size: 17px;
        font-weight: bold;
    }

        
        #monews a:hover::after,
        #monews a:focus,
        #monews a:focus::after
        {
            color: black;
        border-bottom:2px solid #004386;
        background-color:white;
        }

        #monews #current a,#monews a:focus
        {
            outline: 0;
            color: black;
        border-bottom:2px solid #004386;
        background-color:rgb(207, 237, 253);
        }

    #monews #current a,
    #monews #current a::after
    {
        z-index: 3;
        color: black;
        border-bottom:2px solid #004386;
        background-color:rgb(207, 237, 253);
    }

#news
{
    position: relative;
    top:3px;
    z-index: 2;
    width:375px
}

#container #MoreNews #news .tab ul{
    margin:0; padding:0;
    width:375px;
    float:right;
    direction:rtl;
    margin-top:10px;
}

#container #MoreNews #news .tab ul li{
    list-style:none;
    border-bottom:1px solid #bbbbbb;
    padding:5px 0;
    min-height:35px;
}

#container #MoreNews #news .tab ul li:last-child{border-bottom:none;}

#container #MoreNews #news .tab ul li a{
    width:355px; float:left;
    font-family:'Times New Roman';
    font-size:15px;font-weight:bold;
    color:black; text-decoration:none;
}

.NewsMore{margin-left:10px;text-decoration:none;position:relative;bottom:8px;}
.NewsMore:hover{color:red}
#container #MoreNews #news .tab ul li a:hover{color:#0067cc}

/*********************** News Tab ***********************/

#container #Tabs #content #tab1
{
    width: 575px;
    height: 210px;
    text-align: center;
}

.newsimg
    {
    display:block ;
    }

#container #Tabs #content #tab1 ul
    {
        height:210px;
        list-style-type: none;
        margin:0; padding:0;
    }

#container #Tabs #content #tab1 ul li
        {
            display: inline-block;
            float: right; margin-right:5px;
            width: 186px;
            height: 220px;
            background-color:#eee;
        }

#container #Tabs #content #tab1 ul li a
            {
                text-align: justify;
                font-size: 14px;
                font-weight:bold;
                color:black;
                text-decoration: none;
                line-height:18px;
                padding-right:5px;
                font-family:'Times New Roman';
            }

#container #Tabs #content #tab1 ul li a:hover
        {
            color:red;
        }

/****************** More News ********************/
#container #MoreNews{
        width:375px;height:255px;
        border-bottom:3px solid #004386;
        margin-top:40px;float:left;
        background-color:#eee;
}

/*********************** Events Tab ***********************/

#container #Tabs #content #tab2
{
    height: 210px;
    text-align: center;
}

.newsimg
    {
    display:block ;
    }

#container #Tabs #content #tab2 ul
    {
        width: 960px; height:210px;
        list-style-type: none;
        margin:0; padding:0;
    }

#container #Tabs #content #tab2 ul li
        {
            display: inline-block;
            float: right; margin-right:5px;
            width: 186px;
            height: 220px;
            background-color:#eee;
        }

#container #Tabs #content #tab2 ul li a
            {
                text-align: justify;
                font-size: 14px;
                font-weight:bold;
                color:black;
                text-decoration: none;
                line-height:18px;
                padding-right:5px;
                font-family:'Times New Roman';
            }

.Details:hover
        {
            color:red;
        }

/*********************** Cultrual Tab ***********************/

#container #Tabs #content #tab8
{
    height: 210px;
    text-align: center;
}


#container #Tabs #content #tab8 ul
    {
        width: 960px; height:210px;
        list-style-type: none;
        margin:0; padding:0;
    }

#container #Tabs #content #tab8 ul li
        {
            display: inline-block;
            float: right; margin-right:5px;
            width: 186px;
            height: 209px;
            background-color:#eee;
        }

#container #Tabs #content #tab8 ul li a
            {
                text-align: justify;
                font-size: 14px;
                font-weight:bold;
                color:black;
                text-decoration: none;
                line-height:14px;
                padding-right:5px;
                font-family:'Times New Roman';
            }

/*********************** Clender Tab ***********************/

.cleheader{
    height:20px;
    padding:5px;
    vertical-align:middle;
}
#CleDetails
{
    width:360px;height:200px;
    position:absolute;
    display:inline !important;
    top:-5px; left:0;
    z-index:100;
}


#CleDetails ul li{
    display:block;
    vertical-align:top;
    width:100%;
    height:60px;
    margin-top:10px;
    background-color:cornsilk;
    -moz-box-shadow: 0 1px 5px #808080;
    -webkit-box-shadow: 0 1px 5px #808080;
    box-shadow: 0 1px 5px #808080;
    line-height:23px;
}

#CleDetails ul li a{
    text-decoration:none;
    color:black;
    font-size:14px;
    margin-right:5px;
}
#CleDetails ul li:hover > a{
    color:red;
}

#Calendar_cEvents{
    -moz-box-shadow: 0 1px 5px #808080;
    -webkit-box-shadow: 0 1px 5px #808080;
    box-shadow: 0 1px 5px #808080;
    background-color:cornsilk;
}

#Calendar_cEvents tr:last-child{display:none}
#Calendar_cEvents tr table tr:last-child{display:table-row !important}
tbody{font-size:13px;}

.EventLogo{
    float:right;
}

/******************* Row3 *******************/


#container #row3
{
    display: inline-block;
    width: 100%;
    direction:ltr;
    margin-top:20px;
}

    #container #row3 #ListofExcellence
    {
        width: 378px;
        height: 265px;
        float: left; margin-left:5px;
        background-color: #eee;
        -moz-box-shadow: 0 1px 5px #808080;
        -webkit-box-shadow: 0 1px 5px #808080;
         box-shadow: 0 1px 5px #808080;
    }

    #container #row3 #adv
    {
        width: 305px;
        height: 265px;
        float: left;
        margin-left:5px;
        background-color: #eee;
        -moz-box-shadow: 0 1px 5px #808080;
        -webkit-box-shadow: 0 1px 5px #808080;
         box-shadow: 0 1px 5px #808080;
    }
     #container #row3 #adv1
    {
        width: 180px;
        height: 265px;
        float: left;
        margin-left:5px;
        background-color: #eee;
        -moz-box-shadow: 0 1px 5px #808080;
        -webkit-box-shadow: 0 1px 5px #808080;
         box-shadow: 0 1px 5px #808080;
    }
    #container #row3 #pull
    {
        width: 250px;
        height: 265px;
        float: left;
        margin-left:5px;
        background-color: #eee;
        -moz-box-shadow: 0 1px 5px #808080;
        -webkit-box-shadow: 0 1px 5px #808080;
         box-shadow: 0 1px 5px #808080;
    }
    .row3Title{
        font-size:22px;
        line-height:1.4;
    }

/******************* Row4 *******************/

#container #row4
{
    width: 960px;
    height: 170px;
    margin-top:8px;
}

    #container #row4 ul
    {
        width: 100%;
        list-style-type: none;
        float: right;
        margin:0;
    }


        #container #row4 ul li
        {
            display: inline-block;
            float: right;
            text-align:center;
            width:135px;height:150px;
        }

            #container #row4 ul li .imgrow4
            {
                border-radius:100%;
                border:1px solid #ccc;
                background-color:#eee;
                font-size: 14px;
                color: Black;
                font-weight: bold;
                float: right;
                text-decoration: none;
                text-align: center;
                height: 100px;
                margin-right: 30px;
            }
            #container #row4 ul li:hover > .imgrow4 {opacity:0.7}
            #container #row4 ul li:hover > .name a{color:red}

             #container #row4 ul li .name{
                 width:100px;
                 font-size:12px;
                 font-weight:bold;
                 line-height:1.4;
                 float:right;
                 text-align:center;
                 padding-right:25px;
                 font-family:Tahoma;
             }

                #container #row4 ul li .name a {
                    float:right;
                 text-decoration:none;
                 color:black;
                 width:100px;
                }

/******************* Footer *******************/

#FooterContainer{
    width:100%; min-height:210px;
    background-color:#505050 ;
}

#Behind {
    background-color:white;
    height:215px;
}

#Behind ul li p{color:black;border-bottom: 2px solid black;width:250px}
#Behind ul li .footercontent li a{color:#004386}
#Behind ul li .footercontent li a:hover{color:red}

 .Footer
{
    width: 960px;
    margin:0 auto;
}

 .btnFooter{
     width:140px;height:23px;
     margin-left:auto;margin-right:auto;
     background-image:url('../Images/ImpLink.png');
     font-size:16px;
     cursor:pointer; 
     position:relative;
     bottom:6px;    
 }
 .btnFooter a{
     position:absolute;
     bottom:1px;
     right:35px;
     font-weight:bold;
 }

 .btnFooter:hover{color:#ccc}

.Footer ul
    {
        list-style-type: none;
        height: 155px;
        margin:0;
    }

.Footer ul li
        {
            display: inline-block;
            float: right;
            width: 250px;
            color:white;
        }

 .Footer ul li p
            {
                width: 200px;
                text-align: right;
                padding-right: 10px;
                border-bottom: 2px solid white;
                font-weight: bold;
                font-size: 15px; letter-spacing:1px;
                color:white;
                margin:0 0.2em;
            }

 .Footer ul li .footercontent
            {
                list-style-type: none;
                width:250px;
                float:right;
            }

 .Footer ul li .footercontent li
                {
                    display: block;
                    float: right;
                    border: 0;
                }

 .Footer ul li .footercontent li a
                    {
                        font-size: 13px;
                        font-weight:bold;
                        line-height:22px;
                        float: right;
                        text-decoration: none;
                        text-align: right;
                        margin-right: 20px;
                        color: #FFF380;
                    }

 .Footer ul li .footercontent li a:hover
                        {
                            color: black;
                        }
 .Footer ul li .contact .footercontent li a:hover
            {
                text-decoration: none;
                color: #FFF380;
            }

 .Footer ul .Contacts ul{width:100%;display:inline;float:left;height:40px;width:230px;padding:0}
 .Footer ul .Contacts ul li{width:43px;height:43px;margin:2px;margin-left:7px;}
  .Footer ul .Contacts ul li a{width:43px;height:43px;float:left;}

 .Footer ul .Contacts ul #google{background-image:url('../Images/Contacts/11.png')}
 .Footer ul .Contacts ul #youtube{background-image:url('../Images/Contacts/22.png')}
 .Footer ul .Contacts ul #twitter{background-image:url('../Images/Contacts/44.png')}
 .Footer ul .Contacts ul #face{background-image:url('../Images/Contacts/55.png')}


 .Footer ul .Contacts ul #google:hover{background-image:url('../Images/Contacts/1.png');cursor:pointer;}
 .Footer ul .Contacts ul #youtube:hover{background-image:url('../Images/Contacts/2.png');cursor:pointer;}
 .Footer ul .Contacts ul #twitter:hover{background-image:url('../Images/Contacts/4.png');cursor:pointer;}
 .Footer ul .Contacts ul #face:hover{background-image:url('../Images/Contacts/5.png');cursor:pointer;}


 .DivHeader{
     color:white;
            border-top-left-radius:5px;
            border-top-right-radius:5px;
            height:35px;
            background: rgb(37,104,186); /* Old browsers */
            background: -moz-linear-gradient(top, rgba(37,104,186,1) 0%, rgba(41,137,216,1) 50%, rgba(37,145,234,1) 51%, rgba(0,67,135,1) 100%); /* FF3.6+ */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(37,104,186,1)), color-stop(50%,rgba(41,137,216,1)), color-stop(51%,rgba(37,145,234,1)), color-stop(100%,rgba(0,67,135,1))); /* Chrome,Safari4+ */
            background: -webkit-linear-gradient(top, rgba(37,104,186,1) 0%,rgba(41,137,216,1) 50%,rgba(37,145,234,1) 51%,rgba(0,67,135,1) 100%); /* Chrome10+,Safari5.1+ */
            background: -o-linear-gradient(top, rgba(37,104,186,1) 0%,rgba(41,137,216,1) 50%,rgba(37,145,234,1) 51%,rgba(0,67,135,1) 100%); /* Opera 11.10+ */
            background: -ms-linear-gradient(top, rgba(37,104,186,1) 0%,rgba(41,137,216,1) 50%,rgba(37,145,234,1) 51%,rgba(0,67,135,1) 100%); /* IE10+ */
            background: linear-gradient(to bottom, rgba(37,104,186,1) 0%,rgba(41,137,216,1) 50%,rgba(37,145,234,1) 51%,rgba(0,67,135,1) 100%); /* W3C */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2568ba', endColorstr='#004387',GradientType=0 ); /* IE6-9 */
 }