﻿body {
    background-color:#e6e6e6;
}

p{
     text-align: justify;
}

hr{
    margin:0 !important;
}

.btn_anchor{
    color:white !important;
    text-decoration:none !important;
    margin:0px !important;
}

.input{
    border:1px solid silver;
    padding:0px 4px;
    margin:1px;
}

.input:hover {
    border: 1px solid gray;
    padding: 0px 4px;
    margin: 1px;

}



.input:read-only {
    border: 1px solid silver;
    padding: 0px 4px;
    margin: 1px;
    background:#e6e6e6;
}


select {
    border: 1px solid silver;
    padding: 0px 4px;
    margin: 1px;
}

    select:hover {
        border: 1px solid gray;
        padding: 0px 4px;
        margin: 1px;
    }


.input_warn {
    border: 1px solid #ff9191 !important;
    background: #fdedf3;
}


.leftContentContainer{
    border-right:1px solid #e6e6e6;
}

.m-t-5{margin-top:50px;}
.m-b-5 {
    margin-bottom: 50px;
}

.border-b-1px-dashed{border-bottom:1px dashed silver;}

.RecentActivity {
    padding: 15px;
    border-bottom: 1px ridge #e6e6e6;
    border-left: 1px dotted #e6e6e6;
    border-right: 1px dotted #e6e6e6;
}

.RecentActivity:hover {
    cursor:text;
    border-bottom: 1px ridge silver;
    border-left: 1px dotted silver;
    border-right: 1px dotted silver;
}



.DashboardCard{
    height:200px;
    overflow:auto;
    padding:3px;
}

.DashboardCardFluid {
    height: 253px;
    overflow: auto;
    padding: 3px;
}


@media all  {




.Navigation {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.Navigation li {
  float: right;
}

 .Navigation li a {
  display: block;
  padding: 8px;
  background-color: #088FD3;
  color:white;

  border-left:1px solid black;
  border-right:1px solid black;
}
 .Navigation li a:hover {
  display: block;
  padding: 8px;
  background-color: black;
  color:#eeeeee;
  
  cursor:pointer;
  border-left:1px solid #088FD3;
  border-right:1px solid #088FD3;

}



 .text-white{color:white;}



    /* Footer Starts*/

    #Footer {
        border-top: 1px solid silver;
        padding-top: 10px;
        text-align:left;
    }

    #Footer b {
            font-size: medium;
            letter-spacing: 3px;
            color: #9e7a37;
        }

    #Footer ul {
            list-style: none;
            padding: 10px;
        }

    #Footer a {
            color: #907f72;
            text-decoration: none;
            letter-spacing:2px;
        }

    #Footer a:hover {
                color: #907f72;
                text-decoration: underline;
            }

    /* Footer Ends*/


    .DialogHelper{
        width:600px !important;
    }


    /* Header Starts*/
        
    #HeaderContainer
    {
        background-color:#161716;
        padding:5px;
        border-bottom:1px solid #4aa141;
        position:fixed;
        top:0px;
        z-index:999;
        width:100%;
    }

    #headerBranding a{
        letter-spacing:5px;
        color:#e6e6e6;
        font-size:22px;
        text-decoration:none;
    }
    #headerBranding span{
        font-size:12px;
    }

    #headerSearchContainer{
        text-align:center;   
        vertical-align:middle;
    }

    #headerSearchContainer input{
        text-align:left;
        width:90%;
        padding:3px 10px 3px 10px;
        margin:3px 0 3px 0;
        background-color:gray;
        border:1px solid darkgray;
        color:black;
    }

    #headerSearchContainer input:focus{
        background-color:white;
        border:1px solid darkgray;
        color:black;
    }

    #headerSearchContainer input::-webkit-input-placeholder { /* Edge */
        color: black;
    }

    #headerSearchContainer input:-ms-input-placeholder { /* Internet Explorer */
        color: black;
    }

    #headerSearchContainer input::placeholder {
        color: black;
    }

    #headerButtonContainer{
        text-align:right;
        color:white;
        padding:5px;
    }

    #headerButtonContainer a{
        color:silver;
        text-decoration:underline;
        margin:5px;
    }

    #headerButtonContainer a:hover{
        color:#e6e6e6;
        text-decoration:none;
    }

    /* Header Ends*/


    /* Main Container Starts */

    #MainContainer{
        padding-top:40px;
        background-image:url(/Content/D1/images/bg2.png);
        background-position-y:top;
        background-position-x:center;
        background-repeat:repeat-x;
    }

    /* Main Container Ends*/

    
    /* Secondry Identity Starts*/

    #SecondryIdentity{
      display:none;
    }

    #SecondryIdentity a{
        width:95%;
        margin:3px;
    }

    /* Secondary Identity Ends */


    /* Search Bar Starts */

    #SearchBar{
        text-align:center;
        padding:5px;
    
        z-index:999;
    }

    #SearchBar button {
     
        
    }


    /* Search Bar Ends */


    /* Card Helper starts */

    .CardHelper{
        margin:15px;
    }

    /* Card Helper Ends */


    /* side bar list Starts */

    .sideNavigationBar{
        border-right:1px solid gray;
        border-top:1px solid gray;
        padding:10px 20px 10px 20px;
        background-color:#e6e6e6;
    }

    .sideNavigationBar h5{
        padding:10px;
    }

    .sideNavigationBar ul{
        font-size:small;
        list-style:none;
    }

    .sideNavigationBar li{
        padding:3px 7px 3px 4px;
    }

    .sideNavigationBar li.selected{
        font-weight:bold;
    }

    /* side bar list Ends */

        /* Load button Starts*/

    .LoadButtonContainer{
        padding:0px 150px 0px 150px;
    }

    .LoadButton{
        border:1px solid gray;
        width:100%;
        padding:10px;
        margin:5px 0px 5px 0px;
        background:orange;
        color:white;
        font-weight:bold;
        cursor:pointer;
    }
    
    .LoadButton:disabled{
        
        background:#ffa366;
        
    }

    /* Load button Ends*/


    /* content stuff */

#PostContent{
    padding:20px;
}



#PostContent .ContentClass{
    border-bottom:1px dashed silver;
    margin-bottom:20px;
}

    /*content stuff*/


    /*Answer Content Starts*/

    .DiscussionContainer{
        padding:15px;
        /*border-top:1px dotted gray;*/
    }

    .DiscussionCard{
        padding:15px;
        border-top:1px dotted gray;
    }

    .DiscussionCard:hover{
        padding:15px;
        border-top:1px dashed gray;
    }

    .DiscussionCard iframe{
        width:100% !important;
    }

     .identity{
        background:#70B270;
        border:1px solid #449444;
        padding:5px 25px 5px 25px;
        border-radius:5px 0;
    }
     .IdentityTimeStamp{
         font-size:small;
         color:#248f24;
     }

     .identity img{
        width:50px;
        border-radius:20px;
        border:none;
    }


    /*Answer Content Ends*/

       /* Post Header View Starts */
    .PostHeaderView{
    display:block;
   
   
}
     /* Post Header View Ends*/

     #headerButtonContainerSec{
         display:block;
     }



     /* notifications start */

     #notificationContainer{
         border:1px solid silver;
         background:black;
         width:400px;
         position:fixed;
     }

 #notificationContainer a{
         text-decoration:none;
     }     

     #notificationContainer h5{
         color:#e6e6e6;
         display:block;
         width:400px;
         padding:10px;
         margin:0 !important;
         border-bottom:1px solid silver;
     }
     #notificationContainer div{
         color:black;
         display:block;
         background:#eeeeee;
     }

     #notificationContainer ul{
         list-style:none;
         display:contents;
     }

      #notificationContainer li{
         padding:10px;
         border-bottom:1px dashed gray;
         
     }
      #notificationContainer li:hover{
         padding:10px;
         border-bottom:1px dashed black;
         font-weight:500;
         cursor:pointer;
     }

       #notificationContainer li.active{
         padding:10px;
         border-bottom:1px dashed black;
         font-weight:500;
         cursor:pointer;
         background:white;
     }

       #notificationContainer li div{
         font-size:small;
         display:block;
         text-align:right;
         color:gray;
         background:none;
     }



     /* notifications end */


     /* - Calendar Start - */

     
#calendarContainer{
    padding:5px;
    border-radius:5px;
}

#calendarContainer .headerContainer{
    padding:10px;
}

#calendarContainer h4{
    
    color:white;
    letter-spacing:3px;
}

#calendarContainer .buttoContainer{
    text-align:right;
}

#calendarContainer .buttoContainer button{
    width:auto;
}


.year-grid-container {
  display: grid;
  grid-template-columns: auto auto;
  padding: 10px;
}
.decade-grid-container {
  display: grid;
  grid-template-columns: auto auto auto;
  padding: 10px;
}

.month-grid-container {
  display: grid;
  grid-template-columns: auto auto auto auto auto auto auto;
  padding: 10px;
}

.grid-item {
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.8);
  padding: 7px;
  font-size: 30px;
  text-align: center;
  border-radius:8px;
}
.grid-item:hover {
  background-color: rgba(245, 207, 168, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.8);
  padding: 7px;
  font-size: 30px;
  text-align: center;
  border-radius:8px;
  cursor:pointer;
}


.grid-item-disabled {
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.8);
  padding: 7px;
  font-size: 30px;
  text-align: center;
  border-radius:8px;
}

.grid-item-header {
  background-color: rgb(247, 140, 7);
  border: 1px solid rgba(0, 0, 0, 0.8);
  padding: 7px;
  color:white;
  font-size: 30px;
  text-align: center;
  border-radius:8px;
}

     /* - Calendar End - */


}

@media only screen and (max-width: 800px) {
    /* Footer Starts*/

    #Footer {
        border-top: 1px solid silver;
        padding-top: 10px;
        padding-right:10px;
        text-align:center;
        font-size:x-large;
    }

    #Footer b {
            font-size: x-large;
            letter-spacing: 3px;
            color: #9e7a37;
        }

    #Footer ul {
            list-style: none;
            padding: 10px;
        }

    #Footer a {
            color: #907f72;
            text-decoration: none;
        }

    #Footer a:hover {
                color: #907f72;
                text-decoration: underline;
            }

    /* Footer Ends*/

    .DialogHelper{
        width:100% !important;
    }

       /* Header Starts*/
        
    #HeaderContainer
    {
        background-color:#161716;
        padding:5px;
        border-bottom:1px solid #4aa141;
        position:relative;
        top:0;
        z-index:999;
        width:100%;
    }

    #headerSearchContainer{
        text-align:center;   
        vertical-align:middle;
    }

    #headerSearchContainer input{
        text-align:left;
        width:90%;
        padding:3px 10px 3px 10px;
        margin:3px 0 3px 0;
        background-color:gray;
        border:1px solid darkgray;
        color:black;
    }

    #headerSearchContainer input:focus{
        background-color:white;
        border:1px solid darkgray;
        color:black;
    }

    #headerSearchContainer input::-webkit-input-placeholder { /* Edge */
        color: black;
    }

    #headerSearchContainer input:-ms-input-placeholder { /* Internet Explorer */
        color: black;
    }

    #headerSearchContainer input::placeholder {
        color: black;
    }

    #headerButtonContainer{
        text-align:right;
        color:white;
        padding:5px;
    }

    #headerButtonContainer a{
        color:silver;
        text-decoration:underline;
        
    }

    #headerButtonContainer a:hover{
        color:#e6e6e6;
        text-decoration:none;
    }

     #headerButtonContainer button{
        display:none;
    }

    /* Header Ends*/

    /* Main Container Starts */

    #MainContainer{
        padding-top:25px;
    }

    /* Main Container Ends*/


    /* Secondry Identity Starts*/

    #SecondryIdentity{
        padding:5px;
        text-align:center;
        display:block;
    }

    #SecondryIdentity button{
        width:95%;
        margin:3px;
    }

    /* Secondary Identity Ends */

    /* Search Bar Starts */

    #SearchBar{
        text-align:center;
        padding:5px;
        position:fixed;
        bottom:10px;
        left:2px;
        width:90%;
        z-index:999;
    }

    #SearchBar button {
        
        display:block;
        float:none;
        
    }


    /* Search Bar Ends */


    /* Card Helper starts */

    .CardHelper{
        margin:10px 0px 10px 0px;
    }

    /* Card Helper Ends */

        /* Load button Starts*/

        .LoadButtonContainer{
        padding:0px 0px 0px 0px;
    }

    .LoadButton{
        border:1px solid gray;
        width:100%;
        padding:10px;
        margin:5px 0 5px 0;
        background:orange;
        color:white;
        font-weight:bold;
    }

    .LoadButton:disabled{
        
        background:#ffa366;
        
    }

    /* Load button Ends*/


    /* content stuff */

#PostContent{
    padding:20px;
}



#PostContent .ContentClass{
    border-bottom:1px dashed silver;
    margin-bottom:20px;
}

#PostContent img{
    width:100% !important;
    
}

    /*content stuff*/


      .DiscussionContainer{
        padding:15px;
        /*border-top:1px dotted gray;*/
    }

    .DiscussionCard{
        padding:15px;
        border-top:1px dotted gray;
    }

    .DiscussionCard:hover{
        padding:15px;
        border-top:1px dashed gray;
    }

    .DiscussionCard iframe{
        width:100% !important;
    }

     .DiscussionCard img{
        width:100% !important;
        height:auto !important;
    }


    /* Post Header View Starts */
    .PostHeaderView{
    display:none;
   
   
}
 
        /* Post Header View Ends*/

        #headerButtonContainerSec{
         display:none;
     }



        /* notifications start */

     #notificationContainer{
         border:1px solid silver;
         background:black;
         width:100%;
         position:fixed;
     }

 #notificationContainer a{
         text-decoration:none;
     }     

     #notificationContainer h5{
         color:#e6e6e6;
         display:block;
         width:400px;
         padding:10px;
         margin:0 !important;
         border-bottom:1px solid silver;
     }
     #notificationContainer div{
         color:black;
         display:block;
         background:#eeeeee;
     }

     #notificationContainer ul{
         list-style:none;
         display:contents;
     }

      #notificationContainer li{
         padding:10px;
         border-bottom:1px dashed gray;
         
     }
      #notificationContainer li:hover{
         padding:10px;
         border-bottom:1px dashed black;
         font-weight:500;
         cursor:pointer;
     }

       #notificationContainer li.active{
         padding:10px;
         border-bottom:1px dashed black;
         font-weight:500;
         cursor:pointer;
         background:white;
     }

       #notificationContainer li div{
         font-size:small;
         display:block;
         text-align:right;
         color:gray;
     }




     /* notifications end */




     /* - Calendar Start - */

     
#calendarContainer{
    padding:5px;
    border-radius:5px;
}

#calendarContainer h4{
    padding:10px;
    color:white;
    letter-spacing:3px;
}

#calendarContainer .buttoContainer{
    text-align:right;
}

#calendarContainer .buttoContainer button{
    width:100%;
}


.year-grid-container {
  display: grid;
  grid-template-columns: auto auto;
  padding: 10px;
}
.decade-grid-container {
  display: grid;
  grid-template-columns: auto auto auto;
  padding: 10px;
}

.month-grid-container {
  display: grid;
  grid-template-columns: auto auto auto auto auto auto auto;
  padding: 10px;
}

.grid-item {
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.8);
  padding: 7px;
  font-size: 22px;
  text-align: center;
  border-radius:8px;
}
.grid-item:hover {
  background-color: rgba(245, 207, 168, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.8);
  padding: 7px;
  font-size: 22px;
  text-align: center;
  border-radius:8px;
  cursor:pointer;
}

     /* - Calendar End - */

}


.hide{
    display:none;
}

.show{
    display:block;
}




#FooterDeco{
    background-image:url(/Content/D1/images/footerImg2.png);
    background-position-y:bottom;
    background-position-x:center;
    background-repeat:no-repeat;
    height:100px; 
}

#FooterDecoBase {
    
    font-size:small;
    color:#de6c0b;
}

#footerCopyRightContainer {
    color: #0a66c5;
    letter-spacing: 2px;
}


#BannerContainer{
    
    background-image: linear-gradient(#74C1E8, #B8D177);
    
}

#Banner{
    background-image:url(/Content/D1/images/banner.png);
    background-position-y:top;
    background-position-x:center;
    background-repeat:no-repeat;
    height:315px; 
}

.p-a-03{
    padding:3px;
}
.p-a-1{
    padding:10px;
}

.p-s-5 {
    padding-right: 50px;
    padding-left: 50px;
}

.p-l-1{
    padding-left:10px;
}

.m-a-1{
    margin:10px;
}
.m-a-2{
    margin:20px;
}
.m-a-3{
    margin:30px;
}


.QuestionContainer{
    padding:5px 10px 5px 10px;
    border-bottom:1px dashed gray;
}

.QuestionAttributes{
    font-size:small;
}



.PostGroup{
    border-top:1px dotted gray;
    padding:20px;
    margin-right:20px;
    margin-left:20px;
}

#HotQuestions{
    list-style-image:url('/Content/D1/images/bullet.png')
}

#HotQuestions li{
    border-bottom:1px dashed #eeeeee;
}


#PostHeader{
    border-bottom:1px solid silver;
    padding:15px 15px 5px 15px;
}

#PostHeader p{
    font-size:small;
    padding-left:20px;
    color:#262626
}

#PostHeader span{
    font-size:small;
    text-align:right;
    color:#262626;
   
}



.w-100{
    width:100%;
}
.w-30{
    width:30%;
}

.w-5 {
    width: 5%;
}

.w-7 {
    width: 7%;
}

.w-10{
    width:10%;
}

.w-15 {
    width: 15%;
}

.w-20 {
    width: 20%;
}
.w-25 {
    width: 25%;
}

.w-50-p { width: 50px;}
.w-100-p {width:100px;}
.w-150-p {width: 150px;}
.w-200-p {
    width: 200px;
}
.pagingContainer {
    background-color: #e6e6e6;
    font-size: small;
    border-bottom: 1px dashed silver;
    padding-left: 10px;
    padding-right: 10px;
}

.text-small{font-size:small;}
.tableHeader {
    border-top: 1px dashed silver;
    background: #e6e6e6;
}

.tableRaw{
    border-bottom:1px solid silver;
}
.tableRaw:hover {
    border-bottom:1px solid Gray;
}


.DiscussionItemHeader{
    margin-bottom:15px;
}

.DiscussionItemHeader h6{
    margin:0 !important;
    font-size:larger;
}
.DiscussionItemHeader small{
    font-size:small;
}

.commentContainer{
    border-bottom:1px dashed silver;
}

.cursorFinger{
    cursor:pointer;
}



#ClockContainer{
    padding:50px;
}

#ClockContainer h1 h4{
    margin:0px !important;
}

.row-helper{
    margin-left:0px !important;
    margin-right:0px !important;
}

.border-silver
{border:1px solid silver;}
.border-silver:hover
{border:1px solid gray;}

.m-t-1{margin-top:10px;}

.subHeader{
    border-bottom:1px dashed silver;
    padding:3px;
}

.BlinkMe{
    animation: blinker 1s linear infinite;
}
@keyframes blinker {
  50% {
    color:black;
  }
}



.NewTripToast{
    border: 1px solid silver;
    background: white;
    position: fixed;
    bottom: 1px;
    right: 2px;
    width:250px;
}

#dropArea{
        background:#b5b5b5;
        border:black dashed 1px;
        height:50px;
        text-align:center;
        color:#fff;
        padding-top:12px;
}
    .active-drop{
        background:#77bafa !important;
        border:solid 2px blue !important;
        opacity:.5;
        color:black !important;
    }

.minh150 {
    min-height: 150px;
}

    .minh300{
        min-height:300px;
    }

.minh500 {
    min-height: 500px;
}



.close {
    font-size: 1.5rem;
}

.col-12 img {
    opacity: 0.7;
    cursor: pointer;
    margin: 2rem;
    width: 100%;
}

    .col-12 img:hover {
        opacity: 1;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }