@charset "utf-8";
/* Fonts */
@font-face{
	font-family:MainFont;
	src:url("../Webfonts/MyriadWeb.TTF");
}
@font-face{
	font-family:MainFontBold;
	src:url("../Webfonts/MyriadWeb.TTF");
}
@font-face{
	font-family:MyriadWeb;
	src:url(../Webfonts/MyriadWeb.TTF);
}
@font-face{
	font-family: Aller;
	src:url(../Webfonts/aller.ttf);
}
/*Main Scheme*/
* {
	margin: 0px;
	padding: 0px;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
body{
	font-family:MainFont;
}
/*Headings & Links*/
a{
	text-decoration: none;
	transition: ease all 0.3s;
    colo:white
}
a:hover{
    color:var(--HighLight)
}
h1,h1 a{
	font-family: MainFontBold;
	line-height:1.5
}
h1 a:hover{
	color:var(--highlight);
}
h2,h2 a{
	font-family: MainFontBold;
	color:var(--MainText);
    line-height:1.5
}
h2 a:hover{
	color:var(--highlight);
}
h3,h3 a{
	font-family: MainFontBold;
	color:var(--MainText);
    line-height:1.5
}
h3 a:hover{
	color:var(--highlight);
}
h4,h4 a{
	font-family: MainFontBold;
	color:var(--SecondColor);
    line-height:1.5
}
h4 a:hover{
	color:var(--ThirdColor);
}
h5,h5 a{
	color:var(--ThirdColor)
}
p{
	text-align:justify;
	margin:10px 8px;
    line-height:1.7
}
header{
	position:relative;
    z-index:2;
}
main{
    position:relative;
    z-index:1
}
section{
	
}
/*REWC*/
#adver{
	color:#ff4b48;
	font-size: 14pt;
	font-weight: bold;
}
#login{
	width: 300px;
	min-height: 450px;
	margin: 100px auto;
	padding-top:10px;
	border: 1px solid #999;
	border-radius: 6px;
	text-align: center; 
}
#login img{
    width:270px;
	margin:10px auto;
}
#login p{
	text-align: center;
	padding-top: 20px;
}
.AdverMessage{
	height: 60px;
}
.iMessage{
	width: 70%;
	display: inline-block;
	text-align:left;
}
.ResaltedSection{
	padding: 20px 0 10px 0;
	background-color: #F9F9F9;
	border: 1px solid #B6B6B6;
	border-radius: 4px;
}
.FunctionsList{
	list-style:none;
}
.FunctionsList li{
	width:100%;
	height:38px;
	margin:2px 5px;
	display:block;
}
.FunctionsList li a{
	color:#222;			
}
.FunctionsList li a:hover{
		color:dimgrey;
}
.FunctionButtonLeft{
	width:38px;
	height:38px;
	background:#FF4B48;
	border-top-left-radius:4px;
	border-bottom-left-radius: 4px;
	display:inline-block;
	float:left;
}
.FunctionButtonLeft button{
	background:none;
	border:none;
	width:100%;
	padding-top:7px;
	cursor:pointer;
}
.FunctionButtonLeft button i{
	color:white;
}
.DataList{
	width:80%;
	height:38px;
	padding:10px 0 0 5px;
	display:inline-block;
	background:#E9E9E9;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
	vertical-align: middle;
}
.DataList:hover{
	background:#CACACA;
}
.FunctionsList a{
	padding:7px 0;
}
.ItemList{
	width:100%;
	height:38px;
	border-radius:4px;
	background:#288DC1;
	padding-top:8px;
}
.ItemListItem{
	width:100%;
	min-height:40px;
	margin:1px 0;
	border-radius:4px;
	background:#E9E9E9;
	vertical-align:top;
}
#ULlist{
    list-style:none
}
.ItemListItemUL{
	width:100%;
	min-height:40px;
	margin:1px 0;
	border-radius:4px;
	background:#E9E9E9;
	vertical-align:top;
}
.ItemList > div{
	color:white;
	font-weight:bold;
}
.ItemNro{
	min-width:5%;
	display:inline-block;
}
.ItemName{
	min-width:20%;
	display:inline-block;
}
.ItemNameLong{
	min-width:30%;
	max-width:30%;
	display:inline-block;
}
.ItemAuthor{
	min-width:20%;
	display:inline-block;
}
.ItemEmail{
	min-width:25%;
	display:inline-block;
}
.ItemSummary{
	min-width:40%;
	display:inline-block;
	text-align:left;
}
.ItemCreaddate{
	min-width:20%;
	display:inline-block;
}
.ItemCateg{
	min-width:20%;
	display:inline-block;
}
.ItemContents{
	min-width:10%;
	display:inline-block
}
.ItemLevel{
	min-width:15%;
	display:inline-block;
}
.ItemFunc{
	height:38px;
	min-width:15%;
	display:inline-block;
}
#ItemFunctions{
	display:inline-block;
}
.FuncButtonRed{
	width:35px;
	height:35px;
	margin:2px;
	background:#FF4B48;
	border:none;
	border-radius:4px;
	cursor: pointer;
	color:white
}
.FuncButtonBlue{
	width:35px;
	height:35px;
	margin:2px;
	background:#5F96D7;
	border:none;
	border-radius:4px;
	cursor: pointer;
}
.FuncButtonGreen{
	width:35px;
	height:35px;
	margin:2px;
	background:#90D676;
	border:none;
	border-radius:4px;
	cursor: pointer;
}
.FuncButtonGreen > i,.FuncButtonBlue > i,.FuncButtonRed > i{
    color:white
}
.FuncButtonNoBG{
	width:35px;
	height:35px;
	margin:2px;
	background:none;
	border:none;
	border-radius:4px;
	cursor: pointer;
}
.FuncButtonRedBig{
	background-color: #ff4b48;
	border: none;
	border-radius: 4px;
	color:white;
	padding: 8px 18px;
	font-size: 14pt;
	margin: 4px 2px;
	cursor:pointer;
}
.EditBlogImg{
	width:450px;
	height:150px;
	border-radius:6px;
	text-align:center;
	padding:15px 0 50px;
	margin:0 auto;
}
.FuncButtonRedBig:hover{
	background-color: #ff6f6c;
}
.EditBlogImg button{
	display:none;
}
.EditBlogImg:hover .FuncButtonRedBig{
	display: inline-block;
}
/*Form Elements*/
.InputL{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 90%;
	height: 35px;
	padding: 5px;
	margin: 4px;
	border:none;
	border-bottom: 1px solid #9F9F9F;
	font-family:Aller;
}
.InputR{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 90%;
	height: 35px;
	padding: 5px;
	margin: 4px;
	border: 1px solid #9F9F9F;
	border-radius: 4px;
}
.InputRH{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width:40%;
	height: 35px;
	padding: 5px;
	margin: 4px;
	border: 1px solid #9F9F9F;
	border-radius: 4px;
}
.InputRS{
	width: 90%;
	height: 35px;
	padding: 5px;
	margin: 4px;
	border: 1px solid #9F9F9F;
	border-radius: 4px;
}
.InputRCR{
	width:35px;
	height:35px;
	margin:4px;
	border-radius:4px;
}
.TextAreaR{
	width:90%;
	height: 160px;
	padding: 5px;
	margin: 4px;
	border: 1px solid #9F9F9F;
	border-radius: 4px;
	font-family: MyriadWeb;
}
.TextAreaRL{
	width:90%;
	height: 80px;
	padding: 5px;
	margin: 4px;
	border: 1px solid #9F9F9F;
	border-radius: 4px;
	font-family: MyriadWeb;
}
.SaveDataG{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: #65d870;
	border: none;
	border-radius: 4px;
	color:white;
	padding: 8px 18px;
	font-size: 14pt;
	margin: 4px 2px;
	cursor:pointer;
	transition:ease all 0.3s;
}
.SaveDataG:hover{
	background-color: #7EEB89;
}
.SaveDataB{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: #5F96D7;
	border: none;
	border-radius: 4px;
	color:white;
	padding: 8px 18px;
	font-size: 14pt;
	margin: 4px 2px;
	cursor:pointer;
	transition:ease all 0.3s;
}
.SaveDataB:hover{
	background-color: #7DACDF;
}
.ResetDataR{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: #ff4b48;
	border: none;
	border-radius: 4px;
	color:white;
	padding: 8px 18px;
	font-size: 14pt;
	margin: 4px 2px;
	cursor:pointer;
	transition:ease all 0.3s;
    line-height:normal
}
.ResetDataR:hover{
	background-color: #ff6f6c;
}
#LogOut{
	width: 30%;
	text-align: right;
	display: inline-block;
	color:white
}
#LogOut a{
	padding: 5px 7px;
	background: #D05B5D;
	color:white;
	border-radius: 4px;
	font-weight: bold;
}
#LogOut a:hover{
	background:#EF3134;
}
/*Structure*/
.container{
	width: 100%;
	margin:0 auto;
	text-align: center;
}
.containerREWC{
	width: 100%;
	padding:30px 0;
	margin:0 auto;
	text-align: center;
	border-bottom:1px solid #999
}
.containerREWC > h2{
	margin:0 auto 30px auto
}
.containerREWC > a{
	color:#7C7C7C;
}
.containerREWC > a:hover{
	color:#3596d9;
}
.Block{
	width:290px;
	min-height:290px;
	vertical-align:top;
	text-align:center;
	display:inline-block;
}
.BlockMini{
	width:290px;
	display:inline-block;
	vertical-align:top;
	text-align:center;
}
.BlockStretch{
	width:100%;
	vertical-align:top;
	text-align:center;
}
.BlockThird{
	width:100%;
	min-height:230px;
	vertical-align:top;
	text-align:center;
}
.BlockSingle{
	vertical-align:top;
	text-align:center
}
.BlockDouble{
	vertical-align:top;
	text-align:center;
}
.BlockHalf{
	width:290px;
	min-width: 290px;
	display:block;
	vertical-align:top;
	margin:0 auto
}
.BlockSquare{
	width:290px;
	min-width: 290px;
	display:block;
	vertical-align:top;
	margin:0 auto
}
.BlockLeft{
	width:45%;
	display:inline-block
}
.BlockRight{
	width:45%;
	display:inline-block
}
.BlockRows{
	margin:20px auto 10px auto;
	display:flex;
	flex-direction:row;
	align-content:flex-end;
	flex-wrap: wrap;
	justify-content:space-between;
}
.BlockDef{
    width:290px;
    vertical-align:top;
    margin:0 auto
}
/*Universal Structure*/
#topbar{
	vertical-align:bottom;
	height:50px;
	padding-top: 3px;
}
#topbar i{
	margin: 0;
}
.recom{
	text-align: left;
	font-size: 9pt;
	color:#999;
	line-height:11pt
}
.error{
	color:#ff4b48;
	font-size: 14pt;
	font-weight: bold;
}
.division{
	height: 30px;
	margin-bottom: 30px;
	border-bottom: 1px solid #ADADAD;
}

.jqte_editor ul,ol{
	padding-left:25px;
	text-align:left;
}

.ScrolltoTop{
	width:100px; 
	height:130px;
	padding:10px; 
	text-align:center;
	font-weight: bold;
	position:fixed;
	bottom:30px;
	right:-10px;
	display:none;
    z-index:10;
    color:var(--HighLight)
}
.photobg{
	text-align: center;
	vertical-align: top;
	background-position:center center;
	background-repeat: no-repeat;
  	background-size:cover
}

#FooterLeft,#FooterRight{
	vertical-align:top;
	text-align:center;
	margin:0 auto
}
#map{
	margin: 0 auto;
	padding:10px 0;
}
#map iframe{
	width:100%;
	height: 270px;
	border-radius:6px;
}
.serp-preview {
    width:600px;
	height:150px;
	background-color:white;
	padding:15px 30px;
	margin:10px 0;
	display:inline-block;
	vertical-align:top;
	background-image:url(../Images/serp-bg.jpg);
	background-repeat: no-repeat;
	background-position:center 90px;
}
.serp-arrow{
      border-bottom-color: rgb(0, 102, 33);
      border-bottom-style: solid;
      border-bottom-width: 0px;
      border-left-color: rgba(0, 0, 0, 0);
      border-left-style: solid;
      border-left-width: 4px;
      border-right-color: rgba(0, 0, 0, 0);
      border-right-style: solid;
      border-right-width: 4px;
      border-top-color: rgb(0, 102, 33);
      border-top-style: solid;
      border-top-width: 5px;
      color: rgb(128, 128, 128);
      cursor: default;
      font-family: arial, sans-serif;
      font-size: 11px;
      font-weight: bold;
      height: 0px;
      position: absolute;
      line-height: 27px;
      margin-left: 3px;
      margin-top: 6px;
      text-align: center;
      user-select: none;
      visibility: visible;
      white-space: nowrap;
      width: 0px;
    }
#serp-title{
      color: rgb(26, 13, 171);
      cursor: pointer;
      font-family: arial, sans-serif;
      font-size: 18px;
      font-weight: normal;
      line-height: 21.6px;
      text-align: left;
      text-decoration: none;
      visibility: visible;
      white-space: nowrap;
    }
#serp-title:hover{
	text-decoration:underline;
}
#serp-url{
      color: rgb(0, 102, 33);
      font-family: arial, sans-serif;
      font-size: 14px;
      font-style: normal;
      font-weight: normal;
      line-height: 16px;
      text-align: left;
      visibility: visible;
      white-space: nowrap;
}
#serp-description{
      color: rgb(84, 84, 84);
      font-family: arial, sans-serif;
      font-size: 13px;
      font-weight: normal;
      line-height: 18.2px;
      text-align: left;
      visibility: visible;
      word-wrap: break-word;
}
.ogp-image{
	width:100px;
	height:100px;
	vertical-align:top;
	text-align:center;
	margin:10px 10px 0 15px;
	display:inline-block;
	overflow:hidden;
	border-radius:6px;
}
.ogp-image img{
	width:100px;
	border-radius:6px;
	transition:all 0.6s ease;
}
.ogp-image img:hover{
	transform:scale(1.07);
}
div[class*='reorder_']{
    width:116px;
    height:32px;
	padding:4px 10px 10px;
	margin:7px 10px 7px auto;
	background:#5087D1;
	color:white !important;
	border-radius:6px;
    text-align:center;
    cursor:pointer
}
div[class*='reorder_']:hover{
	background:#6E9BD9;
}
div[id*='ReorderHelper_']{
	margin:10px;
	padding:10px;
	background:#D3D3D3;
	color:black;
	text-align:left
}
/*Notifications*/
.Overlay{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: rgba(0,0,0,0.7);
}
.ModalNot{
    width:400px;
    height:200px;
    position: fixed;
    top: 50%; 
    left: 50%;
	padding:15px;
	margin-top: -100px;
    margin-left: -200px;
    background-color:white;
    border-radius:6px;
    text-align:center;
    z-index: 11;
}
.ModalNot > i{
	animation:bounceIn .3s;
	animation-delay:.2s;
	font-size:65px;
	color:#64d470;
	margin:-24px auto 0
}
.Notif{
	margin-top:20px;
	padding-top:20px;
	border-top:1px solid #BBBBBB;
	font-size:17px;
	font-weight:bold;
	color:#4C4C4C;
	line-height:20pt
}
#TabBar{
	margin-bottom:40px;
	text-align:left;
	border-bottom:1px solid rgba(177,177,177,1.00);
}
#TabBar a{
	display:inline-block;
	padding:5px 10px;
	margin-bottom:-1px;
	background-color:white;
	border-left:1px solid rgba(177,177,177,1.00);
	border-top:1px solid rgba(177,177,177,1.00);
	border-right:1px solid rgba(177,177,177,1.00);
	cursor:pointer
}
#BlogCats{
    display:flex;
    flex-direction:row
}
#BlogCats > a{
    padding:7px 15px;
    background-color:#5F96D7;
    color:white;
    border-radius:4px
}
#BlogCats > a:hover{
    background-color:#7DACDF;
}
.BCActive{
    background-color:#2961A4 !important
}
#BlogCats > div,#BlogCats > a{
    margin:5px 6px
}
#LastList{
	border-bottom: 1px solid #D0D0D0
}
.TableHeader{
	display:flex;
	flex-direction:row;
	background-color:#ebebeb;
	border:1px solid #D0D0D0
}
.TableRow{
	display:flex;
	flex-direction:row;
	background-color:white;
	border-left:1px solid #D0D0D0;
	border-right:1px solid #D0D0D0;
	transition:ease all .3s
}
.TableRow:nth-child(odd){
    background-color:#F8F8F8
}
.TableRow:hover{
	background-color:#ebebeb
}
.TCell{
	display:inline-block;
	margin:10px auto;
	font-weight:bold
}
.TData{
	display:inline-block;
	margin:10px auto;
}
.TDataFunc{
    display:inline-block;
	margin:0 auto;
}
.TData > a{
	color:var(--MainColor);
	transition:ease all .3s
}
.TData > a:hover{
	color:var(--MainMidColor)
}
/*Tablet*/
@media (min-width: 600px){
	.container{
		width: 600px
	}
	.containerREWC{
		width:600px
	}
	.Block{
		width:290px;
	}
	.BlockStretch{
		width:50%;
		display:inline-block;
	}
	.BlockHalf{
		min-width:50%;
		width:50%;
		display: inline-block;
	}
	.BlockSquare{
		width:100%;	
	}
	.BlockSingle{
        display:inline-block;
        width:50%;
		text-align:center;
	}
	.BlockDouble{
        display:inline-block;
        width:50%;
		text-align:center;
	}
	.BlockDoubleH{
		width: 290px;
	}
	.BlockLeft{
		width:45%
	}
	.BlockRight{
		width:45%
	}
	.BlockLeftThumb{
		display:inline-block;
		width:30%;
		text-align:center;
		vertical-align:top
	}
	.BlockRightPara{
		display:inline-block;
		width:70%;
		text-align:left;
		vertical-align:top
	}
    .BlockDef{
        width:100%;
    }
	#FooterLeft{
        display:inline-block;
        width:50%;
		text-align:left
	}
	#FooterRight{
        display:inline-block;
        width:50%;
		text-align:right
	}
	.button05{
		width:40%
	}
	.photobg{
		
	}
	
	
}
/*PC*/
@media (min-width: 900px){
	.photobg{
		
	}
	.container{
		width: 990px;
		text-align: center;
	}
	.containerREWC{
		width: 990px;
		text-align: center
	}
	.BlockSquare{
		display:inline-block;
		width:50%
	}
	.BlockStretch{
		width:330px;
		display:inline-block;
	}
	.BlockThird{
		width:330px;
		display:inline-block;
	}
	.BlockSingle{
		width:300px;
		display:inline-block;
		text-align:center;
	}
	.BlockDouble{
		display:inline-block;
		text-align:center;
        width:690px
	}
	.BlockMini{
		width:240px;
	}
    .BlockDef{
        display:inline-block;
        width:50%;
    }
	.button05{
		width:98%;
	}
	
}
