@font-face {
    font-family: 'Vazir'; /* thanks to rastikerdar.github.io/vazir-font*/
    src: url('/skin/uniform/fonts/Vazir/Vazir-Light-FD-WOL.eot'); /* IE9 Compat Modes */
    src: url('/skin/uniform/fonts/Vazir/Vazir-Light-FD-WOL.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('/skin/uniform/fonts/Vazir/Vazir-Light-FD-WOL.woff') format('woff'), /* Modern Browsers */
         url('/skin/uniform/fonts/Vazir/Vazir-Light-FD-WOL.ttf') format('truetype'); /* Safari, Android, iOS */
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

@font-face {
    font-family: 'Vazir'; /* thanks to rastikerdar.github.io/vazir-font*/
    src: url('/skin/uniform/fonts/Vazir/Vazir-Bold-FD-WOL.eot'); /* IE9 Compat Modes */
    src: url('/skin/uniform/fonts/Vazir/Vazir-Bold-FD-WOL.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('/skin/uniform/fonts/Vazir/Vazir-Bold-FD-WOL.woff') format('woff'), /* Modern Browsers */
         url('/skin/uniform/fonts/Vazir/Vazir-Bold-FD-WOL.ttf') format('truetype'); /* Safari, Android, iOS */
    font-style: normal;
    font-weight: bold;
    text-rendering: optimizeLegibility;
}


* 
{
    font-family: 'Vazir',Arial,Helvetica,sans-serif;
    -webkit-appearance: none;
}

img[onclick]
{
    cursor:pointer;
}

input[type="submit"] {
    -webkit-appearance: none;
    border-radius: 0;
}

input[type="url"],
input[type="tel"]
{
    text-align:left;
    direction:ltr;
}


@media screen and (min-width: 1281px) {
    html {
        margin-top: 140px;
    }
}

@media screen and (max-width: 1280px) {
    html {
        margin-top: 90px;        
    }
}

body
{
    background:#D09A3A;
	margin: 0;
    padding: 0;
	text-align: center;
	direction: rtl;
    font-size: 9pt;
    width:100%;
}

.firstColor{
  color: #747474;
}

.secondColor{
  color: #D09A3A;
}

#parent
{
	display:block;
    position:relative;
    /*min-width:1220px;*/
	margin: 0 auto;
    padding-top:0px;    
}


#loginbarBG
{
    display: block;
    position:fixed;
    z-index:100;
    top:0;
    left:0;
    right:0;
    text-align:center;
    padding:0;
    background: #FFFFFF;
}
#loginbarBG[ontop]
{
}

@media screen and (max-width: 1280px) {
    #loginbarBG {
        -webkit-transition: all .1s ease-in-out;
        -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.50);
        -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.50));
        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.50);
    }
}
    

#loginbarContainer
{
    display:block;
	max-width: 1220px;
    margin:0 auto;
    padding:0;
    transition: all .1s ease-in-out;
    -webkit-transition: all .1s ease-in-out;
    background:url(../../content/app/logo.png) no-repeat right 10px center;
    background-size:60px auto;
    overflow: hidden;
    position:relative;
}
#loginbarContainer[ontop]
{
}

#loginbarContainer #logo
{
    display: block;
    width: 80px;
    height: 90px;
    position: absolute;
    z-index: 1;
    right: 0;
    cursor:pointer;
}


#loginbar
{
    display: inline-block;
    float:left;
    margin:0;
	text-align: left;
    color: #c8c8c8;
	font-size: 12px;
    height:30px;
    line-height:30px;
	padding:30px 0 30px 10px;
	line-height:30px;
    letter-spacing:normal;
}
#loginbar[ontop]
{
}


#loginbar[ontop] a.sendPost
{
}
#loginbar[ontop] a.sendPost:hover
{
}


@media screen and (max-width: 1280px) {
    #loginbar span.mobileMenuKey {
        display: inline-block;
        width: 30px;
        color: transparent;
        height: 30px;
        padding: 0;
        margin-right: 10px;
        line-height: 28px;
        text-align: center;
        text-transform: uppercase;
        text-decoration: none;
        background: #FFFFFF url(images/list_dark.png) no-repeat center center;
        font-weight: bold;
        vertical-align: top;
        overflow: hidden;
    }

        #loginbar span.mobileMenuKey:hover {
            background: #FFFFFF url(images/list_darkR.png) no-repeat center center;
        }

    #loginbar a.sendPost {
        display: none;
    }
}


@media screen and (min-width: 1281px) {
    #loginbar span.mobileMenuKey {
        display: none;
    }

    #loginbar a.sendPost {
        display: inline-block;
        min-width: 50px;
        color: #FFFFFF;
        height: 30px;
        padding: 0 10px;
        margin-right: 10px;
        line-height: 30px;
        text-align: center;
        text-transform: uppercase;
        text-decoration: none;
        background: #D09A3A;
        font-weight: bold;
        vertical-align: top;
    }

        #loginbar a.sendPost:hover {
            background: #5f5e5e;
        }
}


@media screen and (min-width: 1281px) {
    #loginbar a.buttonLogin {
        display: inline-block;
        min-width: 50px;
        color: #FFFFFF;
        height: 30px;
        padding: 0 10px;
        margin-right: 10px;
        line-height: 30px;
        text-align: center;
        text-transform: uppercase;
        text-decoration: none;
        background: #D09A3A;
    }

        #loginbar a.buttonLogin:hover {
            color: #FFFFFF;
            background: #000000;
        }
}


@media screen and (max-width: 1280px) {
    #loginbar a.buttonLogin {
        display: inline-block;
        width: 30px;
        color: transparent;
        height: 30px;
        padding: 0;
        /* margin-right: 10px; */
        line-height: 30px;
        text-align: center;
        text-transform: uppercase;
        text-decoration: none;
        background: #0966f8 url(images/icon/png40/lock_open_40.png) no-repeat center center;
        background-size:16px auto;
        border-radius: 50%;
        filter: invert(100%);
    }

        #loginbar a.buttonLogin:hover {
        background-size:20px auto;
        }
}



#loginbar a.buttonAdmin 
{
    display:inline-block;
    min-width:30px;
    height:30px;
    margin-right:10px;
	line-height:30px;
    text-align:center;
    text-transform:uppercase;
	text-decoration: none;
    padding:0 20px;
    background:#D09A3A;
    color:#FFFFFF;
    border-left:0;
    font-weight:bold;
    vertical-align:top;
}
#loginbar a.buttonAdmin:hover
{
	color:#FFFFFF;
    background:#5f5e5e;
}

@media screen and (max-width: 1280px) {
    #loginbar a.buttonAdmin {
        display: none;
    }
}


#loginbar a.buttonDashboard
{
    display:inline-block;
    position:relative;
    min-width:50px;
    color: #FFFFFF;
    height:28px;
    padding:0 10px;
    margin-right:10px;
	line-height:28px;
    text-align:center;
    text-transform:uppercase;
	text-decoration: none;
    border:1px solid #D09A3A;
    background:#D09A3A;
    font-weight:bold;
}
#loginbar a.buttonDashboard:hover
{
    background: #5f5e5e;
}

@media screen and (max-width: 1280px) {
    #loginbar a.buttonDashboard {
        display: none;
    }
}

#loginbar a.buttonDashboard[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    top: -8px;
    left: -8px;
    font-size: .9em;
    background: #e00d0d;
    color: white;
    width: 18px;
    height: 18px;
    text-align: center;
    line-height: 18px;
    border-radius: 50%;
    box-shadow: 0 0 1px #939393;
}

    #loginbar a.buttonDashboard[data-badge="0"]:after {
        display:none;
    }

#loginbar a.buttonLogout
{
    display:inline-block;
    width:20px;
    color: transparent;
    height:20px;
    padding:0;
	line-height:20px;
    text-align:center;
    text-transform:uppercase;
	text-decoration: none;
    vertical-align:top;
    background:url(images/icon/lock-16.png) no-repeat center center;
    background-size:12px auto;
    border:1px solid #C2C2C2;
    margin:4px 0;
}
#loginbar a.buttonLogout:hover
{
    background-color:#D09A3A;
    border:1px solid #D09A3A;
}

@media screen and (min-width: 640px) {
    #loginbar a.buttonUser {
        display: inline-block;
        position: relative;
        font-size: 14px;
        color: #000000;
        height: 30px;
        padding: 0 0 0 40px;
        margin: 0 10px 0 0;
        line-height: 30px;
        text-align: center;
        text-decoration: none;
        vertical-align: top;
    }

        #loginbar a.buttonUser:hover {
            color: #D09A3A;
        }
}

@media screen and (max-width: 640px) {
    #loginbar a.buttonUser {
        display: inline-block;
        position: relative;
        width: 30px;
        font-size: 14px;
        color: transparent;
        height: 30px;
        padding: 0;
        margin: 0 10px 0 0;
        line-height: 30px;
        text-align: center;
        text-decoration: none;
        vertical-align: top;
    }

        #loginbar a.buttonUser:hover {
        }
}



#loginbar a.buttonUser img
{
    display:block;
    position:absolute;
    top:-3px;
    left:0px;
    margin:0;
    border:3px solid rgba(0,0,0,0.05);
    width:30px;
    height:30px;
    border-radius:50%;
}


#loginbar a.buttonUser[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    z-index:10;
    top: -7px;
    left: -12px;
    font-size: 9px;
    background: #f59906;
    color: white;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    border-radius: 50%;
}

#loginbar a.buttonUser[data-badge="0"]:after {
    display: none;
}



#searchbar
{
    display: inline-block;
    float:right;
    background: #FFFFFF;
    border-right: 1px solid #999999;
    margin:0 80px 0 0;
	text-align: right;
    color: #c8c8c8;
	font-size: 12px;
    height:30px;
    line-height:30px;
	padding:30px 10px 30px 10px;
	line-height:30px;
    border-right:1px solid #d29c3f;
    letter-spacing:normal;
    white-space: nowrap;
}
#searchbar[ontop]
{
}

#searchInput 
{
    display:none;
    width:100px;
    border:0;
    color: #27b7d2;
    height:30px;
    margin:0;
    padding:0 5px;
    text-align:right;
	text-decoration: none;
    background:transparent;
    outline: 0;
}
#searchInput:focus
{
    color:#000000;
    display:inline-block;
}

#searchbar:focus > #searchInput,
#searchbar:hover > #searchInput 
{
    display:inline-block;
}


#searchBtn
{
    display:inline-block;
    width:40px;
    border:0;
    color: transparent;
    background: url(images/gsearch.png) no-repeat center center;
    background-size:21px auto;
    font-weight:bold;
    height:30px;
    padding:0;
    margin:0;
	line-height:30px;
    text-align:center;
    text-transform:uppercase;
	text-decoration: none;
    cursor:pointer;
}
#searchBtn:hover
{
}

@media screen and (max-width: 350px) {
    #searchbar {
        display: none;
    }
}


#headerBG
{
	display: block;    
	padding:0;
    text-align:center;
    background:#D09A3A;
}


@media screen and (min-width: 1281px) {
    #header {
        display: block;
        height: calc(100vh - 140px);
        margin: 0 auto;
        text-align: center;
        padding: 0;
    }
}

@media screen and (max-width: 1280px) {
    #header {
        display: block;
        height: calc(100vh - 90px);
        margin: 0 auto;
        text-align: center;
        padding: 0;
    }
}


@media screen and (max-width: 1280px) {
    #navbarBG {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 100;
        padding: 90px 0 0 0;
        width: 30%;
        min-width: 300px;
        background: #ffffff;
        overflow: auto;
        -webkit-transition: all .1s ease-in-out;
        -webkit-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.75);
        box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.75);
    }

    #navbar {
        display: block;
        position: relative;
        max-width: 1220px;
        margin: 0 auto;
        padding: 0;
        white-space: nowrap;
        text-align: right;
        border: 0 10px solid transparent;
    }

        #navbar a {
            display: block;
            position:relative;
            height: 40px;
            line-height: 40px;
            margin: 0;
            text-align: right;
            padding: 0 50px 0 10px;
            margin: 0;
            font-size: 17px;
            text-decoration: none;
            color: #000000;
            vertical-align: top;
            border-bottom: 1px solid #e7e7e7;
        }

            #navbar a:hover {
                background-color: #eeeeee;
            }

            #navbar a[selected] {
                display: block;
                height: 40px;
                line-height: 40px;
                margin: 0;
                text-align: right;
                padding: 0 50px 0 10px;
                margin: 0;
                font-size: 17px;
                text-decoration: none;
                color: #FFFFFF;
                background: #D09A3A;
            }

                #navbar a[selected]:hover {
                    text-decoration: underline;
                }

        #navbar a[home] {
            display: block;
            height: 40px;
            padding: 0 50px 0 10px;
            margin: 0;
            background: url(../../content/app/favicon.png) no-repeat right 10px center;
            background-size: auto 28px;
            border-top: 1px dotted #e7e7e7;
        }

            #navbar a[home][selected] {
                display: block;
                height: 40px;
                padding: 0 50px 0 10px;
                margin: 0;
                background: #D09A3A url(../../content/app/minilogow.png) no-repeat right 10px center;
                background-size: auto 28px;
            }

        #navbar div[hide] {
            display:block;
        }


        #navbar span[close] {
            position: fixed;
            z-index: 250;
            display: block;
            width: 30px;
            height: 30px;
            top: 30px;
            left: 20px;
            background: #FFFFFF url( 'images/list_darkR.png' ) no-repeat center center;
            cursor: pointer;
        }

            #navbar span[close]:hover {
                background: #FFFFFF url( 'images/list_dark.png' ) no-repeat center center;
            }



        #navbar a[sendpost] {
            background-image: url(images/icon/png40/add_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }


        #navbar a[dashboardMenu] {
        }


        #navbar a[dashboardMenu="mypost"] {
            border-top:10px solid #e7e7e7;
            background-image: url(images/icon/png40/folder2_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }
        #navbar a[dashboardMenu="myfriend"] {
            background-image: url(images/icon/png40/messenger_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }
        #navbar a[dashboardMenu="myinbox"] {
            background-image: url(images/icon/png40/envelope_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }
        #navbar a[dashboardMenu="activity"] {            
            background-image: url(images/icon/png40/binoculars2_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }


        #navbar a[dashboardMenu="myprofile"] {            
            border-top:10px solid #e7e7e7;
            /*background-image: url(images/icon/png40/man_slim_40.png);*/
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }
            #navbar a[dashboardMenu="myprofile"] img {
                display: block;
                position: absolute;
                width: 28px;
                right: 6px;
                top: 4px;
                border: 2px solid #d09a3a;
                border-radius: 50%;
            }
        #navbar a[dashboardMenu="myusername"] {            
            background-image: url(images/icon/png40/cloud_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }
        #navbar a[dashboardMenu="myemail"] {            
            background-image: url(images/icon/png40/envelope_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }
        #navbar a[dashboardMenu="mypassword"] {            
            background-image: url(images/icon/png40/key_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }
        #navbar a[dashboardMenu="logout"] {            
            background-image: url(images/icon/png40/lock_closed_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }
        #navbar a[dashboardMenu="myphoto"] {
            display: block;
            position: absolute;
            top: -70px;
            right: 10px;
            padding: 0 75px 0 0;
            height: 54px;
            line-height: 54px;
            font-size: 14px;
            color: #d09a3a;
            margin: 0;
            border: 0;
            overflow: visible;
        }
            #navbar a[dashboardMenu="myphoto"] img {
                display: block;
                position: absolute;
                width: 48px;
                right: 10px;
                top: -3px;
                border-radius: 50%;
                border: 5px solid rgba(0,0,0,0.05);
            }

            #navbar a[dashboardMenu][data-badge]:after {
                content: attr(data-badge);
                position: absolute;
                top: 9px;
                left: 15px;
                font-size: 11px;
                background: #f59906;
                color: white;
                width: 25px;
                height: 24px;
                text-align: center;
                line-height: 24px;
                border-radius: 50%;
                box-shadow: 0 0 1px #939393;
            }

        #navbar a[dashboardMenu][data-badge="0"]:after {
            display: none;
        }


        #navbar a[admin] {
            background-image: url(images/icon/png40/administrator_40.png);
            background-repeat:no-repeat;
            background-position: right 11px center;
            background-size: 22px 22px;
        }


        #navbar a[map] {
            background: url(images/map.png) no-repeat right 12px center;
            background-size: auto 22px;
        }

            #navbar a[map][selected] {
                background: #D09A3A url(images/map_light.png) no-repeat right 12px center;
                background-size: auto 22px;
            }


        #navbar a[contact] {
            background: url(images/contact.png) no-repeat right 12px center;
            background-size: auto 20px;
        }

            #navbar a[contact][selected] {
                background: #D09A3A url(images/contact_light.png) no-repeat right 12px center;
                background-size: auto 20px;
            }

        #navbar a:last-child {
            border-bottom: 0;
        }
}


@media screen and (min-width: 1281px) {
    #navbarBG {
        display: block;
        position: fixed;
        z-index: 95;
        top: 90px;
        left: 0;
        right: 0;
        padding: 0;
        text-align: center;
        background: #FFFFFF;        
        -webkit-transition: all .1s ease-in-out;
    }

        #navbarBG span[close] {
            display: none;
        }

        #navbar div[hide] {
            display:none;
        }

    #navbarBG[noheader] {
    }

    #navbarBG[ontop] {
        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.50);
    }

    #navbar {
        display: block;
        position: relative;
        max-width: 1220px;
        height: 50px;
        line-height: 50px;
        margin: 0 auto;
        padding: 0;
        white-space: nowrap;
        text-align: right;
        font-weight:bold;
        border: 0 10px solid transparent;
    }

        #navbar a[home] {
            display: inline-block;
            width: 55px;
            height: 50px;
            padding: 0;
            margin: 0;
            color: transparent;
            background: url(images/g-dot.png) no-repeat center center;
            background-size: 16px 16px;            
        }

        #navbar a[home]:hover {
            display: inline-block;
            width: 55px;
            height: 50px;
            padding: 0;
            margin: 0;
            color: transparent;
            background: url(images/c-dot.png) no-repeat center center;
            background-size: 16px 16px;            
        }

            #navbar a[home][selected] {
                display: inline-block;
                width: 55px;
                height: 50px;
                padding: 0;
                margin: 0;
                color: transparent;
                background: url(images/c-dot.png) no-repeat center center;
                background-size: 16px 16px;
            }

        #navbar a {
            display: inline-block;
            min-width: 55px;
            height: 50px;
            line-height: 50px;
            margin: 0;
            text-align: center;
            padding: 0 15px;
            margin: 0;
            font-size: 18px;
            text-decoration: none;
            color: #000000;
            vertical-align: top;
        }

            #navbar a:hover {
                color: #13a89e;
            }

            #navbar a[selected] {
                display: inline-block;
                min-width: 55px;
                height: 50px;
                line-height: 50px;
                margin: 0;
                text-align: center;
                padding: 0 15px;
                margin: 0;
                font-size: 17px;
                text-decoration: none;
                color: #13a89e;
            }

                #navbar a[selected]:hover {
                    text-decoration: underline;
                }


            #navbar a[sendpost] {
                display: none;
            }

            #navbar a[dashboardMenu] {
                display: none;
            }

            #navbar a[admin] {
                display: none;
            }

}


#submenubarBG
{
	display: block;
	padding:0;
    text-align:center;
    background: #13a89e; 
    clear:both;
}
#submenubar
{
	display: block;
	max-width: 1220px;
	padding:0 10px 10px 10px;
    margin:0 auto;
    white-space:normal;
    text-align:right;
}

#submenubar a
{
	display: inline-block;
    background:#FFFFFF;
	height: 40px;
	line-height:40px;
	margin: 0;
	text-align: center;	
	padding:0 15px;
	margin:10px 0 0 10px;
	font-size:16px;
	text-decoration:none;
	color:#13a89e;
    border-radius:18px;
}
#submenubar a:hover
{
    color:#d29c3f;
}

#submenubar a[selected]
{
    background:#13A89E;
	color:#FFFFFF;
}
#submenubar a[selected]:hover
{
    text-decoration:underline;
}


#fullWidthView
{
	display: block;
    text-align:center;
    background: #D09A3A;
    clear:both;
}

#fullCategoryView
{
    display: block;
    width:1220px;
    padding:10px 0 0 0;
    margin:0 auto;
    overflow:hidden;
} 

#fullCategoryView div.categoryBox
{
    display:block;
    width:230px;
    height:200px;
    overflow:hidden;
    float:right;
    background:#FFFFFF;
    text-align:right;
    margin: 0 0 8px 8px;
    border: 1px solid #EEEEEE;
}

#fullCategoryView div:last-child
{
    display:none;
}

#fullCategoryView a[title]
{
	display: inline-block;
    background:#D09A3A;
	min-width: 55px;
	height: 40px;
	line-height:40px;
	margin: 0;
	text-align: center;	
	padding:0 20px;
	margin:15px 0 0 0;
	font-size:16px;
	text-decoration:none;
	color:#FFFFFF;
}
#fullCategoryView a[title]:hover
{
    background:#D09A3A;
}

#fullCategoryView ul
{
    padding:0 20px;
    overflow-y:auto;
    height:120px;
    margin:10px 5px;
}

#fullCategoryView ul li a
{
	padding:5px;
	font-size:14px;
    line-height:22px;
	text-decoration:none;
	color:#5E5E5E;
}

#fullCategoryView a img
{
    height: 22px;
    vertical-align: middle;
    padding-left: 5px;
}

    #fullCategoryView ul li a:hover {
        color: #000000;
        text-decoration: underline;
        text-decoration-color: #999999;
    }


#pageBodyBG {
    display: block;
    padding: 0;
    text-align: center;
    background: #FFFFFF url(images/bg/catBG.jpg) no-repeat top center;
    overflow: hidden;
    clear: both;
}

@media screen and (min-width: 1281px) {
    #pageBody {
        display: table;
        width: 1220px;
        margin: 0 auto;
        padding: 0 10px;
        text-align: right;
        vertical-align: top;
        overflow: hidden;
        min-height: 100%;
        white-space: nowrap;
        /* backdrop-filter: blur(2px); */
    }

    #BodyContain {
        display: table-cell;
        width: calc(100% - 320px);
        white-space: normal;
        vertical-align: top;
        min-height: 100%;
    }

    #BodySide {
        display: table-cell;
        width: 300px;
        padding: 10px 10px 0 10px;
        margin: 0;
        text-align: center;
        white-space: normal;
        /*background: rgba(0,0,0,.25);*/
        vertical-align: top;
        min-height: calc(100% + 10px);
    }
}


@media screen and (max-width: 1280px) {
    #pageBody {
        display: block;
        margin: 0 auto;
        padding: 0 10px;
        text-align: right;
        vertical-align: top;
        overflow: hidden;
        white-space: nowrap;
        /* backdrop-filter: blur(2px); */
    }

    #BodyContain {
        display: block;
        white-space: normal;
        padding: 0;
        vertical-align: top;
        min-height: 100%;
    }

    #BodySide {
        display: block;
        padding: 10px 0;
        margin: 0 auto;
        text-align: center;
        white-space: normal;
        vertical-align: top;
    }
}

#BodySide:empty
{
    display:none;
}


@media screen and (max-width: 480px) {
    #BodyContain {
        /*zoom: 75%;*/
    }
}

@media screen and (max-width: 320px) {
    #BodyContain {
        /*zoom: 50%;*/
    }
}


#adsBlock
{
    display:none;
}

#BodySide img.bannerImg {
    display:block;
    border:0;
    cursor:pointer;
    margin-bottom: 10px;
}

#BodySide img.postImg {
    display:block;
    width:290px;
    border:0;
    cursor:pointer;
    border:5px solid #DDDDDD;
    margin-bottom:5px;
}




#quickSitemapBG 
{
	display: block;
	padding:0;
    text-align:center;
    background: #13a89e;
    border-bottom: 1px dotted #de3949;
}
#quickSitemap
{
	display: block;
    position:relative;
	max-width: 1220px;
	margin:0 auto;
    text-align: right;
    clear: left;
    padding: 20px 0;
    font-size: 11pt;
    line-height:30px;
}


@media screen and (min-width: 1281px) {

    #quickSitemap div {
        display: block;
        max-width: 1210px;
        margin: 0px auto;
        padding: 10px 5px;
        vertical-align: top;
        overflow:hidden;
    }

        #quickSitemap div ul {
            list-style-type: none;
            vertical-align: top;
            padding: 0px;
            margin: 0px;
        }

            #quickSitemap div ul li {
                display: inline-block;
                list-style-type: none;
                margin: 0;
                vertical-align: top;
                white-space: nowrap;
                border-right: 1px dotted #de3949;
                float:right;
            }

                #quickSitemap div ul li:first-child {
                    min-width: 250px;
                    border-right: 0;
                }

                #quickSitemap div ul li:last-child {
                    border-right: 0;
                    float:left;
                }

                #quickSitemap div ul li:first-child a {
                    font-weight:bold;
                }

                #quickSitemap div ul li:last-child a {
                    background:#FFFFFF;
                    color:#13a89e;
                    border-radius: 10px;
                }

}

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

    #quickSitemap div {
        display: block;
        max-width: 1210px;
        margin: 0px auto;
        padding: 10px;
        vertical-align: top;
    }

        #quickSitemap div ul {
            list-style-type: none;
            vertical-align: top;
            padding: 0px;
            margin: 0px;
        }

            #quickSitemap div ul li {
                display: inline-block;
                list-style-type: none;
                padding: 0px 10px 5px 5px;
                margin: 0 0 5px 5px;
                vertical-align: top;
                white-space: nowrap;
            }

                #quickSitemap div ul li:first-child {
                    display: block;
                }

                #quickSitemap div ul li:first-child a {
                    font-weight:bold;
                }

                #quickSitemap div ul li:last-child a {
                    background:none;
                    color:#bbb;
                    border-radius: 10px;
                }
}

    

#quickSitemap div ul a
{
    display:inline-block;
    color: #FFFFFF;
    padding:5px 10px;
    text-decoration: none;
}

#quickSitemap div ul a:hover
{
    text-decoration: underline;
}

#quickSitemap div ul li ul
{
    clear:both;
    display:block;
    list-style-type: none;
    font-weight:normal;
    padding:0px;
    margin:0px;
    padding-left:1px;
    font-size: 8pt;
    line-height:15px;
    color: #cbf7ff;
    vertical-align:top;
}

#quickSitemap div ul li ul li
{
    clear:both;
    display:block;
    list-style-type: none;
    font-weight:normal;
}

#footerBG 
{
	display: block;
	padding:0;
    margin-bottom:50px;
    text-align:center;
}

@media screen and (min-width: 1281px) {

    #footer {
        display: block;
        position: relative;
        max-width: 1220px;
        margin: 0 auto;
        padding: 20px;
        min-height: 50px;
        font-size: 15px;
        line-height: 25px;
        color: #fff;
        text-align: right;
    }

        #footer a {
            text-decoration: none;
            color: #fff;
        }

            #footer a:hover {
                text-decoration: underline;
            }


        #footer col1 {
            display: inline-block;
            min-height: 80px;
            float: right;
            white-space: nowrap;
        }

        #footer span.logo {
            display: inline-block;
            width: 64px;
            height: 64px;
            background: url(../../content/app/minilogow.png) no-repeat center center;
            background-size: 48px auto;
            float: right;
        }

        #footer col2 {
            display: inline-block;
            text-align: left;
            min-height: 80px;
            float: left;
        }


            #footer col2 .social {
                display: inline-block;
                width: 32px;
                height: 32px;
                border-radius: 50%;
                margin: 0 5px 0 0;
                border: 0;
            }
                #footer col2 .social:hover {
                    filter: brightness(120%);
                }

            #footer col2 .appstore {
                display: inline-block;
                width: 92px;
                height: 32px;
                background-size: 92px 32px;
                margin: 0 5px 0 0;
                float: left;
            }
}


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

    #footer {
        display: block;
        position: relative;
        margin: 0 auto;
        padding: 20px;
        min-height: 50px;
        font-size: 13px;
        line-height: 20px;
        color: #fff;
        text-align: right;
    }

        #footer a {
            text-decoration: none;
            color: #fff;
        }

            #footer a:hover {
                text-decoration: underline;
            }


        #footer col1 {
            display: block;
            font-size: 15px;
            line-height: 25px;
            white-space: normal;
        }

        #footer span.logo {
            display: inline-block;
            width: 64px;
            height: 64px;
            margin-bottom: 50px;
            background: url(../../content/app/minilogow.png) no-repeat top 5px center;
            background-size: 48px auto;
            float: right;
        }

        #footer col2 {
            display: block;
            text-align: center;
            padding: 5px 0 0 0;
            clear: both;
        }

            #footer col2 .social {
                display: inline-block;
                width: 32px;
                height: 32px;
                border-radius:50px;
                margin: 0 5px 0 0;
            }
                #footer col2 .social:hover {
                    filter: brightness(120%);
                }

            #footer col2 .appstore {
                display: inline-block;
                width: 92px;
                height: 32px;
                background-size: 92px 32px;
                margin: 0 5px 0 0;
            }
}

a.linkedin {
    background: url(images/social/linkedin.png) no-repeat center center;
    background-size: 32px 32px;
}

a.youtube {
    background: url(images/social/youtube.png) no-repeat center center;
    background-size: 32px 32px;
}

a.facebook {
    background: url(images/social/facebook.png) no-repeat center center;
    background-size: 32px 32px;
}

a.instagram {
    background: url(images/social/instagram.png) no-repeat center center;
    background-size: 32px 32px;
}

a.twitter {
    background: url(images/social/twitter.png) no-repeat center center;
    background-size: 32px 32px;
}

a.google {
    background: url(images/social/googleplus.png) no-repeat center center;
    background-size: 32px 32px;
}

a.rssfeed {
    background: url(images/social/rssfeed.png) no-repeat center center;
    background-size: 32px 32px;
}

a.telegram {
    background: url(images/social/telegram.png) no-repeat center center;
    background-size: 32px 32px;
}

a.googleStore {
    background: url(images/icon/en_generic_rgb_wo_45.png) no-repeat center center;
}

a.appleStore {
    background: url(images/icon/en_appstore_45.png) no-repeat center center;
}

/*////////////////////////////////////////////////////////////////*/

@import url(https://fonts.googleapis.com/css?family=Varela+Round);

.vslides {
    padding: 0;
    width: 100%;
    height: 420px;
    display: block;
    margin: 0 auto;
    position: relative;
    direction:ltr;
    text-align:center;
}

.vslides * {
    user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.vslides input { display: none; }

.vslide-container { display: block; }

.vslide {
    top: 0;
    opacity: 0;
    width: 100%;
    height: 420px;
    display: block;
    position: absolute;

    transform: scale(0);

    transition: all .7s ease-in-out;
}

    .vslide img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        overflow: hidden;
    }

.nav label {
    width: 200px;
    height: 100%;
    display: none;
    position: absolute;

	opacity: 0;
    z-index: 9;
    cursor: pointer;

    transition: opacity .2s;

    color: #FFF;
    font-size: 156pt;
    text-align: center;
    line-height: 380px;
    font-family: "Varela Round", sans-serif;
    background-color: rgba(255, 255, 255, .3);
    text-shadow: 0px 0px 15px rgb(119, 119, 119);
}

.vslide:hover + .nav label { opacity: 0.5; }

.nav label:hover { opacity: 1; }

.nav .next { right: 0; }

input:checked + .vslide-container  .vslide {
    opacity: 1;

    transform: scale(1);

    transition: opacity 1s ease-in-out;
}

input:checked + .vslide-container .nav label { display: block; }

.nav-dots {
	width: 100%;
	bottom: 9px;
	height: 11px;
	display: block;
	position: absolute;
	text-align: center;
}

.nav-dots .nav-dot {
	top: -5px;
	width: 11px;
	height: 11px;
	margin: 0 4px;
	position: relative;
	border-radius: 100%;
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.6);
}

.nav-dots .nav-dot:hover {
	cursor: pointer;
	background-color: rgba(0, 0, 0, 0.8);
}

input#vs-img-1:checked ~ .nav-dots label#img-dot-1,
input#vs-img-2:checked ~ .nav-dots label#img-dot-2,
input#vs-img-3:checked ~ .nav-dots label#img-dot-3,
input#vs-img-4:checked ~ .nav-dots label#img-dot-4,
input#vs-img-5:checked ~ .nav-dots label#img-dot-5,
input#vs-img-6:checked ~ .nav-dots label#img-dot-6 {
	background: rgba(0, 0, 0, 0.8);
}







/*////////////////////////////////////////////////////////////////*/






iframe.miniMapFrame {
    display: block;
    width: 100%;
    height: 296px;
    /* border: 1px solid #13a89e; */
    margin: 0 0 10px 0;
    padding: 0;
}

#full-map-canvas {
    display:block;
    z-index:0;
    width:100%;
    height: calc(100vh - 140px);
    border:0;
    margin:0;
    padding:0;
}
#mini-map-canvas {
    display: block;
    position: relative;
    z-index:0;
    width: 100%;
    overflow: hidden;
    display: block;
    height: 250px;
    margin: 0 0 10px 0;
}

#latestLocation
{
    display:block;
    white-space: normal;
    vertical-align:top;
    padding: 20px 0;
    text-align:center;
}

    #latestLocation a {
        display: inline-block;
        width: 128px;
        border: 5px solid transparent;
        margin: 0 0 5px 5px;
        color:#000000;
        text-align:center;
        vertical-align:top;
        font-size:14px;
        background: rgba(235,235,235,0.5);
        backdrop-filter: blur(2px);
        text-decoration:none;
    }

    #latestLocation a:hover {
        color:#000000;
    }

    #latestLocation a img {
        display: block;
        margin: 0;
        border: 0;
        width: 100%;
        object-fit: cover;
    }

/*////////////////////////////////////////////////////////////////*/

div.Captcha
{
    display: block;
    width: 250px;
    height: 50px;
    white-space: nowrap;
    margin: 4px 0;
}

div.Captcha img
{
    display: block;
    width: 200px;
    height: 50px;
    border: 0;
    float: left;
}


#CaptchaRefresh
{
    display: block;
    width: 25px;
    height: 25px;
    margin: 12px 2px;
    background: url(  'images/refresh.png' ) no-repeat center center;
    cursor: pointer;
    float: left;
}
#CaptchaRefresh:hover
{
    background: url(  'images/refresh_over.png' ) no-repeat center center;
}



/*////////////////////////////////////////////////////////////////*/

#PopupWindowBG
{
	position: fixed;
	display: block;
	z-index: 1000;
	background: #000000;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: .5;
	filter: alpha(opacity=50);
}

#vBoxMessage
{
	display: block;
	position: fixed;
	z-index: 2000;
	background: #FFFFFF;
	background: linear-gradient(top, #dbdada 10%, #FFFFFF 90%);
	background: -webkit-linear-gradient(top, #dbdada 10%, #FFFFFF 90%);
	background: -moz-linear-gradient(top, #dbdada 10%, #FFFFFF 90%);
	background: -ms-linear-gradient(top, #dbdada 10%, #FFFFFF 90%);
	background: -o-linear-gradient(top, #dbdada 10%, #FFFFFF 90%);	
	top: 25%;
	right: 10px;
	left: 10px;
	margin: auto;
	padding: 30px 30px 80px 30px;
	text-align: right;
	border: 1px solid #d7d7d7;
	font-size: 10pt;
	font-weight: bold;
    min-width:200px;
    width:30%;
	color: #112406;
	-moz-box-shadow: 0 0 15px #888;
    -webkit-box-shadow: 0 0 15px #888;
    box-shadow: 0 0 15px #888;
    overflow:hidden;
}

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    #vBoxMessage
    {
        display: table;
	    top: 0;
	    bottom: 0;
    }
}

#vBoxMessage span[close]
{
	position: absolute;
    z-index: 2010;
	display: block;
	width: 12px;
	height: 12px;
	top: 10px;
	left: 10px;
	background: url(  'images/closeKey.png' ) no-repeat center center;
	cursor: pointer;
}
#vBoxMessage span[close]:hover
{
	background: url(  'images/closeKey_over.png' ) no-repeat center center;
}

#vBoxMessage div[container] {
	display: block;
    overflow:hidden;
}

#vBoxMessage div[action] {
    position: absolute;
    z-index: 2010;
	display: block;
	bottom: 0;
	left: 0;
    right:0;
	text-align: center;
	height: 40px;
    padding:5px 10px 15px 10px;
	font-weight: normal;
}

.okKey
{
  display:inline-block;
  height:30px;
  min-width:50px;
  text-align:center;
  padding:0 20px;
  margin:0 5px;
  font-size: 14px;
  line-height:32px;
  cursor:pointer;
  color: #ffffff;
  border:1px solid #2ecc71;
  background: #2ecc71;
}
.okKey:hover
{
  border:1px solid #188f4a;
  background: #188f4a;
}

.cancelKey
{
  display:inline-block;
  height:30px;
  min-width:50px;
  text-align:center;
  padding:0 20px;
  margin:0 5px;
  font-size: 14px;
  line-height:32px;
  cursor:pointer;
  color: #ffffff;
  border:1px solid #605f5f;
  background: #605f5f;
}
.cancelKey:hover
{
  border:1px solid #333232;
  background: #333232;
}



/*////////////////////////////////////////////////////////////////*/



#vw_NotificationPopup {
    display:block;
    width:250px;
    position:fixed;
    bottom:10px;
    right:10px;
    padding:20px 55px 20px 20px;
    background:#D3D3D3;
    color:#FFFFFF;
    font-size:15px;
    line-height:25px;
    text-align:right;
    color:#000000;
    border:1px solid #696969;
    border-right:5px solid #696969;
    z-index:1000;
}

    #vw_NotificationPopup img[icon] {
        display:block;
        position:absolute;
        width:32px;
        height:32px;
        top:20px;
        right:10px;
        border:2px solid #696969;
        border-radius:50%;
    }

    #vw_NotificationPopup a {
        color:#13a89e;
        text-decoration:none;
    }
    #vw_NotificationPopup a:hover {
        color:#000000;
        text-decoration:underline;
    }

#vw_NotificationPopup_close {
    display:block;
    position:absolute;
    width:20px;
    height:20px;
    top:5px;
    left:5px;
    cursor:pointer;
    background:url(images/closeKey.png) no-repeat center center;
}
#vw_NotificationPopup_close:hover {
    background:url(images/closeKey_over.png) no-repeat center center;
}



/*////////////////////////////////////////////////////////////////*/



#vw_ChatPopup {
    display:block;
    width:250px;
    position:fixed;
    bottom:10px;
    right:10px;
    padding:20px 55px 20px 20px;
    background:#D3D3D3;
    color:#FFFFFF;
    font-size:15px;
    line-height:25px;
    text-align:right;
    color:#13a89e;
    border:1px solid #000000;
    border-top:5px solid #000000;
    z-index:1000;
}

    #vw_ChatPopup_container
    {
    }

    #vw_ChatPopup_content
    {
        display:block;
        max-height:200px;
        overflow-y:auto;
        margin:10px 0;
        font-size:12px;
        line-height:20px;
    }

    #vw_ChatPopup_content span[Me]
    {
        display:block;
        padding:5px;
        margin:0 30px 5px 0;
        color:#FFFFFF;
        border:1px solid #949494;
        background:#949494;
        border-radius:3px;
    }
    #vw_ChatPopup_content span[Friend]
    {
        display:block;
        padding:5px;
        margin:0 0 5px 30px;
        color:#000000;
        font-size:13px;
        border:1px solid #e7e7e7;
        background:#e7e7e7;
        border-radius:3px;
    }

    #vw_ChatPopup img[icon] {
        display:block;
        position:absolute;
        width:32px;
        height:32px;
        top:20px;
        right:10px;
        border:2px solid #696969;
        border-radius:50%;
    }

    #vw_ChatPopup input {
        display:block;
        width:100%;
    }


    #vw_ChatPopup_Send
    {
        display:inline-block;
        min-width:30px;
        height:30px;
        padding:0 10px;
        margin-top:10px;
	    line-height:30px;
        text-align:center;
        text-transform:uppercase;
	    text-decoration: none;
        background:#396E9E;
        color:#DADADA;
        font-size:13px;
        cursor:pointer;
    }

    vw_ChatPopup_Send:hover
    {
	    color:#FFFFFF;
        background:#13a89e;
    }

    #vw_ChatPopup a {
        color:#13a89e;
        text-decoration:none;
    }
    #vw_ChatPopup a:hover {
        color:#000000;
        text-decoration:underline;
    }

#vw_ChatPopup_close {
    display:block;
    position:absolute;
    width:20px;
    height:20px;
    top:5px;
    left:5px;
    cursor:pointer;
    background:url(images/closeKey.png) no-repeat center center;
}
#vw_ChatPopup_close:hover {
    background:url(images/closeKey_over.png) no-repeat center center;
}



/*////////////////////////////////////////////////////////////////*/


@media screen and (min-width: 1281px) {
    div.formPanel {
        display: block;
        padding: 0;
        text-align: right;
        margin: 0 0 0 10px;
        background: #FFFFFF;
        -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    }
}

@media screen and (max-width: 1280px) {
    div.formPanel {
        display: block;
        padding: 0;
        text-align: right;
        margin: 0;
        background: #FFFFFF;
        -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    }
}


div.formPanel h1
{
    display:block;    
    font-weight:normal;
    font-size: 18px;
    line-height:40px;
    color:#13a89e;
    background: #f0f0f0;
    padding:10px 20px 10px 20px;
    margin:10px -10px 10px -10px;
    border-right:5px solid #13a89e;
}

    div.formPanel h1 img {
        height: 40px;
        vertical-align: bottom;
        margin: 0px 10px;
        border-radius: 50%;
    }

div.formPanel h2
{
    display:block;    
    font-weight:normal;
    font-size: 16px;
    line-height:30px;
    color:#13a89e;
    padding:10px 15px;
}

div.formPanel div[box]
{
	display:block;
	padding:10px 10px 0px 10px;
    margin-bottom:-10px;
    font-size: 12px;
    line-height:25px;
}

div.formPanel div div
{
	display:block;
	position:relative;
	padding:4px 10px;    
}

div.formPanel div.highlight
{
    background:#EEEEEE;
    padding:7px 10px;
    margin:5px 0;
    font-weight:bold;
}

div.formPanel div[actionbar]
{
	display:block;
	padding:15px 20px 25px 20px;
    margin:10px -10px;
    border-top:3px dotted #DDDDDD;
    color:#13a89e;
}

div.formPanel div[actionbar] input[type="submit"]
{
    margin-left:10px;
}


div.formPanel div span
{
	display:inline-block;
    width:19%;
    margin-left:1%;
	color:#13a89e;
	text-align:left;
}


.formcontrols {
    display:inline-block;
    width:80%;
    min-height:30px;
    vertical-align:middle;
    white-space:nowrap;
}


.cssControl {
    display:inline-block;
    border:1px solid;
    border-color:#a8abba #b5b7c5 #c5c7d2;
    border-radius:3px;
    background:#FFFFFF;
    height:30px;
    line-height:30px;
    padding:0 5px;
    vertical-align:middle;
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2) inset;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2) inset;

    -webkit-box-sizing : border-box;
    -moz-box-sizing : border-box;
    box-sizing : border-box;
}

.cssControl:focus {
    outline:0;
    border:1px solid #1295e1;
    background:#f5f6f9;
    -moz-box-shadow: 0 0 3px #605f5f;
    -webkit-box-shadow: 0 0 3px #605f5f;
    box-shadow: 0 0 5px #1295e1;
}

.cssControl[disabled] {
    outline:0;
    background:#cdcccc;
    color:#6f6c6c;
}


.w50 
{
    width:calc(10% - 12px);
}

.w100 
{
    width:calc(15% - 12px);
}

.w150 
{
    width:calc(20% - 12px);
}

.w200 
{
    width:calc(25% - 12px);
}

.w300 
{
    width:calc(30% - 12px);
}

.w500 
{
    width:calc(60% - 12px);
}

.w600 
{
    width:calc(80% - 12px);
}


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

    div.formPanel div span
{
	display:block;
    width:100%;
	color:#13a89e;
	text-align:right;
}


.formcontrols {
    display:block;
    width:100%;
    min-height:30px;
    vertical-align:middle;
    white-space:nowrap;
}
.w200, .w300, .w500, .w600 {
        width: 90%;
    }
}


.textboxviewMini {
    width:calc(80% - 12px);
    height:100px;
}

.textboxview {
    width:calc(80% - 12px);
    height:250px;
}

controlHint {
  display:inline-block;
  vertical-align:middle;
  border:1px solid;
  border-color:rgba(0, 0, 0, 0.30) rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.20);
  margin-left:-2px;
  height:22px;
  color:#1295e1;
  min-width:40px;
  line-height:22px;
  padding:3px 20px;
  font-size: 12px;
  -webkit-border-radius: 0 3px 3px 0;
  -moz-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0;  
  cursor:pointer;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#d5d4d4));
  background-image: -webkit-linear-gradient(top, #ffffff, #d5d4d4);
  background-image: -o-linear-gradient(top, #ffffff, #d5d4d4);
  background-image: linear-gradient(to bottom, #ffffff, #d5d4d4);
  background-image: -moz-linear-gradient(top, #ffffff, #d5d4d4);
}


controlHint:hover {
  color: #ffffff;
  background: #006bb7;
}



/*////////////////////////////////////////////////////////////////*/


.defaultButton
{
  display:inline-block;
  height:35px;
  min-width:40px;
  text-align:center;
  padding:0 25px;
  margin:0;
  font-size: 12px;
  line-height:35px;
  letter-spacing:normal;
  cursor:pointer;
  color: #ffffff;
  border:1px solid #767676;
  background: #767676;
  -webkit-transition: all .1s ease-in-out;
  -moz-transition: all .1s ease-in-out;
  -o-transition: all .1s ease-in-out;
  transition: all .1s ease-in-out;
}
.defaultButton:hover
{
  border:1px solid #13a89e;
  background: #13a89e;
}


/*////////////////////////////////////////////////////////////////*/


@media screen and (min-width: 1281px) {
    div.tabBarPanel {
        display: block;
        vertical-align: top;
        white-space: normal;
        color: #666666;
        padding: 20px 30px 0 30px;
        margin: 0 0 0 10px;
    }
}

@media screen and (max-width: 1280px) {
    div.tabBarPanel {
        display: block;
        vertical-align: top;
        white-space: normal;
        color: #666666;
        padding: 20px 30px 0 30px;
        margin: 0;
    }
}


div.tabBarPanel a {
    display: inline-block;
    height: 35px;
    line-height: 35px;
    text-decoration: none;
    font-size: 14px;
    padding: 0px 20px;
    color: #666666;
    background: #FFFFFF;
    margin-right: 2px;
}

    div.tabBarPanel a[selected] {
        background:#cccaca;
        color:#FFFFFF;
    }

    div.tabBarPanel a:hover {
        text-decoration:underline;
    }



/*////////////////////////////////////////////////////////////////*/


@media screen and (min-width: 1281px) {
    div.messagePanel {
        display: block;
        padding: 0;
        text-align: right;
        margin: 0 0 0 10px;
        background: #FFFFFF;
        border-left: 1px solid #e7e7e7;
        border-right: 1px solid #e7e7e7;
        border-bottom: 1px solid #dcdcdc;
    }
}

@media screen and (max-width: 1280px) {
    div.messagePanel {
        display: block;
        padding: 0;
        text-align: right;
        margin: 0;
        background: #FFFFFF;
        border-left: 1px solid #e7e7e7;
        border-right: 1px solid #e7e7e7;
        border-bottom: 1px solid #dcdcdc;
    }
}


div.messagePanel h1
{
    display:block;
    position:relative;
    font-weight:normal;
    font-size: 18px;
    line-height:40px;
    color:#13a89e;
    background: #f0f0f0;

    padding:10px 20px 10px 20px;
    margin:10px -10px 10px -10px;
    border-right:5px solid #13a89e;
}

    div.messagePanel h1 img {
        height: 40px;
        vertical-align: bottom;
        margin: 0px 10px;
        border-radius: 50%;
    }

    div.messagePanel h1 span.messageAction {
        display:inline-block;
        position:absolute;
        height: 40px;
        left:20px;
        top:10px;
    }



div.messagePanel div[box]
{
	display:block;
	padding:10px;    
    font-size: 12px;
}


div.message_datetime {
    display:block;
    line-height:30px;
    padding:0 15px;
    color:#13a89e;
}

div.message_subject {
    display:block;
    line-height:30px;
    padding:10px 15px 0 15px;
    font-size: 15px;
    font-weight:bold;
    border-bottom:1px solid #f0f0f0;
    margin-bottom:10px;
}

div.message_body {
    display:block;
    line-height:40px;
    border-top:1px dotted #e7e7e7;
    padding:0 15px;
    font-size: 16px;
    white-space:pre-wrap;
    overflow:hidden;
    /*word-wrap:break-word;
    word-break:break-all;*/
}



message
{
    display: block;
    width: calc(80% - 30px);
    padding: 15px 10px 10px 10px;
    font-size: 14px;
    overflow: hidden;
}

message[sender="other"]{
    background: #13A89E;
    color:#FFFFFF;
    border-radius: 15px 0 15px 15px;
    margin: 0 10px 20px 20%;
    border-right:5px solid #0c827a;
    }
message[sender="me"]{
    background: #ececec;
    color:#666666;
    border-radius: 0 15px 15px 15px;
    margin: 0 20% 20px 10px;
    border-left:5px solid #cecece;
    }

bl-user
{

}

bl-body
{
    display:block;
    white-space: pre-wrap;
}

bl-datetime
{
    display:block;
    font-size: 9px;
    line-height:20px;
    margin:10px 0;
}

message[sender="other"] bl-datetime
{
    color:#9ee2de;
}

message[sender="me"] bl-datetime
{
    color:#8a8a8a;
}


/*////////////////////////////////////////////////////////////////*/

#LastVieweds {
    display:block;
    vertical-align:top;
    overflow:hidden;
}

#LastVieweds span{
    display:block;
    font-size:15px;
    line-height:30px;
    color:#13a89e;
    margin:0 0 10px 10px;
    padding:5px;
    font-weight:bold;
    border-bottom:2px solid #CDCDCD;    
}


div.LastViewedItem {
    display:block;
    min-height:32px;
    border:0;
    border-radius: 15px;
    vertical-align:top;
    white-space: pre-wrap;
    float:right;
    color:#666666;
    padding:20px;    
    background:rgba(0,0,0,0.1);
    margin:0 0 10px 10px; 
}

    div.LastViewedItem img {
        height:32px;
        margin:0 0 0 10px;
        border:0;
        float:right;      
    }

    div.LastViewedItem a[title] {
        display:block;
        font-size:14px;
        line-height:32px;
        color:#000000;
        text-decoration:none;
        vertical-align:top;
    }
    div.LastViewedItem div a[title]:hover {
        text-decoration:underline;
    }

/*////////////////////////////////////////////////////////////////*/

#postsList {
    display:block;
}


@media screen and (min-width: 1281px) {


	#postsListColumn, #postsListColumnRest {
    display:block;
    margin: 0;
    width:900px;
    }
    #postsListColumn column1,
    #postsListColumnRest column1 {
        display: inline-block;
        width: calc(33% - 10px);
        margin: 0 0 0 10px;
        vertical-align: top;
    }
    #postsListColumn column2,
    #postsListColumnRest column2 {
        display: inline-block;
        width: calc(33% - 10px);
        margin: 0 0 0 10px;
        vertical-align: top;
    }
    #postsListColumn column3,
    #postsListColumnRest column3 {
        display: inline-block;
        width: calc(33% - 10px);
        margin: 0 0 0 10px;
        vertical-align: top;
    }
}

@media screen and (max-width: 1280px) {
    #postsListColumn column1,
    #postsListColumnRest column1 {
        display: inline-block;
        width: 33%;
        margin: 0;
        vertical-align: top;
    }
    #postsListColumn column2,
    #postsListColumnRest column2 {
        display: inline-block;
        width: calc(34% - 20px);
        margin: 0 10px;
        vertical-align: top;
    }
    #postsListColumn column3,
    #postsListColumnRest column3 {
        display: inline-block;
        width: 33%;
        margin: 0;
        vertical-align: top;
    }
}


@media screen and (max-width: 1280px) {
    #postsListColumn column1,
    #postsListColumnRest column1 {
        display: block;
        width:100%;
        margin: 0;
        vertical-align: top;
        zoom: 90%;
    }
    #postsListColumn column2,
    #postsListColumnRest column2 {
        display: block;
        width:100%;
        margin: 0;
        vertical-align: top;
        zoom: 90%;
    }
    #postsListColumn column3,
    #postsListColumnRest column3 {
        display: block;
        width:100%;
        margin: 0;
        vertical-align: top;
        zoom: 90%;
    }
}


/*////////////////////////////////////////////////////////////////*/

@media screen and (min-width: 1281px) {
    #postsListRest {
        display: block;
        vertical-align: top;
        float: right;
    }
}

@media screen and (max-width: 1280px) {
    #postsListRest {
        display: block;
        vertical-align: top;
    }
}


/*////////////////////////////////////////////////////////////////*/


div.postItem {
    display:block;
    position:relative;
    vertical-align:top;
    white-space:normal;
    color:#666666;
    padding:0 0 5px 0;    
    background:rgba(235,235,235,0.5);
    margin:0 0 10px 0;
    text-align:right;
    cursor:pointer;
    margin-top:10px;
    /*filter:grayscale();*/
    backdrop-filter: blur(2px);
    border-top: solid 5px #13a89e;
}


    div.postItem:hover > span[image] > img {
        -moz-transform: scale(1.3);
        -webkit-transform: scale(1.3);
        -o-transform: scale(1.3);
        -ms-transform: scale(1.3);
        transform: scale(1.3);
        /*transform: scale(1.5) rotate(5deg);*/
    }

    div.postItem span[image] {
        display:block;
        overflow:hidden;
        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.25);
    }

    div.postItem span[image] img {
        display:block;
        margin:0;
        border:0;
        width: calc(100% - 40px);
        border: 20px solid #FFFFFF;
        -webkit-transition: all 0.5s;
        -moz-transition: all 0.5s;
        -ms-transition: all 0.5s;
        -o-transition: all 0.5s;
        transition: all 0.5s;
    }

    div.postItem a[title] {
        display:block;
        font-size:20px;
        line-height:30px;
        padding:20px 20px 10px 20px;
        font-weight:bold;
        color:#292929;
        text-decoration:none;
    }
    div.postItem a[title][noimage] {
        border-top:10px dotted #D09A3A;
    }
    div.postItem a[title]:hover {
        text-decoration:underline;
    }


        div.postItem span[time] {
        display:block;
        position: absolute;
        top:0px;
        line-height:20px;
        background-color: rgba(0,0,0,0.3);
        font-size:10px;
        letter-spacing: 0px;    
        font-weight:bold;
        text-transform:uppercase;
        color:#fff;
        padding:0px 10px 0px 10px;
        margin:5px 0px 5px 5px;
        -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
        -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
        box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);            
    }

    div.postItem span[shortdes] {
        display:block;
        font-size:16px;
        letter-spacing: 0px;
        padding:5px 10px 10px 10px;
        color:#434343;
        text-align:justify;
        text-decoration:none;
    }


    div.postItem span[userIcon]
    {
        display: block;
        position: absolute;
        right: 15px;
        top: 15px;
        text-align:left;
        /*opacity: 0;*/
    }


    div.postItem span[userIcon] a:hover > span
    {
        background: rgba(0,0,0,.6);
        color:#FFFFFF;
    }


    div.postItem span[userIcon] a img
    {
        display:inline-block;
        width: 48px;
        height: 48px;
        min-height:48px;
        border-radius: 1px;
        border: 5px solid rgba(255,255,255,0.25);
        vertical-align:middle;
    }

    div.postItem span[userIcon] a span
    {
        display:inline-block;
        color:transparent;
        font-size:10px;
        line-height:24px;
        vertical-align:middle;
        padding:0 10px;      
    }

    div.postItem:hover
    {
        /*filter:initial;*/
    }

    div.postItem:hover > span[userIcon]
    {
        display: block;
        position: absolute;
        right: 15px;
        top: 15px;
        text-align:left;
        opacity: 1;
    }


/*////////////////////////////////////////////////////////////////*/


div.postDetail {
    display: block;
    position: relative;
    border: 0;
    vertical-align: top;
    white-space: normal;
    color: #666666;
    padding: 0 0 10px 0;
    margin: 10px 0;
    background: rgba(235,235,235,0.5);
    text-align: right;
    backdrop-filter: blur(2px);    
}

div.postDetail video
{
    display:block;
    width:100%;
}

@media screen and (max-width: 1280px) {
    div.postDetail {
        margin: 0 0 10px 0;
    }
}

    div.postDetail h1 {
        display:block;
        font-size:20px;
        line-height:40px;
        padding:20px 30px 20px 65px;
        color:#000000;
        margin: 0; 
        text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.75);
    }

    div.postDetail span[editpost] {
        display:block;
        position:absolute;
        background:#999999 url(images/edit.png) no-repeat center center;
        background-size: 24px 24px;
        color:transparent;
        width:30px;
        height:30px;
        line-height:30px;
        text-align:center;
        top:0px;
        right:0px;
        cursor:pointer;
    }
    div.postDetail span[editpost]:hover {
        background-color:#4678f7;
    }

    div.postDetail span[image] {
        display:block;
        overflow:hidden;
        text-align:center;
    }

    div.postDetail span[image] img {
        display:block;
        margin:0 auto;
        border:0;
        max-width: 100%;
        max-height: 500px;
        padding:0;
    }

    div.postDetail ul[extraimage]
    {
        display:block;
        overflow:hidden;
        list-style:none;
        list-style-type:none;
        margin:0;
        padding:10px 20px 0 20px;    

        background: #a1a1a1;
        background: -moz-linear-gradient(top, #eeeeee 0%, #ffffff 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #ffffff));
        background: -webkit-linear-gradient(top, #eeeeee 0%, #ffffff 100%);
        background: -o-linear-gradient(top, #eeeeee 0%, #ffffff 100%);
        background: -ms-linear-gradient(top, #eeeeee 0%, #ffffff 100%);
        background: linear-gradient(to bottom, #eeeeee 0%, #ffffff 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0 );
    }

    div.postDetail ul[extraimage] li {
        display:inline-block;
        position:relative;
        margin:0 0 10px 10px;
        border:1px solid #CDCDCD;
        vertical-align:top;
    }

    div.postDetail ul[extraimage] li img
    {
        display:block;
        width:90px;
        border:5px solid #FFFFFF;
        cursor:pointer;
    }

    div.postDetail ul[extraimage] li img:hover
    {
        border:5px solid #396E9E;
    }

    div.postDetail div[container] {
        display:block;
        border:0;
        padding:0;
        text-align:right;        
    }

    div.postDetail div span[detail] {
        display:block;
        font-size:16px;
        color:#000000;
        padding:20px 30px;
        text-align:justify;
        overflow:hidden;
        white-space:pre-line;
    }
div.postDetail div span[detail][lang='en'] {
    font-family:tahoma;
    direction:ltr;
    text-align:left;
    line-height:30px;
}

FarsiContactCard span[vcard='first_Name'] {
	font-family:tahoma;
	font-weight:bold;
	padding-top:20px;
}

FarsiContactCard span[vcard='last_Name'] {
	font-family:tahoma;
	font-weight:bold;
}

FarsiContactCard span[vcard='businessName'] {
	font-family:tahoma;
	font-weight:bold;
	padding-top:20px;
	line-height:30px;
}

FarsiContactCard span[vcard='address'] {
	font-family:tahoma;
	font-size:14px;
	line-height:20px;
}

FarsiContactCard span[vcard='city'] {
	font-family:tahoma;
	font-size:14px;
	line-height:20px;
}

FarsiContactCard span[vcard='province'] {
	font-family:tahoma;
	font-size:14px;
	line-height:20px;
}

FarsiContactCard span[vcard='postalCode'] {
	font-family:tahoma;
	font-size:14px;
	line-height:20px;
}

FarsiContactCard span[vcard='primaryPhone'] {
	font-family:tahoma;
	font-size:14px;
	line-height:20px;
	padding-top:20px;
}

FarsiContactCard span[vcard='cellPhone'] {
	font-family:tahoma;
	font-size:14px;
	line-height:20px;
}

FarsiContactCard span[vcard='fax'] {
	font-family:tahoma;
	font-size:14px;
	line-height:20px;
	padding-bottom:20px;
}

FarsiContactCard span[vcard='website'] {
	font-family:tahoma;
	font-size:14px;
	line-height:20px;
}

FarsiContactCard span[vcard='email'] {
	font-family:tahoma;
	font-size:14px;
	line-height:20px;
	padding-bottom:20px;	
}

FarsiContactCard span[vcard='datavcard'] {
	font-family:tahoma;
}

div.postDetail div a[sourceUrl] {
    display: inline-block;
    font-size: 12px;
    color: #FFFFFF;
    background: #66727e url(images/link.png) no-repeat 8px center;
    border-radius: 3px;
    padding: 5px 10px 5px 35px;
    margin: 10px 30px;
    text-decoration: none;
}
    div.postDetail div a[sourceUrl]:hover {
        background: #13a89e url(images/link.png) no-repeat 8px center;
    }

    div.postDetail div span[share] {
        display:block;
        overflow:hidden;
        position:relative;
        margin:0;
        padding:10px 0;
        vertical-align:top;
        white-space:nowrap;
        text-align:center;
    }
    
    div.postDetail div span[more] {
        display:block;
        position:relative;
        height:50px;
        line-height:50px;
        font-size:14px;
        color:#999999;
        text-decoration:none;
        border-top:3px dotted #dcdcdc;
        margin-bottom:20px;
        vertical-align:top;
        white-space:nowrap;
        text-align:right;                
    }
    

div.postDetail div span[more] img{
    display:inline-block;
    vertical-align:top;
    margin:10px 30px 10px 10px;
    height:48px;
    border-radius:48px;
}

    div.postDetail div span[time] {
        display:inline-block;
        line-height:30px;
        font-size:12px;
        color: #13a89e;
        padding:20px 0;        
    }

        div.postDetail div span[time] a{
            font-weight:bold;
            color: #13a89e;
            text-decoration:none;
    }

        div.postDetail div span[time] a:hover{
            text-decoration:underline;
            color:#000000;
    }

    div.postDetail div span[more] span.rating {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        white-space: nowrap;
        vertical-align: top;
        line-height: 16px;
        height: 16px;
        font-size: 11px;
        margin: 27px 10px 27px 30px;
    }

    div.postDetail div span[more] span.viewed {
        display: inline-block;
        line-height: 30px;
        font-size: 12px;
        color: #747474;
        padding:0 10px;
        background:#dcdcdc;
        margin:20px 10px;
    }

    div.postDetail span.opinionCtrl
    {
        position:absolute;
        top:10px;
        left:30px;
    }

/*////////////////////////////////////////////////////////////////*/

span.opinionCtrl
{
    display:block;
    width:32px;
    height:64px;
    margin:0;
    padding:0;
    border:0;
    font-size:14px;
    line-height: 32px;
    vertical-align:middle;
}

span.opinionCtrl span[like]
{
    display: block;
    width: 32px;
    height: 32px;

    background: url(images/love.png) no-repeat center center;
    text-align: center;
    padding: 0;
    cursor: pointer;
    color: #666666;
}

span.opinionCtrl span[dislike]
{
    display: block;
    width: 32px;
    height: 32px;

    background: url(images/nutral.png) no-repeat center center;
    text-align: center;
    padding: 0;
    cursor: pointer;
    color: #666666;
}

span.opinionCtrl span[like]:hover
{
    background: url(images/loved.png) no-repeat center center;
    color:#FFFFFF;
}
span.opinionCtrl span[dislike]:hover
{
    background: url(images/nutraled.png) no-repeat center center;
    color:#FFFFFF;
}

/*////////////////////////////////////////////////////////////////*/

#homepageMiddleColumn
{
    display:block;
    width:300px;
    vertical-align:top;
    float:right;
    padding: 0;
}

/*////////////////////////////////////////////////////////////////*/


#eventsList {
    display:block;
    width:calc(100% - 30px);
    vertical-align:top;
    float:right;
    padding: 10px;
    margin-left:10px;
    background:#13a89e;
}

    #eventsList h1 {
        font-size:17px;
        font-weight:bold;
        line-height:20px;
        color:#396E9E;
    }

div.eventItem {
    display:block;
    min-height:50px;
    position:relative;
    border-bottom:1px dashed #373636;
    white-space:normal;
    color:#fbfbfb;
    padding:15px 0;
}

div.eventItem:first-child {
    padding-top:0;
}
div.eventItem:last-child {
    border-bottom:0;
}

    div.eventItem div[date] {
        display:block;
        position:absolute;
        top:15px;
        right:0;
        padding:0;
        border:0;
        width:46px;
        height:46px;
        border:1px solid #4e4e4e;
        text-align:center;
        vertical-align:top;
        letter-spacing:-0.5px;
    }
        div.eventItem div[date] span.day {
        display:block;
        width:46px;
        line-height:22px;
        font-size:22px;
        padding-top:5px;
        font-weight:bold;
        color:#396E9E;        
    }
        div.eventItem div[date] span.month {
        display:block;
        width:46px;
        line-height:15px;
        font-size:11px;
        font-weight:normal;
        color:#a5a5a5;
    }

    div.eventItem div[detail] {
        display:block;
        border:0;
        padding:0 58px 0 10px;
        margin: 0;
        vertical-align:top;
    }

    div.eventItem div span[title] {
        display:block;
        font-size:14px;
        line-height:14px;
        padding-bottom:8px;
        font-weight:bold;
        color:#fbfbfb;
    }

    div.eventItem div a[title] {
        display:block;
        font-size:14px;
        line-height:14px;
        padding-bottom:8px;
        font-weight:bold;
        color:#fbfbfb;
        text-decoration:none;
    }
    div.eventItem div a[title]:hover {
        text-decoration:underline;
    }

    div.eventItem div span[detail] {
        font-size:11px;
        color:#a5a5a5;
    }



/*////////////////////////////////////////////////////////////////*/


div.jscalendar {
    display:block;
    position:relative;
    border:1px solid #373636;
    color:#e7e7e7;    
}

    div.jscalendar span[calendartitle] {
        display:block;
        font-size:13px;
        line-height:20px;
        height:20px;
        margin:10px 10px 0 10px;
    }

    div.jscalendar span[calendarCtrl] {
        display:block;               
        width:54px;
        position:absolute;
        top:7px;
        left:10px;
    }
    div.jscalendar span[previousCtrl]  {
        display:inline-block;
        font-size:14px;
        line-height:25px;
        height:25px;
        width:25px;
        border:1px solid #373636;
        text-align:center;
        border-radius:0 15px 15px 0;
    }
    div.jscalendar span[previousCtrl]:hover  {
        color:#FFFFFF;
        background:#000000;
        cursor:pointer;
    }
    div.jscalendar span[nextCtrl]  {
        display:inline-block;
        font-size:14px;
        line-height:25px;
        height:25px;
        width:25px;
        border:1px solid #373636;
        text-align:center;
        margin-right:-1px;
        border-radius:15px 0 0 15px;
    }
    div.jscalendar span[nextCtrl]:hover  {
        color:#FFFFFF;
        background:#000000;
        cursor:pointer;
    }

    div.jscalendar div[body] {
        display:block;
        margin:10px 0;
        text-align:center;
    }

    div.jscalendar span[today] {
        display:inline-block;
        font-size:15px;
        width:36px;
        height:36px;
        line-height:36px;
        text-align:center;
        border:1px dotted #373636;
        margin: 0 0 -1px -1px;
        color:#f7ed78;
    }
    div.jscalendar span[today]:hover {
        color:#FFFFFF;
        background:#000000;
        cursor:pointer;
    }


    div.jscalendar span[day] {
        display:inline-block;
        font-size:15px;
        width:36px;
        height:36px;
        line-height:36px;
        text-align:center;
        border:1px dotted #373636;
        margin: 0 0 -1px -1px;
    }
    div.jscalendar span[day]:hover {
        color:#FFFFFF;
        background:#000000;
        cursor:pointer;
    }

    div.jscalendar span[appointed] {
        color:#396E9E;
    }

    div.jscalendar span[dayPrevious] {
        display:inline-block;
        font-size:15px;
        width:36px;
        height:36px;
        line-height:36px;
        text-align:center;
        border:1px dotted #373636;
        margin: 0 0 -1px -1px;
        color:#585858;
    }

    div.jscalendar span[dayNext] {
        display:inline-block;
        font-size:15px;
        width:36px;
        height:36px;
        line-height:36px;
        text-align:center;
        border:1px dotted #373636;
        margin: 0 0 -1px -1px;
        color:#585858;
    }

/*////////////////////////////////////////////////////////////////*/

#relatedPostList {
    display:block;
    vertical-align:top;
    white-space:normal;
}

@media screen and (max-width: 640px) {
    #relatedPostList {
        zoom:90%;
    }
}

div.relatedPostItem {
    display:block;
    position:relative;
    border: 0;
    vertical-align:top;
    white-space:normal;
    color:#666666;
    padding:30px;
    margin:0 0 10px 0;    
    background:rgba(235,235,235,0.5);
}

@media screen and (max-width: 1280px) {
    div.relatedPostItem {
        margin:0 0 10px 0; 
    }
}


div.relatedPostItem:last-child {
    border-bottom:0;
}

    div.relatedPostItem span[editpost] {
        display:block;
        position:absolute;
        background:#999999 url(images/edit.png) no-repeat center center;
        background-size: 24px 24px;
        color:transparent;
        width:30px;
        height:30px;
        line-height:30px;
        text-align:center;
        top:0px;
        left:0px;
        cursor:pointer;
    }
    div.relatedPostItem span[editpost]:hover {
        background-color:#4678f7;
    }

@media screen and (min-width: 641px) {
    div.relatedPostItem img {
        display: inline-block;
        border: 0;
        width: 200px;
        vertical-align: middle;
        padding: 10px;
        background: white;
        border-radius: 5px;
        -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
        -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
        box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
    }

    div.relatedPostItem div {
        display: inline-block;
        border: 0;
        width: calc(100% - 260px);
        padding: 0 20px;
        vertical-align: middle;
    }
}

@media screen and (max-width: 640px) {
    div.relatedPostItem img {
        display: block;
        border: 0;
        width: 100%;
        margin-bottom:30px;
        background: white;
        border-radius: 5px;
        -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
        -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
        box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);        
    }

    div.relatedPostItem div {
        display: block;
        border: 0;
        width: 100%;
        padding: 0;
        vertical-align: top;
    }
}


    div.relatedPostItem div a[title] {
        display:block;
        font-size:18px;
        font-weight:bold;
        line-height:30px;
        padding-bottom:0px;
        color:#13a89e;
        text-decoration:none;
    }

    div.relatedPostItem div a[title]:hover {
        text-decoration:underline;
    }

    div.relatedPostItem div span[detail] {
        display:block;
        font-size:16px;
        color:#66727e;
        padding-bottom:5px;
        text-align:justify;
    }

        div.relatedPostItem div span[time] {
            line-height:20px;
            font-size:10px;
            color:#999999;
            padding:0 0 0 20px;
        }

        div.relatedPostItem div span[rate] {
            display:block;
            line-height:20px;
            font-size:12px;
            color:#999999;
            padding:10px 0;
        }


/*////////////////////////////////////////////////////////////////*/


div.commentPanel {
    display:block;
    border: 0;
    vertical-align:top;
    white-space:normal;
    text-align: right;
    color:#666666;
    padding:20px 30px 40px 30px;
    margin:0 0 10px 0;    
    background:rgba(235,235,235,0.5);
    backdrop-filter: blur(3px);
}


div.commentPanelHeader {
    display:block;
    position:relative;
    vertical-align:top;
    white-space:nowrap;
    color:#666666;
    padding:0;
    margin:0 0 10px 0;
    
}

div.commentPanelHeader img{
    display:inline-block;
    vertical-align:top;
    margin:0px 2px 4px 10px;
    height:32px;
    border-radius:32px;
}

div.commentPanelHeader span{
    display:inline-block;
    white-space:normal;
    vertical-align:top;
    line-height:32px;
    height:32px;
    color:#999999;
    font-size: 13px;
    white-space:nowrap;
    margin:0;
}

div.commentPanelHeader span[comntUsrInfDat]{
    display:inline-block;
    white-space:normal;
    vertical-align:top;
    line-height:32px;
    height:48px;
    color:#999999;
    font-size:12px;
    white-space:nowrap;
    margin:0;
}

        div.commentPanelHeader span[comntUsrInfDat] a{
            font-weight:bold;
            color:#999999;
            text-decoration:none;
    }

        div.commentPanelHeader span[comntUsrInfDat] a:hover{
            text-decoration:underline;
            color:#000000;
    }

    div.commentPanelHeader span.opinionCtrl
    {
        position:absolute;
        top:28px;
        left:0px;
    }

div.commentPanel textarea{
    display:block;
    width: calc(100% - 22px);
    height: 100px;
    border: 1px solid #666666;
    vertical-align:top;
    white-space:normal;
    color:#666666;
    margin: 0 0 10px 0;
    padding:10px;    
    background:#FFFFFF;
}

div.commentPanel span.commentDetail{
    display:block;
    white-space:pre-wrap;
    font-size:16px;
    color:#2e2e2e;
    padding:20px 30px 0 50px;
    margin:0 -30px;
    line-height:20px;    
    border-top:3px dotted #dcdcdc;
}

div.commentPanel input[type="submit"]
{
  display:inline-block;
  vertical-align:top;
  height:35px;
  min-width:40px;
  text-align:center;
  padding:0 20px;
  margin:0;
  font-size: 12px;
  line-height:35px;
  cursor:pointer;
  color: #13a89e;
  border:1px solid #666666;
  background: #FFFFFF;
}
div.commentPanel input[type="submit"]:hover
{
  background: #13a89e;
  color:#FFFFFF;
}

div.commentPanel select
{
  display:inline-block;
  vertical-align:top;
  height:35px;
  text-align:center;
  margin:0;
  font-size: 12px;
  line-height:35px;
  cursor:pointer;
  color: #13a89e;
  border:1px solid #666666;
  background: #FFFFFF;
}

/*////////////////////////////////////////////////////////////////*/


div.contactUsForm input{
    margin:0 0 10px 0;
    border:1px solid #13a89e;
}

div.contactUsFormHeader {
    display:block;
    vertical-align:top;
    white-space:nowrap;
    color:#13a89e;
    padding:0;
    margin:0 -30px 15px -30px;
    padding:15px 30px;
    font-size:18px;
    border-bottom:3px dotted #eeeeee;
}

/*////////////////////////////////////////////////////////////////*/


span[friend]{
    display:inline-block;
    white-space:normal;
    color:#FFFFFF;
    cursor:pointer;
    opacity: 0.7;
}

span[friend]:hover {
    opacity: 1.0;
}

span[friend="add"]{
    background:#1E60D8;
}

span[friend="approve"]{
    background:#1D6E14;
}

span[friend="block"]{
    background:#373636;
}

span[friend="close"]{
    background:#8e3db4;
}

span[friend="pending"]{
    background:#999999;
}

span[sendmessage]{
    display:inline-block;
    white-space:normal;
    color:#FFFFFF;
    background-color:#13a89e;
    cursor:pointer;
}
span[sendmessage]:hover {
    background-color:#575757;
}


/*////////////////////////////////////////////////////////////////*/

div.userInfoBox {
    display:block;
    position:relative;
    border:0;
    vertical-align:top;
    white-space:normal;
    text-align:right;
    color:#666666;
    padding:0;
    margin-bottom:10px;
    background:rgba(235,235,235,0.5);
}

div.userInfoBox img{
    position:absolute;
    z-index:10;
    display:block;
    margin:0;
    height:72px;
    top:20px;
    right:20px;
    border:5px solid rgba(255,255,255,0.25);
    border-radius:72px;
}

div.userInfoBox a[fullname]{
    display:block;
    white-space:normal;
    line-height:30px;
    height:30px;
    color:#FFFFFF;
    background:#d09a3a;
    font-size:15px;    
    padding:30px 110px 20px 10px;
    border-bottom: 3px solid #E2E2E2;
    margin-bottom:20px;
    text-transform:uppercase;
    text-decoration:none;
}
div.userInfoBox a[fullname]:hover{
    text-decoration:underline;
}

div.userInfoBox span[memberinfo]{
    display:block;
    position:absolute;
    top:50px;
    right: 110px;
    white-space:normal;
    color:#dcdcdc;
    font-size:10px;
    line-height:20px;
    height:20px;
}

div.userInfoBox a[fullname][data-badge="superuser"]:after {
    content: '';
    position: absolute;
    top: 20px;
    right: 75px;
    font-size: .9em;
    background: #FFFFFF url(images/superuser_tag.png) no-repeat center center;
    background-size: 16px auto;
    border: 1px solid #FFFFFF;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    z-index: 10;
}


div.userInfoBox span[info]{
    display:block;
    white-space:normal;
    color:#13a89e;
    font-size:14px;
    margin-bottom:10px;
    padding:10px 30px;
    white-space:pre-wrap;
}

div.userInfoBox span[exlinks]{
    display:block;
    font-size:11px;
    color:#999999;
    text-decoration:none;
    padding:0 30px 10px 30px;
}

div.userInfoBox span[exlinks] a[website]
{
    display:inline-block;    
    font-size:12px;
    line-height:22px;
    color:#13a89e;
    background:#EEEEEE url(images/link-dark.png) no-repeat 8px center;
    border-radius:15px;
    padding:5px 10px 5px 35px;
    margin: 0 0 10px 10px;
    text-decoration:none;
}
div.userInfoBox span[exlinks] a[website]:hover 
{
    color:#FFFFFF;    
    background:#d09a3a url(images/link.png) no-repeat 8px center;
}

div.userInfoBox span[more]{
        display:block;
        height:50px;
        line-height:50px;
        font-size:11px;
        color:#999999;
        text-decoration:none;
        padding:10px 30px 0 30px;
        border-top:1px solid #eeeeee;
}

div.userInfoBox span[friend]{
    height:25px;
    line-height:25px;    
    padding:5px 5px;
    font-size:11px;
    margin:0 0 5px 5px;
}

div.userInfoBox span[sendmessage]{
    color:transparent;
    background:#13a89e url(images/mail.png) no-repeat center center;
    background-size:22px auto;
    width:42px;
    height:25px;
    line-height:25px;    
    padding:5px 0;
    font-size:12px;
    margin:0 0 5px 5px;
    white-space:nowrap;
}
div.userInfoBox span[sendmessage]:hover {
    background-color:#575757;
}

/*////////////////////////////////////////////////////////////////*/


div.userProfileHeaderBox {
    display:block;
    position:relative;
    border:0;
    vertical-align:top;
    white-space:normal;
    text-align:right;
    color:#666666;
    padding:0;
    margin: 0 0 10px 0;
    background:rgba(235,235,235,0.5);
    overflow:hidden;
}

@media screen and (max-width: 1280px) {
    div.userProfileHeaderBox {
        margin: 0 0 10px 0;
    }
}

    div.userProfileHeaderBox span[editprofile] {
        display:block;
        position:absolute;
        z-index:30;
        background: rgba(0,0,0,0.2) url(images/settings.png) no-repeat center center;
        background-size: 32px 32px;
        color:transparent;
        width:50px;
        height:50px;
        line-height:40px;
        text-align:center;
        top:0px;
        right:0px;
        cursor:pointer;
    }
    div.userProfileHeaderBox span[editprofile]:hover {
        background-color:#FF2D2D;
    }

div.userProfileHeaderBox span[headerBG]
{
    display:block;
    overflow:hidden;
    height:300px;
    background:rgba(0,0,0,0.25);
    backdrop-filter: blur(2px);
}

div.userProfileHeaderBox img[header]{
    display:block;
    margin:0;
    padding:0;
    border:0;
    width:100%;
    height: 100%;
    object-fit: cover;
}

div.userProfileHeaderBox img[photo]{
    position:absolute;
    z-index:10;
    display:block;
    margin:0;
    height:180px;
    top:140px;
    left:30px;
    border:5px solid rgba(255,255,255,0.25);
}

div.userProfileHeaderBox a[fullname]{
    display:block;
    position:relative;
    z-index:10;
    white-space:nowrap;
    line-height:30px;
    height:30px;
    color:#FFFFFF;
    font-size:22px;    
    padding:0 20px 0 250px;
    margin: -45px 0 20px 0;
    text-align:left;
    text-transform:uppercase;
    text-decoration:none;
    text-shadow: 1px 1px 0px rgba(0, 0, 0, 1);
}
div.userProfileHeaderBox a[fullname]:hover{
    text-decoration:underline;
}

div.userProfileHeaderBox span[memberinfo]{
    display:block;
    position:relative;
    z-index: 10;
    padding:0 20px 0 250px;
    text-align:left;
    white-space:nowrap;
    color:#13a89e;
    font-size:11px;
    line-height:20px;
    height:20px;
    text-shadow: 1px 1px 0px rgba(255, 255, 255, 1);
}


div.userProfileHeaderBox a[fullname][data-badge="superuser"]:after {
    content: '';
    position: absolute;
    top: -5px;
    /* right: 40px; */
    font-size: .9em;
    width: 16px;
    height: 16px;
    z-index: 20;
    background: #FFFFFF url(images/superuser_tag.png) no-repeat center center;
    background-size: 16px auto;
    border: 1px solid #FFFFFF;
    border-radius: 50%;
}

div.userProfileHeaderBox span[info]{
    display:block;
    white-space:normal;
    color:#000000;
    font-size:16px;
    margin-bottom:10px;
    padding:10px 20px;
    white-space:pre-wrap;
}

div.userProfileHeaderBox span[exlinks]{
    display:inline-block;
    font-size:11px;
    color:#999999;
    text-decoration:none;
    padding:0 20px 20px 20px;
}

div.userProfileHeaderBox span[exlinks] a[website]
{
    display:inline-block;    
    font-size:12px;
    line-height:22px;
    color:#13a89e;
    background:#EEEEEE url(images/link-dark.png) no-repeat 8px center;
    border-radius:15px;
    padding:5px 10px 5px 35px;
    margin: 0 0 10px 10px;
    text-decoration:none;
}
div.userProfileHeaderBox span[exlinks] a[website]:hover 
{
    color:#FFFFFF;    
    background:#13a89e url(images/link.png) no-repeat 5px center;
}

div.userProfileHeaderBox span[more]{
        display:block;
        height:50px;
        line-height:50px;
        font-size:11px;
        color:#999999;
        text-decoration:none;
        text-align:left;
        padding:10px 30px 0 35px;
        border-top:1px solid #eeeeee;
}

div.userProfileHeaderBox span[friend]{
    height:25px;
    line-height:25px;    
    padding:5px 10px;
    font-size:12px;
    margin:0 5px 5px 0;
}

div.userProfileHeaderBox span[sendmessage]{
    background:#13a89e url(images/mail.png) no-repeat right 10px center;
    background-size:22px auto;
    height:25px;
    line-height:25px;    
    padding:5px 40px 5px 10px;
    font-size:12px;
    margin:0 5px 5px 0;
    white-space:nowrap;
}
div.userProfileHeaderBox span[sendmessage]:hover {
    background-color:#575757;
}


/*////////////////////////////////////////////////////////////////*/


div.asideInfoBox {
    display:block;
    position:relative;
    vertical-align:top;
    white-space:normal;
    text-align:right;
    color:#666666;
    padding:0 0 10px 0;
    margin-bottom:10px;
    background: rgba(235,235,235,0.5);
}

span.asideInfoBoxHeader {
    display:block;
    white-space:normal;
    line-height:40px;
    height:40px;
    color:#13a89e;
    border-bottom:1px dotted #13a89e;
    font-size:15px;    
    padding:10px 0 5px 0;
    margin:0 30px;
    text-transform:uppercase;
}

div.asideInfoBox span[info]{
    display:block;
    white-space:normal;
    color:#999999;
    font-size:14px;
    margin-bottom:10px;
    padding:10px 30px;
}

div.asideInfoBox a[tag]{
    display:inline-block;
    white-space:normal;
    line-height:25px;    
    color:#FFFFFF;
    background:#d09a3a;
    padding:5px;
    font-size:14px;
    margin:0 0 5px 5px;
    text-decoration:none;
    border-radius:15px;
}
div.asideInfoBox a[tag]:hover {
    text-decoration:underline;
}

div.asideInfoBox img[friend]{
    display:inline-block;
    position:relative;
    width:58px;
    margin:0 0 1px 1px;
    border:0;
    border-radius:50%;
}
div.asideInfoBox img[friend]:hover {
    width:62px;
    margin:-2px -2px -1px -1px;
    z-index:5;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
}

div.asideInfoBox ul[info]{
    display:block;
    white-space:normal;
    color:#999999;
    font-size:16px;
    margin-bottom:0px;
    padding:0 20px 0px 20px;
    list-style:none;
    overflow:hidden;
}

div.asideInfoBox ul[info] li{
    display: table;
    min-height: 64px;
    width: 100%;
    border-bottom:1px solid #eeeeee;
}
div.asideInfoBox ul[info] li:first-child{
    padding-top:0;
}
div.asideInfoBox ul[info] li:first-child img{
    top:0;
}
div.asideInfoBox ul[info] li:last-child{
    border-bottom:0;
}

div.asideInfoBox ul[info] li img{
    display: table-cell;
    vertical-align: middle;
    width:64px;
    height:64px;
    border-radius: 3px;
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    right:0;
    margin: 10px;
}

div.asideInfoBox ul[info] li a[title]{
    display: table-cell;
    vertical-align: middle;
    color:#7A7A7A;
    width: 100%;
    font-size: 14px;
    text-decoration:none;
    word-wrap:break-word;
}
div.asideInfoBox ul[info] li a[title]:hover{
    color:#666666;
    text-decoration:underline;
}




div.asideInfoBox ul[menu]{
    display:block;
    white-space:normal;
    color:#999999;
    font-size:14px;
    margin:0;
    padding:0 30px;
    list-style:none;
    overflow:hidden;
}

div.asideInfoBox ul[menu] li{
    display:block;
    position:relative;
    min-height:35px;
    line-height:35px;
    padding:0;    
    border-bottom:1px solid #eeeeee;
}
div.asideInfoBox ul[menu] li:last-child{
    border-bottom:0;
    /*margin-bottom:10px;*/
}


div.asideInfoBox ul[menu] li span[addoption]{
    display:block;
    position:absolute;
    width:25px;
    height:25px;
    top:12px;
    left:0px;
    line-height:25px;
    text-align:center;
    color:#FFFFFF;
    background:#dcdcdc url(images/add.png) no-repeat center center;
    padding:0;
    margin:0;   
    cursor:pointer;
}
div.asideInfoBox ul[menu] li span[addoption]:hover{
    background:#13a89e url(images/add.png) no-repeat center center;
}

div.asideInfoBox ul[menu] li a{
    display:block;
    position:relative;
    color:#666666;
    padding:7px 0;
    margin:3px 0;
    text-decoration:none;
}
div.asideInfoBox ul[menu] li a:hover{
    color:#13a89e;
    border-right: 5px solid #13a89e;
    padding:7px 25px 7px 30px;
    margin:3px -30px;
    background-color: #f0f0f0;
}

div.asideInfoBox ul[menu] li a[selected]{
    color:#000000;
    border-right: 5px solid #13a89e;
    padding:7px 25px 7px 30px;
    margin:3px -30px;
    background-color: #f0f0f0;
}

div.asideInfoBox ul[menu] li a i{
    display:inline-block;
    width:30px;
    color:#13a89e;
    font-size:16px;
    vertical-align:middle;
}

div.asideInfoBox ul[menu] li[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    z-index:10;
    top: 15px;
    left: 2px;
    font-size: .9em;
    background: #f59906;
    color: #FFFFFF;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    border-radius: 50%;
}

    div.asideInfoBox ul[menu] li[data-badge="0"]:after {
        display:none;
    }


/*////////////////////////////////////////////////////////////////*/

img.bannerImg {
    border:0;
    cursor:pointer;
    width:100%;
}

/*////////////////////////////////////////////////////////////////*/


span.icon_user {
    display:inline-block;
    width:34px;
    height:22px;
    background:url(images/icon/user-16.png) no-repeat center center;
}
span.icon_lock {
    display:inline-block;
    width:34px;
    height:22px;
    background:url(images/icon/lock-16.png) no-repeat center center;
}
span.icon_email {
    display:inline-block;
    width:34px;
    height:22px;
    background:url(images/icon/email-16.png) no-repeat center center;
}


/*////////////////////////////////////////////////////////////////*/

#logingPanels {
    padding:20px 0;
    text-align:right;
}

#logingPanels section {
display:block;
max-width:500px;
margin:10px auto;
background-color: white;
-o-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
-ms-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}

.showHand {
cursor:pointer;
}

.section-title {
 display:block;
 min-height:30px;
  padding: 15px 20px;
  background-color: white;
  font-weight: normal;
  font-size:21px;
  line-height:30px;  
  text-align:right;
  color: #13a89e;
}

.section-action {
  display:block;
  height:30px;
  padding: 15px 20px 30px 20px;
  background-color: white;
  text-align:left; 
  color:#13a89e;
}

.section-action input
{
    margin-right:10px;
}

.input-group{
  display:block;
  padding: 20px 15px 20px 20px;
  -moz-transition: border-left-color 0.5s, box-shadow 0.5s, background-color 0.5s;
  -o-transition: border-left-color 0.5s, box-shadow 0.5s, background-color 0.5s;
  -webkit-transition: border-left-color 0.5s, box-shadow 0.5s, background-color 0.5s;
  transition: border-left-color 0.5s, box-shadow 0.5s, background-color 0.5s;
  border: 1px solid transparent,0px;
  border-right: 5px solid transparent;
  background-color: #ffffff;
}

.input-group[active]{
  display:block;
  padding: 20px 15px 20px 20px;
  -moz-transition: border-left-color 0.5s, box-shadow 0.5s, background-color 0.5s;
  -o-transition: border-left-color 0.5s, box-shadow 0.5s, background-color 0.5s;
  -webkit-transition: border-left-color 0.5s, box-shadow 0.5s, background-color 0.5s;
  transition: border-left-color 0.5s, box-shadow 0.5s, background-color 0.5s;
  border: 1px solid #e0e0e0,0px;
  border-right: 5px solid transparent;
  border-right-color: #13a89e;
  background-color: #f0f0f0;
  white-space:nowrap;
}

.input-group-mini
{
    padding: 5px 15px 0 15px;
}

.form-description {
  display:block;
  padding: 5px 20px;
  font-size: 12px;
  line-height: 20px;
  color: #7A7A7A;
  background-color: #ffffff;
  margin:0 ;
  white-space:normal;
}

.form-lable {
  display:inline-block;
  width:34px;
  height: 22px;
  vertical-align:central;
  padding: 6px 0;
  font-size: 20px;
  line-height: 22px;
  color: #cccccc;
  vertical-align: middle;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-left:0;
  border-radius: 0;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  margin:0 ;
}

.form-control {
  display:inline-block;
  width:calc(100% - 60px);
  height: 22px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 22px;
  color: #555555;
  vertical-align: middle;
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-right:0;
  border-radius: 0;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  margin:0 0 0 0;
  -webkit-appearance: none;
}
.form-control:focus {
  outline: 0;
}
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
  cursor: not-allowed;
  background-color: #eeeeee;
}
textarea.form-control {
  height: auto;
}
.form-control[error] {
    background: #FFFFFF url(images/error.png) no-repeat 2% center;
}
.textbox {
    width:calc(100% - 35px);
    border-left: 1px solid #cccccc;
}

.form-control-desc
{
    display:inline-block;
    height: 22px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 22px;
    color: #555555;
    vertical-align: middle;
}

/*////////////////////////////////////////////////////////////////*/

span.rating {
  display: inline-block;
  empty-cells:show;
  padding:0;
  margin:0;
  border:0;
  line-height:16px;
  padding-left: 85px;
  height:16px;
  white-space:nowrap;
  background: url(images/rating.png) no-repeat left 0;
}
span.ratingSelector {
  display: inline-block;
  width:80px;
  height:16px;
  empty-cells:show;
  padding:0;
  margin:9px 5px;
  border:0;
  background: url(images/rating.png) no-repeat left 0;
}
span.s0 {
    background: url(images/rating.png) no-repeat left 0;
}
span.s1 {
    background: url(images/rating.png) no-repeat left -16px;
}
span.s2 {
    background: url(images/rating.png) no-repeat left -32px;
}
span.s3 {
    background: url(images/rating.png) no-repeat left -48px;
}
span.s4 {
    background: url(images/rating.png) no-repeat left -64px;
}
span.s5 {
    background: url(images/rating.png) no-repeat left -80px;
}
span.s6 {
    background: url(images/rating.png) no-repeat left -96px;
}
span.s7 {
    background: url(images/rating.png) no-repeat left -112px;
}
span.s8 {
    background: url(images/rating.png) no-repeat left -128px;
}
span.s9 {
    background: url(images/rating.png) no-repeat left -144px;
}
span.s10 {
    background: url(images/rating.png) no-repeat left -160px;
}

span.ratingSelector rate
{
    display: block;
    width:16px;
    height:16px;
    margin:0;
    padding:0;
    border:0;
    float:left;
    cursor:pointer;
    empty-cells:show;
}


/*////////////////////////////////////////////////////////////////*/

#customGrid sortkey
{
    display:inline-block;
    width:9px;
    height:11px;
    padding:0;    
    margin:4px 5px -1px 0;
}
#customGrid sortkey up
{
    display:block;
    width:9px;
    height:5px;
    background: url(  'images/sort_up.png' ) no-repeat center center;
    cursor: pointer;
    margin-bottom:1px;
  	opacity: .4;
	filter: alpha(opacity=50);    
}
#customGrid sortkey up:hover
{
  	opacity: 1;
	filter: alpha(opacity=100);
}
#customGrid sortkey down
{
    display:block;
    width:9px;
    height:5px;
    background: url(  'images/sort_down.png' ) no-repeat center center;
    cursor:pointer;
  	opacity: .4;
	filter: alpha(opacity=50);    
}
#customGrid sortkey down:hover
{
  	opacity: 1;
	filter: alpha(opacity=100);
}


@media screen and (min-width: 1281px) {
    #customGrid {
        clear: both;
        display: block;
        width: calc(100% - 10px);
        margin: 0 0 10px 10px;
        background: #FFFFFF;
        -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    }
}

@media screen and (max-width: 1280px) {
    #customGrid {
        clear: both;
        display: block;
        width: 100%;
        margin: 0 0 10px 0;
        background: #FFFFFF;
        -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    }
}



#customGrid header
{
    display:block;
    border-bottom:10px solid #cccaca; 
}

#customGrid header ccol
{
    display:none;
}

#customGrid crow
{
    display:block;
    position:relative;
    padding:5px;
    margin:0;
    color:#666666;
	font-size: 16px;
	vertical-align: middle;
	line-height: 30px;
    border-bottom:1px solid #dcdcdc;
}

#customGrid crow:hover 
{
    color:#000000;    
}

#customGrid crow:hover > ccol
{
    background:#f0f0f0;  
}

#customGrid crow:hover > ccol[c0]
{
}
#customGrid crow:hover > ccol[c0] a
{
    color:#000000;    
}
#customGrid crow:hover > ccol[c1]
{
}
#customGrid crow:hover > ccol[c2]
{
    /*visibility:visible;*/
}
#customGrid crow ccol
{
    vertical-align:top;
    overflow:hidden;
    empty-cells:show;
}

#customGrid crow ccol[c0]
{
    display:block;
    position:relative;
	overflow:hidden;
	padding:30px 70px 10px 10px;
}
#customGrid crow ccol[c0] img
{
    display:block;
    position: absolute;
    border:1px solid #FFFFFF;
    border-radius:50%;
    width:48px;
    height:48px;
    right:10px;
    top:5px;
    cursor:pointer;
}

#customGrid crow ccol[c0] span.postType_event
{
    display:block;
    position: absolute;
    background:url(images/clock.png) no-repeat center center;
    background-size:24px 24px;
    width:40px;
    height:40px;
    padding:0;
    left:0px;
    top:0px;
}
#customGrid crow ccol[c0] span.postStatus_active
{
    display:block;
    cursor:pointer;
    color:#000000;
    font-weight:bold;
}
#customGrid crow ccol[c0] span.postStatus_new,
#customGrid crow ccol[c0] span.postStatus_updated
{
    display:block;
    cursor:pointer;
    color:#13a89e;
    font-weight:bold;
}
#customGrid crow ccol[c0] span.postStatus_inactive,
#customGrid crow ccol[c0] span.postStatus_hidden
{
    display:block;
    cursor:pointer;
    color:#999999;
}



#customGrid crow ccol[c0]:hover > span.message_name
{
}
#customGrid crow ccol[c0] span.message_name
{
    display: inline-block;
    color: #cccaca;
    font-size: 12px;
    cursor: pointer;
}
#customGrid crow ccol[c0] span.message_name:hover
{
    text-decoration:underline;
}

#customGrid crow ccol[c0] span.messageType_na
{
    display:block;
    position: absolute;
    background:#D3D3D3;
    width:5px;
    height:40px;
    left:0px;
    top:0px;
}
#customGrid crow ccol[c0] span.messageType_reply
{
    display:block;
    position: absolute;
    background:#15B100;
    width:5px;
    height:40px;
    left:0px;
    top:0px;
}
#customGrid crow ccol[c0] span.messageStatus_new
{
    display:block;
    cursor:pointer;
    color:#13a89e;
    font-weight:bold;
}
#customGrid crow ccol[c0] span.messageStatus_read,
#customGrid crow ccol[c0] span.messageStatus_sent
{
    display:block;
    cursor:pointer;
    color:#999999;
}

#customGrid crow ccol[c0] a
{
    text-decoration:none;
	color:#3d4752;
}
#customGrid crow ccol[c0] a:hover
{
	color:#1579cd;
    text-decoration:underline;
}
#customGrid crow ccol[c1]
{
    display: inline-block;
    position: absolute;
    white-space: nowrap;
    font-size: 11px;
    top: 10px;
    right: 75px;
}
#customGrid crow ccol[c2]
{
    display: block;
    position: absolute;
    overflow: hidden;
    white-space: nowrap;
    top: 10px;
    left: 20px;
}

#customGrid footer
{
    display:block;
    height:22px;
    white-space:nowrap;
    margin:3px;
    color:#878585;
	font-size: 8pt;
	vertical-align: middle;
	padding:15px 10px;
	line-height: 22px;  
    direction:ltr;  
}

    #customGrid footer a {
        text-decoration: none;
    }

#customGrid footer pagingFirst,
#customGrid footer a[pagingFirst]
{
    display:block;
    width:16px;
    height:20px;
    background: url('images/paging_first.png') no-repeat center center;
    border:1px solid transparent;
    margin:1px;
	vertical-align: middle;
	cursor:pointer;
	float:left;
}
#customGrid footer pagingFirst:hover,
#customGrid footer a[pagingFirst]:hover
{
    background-color:#ffffff;
    border:1px solid Gray;
}
#customGrid footer pagingPrevious,
#customGrid footer a[pagingPrevious]
{
    display:block;
    width:16px;
    height:20px;
    background: url('images/paging_previous.png') no-repeat center center;
    border:1px solid transparent;
    margin:1px;
	vertical-align: middle;
	cursor:pointer;
	float:left;
}
#customGrid footer pagingPrevious:hover,
#customGrid footer a[pagingPrevious]:hover
{
    background-color:#ffffff;
    border:1px solid Gray;
}
#customGrid footer pagingNext,
#customGrid footer a[pagingNext]
{
    display:block;
    width:16px;
    height:20px;
    background: url('images/paging_next.png') no-repeat center center;
    border:1px solid transparent;
    margin:1px;
	vertical-align: middle;
	cursor:pointer;
	float:left;
}
#customGrid footer pagingNext:hover,
#customGrid footer a[pagingNext]:hover
{
    background-color:#ffffff;
    border:1px solid Gray;
}
#customGrid footer pagingLast,
#customGrid footer a[pagingLast]
{
    display:block;
    width:16px;
    height:20px;
    background: url('images/paging_last.png') no-repeat center center;
    border:1px solid transparent;
    margin:1px;
	vertical-align: middle;
	cursor:pointer;
	float:left;
}
#customGrid footer pagingLast:hover,
#customGrid footer a[pagingLast]:hover
{
    background-color:#ffffff;
    border:1px solid Gray;
}
#customGrid footer pagingState
{
    display:block;
    min-width:20px;
    height:20px;
    border:1px solid transparent;
    white-space:nowrap;
    margin:1px;
    color:#474747;
	font-size: 8pt;
	vertical-align: middle;
	padding:0 5px;
	line-height: 20px;
	cursor:pointer;
	float:left;	
}
#customGrid footer pagingState:hover
{
    background:Gray;
    color:#ffffff;
}
#customGrid footer pagingRowCount
{
    display:block;
    min-width:20px;
    height:20px;
    border:1px solid transparent;
    white-space:nowrap;
    margin:1px;
    color:#474747;
	font-size: 8pt;
	vertical-align: middle;
	padding:0 5px;
	line-height: 20px;
	float:left;	
}

#customGrid footer pagingPage,
#customGrid footer a[pagingPage]
{
    display:block;
    min-width:10px;
    text-align: center;
    height:20px;
    border:1px solid transparent;
    white-space:nowrap;
    margin:1px;
    color:#474747;
	font-size: 8pt;
	vertical-align: middle;
	padding:0 5px;
	line-height: 20px;
	cursor:pointer;
	float:left;	
}
#customGrid footer pagingPage:hover,
#customGrid footer a[pagingPage]:hover
{
    border:1px solid Gray;
    color:#000000;
}

#customGrid footer pagingActive,
#customGrid footer a[pagingActive]
{
    display:block;
    background:Gray;
    min-width:10px;
    height:20px;
    border:1px solid transparent;
    white-space:nowrap;
    margin:1px;
    color:#FFFFFF;
	font-size: 8pt;
	vertical-align: middle;
	padding:0 5px;
	line-height: 20px;
	cursor:pointer;
	float:left;	
}




/*////////////////////////////////////////////////////////////////*/

.button_grid {
    display: inline-block;
    cursor: pointer;
    font-size: 11px;
    font-weight: bold;
    text-align: center;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border: 0;
    padding: 0;
    text-transform: uppercase;
    margin: 0 5px 0 0;
    text-decoration: none;
    color: #FFFFFF;
}

.grid_delete {
    background-image: url(images/icon/png40/trash_can_40.png);
    background-size:24px auto;
    background-repeat:no-repeat;
    background-position:center center;
    color:transparent;
    opacity:0.5;
}

.grid_delete:hover {
    background-size:32px auto;
    opacity:1;
}

.grid_edit {
    background-image: url(images/icon/png40/pencil_40.png);
    background-size:24px auto;
    background-repeat:no-repeat;
    background-position:center center;
    color:transparent;
    opacity:0.5;
}
.grid_edit:hover {
    background-size:32px auto;
    opacity:1;
}

.grid_info {    
    background-image: url(images/icon/png40/lightbulb_on_40.png);
    background-size:24px auto;
    background-repeat:no-repeat;
    background-position:center center;
    color:transparent;
    opacity:0.5;
}
.grid_info:hover {
    background-size:32px auto;
    opacity:1;
}


/*////////////////////////////////////////////////////////////////*/


a.button_big{
    display:inline-block;
    position:relative;
	color:#6c6c6c;	
	border:solid 1px #cfcfcf;	
	font-size:14px;
	line-height: 35px;    
    background-color: #F0F0F0;
    background-image: -moz-linear-gradient(center top , #FFFFFF 0pt, #E0E0E0 100%);
	background-image: -webkit-linear-gradient(top,white 0,#E0E0E0 100%);
	background-image: linear-gradient(to bottom,white 0,#E0E0E0 100%);
    border-color: #CCCCCC #CCCCCC #AAAAAA;
    box-shadow: 0 0 1px #FFFFFF inset;
    text-shadow: 0 1px 0 #FFFFFF;
	border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
	padding:0 10px 0 30px;
	text-decoration:none;
    margin:5px 5px 5px 5px;
}
a.button_big:hover{
	box-shadow:0 1px 0 #FFFFFF inset, 0 1px 3px rgba(0, 0, 0, 0.08);
}
a.button_big:active{
    background-image: -moz-linear-gradient(center bottom , #FFFFFF 0pt, #E0E0E0 100%);
	background-image: -webkit-linear-gradient(bottom,white 0,#E0E0E0 100%);
	background-image: linear-gradient(to bottom,white 0,#E0E0E0 100%);	
}
a.button_big iconsweet {
    position:absolute;
    padding:0 10px 0 0;
    font-size:18px;
    left:10px;
    top:-3px;
}
a.button_big:hover iconsweet{
	color:#478CFE;
}



a.btn_grey{
	background-color: #787b83;
    background-image: -moz-linear-gradient(center top , #787b83 0pt, #44474e 100%);
	background-image: -webkit-linear-gradient(top,#787b83 0,#44474e 100%);
	background-image: linear-gradient(to bottom,#787b83 0,#44474e 100%);	
    border-color: #7a828d #7a828d #3d4046;
    box-shadow: 0 1px 0 rgba(152, 155, 160, 0.45) inset;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.45);
	color:#f0f0f0;
}
a.btn_grey:hover{
	box-shadow:0 1px 0 #a1a5af inset, 0 1px 3px rgba(0, 0, 0, 0.08);
}
a.btn_grey:hover iconsweet{
	color:#000;
}
a.btn_grey:active{
	background-image: -moz-linear-gradient(center bottom , #787b83 0pt, #44474e 100%);
	background-image: -webkit-linear-gradient(bottom,#787b83 0,#44474e 100%);
	background-image: linear-gradient(to bottom,#787b83 0,#44474e 100%);	
}
a.btn_grey iconsweet{
	color:#f0f0f0;
}

a.button_big1 span{
	font-size:18px;
	color:#606060;
	float:left;
	margin-top:-3px;
	padding-right:10px;
}




.greyishBtn {
    background: url(images/button/greishBtn.png) repeat-x scroll 0 0 transparent;
    border: 1px solid #4F5A68;
    color: #FFFFFF;
}
.whitishBtn {
    background: url(images/button/whiteBtn.png) repeat-x scroll 0 0 transparent;
    border: 1px solid #cccccc;
    color: #555555;
	text-shadow: 0 1px 0 #FFFFFF;
	box-shadow: 0 1px 0 0 #FFFFFF;
	-webkit-box-shadow:0 1px 0 0 #FFFFFF;
}
.bluishBtn {
    background: url(images/button/bluishBtn.png) repeat-x scroll 0 0 transparent;
    border: 1px solid #3079ed;
    color: #FFFFFF;
}
.redishBtn {
    background: url(images/button/redishBtn.png) repeat-x scroll 0 0 transparent;
    border: 1px solid #d22a15;
    color: #FFFFFF;
}
.greenishBtn {
    background: url(images/button/greenishBtn.png) repeat-x scroll 0 0 transparent;
    border: 1px solid #4ba301;
    color: #FFFFFF;
}
.magentaBtn {
    background: url(images/button/magentaBtn.png) repeat-x scroll 0 0 transparent;
    border: 1px solid #ba4c6f;
    color: #FFFFFF;
}
.yellowBtn {
    background: url(images/button/yellow_btn.png) repeat-x scroll 0 0 transparent;
    border: 1px solid #d5ad23;
    color: #FFFFFF;
}
.dblueBtn {
    background: url(images/button/dark_blue_btn.png) repeat-x scroll 0 0 transparent;
    border: 1px solid #41597c;
    color: #FFFFFF;
}

.button_small {
    display:inline-block;
    cursor: pointer;
    font-size: 11px;
    font-weight: bold;
    line-height: 16px;
    padding: 3px 16px 3px;
    text-transform: uppercase;
	border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
	margin:2px 5px 2px 0;
	text-decoration:none;
}
.button_small:hover{
background-position:bottom;
}
.button_small:active{
background-position:center;
}


/*=Message Bar=*/
div.msgbar{
    display:block;
	padding:10px 8px;
	cursor:pointer;
    line-height:30px;
    font-size:15px;
	margin:0px 0 10px 10px;
}
div.msgbar p{
	display:inline;
	margin:0 0 0 10px;
	line-height:inherit;
}
.content_pad .msgbar:first-child{
	margin-top:0;
}
/*Info*/
div.msgbar.msg_Info{
	background:#96bcca;
	border-right:5px solid #4e646c;
	color:#4e646c;
}
/*Success*/
div.msgbar.msg_Success{
	background:#adca96;
	border-right:5px solid #647458;
	color:#647458;
}
/*Error*/
div.msgbar.msg_Error{
	background:#FCB4B4;
	border-right:5px solid #E70000;
	color:#FFFFFF;
}
/*Alert*/
div.msgbar.msg_Alert{
	background:#FCB4B4;
	border-right:5px solid #ad7373;
	color:#785151;
}



/*////////////////////////////////////////////////////////////////*/

#pagingCtrl {
    clear:both;
    display:block;
    vertical-align:middle;
    white-space:normal;
    line-height:36px;
    text-align:center;
    color:#666666;
    padding:10px;    
    overflow:hidden;
    margin: 0;
    direction:ltr;
}

    #pagingCtrl a {
        text-decoration: none;
    }

#pagingCtrl pagingFirst,
#pagingCtrl a[pagingFirst]
{
    display:inline-block;
    width:32px;
    height:36px;
    line-height:36px;
    background: url('images/paging_first.png') no-repeat center center;
    border:0;
    margin:0;
	vertical-align: middle;
	cursor:pointer;
}
#pagingCtrl pagingFirst:hover,
#pagingCtrl a[pagingFirst]:hover
{
    background-color:#FFFFFF;
}
#pagingCtrl pagingPrevious,
#pagingCtrl a[pagingPrevious]
{
    display:inline-block;
    width:32px;
    height:36px;
    line-height:36px;
    background: url('images/paging_previous.png') no-repeat center center;
    border:0;
    margin:0;
	vertical-align: middle;
	cursor:pointer;
}
#pagingCtrl pagingPrevious:hover,
#pagingCtrl a[pagingPrevious]:hover
{
    background-color:#FFFFFF;
}
#pagingCtrl pagingNext,
#pagingCtrl a[pagingNext]
{
    display:inline-block;
    width:32px;
    height:36px;
    line-height:36px;
    background: url('images/paging_next.png') no-repeat center center;
    border:0;
    margin:0;
	vertical-align: middle;
	cursor:pointer;
}
#pagingCtrl pagingNext:hover,
#pagingCtrl a[pagingNext]:hover
{
    background-color:#FFFFFF;
}
#pagingCtrl pagingLast,
#pagingCtrl a[pagingLast]
{
    display:inline-block;
    width:32px;
    height:36px;
    line-height:36px;
    background: url('images/paging_last.png') no-repeat center center;
    border:0;
    margin:0;
	vertical-align: middle;
	cursor:pointer;
}
#pagingCtrl pagingLast:hover,
#pagingCtrl a[pagingLast]:hover
{
    background-color:#FFFFFF;
}
#pagingCtrl pagingState,
#pagingCtrl a[pagingState]
{
    display:inline-block;
    height:36px;
    white-space:nowrap;
    margin:1px;
    color:#474747;
	font-size: 12pt;
    text-align: center;
	vertical-align: middle;
	padding:0 5px;
	line-height: 36px;
	cursor:pointer;
}
#pagingCtrl pagingState:hover,
#pagingCtrl a[pagingState]:hover
{
    background:Gray;
    color:#ffffff;
}
#pagingCtrl pagingRowCount
{
    display:none;
    height:36px;
    white-space:nowrap;
    border:0;
    margin:0;
    color:#474747;
	font-size: 12pt;
    text-align: center;
	vertical-align: middle;
	padding:0 5px;
	line-height: 36px;
}

#pagingCtrl pagingPage,
#pagingCtrl a[pagingPage]
{
    display:inline-block;
    height:36px;
    white-space:nowrap;
    border:0;
    margin:0;
    color:#000000;
	font-size: 12pt;
    font-weight:bold;
    text-align: center;
	vertical-align: middle;
	padding:0 10px;
	line-height: 36px;
	cursor:pointer;
}
#pagingCtrl pagingPage:hover,
#pagingCtrl a[pagingPage]:hover
{
    background:#FFFFFF;
    color:#000000;
}

#pagingCtrl pagingActive,
#pagingCtrl a[pagingActive]
{
    display:inline-block;
    height:36px;
    white-space:nowrap;
    border:0;
    margin:0;
    color:#FFFFFF;
    background: #13a89e;
	font-size: 12pt;
    text-align: center;
	vertical-align: middle;
	padding:0 5px;
	line-height: 36px;
	cursor:pointer;
}


/*////////////////////////////////////////////////////////////////*/

select[country] {
    background-repeat: no-repeat ;
    background-position:right 5px center;
    padding-right:30px;
}
select[country]:focus {
    background-repeat: no-repeat ;
    background-position:right 5px center;
    padding-right:30px;
}


/*////////////////////////////////////////////////////////////////*/

input[type="checkbox"] {
    display:none;
}
input[type="checkbox"] + label  {
    display:inline-block;
    width:20px;
    height:20px;
    margin:0;
    vertical-align:middle;
    cursor:pointer;
	border: 1px solid #cccccc;
}
input[type="checkbox"]:checked + label {
    background:url('images/checked.png') no-repeat center center;
}
input[type="checkbox"]:disabled  {
    display:inline-block;
    width:20px;
    height:20px;
    vertical-align:middle;
}


/*////////////////////////////////////////////////////////////////*/

a.autoLink
{
    text-decoration: none;
	color:#D09A3A;
}
a.autoLink:hover
{
	color:#000000;
    text-decoration:underline;
}

@media screen and (min-width: 641px) {
    img.autoLink {
        display: block;
        width: calc(100% - 20px);
        border: solid 10px #ffffff;
        float: right;
        margin: 25px 0px 10px 20px;
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
        transition: box-shadow 0.2s ease-in-out;
        transition: transform .5s ease;
        transform: scale(1);
        transform-origin: 0 100%;
    }

        img.autoLink:hover {
            transform: scale(1.0);
            z-index: 100;
            transform-origin: 0 100%;
        }

    .lineBreak {
        display: block;
        clear: both;
        empty-cells: show;
        height: 10px;
    }

    .postFooter {
        display: block;
        clear: both;
        color: #636363;
        font-size: 13px;
        padding: 0 30px;
        border-top: 5px solid #bfbfbf;
        margin: 30px -30px;
    }

    figure.autoLink
    {
        display: block;
        width: calc(100% - 20px);
        border: solid 10px #ffffff;
        float: right;
        margin: 25px 0px 10px 20px;
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
        transition: box-shadow 0.2s ease-in-out;
        transition: transform .5s ease;
        transform: scale(1);
        transform-origin: 0 100%;
        background:#FFFFFF;
    }
        figure.autoLink:hover {
           /* transform: scale(1.0);
            z-index: 100;
            transform-origin: 0 100%;*/
        }

    figure img
    {
        display:block;
        width:100%;
    }

    figcaption
    {
        line-height:20px;
        padding-top: 10px;
        font-size:15px;
        color:#636363;
        text-align: center;
    }
}

@media screen and (max-width: 1280px) {
    img.autoLink {
        display: block;
        width: calc(100% - 20px);
        float: left;
        border: solid 10px #ffffff;
        margin: 0px 0px;
        margin-top: 0px;
        margin-bottom: 20px;
        -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
        -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    }

    .lineBreak {
        display: block;
        clear: both;
        empty-cells: show;
        height: 10px;
    }

    .postFooter {
        display: block;
        clear: both;
        color: #636363;
        font-size: 13px;
        padding: 0 30px;
        border-top: 5px solid #bfbfbf;
        margin: 30px -30px;
    }

    figure.autoLink
    {
        display: block;
        width: calc(100% - 20px);
        border: solid 10px #ffffff;
        float: right;
        margin: 0px 0px;
        margin-top: 0px;
        margin-bottom: 20px;
        box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
        background:#FFFFFF;
    }

    figure img
    {
        display:block;
        width:100%;
    }

    figcaption
    {
        text-align: center;
        padding-top: 10px;
        line-height:20px;
        font-size:15px;
        color:#636363;
    }
}

/*////////////////////////////////////////////////////////////////*/

@media screen and (min-width: 1281px) {
    #dashboardA {
        display: block;
        width: 600px;
        vertical-align: top;
        float: right;
    }

        #dashboardA h1 {
            display: block;
            font-size: 15px;
            line-height: 30px;
            padding: 10px 20px;
            color: #13a89e;
            border:0;
            margin: 0 0 10px 10px;
            background: rgba(235,235,235,0.5);
        }

    div.PostItemA {
        display: block;
        position: relative;
        border:0;
        padding: 0 0 10px 0;
        margin: 0 0 10px 10px;
        background: rgba(235,235,235,0.5);
    }
}

@media screen and (max-width: 1280px) {
    #dashboardA {
        display: block;
    }

        #dashboardA h1 {
            display: block;
            font-size: 15px;
            line-height: 30px;
            padding: 10px 20px;
            color: #13a89e;
            border:0;
            margin: 0 0 10px 0;
            background: rgba(235,235,235,0.5);
        }

    div.PostItemA {
        display: block;
        position: relative;
        border:0;
        padding: 0 0 10px 0;
        margin: 0 0 10px 0;
        background: rgba(235,235,235,0.5);
    }
}


    div.PostItemA:hover > span.opinionCtrl[id*="opinionCtrl_1_"]
    {
        display:block;
    }

    div.PostItemA span.opinionCtrl[id*="opinionCtrl_1_"]
    {
        display:block;
        position:absolute;
        top:70px;
        right:30px;
    }

    div.PostItemA h3:hover > span.opinionCtrl[id*="opinionCtrl_2_"]
    {
        display:block;
    }    

    div.PostItemA span.opinionCtrl[id*="opinionCtrl_2_"]
    {
        display:block;
        position:absolute;
        top:10px;
        left:0px;
    }

div.PostItemA:last-child {
    border-bottom:0;
}

div.PostItemA h2 {
    display: none;
    position: absolute;
    z-index: 20;
    left: 0px;
    top: -5px;
    font-size: 14px;
    height: 35px;
    line-height: 25px;
    text-align: left;
    padding: 15px 20px 0 65px;
    color: #13a89e;
    cursor: pointer;
    margin: 0;
}
div.PostItemA h2:hover{
    color:#000000;
}


div.PostItemA h3{
    display:block;
    position:relative;
    font-size:12px;
    height:20px;
    line-height:20px;
    margin:10px 20px 0 20px;
    padding:10px;
    color:#999999;
    border-top:1px dotted #13a89e;
    vertical-align:middle;
}
div.PostItemA h3 a{
    color:#999999;
    text-decoration:none;
}
div.PostItemA h3 a:hover{
    color:#000000;
    text-decoration:underline;
}

div.PostItemA img[user] {
    display: block;
    position: absolute;
    top: 20px;
    left: 20px;
    width: 48px;
    border: 5px solid rgba(255,255,255,0.25);
    border-radius: 50%;
}

    div.PostItemA img[post] {
        display: block;
        border: 0;
        width: 100%;
        max-width: 590px;
        object-fit: cover;
        margin:0 auto;
        padding:0;
        vertical-align: top;
        /* filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");*/ 
        /* filter: gray;  */
        /* -webkit-filter: grayscale(100%);*/
    }

    div.PostItemA img[user-comment] {
        display: inline-block;
        width: 16px;
        /*position:absolute;
        top:8px;
        right:5px;*/
        border:1px solid #FFFFFF;
        border-radius:50%;
        margin-left:10px;
        vertical-align:middle;
    }

    div.PostItemA div {
        display:block;
        border:0;
        padding:0 10px;
        vertical-align:top;
    }

        div.PostItemA div a[title] {
            display: block;
            font-size: 18px;
            line-height: 30px;
            padding: 20px 20px 0 20px;
            color: #13a89e;
            text-decoration: none;
            font-weight: bold;
        }

    div.PostItemA div a[title]:hover {
        text-decoration:underline;
    }

    div.PostItemA div span[detail] {
        display:block;
        font-size:18px;
        color:#000000;
        padding:20px;
    }

        div.PostItemA div span[time] {
            line-height:20px;
            font-size:13px;
            color:#999999;
            text-decoration:none;
            padding:0 20px 0 0;
        }

        div.PostItemA span[comment] {
            display:block;
            line-height:20px;
            font-size:15px;
            color:#13a89e;
            text-decoration:none;
            margin:0 30px;
            padding:10px 0 20px 25px;
        }





@media screen and (min-width: 1281px) {
    #dashboardB {
        display: block;
        width: 290px;
        vertical-align: top;
        float: right;
        padding: 10px 0;
        margin: 0 0 10px 10px;
        background: rgba(0,0,0,0.6);
    }

        #dashboardB h1 {
            display: block;
            font-size: 15px;
            line-height: 30px;
            padding: 0 20px;
            color: #eeeeee;
        }
}

@media screen and (max-width: 1280px) {
    #dashboardB {
        display: block;
        padding: 10px 0;
        margin: 10px 0;
        background: #13a89e;
    }

        #dashboardB h1 {
            display: block;
            font-size: 15px;
            line-height: 30px;
            padding: 0 20px;
            color: #eeeeee;
            margin:0;
        }
}

#dashboardB ul[info]{
    display:block;
    white-space:normal;
    color:#999999;
    font-size:11px;
    margin-bottom:10px;
    padding:0 0 10px 0;
    list-style:none;
    overflow:hidden;
}

#dashboardB ul[info] li{
    display:block;
    position:relative;
    min-height:45px;
    padding:10px 65px 10px 10px;
    border-right:5px solid transparent;
    border-bottom:1px dashed #373636;
    cursor:pointer;
    filter:grayscale();
}

#dashboardB ul[info] li:hover{
    background:#58544e;
    border-right:5px solid #50483e;
    border-bottom:1px dashed transparent;
    filter:initial;
}

#dashboardB ul[info] li:last-child{
    border-bottom:0;
}

#dashboardB ul[info] li img{
    display:block;
    position:absolute;
    width:45px;
    height:45px;
    border-radius:50%;
    right:10px;
    top:10px;
}

#dashboardB ul[info] li a[title]{
    display:block;
    color:#a5a5a5;
    font-size:12px;
    text-decoration:none;
    word-wrap:break-word;
}
#dashboardB ul[info] li a[title]:hover{
    color:#FFFFFF;
}


@media screen and (min-width: 1281px) {
    #dashboardC {
        display: block;
        width: 288px;
        vertical-align: top;
        float: left;
        padding: 10px 0;
        margin: 0 0 10px 0;
        border: 1px solid rgba(0,0,0,0.25);
    }
}

@media screen and (max-width: 1280px) {
    #dashboardC {
        display: block;
        padding: 10px 0;
        margin: 0 0 10px 0;
    }
}


    #dashboardC h1 {
        display:block;
        font-size:15px;
        line-height:30px;
        padding:0 20px;
        color:#396E9E;
    }

    #dashboardC span[graphcover]
    {
        display:block;
        height:250px;
    }

        #dashboardC span[graphcover] img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

    #dashboardC span[visitcount] {
        display: inline-block;
        line-height: 25px;
        font-size: 12px;
        color: #396E9E;
        padding: 5px 10px;
        background: #EEEEEE;
        margin: 0 30px;
        border-radius: 15px;
    }

#dashboardC span[keywordcloud]{
    display:block;
    white-space:normal;
    color:#999999;
    font-size:14px;
    margin:10px 0;
    border-top:2px solid #eeeeee;
    padding:10px 30px;    
}

#dashboardC a[tag]{
    display:inline-block;
    white-space:normal;
    line-height:25px;    
    color:#FFFFFF;
    background:#13a89e;
    padding:5px;
    font-size:14px;
    margin:0 0 5px 5px;
    text-decoration:none;
    border-radius: 15px;
}
#dashboardC a[tag]:hover {
    text-decoration:underline;
}

/*////////////////////////////////////////////////////////////////*/


slideshow{
    display:block;
    position: relative;
    margin: 0;
    height:100%;
}

@media screen and (min-width: 1281px) {
    slideshow figure {
        display: none;
        position: relative;
        margin: 0;
        height: 100%;
        overflow: hidden;
        cursor: pointer;
    }
}

@media screen and (max-width: 1280px) {
    slideshow figure {
        display: none;
        position: relative;
        margin: 0;
        height: 100%;
        overflow: hidden;
        cursor: pointer;
    }
}


slideshow figure[show="show"]
{
    display:block;
}

slideshow img{
  display:block;
  width:100%;
  height:100%;
  object-fit: cover;
  overflow: hidden;
  filter:contrast(110%);
  z-index:0;
}

slideshow figcaption {
    position: absolute;
    top: 25%;
    right: 0;
    left: 0;
    color: #fff;
    font-weight: bold;
    padding: 0 10% 0 20%;
    text-align: right;
    font-size: 30px;
    text-shadow: 2px 2px #000000;
    line-height:40px;
}
slideshow:hover figure figcaption{
  transition: opacity .5s;
  opacity: 1;
  filter:initial;
}
slideshow figdesc{
    position: absolute;
    bottom: 10%;
    right: 0;
    color: #fff;
    text-align: right;
    text-shadow: 1px 1px #000000;
    backdrop-filter: blur(1px);
    font-size: 21px;
    padding: 0 10px;
    margin: 0 10% 0 10%;
    border-right: 5px solid #13a89e;
}



/*////////////////////////////////////////////////////////////////*/


#mapPopup
{
	position: fixed;
	display: block;
	z-index: 2000;
	background: #FFFFFF;
	background: linear-gradient(top, #dbdada 10%, #FFFFFF 90%);
	background: -webkit-linear-gradient(top, #dbdada 10%, #FFFFFF 90%);
	background: -moz-linear-gradient(top, #dbdada 10%, #FFFFFF 90%);
	background: -ms-linear-gradient(top, #dbdada 10%, #FFFFFF 90%);
	background: -o-linear-gradient(top, #dbdada 10%, #FFFFFF 90%);	
	top: 0;
	right: 50px;
	bottom: 0;
	left: 50px;
	margin: auto;
	height: 70%;
	padding: 30px 5px 5px 5px;
	text-align: left;
	border: 1px solid #d7d7d7;
	font-size: 10pt;
	font-weight: bold;
    min-width:150px;
    width:70%;
	color: #112406;
	-moz-box-shadow: 0 0 15px #888;
    -webkit-box-shadow: 0 0 15px #888;
    box-shadow: 0 0 15px #888;
    overflow:hidden;
}

#mapPopup iframe
{
    display:block;
    border:0;
    margin:0;
    padding:0;
    width:100%;
    height:100%;    
    overflow:hidden;
}

#mapPopup span[close]
{
	position: absolute;
    z-index: 2010;
	display: block;
	width: 12px;
	height: 12px;
	top: 10px;
	left: 10px;
	background: url(  'images/closeKey.png' ) no-repeat center center;
	cursor: pointer;
}
#mapPopup span[close]:hover
{
	background: url(  'images/closeKey_over.png' ) no-repeat center center;
}

/*////////////////////////////////////////////////////////////////*/

div.helpTip
{
    color:#396E9E;
}

#moreImageList
{
    display:block;
    overflow:hidden;
    list-style:none;
    list-style-type:none;
    background:#EEEEEE;
    margin:-5px 0 0 0;
    padding:10px;    
}

#moreImageList li {
    display:inline-block;
    position:relative;
    margin:0 15px 15px 0;
    border:1px solid #999999;
    vertical-align:top;
}

#moreImageList li img
{
    display:block;
    width:128px;
    border:5px solid #FFFFFF;
}

#moreImageList li delete
{
    display:block;
    position:absolute;
    top:-5px;
    left:-5px;
    cursor:pointer;
    z-index:10;
    width:24px;
    height:24px;
    background:#FF2D2D url(images/closeKeyW.png) no-repeat center center;
    border-radius:50%
}

#moreImageList li delete:hover
{
    top:-8px;
    left:-8px;
    width:30px;
    height:30px;
    background:#000000 url(images/closeKeyW.png) no-repeat center center;
}


/*////////////////////////////////////////////////////////////////*/

#PopupMenu
{
	display: none;
	position: absolute;
	width: 120px;
	text-align: left;
	left: 0px;
	top: 0px;
	z-index: 650;
	padding: 5px 1px 10px 1px;
	background: #F2F2F2;
	border: 1px solid #666666;
	-moz-box-shadow: 3px 3px 3px #333;
	-webkit-box-shadow: 3px 3px 3px #333;
}

#PopupMenu span
{
	display: block;
	font-size: 9pt;
	line-height: 20px;
	color: #666666;
	text-decoration: none;
	vertical-align: middle;
	width: 110px;
	height: 20px;
	white-space: nowrap;
	padding: 0px 5px;
    cursor:pointer;
}
#PopupMenu span:hover
{
	color: #FFFFFF;
	background: #666666;
}

#PopupMenu hr
{
    border: 0;
    background: #515c71;
    height: 1px;
    width: 100%;
}


/*////////////////////////////////////////////////////////////////*/

@media screen and (min-width: 1281px) {
    div[usersView] {
        display: block;
        border-top: 5px solid #cccaca;
        margin: 0 0 0 10px;
        padding: 10px 10px 0 0;
        background: #FFFFFF;
        text-align:center;
    }
}

@media screen and (max-width: 1280px) {
    div[usersView] {
        display: block;
        border-top: 5px solid #cccaca;
        margin: 0;
        padding: 10px 10px 0 0;
        background: #FFFFFF;
        text-align:center;
    }
}


div[userView]
{
    display:inline-block;
    position:relative;
    width:calc(20% - 10px);
    min-width:128px;
    margin:0 0 10px 10px;
    vertical-align: top;
    white-space: normal;
    color: #666666;
    padding: 0 0 10px 0;
    background: #FFFFFF;
}


div[userView] span[userImage]
{
    display:block;
}

div[userView] span[userImage] img
{
    display:block;
    width:100%;
    border-radius: 50%
}

div[userView] a[userFullName]
{
    display: block;
    text-align:center;
    font-size: 14px;
    line-height: 25px;
    padding: 10px 5px;
    font-weight: bold;
    color: #13a89e;
    text-decoration: none;
}
div[userView] a[userFullName]:hover
{
    color:#000000;
}

div[userView] span[userAction]
{
    display: block;
    text-align:center;
}


div[userView] span[userAction] span[friend]{
    height:40px;
    line-height: 40px;
    color:#FFFFFF;
    padding:0 5px;
    font-size:11px;
    margin:0;
}


div[userView] span[userAction] span[sendmessage]{
    color:transparent;
    background:#13a89e url(images/mail.png) no-repeat center center;
    background-size:22px auto;
    width:42px;
    height:40px;
    line-height:40px;    
    padding:0;
    font-size:12px;
    margin:0;
    white-space:nowrap;
}
div[userView] span[userAction] span[sendmessage]:hover {
    background-color:#575757;
}


.cssControl[recheck] {
    outline:0;
    background:yellow;
    color:red;
}

/*////////////////////////////////////////////////////////////////*/

span.shareKey
{
    display:block;
    background:#FFFFFF;
    float:left;
    width: 50px;
    height:22px;
    line-height:24px;
    border-radius: 2px;
    padding:0 7px;
    margin-right:5px;
    color:#396E9E;
    font-size:9px;
    border:1px solid #D3D3D3;
    cursor:pointer;
}
span.shareKey:hover
{
    border:1px solid #c3c3c3;
    color:#2d5a82;
}
span.shareKey i
{
    font-size:16px;
    padding-right:5px;
    vertical-align:middle;
}


#EUCookieLawAsk {
    display: block;
    position: fixed;
    z-index: 500;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 100px 20px;
    background: rgba(255,255,255,0.95);
    border-top: 20px solid #13a89e;
    font-size: 16px;
    -webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.75);
    backdrop-filter: blur(2px);
}
    #EUCookieLawAsk a {
        display: inline-block;
        color: #000000;
        font-size: 16px;
        text-decoration: none;
        line-height: 50px;
    }
    #EUCookieLawAsk span {
        display: inline-block;
        text-decoration: none;
        line-height: 50px;
        font-size: 18px;
        font-weight: bold;
        padding: 0 20px;
        margin: 0 20px;
        background: #13a89e;
        color: #FFFFFF;
        cursor: pointer;
        border-radius: 50px;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
        box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.50);
    }

    #EUCookieLawAsk span:hover {
        box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
    }


    farsicontactcard {
    display: block;
    direction: ltr;
    text-align: left;
}

    farsicontactcard span {
    display: block;
}

        farsicontactcard span[vcard="first_Name"],
        farsicontactcard span[vcard="website"],
        farsicontactcard span[vcard="email"] {
    display: none;
}