body {font-family: "merriweather",serif;min-width: 320px;overflow:hidden;text-align:justify;hyphens:auto;}

h1, h2, h3, h4, h5, h6 { color:black;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif; }
strong, .blog a, .container a:hover { color: #ff0051 !important;  }

.navigation {font-size: 14px;margin-top: 4px}
.navigation .list span {font-size: 15px;}
.navigation a {text-decoration: none;color: #000;font-size: 14px;}
.navigation a:hover {text-decoration: underline;color:#0d0031;}
.navigation .list {list-style-type: none;padding: 0;margin: 0;width:280px;}
.navigation ul li:first-child {padding-left:0;}
.navigation li {border-right: 1px solid #252d40;display:block;float:left;padding-left:10px;padding-right:10px; }
.navigation li:hover {color: white;}
.navigation li:hover span {margin-left:3px;}

.mainBody{background-color: #FFF;height: 100%;width: 100%;position: absolute;left: 0;right: 0;top: 0;bottom: 0;z-index: 2;overflow: auto;-webkit-transition:0.5s linear all;transition:0.5s linear all;}
.mainBody.slide { left: 200px;overflow:hidden;}

header {background-color: #FFF;height:60px;position: absolute;top:0;width:100%;z-index: 13;min-width:300px;}
header .content {padding-left: 15px;padding-right: 15px;padding-top:15px;}
header .content div {float:left;}
header .content .icon-home {font-size: 35px;top: 12px;left: 67px;color:#098597;position:absolute;display: none;}
header .content .social {float:right;}
header .content .social a {text-decoration: none;color:#000000;}
header .content .social span {font-size: 24px;margin-left: 13px;margin-top: 5px;cursor:pointer}
header .content .social .icon-linkedin {color:#0097bd;}
header .content .social .icon-twitter {color:#5dd7fc;}

header .sliderContainer {background-color: #e4e4e4;width:100%;height:4px;position:absolute;bottom:0;left:0;}
header .sliderContainer .slider {width:140px;height:4px;background-color: #252d40;position: relative;}

.container {margin-top :60px;position: absolute;top: 0;left: 0;bottom: 0;width: 100%;overflow: scroll;overflow-x:hidden;}
.container .content {font-size:15px;padding: 15px;padding-bottom: 3em;max-width: 550px;margin:auto;padding-top: 0;}

/*about header*/
.about .aboutHead .titleContent{margin-top: 3em;float:right;}

/*pages section*/
.about .content {margin-top: -32px;}
.about .content a {color:black;}
.about .content {margin-top: -32px;}
.about .content hr {border: 1px solid black;border-top: 0;margin-top: 0;}
.about .content ul {list-style-type: none;padding: 0;}
.about .content .update-info {color: rgb(29, 27, 27);font-size: 13px;margin-top: 2em;}

.about .social {margin-top:1em;border-bottom:1px solid #252d40;margin-bottom:1.5em;padding-bottom:1em;display: block;width: 100%;float:left;}
.about .social ul {text-decoration: none;list-style: none;}
.about .social ul li {float: left;list-style: none;margin-right:12px;}
.about .social ul li a {    text-decoration: none;}

.blog {float:left;padding-bottom:1em;display: block}

.blog h4 {margin-bottom:0;}

.blog article {border-bottom:1px dotted #252d40;padding-top: 0.5em;margin-bottom:1em;}
.blog article:hover {cursor:pointer;}
.blog article .content {padding:0;margin:0;padding-top: 0;}
.blog article .content p {margin-top:0.3em;}
.blog article h3 {color:#252d40}
.blog article img {max-width: 100%;border-radius: 15px;}

.portfolio .content {}
.pageHeader {background-color: #f6f6f6;color: #252d40;font-style: italic;font-size: 12px;text-align: center;padding: 20px;}

.content.squared {max-width:950px;padding-top: 15px;}
.squared .repeat {color:#000000;text-decoration:none;display: block;}
.squared .item {max-width: 520px;float:none;margin:auto;margin-bottom: 15px;display:block;cursor:pointer;}
.squared .item .imgContainer {margin:5px;width:auto;position: relative;}
.squared img {width:100%;opacity:1;}
.squared .item .imgContainer .overlay {position:absolute;left:0;top: 50%;margin-top: -31px;text-align: center;width: 100%;opacity:0;}
.squared .item .imgContainer .overlay h2 {font-size: 28px;margin: 0;color:#252d40;}
.squared .item img, .squared .item .overlay {-webkit-transition: opacity 0.7s ease-out;-moz-transition: opacity 0.7s ease-out;-ms-transition: opacity 0.7s ease-out;-o-transition: opacity 0.7s ease-out;transition: opacity 0.7s ease-out;}
.squared .item:hover img{opacity:0;}
.squared .item:hover .overlay{opacity:1;}
.squared .item .description {margin-left:5px;margin-right:5px;}
.squared .item h3 {color:#252d40;margin: 0;text-align: left;}
.squared .item p {font-size:12px;margin: 0;color:#504a4a}

.itemView .content .imgContainer {width:auto;text-align: center;padding-top: 15px;}
.itemView .content .imgContainer img {width: 100%;}
.itemView .content .description h3 {margin: 0;font-size: 20px;margin-top: 0.5em;}
.itemView .content .description h4 {margin: 0;margin-bottom: 11px;font-size: 13px;font-style:italic;font-weight: normal;}
.itemView .content .description p {margin-top: 8px;margin-bottom: 8px;}
.itemView .content .description a {color:#000000;}
.itemView .content .description img {max-height: 300px;max-width: 100%;padding-top: 0.5em;padding-bottom: 0.5em;}

.page404 .content h3 {color:#252d40;}
.page404 .content .paragraph {font-size:14px;}
.page404 .content .shout {margin-top: 7px;margin-bottom: 13px;}
.page404 .content a {color:#000000;font-style:italic;}

@media only screen and (min-width: 1000px) {
	.squared .item {width: 50%;float:left;min-width:330px;margin-bottom: 15px;min-width: 330px;}
}

@media only screen and (max-width: 450px) {
	header .content .social {
		display: none;
	}
}

.oopen-logo-area {
    margin-left: 0;
    margin-bottom: 3rem;
    padding-top: 6px;
    color: var(--accentColor, #602EEF);
    text-align: center;
}

.oopen-logo {
    width: 150px;
    /*transform-origin: 0 45%;
    animation: 3s running ease-in-out 64ms slam;
    animation-fill-mode: forwards;
    transform: perspective(120px) rotateY(
-30deg);
    filter: blur(1px);*/
    overflow: hidden;
}
/*

@keyframes slam {
    0% {
        transform: perspective(120px) rotateY(-30deg);
        filter: blur(1px)
    }
    20% {
        filter: blur(0px)
    }
    40% {
        transform: perspective(180px) rotateY(10deg)
    }
    60% {
        transform: rotateY(-10deg)
    }
    70% {
        transform: rotateY(6deg)
    }
    80% {
        transform: rotateY(-3deg)
    }
    100% {
        transform: perspective(180px) rotateY(0);
        filter: blur(0)
    }
}*/

.italic {font-style:italic;}
/*
background: -moz-linear-gradient(center top,#ffd200,#f1b328);
background: -webkit-gradient(linear,left top,left bottom,from(#ffd200),to(#f1b328));
background: -webkit-linear-gradient(#ffd200,#f1b328);
background: -ms-linear-gradient(#ffd200,#f1b328);
/* background: linear-gradient(#ffd200,#f1b328); */
