| Current Path : /home/gotzfrokfn/www/templates/gotz-tpl/less/ |
| Current File : /home/gotzfrokfn/www/templates/gotz-tpl/less/pages.less |
.block_history{
text-align: center;
overflow: hidden;
.date_history{
font-size: 36px;
line-height: 36px;
font-weight: bold;
}
.visible_text{
width: 60%;
margin: 0 auto;
}
h1.history_title{
position: relative;
padding-bottom: 3.3em;
&:before{
content: "";
width: 0px;
position: absolute;
left: -1px;
right: 0;
margin: auto;
text-align: center;
bottom: 2.6em;
height: 0px;
border-style: solid;
border-width: 9px 9px 0 9px;
border-color: @mainColor transparent transparent transparent;
}
&:after{
content: "";
height: 2.6em;
width: 1px;
background: @colorBlack;
position: absolute;
left: 0;
right: 0;
top: 2.2em;
margin: auto;
text-align: center;
}
}
ul{
li{
list-style: none;
position: relative;
overflow: hidden;
margin: 40px 0;
&:before{
position: absolute;
content: "";
width: 1px;
height: 100%;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
z-index: 0;
background: #000;
}
&:after{
position: absolute;
content: "";
width: 11px;
height: 10px;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
z-index: 0;
background: @mainColor;
}
div.left_history{
width: 50%;
padding: 2em;
font-size: 18px;
line-height: 24px;
float: left;
text-align: left;
strong{
font-size: 36px;
line-height:36px;
display: block;
margin-bottom: 10px;
}
p{
margin-top: 44px;
}
div{
img{
width:200px;
height:200px;
.border(1px @colorBorder);
.borderRadius(50%);
@media (max-width: 768px){
margin-top: 25px;
}
@media (max-width: 590px){
width:150px;
height:150px;
margin-top: 55px;
}
@media (max-width:500px){
margin-top: 62px;
}
@media (max-width:450px){
width:100px;
height:100px;
margin-top: 155px;
}
@media (max-width:384px){
margin-top: 185px;
}
@media (max-width:350px){
width:60px;
height:60px;
margin-top: 250px;
}
}
}
}
div.right_history{
width: 50%;
padding: 2em;
font-size: 18px;
line-height: 24px;
float: right;
text-align: right;
strong{
font-size: 36px;
line-height:36px;
display: block;
margin-bottom: 10px;
}
p{
margin-top: 44px;
text-align: left;
}
img{
width:200px;
height:200px;
.border(1px @colorBorder);
.borderRadius(50%);
@media (max-width: 768px){
margin-top: 25px;
}
@media (max-width: 590px){
width:150px;
height:150px;
margin-top: 55px;
}
@media (max-width:500px){
margin-top: 62px;
}
@media (max-width:450px){
width:100px;
height:100px;
margin-top: 155px;
}
@media (max-width:384px){
margin-top: 185px;
}
@media (max-width:350px){
width:60px;
height:60px;
margin-top: 250px;
}
}
}
}
li.center_history{
&:after, &:before{
display: none;
}
}
}
}
.manager_content {
margin-bottom: 30px;
background: @colorWhite;
.block_manag{
position: relative;
height: 360px;
overflow: hidden;
.transition;
@media (max-width:1200px){
height: 292px;
}
@media (max-width:992px){
height: 216px;
}
@media (max-width:768px){
height:370px;
text-align: center;
}
&:hover{
.post_name{
bottom: 0;
.transition;
}
}
img{
position: absolute;
z-index: 1;
left: 0;
right: 0;
margin: auto;
}
.post_name{
text-align: center;
color: @colorWhite;
position: absolute;
bottom: -45px;
left: 0;
right: 0;
min-height: 100px;
width: 100%;
z-index: 2;
border-left: 9px solid @mainColor;
background: fade(@colorBlack, 80%);
.transition;
div{
padding: 20px 0;
h5{
color: @colorWhite;
padding: 0px 0;
margin: 0;
font-weight: bold;
}
}
p{
color: @colorWhite;
margin: 0;
padding: 0 ;
}
}
}
p {
padding: 10px 5px;
}
}
.service_textblock {
background: @BgBox;
padding: 10px;
.border(1px @colorBorder);
}
.service_box {
margin-bottom: 20px;
div {
float: left;
width: 90px;
height: 90px;
background-color: #F1F4F7;
text-align: center;
line-height: 90px;
font-size: 55px;
}
p {
margin-left: 110px;
margin-bottom: 0;
}
}
//--------------------------------------------Prising Table-----------------------------
.prising_table {
text-align: center;
margin-top: 30px;
.column_blue {
text-align: center;
position: relative;
background: #fff;
border: 1px solid #ccc;
width: 250px;
display: inline-block;
margin:0 15px 15px 0;
.transition(0.3s);
&:hover{
.transition(0.3s);
box-shadow: 0 0 10px #0074FF;
top: -15px;
}
ul {
list-style-type: none;
padding: 0;
margin: 0;
li {
padding: 15px 40px;
border: 1px solid #E8E8E8;
border-top: none;
color: #000;
font-size: 18px;
&.title-row {
background: #0074FF;
color: white;
font-family: 'Oswald', sans serif;
line-height: 24px;
background: white;
color: #0074FF;
border: none;
padding: 45px 20px 15px;
font-size: 28px;
text-shadow: 1px 1px 0px #0074ff;
font-weight: 600;
span {
width: 100%;
height: 30px;
background: #0074FF;
display: block;
position: absolute;
top: 0;
left: 0;
}
}
&.pricing-row {
background: #0074FF;
font-size: 24px;
border: none;
padding: 25px 35px 50px;
position: relative;
span.triggle {
content: '';
position: absolute;
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-bottom: 20px solid white;
top: 0;
left: 50%;
margin-left: -25px;
bottom: -1px;
}
span.h1, span.widget-title.style2 {
font-weight: 400;
text-transform: capitalize;
font-size: 24px;
line-height: 32px;
}
span.pt-price {
font-size: 55px;
line-height: 55px;
margin-top: 20px;
display: block;
font-weight: 700;
}
}
&.footer-row {
padding: 20px 0;
line-height: 13px;
.pt-btn {
background: #0074FF;
color: white;
line-height: 40px;
padding: 10px 25px;
border: 1px solid #0074FF;
text-shadow: 0 1px 0 #fff;
box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
&:hover {
background: white;
color: #0074FF;
text-shadow: 0 1px 0 #0074FF;
border: 2px solid #0074FF;
}
}
}
&.normal-row {
font-family: 'Quicksand' sans-serif;
font-size: 14px;
font-weight: 400;
}
}
}
}
.column_blue.active {
.title-row {
span {
background: #CCC;
}
}
.pricing-row {
background: #CCC;
border-bottom: 1px solid #E8E8E8;
span {
color: #0074FF;
}
}
}
}