LOADING...

Preview

Pen ID
Unlock Campus Themeforest adv

 

Code


  Clock phone




CSS
.accordion input {
	display: none;
}
.box {
	position: relative;
	background: black;
    transition: all .15s ease-in-out;
}


header.box {
	z-index: 100;
	cursor: initial;
}

.box-title {
	width: calc(100% - 40px);
	height: 75px;
        line-height: 57px;
	padding: 0 20px;
	display: inline-block;
	cursor: pointer;
	-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;
}

.box-content {
	width: calc(100% - 40px);
	padding: 15px 45px;
	font-size: 16px;
	color: white;
	display: none;
}
.box-close {
	position: absolute;
	height: 64px;
	width: 100%;
	top: 0;
	left: 0;
	cursor: pointer;
	display: none;
}

.box::before {
    content: '';
 position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    pointer-events: none;
border-top: 1px solid #222;
    border-bottom: 1px solid #222;
}

input:checked + .box {
	height: auto;
	margin: 16px 0;
    box-shadow: 0 0 6px rgba(0,0,0,.16),0 6px 12px rgba(0,0,0,.32);
}
input:checked + .box .box-title {
	border-bottom: 1px solid rgba(0,0,0,.18);
}
input:checked + .box .box-content,
input:checked + .box .box-close {
	display: inline-block;
}
.arrows section .box-title {
	padding-left: 44px;
	width: calc(100% - 64px);
}
.arrows section .box-title:before {
	position: absolute;
	display: block;
	content: '\203a';
	font-size: 28px;
        left: 22px;
        top: 28px;
	transition: transform .15s ease-in-out;
	color: white;
}
input:checked + section.box .box-title:before {
	transform: rotate(90deg);
}

.colorAccordionMail {
color: #979797;
}

.box-title {
	color: white;
	font-size: 20px;
}

.containerPhoneClock {
 margin-top: -15%;
margin-bottom: 10%
}

#htmlAccordions {
  margin-top: 400px;
}
Term
Wed, 12/27/2017 - 07:03

Related Codes

Pen ID
Pen ID
Pen ID
Square Adv