@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Lato:400,300,700,900"); select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
input.input-block-level{
padding:20px;
}
.input-append input,
.input-prepend input,
.input-append select,
.input-prepend select,
.input-append .uneditable-input,
.input-prepend .uneditable-input {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.input-prepend .add-on:first-child,
.input-prepend .btn:first-child {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.input-append input,
.input-append select,
.input-append .uneditable-input {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.input-append input + .btn-group .btn:last-child,
.input-append select + .btn-group .btn:last-child,
.input-append .uneditable-input + .btn-group .btn:last-child {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.input-append .add-on:last-child,
.input-append .btn:last-child,
.input-append .btn-group:last-child > .dropdown-toggle {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.input-prepend.input-append input,
.input-prepend.input-append select,
.input-prepend.input-append .uneditable-input {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.input-prepend.input-append input + .btn-group .btn,
.input-prepend.input-append select + .btn-group .btn,
.input-prepend.input-append .uneditable-input + .btn-group .btn {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.input-prepend.input-append .add-on:first-child,
.input-prepend.input-append .btn:first-child {
margin-right: -1px;
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.input-prepend.input-append .add-on:last-child,
.input-prepend.input-append .btn:last-child {
margin-left: -1px;
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
outline: 0;
outline: thin dotted \9; }
input.search-query {
margin-bottom: 0;
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.form-search .input-append .search-query {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.form-search .input-append .btn {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.form-search .input-prepend .search-query {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.form-search .input-prepend .btn {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.table-bordered {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.dropdown-menu {
*border-right-width: 0;
*border-bottom-width: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.dropdown-submenu > .dropdown-menu {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
}
.dropup .dropdown-submenu > .dropdown-menu {
-webkit-border-radius: 0 0 0 0;
-moz-border-radius: 0 0 0 0;
border-radius: 0 0 0 0;
} .btn {
text-shadow: none;
background-image:none;
border-color: none;
border-bottom-color: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.btn {
outline:0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
a.btn,.btn:focus {
outline:0;
}
.btn-medium {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.btn-lg {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.btn-sm {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.btn-xs {
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.btn-default {
color: #333333;
background-color: #f8f8f8;
}
.btn-theme {
color:#fff;
}
.btn-theme:hover,.btn-theme:focus,.btn-theme:active{
color:#fff;
}
 body { -webkit-backface-visibility: hidden;
}
.animated {
-webkit-animation-duration: .5s;
-webkit-animation-timing-function: ease;
-webkit-animation-fill-mode: both;
-moz-animation-duration: .5s;
-moz-animation-timing-function: ease;
-moz-animation-fill-mode: both;
-o-animation-duration: .5s;
-o-animation-timing-function: ease;
-o-animation-fill-mode: both;  
-ms-animation-duration: .5s;
-ms-animation-timing-function: ease;
-ms-animation-fill-mode: both;
animation-duration: .5s;
animation-timing-function: ease;
animation-fill-mode: both;  
}
.animated.hinge {
-webkit-animation-duration: 2s;
-moz-animation-duration: 2s;
-o-animation-duration: 2s;
animation-duration: 2s;
}
@-webkit-keyframes flash {
0%, 50%, 100% {opacity: 1;}	
25%, 75% {opacity: 0;}
}
@-moz-keyframes flash {
0%, 50%, 100% {opacity: 1;}	
25%, 75% {opacity: 0;}
}
@-o-keyframes flash {
0%, 50%, 100% {opacity: 1;}	
25%, 75% {opacity: 0;}
}
@keyframes flash {
0%, 50%, 100% {opacity: 1;}	
25%, 75% {opacity: 0;}
}
.flash {
-webkit-animation-name: flash;
-moz-animation-name: flash;
-o-animation-name: flash;
animation-name: flash;
}
@-webkit-keyframes shake {
0%, 100% {-webkit-transform: translateX(0);}
10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);}
20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);}
}
@-moz-keyframes shake {
0%, 100% {-moz-transform: translateX(0);}
10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);}
20%, 40%, 60%, 80% {-moz-transform: translateX(10px);}
}
@-o-keyframes shake {
0%, 100% {-o-transform: translateX(0);}
10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);}
20%, 40%, 60%, 80% {-o-transform: translateX(10px);}
}
@keyframes shake {
0%, 100% {transform: translateX(0);}
10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
20%, 40%, 60%, 80% {transform: translateX(10px);}
}
.shake {
-webkit-animation-name: shake;
-moz-animation-name: shake;
-o-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes bounce {
0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}
40% {-webkit-transform: translateY(-30px);}
60% {-webkit-transform: translateY(-15px);}
}
@-moz-keyframes bounce {
0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
40% {-moz-transform: translateY(-30px);}
60% {-moz-transform: translateY(-15px);}
}
@-o-keyframes bounce {
0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
40% {-o-transform: translateY(-30px);}
60% {-o-transform: translateY(-15px);}
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
40% {transform: translateY(-30px);}
60% {transform: translateY(-15px);}
}
.bounce {
-webkit-animation-name: bounce;
-moz-animation-name: bounce;
-o-animation-name: bounce;
animation-name: bounce;
}
@-webkit-keyframes tada {
0% {-webkit-transform: scale(1);}	
10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);}
30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);}
40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);}
100% {-webkit-transform: scale(1) rotate(0);}
}
@-moz-keyframes tada {
0% {-moz-transform: scale(1);}	
10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);}
30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);}
40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);}
100% {-moz-transform: scale(1) rotate(0);}
}
@-o-keyframes tada {
0% {-o-transform: scale(1);}	
10%, 20% {-o-transform: scale(0.9) rotate(-3deg);}
30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);}
40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);}
100% {-o-transform: scale(1) rotate(0);}
}
@keyframes tada {
0% {transform: scale(1);}	
10%, 20% {transform: scale(0.9) rotate(-3deg);}
30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);}
40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);}
100% {transform: scale(1) rotate(0);}
}
.tada {
-webkit-animation-name: tada;
-moz-animation-name: tada;
-o-animation-name: tada;
animation-name: tada;
}
@-webkit-keyframes swing {
20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }
20% { -webkit-transform: rotate(15deg); }	
40% { -webkit-transform: rotate(-10deg); }
60% { -webkit-transform: rotate(5deg); }	
80% { -webkit-transform: rotate(-5deg); }	
100% { -webkit-transform: rotate(0deg); }
}
@-moz-keyframes swing {
20% { -moz-transform: rotate(15deg); }	
40% { -moz-transform: rotate(-10deg); }
60% { -moz-transform: rotate(5deg); }	
80% { -moz-transform: rotate(-5deg); }	
100% { -moz-transform: rotate(0deg); }
}
@-o-keyframes swing {
20% { -o-transform: rotate(15deg); }	
40% { -o-transform: rotate(-10deg); }
60% { -o-transform: rotate(5deg); }	
80% { -o-transform: rotate(-5deg); }	
100% { -o-transform: rotate(0deg); }
}
@keyframes swing {
20% { transform: rotate(15deg); }	
40% { transform: rotate(-10deg); }
60% { transform: rotate(5deg); }	
80% { transform: rotate(-5deg); }	
100% { transform: rotate(0deg); }
}
.swing {
-webkit-transform-origin: top center;
-moz-transform-origin: top center;
-o-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
-moz-animation-name: swing;
-o-animation-name: swing;
animation-name: swing;
} @-webkit-keyframes wobble {
0% { -webkit-transform: translateX(0%); }
15% { -webkit-transform: translateX(-25%) rotate(-5deg); }
30% { -webkit-transform: translateX(20%) rotate(3deg); }
45% { -webkit-transform: translateX(-15%) rotate(-3deg); }
60% { -webkit-transform: translateX(10%) rotate(2deg); }
75% { -webkit-transform: translateX(-5%) rotate(-1deg); }
100% { -webkit-transform: translateX(0%); }
}
@-moz-keyframes wobble {
0% { -moz-transform: translateX(0%); }
15% { -moz-transform: translateX(-25%) rotate(-5deg); }
30% { -moz-transform: translateX(20%) rotate(3deg); }
45% { -moz-transform: translateX(-15%) rotate(-3deg); }
60% { -moz-transform: translateX(10%) rotate(2deg); }
75% { -moz-transform: translateX(-5%) rotate(-1deg); }
100% { -moz-transform: translateX(0%); }
}
@-o-keyframes wobble {
0% { -o-transform: translateX(0%); }
15% { -o-transform: translateX(-25%) rotate(-5deg); }
30% { -o-transform: translateX(20%) rotate(3deg); }
45% { -o-transform: translateX(-15%) rotate(-3deg); }
60% { -o-transform: translateX(10%) rotate(2deg); }
75% { -o-transform: translateX(-5%) rotate(-1deg); }
100% { -o-transform: translateX(0%); }
}
@keyframes wobble {
0% { transform: translateX(0%); }
15% { transform: translateX(-25%) rotate(-5deg); }
30% { transform: translateX(20%) rotate(3deg); }
45% { transform: translateX(-15%) rotate(-3deg); }
60% { transform: translateX(10%) rotate(2deg); }
75% { transform: translateX(-5%) rotate(-1deg); }
100% { transform: translateX(0%); }
}
.wobble {
-webkit-animation-name: wobble;
-moz-animation-name: wobble;
-o-animation-name: wobble;
animation-name: wobble;
} @-webkit-keyframes pulse {
0% { -webkit-transform: scale(1); }	
50% { -webkit-transform: scale(1.1); }
100% { -webkit-transform: scale(1); }
}
@-moz-keyframes pulse {
0% { -moz-transform: scale(1); }	
50% { -moz-transform: scale(1.1); }
100% { -moz-transform: scale(1); }
}
@-o-keyframes pulse {
0% { -o-transform: scale(1); }	
50% { -o-transform: scale(1.1); }
100% { -o-transform: scale(1); }
}
@keyframes pulse {
0% { transform: scale(1); }	
50% { transform: scale(1.1); }
100% { transform: scale(1); }
}
.pulse {
-webkit-animation-name: pulse;
-moz-animation-name: pulse;
-o-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes flip {
0% {
-webkit-transform: perspective(400px) rotateY(0);
-webkit-animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);
-webkit-animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-webkit-animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) rotateY(360deg) scale(.95);
-webkit-animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px) scale(1);
-webkit-animation-timing-function: ease-in;
}
}
@-moz-keyframes flip {
0% {
-moz-transform: perspective(400px) rotateY(0);
-moz-animation-timing-function: ease-out;
}
40% {
-moz-transform: perspective(400px) translateZ(150px) rotateY(170deg);
-moz-animation-timing-function: ease-out;
}
50% {
-moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-moz-animation-timing-function: ease-in;
}
80% {
-moz-transform: perspective(400px) rotateY(360deg) scale(.95);
-moz-animation-timing-function: ease-in;
}
100% {
-moz-transform: perspective(400px) scale(1);
-moz-animation-timing-function: ease-in;
}
}
@-o-keyframes flip {
0% {
-o-transform: perspective(400px) rotateY(0);
-o-animation-timing-function: ease-out;
}
40% {
-o-transform: perspective(400px) translateZ(150px) rotateY(170deg);
-o-animation-timing-function: ease-out;
}
50% {
-o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-o-animation-timing-function: ease-in;
}
80% {
-o-transform: perspective(400px) rotateY(360deg) scale(.95);
-o-animation-timing-function: ease-in;
}
100% {
-o-transform: perspective(400px) scale(1);
-o-animation-timing-function: ease-in;
}
}
@keyframes flip {
0% {
transform: perspective(400px) rotateY(0);
animation-timing-function: ease-out;
}
40% {
transform: perspective(400px) translateZ(150px) rotateY(170deg);
animation-timing-function: ease-out;
}
50% {
transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
animation-timing-function: ease-in;
}
80% {
transform: perspective(400px) rotateY(360deg) scale(.95);
animation-timing-function: ease-in;
}
100% {
transform: perspective(400px) scale(1);
animation-timing-function: ease-in;
}
}
.flip {
-webkit-backface-visibility: visible !important;
-webkit-animation-name: flip;
-moz-backface-visibility: visible !important;
-moz-animation-name: flip;
-o-backface-visibility: visible !important;
-o-animation-name: flip;
backface-visibility: visible !important;
animation-name: flip;
}
@-webkit-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateX(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateX(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
@-moz-keyframes flipInX {
0% {
-moz-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-moz-transform: perspective(400px) rotateX(-10deg);
}
70% {
-moz-transform: perspective(400px) rotateX(10deg);
}
100% {
-moz-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
@-o-keyframes flipInX {
0% {
-o-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
-o-transform: perspective(400px) rotateX(-10deg);
}
70% {
-o-transform: perspective(400px) rotateX(10deg);
}
100% {
-o-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
@keyframes flipInX {
0% {
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
40% {
transform: perspective(400px) rotateX(-10deg);
}
70% {
transform: perspective(400px) rotateX(10deg);
}
100% {
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
-webkit-animation-name: flipInX;
-moz-backface-visibility: visible !important;
-moz-animation-name: flipInX;
-o-backface-visibility: visible !important;
-o-animation-name: flipInX;
backface-visibility: visible !important;
animation-name: flipInX;
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@-moz-keyframes flipOutX {
0% {
-moz-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-moz-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@-o-keyframes flipOutX {
0% {
-o-transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
-o-transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
@keyframes flipOutX {
0% {
transform: perspective(400px) rotateX(0deg);
opacity: 1;
}
100% {
transform: perspective(400px) rotateX(90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-name: flipOutX;
-webkit-backface-visibility: visible !important;
-moz-animation-name: flipOutX;
-moz-backface-visibility: visible !important;
-o-animation-name: flipOutX;
-o-backface-visibility: visible !important;
animation-name: flipOutX;
backface-visibility: visible !important;
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotateY(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateY(10deg);
}
100% {
-webkit-transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
@-moz-keyframes flipInY {
0% {
-moz-transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-moz-transform: perspective(400px) rotateY(-10deg);
}
70% {
-moz-transform: perspective(400px) rotateY(10deg);
}
100% {
-moz-transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
@-o-keyframes flipInY {
0% {
-o-transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
-o-transform: perspective(400px) rotateY(-10deg);
}
70% {
-o-transform: perspective(400px) rotateY(10deg);
}
100% {
-o-transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
@keyframes flipInY {
0% {
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
40% {
transform: perspective(400px) rotateY(-10deg);
}
70% {
transform: perspective(400px) rotateY(10deg);
}
100% {
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
-webkit-animation-name: flipInY;
-moz-backface-visibility: visible !important;
-moz-animation-name: flipInY;
-o-backface-visibility: visible !important;
-o-animation-name: flipInY;
backface-visibility: visible !important;
animation-name: flipInY;
}
@-webkit-keyframes flipOutY {
0% {
-webkit-transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
@-moz-keyframes flipOutY {
0% {
-moz-transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
100% {
-moz-transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
@-o-keyframes flipOutY {
0% {
-o-transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
100% {
-o-transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
@keyframes flipOutY {
0% {
transform: perspective(400px) rotateY(0deg);
opacity: 1;
}
100% {
transform: perspective(400px) rotateY(90deg);
opacity: 0;
}
}
.flipOutY {
-webkit-backface-visibility: visible !important;
-webkit-animation-name: flipOutY;
-moz-backface-visibility: visible !important;
-moz-animation-name: flipOutY;
-o-backface-visibility: visible !important;
-o-animation-name: flipOutY;
backface-visibility: visible !important;
animation-name: flipOutY;
}
@-webkit-keyframes fadeIn {
0% {opacity: 0;}	
100% {opacity: 1;}
}
@-moz-keyframes fadeIn {
0% {opacity: 0;}	
100% {opacity: 1;}
}
@-o-keyframes fadeIn {
0% {opacity: 0;}	
100% {opacity: 1;}
}
@keyframes fadeIn {
0% {opacity: 0;}	
100% {opacity: 1;}
}
.fadeIn {
-webkit-animation-name: fadeIn;
-moz-animation-name: fadeIn;
-o-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translateY(20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes fadeInUp {
0% {
opacity: 0;
-moz-transform: translateY(20px);
}
100% {
opacity: 1;
-moz-transform: translateY(0);
}
}
@-o-keyframes fadeInUp {
0% {
opacity: 0;
-o-transform: translateY(20px);
}
100% {
opacity: 1;
-o-transform: translateY(0);
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
transform: translateY(20px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
-moz-animation-name: fadeInUp;
-o-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes fadeInDown {
0% {
opacity: 0;
-moz-transform: translateY(-20px);
}
100% {
opacity: 1;
-moz-transform: translateY(0);
}
}
@-o-keyframes fadeInDown {
0% {
opacity: 0;
-o-transform: translateY(-20px);
}
100% {
opacity: 1;
-o-transform: translateY(0);
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
transform: translateY(-20px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
-moz-animation-name: fadeInDown;
-o-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
}
}
@-moz-keyframes fadeInLeft {
0% {
opacity: 0;
-moz-transform: translateX(-20px);
}
100% {
opacity: 1;
-moz-transform: translateX(0);
}
}
@-o-keyframes fadeInLeft {
0% {
opacity: 0;
-o-transform: translateX(-20px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
transform: translateX(-20px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
-moz-animation-name: fadeInLeft;
-o-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translateX(20px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
}
}
@-moz-keyframes fadeInRight {
0% {
opacity: 0;
-moz-transform: translateX(20px);
}
100% {
opacity: 1;
-moz-transform: translateX(0);
}
}
@-o-keyframes fadeInRight {
0% {
opacity: 0;
-o-transform: translateX(20px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
transform: translateX(20px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
-moz-animation-name: fadeInRight;
-o-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes fadeInUpBig {
0% {
opacity: 0;
-moz-transform: translateY(2000px);
}
100% {
opacity: 1;
-moz-transform: translateY(0);
}
}
@-o-keyframes fadeInUpBig {
0% {
opacity: 0;
-o-transform: translateY(2000px);
}
100% {
opacity: 1;
-o-transform: translateY(0);
}
}
@keyframes fadeInUpBig {
0% {
opacity: 0;
transform: translateY(2000px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
-moz-animation-name: fadeInUpBig;
-o-animation-name: fadeInUpBig;
animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes fadeInDownBig {
0% {
opacity: 0;
-moz-transform: translateY(-2000px);
}
100% {
opacity: 1;
-moz-transform: translateY(0);
}
}
@-o-keyframes fadeInDownBig {
0% {
opacity: 0;
-o-transform: translateY(-2000px);
}
100% {
opacity: 1;
-o-transform: translateY(0);
}
}
@keyframes fadeInDownBig {
0% {
opacity: 0;
transform: translateY(-2000px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
-moz-animation-name: fadeInDownBig;
-o-animation-name: fadeInDownBig;
animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
}
}
@-moz-keyframes fadeInLeftBig {
0% {
opacity: 0;
-moz-transform: translateX(-2000px);
}
100% {
opacity: 1;
-moz-transform: translateX(0);
}
}
@-o-keyframes fadeInLeftBig {
0% {
opacity: 0;
-o-transform: translateX(-2000px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInLeftBig {
0% {
opacity: 0;
transform: translateX(-2000px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
-moz-animation-name: fadeInLeftBig;
-o-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
}
}
@-moz-keyframes fadeInRightBig {
0% {
opacity: 0;
-moz-transform: translateX(2000px);
}
100% {
opacity: 1;
-moz-transform: translateX(0);
}
}
@-o-keyframes fadeInRightBig {
0% {
opacity: 0;
-o-transform: translateX(2000px);
}
100% {
opacity: 1;
-o-transform: translateX(0);
}
}
@keyframes fadeInRightBig {
0% {
opacity: 0;
transform: translateX(2000px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
-moz-animation-name: fadeInRightBig;
-o-animation-name: fadeInRightBig;
animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
@-moz-keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
@-o-keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes fadeOut {
0% {opacity: 1;}
100% {opacity: 0;}
}
.fadeOut {
-webkit-animation-name: fadeOut;
-moz-animation-name: fadeOut;
-o-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOutUp {
0% {
opacity: 1;
-webkit-transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-20px);
}
}
@-moz-keyframes fadeOutUp {
0% {
opacity: 1;
-moz-transform: translateY(0);
}
100% {
opacity: 0;
-moz-transform: translateY(-20px);
}
}
@-o-keyframes fadeOutUp {
0% {
opacity: 1;
-o-transform: translateY(0);
}
100% {
opacity: 0;
-o-transform: translateY(-20px);
}
}
@keyframes fadeOutUp {
0% {
opacity: 1;
transform: translateY(0);
}
100% {
opacity: 0;
transform: translateY(-20px);
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
-moz-animation-name: fadeOutUp;
-o-animation-name: fadeOutUp;
animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutDown {
0% {
opacity: 1;
-webkit-transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(20px);
}
}
@-moz-keyframes fadeOutDown {
0% {
opacity: 1;
-moz-transform: translateY(0);
}
100% {
opacity: 0;
-moz-transform: translateY(20px);
}
}
@-o-keyframes fadeOutDown {
0% {
opacity: 1;
-o-transform: translateY(0);
}
100% {
opacity: 0;
-o-transform: translateY(20px);
}
}
@keyframes fadeOutDown {
0% {
opacity: 1;
transform: translateY(0);
}
100% {
opacity: 0;
transform: translateY(20px);
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
-moz-animation-name: fadeOutDown;
-o-animation-name: fadeOutDown;
animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity: 1;
-webkit-transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-20px);
}
}
@-moz-keyframes fadeOutLeft {
0% {
opacity: 1;
-moz-transform: translateX(0);
}
100% {
opacity: 0;
-moz-transform: translateX(-20px);
}
}
@-o-keyframes fadeOutLeft {
0% {
opacity: 1;
-o-transform: translateX(0);
}
100% {
opacity: 0;
-o-transform: translateX(-20px);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(-20px);
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
-moz-animation-name: fadeOutLeft;
-o-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutRight {
0% {
opacity: 1;
-webkit-transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(20px);
}
}
@-moz-keyframes fadeOutRight {
0% {
opacity: 1;
-moz-transform: translateX(0);
}
100% {
opacity: 0;
-moz-transform: translateX(20px);
}
}
@-o-keyframes fadeOutRight {
0% {
opacity: 1;
-o-transform: translateX(0);
}
100% {
opacity: 0;
-o-transform: translateX(20px);
}
}
@keyframes fadeOutRight {
0% {
opacity: 1;
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(20px);
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
-moz-animation-name: fadeOutRight;
-o-animation-name: fadeOutRight;
animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutUpBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
}
}
@-moz-keyframes fadeOutUpBig {
0% {
opacity: 1;
-moz-transform: translateY(0);
}
100% {
opacity: 0;
-moz-transform: translateY(-2000px);
}
}
@-o-keyframes fadeOutUpBig {
0% {
opacity: 1;
-o-transform: translateY(0);
}
100% {
opacity: 0;
-o-transform: translateY(-2000px);
}
}
@keyframes fadeOutUpBig {
0% {
opacity: 1;
transform: translateY(0);
}
100% {
opacity: 0;
transform: translateY(-2000px);
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
-moz-animation-name: fadeOutUpBig;
-o-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig;
}
@-webkit-keyframes fadeOutDownBig {
0% {
opacity: 1;
-webkit-transform: translateY(0);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
}
}
@-moz-keyframes fadeOutDownBig {
0% {
opacity: 1;
-moz-transform: translateY(0);
}
100% {
opacity: 0;
-moz-transform: translateY(2000px);
}
}
@-o-keyframes fadeOutDownBig {
0% {
opacity: 1;
-o-transform: translateY(0);
}
100% {
opacity: 0;
-o-transform: translateY(2000px);
}
}
@keyframes fadeOutDownBig {
0% {
opacity: 1;
transform: translateY(0);
}
100% {
opacity: 0;
transform: translateY(2000px);
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
-moz-animation-name: fadeOutDownBig;
-o-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeftBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
}
}
@-moz-keyframes fadeOutLeftBig {
0% {
opacity: 1;
-moz-transform: translateX(0);
}
100% {
opacity: 0;
-moz-transform: translateX(-2000px);
}
}
@-o-keyframes fadeOutLeftBig {
0% {
opacity: 1;
-o-transform: translateX(0);
}
100% {
opacity: 0;
-o-transform: translateX(-2000px);
}
}
@keyframes fadeOutLeftBig {
0% {
opacity: 1;
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(-2000px);
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
-moz-animation-name: fadeOutLeftBig;
-o-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRightBig {
0% {
opacity: 1;
-webkit-transform: translateX(0);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
}
}
@-moz-keyframes fadeOutRightBig {
0% {
opacity: 1;
-moz-transform: translateX(0);
}
100% {
opacity: 0;
-moz-transform: translateX(2000px);
}
}
@-o-keyframes fadeOutRightBig {
0% {
opacity: 1;
-o-transform: translateX(0);
}
100% {
opacity: 0;
-o-transform: translateX(2000px);
}
}
@keyframes fadeOutRightBig {
0% {
opacity: 1;
transform: translateX(0);
}
100% {
opacity: 0;
transform: translateX(2000px);
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
-moz-animation-name: fadeOutRightBig;
-o-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig;
}
@-webkit-keyframes bounceIn {
0% {
opacity: 0;
-webkit-transform: scale(.3);
}
50% {
opacity: 1;
-webkit-transform: scale(1.05);
}
70% {
-webkit-transform: scale(.9);
}
100% {
-webkit-transform: scale(1);
}
}
@-moz-keyframes bounceIn {
0% {
opacity: 0;
-moz-transform: scale(.3);
}
50% {
opacity: 1;
-moz-transform: scale(1.05);
}
70% {
-moz-transform: scale(.9);
}
100% {
-moz-transform: scale(1);
}
}
@-o-keyframes bounceIn {
0% {
opacity: 0;
-o-transform: scale(.3);
}
50% {
opacity: 1;
-o-transform: scale(1.05);
}
70% {
-o-transform: scale(.9);
}
100% {
-o-transform: scale(1);
}
}
@keyframes bounceIn {
0% {
opacity: 0;
transform: scale(.3);
}
50% {
opacity: 1;
transform: scale(1.05);
}
70% {
transform: scale(.9);
}
100% {
transform: scale(1);
}
}
.bounceIn {
-webkit-animation-name: bounceIn;
-moz-animation-name: bounceIn;
-o-animation-name: bounceIn;
animation-name: bounceIn;
}
@-webkit-keyframes bounceInUp {
0% {
opacity: 0;
-webkit-transform: translateY(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(-30px);
}
80% {
-webkit-transform: translateY(10px);
}
100% {
-webkit-transform: translateY(0);
}
}
@-moz-keyframes bounceInUp {
0% {
opacity: 0;
-moz-transform: translateY(2000px);
}
60% {
opacity: 1;
-moz-transform: translateY(-30px);
}
80% {
-moz-transform: translateY(10px);
}
100% {
-moz-transform: translateY(0);
}
}
@-o-keyframes bounceInUp {
0% {
opacity: 0;
-o-transform: translateY(2000px);
}
60% {
opacity: 1;
-o-transform: translateY(-30px);
}
80% {
-o-transform: translateY(10px);
}
100% {
-o-transform: translateY(0);
}
}
@keyframes bounceInUp {
0% {
opacity: 0;
transform: translateY(2000px);
}
60% {
opacity: 1;
transform: translateY(-30px);
}
80% {
transform: translateY(10px);
}
100% {
transform: translateY(0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
-moz-animation-name: bounceInUp;
-o-animation-name: bounceInUp;
animation-name: bounceInUp;
}
@-webkit-keyframes bounceInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateY(30px);
}
80% {
-webkit-transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(0);
}
}
@-moz-keyframes bounceInDown {
0% {
opacity: 0;
-moz-transform: translateY(-2000px);
}
60% {
opacity: 1;
-moz-transform: translateY(30px);
}
80% {
-moz-transform: translateY(-10px);
}
100% {
-moz-transform: translateY(0);
}
}
@-o-keyframes bounceInDown {
0% {
opacity: 0;
-o-transform: translateY(-2000px);
}
60% {
opacity: 1;
-o-transform: translateY(30px);
}
80% {
-o-transform: translateY(-10px);
}
100% {
-o-transform: translateY(0);
}
}
@keyframes bounceInDown {
0% {
opacity: 0;
transform: translateY(-2000px);
}
60% {
opacity: 1;
transform: translateY(30px);
}
80% {
transform: translateY(-10px);
}
100% {
transform: translateY(0);
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
-moz-animation-name: bounceInDown;
-o-animation-name: bounceInDown;
animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
0% {
opacity: 0;
-webkit-transform: translateX(-2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(30px);
}
80% {
-webkit-transform: translateX(-10px);
}
100% {
-webkit-transform: translateX(0);
}
}
@-moz-keyframes bounceInLeft {
0% {
opacity: 0;
-moz-transform: translateX(-2000px);
}
60% {
opacity: 1;
-moz-transform: translateX(30px);
}
80% {
-moz-transform: translateX(-10px);
}
100% {
-moz-transform: translateX(0);
}
}
@-o-keyframes bounceInLeft {
0% {
opacity: 0;
-o-transform: translateX(-2000px);
}
60% {
opacity: 1;
-o-transform: translateX(30px);
}
80% {
-o-transform: translateX(-10px);
}
100% {
-o-transform: translateX(0);
}
}
@keyframes bounceInLeft {
0% {
opacity: 0;
transform: translateX(-2000px);
}
60% {
opacity: 1;
transform: translateX(30px);
}
80% {
transform: translateX(-10px);
}
100% {
transform: translateX(0);
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
-moz-animation-name: bounceInLeft;
-o-animation-name: bounceInLeft;
animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
}
60% {
opacity: 1;
-webkit-transform: translateX(-30px);
}
80% {
-webkit-transform: translateX(10px);
}
100% {
-webkit-transform: translateX(0);
}
}
@-moz-keyframes bounceInRight {
0% {
opacity: 0;
-moz-transform: translateX(2000px);
}
60% {
opacity: 1;
-moz-transform: translateX(-30px);
}
80% {
-moz-transform: translateX(10px);
}
100% {
-moz-transform: translateX(0);
}
}
@-o-keyframes bounceInRight {
0% {
opacity: 0;
-o-transform: translateX(2000px);
}
60% {
opacity: 1;
-o-transform: translateX(-30px);
}
80% {
-o-transform: translateX(10px);
}
100% {
-o-transform: translateX(0);
}
}
@keyframes bounceInRight {
0% {
opacity: 0;
transform: translateX(2000px);
}
60% {
opacity: 1;
transform: translateX(-30px);
}
80% {
transform: translateX(10px);
}
100% {
transform: translateX(0);
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
-moz-animation-name: bounceInRight;
-o-animation-name: bounceInRight;
animation-name: bounceInRight;
}
@-webkit-keyframes bounceOut {
0% {
-webkit-transform: scale(1);
}
25% {
-webkit-transform: scale(.95);
}
50% {
opacity: 1;
-webkit-transform: scale(1.1);
}
100% {
opacity: 0;
-webkit-transform: scale(.3);
}	
}
@-moz-keyframes bounceOut {
0% {
-moz-transform: scale(1);
}
25% {
-moz-transform: scale(.95);
}
50% {
opacity: 1;
-moz-transform: scale(1.1);
}
100% {
opacity: 0;
-moz-transform: scale(.3);
}	
}
@-o-keyframes bounceOut {
0% {
-o-transform: scale(1);
}
25% {
-o-transform: scale(.95);
}
50% {
opacity: 1;
-o-transform: scale(1.1);
}
100% {
opacity: 0;
-o-transform: scale(.3);
}	
}
@keyframes bounceOut {
0% {
transform: scale(1);
}
25% {
transform: scale(.95);
}
50% {
opacity: 1;
transform: scale(1.1);
}
100% {
opacity: 0;
transform: scale(.3);
}	
}
.bounceOut {
-webkit-animation-name: bounceOut;
-moz-animation-name: bounceOut;
-o-animation-name: bounceOut;
animation-name: bounceOut;
}
@-webkit-keyframes bounceOutUp {
0% {
-webkit-transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(-2000px);
}
}
@-moz-keyframes bounceOutUp {
0% {
-moz-transform: translateY(0);
}
20% {
opacity: 1;
-moz-transform: translateY(20px);
}
100% {
opacity: 0;
-moz-transform: translateY(-2000px);
}
}
@-o-keyframes bounceOutUp {
0% {
-o-transform: translateY(0);
}
20% {
opacity: 1;
-o-transform: translateY(20px);
}
100% {
opacity: 0;
-o-transform: translateY(-2000px);
}
}
@keyframes bounceOutUp {
0% {
transform: translateY(0);
}
20% {
opacity: 1;
transform: translateY(20px);
}
100% {
opacity: 0;
transform: translateY(-2000px);
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
-moz-animation-name: bounceOutUp;
-o-animation-name: bounceOutUp;
animation-name: bounceOutUp;
}
@-webkit-keyframes bounceOutDown {
0% {
-webkit-transform: translateY(0);
}
20% {
opacity: 1;
-webkit-transform: translateY(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateY(2000px);
}
}
@-moz-keyframes bounceOutDown {
0% {
-moz-transform: translateY(0);
}
20% {
opacity: 1;
-moz-transform: translateY(-20px);
}
100% {
opacity: 0;
-moz-transform: translateY(2000px);
}
}
@-o-keyframes bounceOutDown {
0% {
-o-transform: translateY(0);
}
20% {
opacity: 1;
-o-transform: translateY(-20px);
}
100% {
opacity: 0;
-o-transform: translateY(2000px);
}
}
@keyframes bounceOutDown {
0% {
transform: translateY(0);
}
20% {
opacity: 1;
transform: translateY(-20px);
}
100% {
opacity: 0;
transform: translateY(2000px);
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
-moz-animation-name: bounceOutDown;
-o-animation-name: bounceOutDown;
animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
0% {
-webkit-transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(-2000px);
}
}
@-moz-keyframes bounceOutLeft {
0% {
-moz-transform: translateX(0);
}
20% {
opacity: 1;
-moz-transform: translateX(20px);
}
100% {
opacity: 0;
-moz-transform: translateX(-2000px);
}
}
@-o-keyframes bounceOutLeft {
0% {
-o-transform: translateX(0);
}
20% {
opacity: 1;
-o-transform: translateX(20px);
}
100% {
opacity: 0;
-o-transform: translateX(-2000px);
}
}
@keyframes bounceOutLeft {
0% {
transform: translateX(0);
}
20% {
opacity: 1;
transform: translateX(20px);
}
100% {
opacity: 0;
transform: translateX(-2000px);
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
-moz-animation-name: bounceOutLeft;
-o-animation-name: bounceOutLeft;
animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
0% {
-webkit-transform: translateX(0);
}
20% {
opacity: 1;
-webkit-transform: translateX(-20px);
}
100% {
opacity: 0;
-webkit-transform: translateX(2000px);
}
}
@-moz-keyframes bounceOutRight {
0% {
-moz-transform: translateX(0);
}
20% {
opacity: 1;
-moz-transform: translateX(-20px);
}
100% {
opacity: 0;
-moz-transform: translateX(2000px);
}
}
@-o-keyframes bounceOutRight {
0% {
-o-transform: translateX(0);
}
20% {
opacity: 1;
-o-transform: translateX(-20px);
}
100% {
opacity: 0;
-o-transform: translateX(2000px);
}
}
@keyframes bounceOutRight {
0% {
transform: translateX(0);
}
20% {
opacity: 1;
transform: translateX(-20px);
}
100% {
opacity: 0;
transform: translateX(2000px);
}
}
.bounceOutRight {
-webkit-animation-name: bounceOutRight;
-moz-animation-name: bounceOutRight;
-o-animation-name: bounceOutRight;
animation-name: bounceOutRight;
}
@-webkit-keyframes rotateIn {
0% {
-webkit-transform-origin: center center;
-webkit-transform: rotate(-200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center center;
-webkit-transform: rotate(0);
opacity: 1;
}
}
@-moz-keyframes rotateIn {
0% {
-moz-transform-origin: center center;
-moz-transform: rotate(-200deg);
opacity: 0;
}
100% {
-moz-transform-origin: center center;
-moz-transform: rotate(0);
opacity: 1;
}
}
@-o-keyframes rotateIn {
0% {
-o-transform-origin: center center;
-o-transform: rotate(-200deg);
opacity: 0;
}
100% {
-o-transform-origin: center center;
-o-transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateIn {
0% {
transform-origin: center center;
transform: rotate(-200deg);
opacity: 0;
}
100% {
transform-origin: center center;
transform: rotate(0);
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
-moz-animation-name: rotateIn;
-o-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
-webkit-transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
-webkit-transform: rotate(0);
opacity: 1;
}
}
@-moz-keyframes rotateInUpLeft {
0% {
-moz-transform-origin: left bottom;
-moz-transform: rotate(90deg);
opacity: 0;
}
100% {
-moz-transform-origin: left bottom;
-moz-transform: rotate(0);
opacity: 1;
}
}
@-o-keyframes rotateInUpLeft {
0% {
-o-transform-origin: left bottom;
-o-transform: rotate(90deg);
opacity: 0;
}
100% {
-o-transform-origin: left bottom;
-o-transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInUpLeft {
0% {
transform-origin: left bottom;
transform: rotate(90deg);
opacity: 0;
}
100% {
transform-origin: left bottom;
transform: rotate(0);
opacity: 1;
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
-moz-animation-name: rotateInUpLeft;
-o-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
-webkit-transform: rotate(0);
opacity: 1;
}
}
@-moz-keyframes rotateInDownLeft {
0% {
-moz-transform-origin: left bottom;
-moz-transform: rotate(-90deg);
opacity: 0;
}
100% {
-moz-transform-origin: left bottom;
-moz-transform: rotate(0);
opacity: 1;
}
}
@-o-keyframes rotateInDownLeft {
0% {
-o-transform-origin: left bottom;
-o-transform: rotate(-90deg);
opacity: 0;
}
100% {
-o-transform-origin: left bottom;
-o-transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInDownLeft {
0% {
transform-origin: left bottom;
transform: rotate(-90deg);
opacity: 0;
}
100% {
transform-origin: left bottom;
transform: rotate(0);
opacity: 1;
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
-moz-animation-name: rotateInDownLeft;
-o-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
-webkit-transform: rotate(0);
opacity: 1;
}
}
@-moz-keyframes rotateInUpRight {
0% {
-moz-transform-origin: right bottom;
-moz-transform: rotate(-90deg);
opacity: 0;
}
100% {
-moz-transform-origin: right bottom;
-moz-transform: rotate(0);
opacity: 1;
}
}
@-o-keyframes rotateInUpRight {
0% {
-o-transform-origin: right bottom;
-o-transform: rotate(-90deg);
opacity: 0;
}
100% {
-o-transform-origin: right bottom;
-o-transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInUpRight {
0% {
transform-origin: right bottom;
transform: rotate(-90deg);
opacity: 0;
}
100% {
transform-origin: right bottom;
transform: rotate(0);
opacity: 1;
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
-moz-animation-name: rotateInUpRight;
-o-animation-name: rotateInUpRight;
animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
-webkit-transform: rotate(90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
-webkit-transform: rotate(0);
opacity: 1;
}
}
@-moz-keyframes rotateInDownRight {
0% {
-moz-transform-origin: right bottom;
-moz-transform: rotate(90deg);
opacity: 0;
}
100% {
-moz-transform-origin: right bottom;
-moz-transform: rotate(0);
opacity: 1;
}
}
@-o-keyframes rotateInDownRight {
0% {
-o-transform-origin: right bottom;
-o-transform: rotate(90deg);
opacity: 0;
}
100% {
-o-transform-origin: right bottom;
-o-transform: rotate(0);
opacity: 1;
}
}
@keyframes rotateInDownRight {
0% {
transform-origin: right bottom;
transform: rotate(90deg);
opacity: 0;
}
100% {
transform-origin: right bottom;
transform: rotate(0);
opacity: 1;
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
-moz-animation-name: rotateInDownRight;
-o-animation-name: rotateInDownRight;
animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateOut {
0% {
-webkit-transform-origin: center center;
-webkit-transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: center center;
-webkit-transform: rotate(200deg);
opacity: 0;
}
}
@-moz-keyframes rotateOut {
0% {
-moz-transform-origin: center center;
-moz-transform: rotate(0);
opacity: 1;
}
100% {
-moz-transform-origin: center center;
-moz-transform: rotate(200deg);
opacity: 0;
}
}
@-o-keyframes rotateOut {
0% {
-o-transform-origin: center center;
-o-transform: rotate(0);
opacity: 1;
}
100% {
-o-transform-origin: center center;
-o-transform: rotate(200deg);
opacity: 0;
}
}
@keyframes rotateOut {
0% {
transform-origin: center center;
transform: rotate(0);
opacity: 1;
}
100% {
transform-origin: center center;
transform: rotate(200deg);
opacity: 0;
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
-moz-animation-name: rotateOut;
-o-animation-name: rotateOut;
animation-name: rotateOut;
}
@-webkit-keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
-webkit-transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
-webkit-transform: rotate(-90deg);
opacity: 0;
}
}
@-moz-keyframes rotateOutUpLeft {
0% {
-moz-transform-origin: left bottom;
-moz-transform: rotate(0);
opacity: 1;
}
100% {
-moz-transform-origin: left bottom;
-moz-transform: rotate(-90deg);
opacity: 0;
}
}
@-o-keyframes rotateOutUpLeft {
0% {
-o-transform-origin: left bottom;
-o-transform: rotate(0);
opacity: 1;
}
100% {
-o-transform-origin: left bottom;
-o-transform: rotate(-90deg);
opacity: 0;
}
}
@keyframes rotateOutUpLeft {
0% {
transform-origin: left bottom;
transform: rotate(0);
opacity: 1;
}
100% {
transform-origin: left bottom;
transform: rotate(-90deg);
opacity: 0;
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
-moz-animation-name: rotateOutUpLeft;
-o-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
-webkit-transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
-webkit-transform: rotate(90deg);
opacity: 0;
}
}
@-moz-keyframes rotateOutDownLeft {
0% {
-moz-transform-origin: left bottom;
-moz-transform: rotate(0);
opacity: 1;
}
100% {
-moz-transform-origin: left bottom;
-moz-transform: rotate(90deg);
opacity: 0;
}
}
@-o-keyframes rotateOutDownLeft {
0% {
-o-transform-origin: left bottom;
-o-transform: rotate(0);
opacity: 1;
}
100% {
-o-transform-origin: left bottom;
-o-transform: rotate(90deg);
opacity: 0;
}
}
@keyframes rotateOutDownLeft {
0% {
transform-origin: left bottom;
transform: rotate(0);
opacity: 1;
}
100% {
transform-origin: left bottom;
transform: rotate(90deg);
opacity: 0;
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
-moz-animation-name: rotateOutDownLeft;
-o-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
-webkit-transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
-webkit-transform: rotate(90deg);
opacity: 0;
}
}
@-moz-keyframes rotateOutUpRight {
0% {
-moz-transform-origin: right bottom;
-moz-transform: rotate(0);
opacity: 1;
}
100% {
-moz-transform-origin: right bottom;
-moz-transform: rotate(90deg);
opacity: 0;
}
}
@-o-keyframes rotateOutUpRight {
0% {
-o-transform-origin: right bottom;
-o-transform: rotate(0);
opacity: 1;
}
100% {
-o-transform-origin: right bottom;
-o-transform: rotate(90deg);
opacity: 0;
}
}
@keyframes rotateOutUpRight {
0% {
transform-origin: right bottom;
transform: rotate(0);
opacity: 1;
}
100% {
transform-origin: right bottom;
transform: rotate(90deg);
opacity: 0;
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
-moz-animation-name: rotateOutUpRight;
-o-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight;
}
@-webkit-keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
-webkit-transform: rotate(0);
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
-webkit-transform: rotate(-90deg);
opacity: 0;
}
}
@-moz-keyframes rotateOutDownRight {
0% {
-moz-transform-origin: right bottom;
-moz-transform: rotate(0);
opacity: 1;
}
100% {
-moz-transform-origin: right bottom;
-moz-transform: rotate(-90deg);
opacity: 0;
}
}
@-o-keyframes rotateOutDownRight {
0% {
-o-transform-origin: right bottom;
-o-transform: rotate(0);
opacity: 1;
}
100% {
-o-transform-origin: right bottom;
-o-transform: rotate(-90deg);
opacity: 0;
}
}
@keyframes rotateOutDownRight {
0% {
transform-origin: right bottom;
transform: rotate(0);
opacity: 1;
}
100% {
transform-origin: right bottom;
transform: rotate(-90deg);
opacity: 0;
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
-moz-animation-name: rotateOutDownRight;
-o-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight;
}
@-webkit-keyframes hinge {
0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }	
20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }	
40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }	
80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }	
100% { -webkit-transform: translateY(700px); opacity: 0; }
}
@-moz-keyframes hinge {
0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }	
20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }	
40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }	
80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }	
100% { -moz-transform: translateY(700px); opacity: 0; }
}
@-o-keyframes hinge {
0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }	
20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }	
40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }	
80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }	
100% { -o-transform: translateY(700px); opacity: 0; }
}
@keyframes hinge {
0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; }	
20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; }	
40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; }	
80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; }	
100% { transform: translateY(700px); opacity: 0; }
}
.hinge {
-webkit-animation-name: hinge;
-moz-animation-name: hinge;
-o-animation-name: hinge;
animation-name: hinge;
} @-webkit-keyframes rollIn {
0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); }
100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }
}
@-moz-keyframes rollIn {
0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); }
100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }
}
@-o-keyframes rollIn {
0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); }
100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }
}
@keyframes rollIn {
0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); }
100% { opacity: 1; transform: translateX(0px) rotate(0deg); }
}
.rollIn {
-webkit-animation-name: rollIn;
-moz-animation-name: rollIn;
-o-animation-name: rollIn;
animation-name: rollIn;
} @-webkit-keyframes rollOut {
0% {
opacity: 1;
-webkit-transform: translateX(0px) rotate(0deg);
}
100% {
opacity: 0;
-webkit-transform: translateX(100%) rotate(120deg);
}
}
@-moz-keyframes rollOut {
0% {
opacity: 1;
-moz-transform: translateX(0px) rotate(0deg);
}
100% {
opacity: 0;
-moz-transform: translateX(100%) rotate(120deg);
}
}
@-o-keyframes rollOut {
0% {
opacity: 1;
-o-transform: translateX(0px) rotate(0deg);
}
100% {
opacity: 0;
-o-transform: translateX(100%) rotate(120deg);
}
}
@keyframes rollOut {
0% {
opacity: 1;
transform: translateX(0px) rotate(0deg);
}
100% {
opacity: 0;
transform: translateX(100%) rotate(120deg);
}
}
.rollOut {
-webkit-animation-name: rollOut;
-moz-animation-name: rollOut;
-o-animation-name: rollOut;
animation-name: rollOut;
} @-webkit-keyframes lightSpeedIn {
0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }
60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; }
80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; }
100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }
}
@-moz-keyframes lightSpeedIn {
0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }
60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; }
80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; }
100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }
}
@-o-keyframes lightSpeedIn {
0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }
60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; }
80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; }
100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }
}
@keyframes lightSpeedIn {
0% { transform: translateX(100%) skewX(-30deg); opacity: 0; }
60% { transform: translateX(-20%) skewX(30deg); opacity: 1; }
80% { transform: translateX(0%) skewX(-15deg); opacity: 1; }
100% { transform: translateX(0%) skewX(0deg); opacity: 1; }
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
-moz-animation-name: lightSpeedIn;
-o-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
-moz-animation-timing-function: ease-out;
-o-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
.animated.lightSpeedIn {
-webkit-animation-duration: 0.5s;
-moz-animation-duration: 0.5s;
-o-animation-duration: 0.5s;
animation-duration: 0.5s;
} @-webkit-keyframes lightSpeedOut {
0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }
100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }
}
@-moz-keyframes lightSpeedOut {
0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }
100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }
}
@-o-keyframes lightSpeedOut {
0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }
100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }
}
@keyframes lightSpeedOut {
0% { transform: translateX(0%) skewX(0deg); opacity: 1; }
100% { transform: translateX(100%) skewX(-30deg); opacity: 0; }
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
-moz-animation-name: lightSpeedOut;
-o-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
.animated.lightSpeedOut {
-webkit-animation-duration: 0.25s;
-moz-animation-duration: 0.25s;
-o-animation-duration: 0.25s;
animation-duration: 0.25s;
} @-webkit-keyframes wiggle {
0% { -webkit-transform: skewX(9deg); }
10% { -webkit-transform: skewX(-8deg); }
20% { -webkit-transform: skewX(7deg); }
30% { -webkit-transform: skewX(-6deg); }
40% { -webkit-transform: skewX(5deg); }
50% { -webkit-transform: skewX(-4deg); }
60% { -webkit-transform: skewX(3deg); }
70% { -webkit-transform: skewX(-2deg); }
80% { -webkit-transform: skewX(1deg); }
90% { -webkit-transform: skewX(0deg); }
100% { -webkit-transform: skewX(0deg); }
}
@-moz-keyframes wiggle {
0% { -moz-transform: skewX(9deg); }
10% { -moz-transform: skewX(-8deg); }
20% { -moz-transform: skewX(7deg); }
30% { -moz-transform: skewX(-6deg); }
40% { -moz-transform: skewX(5deg); }
50% { -moz-transform: skewX(-4deg); }
60% { -moz-transform: skewX(3deg); }
70% { -moz-transform: skewX(-2deg); }
80% { -moz-transform: skewX(1deg); }
90% { -moz-transform: skewX(0deg); }
100% { -moz-transform: skewX(0deg); }
}
@-o-keyframes wiggle {
0% { -o-transform: skewX(9deg); }
10% { -o-transform: skewX(-8deg); }
20% { -o-transform: skewX(7deg); }
30% { -o-transform: skewX(-6deg); }
40% { -o-transform: skewX(5deg); }
50% { -o-transform: skewX(-4deg); }
60% { -o-transform: skewX(3deg); }
70% { -o-transform: skewX(-2deg); }
80% { -o-transform: skewX(1deg); }
90% { -o-transform: skewX(0deg); }
100% { -o-transform: skewX(0deg); }
}
@keyframes wiggle {
0% { transform: skewX(9deg); }
10% { transform: skewX(-8deg); }
20% { transform: skewX(7deg); }
30% { transform: skewX(-6deg); }
40% { transform: skewX(5deg); }
50% { transform: skewX(-4deg); }
60% { transform: skewX(3deg); }
70% { transform: skewX(-2deg); }
80% { transform: skewX(1deg); }
90% { transform: skewX(0deg); }
100% { transform: skewX(0deg); }
}
.wiggle {
-webkit-animation-name: wiggle;
-moz-animation-name: wiggle;
-o-animation-name: wiggle;
animation-name: wiggle;
-webkit-animation-timing-function: ease-in;
-moz-animation-timing-function: ease-in;
-o-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
.animated.wiggle {
-webkit-animation-duration: 0.75s;
-moz-animation-duration: 0.75s;
-o-animation-duration: 0.75s;
animation-duration: 0.75s;
} body {
color: #143764;
font-size: 16px;
line-height: 1.6em;
font-weight: 400;
text-shadow: none;
background-color: #FFFFFF;
}
.clear {
clear: both;
}
body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
font-family: YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
h1, h2, h3, h4, h5, h6 {
color:#143764;
}
h1,h2,h3,h4,h5,h6 {
font-style: normal;
margin: 0 0 15px 0;
}
h1 { font-size: 26px; line-height: 40px; }
h2 { font-size: 24px; }
h3 { font-size: 22px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 12px;}
.txt-light { font-weight: 300; }
.txt-regular { font-weight: 400; }
.txt-bold { font-weight: 700; }
.txt-uppercase { text-transform: uppercase; }
blockquote {
font-family: YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
blockquote.bigquote {
border: none;
font-size: 48px;
font-weight: 700;
line-height: 1.1em;
}
.text-bold {
font-weight: 900;
}
.lineh12em {
line-height: 1.2em;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
display: block;
}
small {
font-size: 70%;
font-weight: 100;
}
.logo-font {
font-size: 75%;
margin-top: -50px;
font-weight: 800;
color: #fff;	
}
a:hover {
text-decoration: none;
}
a:focus {
outline: none;
}
.color-white.txt-shadow {
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
}
.t-uppercase {
text-transform: uppercase;
}
.nicescroll-rails, .nicescroll-rails div{
width: 10px !important;
} .pc-hid{
display: none;
} @media screen and (max-width:650px) {
.pc-hid{
display: block;
}
} img {
image-rendering: -webkit-optimize-contrast;
} .row { }
.big {
font-size: 20pt;
font-weight: 300;
}
.medium {
font-size: 16pt;
font-weight: 700;
}
.mediuas {
font-size: 120%;
font-weight: 400;
}
.blink:hover {
opacity: 0.9;
}
.half-offset {
margin-bottom: 75px !important;
}
.no-offset {
margin: 0 !important;
padding: 0;
}
.content,.container {
overflow: hidden;
}
.trans {
border: 0 !important;
background: 0 !important;
box-shadow: none !important;
-webkit-box-shadow: none !important;
}
.nobg {
background: 0;
border: 0;
}
.noborder {
border: 0 !important;
}
.color-white {
color: #fff;
}
.theme-bg {
background-color: #ff7701 !important;
}
.normalize-font-top {
padding-top: 25px;
}
.flex{
display: flex;
flex-wrap: wrap;
} .float-left {
float: left;
}
.float-right {
float: right;
} .align-left {
text-align: left;
}
.align-right {
text-align: right;
}
.align-center {
text-align: center;
}  .pad-top0 {
padding-top: 0;
}
.pad-top5 {
padding-top: 5px;
}
.pad-top10 {
padding-top: 10px;
}
.pad-top15 {
padding-top: 15px;
}
.pad-top20 {
padding-top: 20px;
}
.pad-top25 {
padding-top: 25px;
}
.pad-top30 {
padding-top: 30px;
}
.pad-top35 {
padding-top: 35px;
}
.pad-top40 {
padding-top: 40px;
}
.pad-top50 {
padding-top: 50px;
}
.pad-top60 {
padding-top: 60px;
}
.pad-top70 {
padding-top: 70px;
}
.pad-top80 {
padding-top: 80px;
}
.pad-top90 {
padding-top: 90px;
}
.pad-top100 {
padding-top: 100px;
}
.pad-top110 {
padding-top: 110px;
}
.pad-top120 {
padding-top: 120px;
}
.pad-top150 {
padding-top: 150px;
}
.pad-top200 {
padding-top: 200px;
}
.pad-top250 {
padding-top: 250px;
}
.pad-top300 {
padding-top: 300px;
}
.pad-top350 {
padding-top: 350px;
} .pad-bot0 {
padding-bottom: 0;
}
.pad-bot5 {
padding-bottom: 5px;
}
.pad-bot10 {
padding-bottom: 10px;
}
.pad-bot15 {
padding-bottom: 15px;
}
.pad-bot20 {
padding-bottom: 20px;
}
.pad-bot25 {
padding-bottom: 25px;
}
.pad-bot30 {
padding-bottom: 30px;
}
.pad-bot35 {
padding-bottom: 35px;
}
.pad-bot40 {
padding-bottom: 40px;
}
.pad-bot50 {
padding-bottom: 50px;
}
.pad-bot60 {
padding-bottom: 60px;
} .pad-left5 {padding-left: 5px; }
.pad-left10 {padding-left: 10px; }
.pad-left15 {padding-left: 15px; }
.pad-left20 {padding-left: 20px; }
.pad-left30 {padding-left: 30px; }
.pad-left40 {padding-left: 40px; }
.pad-left50 {padding-left: 50px; }
.pad-left60 {padding-left: 60px; }
.pad-left70 {padding-left: 70px; }
.pad-left80 {padding-left: 80px; }
.pad-left90 {padding-left: 90px; }
.pad-left100 {padding-left: 100px; }
.pad-left110 {padding-left: 110px; }
.pad-left120 {padding-left: 120px; }
.pad-left130 {padding-left: 130px; }
.pad-left-50 {padding-left: -50px; } .pad-right5 {padding-right: 5px; }
.pad-right10 {padding-right: 10px; }
.pad-right15 {padding-right: 15px; }
.pad-right20 {padding-right: 20px; }
.pad-right30 {padding-right: 30px; }
.pad-right40 {padding-right: 40px; }
.pad-right50 {padding-right: 50px; }
.pad-right100 {padding-right: 100px; } .mar-left5 { margin-left: 5px; }
.mar-left10 { margin-left: 10px; }
.mar-left15 { margin-left: 15px; }
.mar-left20 { margin-left: 20px; }
.mar-left25 { margin-left: 25px; }
.mar-left30 { margin-left: 30px; }
.mar-left50 { margin-left: 50px; }
.mar-left40 { margin-left: 40px; }
.mar-left60 { margin-left: 60px; }
.mar-left70 { margin-left: 70px; }
.mar-left-15 { margin-left: -15px; }
.mar-left-30 { margin-left: -30px; }
.mar-right5 { margin-right: 5px; }
.mar-right10 { margin-right: 10px; }
.mar-right15 { margin-right: 15px; }
.mar-right20 { margin-right: 20px; }
.mar-right25 { margin-right: 25px; }
.mar-right30 { margin-right: 30px; }
.mar-right50 { margin-right: 50px; }
.mar-right-15 { margin-right: -15px; }
.mar-right-30 { margin-right: -30px; } .mar-top-10 {
margin-top: -10px;
}
.mar-top-20 {
margin-top: -20px;
}
.mar-top0 {
margin-top: 0;
}
.mar-top5 {
margin-top: 5px;
}
.mar-top10 {
margin-top: 10px;
}
.mar-top15 {
margin-top: 15px;
}
.mar-top20 {
margin-top: 20px;
}
.mar-top25 {
margin-top: 25px;
}
.mar-top30 {
margin-top: 30px;
}
.mar-top35 {
margin-top: 35px;
}
.mar-top40 {
margin-top: 40px;
}
.mar-top50 {
margin-top: 50px;
}
.mar-top60 {
margin-top: 60px;
}
.mar-top70 {
margin-top: 70px;
}
.mar-top80 {
margin-top: 80px;
}
.mar-top100 {
margin-top: 100px;
}
.mar-top120 {
margin-top: 120px;
}
.mar-top200 {
margin-top: 200px;
} .mar-bot0 {
margin-bottom: 0;
}
.mar-bot5 {
margin-bottom: 5px;
}
.mar-bot6 {
margin-bottom: 6px;
}
.mar-bot8 {
margin-bottom: 8px;
}
.mar-bot10 {
margin-bottom: 10px;
}
.mar-bot15 {
margin-bottom: 15px;
}
.mar-bot20 {
margin-bottom: 20px;
}
.mar-bot25 {
margin-bottom: 25px;
}
.mar-bot30 {
margin-bottom: 30px;
}
.mar-bot35 {
margin-bottom: 35px;
}
.mar-bot40 {
margin-bottom: 40px;
}
.mar-bot50 {
margin-bottom: 50px;
}
.mar-bot60 {
margin-bottom: 60px;
}
.mar-bot-10 {
margin-bottom: -10px;
}
.mar-bot-20 {
margin-bottom: -20px;
}
.mar-bot100 {
margin-bottom: 100px;
}
.bottom-box {
position: relative;
height: 150px;
}
.bottom-0 {
position: absolute;
bottom: 0;
} section.section {
margin:0;
padding: 80px 0 0px 0;
}
.bg-white {
background-color: #fff;
} .section-header {
text-align: center;
}
.section-header h2.section-heading {
text-transform: uppercase;
font-weight: 700;
}   .navbar {
line-height: 80px;
height: 80px;
background-color: rgba(200,0,0,1);
display: block;
vertical-align: middle;
text-align: center;
margin-bottom: 0;
padding-bottom: 0;
}
.navbar .navbar-collapse {
margin-bottom: 0;
padding-bottom:0;
}
.nav li {
height: 100%;
line-height: 100%;
margin-bottom: 0;
padding-bottom:0;
}
.nav>li>a {
display: block;
height: 100%;
line-height: 100%;
vertical-align: middle;
color: #fff;
font-weight: 700;
font-size: 12px;
text-transform: uppercase;
padding: 10px 10px;
}
.nav>li>a:hover {
color: #fff;
background: none;
}
.navbar-nav {
float: right;
margin-bottom: 0;
padding-bottom:0;	
}
.navbar .navbar-nav > .active > a {
color: #fff;
}
.navbar .navbar-nav > .active > a {
padding-bottom: 15px;
}
.navbar > .container  {
padding-bottom: 5px;
}
h1 a.navbar-brand {
font-size: 24px;
color: #fff;
font-weight: 900;
text-shadow: none;
}
.navbar-brand {
padding: 0;
display: table-cell;
vertical-align: middle;
line-height: 90px;
}
.navbar-brand img {
vertical-align: middle;
}
.navbar-toggle {
padding: 0;
margin: 0;
width: 80px;
}
.navbar-collapse.in {
margin-top: -5px !important;
}  section.featured.inner {
background: #eee;
padding: 150px 0 50px;
} .flexslider {
margin: 0;
background: 0;
border: 0;
box-shadow: none;
-webkit-box-shadow: none;
}
.flex-control-paging li a {
width: 8px;
height: 8px;
}
.flex-control-paging li a.flex-active {
background: #fff;
}
.flex-control-nav {
bottom: -25px;
}
.flexslider .slides img {
width: auto;
display: inline;
}
.flex-direction-nav a {
display: block;
width: 50px;
height: 98px;
margin: -29px -20px 0;
position: absolute;
top: 30%;
z-index: 10;
overflow: hidden;
opacity: 0;
cursor: pointer;
color: rgba(0,0,0,0.8);
text-shadow: 1px 1px 0 rgba(255,255,255,0.3);
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;
}
.flex-direction-nav .flex-next {
right: -70px; }
.flex-direction-nav .flex-prev {
left: -70px; }
.flex-direction-nav a.flex-next:before {
content: none !important;
} .flex-direction-nav a:before {
content: none !important;
} .featured .fullwidthbanner ul {
list-style: none;
padding:0;
}
.tp-rightarrow.large {
margin-left: 0;
}
.tp-leftarrow.default {
width: 49px !important;
height: 98px !important; }
.tp-rightarrow.default {
width: 49px !important;
height: 98px !important; }
.fullwidthbanner-container {
padding-top: 100px;
width: 100% !important;
position: relative;
padding: 0;
max-height: 650px !important;
overflow: hidden;
}
.fullwidthbanner {
height: 650px;
}
.tp-bullets.simplebullets.round .bullet { }  
.tp-caption.large_bold_white {
font-size:60px;
line-height:60px;
font-weight:800;
font-family: YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
color: #fff;
text-decoration:none;
background-color:transparent;
text-shadow:none;
margin:0px;
padding:1px 4px 0px;
border-width:0px;
border-color:rgb(255, 214, 88);
border-style:none;
}
.tp-caption.small_thin_white {
font-size:18px;
line-height:26px;
font-weight:300;
font-family: YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
color: #fff;
text-decoration:none;
background-color:transparent;
padding:1px 4px 0px;
text-shadow:none;
margin:0px;
border-width:0px;
border-color:rgb(255, 214, 88);
border-style:none;
}
.fullwidthbanner a.btn {
color: #fff;
} .member-photo {
box-sizing:border-box;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;	
margin: 0 0 20px 0;
}
.member-photo img {
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;	
}
.team-detail h4 {
font-weight: 700;
}
.recipetop-photo {
border-radius: 5px 5px 5px 5px;
max-width: 100%;
height: auto;
} nav#filter a {
background-color: #F7F7F7;
color:#555;
}
nav#filter a:hover, nav#filter a.current {
background-color: #F7F7F7;
color:#fff;
} .isotopeWrapper article{
margin-bottom: 30px;
}
#portfolio img  {
width:100%;
}
#portfolio article p {
margin-bottom:1.45em; }
nav#filter {
margin-bottom:1.5em;
}
nav#filter li {
display:inline-block;
margin:0 0 0 5px;
}
nav#filter a {
padding: 4px 12px;
line-height: 20px;
text-decoration: none;
}
.portfolio-items article img {width:100%;} 
.portfolio-item {
display: block;
position: relative;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.portfolio-item .portfolio-desc {
display: block;
opacity: 0;
position: absolute;
width: 100%;
left: 0;
top: 0;
color: rgba(255,255,255,1);
}
.portfolio-item:hover .portfolio-desc {
padding-top: 20%;
height: 100%;
transition: all 200ms ease-in-out 0s;
opacity: 1;
}
.portfolio-item .portfolio-desc a {
color: #fff;
}
.portfolio-item .portfolio-desc a:hover { text-decoration: none;
}
.portfolio-item .portfolio-desc .folio-info {
top:-20px;
padding: 30px;
height: 0;
opacity: 0;
position: relative;
}
.portfolio-item:hover .folio-info{
height: 100%;
opacity: 1;
transition: all 500ms ease-in-out 0s;
top:5px;
}
.portfolio-item .portfolio-desc .folio-info h5 {
text-transform: uppercase;
}
.portfolio-item .portfolio-desc .folio-info p {
color: #ffffff;
font-size: 12px;
} #testimonals {
padding-top: 20px;
padding-bottom:40px;
position:relative;
margin-top:50px;
}
.testimonial i {
color: #fff;
}
.testimonial span.author {
color: #fff;
font-weight: 700;
}
.testimonial h5 {
color: #fff;
font-size: 18px;
font-family: YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
line-height: 1.5em;
} .wpcf7 span.wpcf7-not-valid-tip {
font-size: 80%;
}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
background-color: #fff;
color: #333;
width: 95%;
border: 1px solid #ddd;
font-size: 100%;
padding: 0.5em;
border-radius: 4px;
box-shadow: 1px 1px 3px rgba(0,0,0,.1) inset;
}
.wpcf7 input[type="submit"],
.wpcf7 input[type="button"]{
font-size: 100%;
padding: 0.2em 0.4em;
background: #fff;
color: #333;
border-radius: 4px;
cursor: pointer;
box-shadow: 0 0 1px rgba(0,0,0,.2);
border: 2px solid #000;
text-shadow: -1px 1px 0 rgba(255,255,255,1);
}
.wpcf7 input[type="submit"],
.wpcf7 input[type="button"]:hover {
box-shadow: 0 0 1px rgba(0,0,0,.2) inset;
}
input.wpcf7c-conf,
select.wpcf7c-conf {
background: #fff;
}
.wpcf7 .required {
color: #ff0000;
font-weight: 800;
}
.bg-form {
background-color: #fffc60;
padding: 10px;
opacity: 0.8;
border-radius: 5px;
} .hidden_box {
margin: 0; padding: 0;
} .hidden_box label {
display:block;
padding: 15px;
font-weight: bold;
border: solid 2px black;
cursor :pointer;
} .hidden_box label:hover {
background: #efefef;
} .hidden_box input {
display: none;
} .hidden_box .hidden_show {
height: 0;
padding: 0;
overflow: hidden;
opacity: 0;
transition: 0.8s;
} .hidden_box input:checked ~ .hidden_show {
padding: 10px 0;
height: auto;
opacity: 1;
} #map {
height: 500px;
} #clients img {
opacity: 0.7;
}
#clients img:hover {
opacity: 1;
} section#footer {
background: #242424;
margin: 0;
}
section#footer .copyright {
text-align: center;
} ul.social-network {
list-style: none;
display: inline;
margin-left:0 !important;
padding: 0;
}
ul.social-network li {
display: inline;
margin: 0 5px;
} ul.footer-menu {
list-style: none;
display: inline;
margin-left:0 !important;
padding: 0;
}
ul.footer-menu li {
list-style: none;
display: inline;
margin: 0 5px;
}
a.scrollup{
height:32px;
width:32px;
color:#c80000;
font-size:40px;
line-height:32px;
text-align:center;
text-decoration:none;
position:fixed;
bottom:20px;
right:20px;
z-index:9999;
opacity:0.5;
}
a.scrollup:hover{
opacity:1;
color:#c80000;
}  .social-network a.icoRss:hover {
background-color: #F56505;
}
.social-network a.icoFacebook:hover {
background-color:#3B5998;
}
.social-network a.icoTwitter:hover {
background-color:#33ccff;
}
.social-network a.icoGoogle:hover {
background-color:#BD3518;
}
.social-network a.icoVimeo:hover {
background-color:#0590B8;
}
.social-network a.icoLinkedin:hover {
background-color:#007bb7;
}
.social-network a.icoRss:hover i, .social-network a.icoFacebook:hover i, .social-network a.icoTwitter:hover i, 
.social-network a.icoGoogle:hover i, .social-network a.icoVimeo:hover i, .social-network a.icoLinkedin:hover i {
color:#fff;
}
a.socialIcon:hover, .socialHoverClass {
color:#44BCDD;
}
.social-circle li a {
display:inline-block;
position:relative;
margin:0 auto 0 auto;
-moz-border-radius:50%;
-webkit-border-radius:50%;
border-radius:50%;
text-align:center;
width: 50px;
height: 50px;
font-size:20px;
}
.social-circle li i {
margin:0;
line-height:50px;
text-align: center;
}
.social-circle li a:hover i, .triggeredHover {
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-ms--transform: rotate(360deg);
transform: rotate(360deg);
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
-o-transition: all 0.2s;
-ms-transition: all 0.2s;
transition: all 0.2s;
}
.social-circle i {
color: #fff;
-webkit-transition: all 0.8s;
-moz-transition: all 0.8s;
-o-transition: all 0.8s;
-ms-transition: all 0.8s;
transition: all 0.8s;
} .stats .icon {
margin: 0 0 20px 0;
}
.stats strong.number {
font-size: 38px;
}
.stats span.text {
font-weight: 700;
font-size: 24px;
} .btn {
border: 0;
}
.btn.bold {
font-weight: 600;
}
.btn-cta {
color: #ffffff;
border-bottom: 4px solid;
}
.btn-cta:hover {
color: #ffffff;
}
.btn-cta.btn-lg {
border-bottom: 4px solid;
}
.btn-1 {
display: inline-block;
font-weight: 500;
font-size: 22px;
padding: 0px 20px;
height: 54px;
text-align: center;
text-decoration: none;
line-height: 54px;
outline: none;
color: #fff;
background-color: #c89637;
border-radius: 5px;
opacity: 0.9
}
.btn-1:hover {
background-color: #c89637;
color: #fff;
opacity: 0.8
}
.btn-1::before,
.btn-1::after {
position: absolute;
z-index: -1;
display: block;
content: '';
}
.btn-1,
.btn-1::before,
.btn-1::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .3s;
transition: all .3s;
}
.btn-2 {
display: inline-block;
font-weight: 500;
font-size: 16px;
width: 120px;
height: 35px;
text-align: center;
text-decoration: none;
line-height: 40px;
outline: none;
color: #fff;
background-color: #c89637;
border-radius: 5px;
opacity: 0.9
}
.btn-2:hover {
background-color: #c89637;
color: #fff;
opacity: 0.8
}
.btn-2::before,
.btn-2::after {
position: absolute;
z-index: -1;
display: block;
content: '';
}
.btn-2,
.btn-2::before,
.btn-2::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .3s;
transition: all .3s;
}
.btn-kikkou {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/themes/miyajima-soy/img/btn-kikkou.png);
background-repeat: no-repeat;
background-size: 24px auto;
background-position: left center;
padding-left: 40px;
} @media (min-width: 959px) and (max-width: 1199px) {
.navbar-nav {
margin-top: 0px;
}
}
@media only screen and (min-device-width : 979px) and (max-device-width : 1024px)  {
.navbar-nav {
margin-top: 0px;
}
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
.navbar-nav {
margin-top: 0px;
}
}
@media (max-width: 767px) {
.navbar.navbar-fixed-top {
background-color:rgba(200,0,0,1);
}
.navbar .navbar-collapse ul.nav {
background-color: #f0e6d2;
width: 100%;
float: none;
margin:0;
padding:0;
}
.navbar .navbar-collapse ul.nav li {
border-bottom: 1px solid #143764;
}
.nav>li>a {
color: #143764;
}
.nav>li>a:hover {
color: #143764;
}
.navbar .navbar-nav > .active > a {
color: #143764;
}	
.team-member,.col-lg-4 {
margin-bottom: 30px;
}	
.stats .col-md-3 {
margin-bottom: 30px;
}
}
.top100 {
margin-top: 100px;
}
.top030 {
margin-top: 30px;
}
.btn-sq-lg {
width: 150px !important;
height: 150px !important;
font-size: 10px;
}
.btn-sq {
width: 100px !important;
height: 100px !important;
font-size: 10px;
}
.btn-sq-sm {
width: 50px !important;
height: 50px !important;
font-size: 10px;
}
.btn-sq-xs {
width: 25px !important;
height: 25px !important;
padding: 2px;
}
#fh5co-footer {
padding-bottom: 0;
background-color:#f0e6d2 ;
padding-top: 30px;
}
#fh5co-footer a {
color: #56626d;
}
#fh5co-footer a:hover {
text-decoration: underline;
}
@media screen and (max-width: 992px) {
#fh5co-footer .fh5co-footer-widget {
margin-bottom: 30px;
float: left;
width: 100%;
}
}
#fh5co-footer .fh5co-footer-widget h3 {
font-size: 18px;
font-weight: 400;
}
#fh5co-footer .fh5co-footer-widget .fh5co-links {
padding: 0;
margin: 0;
}
#fh5co-footer .fh5co-footer-widget .fh5co-links li {
padding: 0;
margin: 0;
list-style: none;
margin-bottom: 10px;
line-height: 15px;
font-weight: 400;
font-size: 14px;
}
#fh5co-footer .fh5co-footer-widget .fh5co-links li a {
color: #56626d;
}
#fh5co-footer .fh5co-footer-widget .fh5co-links li a:hover {
text-decoration: underline;
}
#fh5co-footer .fh5co-copyright {
border-top: 1px solid #f0f2f3;
padding: 40px 0;
}
#fh5co-footer .fh5co-copyright a {
font-weight: 700;
}
#fh5co-footer .fh5co-copyright p {
margin-bottom: 0;
}
#fh5co-footer .fh5co-copyright p small {
font-size: 15px;
}
#fh5co-footer .fh5co-copyright .fh5co-left {
float: left;
}
#fh5co-footer .fh5co-copyright .fh5co-right {
float: right;
}
@media screen and (max-width: 768px) {
#fh5co-footer .fh5co-copyright .fh5co-right {
float: left;
}
}
#fh5co-features .fh5co-devices {
margin-bottom: 40px;
}
#fh5co-features .fh5co-devices img {
margin: 0 auto;
}
.fh5co-lead {
font-size: 50px;
font-weight: 300;
color: #484c50;
margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
.fh5co-lead {
font-size: 35px;
}
}
.btn {
margin-right: 4px;
margin-bottom: 4px;
font-family: YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 16px;
font-weight: 400;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
border-radius: 4px;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
}
.btn-primary {
background: #8dc63f;
color: #fff;
border: 2px solid #8dc63f;
}
.mg50 {
margin-top: 50px;
}
.mg100 {
margin-top: 100px;
}
.mg150 {
margin-top: 150px;
}
.pdl50 {
padding-left: 50px;
}
.basic {
text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
}
@media screen and (max-width: 767px){
.spnone { display: none;}
}
.b-l-red {
border-left: 8px solid #c80000;
padding-left: 5px;
}
.b-l-green {
border-left: 8px solid #78cdd1;
padding-left: 5px;
}
.b-l-yellow {
border-left: 8px solid #f9a754;
padding-left: 5px;
}
.b-l-pink {
border-left: 8px solid #f698a5;
padding-left: 5px;
}
.b-l-blue {
border-left: 8px solid #71b1e1;
padding-left: 5px;
}
.marker_yellow {
background: linear-gradient(transparent 80%, #f9a754 80%);
}
.marker_pink {
background: linear-gradient(transparent 80%, #f698a5 80%);
}
.marker_blue {
background: linear-gradient(transparent 80%, #71b1e1 80%);
}
.b-b-red {
border-bottom: 3px solid #c80000;
padding-bottom: 3px;
}
.bg-gray {
background-color: #ededed;
padding: 20px 0px 20px 20px;
border-radius: 5px;
}
.bg-red {
background-color: #c80000;
padding: 10px;
opacity: 0.8;
border-radius: 5px;
}
.bg-green {
background-color: #14cc14;
padding: 10px;
opacity: 0.8;
}
.bg-green2 {
background-color: #00cccc;
padding: 10px;
opacity: 0.8;
}
.bg-lightgreen {
background-color: #E8FBE8;
padding: 30px 0px;
border-radius: 5px;
}
.dot-hr { border-top: 1px dashed; }
.dot-r-hr {
border-top: 1px dashed;
color: #c80000;
}
.news-hr {
border-top: 1px solid #ccc;
margin-top: 5px;
margin-bottom: 20px;
}
.white-link a:link {
color: #ffffff;
display: block;
}
.white-link a:visited {
color: #ffffff;
display: block;
}
.white-link a:hover {
color: #ffffff;
display: block;
}
.white-link a:active {
color: #ffffff;
display: block;
}
.indent-05em {
text-indent: 0.5em;
}
.txt-red {color:red;}
.txt-blue {color:blue;}
.txt-black {color:black;}
.txt-spicy {color: #edb918;} 　  .runrrun li {
color: #000037;
font-size: 16px;
font-weight: 600;
}
.runrrun h1 {
color: #000037;
font-size: 22px;
text-align: center;
}
.runrrun p {
color: #000037;
font-size: 18px;
font-weight: 400;
line-height: 1.8em;
text-indent: 1em;
}
.runrrun a:link {
color: #d13636;
}
.runrrun a:visited {
color: #d13636;
}
.runrrun a:hover {
color: #33ffff;
}
.runrrun a:active {
color: #d13636;
}
.runrrun hr {
color: #d13636;
border-top: 3px solid #d13636;
margin-top: 30px;
margin-bottom: 30px;
}
.runrrun img.run-img {
display: block;
margin-right: auto;
margin-left: auto;
margin-top: 30px;
margin-bottom: 30px;
max-width: 100%;
height: auto;
}
.box-run {
border: 3px solid #d13636;
border-radius: 10px;
background-color: #ffe8f3;
padding: 10px;
}
.box-run P {
line-height: 1.6em;
}
.r-index {
margin: 10px;
}
.r-index div {
color: #000037;
font-size: 16px;
font-weight: 500;
margin-bottom: 10px;
}
.runrrun .thumbnail > .caption {
height: 200px;
} .denjiro h1 {
color: #004000;
font-size: 22px;
}
.denjiro li {
list-style-type: square;
color: #004000;
font-size: 16px;
font-weight: 500;
margin-bottom: 15px;
}
.denjiro p {
color: #004000;
font-size: 18px;
font-weight: 400;
line-height: 1.8em;
text-indent: 1em;
}
.denjiro .thumbnail > .caption {
height: 80px;
}
.denjiro a:link {
color: #004000;
}
.denjiro a:visited {
color: #004000;
}
.denjiro a:hover {
color: #d13636;
}
.denjiro a:active {
color: #004000;
} .kyoka h1 {
color: #000000;
font-size: 22px;
text-align: center;
}
.kyoka h2 {
color: #000000;
font-size: 20px;
font-weight: 600;
}
.kyoka h3 {
color: #000000;
font-size: 18px;
font-weight: 800;
}
.kyoka-cap {
color: #000000;
font-size: 16px;
font-weight: 800;
line-height: 1.4em;
}
.kyoka p {
color: #000000;
font-size: 18px;
font-weight: 400;
line-height: 1.8em;
text-indent: 1em;
}
.kyoka a:link {
color: #004d99;
}
.kyoka a:visited {
color: #004d99;
}
.kyoka a:hover {
color: #d13636;
}
.kyoka a:active {
color: #004d99;
}
.kyoka hr {
color: #5f7c3f;
border-top: 3px solid #5f7c3f;
margin-top: 40px;
margin-bottom: 40px;
}
.kyoka img.kyoka-img {
display: block;
margin-right: auto;
margin-left: auto;
margin-top: 30px;
margin-bottom: 30px;
max-width: 100%;
height: auto;
}
.k-index {
background-color: #e9e9e9;
border-radius: 10px;
}
.kyoka li {
margin-bottom: 10px;
font-weight: 500;
}
.kyoka-table td {
border: 2px #000000 solid;
padding: 5px 5px 5px 5px;
vertical-align: top;
} .challenge div.col-xs-6 {
padding: 0px 5px;
}
.challenge .thumbnail > .caption {
height: 230px;
}
.lets img.lets-img {
display: block;
margin-right: auto;
margin-left: auto;
margin-top: 30px;
margin-bottom: 30px;
max-width: 100%;
height: auto;
}
.cha-m {
color: #FF0000;
font-weight: 800;
}
.cha-e {
color: #ff69b4;
font-weight: 800;
}
.cha-n {
color: #000080;
font-weight: 800;
}
.cha-o {
color: #006400;
font-weight: 800;
}
.cha-r {
color: #800080;
font-weight: 800;
} .lets-cap {
color:#333;
font-size: 16px;
font-weight: 600;
margin-top: -20px;
line-height: 1.4em;
}
.lets p {
font-size: 18px;
font-weight: 400;
line-height: 1.8em;
} .mmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.mmap iframe,
.mmap object,
.mmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} .recipe {
color: #4b413c;
background-color: #FFFFFF;
    }
.recipe h1 {
margin-top: 20px;
color:#595655;
padding: 0.25em 0.5em; background: transparent; border-left: solid 5px #ffd966 }
.recipe h3 {
color: #4b413c;
font-size: 20px;
font-weight: 600;
}
.recipe h4 {
color: #4b413c;
font-size: 18px;
font-weight: 600;
}
.recipe h5 {
color: #4b413c;
font-size: 14px;
font-weight: 600;
}
.recipe h6 {
color: #4b413c;
font-size: 12px;
font-weight: 600;
}
.recipe hr.style1{
border-top: 1px dashed #f0bea0;
border-bottom: 1px dashed #fff;
}
.recipe hr.style2{
background-color: #f0bea0;
border-top: 2px dotted #f0bea0;
}
.recipe box5 {
background-color: #F0A830;
border: 2px solid #fff;
box-shadow: 0 0 0 2px #cafbce;
color: #FCEBB6;
margin: 2em 0;
padding: 2em;
}
.border_radius img {
border-radius: 5px 5px 5px 5px;
max-width: 100%;
height: auto;
}
.frame img {
display: inline-block;
max-width: 100%;
margin-right: auto;
margin-left: auto;
height: auto;
padding: 4px;
line-height: 1.428571429;
background-color: #fff;
border: 1px solid #ddd;
border-radius: 4px;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.responsive img {
display: block;
margin-right: auto;
margin-left: auto;
max-width: 100%;
height: auto;
}
.group {
list-style-type: none;
padding-left: 1em;
}
.recipebox {
padding: 1.5em;
margin: 1em 0;
color: #2c2c2f;
background: #ffd966; border-radius: 10px; }
.a{
　text-decoration: none;
}
.a:hover{
　text-decoration: underline;
color:#;
} .proframe img {
display: block;
max-width: 100%;
height: auto;
margin-bottom: 20px;
}
.lineupframe img {
display: block;
max-width: 100%;
height: auto;
margin-top: 20px;
}
.lineupframe h6 {
height: 60px;
}
table.gaiyo {
width: 100%;
border-collapse: collapse;
text-align: left;
line-height: 1.5;
margin-bottom: 20px;
}
table.gaiyo td,table.gaiyo th {
width: 150px;
padding: 5px;
vertical-align: top;
border: 1px solid #ccc;
}
table.material {
width: 100%;
border-collapse: collapse;
text-align: left;
line-height: 1.5;
}
table.material td {
width: 150px;
padding: 5px;
vertical-align: top;
border: 1px solid #ccc;
}
table.material th {
vertical-align:middle;
width: 50px;
padding: 5px;
border: 1px solid #ccc;
background-color: #ebe6dc;
}
.product h1 {
font-size: 28px;
border-left: 8px solid #c80000;
padding-left: 5px;
margin-top: 30px;
}
.product h2 {
font-size: 28px;
border-left: 8px solid #c80000;
padding-left: 5px;
}
.product h3 {
font-size:30px;
margin-top: 30px;
}
.product h5 {
border-bottom: 1px solid #c3191e;
font-size:18px;
color:#46413c;
}
.product h6 {
font-size:16px;
color:#c3191e;
}
.product a:visited {
color: #c3191e;
}
.product a:hover {
color: #c3191e;
}
.product a:active {
color: #c3191e;
}
.product p {
font-weight: 500;
}
.product .thumbnail > .caption {
height: 80px;
} table.company01 {
border-collapse: separate;
border-spacing: 0;
text-align: left;
line-height: 1.5;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
table.company01 th {
width: 180px;
padding: 10px;
font-weight: bold;
vertical-align: top;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-top: 1px solid #fff;
border-left: 1px solid #fff;
background: #eee;
}
table.company01 td {
padding: 10px;
vertical-align: top;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
table.company02 {
border-collapse: separate;
border-spacing: 1px;
text-align: left;
line-height: 1.5;
border-top: 1px solid #ccc;
}
table.company02 td.col01 {
padding: 10px;
vertical-align: top;
border-bottom: 1px solid #ccc;
}
table.company02 td.col02 {
padding: 10px;
vertical-align: top;
border-bottom: 1px solid #ccc;
}
table.company03 {
border-collapse: separate;
border-spacing: 1px;
text-align: left;
line-height: 1.5;
border-top: 1px solid #ccc;
}
table.company03 th {
width: 280px;
padding: 10px;
vertical-align: top;
border-bottom: 1px solid #ccc;
}
table.company03 td {
width: 400px;
padding: 10px;
vertical-align: top;
border-bottom: 1px solid #ccc;
}
#profile04 hr {
border-top: 1px solid #ccc;
margin-top: 10px;
margin-bottom: 10px;
}
.vap-box1 {
border-radius: 10px;
font-size: 16px;
background-color: #e8ffe8;
padding: 20px;
}
table.company05 {
border-collapse: separate;
border-spacing: 0;
text-align: left;
line-height: 1.5;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
.act-box1 {
border-radius: 10px;
font-size: 16px;
background-color: #f7d7ba;
padding: 20px;
}
.act-box2 {
border-radius: 10px;
font-size: 22px;
line-height:2.5em;
background-color: #ebedfc;
padding: 40px;	
} table.recruit01 {
border-collapse: separate;
border-spacing: 0;
text-align: left;
line-height: 1.5;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
table.recruit01 th {
width: 90px;
padding: 10px;
font-weight: bold;
vertical-align: top;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-top: 1px solid #fff;
border-left: 1px solid #fff;
background: #eee;
}
table.recruit01 td {
padding: 10px;
vertical-align: top;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
} .factory p {
text-indent: 1em;
}
.factory-img {
font-size: 15px;
font-weight: 600;
text-align: center;
}
.factory .thumbnail > .caption {
height: 40px;
}
.btn-contact {
font-size:20px;
background-color: #c89637;
padding: 10px;
border-radius: 10px;
height: 40px;
width: 300px;
} table.tour th {
width: 120px;
padding: 10px;
font-weight: bold;
vertical-align: top;
border: 1px solid #ccc;
background: #eee;
}
table.tour td {
padding: 10px;
vertical-align: top;
border: 1px solid #ccc;
} .box1 {
border: 3px solid #C2E3E8;
border-radius: 5px;
margin: 2em 0;
padding: 2em;
}
.box-2 {
border-left: 8px solid #C2E3E8;
margin: 1em 0;
padding: 1em;
}
.bg-lblue {
background-color: #C2E3E8;
padding: 20px 0px 20px 20px;
border-radius: 5px;
}
.step{
font-weight: bold;
position: relative;
width:200px;
background: #BA68C8;
padding: 1em;
margin-bottom: 1em;
text-align:center;
color: #fff;
}
.step:after{
content: "";
position: absolute;
width: 0;
height: 0;
bottom: -10px;
left: 0;
border-style: solid;
border-color: #BA68C8 transparent transparent transparent;
border-width: 10px 100px 0 100px;
z-index: 1;
}
.request{
background: #FF5252;
font-weight: bold;
position: relative;
width:200px;
padding: 1em;
margin-bottom: 1em;
text-align:center;
color: #fff;
}
.request:after{
border-color: #FF5252 transparent transparent transparent;
content: "";
position: absolute;
width: 0;
height: 0;
bottom: -10px;
left: 0;
border-style: solid;
border-width: 10px 100px 0 100px;
z-index: 1;
}
.design{
background: #42A5F5;
font-weight: bold;
position: relative;
width:200px;
padding: 1em;
margin-bottom: 1em;
text-align:center;
color: #fff;
}
.design:after{
border-color: #42A5F5 transparent transparent transparent;
content: "";
position: absolute;
width: 0;
height: 0;
bottom: -10px;
left: 0;
border-style: solid;
border-width: 10px 100px 0 100px;
z-index: 1;
}
.trial{
background: #FFCA28;
font-weight: bold;
position: relative;
width:200px;
padding: 1em;
margin-bottom: 1em;
text-align:center;
color: #fff;
}
.trial:after{
border-color: #FFCA28 transparent transparent transparent;
content: "";
position: absolute;
width: 0;
height: 0;
bottom: -10px;
left: 0;
border-style: solid;
border-width: 10px 100px 0 100px;
z-index: 1;
}
.agreement{
background: #8BC34A;
font-weight: bold;
position: relative;
width:200px;
padding: 1em;
margin-bottom: 1em;
text-align:center;
color: #fff;
}
.agreement:after{
border-color: #8BC34A transparent transparent transparent;
content: "";
position: absolute;
width: 0;
height: 0;
bottom: -10px;
left: 0;
border-style: solid;
border-width: 10px 100px 0 100px;
z-index: 1;
} .c-panel-height {
height: 240px;
}
.run-panel-height {
height: 240px;
}
.p-panel-height {
height: 240px;
} .card {
color:#595655;
background: #fff;
border-radius: 5px;
box-shadow: 0 2px 5px #ccc;
}
.card-img {
border-radius: 5px 5px 5px 5px;
max-width: 100%;
height: auto;
}
.card-content {
color:#595655;
padding: 2px;
}
.card-title {
color:#595655;
 font-size: 19px;
 margin-bottom: 3px;
text-align: center;
}
.card-text {
color:#595655;
font-size: 14px;
}
.card-link {
text-align: center;
border-top: 1px solid #eee;
padding: 10px;
}
.card-link a {
text-decoration: none;
color: #0bd;
margin: 0 10px;
}
.recipetop a {
color:#4a4746;
}
.recipetop h2 {
color:#595655;
border-bottom: solid 2px #ffd966;
}
.recipetop h4 {
color:#595655;
line-height:3;
}
@media only screen and (max-device-width: 480px) {
.recipetop h4 {
color:#595655;
line-height:1;
}
}
.recipetop h5 {
color:#595655;
}
.line-height2 {
line-height:1;
} .campaign p {
font-size: 18px;
font-weight: 400;
line-height: 1.6em;
}
.campaign-box {
border-radius: 30px;
}
.campaign-box2 p {
font-size: 15px;
background-color: #00cccc;
padding: 8px 0px 5px 0px;
border-radius: 5px;
height: 40px;
width: 250px;
}
.campaign-box3 p {
font-size: 30px;
background-color: #00cccc;
padding: 5px 0px 5px 0px;
border-radius: 5px;
height: 50px;
width: 300px;
} .box18{
margin:0em;
color:#595655;
position: relative;
padding: 0.25em 1em;
border: solid 2px #ffd966;
border-radius: 5px;
}
.box18 p {
margin: 0; 
padding: 0;
}
.menu {
position: relative;
width: 100%;
height: 50px;
max-width: 1000px;
margin: 0 auto;
z-index:100;
}
.menu > li {
list-style-type: none;
width:80%;
height: 35px;
line-height: 35px;
border-radius: 3px 3px 3px 3px;
background: rgb(255, 217, 102);
}
.menu > li a {
display: block;
color: #999;
}
.menu > li a:hover {
color: #999;
}
ul.menu__second-level {
visibility: hidden;
opacity: 0;
z-index: 1;
}
ul.menu__third-level {
visibility: hidden;
opacity: 0;
}
ul.menu__fourth-level {
visibility: hidden;
opacity: 0;
}
.menu > li:hover {
background: #ffd966;
-webkit-transition: all .5s;
transition: all .5s;
}
.menu__second-level li {
list-style-type:none;
}
.menu__third-level li {
border-top: 1px solid #111;
}
.menu__second-level li a:hover {
background: #f5deb3;
}
.menu__third-level li a:hover {
background: #f5deb3;
}
.menu__fourth-level li a:hover {
background: #f5deb3;
} .init-bottom:after {
content: '';
display: inline-block;
width: 6px;
height: 6px;
margin: 0 0 0 15px;
border-right: 1px solid #999;
border-bottom: 1px solid #999;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
} .menu:before,
.menu:after {
content: " ";
display: table;
}
.menu:after {
clear: both;
}
.menu {
*zoom: 1;
}
li.menu__mega ul.menu__second-level {
position: absolute;
top: 40px;
left: 0;
box-sizing: border-box;
width: 100%;
padding: 20px 2%;
background: #ffd966;
-webkit-transition: all .2s ease;
transition: all .2s ease;
border-radius: 3px 3px 3px 3px;
}
li.menu__mega:hover ul.menu__second-level {
top: 50px;
visibility: visible;
opacity: 1;
}
li.menu__mega ul.menu__second-level > li {
float: left;
width: 32%;
border: none;
}
li.menu__mega ul.menu__second-level > li:nth-child(3n+2) {
margin: 0 1%;
}
.menu > li.menu__single {
position: relative;
}
li.menu__single ul.menu__second-level {
position: absolute;
top: 40px;
width: 100%;
background: #ffd966;
-webkit-transition: all .2s ease;
transition: all .2s ease;
}
li.menu__single:hover ul.menu__second-level {
top: 50px;
visibility: visible;
opacity: 1;
}
#menu{
width: 100%;
margin: 0 auto;
background: #FFD966;
}
#menu-inner{
width: 100%;
height: 40px;
margin: 0 auto;
background: #FFD966;
}
#menu-btn{display: none;}
#menu-content{
padding-left: 0;
margin: 0 auto;
width: 1000px;
height: 100%;
list-style-type: none;
}
#menu-content > li{
position: relative;
float: left;
height: 100%;
text-align: center;
}
#menu-content > li > a{
position: relative;
display: block;
height: 100%;
padding-left: 15px;
padding-right: 15px;
line-height: 40px;
background: #FFD966;
color:#595655;
font-size: 100%;
text-decoration: none;
z-index: 2;
}
#menu-content > li > a:hover{
background: #f5deb3;
color:#595655;
opacity: 0.8;
}
#menu-content > li > a > .blogicon-chevron-down{margin-right: 5px;} #menu-content > li > ul.second-content{
visibility: hidden;
position: absolute;
top: 0;
margin: 0;
padding-left: 0;
list-style-type: none;
z-index: -100;
}
#menu-content > li:hover > ul.second-content{
visibility: visible;
top: 40px;
z-index: 100;
transition: all .3s;
}
#menu-content > li > ul.second-content > li{
text-align: center;
width: 200px;
height: 40px;
position: relative;
}
#menu-content > li > ul.second-content > li > a{
display: block;
line-height: 40px;
background: #FFD966;
color:#595655;
font-size: 100%;
text-decoration: none;
}
#menu-content > li > ul.second-content > li > a:hover{
background: #f5deb3;
color:#595655;
} li.third {
list-style-type: none;
}
ul.third-content {
position: absolute;
visibility: hidden;
}
#menu-content > li.first-content > ul.second-content > li > ul.third-content {
visibility: hidden;
position: absolute;
top: 0;
margin: 0;
padding-left: 0;
list-style-type: none;
z-index: -200;
}
#menu-content > li > ul.second-content > li:hover > ul.third-content {
visibility: visible;
top: 0;
left: 200px;
z-index: 200;
transition: all .3s;
background: #f5deb3;
color:#595655;
}
#menu-content > li > ul.second-content > li > ul.third-content > li{
text-align: center;
width: 200px;
height: 40px;
position: relative;
background: #FFD966;
color:#595655;
}
#menu-content > li > ul.second-content > li > ul.third-content > li > a{
display: block;
line-height: 40px;
background: #FFD966;
color:#595655;
font-size: 100%;
text-decoration: none;
}
#menu-content > li > ul.second-content > li > ul.third-content > li > a:hover{
background: #f5deb3;
color:#595655;
} @media screen and (max-width:960px){
#menu-inner{
width: 100%;
height: auto;
}
#btn-content{text-align: center;}
#menu-btn{
display: inline-block;
padding: 8px 15px;
margin: 5px;
cursor: pointer;
background: #FFD966;
color:#595655;
font-size: 100%;
}
#menu-content{
display: none;
width: 100%;
}
#menu-content > li{
width: 100%;
height: 40px;
float: none;
}
#menu-content > li > a{
width: 100%;
line-height: 40px;
padding: 0;
text-decoration: none;
} #menu-content > li:hover > ul.second-content{display: none;}
#menu-content > li > a > .blogicon-chevron-down{display: none;}
} .recipesearch{
background-color:#f0e6d2;	
} li.article-list {
list-style: none;
margin-bottom: 10px;
}
span.article-cat {
display: inline-block;
width: 125px;
height: 22px;
line-height: 22px;
text-align: center;
margin: 0px 0px 0px 15px;
font-size: 13px;
font-weight: 400;
}
.article-title,.article-date {
display: inline-block;
height: 22px;
line-height: 22px;
font-size: 15px;
font-weight: 500;
}
span.article-new {
display: inline-block;
width: 30px;
height: 22px;
line-height: 22px;
text-align: center;
font-size: 10px;
} span.new-column { background: #ebeb00; }
span.new-recipe { background: #ffd966; }
span.new-product { background: #82ceca; }
span.new-g_product { background: #e363ed; }
span.new-campaign { background: #FFA5A5; }
span.new-csr { background: #00c763; }
span.news { background: #ed9c00; }
.news-box
{
border: 3px solid #c80021;
border-radius: 10px;
padding: 10px 10px 0px 0px;
} .shikokumai-box
{
border: 3px solid #cc0033;
border-radius: 10px;
padding: 20px;
} .youtube {
position: relative;
width: 100%;
padding-top: 56.25%;
}
.youtube iframe{
position: absolute;
top: 0;
right: 0;
width: 100% !important;
height: 100% !important;
} .pager{
text-align:center;
}
a.page-numbers,
.pager .current{
background:rgba(0,0,0,0.02);
border:solid 1px rgba(0,0,0,0.1);
border-radius:5px;
padding:5px 8px;
margin:0 2px;
}
.pager .current{
background:rgba(0,0,0,1);
border:solid 1px rgba(0,0,0,1);
color:rgba(255,255,255,1);
} nav#filter a {
background-color: #1d89ff;
color:#555;
}
nav#filter a:hover, nav#filter a.current {
background-color: #1d89ff;
color:#fff;
} .isotopeWrapper article{
margin-bottom: 30px;
}
#portfolio img  {
width:100%;
}
#portfolio article p {
margin-bottom:1.45em; }
nav#filter {
margin-bottom:1.5em;
}
nav#filter li {
display:inline-block;
margin:0 0 0 5px;
}
nav#filter a {
padding: 4px 12px;
line-height: 20px;
text-decoration: none;
}
.portfolio-items article img {width:100%;} 
.portfolio-item {
display: block;
position: relative;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.portfolio-item img {
}
.portfolio-item .portfolio-desc {
display: block;
opacity: 0;
position: absolute;
width: 100%;
left: 0;
top: 0;
color: rgba(255,255,255,1);
background: rgba(50,0,0,0.9);
}
.portfolio-item:hover .portfolio-desc {
padding-top: 20%;
height: 100%;
transition: all 200ms ease-in-out 0s;
opacity: 1;
}
.portfolio-item .portfolio-desc a {
color: #ffffff;
}
.portfolio-item .portfolio-desc a:hover { text-decoration: none;
}
.portfolio-item .portfolio-desc .folio-info {
top:-20px;
padding: 10px;
height: 0;
opacity: 0;
position: relative;
}
.portfolio-item:hover .folio-info{
height: 100%;
opacity: 1;
transition: all 500ms ease-in-out 0s;
top:4px;
}
.portfolio-item .portfolio-desc .folio-info p {
color: #143764;
font-size: 11px;
}
.box5 {
padding: 0.5em 1em;
margin: 0.5em 0;
color: #ffffff;
background: #320000; border-bottom: solid 3px #c80000;
}
.box5 p {
margin: 0; 
padding: 0;
font-size: 17px;
}
.box6 {
padding: 0.5em 1em;
margin: 2em 0;
background: #FFF;
border: solid 2px #f0bea0; border-radius: 5px; }
.box6 p {
margin: 0; 
padding: 0;
} .season h1{
color:#4b413c;
}
.box7 {
padding: 0.1em 0.1em ;
margin: 0.1em 0.1em 0.1em 0em;
font-size: 20px;
text-align: center;
color: #4b413c; background: #FFF;
border: solid 2px #ffd966; border-radius: 8px; }
.box7 p {
margin:0.1em;
padding: 0.1em;
} section#section-recipe {
background: #fff9a6;
}
.box8 {
padding: 1em 1em;
margin: 1em 0;
background: #FFF;
border: solid 2px #fff9a6; border-radius: 5px; } .fc-sc {
color: #5e0000;
}
.bg-sc {
background-color: #5e0000;
padding: 10px;
border-radius: 5px;
}
.bg-sc-y {
background-color: #ffe100;
padding: 10px;
border-radius: 5px;
} .box26 {
position: relative;
margin: 2em 0;
padding: 0.5em 1em;
border: solid 2px #f0bea0;
border-radius: 8px;}
.box26 img{position:absolute;
left:0;
top:0;}
.box26 .box-title {
position: absolute;
display: inline-block;
top: -13px;
left: 10px;
padding: 0 9px;
line-height: 1;
font-size: 19px;
background: #FFF;
color:#143764;
}
.box26 p {
margin: 1px; 
padding: 1px;
color:#143764;
} .card2 {
color:#595655;
background: #fff;
border-radius: 5px;
 height:270px;
padding-bottom:20px;	
}
.card2-img {
border-radius: 5px 5px 5px 5px;
max-width: 100%;
height: auto;
}
.card2-content {
color:#595655;
}
.card2-text {
color:#595655;
font-size: 14px;
} .header-border {
border-bottom:solid 1px #222;
padding-bottom:10px
} table.part-time{
border-collapse: separate;
border-spacing: 0;
text-align: left;
line-height: 1.5;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
table.part-time th {
width:90px;
padding: 10px;
font-weight: bold;
vertical-align: top;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-top: 1px solid #fff;
border-left: 1px solid #fff;
background: #eee;
}
table.part-time td {
padding: 10px;
vertical-align: top;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
} .recruitbox01{
display: block; 
padding: 1em;
margin: 1em 0;
background: #78CDD1; border-radius: 10px; }
.recruitbox01 p{
font-size: 20px;
margin: 0; 
padding: 0;
text-align: center;
color: #fff;
}
.recruitbox02{
display: block; 
padding: 1em;
margin: 1em 0;
background: #71B1E1; border-radius: 10px; }
.recruitbox02 p{
font-size: 20px;
margin: 0; 
padding: 0;
text-align: center;
color: #fff;
}
.recruitbox03{
display: block; 
padding: 1em;
margin: 1em 0;
background: #F9A754; border-radius: 10px; }
.recruitbox03 p{
font-size: 20px;
margin: 0; 
padding: 0;
text-align: center;
color: #fff;
}
.recruitbox04{
display: block; 
padding: 1em;
margin: 1em 0;
background: #F698A5; border-radius: 10px; }
.recruitbox04 p{
font-size: 20px;
margin: 0; 
padding: 0;
text-align: center;
color: #fff;
}
.recruitbox5 {
padding: 0.5em 1em;
margin: 2em 0;
background: #FFF;
border: solid 2px #78cdd1; border-radius: 10px; }
.recruitbox5 p {
margin: 0; 
padding: 0;
}
.recruitbox6 {
padding: 0.5em 1em;
margin: 2em 0;
background: #FFF;
border: solid 2px #f698a5; border-radius: 10px; }
.recruitbox6 p {
margin: 0; 
padding: 0;
}
.recruitbox7 {
padding: 0.5em 1em;
margin: 2em 0;
background: #FFF;
border: solid 2px #71b1e1; border-radius: 10px; }
.recruitbox7 p {
margin: 0; 
padding: 0;
}
.recruitbox8 {
padding: 0.5em 1em;
margin: 2em 0;
background: #FFF;
border: solid 2px #f9a754; border-radius: 10px; }
.recruitbox8 p {
margin: 0; 
padding: 0;
}
.recruit a:link {
color: #d13636;
}
.recruit a:visited {
color: #d13636;
}
.recruit a:hover {
color: #d13636;
}
.recruit a:active {
color: #d13636;
}
.square_btn{
display: inline-block;
display: block; 
padding:  1em;
text-decoration: none;
background: #78cdd1; color: #FFF;
border-bottom: solid 4px #49adb2;
border-radius: 10px;
}
.square_btn p{
margin: 0; 
padding: 0;
text-align: center;
color: #fff;
}
.square_btn:active { -ms-transform: translateY(4px);
-webkit-transform: translateY(4px);
transform: translateY(4px); border-bottom: none; }
.square_btn01{
display: inline-block;
display: block;
padding:0.5em;
   text-decoration: none;
background: #3300ff; color: #ffffff;
   border-bottom: solid 4px #42466F;
border-radius: 10px;
}
.square_btn01 p{
color: #ffffff;
font-size: 22px;
text-align: center;
}
.square_btn01:active { -ms-transform: translateY(4px);
-webkit-transform: translateY(4px);
transform: translateY(4px); border-bottom: none; }
.employee h4{
line-height:1.4em;
} .card {
color:#595655;
background: #fff;
border-radius: 5px;
box-shadow: 0 2px 5px #ccc;
}
.card-img {
border-radius: 5px 5px 5px 5px;
max-width: 100%;
height: auto;
}
.card-content {
color:#595655;
padding: 2px;
}
.card-title {
color:#595655;
 font-size: 19px;
margin-bottom: 3px;
text-align: center;
}
.card-text {
color:#595655;
font-size: 14px;
}
.card-link {
text-align: center;
border-top: 1px solid #eee;
padding: 10px;
}
.li {
display: inline;
padding: 0 5px;
} @media (max-width: 480px) {
.ramentop {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/product/yakiramentopsm.gif);
background-size:contain;
padding-top:60px;
background-color: #000000;
background-repeat: no-repeat;
background-position:center;
}
}
@media(min-width:481px){
.ramentop{
background-image:url(https://www.miyajima-soy.co.jp/wp-content/uploads/product/ramentop9.png);
padding-top:580px;
background-color:#000000;
margin-bottom:-50px;
background-repeat:no-repeat;
background-position:center;
background-size:contain;
}
}
.ramenfeature{background:#FBEFE5;}
.ramenrecipe{background:#fce7d1;}
.ramenproduct{background:#ffffff;}
.ramenset{background:#ffffff;}
.top{background:#000000;}
.second{background:#fffaf0;} .pc { display: block !important;
height: auto;
max-width: 100%;
text-align:center;}
.sp { display: none !important; 
height: auto;
max-width: 100%;
text-align:center;} @media only screen and (max-width: 750px) {
.pc { display: none !important; 
height: auto;
max-width: 100%;
text-align:center;}
.sp { display: block !important; 
height: auto;
max-width: 100%;
text-align:center;
}}
table.productexe {
width: 100%;
border-collapse: collapse;
text-align: left;
line-height: 1.5;
}
table.productexe td {
width: 150px;
padding: 5px;
vertical-align: top;
border: 1px solid #ccc;
background-color: #ffffff;
}
table.productexe th {
vertical-align:middle;
width: 50px;
padding: 5px;
border: 1px solid #ccc;
background-color: #ffffff;
}
@media only screen and (min-width: 481px){
.ramenfeature::before {
}}
.ramenfeature::before {
top: -20px;
background-position: left bottom;
background-image: url(http://ad110ji76j.smartrelease.jp/wp-content/uploads/product/ramennami.png);
}
.ramenfeature::before, .cmc_nav__wrp::after {
height: 20px;
background-size: auto 20px;
}
.ramenfeature::before {
top: -25px;
content: '';
width: 100%;
margin-left: auto;
margin-right: auto;
position: absolute;
right: 0;
left: 0;
background-repeat: repeat-x;
}
.img01{
z-index:100;
}
.img02{
z-index:2;
}
@media screen and (max-width: 1500px) {
#ramen01{
position:relative;
z-index: 100;
}
#ramen02{
position:relative;
left:10px;
margin-bottom:-260px;
top:-520px;
z-index: 2;
}
#ramen03{
position:relative;
right:-800px;
top:-700px;
margin-bottom:-400px;
z-index: 2;
}
#ramen04{
position:relative;
left:60px;
top:-270px;
margin-bottom:-300px;
z-index: 2;
}}
@media screen and (max-width: 768px)  {
#ramen01{
position:relative;
}
#ramen02{
position:relative;
width:180px;
height:180px;
left:10px;
margin-bottom:-260px;
top:-520px;
}
#ramen03{
position:relative;
width:180px;
height:180px;
right:-450px;
top:-700px;
margin-bottom:-400px;
}
#ramen04{
position:relative;
width:180px;
height:180px;
left:60px;
top:-270px;
margin-bottom:-300px;
}
}
@media screen and (max-width: 480px) {
#ramen01{
position:relative;
left:30px;
width:120px;
height:175px;
}
#ramen02{
position:relative;
left:-50px;
margin-bottom:-750px;
width:120px;
height:120px;
}
#ramen03{
position:relative;
left:200px;
margin-bottom:-950px;
width:120px;
height:120px;
}
#ramen04{
bottom:130px;
margin-bottom:-430px;
left:-70;
position:relative;
width:120px;
height:120px;
}
}
.btn-square-set {
display: inline-block;
padding: 0.5em 1em;
text-decoration: none;
background: #CC9933; color: #000000;
border-bottom: solid 4px #7F7F7F;
border-radius: 3px;
font-size:20px;
font-family: 'ヒラギノ明朝 ProN','Hiragino Mincho ProN','Yu Mincho Light','YuMincho','Yu Mincho','游明朝体',sans-serif;
}
.btn-square-set:active { -webkit-transform: translateY(4px);
transform: translateY(4px); border-bottom: none; } .top{
background-color:#910005;
} .pc{
display: block !important;
height: auto;
max-width: 100%;
text-align:center;}
.sp{ display: none !important; 
height: auto;
max-width: 100%;
text-align:center;} .koujinabemaralp h1 {
margin-top: 20px;
color:#000000;
padding: 0.25em 0.5em; background: transparent; border-left: solid 5px #ffd966 }
.koujinabemaralp h2 {
color: #000000;
font-size: 24px;
font-weight: 600;
}
.koujinabemaralp h3 {
color: #000000;
font-size: 20px;
font-weight: 600;
}
.koujinabemaralp h4 {
color: #000000;
font-size: 18px;
font-weight: 600;
}
.koujinabemaralp h5 {
color: #000000;
font-size: 14px;
font-weight: 600;
}
.koujinabemaralp h6 {
color: #000000;
font-size: 12px;
font-weight: 600;
}
.btn-square-soft-mara {
display: inline-block;
position: relative;
text-decoration: none;
color: #79892C;
width: 220px;
height: 50px;
line-height: 50px;
border-radius: 5px;
text-align: center;
overflow: hidden;
font-weight: bold;
background: linear-gradient(#D6C62C 0%, #D0C438 100%);
text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.66);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.28);
}
.btn-square-soft-mara:active { -webkit-transform: translateY(2px);
transform: translateY(2px); box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
background-image: linear-gradient(#D6C62C 0%, #D0C438 100%); } .btn-square-soft-mara input {
display: none;
} .btn-square-soft-mara .hidden_show {
height: 0;
padding: 0;
overflow: hidden;
opacity: 0;
transition: 0.8s;
} .btn-square-soft-mara input:checked ~ .hidden_show {
padding: 10px 0;
height: auto;
opacity: 1;
}
.btn-square-soft-yuzu {
display: inline-block;
position: relative;
text-decoration: none;
color: #785c12;
width:220px;
height: 50px;
line-height: 50px;
border-radius: 5px;
text-align: center;
overflow: hidden;
font-weight: bold;
background: linear-gradient(#E6B430 0%, #e0aa19 100%);
text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.66);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.28);
}
.btn-square-soft-yuzu:active { -webkit-transform: translateY(2px);
transform: translateY(2px); box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
background-image: linear-gradient(#E6B430 0%, #f2be33 100%); }
.btn-square-soft {
display: inline-block;
position: relative;
text-decoration: none;
color: #ab5f4d;
width: 220px;
height: 50px;
line-height: 50px;
border-radius: 5px;
text-align: center;
overflow: hidden;
font-weight: bold;
background: linear-gradient(#D6664C 0%, #eb694b 100%);
text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.66);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.28);
}
.btn-square-soft:active { -webkit-transform: translateY(2px);
transform: translateY(2px); box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
background-image: linear-gradient(#D6664C 0%, #eb694b 100%); }
.btn-container{
text-align:center;
}
.boxcorona {
padding: 0.5em 1em;
margin: 2em 0;
border: double 5px #de2b10;
}
.boxcorona p {
margin: 0; 
padding: 0;
}
.iframe-wrap {
position: relative;
width: 100%;
padding-top: 56.25%;
overflow:auto; 
-webkit-overflow-scrolling:touch;
border:2px solid #ccc; 
}
.iframe-wrap iframe {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
border:none;
display:block;
}
.sns_logo {font-size: 32px;} table.woman01 {
border-collapse: separate;
border-spacing: 0;
text-align: left;
line-height: 1.5;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
table.woman01 th {
width: 100px;
padding: 10px;
font-weight: bold;
vertical-align: top;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-top: 1px solid #fff;
border-left: 1px solid #fff;
background: #eee;
white-space: nowrap;
}
table.woman01 td {
padding: 10px;
vertical-align: top;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
text-align:right;
white-space: nowrap;
} .grecaptcha-badge{
margin-bottom: 50px;
} .movie h1 {
font-size: 30px;
text-align:center;
color:#222222;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
margin-top: 30px;
padding: 0.25em 0.5em; background: transparent; }
.movie h2 {
color:#222222;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 20px;
font-weight: 600;
}
.movie h3 {
color:#222222;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 15px;
font-weight: 600;
line-height: 3rem;
}
.movie p {
line-height: 2.5rem;
color:#222222;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 15px;
font-weight: 600;
}
.movie h4 {
text-align: center;
color: #fff;
line-height: 3.5rem;
letter-spacing: 0.3rem;
text-shadow: rgba(0,0,0,1) 0 1px 8px;
font-size: 1.8rem;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
margin-top: 120px;
padding: 0.5em; background: transparent; }
.movie h5{
width: 100%;
height: 48px;
position: absolute;
z-index: 1;
top: 90px;
}
.movie h6 {
text-align: center;
color: #fff;
line-height: 3.5rem;
letter-spacing: 0.3rem;
text-shadow: rgba(0,0,0,1) 0 1px 8px;
font-size: 2rem;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
margin-top: 30px;
padding: 0.5em; background: transparent; }
#name {font-size: 30px;
line-height: 2rem;
color:#222222;
text-align:center;
white-space: nowrap;
}
#casting {font-size: 18px;
line-height: 2rem;
color:#222222;
text-align:center;
} .hidden_box1 label {
display: inline-block;
padding: 0.5em 1em;
text-decoration: none;
background: #a8c1f7; color: #FFF;
border-bottom: solid 4px #9bb0de;
border-radius: 3px;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
} .hidden_box1 label:hover {
opacity: 0.6;
} .hidden_box1 input {
display: none;
} .hidden_box1 .hidden_show {
height: 0;
padding: 0;
overflow: hidden;
opacity: 0;
transition: 0.8s;
} .hidden_box1 input:checked ~ .hidden_show {
padding: 10px 0;
height: auto;
opacity: 1;
}
@media screen and (max-width: 768px)
#story .story_img { background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/story.jpg);
}
#story .story_img {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/story.jpg);
}
@media screen and (max-width: 768px)
.story_img {
height: 400px;
}
.story_img {
height: 500px;
background-position: center center;
background-size: cover;
position: relative;
}
@media screen and (max-width: 768px)
#cast .cast_img {    background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/credit.jpg);
}
#cast .cast_img {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/credit.jpg);
}
@media screen and (max-width: 768px)
.cast_img {
   height:300px;
}
.cast_img {
   height: 300px;
background-position: center center;
background-size: cover;
position: relative;
}
@media screen and(max-width:768px)
#staff .staff_img {
   background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/staffsp.jpg);
}
#staff .staff_img {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/staff.jpg);
}
@media screen and (max-width:768px)
.staff_img {
   height: 1000px;
}
.staff_img {
   height: 500px;
background-position: center center;
background-size: cover;
position: relative;
}
#credit .credit_img {background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/cast.jpg);}
@media screen and (max-width: 767px) {#credit .credit_img {background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/creditsp.jpg);}}
.credit_img {
height: 1000px;
background-position: center center;
background-size: cover;
position: relative;
}
@media screen and (max-width: 767px){.credit_img {height:2100px;}}
.sub_title {
width: 100%;
max-width: 800px;
left: calc(50% - 400px);
text-align: center;
color: #fff;
line-height: 2rem;
letter-spacing: 0.3rem;
text-shadow: rgba(0,0,0,1) 0 1px 12px;
font-size: 0.96rem;
font-weight: 700;
}
.movie-movie {
position: relative;
height: 0;
padding: 30px 0 56.25%;
overflow: hidden;
}
.movie-movie iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.youtube{position: absolute; top:0px; left:0px;z-index:15;}  .pc {
display: block !important;
}
@media only screen and (max-width: 768px) {
.pc {
display: none !important;
}
}  .sp {
display: block !important;
background-image:url(https://www.miyajima-soy.co.jp/wp-content/uploads/spback_1-scaled.jpg);
}
@media only screen and (min-width: 769px) {
.sp {
display: none !important;
}
}
#pc_link_Navi {
width:1000px;
height:200px;
font-weight:bold;
overflow:hidden;
margin:0;
padding:0;
background-color:#8C6239;
margin-left: auto;
margin-right: auto;
}
#pc_link_Navi.fixed {
position:fixed;
top:0px;
z-index:9999;
}
#pc_link_Navi ul{
list-style:none;
margin:0;
padding:0;
}
#pc_link_Navi ul li{
float:left;
list-style:none;
}
#pc_link_Navi a:hover img{
opacity: 0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha(opacity=70)";
}
.t-dm-set {
background-color:#231815;
width:1000px;
margin-left: auto;
margin-right: auto;
}
.tdmset03{ display: block;
height: auto;
max-width: 100%;
position: relative;
z-index:1;}
.tdmset03_1{position: absolute;
z-index:999;
left: 600px;
top: 475px;}
.tdmset04{ display: block;
height: auto;
max-width: 100%;
position: relative;
z-index:1;}
.tdmset04_1{position: absolute;
z-index:999;
left: 600px;
top: 510px;}
.tdmset05{ display: block;
height: auto;
max-width: 100%;
position: relative;
z-index:1;}
.tdmset05_1{position: absolute;
z-index:999;
left: 600px;
top: 550px;} p:empty:before {
content: initial!important;
}
.polaroids a {display: block; width: 200px;
height: 200px;
margin: 0 auto;
background: white; padding: 10px 10px 30px; -moz-box-shadow: 0 4px 10px #333; -webkit-box-shadow: 0 4px 10px #333;
box-shadow: 0 4px 10px #333;
} .recipe500 h1 {
font-size: 30px;
text-align:center;
color:#222222;
font-family: "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
margin-top: 30px;
padding: 0.25em 0.5em; font-weight: 700;
}
.recipe500 h2 {
color:#222222;
font-family: "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
font-size: 22px;
font-weight: 700;
line-height: 5rem;
}
.recipe500 h3 {
color:#222222;
font-family: "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
font-size: 15px;
font-weight: 600;
line-height: 3rem;
}
.recipe500 p {
line-height: 2.5rem;
color:#222222;
font-family: "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
font-size: 15px;
font-weight: 600;
}
.recipe500 h4 {
color:#222222;
font-family: "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
font-size: 22px;
font-weight: 700;
line-height: 4rem;
}
.recipe500 h5{
width: 100%;
height: 48px;
position: absolute;
z-index: 1;
top: 90px;
}
.recipe500 h6 {
text-align: center;
color: #fff;
line-height: 3.5rem;
letter-spacing: 0.3rem;
text-shadow: rgba(0,0,0,1) 0 1px 8px;
font-size: 2rem;
font-family: "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
margin-top: 30px;
padding: 0.5em; background: transparent; }
#recipe500{	
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/recipe/recipeback.png);
}
.commentbox {
position:relative;
}
.commentbox p {
position:absolute;
top: 80px;
left: 50px;
padding-left:50px;
padding-right:50px;
color:#222222;
font-family: "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
font-size: 18px;
font-weight: 700;
line-height: 3rem;}
.recipe500probox {
padding: 1em 1em;
margin: 1em 0;
background: #FFF;
border-radius: 5px; }
.sizurubox1 {
padding: 1em 1em;
margin: 1em 0;
background: #80C9BD;
}
.sizurubox2{
padding:1em 1em;
margin:1em 0;
background:#FF8357;
}
.sizurubox3{
padding:1em 1em;
margin:1em 0;
background:#F2B972;
}
.sizurubox4{
padding:1em 1em;
margin:1em 0;
background:#ADC966;
}
.sizurubox5{
padding:1em 1em;
margin:1em 0;
background:#f0e68c;
} .pc500 { display: block !important; }
.sp500 { display: none !important; } @media only screen and (max-width: 750px) {
.pc500 { display: none !important; }
.sp500 { display: block !important; }
} .low-salt-soysauce h1 {
font-size: 40px;
text-align:center;
color:#222222;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
margin-top: 30px;
padding: 0.25em 0.5em; background: transparent; }
.low-salt-soysauce h2 {
color:#222222;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 20px;
font-weight: 500;
}
#lineup{display:inline-block;
margin-left:auto;
margin-right:auto;
}
.low-salt-soysauce h3 {
color:#222222;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 20px;
font-weight: 600;
line-height: 3rem;
}
.low-salt-soysauce p {
line-height: 2.5rem;
color:#222222;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 15px;
font-weight: 600;
}
.low-salt-soysauce h4 {
text-align: center;
color: #fff;
line-height: 3.5rem;
letter-spacing: 0.3rem;
text-shadow: rgba(0,0,0,1) 0 1px 8px;
font-size: 1.8rem;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
margin-top: 120px;
padding: 0.5em; background: transparent; }
.low-salt-soysauce h5{
width: 100%;
height: 48px;
position: absolute;
z-index: 1;
top: 90px;
}
.low-salt-soysauce h6 {
text-align: center;
color: #fff;
line-height: 3.5rem;
letter-spacing: 0.3rem;
text-shadow: rgba(0,0,0,1) 0 1px 8px;
font-size: 2rem;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
margin-top: 30px;
padding: 0.5em; background: transparent; }
.bg-genen {
background-color: #edffbf;
padding: 10px;
opacity: 0.8;
border-radius: 5px;
} .movie2022 h2 {
font-size: 30px;
text-align:center;
color:#18468E;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
padding: 0.1em; background: transparent; }
.movie2022 h1 {
color:#18468E;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 20px;
font-weight: 600;
}
.movie2022 h3 {
color:#18468E;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 15px;
font-weight: 600;
line-height: 3rem;
}
.movie2022 p {
line-height: 2rem;
color:#18468E;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 13px;
font-weight: 600;
}
.movie2022 h4 {
text-align:center;
color: #18468E;
line-height: 3.5rem;
letter-spacing: 0.3rem;
   text-shadow: rgba(0,0,0,1) 0 1px 3px;
font-size: 1.8rem;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
margin-top: 120px;
padding: 0.5em; background: transparent; }
.movie2022 h5{
width: 100%;
height: 48px;
position: absolute;
z-index: 1;
top: 90px;
}
.movie2022 h6 {
color:#18468E;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 20px;
font-weight: 600;
}
#name2022 {font-size: 30px;
line-height: 2rem;
color:#18468E;
text-align:center;
white-space: nowrap;
}
#casting2022 {font-size: 18px;
line-height: 2rem;
color:#18468E;
text-align:center;
} .hidden_box1 label {
display: inline-block;
padding: 0.5em 1em;
text-decoration: none;
background: #a8c1f7; color: #FFF;
border-bottom: solid 4px #9bb0de;
border-radius: 3px;
font-family: "游明朝","YuMincho","ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
} .hidden_box1 label:hover {
opacity: 0.6;
} .hidden_box1 input {
display: none;
} .hidden_box1 .hidden_show {
height: 0;
padding: 0;
overflow: hidden;
opacity: 0;
transition: 0.8s;
} .hidden_box1 input:checked ~ .hidden_show {
padding: 10px 0;
height: auto;
opacity: 1;
}
@media screen and (max-width: 768px)
#story2022 .story_img { background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/story2022.jpg);
}
#story2022 .story_img {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/story2022.jpg);
}
@media screen and (max-width: 768px)
.story_img {
   height: 300px;
}
.story_img {
   height: 300px;
background-position: center center;
background-size: cover;
position: relative;
}
@media screen and (max-width: 768px)
#recipe2022 .recipe_img { background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/recipe2022.jpg);
}
#recipe2022 .recipe_img {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/recipe2022.jpg);
}
@media screen and (max-width: 768px)
.recipe_img {
height: 250px;
}
.recipe_img {
height: 250px;
background-position: center center;
background-size: cover;
position: relative;
}
@media screen and (max-width: 768px)
#cast2022 .cast_img {    background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/cast2022.jpg);
}
#cast2022 .cast_img {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/cast2022.jpg);
}
@media screen and (max-width: 768px)
.cast_img {
   height:300px;
}
.cast_img {
   height: 300px;
background-position: center center;
background-size: cover;
position: relative;
}
@media screen and(max-width:768px)
#staff2022 .staff_img {
   background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/staff2022.jpg);
}
#staff2022 .staff_img {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/staff2022.jpg);
}
@media screen and (max-width:768px)
.staff_img {
   height: 1000px;
}
.staff_img {
   height: 500px;
background-position: center center;
background-size: cover;
position: relative;
}
#credit2022 .credit_img {background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/credit2022.jpg);}
@media screen and (max-width: 767px) {#credit2022 .credit_img {background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/movie/credit2022.jpg);}}
.credit_img {
height: 1500px;
background-position: center center;
background-size: cover;
position: relative;
}
@media screen and (max-width: 767px){.credit_img {height:2100px;}}
.sub_title {
width: 100%;
max-width: 800px;
left: calc(50% - 400px);
text-align: center;
color: #fff;
line-height: 2rem;
letter-spacing: 0.3rem;
text-shadow: rgba(0,0,0,1) 0 1px 12px;
font-size: 0.96rem;
font-weight: 700;
}
.movie-movie2022 {
position: relative;
height: 0;
padding: 30px 0 56.25%;
overflow: hidden;
}
.movie-movie2022 iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.youtube{position: absolute; top:0px; left:0px; z-index:15;}
.gallary {background-color:#18468E;
}
@media screen and (max-width: 768px)
#gallery2022 .gallery2022_img {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/FUN/moviegallery_tops.jpg);
}
#gallery2022 .gallery2022_img {
background-image: url(https://www.miyajima-soy.co.jp/wp-content/uploads/FUN/moviegallery_top.jpg);
}
@media screen and (max-width: 768px)
.gallery2022_img {
   height: 300px;
background-position: center center;
background-size: cover;
position: relative;
}
.gallery_gallery {background-color:#e6e6fa;
} @media screen and (max-width: 640px) { .h1.sp-small{
       font-size:16px;
}
} .wagayarecipe h4 {
color:#595655;
}
.wagayarecipe p {
color:#595655;
}
.wagayarecipe h2 {
color:#595655;
}
.wagayarecipe li {
color:#595655;
} @media screen and (max-width: 768px){
.mysoysaucetop_img : url(https://www.miyajima-soy.co.jp/wp-content/uploads/product/mysoysaucetop_sp.jpg);
}
.mysoysauce p {
line-height: 2rem;
color:#363434;
font-family: font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
font-size: 15px;
font-weight:400;
}
.mysoysauce h6 {
line-height: 2rem;
color:#363434;
font-family: font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
font-size: 12px;
font-weight:150;
}
table.gaiyo1 {
width: 100%;
border-collapse: collapse;
text-align: left;
line-height: 1.5;
margin-bottom: 20px;
color:#191919;
font-family: font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
}
table.gaiyo1 td {
width: 150px;
padding: 5px;
vertical-align: top;
border: 1px solid #ece8e0;
background-color:#ffffff;
}
table.gaiyo1 th {
width: 80px;
padding: 5px;
vertical-align: top;
border: 1px solid #ece8e0;
background-color:#f2f1ed;
}
table.material1 {
color:#191919;
font-family: font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
width: 100%;
border-collapse: collapse;
text-align: left;
line-height: 1.5;
}
table.material1 td {
width: 150px;
padding: 5px;
vertical-align: top;
border: 1px solid #ece8e0;
background-color: #ffffff;
}
table.material1 th {
vertical-align:middle;
width: 80px;
padding: 5px;
border: 1px solid #ece8e0;
background-color: #f2f1ed;
} .recipe_akajisi {
color: #4b413c;
background-color: #FFFFFF;
}
.recipe_akajisi p {
color: #4b413c;
font-size: 16px;
font-weight: 400;
}
.recipe_akajisi h1 {
margin-top: 20px;
color: #4b413c;
padding: 0.25em 0.5em; background: transparent; border-left: solid 5px #CC4D3F; }
.recipe_akajisi h3 {
color: #4b413c;
font-size: 20px;
font-weight: 600;
}
.recipe_akajisi h4 {
color: #4b413c;
font-size: 18px;
font-weight: 600;
}
.recipe_akajisi h5 {
color: #4b413c;
font-size: 14px;
font-weight: 600;
}
.recipe_akajisi h6 {
color: #4b413c;
font-size: 12px;
font-weight: 600;
}
.recipe_akajisi .box {
padding: 1.5em 1em;
margin: 2em 0;
background: #FFF;
border: solid 2px #CC4D3F; border-radius: 10px; }
.group {
list-style-type: none;
padding-left: 1em;
}
.btn-4 {
margin-right: 4px;
margin-bottom: 4px;
font-family: YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 16px;
font-weight: 400;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
border-radius: 4px;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
}
.btn-4 {
border: 0;
}
.btn-4.bold {
font-weight: 600;
}
.btn-4-cta {
color: #ffffff;
border-bottom: 4px solid;
}
.btn-4-cta:hover {
color: #ffffff;
}
.btn-4-cta.btn-lg {
border-bottom: 4px solid;
}
.btn-4-akajisi {
background: #CC4D3F;
color: #fff;
border: 3px solid #CC4D3F;
margin: 0; 
padding: 0;
}
.aka-index {
background-color: #E6E6E6;
border-radius: 10px;
} .recipe_aojisi {
color: #4b413c;
background-color: #FFFFFF;
}
.recipe_aojisi p {
color: #4b413c;
font-size: 16px;
font-weight: 400;
}
.recipe_aojisi h1 {
margin-top: 20px;
color: #4b413c;
padding: 0.25em 0.5em; background: transparent; border-left: solid 5px #5DAB32; }
.recipe_aojisi h3 {
color: #4b413c;
font-size: 20px;
font-weight: 600;
}
.recipe_aojisi h4 {
color: #4b413c;
font-size: 18px;
font-weight: 600;
}
.recipe_aojisi h5 {
color: #4b413c;
font-size: 14px;
font-weight: 600;
}
.recipe_aojisi h6 {
color: #4b413c;
font-size: 12px;
font-weight: 600;
}
.recipe_aojisi .box {
padding: 1.5em 1em;
margin: 2em 0;
background: #FFF;
border: solid 2px #5DAB32; border-radius: 10px; }
.group {
list-style-type: none;
padding-left: 1em;
}
.btn-4 {
margin-right: 4px;
margin-bottom: 4px;
font-family: YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
font-size: 16px;
font-weight: 400;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
border-radius: 4px;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
}
.btn-4 {
border: 0;
}
.btn-4.bold {
font-weight: 600;
}
.btn-4-cta {
color: #ffffff;
border-bottom: 4px solid;
}
.btn-4-cta:hover {
color: #ffffff;
}
.btn-4-cta.btn-lg {
border-bottom: 4px solid;
}
.btn-4-aojisi {
background: #5DAB32;
color: #fff;
border: 3px solid #5DAB32;
margin: 0; 
padding: 0;
}
.ao-index {
background-color: #E6E6E6;
border-radius: 10px;
}
.productbox {
padding: 0.5em 0.5em;
margin: 1em 2em;
font-weight: bold;
border: solid 1px #8f8f8f;
}
.productbox p {
margin: 0; 
padding: 0;
}